/* =RESPONSIVE STRUCTURE ----------------------------------------------- */ @media screen and (min-width: 1500px) { .wide-978 #featured-slider .entry-container { left: 17.6%; } .wide-1218 #featured-slider .entry-container { left: 9.6%; } } @media screen and (min-width: 1650px) { .wide-978 #featured-slider .entry-container { left: 19.45%; } .wide-1218 #featured-slider .entry-container { left: 11.9%; } } @media screen and (max-width: 1308px) { #page { width: 97%; } .wide-1218 #page, .wide-978 #page { width: 100%; } .inner-wrap { width: 94%; } } @media screen and (max-width: 1078px) { body { padding: 15px 0; } #featured-slider .entry-container { max-width: 60%; } .call-to-action-content { float: none; width: 100%; margin-bottom: 10px; text-align: center; } .call-to-action-button { width: 93%; } .footer-socket-wrapper { .copyright { float: none; max-width: 100%; text-align: center; margin-bottom: 5px; } .small-menu { float: none; text-align: center; li { float: none; display: inline; } a { float: none; display: inline; padding: 5px 5px 0; } } } .small-menu li.default-menu, li.default-menu { display: none; } .tg-one-half, .tg-one-third, .tg-one-fourth { float: left; width: 46.7684729%; } #colophon { .tg-one-third { float: left; margin-right: 2.38916257%; padding: 0 0 30px; width: 31.7405583%; &.tg-after-two-blocks-clearfix { clear: none; } } } .widget_service_block .tg-one-third { float: left; margin: 0 2.46305%; padding: 0 0 30px; width: 28.4072%; } .tg-one-half-last, .tg-one-fourth-last { float: right; } .tg-service-left { float: left; margin: 0; } .tg-service-right { float: right; margin: 0; } .tg-column-1, .tg-column-3 { float: left; width: 46.7684729%; } .tg-column-2, .tg-column-4 { float: right; margin-right: 0; } .tg-after-two-blocks-clearfix { clear: both; } .tg-after-three-blocks-clearfix { clear: none; } } @media screen and (max-width: 1200px) and (min-width: 768px) { .no-sidebar-full-width, .no-sidebar { #primary { .entry-content { > .alignwide { margin-left: -40px; margin-right: -40px; } } } } } @media screen and (max-width: 768px) { .no-sidebar-full-width, .no-sidebar { #primary { .entry-content { > .alignwide { margin-left: -15px; margin-right: -15px; } } } &.narrow-978, &.narrow-1218 { #primary { .entry-content { > .alignwide { margin-left: -15px; margin-right: -15px; } > .alignfull { margin-left: -30px; margin-right: -30px; } } } } } .no-sidebar { #primary { .entry-content { > .alignfull { margin-left: -15px; margin-right: -15px; } } } } #primary, #secondary, .wide-978 #primary, .narrow-978 #primary { float: none; width: 100%; margin: 0; } #header-left-section { float: none; max-width: 100%; margin-right: 0; } #header-logo-image { float: none; text-align: center; margin-bottom: 10px; padding-right: 0; } #header-text { float: none; text-align: center; padding: 0; margin-bottom: 10px; } #site-description { padding-bottom: 5px; } #header-right-section { float: none; max-width: 100%; .widget { padding: 0 0 10px 0; float: none; text-align: center; } } .site-header .menu-toggle { display: block; text-align: left; padding: 10px 20px; } .main-small-navigation { width: 100%; } .main-navigation { float: none; &.toggled .nav-menu { display: block; } .menu-primary-container { > ul { .spacious-menu-header-button-enabled & { display: none; } } } ul { display: none; } } #featured-slider { .entry-container { max-width: 70%; } .entry-description-container { padding: 0.5rem 1rem; } .slider-title-head { margin-bottom: 0; } .entry-title span { font-size: 18px; line-height: 1.4; } .entry-content p { font-size: 14px; line-height: 1.4; } .slider-read-more-button { font-size: 14px; padding: 0.5rem 1rem; } } .woocommerce, .woocommerce-page { .related { ul.products { li { &.first { clear: both; } &.product { width: 48%; margin: 0 0 1em 0; } } } } } .woocommerce .related ul.products li.product, .woocommerce-page .related ul.products, .woocommerce form .form-row { input.input-text, textarea { line-height: 1.5em; padding: 10px; } } .woocommerce-page form .form-row { input.input-text, textarea { line-height: 1.5em; padding: 10px; } } /* =RESPONSIVE SUB TOGGLE MENU ----------------------------------------------- */ /* sub-toggle */ .sub-toggle { background: #0FBE7C none repeat scroll 0 0; color: #ffffff; cursor: pointer; display: block; height: 24px; line-height: 21px; position: absolute; right: 15px; text-align: center; top: 9px; width: 24px; } .main-small-navigation li.current-menu-item > .sub-toggle { background: #ffffff none repeat scroll 0 0; i { color: #d40234; } } .better-responsive-menu .menu-primary-container .sub-menu { display: none; } .sub-toggle span { display: inline-block; font-size: 11px; line-height: 23px; margin-left: 0; } .main-small-navigation li:hover > .sub-toggle { background: #ffffff; color: #0FBE7C; } .sub-toggle span.genericon-downarrow { line-height: 30px; margin-left: 0; } .site-header.spacious-header-display-four { .bottom-menu { position: relative; .menu-toggle { position: absolute; z-index: 9999; right: 20px; top: -40px; } } } .better-responsive-menu { #header-right-section { float: right; margin-top: 15px; max-width: 100%; } #site-navigation { float: right; margin-top: 10px; padding: 0; } .main-small-navigation { margin-top: 10px; } #header-logo-image { float: left; margin-bottom: 0; margin-right: 10px; } #header-left-section { float: left; margin-top: 10px; } #header-text { margin: 13px 0 0; float: left; text-align: left; } #site-description { font-size: 13px; margin-bottom: 0; } #site-title a { font-size: 28px; } .site-header .menu-toggle { background: #3a3a3a none repeat scroll 0 0; color: #fff; height: 36px; margin: 0; padding: 0; position: relative; text-align: center; width: 40px; } #header-text-nav-wrap { padding: 0; #header-right-section .widget { padding: 0; } } .site-header .menu-toggle::before { font-size: 21px; left: 50%; line-height: 25px; margin-right: 0; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #header-text-nav-container { position: relative; margin-bottom: 15px; border: none; } #site-navigation .menu-primary-container { left: 0; position: absolute; top: 100%; width: 100%; z-index: 9999; } } } @media screen and (max-width: 767px) { .social-links { float: none; padding-right: 0; padding-top: 10px; } .small-info-text { float: none; padding-right: 0; } .social-links ul { display: inline-block; } #header-meta { text-align: center; .small-menu { float: none; ul { display: inline-block; } } } .tg-one-half, .tg-one-third, .tg-one-fourth, .widget_service_block .tg-one-third { float: none; width: 100%; margin: 0; } .tg-column-1, .tg-column-2, .tg-column-3, .tg-column-4 { float: none; } #primary, #secondary { float: none; width: 100%; margin: 0; } .wide-978 #primary, .narrow-978 #primary, .wide-978 #secondary, .narrow-978 #secondary { width: 100%; } .related-posts { margin: 0; } #colophon { .tg-one-third { float: none; width: 100%; margin: 0; &.tg-after-two-blocks-clearfix { clear: both; } } } } @media screen and (max-width: 600px) { .no-sidebar-full-width, .no-sidebar { #primary { .entry-content { > .alignwide { margin-left: 0; margin-right: 0; } } } &.narrow-978, &.narrow-1218 { #primary { .entry-content { > .alignwide { margin-left: 0; margin-right: 0; } } } } } .site-header.spacious-header-display-four { .bottom-menu { .menu-toggle { position: relative; right: 0; top: 0; } } } .better-responsive-menu { #header-logo-image { display: block; float: none; } #header-text { display: block; float: none; margin-top: 12px; text-align: center; } #header-left-section { padding-top: 10px; text-align: center; float: none; } #header-right-section { float: none; } #header-right-sidebar { float: right; padding-left: 20px; } #site-navigation { float: none; margin-top: 0; } .site-header.spacious-header-display-four { .bottom-menu { .menu-toggle { position: absolute; right: auto; top: -45px; left: 15px; } } #header-left-section, #header-right-section { float: none; } } } .main-navigation, .main-small-navigation { padding-top: 8px; } #featured-slider { .entry-description-container { padding: 0.3rem 0.6rem; } .entry-title span { font-size: 14px; } .entry-content p { font-size: 10px; } .slider-read-more-button { margin-top: 5px; font-size: 10px; padding: 0.3rem 0.6rem; } } #controllers { bottom: 5px; a { height: 4px; margin: 0 3px; width: 12px; } } .woocommerce { table { font-size: 12px; &.shop_table { border-collapse: collapse; th { padding: 9px 2px; } td { padding: 6px 2px; } } } ul.products li.product h3 { font-size: 18px; } } .woocommerce-page ul.products li.product h3 { font-size: 18px; } .woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price { font-size: 16px; } .woocommerce { a.button, button.button, input.button, #respond input#submit, #content input.button { font-size: 14px; margin-bottom: 0; padding: 8px 10px; } } .woocommerce-page { a.button, button.button, input.button, #respond input#submit, #content input.button { font-size: 14px; margin-bottom: 0; padding: 8px 10px; } } .woocommerce { .quantity input.qty, #content .quantity input.qty { height: 24px; } } .woocommerce-page { .quantity input.qty, #content .quantity input.qty { height: 24px; } } .woocommerce { table.cart td.actions .coupon .input-text, #content table.cart td.actions .coupon .input-text { font-size: 14px; height: 32px; line-height: 1.5; padding: 4px 10px; width: 120px; } } .woocommerce-page { table.cart td.actions .coupon .input-text, #content table.cart td.actions .coupon .input-text { font-size: 14px; height: 32px; line-height: 1.5; padding: 4px 10px; width: 120px; } } .woocommerce .cart_totals h2 { float: none; } .gallery-columns-4, .gallery-columns-5, .gallery-columns-6, .gallery-columns-7, .gallery-columns-8, .gallery-columns-9 { .gallery-item { width: 25%; } } .author-box { .author-img { img { margin-bottom: 20px; } } .author-description-wrapper { margin-left: 0; } } } @media only screen and (max-width: 420px) { #page { width: 97%; } .inner-wrap { width: 95%; } #featured-slider { .entry-content, .slider-read-more-button { display: none; } } .gallery-columns-4, .gallery-columns-5, .gallery-columns-6, .gallery-columns-7, .gallery-columns-8, .gallery-columns-9 { .gallery-item { width: 33.33%; } } .better-responsive-menu #header-text { text-align: center; } }