/* CSS Document */ @media screen and (max-width: 980px) { header .hd-inner-upper { width:98% !important;} #content{ width:100%;} #content .cn-left { width:635px !important;} #content .cn-right { left:0 !important; width:325px !important; padding:20px 0 0 0 !important;} #content .content-left,#content .content-left-alternate { width:620px;} #content .bordered-heading { width:95% !important;} #content .content-left ol { margin:0; padding:0 0 0 15px;} #content .content-left ol li { width:600px !important;} #content .content-left ul.cn-left-alternate-list-fourth { width:300px !important; padding:0 0 0 10px !important;} #content .content-left ul.cn-left-alternate-list-fourth li { text-align:left !important; font-size:16px !important; line-height:188% !important; color:#FFF !important; border:0 !important;} #content .content-left .list-img li { padding:0 3px 0 0 !important;} nav ul li a { width:103px !important;} nav ul li a#wider-nav1,nav ul li a#wider-nav2 { width:170px !important;} } /*Styles for screen 800px and lower*/ @media screen and (max-width: 800px) { header .hd-inner-upper { width:95% !important;} header h6.inner-pages-logo { float:none; text-align:center !important; width:100% !important;} header h5 { float:none; text-align:center !important; width:100% !important;} aside{ width:100%;} #content{ width:100%;} #content .content-left h1 { width:95% !important; text-align:center; padding:0 !important;} #content .cn-left { width:100% !important;} #content .cn-left dl dt { padding:0 !important;} #content .cn-right { left:0 !important; width:100% !important; padding:20px 0 0 0 !important;} #content .cn-right h6 { top:0; left:0 !important; width:100% !important;} #content .cn-right .youtube { margin:0 auto !important;} #content .content-left,#content .content-right,#content .content-left-alternate,#content .content-right-alternate { width:100% !important;} #content .content-left ul { padding:0 !important;} #content .content-left ul li { width:95% !important; margin:0 auto !important; text-align:center !important;} #content .content-left ul.cn-left-alternate-list li span { display:none;} #content .content-right dl { text-align:center; padding-top:20px;} #content .content-right ul li { width:95% !important; margin:0 auto !important; text-align:center;} #content .content-left ul.cn-left-alternate-list-fourth { float:left; width:317px !important; padding:0 0 0 10px !important;} #content .content-left ul.cn-left-alternate-list-fourth li { text-align:left !important; font-size:16px !important; line-height:188% !important; color:#FFF !important; border:0 !important;} nav { display:block; height: auto;} nav ul { width: 100%; display: none; height: auto;} nav li { width: 100%; float: left; position: relative;} nav li a { border-right:0 !important; border-left:0 !important; border: 2px solid #A1732C; background:#283744; padding:5px 0 5px !important;} nav ul li a,nav ul li a#wider-nav1,nav ul li a#wider-nav2 { width:100% !important;} nav li a:hover,nav li a.active-menu { background:#FFF; color:#A1732C;} nav a { width:100% !important;} nav a#pull { display:block; background:#283744; width:100%; position:relative;} nav a#pull:hover { background:283744 !important;} nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat;width: 30px;height: 30px;display: inline-block; position: absolute; right: 15px;top: 5px;} } @media screen and (max-width: 600px) { } /*Styles for screen 515px and lower*/ @media only screen and (max-width : 480px) { } /*Smartphone*/ @media only screen and (max-width : 320px) { } @media screen and (max-width: 1207px){ } @media screen and (max-width: 1024px) { nav { display:block;height: auto;} } @media screen and (max-width: 700px) { nav { display:none; height: auto;} nav a#pull {display: block !important; background-color: #283744; width: 100%;position: relative; } nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat;width: 30px;height: 30px;display: inline-block; position: absolute; right: 15px;top: 10px; } } /*Styles for screen 600px and lower*/ @media screen and (width: 600px) { nav { display:block; height: auto;} nav ul { width: 100%; display: block; height: auto;} nav li { width: 100%; float: left; position: relative;} nav li a { border-bottom: 1px solid #576979; border-right: 1px solid #576979;} nav a { text-align: left; width: 100%; text-indent: 25px; } nav a#pull { display: block; background-color: #283744; width: 100%;position: relative;} nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat;width: 30px;height: 30px;display: inline-block; position: absolute; right: 15px;top: 10px; } } @media screen and (max-width: 768px) { #content .cn-left dl dd { width:100% !important;} #content .content-left .wider-linked-left { margin-left:20px;} nav { display:block; height: auto;} nav ul { width: 100%; display: block; height: auto;} nav li { width: 100%; float: left; position: relative;} nav li a { border-right:0 !important; border-left:0 !important; border: 2px solid #A1732C; background:#283744; padding:5px 0 5px !important;} nav li a:hover,nav li a.active-menu { background:#FFF; color:#A1732C;} nav a { width:100% !important;} nav a#pull { display:block; background:#283744; width:100%; position:relative;} nav a#pull:hover { background:283744 !important;} nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat;width: 30px;height: 30px;display: inline-block; position: absolute; right: 15px;top: 5px;} } /*Styles for screen 515px and lower*/ @media only screen and (max-width : 480px) { #content h3 { width:90%; padding:0 0 0 10px !important;} #content .cn-left dl { min-height:100% !important;} #content .cn-left dl dd { position:static !important; font-size:25px !important;} #content .cn-right h6 { font-size:20px !important;} nav { border-bottom: 0;} nav ul { display:none; height:auto;} nav a#pull { display:block; background:#283744; width:100%; position:relative;} nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat; width:30px; height:30px; display:inline-block; position:absolute; right:15px; top:5px; } } @media only screen and (max-width : 640px) { nav li { display: block; float: none;width: 100%;} #content .cn-right .youtube { width:95% !important;} #content .content-left iframe { width:95% !important; margin:0 auto !important;} #content .content-left ul.cn-left-alternate-list-fourth { padding-bottom:30px !important;} #content .content-left-alternate ul.cn-left-alternate-list-fourth { padding-bottom:30px !important;} #content .content-left .list-img li { float:none !important; display:block; text-align:center;} #content .content-left ol { padding:0 !important;} #content .content-left ol li { width:95% !important; margin:0 auto !important;} #content .content-left ol li small { float:none !important; width:auto !important;} #content .content-left h4 { float:none !important; width:95% !important; font-size:18px; margin:0 auto !important; padding-top:10px !important; height:30px !important;} #content .content-left .wider-linked,#content .content-left .small-linked,#content .content-left .wider-linked-left { width:50% !important;} #content p .presenters-text { padding-top:20px !important;} #content .cn-form { width:95% !important;} #ft-wrapper { background:url(../images/ft-wrapper-small.jpg) repeat-x center top #0F001F;} footer p { padding:5px 0 0 !important; border-bottom:5px solid #A2742C;} footer p a { display:block; padding:5px 0 5px;} footer p a:hover,footer p a.active-menu { background:#FFF; color:#CCA758 !important;} footer p span { display:none;} footer h6 { padding-top:10px !important;} .vload img { width:100% !important; height:100% !important;} } @media only screen and (max-width : 360px) { #content .cn-form .floated-radio { float:none !important; padding:0 !important;} #content .cn-form .floated-radio input[type=radio] { margin-right:15px !important;} nav li { display:block; float:none; width: 100%;} nav li a { border-bottom: 1px solid #576979;} #content .content-left .wider-linked,#content .content-left .small-linked,#content .content-left .wider-linked-left { width:95% !important;} #content .content-left .wider-linked { font-size:18px !important; padding-top:10px !important; height:30px !important;} #content .content-left .small-linked { font-size:24px !important; padding-top:6px !important; height:34px !important;} #content .content-left .wider-linked-left { font-size:20px !important; height:30px !important; padding-top:10px !important;} } /*Smartphone*/ @media only screen and (max-width : 320px) { #content .content-left ul.cn-left-alternate-list-fourth { width:95% !important;} #content .content-left-alternate ul.cn-left-alternate-list-fourth { width:90% !important; padding-left:0 !important;} nav li { display: block; float: none;width: 100%;} nav li a { border-bottom:1px solid #576979;} } @media only screen and (max-width : 240px) { #content h3 { padding:0 !important;} #content .content-left h4 { font-size:13px !important; padding-top:13px !important; height:27px !important;} #content .content-right h5 small img { width:93% !important;} #content .cn-form input[type=submit] { width:95% !important; font-size:15px; height:37px; padding-top:3px;} }