#header-search { display: block; } #header-mobile-menu { float: right; display: none; } #secondary-mobile-menu { display: none; } .mobile-menu-bar { color: #757575; display: block; height: 20px; padding: 5px; text-align: center; width: 20px; } .mobile-menu-bar:hover { color: #7c9b30; } .fixed-header .mobile-menu-bar:before { top: -6px; } .mobile-menu { position: fixed; left: 0; top: 40px; padding: 5%; background: #fff; width: 90%; visibility: visible; opacity: 1; overflow-x: scroll; display: none; z-index: 9999; border-top: 3px solid #7c9b30; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); bottom: 0; } .admin-bar .mobile-menu { top: 71px; } .mobile-menu li a { font-size: 14px; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; border-bottom: 1px solid #f8f8f8; color: #666; padding: 10px 5%; width: 90%; display: block; } .mobile-menu li a:hover { color: #111; background-color: #f8f8f8; text-decoration: none; } .mobile-menu li ul { display: block !important; padding-left: 10px; visibility: visible !important; } .mobile-menu li li { padding-left: 5%; } .mobile-menu .menu-item-has-children > a { font-weight: bold; } /* =Screen Size Max 1344px -------------------------------------------------------------- */ @media screen and (max-width: 1344px) { .container { width: 1160px; } #primary { width: 770px; } } /* =Screen Size Max 1280px -------------------------------------------------------------- */ @media screen and (max-width: 1280px) { .container { width: 1080px; } #primary { width: 810px; } #secondary-menu ul.menu { width: 780px; } } /* =Screen Size Max 1152px -------------------------------------------------------------- */ @media screen and (max-width: 1152px) { .container { width: 960px; } #primary { width: 570px; } } /* =Screen Size Max 1024px -------------------------------------------------------------- */ @media screen and (max-width: 1024px) { .container { width: 920px; } #primary { width: 530px; } #secondary-menu ul.menu a { line-height: 40px; padding: 0 10px; } .header-sidebar .widget ul.menu ul, #secondary-menu ul.menu ul { top: 40px; width: 188px; } .header-sidebar .widget ul.menu ul a, #secondary-menu ul.menu ul a { padding: 5px 10px; } /* Font Sizes */ body, button, input, select, textarea, #homepage-message p { font-size: 13px; } #site-title, #slider-nav .slide-previous:before, #slider-nav .slide-next:before { font-size: 22px; } #main-slider .entry-header .entry-title, .entry-header .entry-title, #featured-heading h2, #homepage-message .right-section a, #featured-post #feature-heading, .comments-title, #reply-title, .entry-content h2, .comment-content h2 { font-size: 18px; } #homepage-message h2, .widget-title { font-size: 16px; } .entry-content h1, .comment-content h1 { font-size: 22px; } .entry-content h3, .comment-content h3 { font-size: 16px; } .entry-content h4, .comment-content h4 { font-size: 15px; } #main-slider .entry-content, .entry-content h5, .comment-content h5 { font-size: 14px; } .entry-content h6, .comment-content h6 { font-size: 13px; } #homepage-message .right-section a { padding: 5px 20px; } } /* =iPad Landscape -------------------------------------------------------------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { /*@media screen and (max-width: 1000px) { */ .container { width: 960px; } #primary { width: 570px; } } /* =Screen Size Max 980px -------------------------------------------------------------- */ @media screen and (max-width: 980px) { .container { width: 720px; } #primary, #site-generator .copyright, #site-generator .powered { width: 100%; } #header-right .widget { display: none; } #homepage-message .left-section { width: 540px; } #masthead.fixed-header #header-left { padding-bottom: 0; } #homepage-message .right-section { width: 150px; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap{ margin-left: -30px; } #featured-post.layout-four .post, #featured-post.layout-three .post { margin-left: 30px; width: 345px; } #featured-post.layout-four .post:nth-child(2n+1), #featured-post.layout-three .post:nth-child(2n+1), #secondary .widget:nth-child(2n+1) { clear: both; } #featured-post.layout-three .post:nth-child(3n+1) { clear: none; } #primary { border-bottom: 1px solid #eee; margin-bottom: 30px; } #secondary { margin-left: -30px; width: 750px; } #secondary .widget { display: inline; float: left; margin-left: 30px; padding: 20px; width: 305px; } #secondary .widget.widget_adventurous_social_widget { padding: 10px 11px 5px; } #site-generator .powered { padding-top: 5px; } #hgroup-wrap img { display: inline-block; } #header-right, .fixed-header #header-right { padding-top: 0; } .header-sidebar .menu, .header-sidebar .widget_text { float: none; text-align: center; } #header-right #header-search-widget { padding: 0; } #supplementary.four .widget-area { width: 48%; margin-left: 4%; } #supplementary.four #third.widget-area { clear: both; margin-left: 0; } #site-generator .site-info { font-size: 12px; padding: 20px 0; } #site-generator .copyright, #site-generator .powered { text-align: center; } #masthead, #masthead.fixed-header { padding-top: 6px; padding-bottom: 4px; min-height: 29px; } #header-left { padding-bottom: 0; } #site-title, #masthead.fixed-header #site-title { font-size: 16px; line-height: 1.1; } #site-description, #masthead.fixed-header #site-description{ font-size: 11px; line-height: 1; } #masthead #site-logo img, #masthead.fixed-header #site-logo img { max-height: 28px; max-width: 100%; } #header-left { width: 85%; } #header-right { width: 15%; } #header-right .header-search-wrap, .fixed-header #header-right .header-search-wrap { top: 33px; } .fixed-header #hgroup.logo-enable { display: none; } #header-search { padding: 5px 0; } /* Menu */ #header-mobile-menu { display: block; } #secondary-mobile-menu { display: inline-block; float: left; margin-right: 5px; } #header-right .widget_nav_menu, #secondary-menu { display: none; } .header-sidebar .widget.widget_nav_menu { width: 100%; } .widget.widget_nav_menu .sb-holder { background-color: #21759b; color: #fff; clear: both; display: block; width: 100%; } .widget.widget_nav_menu .sb-holder a, .widget.widget_nav_menu .sb-holder a:hover { color: #fff; } a#scrollup { font-size: 20px; padding: 3px; } } /* =iPad Portrait -------------------------------------------------------------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { .container { width: 710px; } #homepage-message .left-section { width: 550px; } .featued-content-wrap, #secondary { width: 740px; } #featured-post.layout-four .post, #featured-post.layout-three .post { width: 340px; } #secondary .widget { padding: 20px; width: 300px; } #secondary-menu ul.menu { width: 780px; } } /* =Screen Size Max 782px -------------------------------------------------------------- */ @media screen and (max-width:782px) { .admin-bar #masthead.fixed-header { top: 46px; } .admin-bar .mobile-menu { top: 85px; } } /* =Screen Size Max 767px -------------------------------------------------------------- */ @media screen and (max-width: 767px) { .container { width: 600px; } #featured-post, #content-sidebar, #footer-sidebar { padding-top: 20px; } #content article, #secondary .widget, #comments { padding: 20px; } .hentry, .comments-area article, #homepage-message { padding-bottom: 20px; } #homepage-message { padding: 20px 0; } #main-slider .entry-header .entry-title { font-size: 16px; font-weight: normal; } #main-slider .entry-container .entry-content { display: none; } #homepage-message .left-section { width: 430px; } #featured-post { padding-bottom: 0; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap { margin-left: -20px; width: 620px; } #featured-post.layout-four .post, #featured-post.layout-three .post { margin-left: 20px; width: 290px; } #featured-heading { padding-bottom: 10px; width: 90%; } #primary, .page-links, .widget, blockquote, #content article, #content .site-navigation, #content .author-info, #infinite-handle, #comments, .hentry.sticky .featured-sticky, .page-header, .entry-header, p, .featured-image, .entry-content table, .comment-content table, #content .searchform, .page-link, .single-attachment .entry-attachment img, #reply-title, .comments-title, .mejs-container, .breadcrumb { margin-bottom: 20px; } #secondary { margin-left: -20px; width: 620px; } #secondary .widget { margin-left: 20px; width: 250px; } #content .hentry, #secondary .widget, #comments { padding: 20px; } #main-slider .entry-header { margin-bottom: 0; } #slider-nav a { font-size: 18px; line-height: 1.4; padding: 0 5px; } .entry-header .entry-title, #homepage-message, .comments-title, #reply-title { font-size: 16px; } .commentlist .children { margin-left: 0; } .woocommerce #content ul.products li { margin-right: 0; width: 100%; } .woocommerce #content .product a.added_to_cart { clear: both; display: block; } #main .woocommerce .col-1, #main .woocommerce .col-2 { width: 100%; } } /* =Screen Size Max 640px -------------------------------------------------------------- */ @media screen and (max-width: 640px) { .container { width: 520px; } #hgroup.logo-enable { display: none; } #homepage-message .left-section { width: 360px; } #homepage-message .right-section { width: 140px; } #homepage-message .right-section a { display: inline-block; margin: 0 auto; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap, #secondary { width: 540px; } #featured-post.layout-four .post, #featured-post.layout-three .post { width: 250px; } #secondary .widget { width: 210px; } .entry-header .entry-title, #homepage-message h2, #homepage-message .right-section a, #featured-post #feature-heading { font-size: 16px; } #secondary-menu ul.menu { width: 680px; } } /* =Screen Size Max 600px -------------------------------------------------------------- */ @media screen and (max-width:600px) { .admin-bar #masthead.fixed-header { top: 0; } .admin-bar #masthead.fixed-header .mobile-menu { top: 40px; } } /* =Screen Size Max 560px -------------------------------------------------------------- */ @media screen and (max-width: 560px) { .container { width: 400px; } #homepage-message .left-section, #homepage-message .right-section { width: 100%; } #homepage-message .left-section, #homepage-message .left-section h2 { padding-bottom: 10px; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap, #featured-post.layout-four .post, #featured-post.layout-three .post, #secondary { margin-left: 0; width: 100%; } #secondary .widget { margin-left: 0; padding: 10px 4%; width: 91%; } #secondary-menu ul.menu { width: 580px; } } /* =iPhone 5 in landscape -------------------------------------------------------------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) { .container { width: 520px; } #homepage-message .left-section { padding: 0; width: 390px; } #homepage-message .right-section { width: 110px; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap, #secondary { margin-left: -20px; width: 540px; } #featured-post.layout-four .post, #featured-post.layout-three .post { margin-left: 20px; width: 250px; } #secondary .widget { margin-left: 20px; padding: 20px; width: 210px; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], textarea { padding: 10px; width: 90%; } } /* =Screen Size Max 480px -------------------------------------------------------------- */ @media screen and (max-width: 480px) { .container { width: 400px; } #header-left { width: 80%; } #header-right { width: 20%; } #homepage-message .left-section, #homepage-message .right-section { width: 100%; } #homepage-message .left-section, #homepage-message .left-section h2 { padding-bottom: 10px; } #featured-post.layout-four .featued-content-wrap, #featured-post.layout-three .featued-content-wrap, #featured-post.layout-four .post, #featured-post.layout-three .post, #secondary { margin-left: 0; width: 100%; } #secondary .widget { margin-left: 0; padding: 10px 4%; width: 91%; } #header-left { width: 82%; } #header-right { width: 18%; } #slider-nav .slide-previous:before, #slider-nav .slide-next:before { font-size: 16px; } #footer-sidebar #supplementary .widget-area { width: 100%; margin-right: 0; } } /* =Screen Size Max 479px -------------------------------------------------------------- */ @media screen and (max-width: 479px) { .container { width: 360px; } } /* =Screen Size Max 400px -------------------------------------------------------------- */ @media screen and (max-width: 400px) { .container { width: 320px; } } /* =Screen Size Max 360px -------------------------------------------------------------- */ @media screen and (max-width: 360px) { .container { width: 94%; } #header-left { width: 75%; } #header-right { width: 25%; } }