/****************************************** * Media Queries (Responsive Design) *******************************************/ /* WARNING! DO NOT EDIT THIS FILE! To make it easy to update your theme, you should not edit the styles in this file. Instead use the custom.css file to add your styles. You can copy a style from this file and paste it in custom.css and it will override the style in this file. */ /* Large Screens */ @media screen and (max-width: 1115px) { .adv_slider img{ width: 100%; } .inner-wrap, #header, #copyright { width: 96%; } .container { width: 94%; padding: 1% 1% 0; } /* .adv { display: none; } .adv_side { display: none; } .adv_slider { display: none; }*/ .featured-post { width: 21.8%; margin: 0 1% 10px 0; padding: 1%; } .featured-post p { display: none; } #main { width: 69%; } .sidebar-alt { width: 30%; } .featured-separator { width: 2%; } #slider { width: 68%; } #slider img { max-width: 100%; height: auto; } .left-col { width: 42%; margin: 0; padding: 2% 0 2% 2%; border: none; } .left-col img { max-width: 100%; height: auto; } .right-col { width: 50%; margin: 0; padding: 2% 2% 2% 0; border: none; } .right-col li { padding: 0 0 20px; } #sidebar { width: 30%; } #sidebar .left-col { width: auto; float: none; margin: 0 0 20px; padding: 20px 3% 0; border-bottom: 1px solid #D9E0E6; border-right: none; } #sidebar .right-col { width: auto; float: none; margin: 0; padding: 0 3% 20px; border-left: none; } .video_cover { position: relative; padding-bottom: 56.25%; display: block; padding-top: 30px; height: 0; overflow: hidden; width: 100%; max-width: 100%; } .video_cover iframe, .video_cover object, .video_cover embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .single-area { width: 69%; } #comments .commentlist li #respond input { width: 94%; } #comments .commentlist li #respond textarea { width: 94%; } #comments .commentlist li #respond p.form-submit input { width: auto; } .fb_iframe_widget { width: 100%!important } .fb_iframe_widget span { width: 100%!important; } .fb_iframe_widget span iframe { width: 100%!important; } .widget img, .adv_side img { max-width: 100%; height: auto; } ul.tabbernav li a { font-size: 10px; } #footer div.column { width: 24%; margin-right: 1%; } #copyright .inner-wrap { padding: 2% 2% 3%; } } /* Tablets */ @media screen and (max-width: 768px) { #header{ width: 100%; } .adv { display: none; } .adv_side { display: none; } .adv_slider { display: none; } #sidebar-ad-before { display: none;} #main { width: 100%; } #sidebar { width: 100%; } .adv_top { display: none; } .featured-post h3 { font-size: 12px; } .featured-post p { display: inline; } .featured-post { width: 45.5%; margin: 0 1% 10px; padding: 1%; } .single-area { width: 100%; } #slider #slidemain .slide_content h2 { font-size: 20px; } .archiveposts h2 { font-size: 18px; } h1.title { font-size: 24px; } #header { position: relative; } .btn_menu { display: block; float: left; cursor: pointer; background: #237FBE url('images/menu.png') 8px 9px no-repeat; padding: 5px 5px 0; width: 30px; height: 30px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; margin: 5px; } #menu-wrap { margin: 0 15px; } #menu .dropdown .sub-menu li { border: none; } #menu .dropdown .sub-menu { border: none; } #menutop .btn_menu { background-color: #1F394D; } .mobile-menu { display: none; clear: both; } .dropdown li { display: block; float: none; } #menu .dropdown > li:after { display: none; } .dropdown a { padding-left: 10px; display: block; } .dropdown .sub-menu { -webkit-box-shadow: none; box-shadow: none; background: none; margin-left: 10px; display: block !important; position: relative; visibility: inherit !important; top: 0; width: auto; border: none; } .dropdown .sub-menu .sub-menu { -webkit-box-shadow: none; box-shadow: none; background: none; margin-left: 10px; display: block !important; position: relative; visibility: inherit !important; top: 0; width: auto; border: none; } .dropdown li:hover .sub-menu .sub-menu { top: 0; left: 0; border: none; -webkit-box-shadow: none; box-shadow: none; background: none; } #mainmenu { width: 100%; } #menu #mainmenu > li > a { border: none; padding-left: 0; } #menu #mainmenu > li > a:before { display: none; } #menutop .dropdown > li:after { display: none; } .dropdown .sub-menu li { border: none; } .dropdown a { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .dropdown a:hover { } .dropdown li ul li { border: none; } .dropdown li ul li a { } .dropdown li:hover li a:hover { } .dropdown li:hover a { } .dropdown li:hover ul a { background: none; } .dropdown > li > a:hover { margin-top: 0; } .dropdown > li > a:after { display: none; } .dropdown > li > a:hover { margin-top: 0; } .dropdown > li:hover { margin-top: 0; } .dropdown > li:hover > a { margin-top: 0; } .dropdown ul { background: none; } .dropdown li:hover ul, .dropdown li.sfHover ul { left: 0; top: 0; z-index: 99; background: none; } ul.dropdown li:hover li ul, ul.dropdown li.sfHover li ul { top: 0; } ul.dropdown li li:hover ul, ul.dropdown li li.sfHover ul { left: 0; top: 0; } ul.dropdown li li:hover li ul, ul.dropdown li li.sfHover li ul { top: 0; } ul.dropdown li li li:hover ul, ul.dropdown li li li.sfHover ul { left: 0; top: 0; } #logo img { max-width: 100%; height: auto; } #footer div.column { width: 48%; margin-right: 1%; float: none; vertical-align: top; display: inline-block; } } /* All Mobile Sizes (devices and browser) */ @media screen and (max-width: 640px) { #header #searchform { display: none; } .featured-grid {display: none; } .sidebar-alt { display: none; } .left-col { width: 96%; margin:2%; padding:0; } .right-col { width: 96%; margin:2%; padding:0; } .archiveposts .post-thumb { float: none; margin:0 0 20px; } .archiveposts .post-content { overflow: visible; } #slider { width: 100%; } .featured-separator { display: none; } #logo { float:left; display: block; width: 97%; } #respond .form_fields { width:97%; margin:0; } #respond input, #respond textarea { width: 92%; } #respond .comment-form-comment {width:99%; } #respond .form_fields input { width:94%; } .children #respond { margin-right:0; } #footer div.column { width: 100%; margin-right:0; float:none; vertical-align: top; display: inline-block;} #slider #slidemain .cover, #slider #slidemain .video_cover { margin: 0; text-align: center; } #copyright span { float:left; } }