/* Theme Name: Carlisle Theme URI: http://www.wideplankflooring.com Description: A custom WordPress theme made for Carlisle Wide Plank Flooring. Version: 1.1.0 Author: (maintained by) Paragon Digital Marketing Author URI: https://paragondigital.com */ body { color: #333; } /* Fix for firefox not displaying title in header image banners correctly */ .interior-banner .overlay { display: table-row; } /* hiding country field in woocommerce, which is required to be on the page hiding quantity input on products, which appeared in some update */ .woocommerce-billing-fields #billing_country_field, .woocommerce div.product form.cart div.quantity { display: none !important; } .woocommerce nav.woocommerce-pagination ul li span.current { color: #444; } /* hiding "indicates required fields" that appears with gravity forms update */ .gform_required_legend { display: none; } body.quiz #drift-frame-chat, body.quiz #drift-frame-controller, body.catalog #drift-frame-chat, body.catalog #drift-frame-controller { display: none !important; } /*//////////////////////////////////////////*/ /* Warehouse Floors Overview / Archive Page */ #warehouse-block {text-align: left; line-height: 1.3; display: flex; flex-wrap: wrap;} #warehouse-block li {display: inline-block; float: left !important; margin-bottom: 48px; width: 30%; position: relative; margin-right: 5%; background-color: #fff;} #warehouse-block li img {max-width: 100%; width: 100%; } #warehouse-block li:nth-child(3n) {margin-right: 0%;} .warehouse-image {display: block; width: 100%; height: 100%; min-height: 240px; max-height: 240px; background-position: center center; background-size: cover; background-repeat: no-repeat; margin-bottom: 24px;} .warehouse-title {text-transform: uppercase; font-size: 30px; margin: 0 0 12px 0;} .warehouse-content {line-height: 1.7;} .warehouse-buttons {margin: 12px 0; font-size: 0;} #warehouse-floors-projects {background-color: #f5f6f6;} #warehouse-floors-disclaimer {padding-bottom: 50px;} .greenbutton { font-size: 1rem; z-index: 10; font-weight: 400; background: #577b43; display: inline-block; border-color: #577b43; color: #ffffff !important; text-transform: uppercase; text-align: center;padding: 12px 30px; } .lastbutton {margin-right: 0 !important;} .warehouse-content .greenbutton {padding: 12px 0px; margin-right: 6%; width: 47%;} .page-template-page-warehouse-floors .inspiration-gallery {padding: 20px; background-color: #fff; margin: 40px auto;} .page-template-page-warehouse-floors .inspiration-gallery-items { position: relative; margin: 0px auto; max-width: 1280px;} .page-template-page-warehouse-floors .body-footer {margin-top: 0 !important;} /* Maximum width of 960 pixels. */ @media screen and (max-width: 960px) { #warehouse-block {display: block; flex-wrap: nowrap;} #warehouse-block li {display: block; float: none !important; margin-bottom: 48px; width: 100%; margin-right: 0%;} } /*//////////////////////////////*/ /* Warehouse Floors Single Page */ #warehouse-single .content_column.columns_8 { width: 68.5% !important; padding: 0 !important; margin: 0 !important;} #warehouse-single-image {width: 100%;} #warehouse-single-title {font-size: 32px; text-transform: uppercase;} #warehouse-single-header {padding: 50px 0 30px; border-bottom: 1px solid #eee; width: 100%;} #warehouse-single-header .greenbutton {float: right;} #warehouse-single-content {line-height: 1.7;} #warehouse-single-print {float: right;color: #577b43; font-size: 40px; margin-left: 24px;} /* Maximum width of 960 pixels. */ @media screen and (max-width: 960px) { #warehouse-single .content_column.columns_8 { width: 95% !important;} #warehouse-single-header .greenbutton {float: none;} #warehouse-single-print {float: none;margin-left: 0; vertical-align: middle; margin-right: 24px; } #warehouse-single-title {margin-top: 24px;} } @media print { .single-warehouse_floors .body-footer {display: none;} .single-warehouse_floors .page_block_content { max-width: 95%; margin: 0 auto; } .single-warehouse_floors .content_column.columns_4 {width: 45% !important;} #warehouse-single .content_column.columns_8 { width: 95% !important;} #warehouse-single-header a, .single-warehouse_floors .mobile-nav {display: none !important;} } .clear { clear: both; } img { height:auto; max-width:100% } h2 { font-family: 'baskerville'; } sup { font-size: 0.7em; vertical-align: super; } /* April 2021 redesign */ .noMargin { margin: 0 !important; } .header-menus .header-layout-item.link.top-level-item .sub-menu a { padding: 0 1.5em; display: inline-block; } .header-menus .header-layout-item.link.top-level-item.our-wood .sub-menu { height: 170px; } .header-menus .header-layout-item.link.top-level-item.our-wood .sub-menu .sub-menu-items { margin-top:0; display:block; } .header-menus .header-layout-item.link.top-level-item.our-wood div > ul > li { padding-top: 20px; } .header-menus .header-layout-item.link.top-level-item.our-wood div > ul > li > a { text-transform: uppercase; color: #577b43; opacity: 1; } .header-menus .header-layout-item.link.top-level-item.our-wood div > ul > li:first-child { display:block; } .mobile-nav-content .main-menu .top-level-item.our-wood div > ul > li > a { text-transform: uppercase; color: #577b43; opacity: 1; } .header-menus .header-layout-item.link.top-level-item.our-wood div > ul > li > ul > li { padding-top: 10px; } .body-header .secondary-menu .top-level-item + .top-level-item { margin-left: 30px; } .body-header > .container { padding: 0 40px; max-width: 100%; } .body-header .search-form-container { display: inline-block; margin-left: 20px; } .body-header .topBar { margin: 0; background-color: #333; text-align: right; padding: 4px 40px 5px; } .body-header .topBar .header-menus .top-level-item > a { color: #fff; font-weight: 400; font-size: 0.8rem; } .body-header .topBar .header-menus .top-level-item:hover > a { color: #9ebc8a; } .body-header .topBar .fa-search { font-size: 0.8rem; } .body-header .home-logo { display: inline-block; padding-top: 22px; } .wpmenucartli { margin-bottom: 4px !important; } .wpmenucart-contents { padding: 2px 0 1px !important; display: inline-block; } .interior-banner .content { display: flex; align-content: center; flex-wrap: wrap; justify-content: center; } .interior-banner img { margin-bottom: 4%; } .collectionHeader .interior-banner { background-image: url(/wp-content/uploads/2021/04/collection-background.png); } .collectionHeader .interior-banner h1 { text-transform: none; } .collectionIntro { max-width: 680px; margin: auto; padding: 0 10px; color: #333; text-align: center; line-height: 1.6; } .collectionIntro p { font-weight: 300; padding: 5% 0; } .april2021cta, .collectionSquares a, .homepageFlooringImages a.image, .homeJourney .journey .left, .background { background-size: cover; background-repeat: no-repeat; background-position: center center; } .april2021cta { clear: both; } .april2021cta .overlay { background: rgba(0, 0, 0, 0.16); padding: 4% 0; position: relative; } .april2021cta .container { max-width: 1320px; display: flex; } .april2021cta h2 { font-weight: 400; color: #fff; margin: 0 !important; font-size: 3rem !important; font-family: inherit; } .april2021cta .left { width: 48%; padding-right: 1%; display: flex; align-items: center; justify-content: center; } .april2021cta .left img { margin-right: 20px; } .april2021cta.absoluteImage .left img { position: absolute; bottom: 0; margin: 0; } .april2021cta .right { width: 45%; padding-left: 3%; border-left: 3px solid #fff; } .april2021cta .right h3 { font-weight: bold; text-transform: uppercase; margin: 0 !important; font-size: 1.8rem !important; color: #fff; line-height: 1.2; } .april2021cta .right p { font-size: 1.3rem !important; font-weight: 400; margin: 0; color: #fff; padding: 4% 0 5%; } .generic-button, .april2021cta .right a, .homeJourney .journey .right a { text-transform: uppercase; color: #fff; font-weight: 400; background-color: #577b43; padding:20px 30px 15px; display: inline-block; text-decoration: none !important; border-radius: 2px; font-size: 1.13rem; max-width: 310px; text-align: center; transition:all 0.4s cubic-bezier(0.77, 0, 0.175, 1); border: 0; } .generic-button.black { background-color: #1f1f1f; color: #fff; } .generic-button:hover, .april2021cta .right a:hover, .homeJourney .journey .right a:hover { background-color: #6E9B51; } .generic-button.black:hover { background-color: #767676; } .generic-button.white { background-color: #fff; color:#333; } .generic-button.white:hover { background-color: #eaeaea; color:#333; } .generic-button.darkGreen { background-color: #364743; } .generic-button.darkGreen:hover { background-color: #465C57; } .generic-button.more-padding, .april2021cta .right a, .homeJourney .journey .right a { padding:20px 60px 15px; } .asymmetric-cta .generic-button { padding: 20px 20px 15px; max-width: 370px; } .april2021cta.moveMe + .list-item { margin-top: 50px; } @media screen and (min-width: 600px) and (max-width: 760px) { .april2021cta.moveMe + .list-item { margin-top: 0; } } .product-details { display: flex; justify-content: space-around; color: #333; border-bottom: 2px solid #333; } .product-details div { display: flex; align-items: center; width: 17%; padding: 10px; } .product-details div + div { border-left: 2px solid #333; } .product-details img { width: 47px; padding-right: 14px; } .product-details .customizable { color: #577b43; } .product-details .texture.customizable { width: 22%; } .product-icons { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #333; border-bottom: 1px solid #333; } .product-icons div { padding: 7px 7px 2px; } .product-icons .tooltip-block img { width: 33px; } .product-icons .tooltip-block span.tooltip { margin-left: -24px; } .product-icons .tooltip-block:hover span.tooltip { -ms-transform: translateY(-10px); transform: translateY(-10px); } .product-paragraph { border-top: 1px solid #333; border-bottom: 1px solid #333; padding:5px; font-weight: 300; line-height: 1.4; } .category-banner-container .content-container .bottom-tab li { border-right: none; } .category-banner-container .content-container .bottom-tab li .category, .category-banner-container .content-container .bottom-tab li .sub-category { color: #333 !important; font-size: 0.85rem !important; } .chooseCollection { text-align: center; } .chooseCollection h2 { margin-bottom: 3% !important; } .chooseCollection .collectionSquares { display: flex; justify-content:space-between; flex-wrap: wrap; } .chooseCollection .collectionSquares a { display: block; width: 32%; margin-bottom: 2%; padding: 7.5% 20px; } .chooseCollection .collectionSquares a span { background-color: #fff; color: #577b43; font-size: 1.2rem; display: inline-block; padding: 10px 30px; } .chooseCollection .collectionSquares a:hover span { text-decoration: underline; } .chooseCollection .collectionSquares a.halfWidth { width: 49%; } .chooseCollection .customizeIcons { display: flex; flex-wrap: wrap; justify-content:space-around; padding: 1% 0 3%; } .chooseCollection .customizeIcons > div { width: 23%; } .chooseCollection .customizeIcons div div { display: flex; height: 117px; justify-content: center; align-items: center; } .chooseCollection .customizeIcons p { font-weight: bold; font-size: 1.2rem !important; margin-top: 5px; } .home .page_block p { font-size: 1.25rem !important; } .home .image-cta.homepage-hero { margin-bottom: 0; padding-top: 40% !important; } .home .image-cta.homepage-hero .hero-overlay-area { text-align: left; padding: 0 18% 0 8%; } .home .image-cta.homepage-hero .hero-overlay-area .title { text-transform: none; letter-spacing: inherit !important; text-shadow: none; font-size: 4rem !important; line-height: inherit !important; max-width: 900px; margin:0; padding-bottom: 25px; } .home .image-cta.homepage-hero .hero-overlay-area .subtitle { font-size: 1.4rem; max-width: 800px; margin-bottom: 20px; } .homeJourney .top { background-color: #F7F6F0; } .homeJourney .top.quiz .container { max-width: 900px; text-align: center; padding: 3% 0 4%; } .homeJourney h2, .homepageFlooringImages h2 { margin: 0 !important; font-size: 3rem !important; } .home .page_block .homeJourney h2 + p { font-size: 1.8rem !important; line-height: 1.3 !important; font-weight: 500; max-width: 680px; margin: 0 auto; padding: 20px 0; } .homeJourney .designKits { display: flex; align-items: center; } .homeJourney .designKitsLeft { width: 50%; padding: 5% 3% 5% 8%; } .homeJourney .designKitsLeft h3 { margin: 20px 0 12px !important; } .homeJourney .designKitsLeft p { margin: 14px 0 26px; } .homeJourney .designKitsLeft .generic-button { max-width: 370px; } .homeJourney .designKitsRight { width: 50%; } .homeJourney .quizRight { float: right; text-align: left; width: 45%; } .homeJourney .quizRight strong { display: block; font-family: 'Avenir Black'; } .homeJourney .quizRight p { line-height: 1.4 !important; padding: 10% 0 20px; max-width: 360px; } .homeJourney .quizLeft { float: left; max-width: 450px; width: 52%; } .homeJourney .quizLeft img { display: block; } .homeJourney .journey { display: flex; } .homeJourney .journey div { width: 50%; } .homeJourney .journey .left .overlay { background-color: rgba(0, 0, 0, 0.16); display: flex; align-items: center; padding: 0 20px 0 15%; width: 100%; height: 100%; text-decoration: none; } .homeJourney .journey.imageRight .left { order:2; } .homeJourney .journey .right { padding: 5.5% 8% 5.5% 5.5%; } .homeJourney .journey .right p { margin-bottom: 30px; } .homeJourney .journey h2 { color: #fff; font-weight: bold; font-family: inherit; } .homeJourney .journey h3 { font-weight: bold; text-transform: uppercase; margin: 0 !important; font-size: 1.8rem !important; line-height: 1.2; } .homeJourney .left img { margin-right: 20px; } .homeJourney .bottom { background-color: #D4E8C7; text-align: center; padding: 3% 0; } .homeJourney .bottom .cols { display: flex; justify-content:space-around; } .homeJourney .bottom .cols div { width: 24%; } .homeJourney .bottom h2 { padding-bottom: 3%; } .homeJourney .bottom .cols h3 { margin-top: 20px !important; } .homeJourney .bottom .cols p { margin-top: 10px; } .homeFeaturedProjects { margin-bottom: -100px; padding-top: 5%; } .homeFeaturedProjects .pepper, .homeFeaturedProjects .nahem { display: flex; justify-content: space-between; } .homeFeaturedProjects .pepper div, .homeFeaturedProjects .nahem div { width: 48%; } .homeFeaturedProjects p { margin-top: 3%; } .homeFeaturedProjects p:before { content: ""; border-top: 1px solid #aaa; padding-top: 3%; width: 120%; display: block; } .homeFeaturedProjects .nahem p:before { float: right; } .homeFeaturedProjects .nahem .content { order:2 } .homeFeaturedProjects .nahem .image { position: relative; top: -160px; } .homeFeaturedProjects h3 a { color: #577b43; text-transform: uppercase; text-decoration: none; } .homeFeaturedProjects h4 { font-weight: bold; font-size: 1.5rem; } .home .testimonial, .home .testimonial .carousel-slider-container.testimonial-tabs .testimonial-tabs-nav .tab.is-selected, .home .testimonial .carousel-slider-container.testimonial-tabs .testimonial-tabs-nav .tab:hover { color: #fff; } .home .testimonial .title { border-bottom: none; z-index: 100; position: relative; text-align: left; padding: 5% 10% 0 25%; font-weight: 500; } .testimonial .carousel-slider-container .company, .testimonial .carousel-slider-container .location, .testimonial .carousel-slider-container .name { text-transform: none; font-size: 0.9rem; } .home .testimonial .rating { display: none; } .home .testimonial .carousel-slider-container.testimonial-tabs .testimonial-tabs-nav .tab { font-family: inherit; } .homepageFlooringImages { background-color: #F0F0F0; padding: 4% 0 5%; text-align: center; } .homepageFlooringImages .container { max-width: 1250px; } .homepageFlooringImages h3 { margin:16px 0 40px !important; } .homepageFlooringImages .images { display: flex; justify-content:space-between; flex-wrap: wrap; } .homepageFlooringImages .images > div { width: 23.5%; text-align: left; } .homepageFlooringImages a.image { display: block; padding: 23% 10%; text-decoration: none; text-align: center; } .homepageFlooringImages h4 { margin: 10px 0; font-size: 1.5rem; } .homepageFlooringImages h4 a:hover { text-decoration: underline; } .homepageFlooringImages p { margin: 0; } @media screen and (max-width: 1300px) { .body-header .secondary-menu .top-level-item + .top-level-item { margin-left: 16px; } .homeFeaturedProjects { margin-bottom: -60px; } .homeFeaturedProjects .nahem .image { top: -120px; } } @media screen and (max-width: 1200px) { .april2021cta h2, .chooseCollection h2, .homeJourney h2, .homepageFlooringImages h2 { font-size: 2.6rem !important; } .home .page_block .homeJourney h2 + p { font-size: 1.8rem !important; } .header-bottom .header-menus { padding-top: 30px; } .homeFeaturedProjects { margin-bottom: -40px; } .homeFeaturedProjects .nahem .image { top: -90px; } .home .image-cta.homepage-hero .hero-overlay-area .title { font-size: 3.4rem !important; } .product-details { flex-wrap:wrap; border: 1px solid #333; } .product-details div, .product-details .texture.customizable { width: 25%; flex-grow: 1; border: 1px solid #333; } .product-details div + div { border-left: 1px solid #333; } } @media screen and (max-width: 1100px) { .home .image-cta.homepage-hero { padding-top: 50% !important; } .home .image-cta.homepage-hero .hero-overlay-area { text-align: left; padding: 0 8%; } .homeJourney .journey .left .overlay { padding: 0 20px 0 5%; } .homeFeaturedProjects { margin-bottom: -20px; } .homeFeaturedProjects .nahem .image { top: -40px; } } @media screen and (max-width: 960px) { .april2021cta h2, .chooseCollection h2, .homeJourney h2, .homepageFlooringImages h2 { font-size: 2rem !important; } .april2021cta .right h3, .homeJourney .journey h3 { font-size: 1.4rem !important; } .home .page_block .homeJourney h2 + p { font-size: 1.6rem !important; } .chooseCollection .customizeIcons p { font-size: 1rem !important; } .home .page_block p { font-size: 1.1rem !important; } .homepageFlooringImages a.image { padding: 13% 5%; } .homeFeaturedProjects { margin-bottom: 0; padding: 7% 0; } .homeFeaturedProjects .pepper { padding-bottom: 7%; } .homeFeaturedProjects .nahem .image { top: 0; } .homeFeaturedProjects h3 { margin-top: 0 !important; } .homeFeaturedProjects h4 { font-size: 1.2rem; line-height: 1.2; } } @media screen and (max-width: 850px) { .chooseCollection .customizeIcons > div { width: 48%; padding-bottom: 3%; } .home .image-cta.homepage-hero { padding-top: 400px !important; } .home .image-cta.homepage-hero .hero-overlay-area .title { font-size: 3rem !important; line-height: 1.1 !important; } .home .image-cta.homepage-hero .hero-overlay-area .subtitle { font-size: 1.2rem; } .homeJourney .designKits { display: block; } .homeJourney .designKitsRight, .homeJourney .designKitsLeft { width: 100%; } .homeJourney .designKitsLeft { text-align: center; padding: 10% 20px; } .homepageFlooringImages .images > div { width: 47%; } .homepageFlooringImages .images > div:nth-child(-n+2) { padding-bottom: 7%;} } @media screen and (max-width: 780px) { .body-header > .container { height: auto; } .interior-banner img { max-width: 80px; } .interior-banner img + h1 { font-size: 30px !important; } .chooseCollection .collectionSquares a, .chooseCollection .collectionSquares a.halfWidth { width: 48%; margin-bottom: 4%; padding: 11% 20px; } .chooseCollection .collectionSquares a.halfWidth:last-child { width: 100%; } .home .testimonial .title { padding: 0 10% 0 0; } } @media screen and (max-width: 640px) { .april2021cta .overlay { padding: 8% 0; } .april2021cta .container, .april2021cta .left { display: block; } .april2021cta .left, .april2021cta .right { width: 100%; padding: 0; text-align: center; } .april2021cta .left img { margin: 0; } .april2021cta .right { border-left: none; border-top: 3px solid #fff; margin-top: 8%; padding-top: 8%; } .homepageFlooringImages a.image { padding: 13% 5%; } .home .page_block .homeJourney h2 + p { font-size: 1.4rem !important; } .homeJourney .quizRight { float: none; width: 100%; text-align: center; padding-bottom: 10%; } .homeJourney .quizRight p { padding-top: 2%; margin: 0 auto; } .homeJourney .quizLeft { float: none; width: 100%; margin: 0 auto; } .homeJourney .journey { display: block; } .homeJourney .journey div { width: 100%; } .homeJourney .journey .left .overlay { display: block; text-align: center; padding: 8% 20px; } .homeJourney .journey .right { padding: 8%; } .homeJourney .left img { margin: 0 0 20px 0; } .homeJourney .top.quiz { padding: 8% 0; } .homeJourney .bottom { padding: 8% 0 4%; } .homeJourney .bottom .cols { display: block; } .homeJourney .bottom .cols div { width: 100%; max-width: 350px; margin: 0 auto 7%; } .homeJourney .bottom .cols h3 { margin: 0 !important; } .homeJourney .bottom .cols p { margin-top: 0; } .homeFeaturedProjects .pepper, .homeFeaturedProjects .nahem { display: block; } .homeFeaturedProjects .pepper div, .homeFeaturedProjects .nahem div { width: 100%; } .homeFeaturedProjects p { margin: 4% 0; } .homeFeaturedProjects p:before { width: 100%; } .product-details { display: block; border: none !important; } .product-details div, .product-details .texture.customizable { width: 100% !important; justify-content: center; border: none !important; border-bottom: 1px solid #333 !important; } .homepageFlooringImages { padding: 8% 0 2%; } .homepageFlooringImages .images { display: block; } .homepageFlooringImages .images > div, .homepageFlooringImages .images > div:nth-child(-n+2) { width: auto; margin: 0 auto; text-align: center; padding-bottom: 12%; max-width: 400px; } .homepageFlooringImages div > p { margin-top: 5px; } } @media screen and (max-width: 550px) { .chooseCollection .collectionSquares a, .chooseCollection .collectionSquares a.halfWidth { width: 100%; margin-bottom: 5%; padding: 20% 20px; } .chooseCollection .customizeIcons > div { padding-bottom: 6%; } .chooseCollection .customizeIcons p { font-size: 0.9rem !important; } .testimonial { margin: 50px 10px 0; } .home .image-cta.homepage-hero .hero-overlay-area { text-align: center; } .home .image-cta.homepage-hero .hero-overlay-area .title { font-size: 2rem !important; line-height: 1.2 !important; } .wp-breadcrumbs { display: none; } } @media screen and (max-width: 374px) { .body-header .header-menus ul li { padding: 3px 5px; } } /* styles for a single page that were in the wysiwyg */ .page-id-20234 .no-exit-header__text { color:#fff; } .page-id-20234 .one-col-list { columns: 1; } .page-id-20234 ol.large-numbers { list-style: none; counter-reset: my-awesome-counter; padding-left: 0; margin-top: 0; } .page-id-20234 ol.large-numbers li { counter-increment: my-awesome-counter; color: white; padding-left: 50px; position: relative; margin-top: 0; margin-bottom: 1.5em; } .page-id-20234 ol.large-numbers li::before { content: counter(my-awesome-counter); color: white; background: #577b43; width: 40px; height: 40px; display: inline-flex; justify-content: center; align-items: center; font-size: 1.5rem; position: absolute; left: 0; } .page-id-20234 ol.large-numbers li strong { font-size: 1.5rem; font-family: "Oswald", sans-serif; font-weight: 100; text-transform: uppercase; } /* Careers Pages */ table.open-positions{ width: 100%; display: inline-table; border-top: 2px solid black; border-bottom: 2px solid black; } table.open-positions tr{ border-bottom: 1px solid #c1c1c1; } .open-positions td { width: 50%; text-align: left; padding: 30px 0px 30px 0px; } .open-positions tr:nth-child(even) { background: rgba(255, 255, 255, 1); } table.open-positions td + td{ width: 50%; text-align: right; } table.open-positions a{ height: 75px; width: 460.51px; color: #577b43; font-family: Avenir; font-size: 24px; font-weight: 900; letter-spacing: 0; line-height: 33px; text-decoration: none; } .careers ul{ padding-left: 30px; } .careers ul li { text-align: left; } .careers .body-content{ padding-top: 10px; text-align: left; } .careers .content-column{ padding-bottom: 30px; padding-right: 3em !important; text-align: left; } /* news bar */ .newsBar { background-color: #577b43; color: #fff; font-size: 1.1rem; padding: 10px 0; position: fixed; z-index: 10000; width: 100%; top: 0; } .newsBar p { margin: 5px 0 0; float: left; width: calc(100% - 80px); text-align: center; } .newsBar a { color: #fff; text-decoration: underline; } .newsBar .close { background-color: #fff; text-decoration:none; color: #577b43; border-radius: 20px; font-size: 2rem; line-height: 0.5; padding: 9px 5px 6px; float: right; } .noscroll .newsBar { display: none; } .newsBarVisible .body-header { padding-top: 51px; } .newsBarVisible .body-header .header-bottom .header-menus .top-level-item > .sub-menu { top: 176px; } @media only all and (max-width: 780px) { .newsBar { top: auto; bottom: 0; } .newsBar p { width: calc(100% - 40px); } .newsBarVisible .body-header { padding-top: 0; } } /* about page */ .about-video .video-banner:after { padding-top: 60%; } .about-video .video-banner .content { width: 90%; } .about-video .video-banner .content .tagline { font-size: 0.9rem; } .about-video .video-banner .content .title { font-size: 1.6em; } .testimonial.slider { display: flex; max-width: 100%; align-items: center; position: relative; } .testimonial.slider .title { font-family: 'Avenir Black'; font-size: 3rem; text-align: right; width: 32%; position: absolute; z-index: 10; } .testimonial.slider .carousel-slider-container { background-color: #F7F6F0; font-family: 'baskerville'; width:74%; padding: 6% 4% 6% 12%; margin-left: 26%; } .testimonial.slider .carousel-slider-container .carousel-cell { padding: 25px 5px 4% 60px; text-align: left; } .testimonial.slider .carousel-slider-container .quote { font-style: italic; font-size: 2rem; line-height: 1.3; padding-bottom: 20px; } .testimonial.slider .carousel-slider-container .quote:before { font-size: 6rem; line-height: 0; position: absolute; top: 40px; left: -10px; } .testimonial.slider .carousel-slider-container .name, .testimonial.slider .carousel-slider-container .company, .testimonial.slider .carousel-slider-container .location { font-size: 1.4rem; } .testimonial.slider .carousel-slider-container .flickity-page-dots { position: static; text-align: left; padding-left: 60px; } .testimonial.slider .carousel-slider-container .flickity-page-dots .dot { opacity: 1; background-color: #CECECE; width: 13px; height: 13px; } .testimonial.slider .carousel-slider-container .flickity-page-dots .dot.is-selected { background-color: #577b43; } @media only all and (max-width: 1270px) { .testimonial.slider .title { font-size: 2.6rem; } .testimonial.slider .carousel-slider-container .quote { font-size: 1.6rem; } .testimonial.slider .carousel-slider-container .name, .testimonial.slider .carousel-slider-container .company, .testimonial.slider .carousel-slider-container .location { font-size: 1.2rem; } } @media only all and (max-width: 1100px) { .testimonial.slider .title { font-size: 2.2rem; } .testimonial.slider .carousel-slider-container { padding: 6% 4% 6% 10%; } .testimonial.slider .carousel-slider-container .carousel-cell { padding: 25px 5px 4% 40px; } .testimonial.slider .carousel-slider-container .quote:before { font-size: 5rem; } } @media only all and (max-width: 1030px) { .about-video .video-banner:after { padding-top: 75%; } } @media only all and (max-width: 767px) { .about-video .video-banner:after { padding-top: 20%; } } @media only all and (max-width: 660px) { .mobile-center-text { text-align: center; } .testimonial.slider { display: block; } .testimonial.slider .title { position: static; width: 100%; text-align: left; font-size: 1.8rem; background-color: #F7F6F0; padding: 8% 4% 6%; } .testimonial.slider .carousel-slider-container { margin-left: 0; width: 100%; padding: 2% 2% 8%; } .testimonial.slider .carousel-slider-container .carousel-cell { padding: 0 5px 8%; } .testimonial.slider .carousel-slider-container .quote { font-size: 1.2rem; } .testimonial.slider .carousel-slider-container .quote:before { font-size: inherit; position: static; } .testimonial.slider .carousel-slider-container .name, .testimonial.slider .carousel-slider-container .company, .testimonial.slider .carousel-slider-container .location { font-size: 1rem; } .testimonial.slider .carousel-slider-container .flickity-page-dots { padding-left: 0; } } /* Showroom pages */ .odContainer { max-width: 1240px; padding: 0 20px; margin: 0 auto; font-size: 1.2rem; } .odContainer img { max-width: 100%; height: auto; } .odContainer h2 { margin:20px 0 20px !important; } .odContainer p { line-height: 1.6; } .leftHeader .overlay { background: rgba(0,0,0,0.3); } .leftHeader h4 { color: #fff; text-transform: uppercase; font-size: 1.2rem; } .leftHeader h1 { color: #fff; font-size: 4rem !important; letter-spacing: normal !important; padding: 4.4% 0 6.3%; line-height: 1.2 !important; } .leftHeader .left { float: left; padding: 24px 30px; margin:10% 0 10% 7%; } .leftHeader.heightMedium .left { padding: 10% 0 10% 9%; } .leftHeader.heightLow .left { padding: 8% 0 8% 9%; } .showroomHeader .left h1:first-child { padding-bottom: 3%; } .showroomHeader .left h1 + h4 { padding-bottom: 20px; } .showroomHeader .right { float: right; padding: 30px 0 25px; margin: 9% 0 5% 2%; width: 46%; background-color: #fff; line-height: 1.6; font-size: 1.25rem; } .showroomHeader .right .address, .showroomHeader .right .phone { float: left; width: calc(50% - 25px); padding-left: 25px; } .showroomProjects { padding: 4% 0; } .showroomProjects .projectsCarousel { overflow: hidden; } .showroomProjects .odContainer .project { width: 100%; max-width: 1200px; padding-bottom: 5px; display: flex; align-items:stretch; justify-content:space-between; } .showroomProjects .left { width: 48.5%; min-height: 400px; background-position: bottom center; } .showroomProjects .right { width: 48.5%; } .showroomProjects .right h2 { margin: 0 !important; } .showroomProjects .right .greySpecs { background-color: #F0F0F0; padding: 20px 20px 0; display: flex; justify-content:space-between; flex-wrap:wrap; font-size: 1.15rem; margin-top: 30px; } .showroomProjects .right .greySpecs .spec { padding-bottom: 20px; break-inside: avoid; width: 48%; } .showroomProjects .right .greySpecs .title { text-transform: uppercase; font-weight:bold } .showroomProjects .right .projectSpecs { text-transform: uppercase; font-family: 'baskerville'; } .showroomProjects .flickity-page-dots { list-style: none; text-align: center; margin-top: 10px; } .showroomProjects .flickity-page-dots .dot { background-color: #fff; border: 2px solid #000; width: 14px; height: 14px; cursor: pointer; border-radius: 10px; display: inline-block; margin: 0 5px; } .showroomProjects .flickity-page-dots .is-selected { background-color: #577b43; border: 2px solid transparent; } .showroom3D, .showroomBooking { padding: 2% 0 4%; background-color: #F0F0F0; text-align: center; } .showroom3D p, .showroomBooking p { max-width: 850px; margin: 0 auto; } .showroom3D p { margin-bottom: 30px; } .showroom3D.single .iframeVideo { width: 71%; padding-bottom: 40%; margin: 0 auto; } .showroom3D.double iframe { width: 49%; } .showroom3D.double iframe:first-of-type { float: left; } .showroom3D.double iframe:last-of-type { float: right; } .showroomBooking .generic-button { margin-top: 20px; } .showroomPeople { padding: 4% 0; } .showroomPeople .odContainer { display: flex; gap:1%; flex-wrap:wrap; justify-content: center; } .showroomPeople .odContainer div { width: 32.6%; } .showroomPeople .odContainer .person { text-align: center; padding: 20px 6.5%; max-width: 380px; } .showroomPeople .odContainer .person img { border-radius: 200px; } .showroomPeople .odContainer .person p { padding-top: 18px; font-size: 1.15rem; white-space: nowrap; } .showroomPeople .odContainer .person p strong { text-transform:uppercase; } .showroomPeople .odContainer .person p span { font-weight: 300; } .showroomPeople .odContainer.people1 .text { width: 60%; } .showroomPeople .odContainer.people3 div { width: 24.2%; } .showroomPeople .odContainer.people3 .person { padding: 20px 2.2%; } .showroomPeople .odContainer.people4 { justify-content: right; } .showroomCTA { padding: 20px 0; background-color: #f0f0f0; } .showroomCTA .odContainer { display: flex; align-items:center; justify-content:space-between; } .showroomCTA .left { width: 44%; } .showroomCTA .right { width: 50%; } .showroomCTA p { margin-bottom: 20px; } @media only all and (max-width: 1500px) { .leftHeader .left { margin:10% 0 10% 4%; } .leftHeader.heightMedium .left { margin:8% 0 8% 4%; } .leftHeader.heightLow .left { margin:6% 0 6% 4%; } .showroomHeader .right .address { width: calc(60% - 25px); } .showroomHeader .right .phone { width: calc(40% - 25px); } } @media only all and (max-width: 1300px) { .leftHeader .left { margin: 11% 0 11% 20px; } .leftHeader.heightMedium .left { margin: 9% 0 9% 20px; } .leftHeader.heightLow .left { margin: 7% 0 7% 20px; } } @media only all and (max-width: 1200px) { .showroomHeader .right .address, .showroomHeader .right .phone { width: calc(50% - 25px) !important; } .leftHeader h1, body.commercial-group .leftHeader h1 { font-size: 3rem !important; } .showroomPeople .odContainer .person { padding: 20px 4%; } .showroomPeople .odContainer .person p { white-space: normal; } } @media only all and (max-width: 1100px) { .showroomHeader .right { line-height: 1.4; font-size: 1.1rem; } } @media only all and (max-width: 900px) { .showroomHeader .right { padding: 20px 0 15px; } .showroomHeader .right .address, .showroomHeader .right .phone { float: none; width: calc(100% - 25px) !important; } .showroomHeader .right .address { padding-bottom: 20px; } .odContainer h2 { font-size: 2rem !important; } .odContainer { font-size: 1.1rem; } .showroom3D.single .iframeVideo, .showroom3D.double iframe { float: none; width: 100%; } .showroom3D.single .iframeVideo { padding-bottom: 57%; } .showroom3D.double iframe:first-of-type { margin-bottom: 20px; } } @media only all and (max-width: 800px) { .showroomProjects .odContainer .project { display: block; } .showroomProjects .left, .showroomProjects .right { width: 100%; } .showroomProjects .left { min-height: 300px; max-width: 400px; margin: 0 auto 20px; } .showroomPeople .odContainer div, .showroomPeople .odContainer.people1 .text, .showroomPeople .odContainer.people3 div { width: 49%; } .showroomPeople .odContainer.people2 .text { width: 100%; text-align: center; margin: 0 auto; } .showroomPeople .odContainer:not(.people1) .person, .showroomPeople .odContainer.people3 .person { padding: 20px 10%; } } @media only all and (max-width: 700px) { .leftHeader { padding: 20px 0; } .leftHeader .left { float: none; width: calc(100% - 40px); margin: 8% 20px !important; padding: 14px 20px; } .leftHeader h1, body.commercial-group .leftHeader h1 { font-size: 2.4rem !important; padding: 3% 0 4%; } .showroomHeader .right { float: none; margin: 0 auto; width: calc(100% - 40px); background-color: rgba(255,255,255,0.8); } .showroomHeader .right .address, .showroomHeader .right .phone { float: left; width: calc(50% - 25px) !important; } .showroom3D, .showroomBooking { padding: 2% 0 8%; } .showroomCTA .odContainer { display: block; text-align: center; } .showroomCTA .left, .showroomCTA .right { width: 100%; } } @media only all and (max-width: 600px) { .showroomPeople .odContainer .person:not(.people1), .showroomPeople .odContainer.people3 .person { padding: 20px 6%; } } @media only all and (max-width: 500px) { .showroomHeader .right .address, .showroomHeader .right .phone { float: none; width: calc(100% - 25px) !important; } .showroomProjects .right .greySpecs { display: block; } .showroomProjects .right .greySpecs .spec { width: 100%; } .showroomPeople .odContainer .person, .showroomPeople .odContainer.people3 .person { padding: 20px 4%; } .showroomPeople .odContainer.people1 { display: block; } .showroomPeople .odContainer.people1 div, .showroomPeople .odContainer .text, .showroomPeople .odContainer.people1 .text, .showroomPeople .odContainer.people3 .text { width: 100%; text-align: center; margin: 0 auto; } .showroomPeople .odContainer.people1 .person { max-width: 300px; } } /* commercial group */ .commercial-group .specs { font-family: 'Baskerville'; text-transform: uppercase; } .commercial-group .specs span { padding: 0 10px; } .commercial-group h2 { font-size: 3rem !important;} .commercial-group h3 { font-size: 2.25rem !important; } .commercial-group .generic-button { background-color: #1b2843; } .commercial-group .generic-button:hover { background-color: #2b3853; } .commercial-group .showroomProjects .flickity-page-dots .is-selected { background-color: #1b2843; } .commercial-group .leftHeader .left { background-color: rgba(240, 240, 240, 0.9); margin: 12% 0 12% 4%; } .commercial-group .leftHeader .left h1, .commercial-group .leftHeader .left h4 { color: #333; } .commercial-group .leftHeader h1 { font-size: 3.4rem !important; padding: 3% 0 4%; } .commercial-group .showroomProjects .left { background-position: bottom right; } .commercial-group .showroomProjects .right img { margin: 20px 0; } .commercialLogos { background-color: #F0F0F0; padding: 3% 0; } .commercialLogos .odContainer { display: flex; flex-wrap:wrap; justify-content: center; align-items: center; text-align: center; } .commercialLogos .odContainer div { width: 16%; padding: 1.5% 0; } .designFreedom { padding: 5% 0; } .designFreedom .left { float: left; width: 32%; position: relative; } .designFreedom .left h2 { position: absolute; left: 108%; top: 20px; margin: 0 !important; z-index: 1; } .designFreedom .left h2:before { content: ""; background-color: #F0F0F0; display: block; position: absolute; z-index: -1; left: 65px; top: -20px; width: 330px; height: 192px; } .designFreedom .left p { margin-bottom: 30px; } .designFreedom .right { float: right; width: 57%; } .designFreedom .right .background { background-image: url('/wp-content/uploads/2022/03/studio-534.png'); padding-top: 66%; margin: 50px 0 20px; } .commercialSpecialist { background-color: #333; color: #fff; padding: 3% 0; } .commercialSpecialist .copy { width: 64%; text-align: center; margin: 0 auto; padding-bottom: 5%; } .commercialSpecialist .copy h3 { margin: 0 0 10px !important; color: #fff; } .commercialSpecialist .specialists, .commercialSpecialist .specialist { display: flex; gap:5%; align-items: center; } .commercialSpecialist .specialist { width: 50%; } .commercialSpecialist .image img { max-width: 229px; border-radius: 200px; } .commercialSpecialist .specialist a { color: #fff; } .commercialSpecialist .specialist span { font-family: 'Avenir Black'; display: block; text-transform: uppercase; } .commercialPillars { padding-bottom: 3%; } .commercialPillars .odContainer { display: flex; flex-wrap:wrap; justify-content:space-between; } .commercialPillars .pillar { width: 30%; padding: 2% 0; } .commercialPillars .pillar h2 { max-width: 270px; margin-top: 0 !important; } .commercialPillars .pillar .title { display: flex; align-items: center; height: 101px; } .commercialPillars .pillar .image { width: 29%; padding-right: 3%; } .commercialPillars .pillar h3 { width: 71%; line-height: 1.2; margin-top: 0 !important; } .commercialCTA { padding-top:3%; } .commercialCTA .left { float: left; width: 60%; } .commercialCTA .left h2 { margin-top: 0 !important; } .commercialCTA .left p { margin-bottom: 30px; } .commercialCTA .right { float: right; width: 30%; } .commercialMasonry { padding-top:3%; } .commercialMasonry .commercial-gutter { width:3%; } .commercialMasonry .item { display: inline-block; width: 31%; margin-bottom: 3%; } .commercialMasonry .item img { display: block; } .commercialMasonry .caption { background-color: #F0F0F0; padding: 10px 13px 13px 13px; } .commercialMasonry .caption h4 { font-family: Baskerville; font-weight: 400; font-size: 1.4rem; } .commercialMasonry .caption p { font-size: 1.1rem; line-height: 1.4; padding-top: 5px; } @media only all and (max-width: 1200px) { .commercialLogos .odContainer div { width: 24%; } .commercialCTA .right { width: 37%; } } @media only all and (max-width: 1000px) { .commercial-group h3 { font-size: 2rem !important; } } @media only all and (max-width: 900px) { .commercial-group h2 { font-size: 2.4rem !important; } .commercialLogos .odContainer div { width: 32%; } .designFreedom .left { width: 42%; } .designFreedom .right { width: 47%; } .designFreedom .left h2::before { left: 37px; width: 160px; height: 172px; } .commercialPillars .pillar { width: 45%; } .commercialSpecialist .image img { max-width: 150px; } } @media only all and (max-width: 800px) { .designFreedom .left { float: none; width: 100%; } .designFreedom .right { float: none; width: 100%; } .designFreedom .left h2 { position: static; margin: 0 0 20px !important; } .designFreedom .left h2:before { content: none; } .commercialMasonry .item { width: 48%; } } @media only all and (max-width: 700px) { .commercialCTA { text-align: center; } .commercialCTA .left { float: none; width: 100%; padding-bottom: 8%; } .commercialCTA .right { float: none; width: 100%; } .commercialSpecialist .specialists { display: block; } .commercialSpecialist .specialist { width: 100%; justify-content: center; } .commercialSpecialist .specialist:first-child { padding-bottom: 5%; } .commercialSpecialist .image img { max-width: 229px; } } @media only all and (max-width: 650px) { .commercialPillars .odContainer { display: block; } .commercialPillars .pillar { width: 100%; } .commercialPillars .pillar h2 { max-width: 100%; } .commercialPillars .pillar .image { width: 18%; } } @media only all and (max-width: 550px) { .commercialLogos .odContainer div { width: 48%; } .designFreedom, .commercialSpecialist, .commercialPillars { padding: 8% 0; } .commercialMasonry .item { width: 100%; } } @media only all and (max-width: 450px) { .commercialPillars .pillar .image { width: 28%; } .commercialSpecialist .specialist { display: block; text-align: center; } .commercialSpecialist .specialist .desc { padding: 10px 0; } } /* landing pages */ .single-landing-pages.hideNav header, .single-landing-pages.hideNav .newsBar { display: none; } .single-landing-pages.hideNav .main { padding: 0 !important; } .single-landing-pages div.home-logo { margin-top: 4%; text-align: center; } .single-landing-pages div.home-logo svg { max-width: 270px; height: auto; } .single-landing-pages h1 { font-family: 'baskerville'; font-weight: 400; font-size: 3rem !important; letter-spacing: inherit !important; line-height: 1.3 !important; color: #333; } .single-landing-pages .landingPageHeader h1 { font-family: 'baskerville'; font-weight: normal; line-height: 1.1 !important; } .single-landing-pages .tanBoxImage h2 { font-style: italic; } .single-landing-pages h2 { font-family: 'baskerville'; font-weight: 400; } .single-landing-pages h3 { font-family: 'baskerville'; font-weight: 600; } .single-landing-pages h4 { font-family: 'Avenir Black'; font-weight: 400; color: #333; font-size: 1.6rem; } .single-landing-pages ul:not(.gform_fields):not(.main-menu):not(.menu) { margin: 30px 0 30px; padding-left: 30px; } .single-landing-pages .main p { margin: 26px 0; } .single-landing-pages .generic-button { max-width: 320px; } .single-landing-pages .green, .single-landing-pages .green .container { background-color: #D4E7C7; } .single-landing-pages .grey, .single-landing-pages .grey .container { background-color: #f0f0f0; } .single-landing-pages .tan, .single-landing-pages .tan .container { background-color: #F7F6F0; } .single-landing-pages .darkgreen, .single-landing-pages .darkgreen .container { background-color: #364743; color: #fff; } .single-landing-pages .main .gform_button { text-transform: uppercase; } .single-landing-pages .gform_validation_errors { padding: 0; border-left:none; margin: 0; } .single-landing-pages h2.gform_submission_error { font-size: 1rem !important; margin: 0 !important; } .landingPageHeader { position: relative; } .landingPageHeader .top { margin-top: 2%; padding: 46px 0 60px; } .landingPageHeader .top .tanBox { background-color: #F7F6F0; padding: 24px 8% 24px 30px; margin-left: 6%; max-width: 640px; display: inline-block; width: 55%; } .landingPageHeader .top .tanBox.lessPadding { padding: 24px 30px; } .landingPageHeader .top .tanBox h4 { padding-top: 15px; font-family: inherit; } .landingPageHeader .bottom { padding:3% 0 5%; } .landingPageHeader .text { float: left; width: 55%; } .single-landing-pages .odContainer ol { padding-left: 46px; } .single-landing-pages .odContainer ol li::marker { font-family: 'baskerville'; font-size: 2.2rem; font-style: italic; line-height: 0.5; } .single-landing-pages .odContainer ol li:before { position: absolute; content: ""; display: block; width: 40px; height: 40px; top: -10px; left: -45px; background-color: #D4E7C7; z-index: -1; } .single-landing-pages .odContainer ol li { line-height: 1.4; padding: 0 0 20px 10px; position: relative; text-align: left; } .landingPageHeader .text p { margin-top: 0; } .landingPageHeader .form { background-color: #f0f0f0; float: right; width: 33%; padding: 30px; position: absolute; top:46px; right: 8%; } .landingPageHeader .form > h2 { text-align: center; font-family: 'Avenir Black'; font-weight: 400; max-width: 300px; margin: 0 auto !important; } .landingPageHeader .form > p { text-align: center; font-size: 1rem; margin: 16px 0 5px; } .landingPageHeader .form .gform_wrapper { border: none; padding: 20px 0; } .landingPageHeader .form .gform_footer { padding-top: 10px; } .landingPageHeader .form .gform_footer .button { white-space: normal; height: auto; line-height: 1.4; padding: 14px 20px 12px; } .single-landing-pages #field_35_35 { display: none; } .tanBoxImage { padding: 4% 0; } .tanBoxImage.darkGreen { background-color: #364743; color: #fff; } .tanBoxImage.darkGreen h1 { color: #fff; } .tanBoxImage .odContainer { display: flex; justify-content: space-between; } .tanBoxImage.paddingLow .text { position: relative; width: 45%; } .tanBoxImage.paddingMedium .text { position: relative; width: 41%; padding: 1% 0 4%; } .tanBoxImage.paddingHigh .text { position: relative; width: 41%; padding: 5% 0 8%; } .tanBoxImage .text:before { content: ""; background-color: #F7F6F0; display: block; position: absolute; z-index: -1; left: 21%; top: 0; width: 98%; height: 100%; } .tanBoxImage.paddingLow .text:before { top: 12%; width: 84%; height: 72%; } .single-landing-pages .tanBoxImage.paddingLow h1 { font-size: 2.4rem !important; } .single-landing-pages .tanBoxImage.paddingLow p { margin: 20px 0; } .tanBoxImage .image { width: 40%; } .tanBoxImage.paddingLow .image { width: 48%; } .tanBoxImage .generic-button { margin-top: 10px; } .landingPageContent:not(.fullWidth) { padding: 4% 0; } .landingPageContent .odContainer { display: flex; justify-content: space-between; align-items: center; } .landingPageContent .text, .landingPageContent .image { width: 48%; } .landingPageContent .text h3 { margin-top: 0 !important; } .landingPageContent.fullWidth .odContainer { max-width: 100%; padding: 0; } .landingPageContent.fullWidth .image { align-self: stretch; width: 50%; min-height: 400px; } .landingPageContent.fullWidth .text { padding: 4% 2% 6% 6%; width: 50%; } @media only all and (min-width: 721px) { .landingPageContent.alignRight .image { order:2; } } .landingPageForm { background-color: #F7F6F0; padding: 6% 0 8%; } .landingPageFormWhite { background-color: #FFFFFF;} .landingPageForm .odContainer { max-width: 750px; } .landingPageForm h2 { text-align: center; } .landingPageForm p { text-align: center; } .landingPageForm .gform_wrapper { border: none; background-color: transparent; } .landingPageForm .gform_wrapper textarea { height: 150px; } .landingPageForm .gform_footer button[type="submit"] { background-color: #364743; } .lpVision { padding: 4% 0; } .lpVision .odContainer { text-align: center; max-width: 1010px; } .lpVision p, .single-landing-pages .biggerText { font-size: 1.5rem; } .lpEssentialsSwatches { padding: 4% 0; text-align: center; } .lpEssentialsSwatches .odContainer { max-width: 780px; } .lpEssentialsSwatches .features { font-size: 1.85rem; } .lpEssentialsSwatches .swatches { display: flex; flex-wrap:wrap; justify-content: center; gap: 7%; padding-top: 3%; } .lpEssentialsSwatches .swatches a { display: block; width: 142px; margin-bottom: 6%; } .lpEssentialsSwatches .swatches div { height: 142px; margin-bottom: 15%; } .lpEssentialsSwatches .swatches span { text-transform: uppercase; } .lpEssentialsSwatches .swatches a:hover span { text-decoration: underline; } .ctaIcons { background-color: #f0f0f0; text-align: center; padding: 4% 0 6%; } .ctaIcons.darkGreen { background-color: #F7F6F0; } .ctaIcons p { max-width: 900px; margin: 26px auto 30px !important; } .ctaIcons .generic-button { margin-top: 20px; } .ctaIcons .icons { display: flex; flex-wrap:wrap; justify-content:space-around; } .ctaIcons .ctaIcon { width: 22%; display: block; max-width: 262px; } .ctaIcons .ctaIcon img { margin: 20px 0; } .whiteEdges { margin: 0 50px; } .largerText h2 { font-size: 3rem !important; margin: 0 !important; } .largerText p { font-size: 1.5rem; margin-top: 10px; line-height: 1.3; } .darkLogoHeader { padding: 20px 0; } .darkLogoHeader .odContainer { display: flex; justify-content: center; } .darkLogoHeader img { display: block; } .darkLogoHeader .separator { width: 1px; display: inline-block; background-color: #fff; margin: 0 20px; } .darkLogoHeader h2 { margin: 0 !important; } .darkLogoHeader h2 a { font-style: italic; color: #fff; font-weight: 600; text-decoration: underline; } .catalogHeader { background-image: url('/wp-content/uploads/2023/11/DSC4070A.png'); height: 59vh; } .catalogPop { position: relative; height: 66px; } .catalogPop img { max-width: 430px; position: absolute; z-index: 10; left: calc(50% - 215px); top: -115px; } .startDreaming { padding: 6% 0 7%; text-align: center; position: relative; } .startDreaming .odContainer { max-width: 820px; } .catalogQuote { padding: 70px 0; text-align: center; position: relative; } body.catalog .catalogQuote:before, body.catalog .startDreaming:before, .getDesignBook:after { content: ""; width: 1px; height: 100px; background-color: #ccc; position: absolute; z-index: 2; } .catalogQuote:before, body.catalog .startDreaming:before { top: -50px; } .catalogQuote:after, .getDesignBook:after { bottom: -50px; } .catalogQuote .quote { font-size: 2.5rem; font-family: 'baskerville'; padding: 0 10px; } .catalogQuote .source { text-transform: uppercase; } .getDesignBook { text-align: center; padding: 8% 0; position: relative; } .getDesignBook p { max-width: 850px; margin-left: auto !important; margin-right: auto !important; } .imageHeaderLeftBanner .odContainer { max-width: 100%; padding: 0; } .imageHeaderLeftBanner.designConsultation { background-image: url('/wp-content/uploads/2024/03/design-consultation.png'); } .imageHeaderLeftBanner.builderConsultation { background-image: url('/wp-content/uploads/2025/03/12022-BB62DB8C-4326-49F3-935B-75ECB307FFC6.png'); } .imageHeaderLeftBanner.designerConsultation { background-image: url('/wp-content/uploads/2025/03/CARL-LP-Consultation-v2.2-Photo4.png'); } .imageHeaderLeftBanner h1 { background-color: #364743; font-style: italic; color: #F7F6F0; font-size: 2.5rem !important; display: inline-block; padding: 7px 26px 13px 5%; margin: 4% 0 42.5%; } @media only all and (max-width: 727px) { .landingPageLogo{ width: 100%; text-align: center; } .landingPageBar{ display: none; } .landingPageTitle{ width: 100%; text-align: center; } } .darkGreenOffsetImage:first-child { padding-top: 5%; } .darkGreenOffsetImage .offset { display: flex; background-color: #364743; color: #fff; justify-content: space-between; align-items: center; } .darkGreenOffsetImage.left .offset { margin-left: 50px; padding: 3.5% 3.5% 3.5% 20px; } .darkGreenOffsetImage.right .offset { margin-right: 50px; padding: 3.5% 20px 3.5% 3.5%; } .darkGreenOffsetImage .image { width: 44%; position: relative; } .darkGreenOffsetImage.left .image { left: -70px; } .darkGreenOffsetImage.right .image { right: -70px; } .darkGreenOffsetImage .text { width: 56%; } .darkGreenOffsetImage .text h2 { max-width: 520px; } .darkGreenOffsetImage .text h5 { font-weight: 400; } .darkGreenPopImage .image img { display: block; } .darkGreenPopImage .text { margin: 0 50px; background-color: #364743; color: #fff; } .darkGreenPopImage .columns { display: flex; } .darkGreenPopImage h2 { text-align: center; margin: 0 !important; padding: 3.5% 20px 20px; } .darkGreenPopImage .columns p { width: 50%; padding: 0 24px; } .darkGreenPopImage .columns p:last-child { border-left:1px solid #979797; } .fixedMobileButton { display: none; position: fixed; bottom: 0; right: 0; left: 0; z-index: 1000; text-align: center; padding: 20px; } @media only all and (min-width: 1600px) { .landingPageHeader .form { width: 24%; right: 14%; } } @media only all and (max-width: 1370px) { .landingPageHeader .top .tanBox { margin-left: 20px; } } @media only all and (max-width: 1250px) { .tanBoxImage .text { width: 46%; } .tanBoxImage .text:before { left: 15%; } .landingPageHeader .form { right: 20px; width: 38%; } .catalogQuote .quote { font-size: 2rem; } } @media only all and (max-width: 1100px) { .landingPageHeader .top .tanBox { padding: 24px 30px; } .landingPageContent.fullWidth .text { padding: 4% 3% 6% 3%; } } @media only all and (max-width: 1000px) { .single-landing-pages h1, .single-landing-pages .tanBoxImage h2 { font-size: 2.4rem !important; } .single-landing-pages .tanBoxImage.paddingLow h1 { font-size: 2rem !important; } .single-landing-pages h4 { font-size: 1.4rem; } .single-landing-pages div.home-logo { margin-top: 6%; } .tanBoxImage, .landingPageContent:not(.fullWidth) { padding: 10% 0; } .ctaIcons .ctaIcon { width: 35%; padding: 3% 0; } .darkGreenOffsetImage.left .offset { margin-left: 30px; } .darkGreenOffsetImage.right .offset { margin-right: 30px; } .darkGreenOffsetImage.left .image { left: -50px; } .darkGreenOffsetImage.right .image { right: -50px; } .darkLogoHeader .odContainer { display: block; text-align: center; } .darkLogoHeader img { display: inline-block; } .darkLogoHeader .separator { display: block; width: 50px; height: 1px; background-color: #fff; margin: 20px auto; } .darkLogoHeader h2 { display: block; } .catalogPop img { max-width: 380px; left: calc(50% - 190px); top: -110px; } } @media only all and (max-width: 850px) { .landingPageHeader .top { margin-top: 4%; } .landingPageHeader .top .tanBox, .landingPageHeader .top .tanBox.lessPadding { padding: 14px 20px; } .ginput_complex .name_first, .ginput_complex .name_last, .gfield--width-half { float: none; width: 100%; display: inline-block; } .ginput_complex .name_first { margin-bottom: 1em; } .lpVision p, .single-landing-pages .biggerText { font-size: 1.25rem; } .lpEssentialsSwatches .features { font-size: 1.5rem; } .largerText h2 { font-size: 2.4rem !important; } .largerText p { font-size: 1.1rem; } .catalogQuote .quote { font-size: 1.6rem; } .getDesignBook, .startDreaming { padding: 90px 0; } .landingPageForm { padding: 70px 0; } .getDesignBook h2 { margin-top: 0 !important; } .catalogPop img { max-width: 330px; left: calc(50% - 165px); top: -80px; } } @media only all and (max-width: 720px) { .single-landing-pages div.home-logo { margin: 6% 0; } .tanBoxImage { background-color: #F7F6F0; padding: 1px 0 0; } .tanBoxImage .odContainer { flex-wrap:wrap; padding: 0; } .tanBoxImage.paddingLow .text, .tanBoxImage.paddingMedium .text, .tanBoxImage.paddingHigh .text, .tanBoxImage .image, .tanBoxImage.paddingLow .image, .landingPageContent .text, .landingPageContent .image, .landingPageContent .image img, .landingPageContent.fullWidth .image, .landingPageContent.fullWidth .text { width: 100%; } .tanBoxImage.paddingLow .text, .tanBoxImage.paddingMedium .text, .tanBoxImage.paddingHigh .text { padding: 0 20px 8%; } .tanBoxImage .text, .tanBoxImage.imageLast .image, .landingPageContent.imageLast .image { order:2; } .tanBoxImage .text h1:first-child { margin-top: 20px; } .tanBoxImage .text:before { display: none; } .tanBoxImage .image { padding: 40% 0; } .landingPageContent { text-align: center; } .landingPageContent.noPadding { padding: 0 !important; } .landingPageContent .odContainer { flex-wrap:wrap; } .landingPageContent.noPadding .odContainer { padding: 0; } .landingPageContent.imageLast .text { padding-bottom: 8%; } .landingPageContent.noPadding .text { padding: 5% 20px 6%; } .landingPageContent ul { text-align: left; max-width: 360px; margin-left: auto !important; margin-right: auto !important; } .landingPageHeader .odContainer { padding: 0; } .landingPageHeader .top .tanBox { width: calc(100% - 40px); margin: 0 20px; } .landingPageHeader .text { float: none; width: 100%; } .landingPageHeader .text ol { padding: 0 20px 0 65px; } .landingPageHeader .text p { padding: 0 20px; } .landingPageHeader .bottom { padding:8% 0 0; } .landingPageHeader .form { float: none; width: 100%; position: relative; right: 0; top: 0; padding: 40px 30px 30px; } .landingPageHeader .form > h2 { max-width: 100%; } .landingPageHeader .form img { width: 300px; margin: 0 auto; display: block; } .ctaIcons { padding: 3% 0; } .ctaIcons .icons { display: block; } .ctaIcons .ctaIcon { width: 100%; margin: 10% auto; } .ctaIcons.inlineMobile { padding: 12% 0 12%; } .ctaIcons.inlineMobile .ctaIcon { display: flex; align-items: center; gap: 20px; text-align: left; margin: 0 auto; } .ctaIcons.inlineMobile h5 { font-weight: 400; } .ctaIcons.inlineMobile .ctaIcon img { max-width: 100px; max-height: 70px; flex-basis: 230px; margin: 5px 0; } .whiteEdges { margin: 0; } .darkGreenOffsetImage .offset { flex-wrap: wrap; padding: 20px; } .darkGreenOffsetImage:first-child { padding-top: 16%; } .darkGreenOffsetImage .image { width:100%; max-width: 280px; margin: 0 auto; order:0; } .darkGreenOffsetImage .text { width: 100%; text-align: center; order:1; } .darkGreenOffsetImage .text h5 { padding-top: 20px; } .darkGreenOffsetImage .text h2 { max-width: 100%; } .darkGreenOffsetImage.left .offset { margin-left: 0; } .darkGreenOffsetImage.right .offset { margin-right: 0; } .darkGreenOffsetImage.left .image, .darkGreenOffsetImage.right .image { left: 0; right:0; top:-40px; margin-bottom: -40px; } body:not(.catalog) .catalogQuote { padding: 5% 0; } .darkGreenPopImage .odContainer { padding: 0; } .darkGreenPopImage .columns { display: block; padding: 1px 0; } .darkGreenPopImage .columns p { width: 100%; text-align: center; padding: 0 20px; } .darkGreenPopImage .columns p:last-child { border-left:none; } .catalogPop { height: 110px; } .catalogPop img { top:-32px; } .fixedMobileButton { display: block; } } @media only all and (max-width: 550px) { .single-landing-pages h1, .single-landing-pages .tanBoxImage h2 { font-size: 2.1rem !important; } .single-landing-pages div.home-logo { margin: 6% 0; } .single-landing-pages div.home-logo svg { max-width: 240px; } .landingPageContent:not(.fullWidth) { padding: 10% 0; } .landingPageContent.noPadding .text { padding: 4% 20px 8%; } .landingPageHeader .top { padding: 20% 0; } .ctaIcons .ctaIcon { margin: 15% auto; } .ctaIcons.inlineMobile { padding: 12% 0 22%; } .imageHeaderLeftBanner { text-align: center; } .imageHeaderLeftBanner h1 { padding: 17px 26px 23px 26px; margin: 0 30px 90%; } .darkGreenPopImage .odContainer { overflow: hidden; } .darkGreenPopImage h2 { padding: 20px; } .darkGreenPopImage .image { width: 200%; position: relative; left: -50%; } .darkGreenPopImage .text { margin: 0 20px; } } @media only all and (max-width: 440px) { .darkLogoHeader h2, .largerText h2, .getDesignBook h2, .landingPageForm h2 { margin: 0 auto !important; } .largerText h2, .getDesignBook h2 { max-width: 234px; } .catalogHeader { height: 50vh; } .catalogQuote .quote { font-size: 1.4rem; line-height: 1.4; } } /* top menu search and overlay */ .search-form-container a { font-weight: bold !important; padding: 0 !important; } .search-form-container a span { padding-right: 5px; } #globalSearch { visibility: hidden; opacity:0; position: fixed; width: 100%; height: 100%; background-color: #f7f6f0; top: 0; -webkit-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; z-index: 999; } #globalSearch.visible { visibility: visible; opacity:1; } #globalSearch > div { padding: 0 3%; position: relative; top: 180px; } #globalSearch > div .closeX, #globalSearch > div .closeX:hover { font-size: 1.2rem; color: #333; line-height: 1; cursor: pointer; float: right; text-decoration: none; } #globalSearch > div .closeX span { border: 1px solid #333; border-radius: 20px; padding: 3px 6px 0 6px; } #globalSearch > div form { text-align: center; padding: 24vh 0; } #globalSearch > div input { font-size: 3rem; font-family: 'baskerville'; font-style: italic; border: none; border-bottom: 1px solid #333; background-color: transparent; vertical-align: bottom; width: calc(100% - 150px); max-width: 600px;} #globalSearch > div button { background-color: #577b43; border: none; color: #fff; font-size: 1.13rem; padding:20px 30px 15px; margin-left: 5px; border-radius: 2px; -webkit-appearance: none; -moz-appearance: none; appearance: none; text-transform: uppercase; } @media only all and (max-width: 550px) { #globalSearch > div input { font-size: 2rem; } } /* testimonials page */ .testimonialsIntro { padding: 3% 0 5%; } .testimonialsIntro .odContainer div { padding: 10px 0 30px 17%; position: relative; font-size: 1.4rem; } .testimonialsIntro .odContainer div:before { content: ""; background-color: #D4E7C7; display: block; position: absolute; z-index: -1; left: 0; top: 0; width: 31%; height: 100%; } .testimonialsIntro .odContainer div h2 { font-family: 'Avenir Black'; font-size: 3rem !important; } .testimonialsIntro .odContainer div p { padding-top: 20px; } .testimonials-gutter { width: 3.5%; } .testimonials.masonry .testimonials-items .item { display: inline-block; width: 31%; margin-bottom: 4%; } .testimonials.masonry .testimonials-items .item:not(.background) { padding: 7% 3% 3% 5%; } .testimonials .testimonials-items .background { background-position: center bottom; } .testimonials-items .item { font-size: 1rem; background-color: #F0F0F0; } .testimonials-items .item.beige { background-color: #F7F6F0; } .testimonials-items .item.green { background-color: #D4E7C7; } .testimonials-items .item .source { font-family: 'baskerville'; font-weight: 600; padding-top: 8%; } .testimonials-items .item .mark { font-size: 6rem; line-height: 0; position: relative; left: -13px; font-family: baskerville; font-style: italic; padding-bottom: 8%; } .testimonials-items .item.customer1 { padding: 24% 0; background-image: url('/wp-content/uploads/2022/07/CustomerImage1.png'); } .testimonials-items .item.customer2 { padding: 18.6% 0; background-image: url('/wp-content/uploads/2022/07/CustomerImage2.png'); } .testimonials-items .item.customer4 { padding: 27.4% 0; background-image: url('/wp-content/uploads/2022/07/CustomerImage4.png'); } .testimonials-items .item.worker1 { background-image: url('/wp-content/uploads/2022/07/WorkerImage1.png'); } .testimonials-items .item.worker2 { padding: 26.3% 0; background-image: url('/wp-content/uploads/2022/07/WorkerImage2.png'); } .testimonials.grid { padding: 3.2% 0; } .testimonials.grid .testimonials-items { display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap:3.5%; } .testimonials.grid .testimonials-items .item { padding: 22% 10% 9% 16%; } .testimonials.grid .testimonials-items .item.green { margin-bottom: 12%; } .testimonials-items .span-row { grid-row-end: span 2; } .testimonialsFullImage { padding-bottom: 2.6%; } body.testimonials footer.body-footer { margin-top: 0; } @media only all and (min-width: 1200px) { body.testimonials .testimonial.slider .title { width: 30%; } } @media only all and (max-width: 1100px) { .testimonialsIntro .odContainer div { font-size: 1.1rem; padding: 10px 0 30px 10%; } .testimonialsIntro .odContainer div h2 { font-size: 2.4rem !important; } .testimonials.masonry .testimonials-items .item:not(.background) { padding: 7% 2% 3% 3%; } .testimonials.grid .testimonials-items .item { padding: 20% 5% 9% 10%; } } @media only all and (max-width: 800px) { .testimonials.masonry .testimonials-items .item { width: 48%; } .testimonials-gutter { width: 4%; } .testimonials-items .item.worker1 { display: none; } .testimonials.grid .testimonials-items { grid-template-columns: 1fr 1fr; column-gap: 4%; } .testimonials.grid .testimonials-items .item.green { margin-bottom: 8%; } .testimonials-items .item.background { padding: 30% 0 !important; } .april2021cta.absoluteImage .left img { max-width: 300px; } } @media only all and (max-width: 660px) { .testimonialsSlider { background-color: #F7F6F0; } .testimonials.masonry .testimonials-items .item:not(.background) { padding: 12% 2% 3% 3%; } } @media only all and (max-width: 640px) { .april2021cta.absoluteImage .left { display: none; } .april2021cta.absoluteImage .right { border-top: none; margin: 0; padding: 0; } } @media only all and (max-width: 500px) { .testimonialsIntro { padding: 0 0 8%; } .testimonialsIntro .odContainer div { padding: 1px 0 20px 6%; } .testimonialsIntro .odContainer div h2 { font-size: 1.8rem !important; } .testimonials.masonry .testimonials-items .item { width: 100%; margin-bottom: 8%; } .testimonials-gutter { width: 0; } .testimonials.masonry .testimonials-items .item:not(.background), .testimonials.grid .testimonials-items .item { padding: 6%; margin-bottom: 8%; } .testimonials-items .item.background { padding: 70% 0 !important; } .testimonials-items .item .mark, .testimonialsFullImage { display: none; } .testimonials.grid { padding: 8% 0 0; } .testimonials.grid .testimonials-items, .testimonials-items .item.worker1 { display: block; } body.testimonials .testimonial { margin: 0; } } /* color swatches on /our-floors/choosing-a-wood-flooring-color/ */ .colorSwatches { text-align: center; } .colorSwatches .odContainer .grid { display: grid; grid-template-columns:repeat(7, 1fr); column-gap: 2%; background-color: #fff; padding: 30px 30px 7px; margin-top: 4%; } .colorSwatches .odContainer .tooltip-block { margin-bottom: 16%; } .colorSwatches .odContainer img { display: block; } .colorSwatches .odContainer .tooltip-block.bigger { grid-row-end: span 2; grid-column-end: span 2; margin-bottom: 8%; } .colorSwatches .odContainer .tooltip-block.bigger img { width: 100%; } .colorSwatches .tooltip-block span.tooltip { margin-left: 0; bottom: 80%; left: calc(50% - 60px); -ms-transform: translateY(0px); transform: translateY(0px); } .colorSwatches .tooltip-block:hover span.tooltip { bottom: calc(100% + 10px); } @media only all and (max-width: 750px) { .colorSwatches .odContainer .grid { grid-template-columns: repeat(3, 1fr); column-gap: 4%; padding: 20px 20px 7px; } .colorSwatches .odContainer .tooltip-block, .colorSwatches .odContainer .tooltip-block.bigger { margin-bottom: 14%; } .colorSwatches .odContainer .tooltip-block.bigger { grid-row-end: span 1; grid-column-end: span 1; } } /* mega menu */ .main { padding-top: 120px; } .newsBarVisible .main { padding-top: 171px; } .dark-border-button { text-decoration: none; border: 2px solid #333; text-transform: uppercase; text-align: center; font-weight: bold; display: inline-block; padding: 9px 20px 6px 20px; color: color(darker-grey);} .dark-border-button:hover { background-color: #6e9b51; color: #fff; border-color: #6e9b51; } @media only all and (min-width: 1117px) { .dark-border-button + .dark-border-button { margin-left: 10px; } } .body-header .header-menus { display: inline-block; } .body-header .header-menus ul { list-style:none; } .body-header .header-menus li { display: inline-block; } .body-header .header-menus li a { white-space: nowrap; } .body-header > .header-bottom { height: 90px; border-bottom: 1px solid #333; } #mega-menu-wrap-main_menu { float: right; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link { margin: 0 28px; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item:hover > a.mega-menu-link { border-color: #577b43; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item.button > a.mega-menu-link { background-color: #577b43; color: #fff; border-bottom: 0px; line-height: 36px; height: 36px; padding: 2px 16px 0; margin-bottom: 4px; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item.button > a.mega-menu-link:hover { background-color: #6E9B51; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-item.mega-menu-megamenu > ul.mega-sub-menu > li > ul.mega-sub-menu { display: flex; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column { padding-top: 20px; padding-bottom: 20px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column:first-child { padding-left: 20px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column:last-child { padding-right: 20px; } .mega-menu img { width: 100%; display: block; } #mega-menu-wrap-main_menu #mega-menu-main_menu .iframeVideo { margin-bottom: 4%; } .mega-toggle-block { padding-top: 18px; } .menu-item.xoo-wsc-menu-item { display: inline-block; vertical-align: middle; } span.xoo-wsc-sc-count { line-height: 20px; } .xoo-wsc-modal { z-index: 2147483647; position: relative;} .iframeVideo { position: relative; padding-bottom: 57%; } .iframeVideo iframe { position: absolute; width: 100%; height: 100%; left: 0; } .wp-video {width: 100% !important;} .wp-video video, .wp-video .wp-video-shortcode { width: 100% !important; max-width: 100%; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column.collections { padding-right: 3%; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-item.mega-menu-megamenu ul.mega-sub-menu li.collections ul.mega-sub-menu { display: grid; grid-template-columns: 1fr 1fr 1fr; } .mega-menu h4 { font-size: 1.1rem; } .mega-menu h5 { text-transform: uppercase; padding-bottom: 14px; } .mega-menu h6 { font-weight: normal; } .mega-menu .collections .widget_custom_html { grid-column-end: span 3; } #mega-menu-wrap-main_menu #mega-menu-main_menu .collections .widget_custom_html p { margin: 5px 0 1px; color: #555; } .mega-menu .collections .widget_custom_html .dark-border-button { margin-top: 13px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column.colors { padding-right: 20px; } .mega-menu .colors li a:after { content:''; position: absolute; width: 23px; height: 23px; top: -3px; right: 0; display: block !important; } .mega-menu .colors li.brown a:after { background-color: #9b6140; } .mega-menu .colors li.dark a:after { background-color: #332522; } .mega-menu .colors li.gray a:after { background-color: #79756a; } .mega-menu .colors li.light-brown a:after { background-color: #b18261; } .mega-menu .colors li.natural a:after { background-color: #d8c0a8; } .mega-menu .colors li.white a:after { background-color: #ddd; } .mega-menu .featured .left { float: left; width: 42%; text-transform: uppercase; } #mega-menu-wrap-main_menu #mega-menu-main_menu .featured .left p { margin-bottom: 4px; } .mega-menu .featured .left h5 { padding-bottom: 0; } .mega-menu .featured .right { float: right; width: 58%; text-align: right; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.designCustom { width: 33%; } #mega-menu-wrap-main_menu #mega-menu-main_menu .designCustom .widget_custom_html p { margin: 10px 0 0; color: #555; } .mega-menu .structure hr { max-width: 170px; margin: 0; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.species1 { width: 14.66667%; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.species2 { width: 12%; } #mega-menu-wrap-main_menu #mega-menu-main_menu .species2 ul.mega-sub-menu { padding-top: 46px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.customColor { background-color: #F7F6F0; padding-left: 25px; width: 23.7%; } #mega-menu-wrap-main_menu #mega-menu-main_menu .customColor .widget_custom_html p { margin-top: 10px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.howTo { width: 24%; padding-right: 30px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.resources { width: 22%; padding-left: 20px; padding-right: 20px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.inspiration { width: 26%; padding-right: 30px; } .mega-menu .inspiration h6 { padding-top: 29px; } .mega-menu .inspiration .dark-border-button { white-space: normal; padding: 9px 10px 6px 10px; font-weight: normal; border-width: 1px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.quiz { width: 29%; background-color: #F7F6F0; padding-left: 25px; } #mega-menu-wrap-main_menu #mega-menu-main_menu .quiz img { padding: 14px 0; max-width: 220px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row.about ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link { text-transform: none; font-weight: bold; font-size: 1.1rem; padding-top: 12px; } #mega-menu-wrap-main_menu #mega-menu-main_menu .about .widget_custom_html p { color: #555; font-size: 1rem; } #menu-mega-menu.sitemap ul { padding: 0 0 0 20px; } #menu-mega-menu.sitemap #wpmenucartli, #menu-mega-menu.sitemap li.button { display: none; } @media only all and (max-width: 1300px) { #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link { margin: 0 20px; } } @media only all and (max-width: 1199px) { .main { padding-top: 90px; } .newsBarVisible .main { padding-top: 141px; } .body-header > .header-bottom { height: 60px; } .body-header .home-logo { padding-top: 13px; } .body-header .header-menus .top-level-item > a { padding: 0 10px; } .body-header .search-form-container { margin-left: 10px; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link { margin: 0 10px; line-height: 60px; height: 60px; } } @media only all and (min-width: 970px) and (max-width: 1040px) { .mega-menu-link span { display: none; } } @media only all and (max-width: 970px) { .main { padding-top: 89px; } .newsBarVisible .main { padding-top: 140px; } body.mega-menu-main_menu-mobile-open .body-header { position: static; } .body-header > .container { padding: 0 20px; } .body-header .topBar { padding: 4px 20px 5px; } .body-header .topBar { text-align: center; } .body-header .search-form-container { display: none; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item.button > a.mega-menu-link { text-align: center; max-width: 200px; margin: 0 auto; } #mega-menu-wrap-main_menu #mega-menu-main_menu { top: 60px; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.3); } .wpmenucartli { margin: 10px 10px !important; text-align: center !important; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-column { padding: 10px !important; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column { width: 100%; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link { margin: 0; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu { padding: 0; } #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu { box-shadow: none; } #mega-menu-41274-0-2, #mega-menu-41286-0-4, #mega-menu-item-custom_html-9, #mega-menu-item-custom_html-12, #mega-menu-item-custom_html-13 { display: none !important; } } @media only all and (max-width: 767px) { .main { padding-top: 109px; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-item.mega-menu-megamenu > ul.mega-sub-menu > li > ul.mega-sub-menu { display: block; } .mega-menu h5, #mega-menu-wrap-main_menu #mega-menu-main_menu .species2 ul.mega-sub-menu { padding: 0; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.species1, #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.about1 { padding-bottom: 0 !important; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.species2, #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.about2 { padding-top: 0 !important; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.quiz .textwidget { text-align: center; } #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.quiz .textwidget a { margin: 0 auto; width: 220px; display: block; } } @media only all and (max-width: 550px) { .body-header .header-menus .top-level-item > a { padding: 0 8px; } } @media only all and (max-width: 420px) { .main { padding-top: 128px; } } @media only all and (max-width: 374px) { .main { padding-top: 146px; } .body-header .header-menus .top-level-item > a { padding: 0 5px; } } /* product gallery with video */ .tc_video_slide.nslick-slide .product_video_iframe { max-height: 583px !important; } .nslick-current.nslick-active span.nickx-popup { display: none; } .nickx-slider-for { margin-bottom: 0; } .nslick-track.techno_stop_slide { width: auto !important; padding: 5px 0; display: flex; justify-content: center; } #nickx-gallery .nslick-slide { max-width: 110px; border: none; padding: 5px; } .nickx-slider-for .nslick-list.draggable .nslick-slide:first-child { min-height: auto !important; } #cmplz-manage-consent .cmplz-show { display: none; } #drift-frame-controller { z-index: 2147483646 !important; } body.woocommerce-checkout:not(.woocommerce-order-received) .product-title-block, body.woocommerce-checkout:not(.woocommerce-order-received) section.page_block { background-color: #F7F6F0; } body.woocommerce-checkout .product-title-block { padding: 60px 0 20px; } body.woocommerce-checkout .page_block_content { max-width: 100%; padding: 0 10px; } body.woocommerce-checkout .content_column { padding: 0; margin: 0; } body.woocommerce-checkout form.woocommerce-checkout .woocommerce-checkout-review-order .woocommerce-checkout-payment .place-order { margin: 0; padding: 30px 0 !important; } body.woocommerce-checkout .woocommerce > p, body.woocommerce-checkout .woocommerce > h3 { text-align: center; margin: 0 0 30px !important; } body.woocommerce-checkout .woocommerce .woocommerce-notices-wrapper { margin: 0 20px; } body.woocommerce-checkout .woocommerce-cart-form .shop_table { justify-content: center; gap: 6%; } body.woocommerce-checkout .woocommerce .cart-item { padding-bottom: 30px; } body.woocommerce-checkout .woocommerce .return-to-shop { padding: 30px 0 40px; margin: 0 !important; } #customer_details { background-color: #fff; padding: 0 10px; margin: 0 -10px; /* hate this, but don't see any other option */ } #customer_details h3 { margin: 50px 0 30px !important; } .woocommerce-billing-fields { max-width: 960px; margin: 0 auto; } .woocommerce-cart-form .product-name, .woocommerce-cart-form .product-remove, .woocommerce .return-to-shop, .woocommerce-billing-fields h3, #order_review { text-align: center; } .woocommerce-cart-form .product-thumbnail { max-width: 180px; } .woocommerce-cart-form .product-name .collection { font-size: 0.8rem; text-transform: uppercase; display: block; margin-top: 10px; } .woocommerce-cart-form .product-name .product { font-weight: 500; display: block; margin-top: 9px; } .woocommerce-cart-form .product-remove { font-size: 0.9rem; margin-top: 11px; } .woocommerce-cart-form .product-name a { text-decoration: none; } .woocommerce-cart-form a:hover { text-decoration: underline; } #billing_address_2_field label, #billing_address_2_field label span { visibility: hidden; } #billing_postcode_field { clear: both; } button#place_order { text-transform: uppercase; } .checkout-disclaimer { background-color: #fff; text-align: center; margin: 0 -10px; } .checkout-disclaimer p { margin: 24px auto 0; max-width: 700px; } @media only all and (max-width: 410px) { body.woocommerce-checkout .woocommerce .cart-item, .woocommerce-cart-form .product-thumbnail { max-width: 150px; } .woocommerce form .form-row-first, .woocommerce-page form .form-row-first, .woocommerce form .form-row-first, .woocommerce-page form .form-row-last { float: none; width: 100%; } } .blogCTA { padding: 20px 8%; background-color: #F7F6F0; display: flex; gap: 4%; clear: both; } p + .blogCTA { margin-top: 30px; } .blogCTA .left { background-color: #333; width: 32%; } .blogCTA .left img { width: 130%; max-width: none; display: block; padding: 5px 0 0px 5px; } .blogCTA .right { width: 68%; padding-left: 9%; } .blogCTA .right h2 { margin-top: 11px !important; } @media only all and (max-width: 1020px) { .blogCTA { padding: 20px; } .blogCTA .right h2 { font-size: 26px !important; } } @media only all and (max-width: 680px) { .blogCTA { display: block; text-align: center; } .blogCTA .left { width: 100%; max-width: 188px; margin: 0 auto; } .blogCTA .left img { position: relative; left: -30px; } .blogCTA .right { width: 100%; padding-left: 0; max-width: 270px; margin: 0 auto; } } .product-item .newProduct { color: #fff; background-color: #577b43; border-radius: 3px; position: absolute; top: 10px; left: 10px; z-index: 10; padding: 20px 9px 16px; } .grecaptcha-badge { width: 70px !important; overflow: hidden !important; transition: all 0.3s ease !important; left: 4px !important; } .grecaptcha-badge:hover { width: 256px !important; }