/*=== Into Binary (https://aqualizwater-beta-friday28jan.intobinary.org) © Coryright 2022 Into Binary. All rights reserved. Written for -- www.aqualizwater.co.za ===*/ /*=== LIBRARIES ===*/ /*=== END LIBRARIES ===*/ /*=== CUSTOM ===*/ /*== [reset] ==*/ /*** RESET ***/ *{ margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-family: inherit; vertical-align: baseline; font-size: 1em; font-style: normal; -webkit-font-smoothing:antialiased; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; } *, *::before, *::after { -webkit-transition: .5s; -box-transition: .5s; -o-transition: .5s; transition: .5s; } :hover, :active, :focus { outline: 0; } html, body { min-height: 100%; font-family: sans-serif; font-size: 1rem; position: relative; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body{ margin: 0; padding: 0; line-height: 1; } article, footer, header, section { display: block; } ol, ul { list-style: none; } a{ display: inline-block; text-decoration: none; background-color: transparent; color: initial; } a img { border: none; } a, button, input[type="submit"] { cursor: pointer !important; } img { width: 100%; height: auto; } img::selection { fill: none; color: none; display: none; background: none; } input[type="text"], input[type="number"], input[type="search"], input[type="email"], textarea { text-align: left; max-width: 100%; } input[type="checkbox"], input[type="radio"] { display: none; } input[type="submit"] { background-color: transparent; } label { display: inline; } textarea { resize: vertical; } /*** END RESET ***/ /*== [style] ==*/ /*** CANCEL ***/ /*** CANCEL ***/ /*** Z-INDEX ***/ .u-section.d-has-wings:before .u-section.d-has-wings:after { position: relative; z-index: 10; } .u-section.d-has-wings .u-section-wrap { position: relative; z-index: 20; } .header:after, .header-nav-logo, .m-separatorArea-separator { position: relative; z-index: 30; } .header-banner-block1, .header-banner-image, .header-message, .header-message-content-wrap, .header-nav, .header-nav-cta, .m-separatorArea-header, .m-separatorArea-content { position: relative; z-index: 40; } .header-banner-links, .header-nav-menu-content, .mainArea-map, .waterFiltration-background { position: relative; z-index: 50; } .header-nav-menu-button-label, .mainArea-form, .waterFiltration-group, .waterFiltration-vip, .waterFiltration-content-title { position: relative; z-index: 60; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:after { position: relative; z-index: 70; } .reasons-content-form { position: relative; z-index: 100 !important; } /*** Z-INDEX ***/ /*** COLORS ***/ /* AW Colors: rgb(21, 66, 131); #154283 AW light blue: rgb(243,249,255) */ .u-button.header-banner-cta.nthChild1, .header-nav-cta:hover, .header-nav-cta:active, .header-nav-cta:focus, .header-nav-menu-button-label, .header-nav-menu-button-label:hover, .header-nav-menu-button-label:active, .header-nav-menu-button-label:focus, .header-nav-menu-content-sublist, .milestones-content-timeline-frame-stick:after, .milestones-content-timeline-frame-stick:before, .waterFiltration-content:after, .pg-home .m-separatorArea, .pg-home .quote, .u-section.d-color-darkBlue { background-color: rgb(21, 66, 131); } .header-nav-logo-name, .header-nav-menu-content-link, .keypoint-link { color: rgb(21, 66, 131) !important; } .header-nav-menu-content-link:hover, .header-nav-menu-content-link:hover, .header-nav-menu-content-link:hover, .keypoint-link:hover, .keypoint-link:active, .keypoint-link:focus { border-color: transparent transparent rgb(21, 66, 131) transparent; } .header-nav-menu-content-list-item.has-children:hover .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:active .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:focus .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:hover, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:active, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:focus { background-color: rgb(21, 66, 131); } .header-nav-menu-content-list-item.has-children:hover .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:active .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:focus .header-nav-menu-content-link { border-color: transparent transparent rgb(21, 66, 131) transparent; } .header-message-content-number:hover, .header-message-content-number:active, .header-message-content-number:focus, .header-nav-menu-content-sublink:hover .header-nav-menu-content-sublink-title, .header-nav-menu-content-sublink:active .header-nav-menu-content-sublink-title, .header-nav-menu-content-sublink:focus .header-nav-menu-content-sublink-title, .u-button.header-banner-cta.nthChild1:hover, .u-button.header-banner-cta.nthChild1:active, .u-button.header-banner-cta.nthChild1:focus, .u-button.header-banner-cta.nthChild2:hover, .u-button.header-banner-cta.nthChild2:active, .u-button.header-banner-cta.nthChild2:focus { background-color: #000; } .header-nav-menu-content-sublink:hover .header-nav-menu-content-sublink-image, .header-nav-menu-content-sublink:active .header-nav-menu-content-sublink-image, .header-nav-menu-content-sublink:focus .header-nav-menu-content-sublink-image, .u-button.header-banner-list-nav-button:hover, .u-button.header-banner-list-nav-button:active, .u-button.header-banner-list-nav-button:focus { border-color: #000; } .u-button.header-banner-cta.nthChild2 { color: #000; } .header-message:after, .header-message:before, .header-nav-menu-content-sublink-title { background-color: rgba(0, 0, 0, .5); } .u-separator-border { border-color: rgba(0, 0, 0, .5); } body, html, .pgLayout-other .header:after, .header-nav-cta { background-color: rgb(243,249,255); } .u-separator-border.header-message-content-wrap { border-color: rgb(243,249,255) !important; } .header-message-content-number, .header-message-content-title, .header-nav-cta:hover, .header-nav-cta:active, .header-nav-cta:focus, .header-nav-menu-button-label, .header-nav-menu-content-sublink-title, .u-button.header-banner-cta { color: rgb(243,249,255); } .header-nav-menu-content-list-item.has-children:hover .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:active .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children:focus .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:hover, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:hover, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:hover { color: rgb(243,249,255) !important; } .header-banner-block2:after, .u-button.header-banner-cta.nthChild2, .u-button.header-banner-list-nav-button { background-color: white; } .header-nav-menu-content-sublink-image { border-color: white; } .u-button.header-banner-cta.nthChild2:hover, .u-button.header-banner-cta.nthChild2:active, .u-button.header-banner-cta.nthChild2:focus, .quote-tag-cite, .quote-tag-q { color: white; } .u-section.d-color-grey { background-color: rgb(21, 66, 131); } .u-section.d-color-grey { color: white; } .u-section.d-color-grey { border-color: white; } /*** END COLORS ***/ /*** FONTS ***/ @font-face { font-family: "LayarBahtera Doomsday"; /*src: url("./fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.eot");*/ src: url("../../assets/fonts/LayarBahtera-Doomsday/LayarBahteraDoomsday.ttf"); /* IE9 Compat Modes */ /* src: local("None Away From The Moon"), url("https://coffee.corporomalala.com/assets/fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.eot?#iefix") format("embedded-opentype"), url("../fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.otf.odft") format("opentype"), url("https://coffee.corporomalala.com/assets/fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.svg") format("svg"), url("https://coffee.corporomalala.com/assets/fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.ttf") format("truetype"), url("https://coffee.corporomalala.com/assets/fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.woff") format("woff"), url("https://coffee.corporomalala.com/assets/fonts/None-Away-From-The-Moon/NoneAwayFromTheMoon.woff2") format("woff2"); font-weight: normal; font-style: normal; */ } @font-face { font-family: "UniversLTStd"; src: url("../../assets/fonts/UniversLTStd/UniversLTStd.otf"); } *, .f-fTwo, .u-button { font-family: "UniversLTStd", serif; } .f-fOne, .m-header-title, .u-p-title { font-family: "LayarBahtera Doomsday", sans-serif; } .m-header-title { font-size: 2em; } .reasons-content-box-title { font-size: 1.2em; } p { line-height: 1.5em; } .header-nav-menu { text-align: center; } .header-nav-menu-content-link, .header-nav-menu-content-sublink, .m-header-title { text-transform: capitalize; } .header-message-content-title, .u-button { font-variant: small-caps; } .header-message-content-title, .u-button { text-transform: lowercase; } .header-nav-logo-name, .menu-content-link { white-space: nowrap !important; } /*** FONTS ***/ /*** MEDIA ***/ .milestones-content-figure-placeholder, .pgLayout-home .header:after, .pgLayout-home .header-banner-block2:after { background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-1.png") no-repeat white; background-position: left bottom !important; background-size: auto 100% !important; } .pgLayout-other .header:before, .pgLayout-other .header-banner-block2:after { background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-1.png") no-repeat white; // background-position: center top !important; background-position: top right !important; background-size: 100% auto !important; } .u-section.d-color-grey { background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-7.png") center center; background-size: cover !important; } /* .header-nav-logo, .header-nav-menu { background-color: rgb(243, 249, 255) !important; } .header-banner-title { color: white !important; } .pg-home .header:after, .pg-home .header-banner-block2:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-1.png"); } .pg-aboutUs .header:before, .pg-aboutUS .header-banner-block2:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-5.png"); } .pg-services .header:before, .pg-services .header-banner-block2:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/background-water-6.png"); } .pg-home .header:after, .pg-home .header-banner-block2:after { background-repeat: no-repeat !important; background-color: white !important; background-position: left bottom !important; background-size: auto 100% !important; } .pg-aboutUS .header:before, .pg-aboutUS .header-banner-block2:after, .pg-services .header:before, .pg-services .header-banner-block2:after { background-repeat: no-repeat !important; background-color: white !important; // background-position: center top !important; background-position: top right !important; background-size: 100% auto !important; } */ { background-size: cover !important; } { opacity: .5; } /*** END MEDIA ***/ /*** COMMONS ***/ .u-button { border-radius: 2em; // -webkit-border-radius: .25em; // -moz-border-radius: .25em; // -o-border-radius: .25em; } .header-nav-menu-content-sublink { } /** Utilities **/ .u-button { border-width: .25em; border-style: solid; border-color: transparent; } .u-separator-border { border-width: 0 0 0 .25em; border-style: solid; } .has-icon:after { background-repeat: no-repeat; background-position: center center; background-color: transparent; background-size: cover; } .has-icon.header-message-content-wrap:after { background-size: 100% auto; } .has-icon-phone:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-call-white.png"); } .has-icon-telephone:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-telephone.png"); } .has-icon-whatsapp:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-whatsapp.png"); } .has-icon-email:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-email-white.png"); } .u-p-title { font-size: 1.2em; font-weight: bold; } /** Mixins **/ .m-header { padding: 2em 2em 0 2em; } .m-header.is-side-bottom-left { text-align: left; } .m-header.is-side-bottom-right { text-align: right; } .m-header.is-side-bottom-center { text-align: center; } .m-header.is-side-bottom .m-header-subtitle { position: relative; padding: 1em; margin-top: 1.5em; padding-top: 1em; } .m-header.is-side-bottom .m-header-subtitle:after { content: ""; position: absolute; top: -1em; display: inline-block; width: 2.5em; height: 2.5em; background-color: red; background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/line.png") center center; background-size: cover !important; } .m-header.is-side-bottom-left .m-header-subtitle:after { left: 0; } .m-header.is-side-bottom-right .m-header-subtitle:after { right: 0; } .m-header.is-side-bottom-center .m-header-subtitle:after { left: 0; right: 0; margin: 0 auto; } .no-select::selection { background: transparent !important; } .no-select::-webkit-selection { background: transparent !important; } .no-select::-moz-selection { background: transparent !important; } .no-select::-o-selection { background: transparent !important; } .no-select { -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -khtml-user-select: none; } /*** END COMMONS ***/ /*** COMPONENTS ***/ body, html { overflow-x: hidden; } .pgLayout-other .header { position: relative; } .header:after, .pgLayout-other .header:before { content: ""; position: absolute; top: 0; width: 100%; height: 100%; } .pgLayout-other .header:before { right: 30%; } .header-separator { position: absolute; top: 0; height: 100%; } /** Menu **/ .header-nav { padding: 1em 0; } .header-nav-block1, .header-nav-block2 { display: inline-block; vertical-align: middle; } .header-nav-block1 { width: 60%; } .header-nav-block2 { width: 40%; } .header-nav-cta, .header-nav-logo, .header-nav-menu, .header-nav-spacing { display: table-cell !important; vertical-align: middle; } .header-nav-logo-wrap { display: table; } .header-nav-logo-name, .header-nav-logo-icon { display: table-cell; vertical-align: middle; } .header-nav-logo-icon { width: auto; height: 1.1em; } .header-nav-menu { width: 100%; } .header-nav-menu-content { width: 100%; } .header-nav-menu-content-link, .keypoint-link { padding: .5em 1em; border-width: .25em; border-style: solid; border-color: transparent; } .header-nav-menu-content-link.is-button, #chkbxForMenuProducts:checked ~ .header-nav-menu-content-link { background-color: rgb(21, 66, 131); color: #eee !important; } .header-nav-menu-content-sublist { padding: .5em; } .header-nav-menu-content-sublist-item { width: 50%; display: inline-block; padding: .5em; } .header-nav-menu-content-sublink { position: relative; width: 100%; } .header-nav-menu-content-sublink-image { border-width: 1em; border-style: solid; border-color: rgb(255, 255, 255); } .header-nav-menu-content-sublink:hover .header-nav-menu-content-sublink-image, .header-nav-menu-content-sublink:hover .header-nav-menu-content-sublink-image, .header-nav-menu-content-sublink:hover .header-nav-menu-content-sublink-image { } .header-nav-menu-content-sublink-title { position: absolute; width: 100%; padding: .5em; } .header-nav-menu-content-sublist-item.nthChild1 .header-nav-menu-content-sublink-image { border-radius: 1em 0 0 0; } .header-nav-menu-content-sublist-item.nthChild2 .header-nav-menu-content-sublink-image { border-radius: 0 1em 0 0; } .header-nav-menu-content-sublist-item.nthChild3 .header-nav-menu-content-sublink-image { border-radius: 0 0 0 1em; } .header-nav-menu-content-sublist-item.nthChild4 .header-nav-menu-content-sublink-image { border-radius: 0 0 1em 0; } .header-nav-spacing { display: block; } @media screen and (max-width: 50em) { .header-nav-cta-extra, .header-nav-menu-button-label.to-close, #chkbxForMenu:checked ~ .header-nav-menu-button .header-nav-menu-button-label.to-open, .header-nav-menu-content { display: none; } #chkbxForMenu:checked ~ .header-nav-menu-button .header-nav-menu-button-label.to-close, #chkbxForMenu:checked ~ .header-nav-menu-content { display: block; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:before { background-color: rgb(21, 66, 131); color: #eee; } .header-nav-menu-content, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:after { background-color: #202020; } .header-nav-menu-content-link { color: #eee; } .header-nav { position: relative; } .header-nav-spacing, .u-button { border-width: .25em; border-style: solid; border-color: transparent; } .header-nav-cta { position: absolute; top: .75em; right: 3.5em; border-color: transparent transparent rgb(21, 66, 131) transparent !important; } .header-nav-menu-button-label { display: inline-block; width: 2em; position: absolute; top: .75em; right: .75em; } .header-nav-menu-button-label.to-close { position: fixed; right: 1.5em; } .header-nav-menu-content { position: fixed; top: 0; left: 0; width: 100%;// height: 100%; } .header-nav-menu-content-list-item { display: table; width: 50%; height: 25%; padding: 1em; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link { position: relative; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:before, .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:after { width: 1000% !important; padding: .25em; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:before { content: ""; position: absolute; top: -.25em; left: 100%; height: 100%; } .header-nav-menu-content-list-item.has-children .header-nav-menu-content-link:after { height: 1000%; content: ""; position: absolute; bottom: 2.25em; left: 150%; } .header-nav-menu-content-sublist { position: absolute; top: 0; right: 0; width: 50%; height: 100%; // display: none; overflow-y: scroll; } .header-nav-menu-content-sublist-item { width: 100%; height: auto; // float: left; } .header-nav-menu-content-sublist-separator { position: sticky; top: 0; right: 0; // display: none; width: 100%; height: 5em; } .header-nav-menu-content-sublink-image { } .header-nav-menu-content-sublink-title { top: 30%; } } @media screen and (min-width: 50em){ .header-nav-menu-content-sublist { display: none; } #chkbxForMenuProducts:checked ~ .header-nav-menu-content-sublist, .header-nav-menu-content-list-item:hover .header-nav-menu-content-sublist, .header-nav-menu-content-list-item:active .header-nav-menu-content-sublist, .header-nav-menu-content-list-item:focus .header-nav-menu-content-sublist, .header-nav-menu-content-sublist:hover, .header-nav-menu-content-sublist:active, .header-nav-menu-content-sublist:focus { display: block; } .header-nav-menu-button { display: none; } .header-nav-menu-content-list { display: table; width: 100%; } .header-nav-menu-content-list-item { display: table-cell; vertical-align: middle; width: 25%; } .header-nav-menu-content-list { position: relative; } .header-nav-menu-content-sublist { position: absolute; top: 100%; left: 0; right: 0; // overflow: auto; } .header-nav-menu-content-sublist-item { // width: 50%; // float: left; } .header-nav-menu-content-sublink-title { top: 40%; } .header-nav-cta { background-color: rgb(21, 66, 131); color: white; } } /** Banner **/ .u-separator-wave { width: 2em; height: 2em; display: inline-block; vertical-align: middle; background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/line.png") no-repeat center center transparent; background-size: cover !important; } .header-banner-block1 { padding: 2em; } .header-banner-list-nav { padding: 0 2em; } .header-banner-cta.nthChild1 { margin-right: 1em; } .header-banner-list-item { display: none; } .header-banner-list-item.nthChild1 {// display: block; } #rdbForBannerCarouselPane1:checked ~ .header-banner-list .header-banner-list-item.nthChild1 { display: block !important; } #rdbForBannerCarouselPane2:checked ~ .header-banner-list .header-banner-list-item.nthChild2 { display: block !important; } #rdbForBannerCarouselPane3:checked ~ .header-banner-list .header-banner-list-item.nthChild3 { display: block !important; } #rdbForBannerCarouselPane4:checked ~ .header-banner-list .header-banner-list-item.nthChild4 { display: block !important; } .header-banner-list-nav { position: absolute; bottom: 1em; left: 1em; } .header-banner-title { font-size: 3em; padding: 1em 0; } .header:after, .header-banner-block2:after { // border: 1px solid red; } .header-message { position: absolute; bottom: 0; display: table; width: 40%; padding: 2em; // right: 0 !important; } .header:hover .header-message, .header:active .header-message, .header:focus .header-message { right: 0; } .header-message:after, .header-message:before { content: ""; position: absolute; width: 1000%; } .header-message:after { top: 0; height: 100%; } .header-message:before { top: 100%; left: 0; } .header-message-content { display: table-cell; vertical-align: middle; } .header-message-content-wrap { position: relative; display: inline-block; // border: 1px solid yellow; } .header-message-content-wrap:after { content: ""; position: absolute; top: 15%; left: -4.8em; width: 3.5em; height: 70%; } .header-message-content-number, .header-message-content-title { display: block; padding: .5em 0 .5em 1em; } .header-message-content-number { position: relative; padding-right: 2.25em; // font-size: 1.2em; text-align: right; font-weight: bold; } .header-message-content-number:after { content: ""; position: absolute; top: .25em; right: .25em; width: 1.5em; height: 1.5em; } .header-message-content-title { font-size: 1.5em; text-align: left; } .header-message-separator { position: absolute; top: 0; left: 0; height: 100%; } @media screen and (max-width: 50em) { .header { overflow: hidden; } .header-banner-block1 {// text-align: center; } .header-banner-list-nav { margin-bottom: 5em; } .header-banner-list-nav-button { display: block; } .header-banner-list-nav-button.nthChild-prev { margin-bottom: .5em; } .header-message { text-align: right; } } @media screen and (min-width: 50em){ .header { position: relative; overflow: visible; } .header-banner { overflow: auto; } .header-banner-block1, .header-banner-block2 { float: left; } .header-banner-block1 { width: 60%; } .header-banner-block2 { width: 40%; } .header-banner-block2 { // background-color: green; } .header-banner-list { display: block; // margin: 5em 0 !important; } .header-banner-list-nav-button.nthChild-prev { margin-right: .5em; } .header-message { height: 50%; text-align: center; } .header-separator { position: absolute; top: 0; left: 60%; } } /** Separator Area **/ .m-separatorArea { position: relative; } .m-separatorArea-header { } .m-separatorArea-content {} .m-separatorArea-content-tag { width: 75%; padding: 1em 0; } .m-separatorArea-separator { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media screen and (max-width: 50em) { } /** Footer **/ .footer-side-left, .footer-side-right { display: inline-block; vertical-align: top; padding: 1em; margin: 0 auto; // border: 1px solid red; } .footer-socialMedia-link { width: 3em; padding: .5em; margin: .5em; } .footer-details-line { display: block; padding: .5em; } .footer-copyrights { display: block; width: 100%; padding: 2em 0; } .footer-title { font-size: 2em; padding: .5em 0; } .freebies-contact-email, .freebies-contact-number { color: white; padding-left: 3em !important; } .freebies-contact-email:hover, .freebies-contact-email:active, .freebies-contact-email:focus, .freebies-contact-number:hover, .freebies-contact-number:active, .freebies-contact-number:focus { background-color: #000; } .freebies .has-icon { position: relative; } .freebies .has-icon:after { content: ""; position: absolute; top: .5em; left: .5em; width: 2em; height: 2em; } .quickForm-fieldset, .quickForm-fieldset-submit { display: inline-block; vertical-align: middle; } .quickForm-fieldset-input { display: block; // margin: 1em auto; border-radius: 3em; } .u-input, .u-submit { display: inline-block; padding: 1em; margin: .5em; } .quickForm-fieldset-submit { background-color: #AAA !important; border-radius: 5em; font-variant: small-caps; text-transform: uppercase; } .quickForm-fieldset-submit:hover, .quickForm-fieldset-submit:active, .quickForm-fieldset-submit:focus { background-color: rgb(243,249,255) !important; color: #363636; } @media screen and (max-width: 50em) {} @media screen and (min-width: 50em) { .quickForm { // width: 50%; // padding: 1em; } } /** About - Filtration **/ .waterFiltration-content { position: relative; padding-bottom: 2em; // border: 1px solid yellow; } .waterFiltration-group .waterFiltration-list-item { padding: 0 1em; } .waterFiltration-group .waterFiltration-box { padding: 2em; text-align: center; background-color: white; } .waterFiltration-box-number { font-size: 2em; font-weight: bold; margin: 1em auto; } .waterFiltration-box-title { font-size: 1.2em; font-weight: bold; margin: 1em auto; } .waterFiltration-vip { padding: 1em; overflow: auto; background-color: white; } .waterFiltration-vip .waterFiltration-img, .waterFiltration-vip .waterFiltration-box { padding: 1em; } .waterFiltration-content-title { padding: 1em; font-size: 1.5em; } @media screen and (max-width: 50em) { .waterFiltration-content:after { content: ""; position: absolute; top: 0; left: 70%; width: 30%; height: 100%; } .waterFiltration-group .waterFiltration-list { width: 85%; position: relative; left: 15%; } .waterFiltration-group .waterFiltration-list-item.nthChild-2 { margin: 1em auto; } .waterFiltration-vip { margin: 1em !important; text-align: center; } } @media screen and (min-width: 50em) { .waterFiltration-content:after { content: ""; position: absolute; top: 0; left: 50%; width: 1000%; height: 100%; } .waterFiltration-group .waterFiltration-list { overflow: auto; } .waterFiltration-group .waterFiltration-list-item { width: 33.333%; float: left; } .waterFiltration-vip .waterFiltration-img, .waterFiltration-vip .waterFiltration-box { float: left; padding: 1em; } .waterFiltration-vip .waterFiltration-img { width: 33.333%; } .waterFiltration-vip .waterFiltration-box { width: 66.666%; } .waterFiltration-content-title { position: relative; left: 25%; width: 50%; color: white; } } /** About - Key Points **/ .keypoints-list {} .keypoints-list-item { display: inline-block; vertical-align: top; padding: 1em; margin: 0 auto; text-align: center; } .keypoint-title, .keypoint-excerpt, .keypoint-link { display: inline-block; } .keypoint-title, .keypoint-excerpt { padding: .5em; } .keypoint-title { font-size: 1.2em; font-weight: bold; } .keypoint-icon { width: 50%; } .keypoint-link { } .m-section { padding: 2em; } @media screen and (max-width: 500em) { .keypoints-list-item { // width: 50%; } } @media screen and (min-width: 50em){ .keypoints-list-br { display: none; } .keypoints-list-item { width: 25%; } } /** About - Water Composition **/ .waterComposition-content-glass { padding: 1em; background-color: white; } .waterComposition-content-mainMineral { padding: 1em; } .waterComposition-content-list.is-side-left .waterComposition-content-mainMineral { text-align: right; } .waterComposition-content-list.is-side-right .waterComposition-content-mainMineral { text-align: left; } .waterComposition-content-list.is-side-left .waterComposition-content-mainMineral-icon, .waterComposition-content-list.is-side-left .waterComposition-content-mainMineral-text { float: right; } .waterComposition-content-list.is-side-right .waterComposition-content-mainMineral-icon, .waterComposition-content-list.is-side-right .waterComposition-content-mainMineral-text { float: left; } .waterComposition-content-mainMineral-icon { width: 30%; height: auto; } .waterComposition-content-mainMineral-content { width: 70%; padding: 1em; overflow: auto; } .waterComposition-content-mainMineral-content-title { font-size: 1.2em; font-weight: bold; } .waterComposition-content-mainMineral-content-weight { display: inline-block; font-weight: bold; padding: .5em; } .waterComposition-footer { display: inline-block; width: 90%; position: relative; left: 5%; margin: 3em auto; } .waterComposition-footer-list { overflow: auto; } .waterComposition-footer-list-item { display: block; width: 25%; height: 100%; float: left; padding: 2em; border-width: .5em .25em; border-style: solid; border-color: transparent rgb(21, 66, 131); text-align: center; } .waterComposition-footer-list-item:nth-child(even) { border-top-color: rgb(21, 66, 131); } .waterComposition-footer-list-item:nth-child(odd) { border-bottom-color: rgb(21, 66, 131); } .waterComposition-footer-list-item.nthChild-first { border-left-width: .5em; } .waterComposition-footer-list-item.nthChild-last { border-right-width: .5em; } .waterComposition-footer-subMineral-title, .waterComposition-footer-subMineral-weight { font-weight: bold; } .waterComposition-footer-subMineral-title { font-size: 1.2em; } @media screen and (max-width: 50em) { .waterComposition-content-mainMineral-content { // max-height: 5em; } .waterComposition-content-glass { margin: 2em; } .waterComposition-footer-list { width: 200%; } } @media screen and (min-width: 50em) { .waterComposition-content-glass, .waterComposition-content-list { width: 33.333%; } .waterComposition-content-glass { margin: 0 auto; } .waterComposition-content { position: relative; } .waterComposition-content-list { position: absolute; top: 0; height: 100%; } .waterComposition-content-list.is-side-left { left: 0; } .waterComposition-content-list.is-side-right { right: 0; } .waterComposition-content-list-item { display: table; width: 100%; height: 50%; } .waterComposition-content-mainMineral { display: table-cell; vertical-align: middle; // background-color: purple; } .waterComposition-content-mainMineral-content { height: 100%; } .waterComposition-footer-list { width: 100%; } } /** About - Milestones **/ .milestones-content-figure { padding: 2em; } .milestones-content-figure-placeholder { border-width: 1em; border-style: solid; border-color: white; } .milestones-content-timeline-frame { display: block; padding: 1em; overflow: hidden; } .milestones-content-timeline-frame-date, .milestones-content-timeline-frame-stick, .milestones-content-timeline-frame-text { display: block; padding: 0 1em; float: left; } .milestones-content-timeline-frame-date { position: relative; z-index: 100; width: 15%; text-align: center; font-size: 1.2em; font-weight: solid; } .milestones-content-timeline-frame-stick { width: 15%; height: 100%; position: relative; display: block; } .milestones-content-timeline-frame-stick:after, .milestones-content-timeline-frame-stick:before { content: ""; position: absolute; left: 0; right: 0; width: 100%; height: 1em; } .milestones-content-timeline-frame-stick:before { top: 0; } .milestones-content-timeline-frame-stick:after { top: -100%; width: 1em; max-width: 100%; height: 10000%; display: block; margin: 0 auto; } .milestones-content-timeline-list-item.nthChild-1 .milestones-content-timeline-frame-stick:after { top: 0 !important; } .milestones-content-timeline-frame-text { width: 70%; } @media screen and (max-width: 50em) { } @media screen and (min-width: 50em) { .milestones-content { // position: relative; overflow: auto; } .milestones-content-figure, .milestones-content-timeline { width: 50%; float: right; } .milestones-content-figure { // height: 100%; } } /** Contact - Info Area **/ .infoArea-content { position: relative; } .infoArea-content-details { width: 100%; height: 100%; margin: 0 auto; // border: 1px solid yellow; } .infoArea-content-details-list { width: 100%; height: 100%; padding: 1em; overflow: auto; } .infoArea-content-details-list-item { border-width: .25em; border-style: solid; } .infoArea-content-detail { padding: .5em; text-align: center; } .infoArea-content-detail-icon { width: 2em; height: auto; } .infoArea-content-detail-title { padding: .5em; font-weight: bold; } .infoArea-content-faq { // border: 1px solid green; } .infoArea-content-faq-question-title { position: relative; display: block; padding: 1em; font-weight: bold; // border-width: .25em; border-style: solid; // border-color: transparent } .rdb-for-pgContact-sectionFAQ:checked ~ .infoArea-content-faq-question-title, .infoArea-content-faq-question-title:hover, .infoArea-content-faq-question-title:active, .infoArea-content-faq-question-title:focus { color: rgb(21, 66, 131); // border-color: transparent transparent rgb(21, 66, 131) transparent; } .infoArea-content-faq-question-title:after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-width: .5em; border-style: solid; border-color: transparent transparent transparent rgb(21, 66, 131); } .rdb-for-pgContact-sectionFAQ:checked ~ .infoArea-content-faq-question-title:after, .infoArea-content-faq-question-title:hover:after, .infoArea-content-faq-question-title:active:after, .infoArea-content-faq-question-title:focus:after { border-color: rgb(21, 66, 131) transparent transparent transparent; } .infoArea-content-faq-question-text { height: 0; overflow: hidden; padding: 0 1em; } .rdb-for-pgContact-sectionFAQ:checked ~ .infoArea-content-faq-question-text { height: auto; padding: 1em; } @media screen and (max-width: 50em) { .infoArea-content-details-list-item.nthChild-1 { border-color: transparent rgb(21, 66, 131) rgb(21, 66, 131) transparent; } .infoArea-content-details-list-item.nthChild-2 { border-color: rgb(21, 66, 131) transparent rgb(21, 66, 131) rgb(21, 66, 131); } .infoArea-content-details-list-item.nthChild-3 { border-color: rgb(21, 66, 131) rgb(21, 66, 131) rgb(21, 66, 131) transparent; } .infoArea-content-details-list-item.nthChild-4 { border-color: rgb(21, 66, 131) transparent transparent rgb(21, 66, 131); } .infoArea-content-details-list-item.nthChild-1, .infoArea-content-details-list-item.nthChild-3 { border-right-width: .4em; } .infoArea-content-details-list-item.nthChild-2, .infoArea-content-details-list-item.nthChild-4 { border-left-width: .4em; } .m-header.infoArea-content-faq-header.d-max-normal-by50 { max-width: 1000em; } } @media screen and (min-width: 50em) { .infoArea-content-details { position: absolute; top: 0; left: 0; right: 0; // border: 1px solid red; } .infoArea-content-details-wrap { width: 50%; height: 100%; // border: 1px solid red; } .infoArea-content-details-list { overflow: auto; } .infoArea-content-details-list-item { display: table; width: 50%; height: 50%; float: left; } .infoArea-content-details-list-item.nthChild-1 { border-color: transparent rgb(21, 66, 131) rgb(21, 66, 131) transparent; } .infoArea-content-details-list-item.nthChild-2 { border-color: transparent transparent rgb(21, 66, 131) rgb(21, 66, 131); } .infoArea-content-details-list-item.nthChild-3 { border-color: rgb(21, 66, 131) rgb(21, 66, 131) transparent transparent; } .infoArea-content-details-list-item.nthChild-4 { border-color: rgb(21, 66, 131) transparent transparent rgb(21, 66, 131); } .infoArea-content-detail { display: table-cell; vertical-align: middle; width: 100%; height:100%; } .infoArea-content-details-list-item.nthChild-3 .infoArea-content-detail { padding: 0 !important; } .infoArea-content-faq { width: 100% !important; background-color: yellow: } .m-header.infoArea-content-faq-header { margin-left: 0 !important; } .infoArea-content-faq-wrap { width: 50%; position: relative; left: 50%; // border: 1px solid yellow; } } /** Contact - Details Area **/ .reasons { padding: 2em 0; } .reasons-header { text-align: right; } .reasons-content {} .reasons-content-list { display: block; overflow: auto; } .reasons-content-list-item { display: block; padding: 1em; } .reasons-content-box { text-align: center; } .reasons-content-box:target { background-color: white; } .reasons-content-form { display: none; position: fixed; top: 5%; left: 5%; width: 90%; height: 90%; padding: 2em; background-color: rgb(21, 66, 131); } .reasons-content-box:target ~ .reasons-content-form { // display: block; } .reasons-content-box-icon { width: 30%; height: auto; margin: 1em auto; } .reasons-content-box-title { font-weight: bold; } .reasons-content-box-link { padding: .5em 1em; border-width: .25em; border-style: solid; // border-color: transparent transparent rgb(21, 66, 131) transparent; border-color: transparent transparent white transparent; color: white; } .reasons-content-box-link:hover, .reasons-content-box-link:active, .reasons-content-box-link:focus { background-color: white; color: #363636; // font-weight: bold; } .reasons-content-box-text { padding: 1em 0; } .reasons-content-form a { display: block; } @media screen and (min-width: 50em) { .reasons-content-list-item { width: 33.333%; float: left; } } /** Contact - Main Form Area **/ .mainArea { position: relative; // background-color: purple; } .mainArea-form { } .mainArea-form-wrap { padding: 2em; } .mainArea-form-content { // padding: 2em 0; } .mainArea-form-content .u-input { border-width: .1em; border-style: solid; border-color: transparent; } .mainArea-form-content .u-input:invalid { // border-color: red; } .mainArea-form-content-message, .mainArea-form-content-name, .mainArea-form-content-subject, .mainArea-form-content-subject-option, .mainArea-form-content-submit, .mainArea-form-content-phone, .mainArea-form-content-email { display: inline-block; padding: 1em; margin: 2.5%; } .mainArea-form-content-message { width: 95%; min-height: 9em; border-radius: 1em; } .mainArea-form-content-name, .mainArea-form-content-subject, .mainArea-form-content-phone, .mainArea-form-content-email { width: 45%; border-radius: 5em; } .mainArea-form-content-submit { width: 95%; background-color: rgb(21, 66, 131) !important; color: #eee; border-radius: 5em; } iframe { width: 100% !important; height: 100% !important; } @media screen and (max-width: 50em) { .mainArea-map { width: 100%; height: 30em; } .mainArea-map-wrap { width: 100%; height: 100%; } } @media screen and (min-width: 50em) { .mainArea-form-wrap { width: 50%; } .mainArea-map { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .mainArea-map-wrap { position: relative; left: 50%; width: 50%; height: 100%; } } /** Products - About **/ .productAbout-content { overflow: auto; } .productAbout-list-item:nth-child(odd) .productAbout-content-figure { float: left; } .productAbout-list-item:nth-child(even) .productAbout-content-figure { float: right; } .productAbout-content-text-p { padding: .5em 1em; } .productAbout-content-figure { position: relative; } .productAbout-content-figure.is-transparent { // padding: 7.5% 0; padding: 2.5% 0; background-color: white; } .productAbout-content-figure.is-document { padding: 5% 0 !important; } .productAbout-content-figure:after, .productAbout-content-figure:before { content: ""; position: absolute; left: 0; right: 0; margin: 0 auto; width: 100%; height: 100%; background-repeat: no-repeat !important; background-size: 100% 10% !important; } .productAbout-content-figure:after { top: 0; background-position: top center !important; } .productAbout-list-item.nthChild-odd .productAbout-content-figure:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/separator-triangle-right-top.png"); } .productAbout-list-item.nthChild-even .productAbout-content-figure:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/separator-triangle-left-top.png"); } .productAbout-content-figure:before { bottom: 0; background-position: bottom center !important; } .productAbout-list-item.nthChild-odd .productAbout-content-figure:before { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/separator-triangle-right-bottom.png"); } .productAbout-list-item.nthChild-even .productAbout-content-figure:before { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/separator-triangle-left-bottom.png"); } .productAbout-content-figure-separator { position: absolute; top: 0; width: 100%; height: 10%; } .productAbout-list-item:nth-child(odd) .productAbout-content-figure-separator { right: 0; } .productAbout-list-item:nth-child(even) .productAbout-content-figure-separator { left: 0; } .productAbout-content-text-p { font-size: 1.1em; } @media screen and (max-width: 50em) { .productAbout-list-item { padding: 1em 0; } .productAbout-content-figure { display: inline-block; width: 40%; margin: 0 1em; // float: left; } .productAbout-content-text-p { padding: .5em 1em; } } @media screen and (min-width: 50em) { .productAbout-list-item { padding: 3em 0; } .productAbout-content-figure, .productAbout-content-text { width: 50%; } .productAbout-list-item:nth-child(odd) .productAbout-content-text { float: left; text-align: right; } .productAbout-list-item:nth-child(even) .productAbout-content-text { float: right; text-align: left; } } /** Products - Bestsellers **/ .bestsellers * { color: 363636 !important; } .bestsellers-list { padding: 0 .5em; } .bestsellers-list-item { display: none; } #rdbForBestsellersCat1Sublist1:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-1, #rdbForBestsellersCat1Sublist2:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-2, #rdbForBestsellersCat1Sublist3:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-3, #rdbForBestsellersCat1Sublist4:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-4, #rdbForBestsellersCat1Sublist5:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-5, #rdbForBestsellersCat1Sublist6:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-6, #rdbForBestsellersCat1Sublist7:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-7, #rdbForBestsellersCat1Sublist8:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-8, #rdbForBestsellersCat1Sublist9:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-9, #rdbForBestsellersCat1Sublist10:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-10, #rdbForBestsellersCat1Sublist11:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-11, #rdbForBestsellersCat1Sublist12:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-12, #rdbForBestsellersCat1Sublist13:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-13, #rdbForBestsellersCat1Sublist14:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-14, #rdbForBestsellersCat1Sublist15:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-15, #rdbForBestsellersCat1Sublist16:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-16, #rdbForBestsellersCat1Sublist17:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-17, #rdbForBestsellersCat1Sublist18:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-18, #rdbForBestsellersCat1Sublist19:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-19, #rdbForBestsellersCat1Sublist20:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-20, #rdbForBestsellersCat2Sublist1:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-1, #rdbForBestsellersCat2Sublist2:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-2, #rdbForBestsellersCat2Sublist3:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-3, #rdbForBestsellersCat2Sublist4:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-4, #rdbForBestsellersCat2Sublist5:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-5, #rdbForBestsellersCat2Sublist6:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-6, #rdbForBestsellersCat2Sublist7:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-7, #rdbForBestsellersCat2Sublist8:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-8, #rdbForBestsellersCat2Sublist9:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-9, #rdbForBestsellersCat2Sublist10:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-10, #rdbForBestsellersCat2Sublist11:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-11, #rdbForBestsellersCat2Sublist12:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-12, #rdbForBestsellersCat2Sublist13:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-13, #rdbForBestsellersCat2Sublist14:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-14, #rdbForBestsellersCat2Sublist15:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-15, #rdbForBestsellersCat2Sublist16:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-16, #rdbForBestsellersCat2Sublist17:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-17, #rdbForBestsellersCat2Sublist18:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-18, #rdbForBestsellersCat2Sublist19:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-19, #rdbForBestsellersCat2Sublist20:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-20, #rdbForBestsellersCat3Sublist1:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-1, #rdbForBestsellersCat3Sublist2:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-2, #rdbForBestsellersCat3Sublist3:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-3, #rdbForBestsellersCat3Sublist4:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-4, #rdbForBestsellersCat3Sublist5:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-5, #rdbForBestsellersCat3Sublist6:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-6, #rdbForBestsellersCat3Sublist7:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-7, #rdbForBestsellersCat3Sublist8:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-8, #rdbForBestsellersCat3Sublist9:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-9, #rdbForBestsellersCat3Sublist10:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-10, #rdbForBestsellersCat3Sublist11:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-11, #rdbForBestsellersCat3Sublist12:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-12, #rdbForBestsellersCat3Sublist13:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-13, #rdbForBestsellersCat3Sublist14:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-14, #rdbForBestsellersCat3Sublist15:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-15, #rdbForBestsellersCat3Sublist16:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-16, #rdbForBestsellersCat3Sublist17:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-17, #rdbForBestsellersCat3Sublist18:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-18, #rdbForBestsellersCat3Sublist19:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-19, #rdbForBestsellersCat3Sublist20:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-20, #rdbForBestsellersCat4Sublist1:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-1, #rdbForBestsellersCat4Sublist2:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-2, #rdbForBestsellersCat4Sublist3:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-3, #rdbForBestsellersCat4Sublist4:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-4, #rdbForBestsellersCat4Sublist5:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-5, #rdbForBestsellersCat4Sublist6:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-6, #rdbForBestsellersCat4Sublist7:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-7, #rdbForBestsellersCat4Sublist8:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-8, #rdbForBestsellersCat4Sublist9:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-9, #rdbForBestsellersCat4Sublist10:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-10, #rdbForBestsellersCat4Sublist11:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-11, #rdbForBestsellersCat4Sublist12:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-12, #rdbForBestsellersCat4Sublist13:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-13, #rdbForBestsellersCat4Sublist14:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-14, #rdbForBestsellersCat4Sublist15:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-15, #rdbForBestsellersCat4Sublist16:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-16, #rdbForBestsellersCat4Sublist17:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-17, #rdbForBestsellersCat4Sublist18:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-18, #rdbForBestsellersCat4Sublist19:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-19, #rdbForBestsellersCat4Sublist20:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-20, #rdbForBestsellersCat5Sublist1:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-1, #rdbForBestsellersCat5Sublist2:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-2, #rdbForBestsellersCat5Sublist3:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-3, #rdbForBestsellersCat5Sublist4:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-4, #rdbForBestsellersCat5Sublist5:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-5, #rdbForBestsellersCat5Sublist6:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-6, #rdbForBestsellersCat5Sublist7:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-7, #rdbForBestsellersCat5Sublist8:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-8, #rdbForBestsellersCat5Sublist9:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-9, #rdbForBestsellersCat5Sublist10:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-10, #rdbForBestsellersCat5Sublist11:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-11, #rdbForBestsellersCat5Sublist12:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-12, #rdbForBestsellersCat5Sublist13:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-13, #rdbForBestsellersCat5Sublist14:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-14, #rdbForBestsellersCat5Sublist15:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-15, #rdbForBestsellersCat5Sublist16:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-16, #rdbForBestsellersCat5Sublist17:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-17, #rdbForBestsellersCat5Sublist18:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-18, #rdbForBestsellersCat5Sublist19:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-19, #rdbForBestsellersCat5Sublist20:checked ~ .bestsellers-list .bestsellers-list-item.nthChild-20, .jekyllPlaceholderClass { display: block; } #rdbForBestsellersCat1Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat1Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat1Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat1Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat1Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat1Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat1Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat1Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat1Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat1Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat1Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat1Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat1Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat1Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat1Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat1Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat1Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat1Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat1Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat1Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat2Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat2Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat2Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat2Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat2Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat2Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat2Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat2Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat2Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat2Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat2Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat2Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat2Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat2Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat2Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat2Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat2Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat2Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat2Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat2Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat3Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat3Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat3Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat3Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat3Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat3Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat3Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat3Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat3Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat3Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat3Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat3Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat3Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat3Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat3Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat3Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat3Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat3Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat3Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat3Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat4Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat4Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat4Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat4Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat4Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat4Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat4Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat4Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat4Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat4Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat4Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat4Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat4Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat4Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat4Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat4Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat4Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat4Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat4Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat4Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat5Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat5Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat5Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat5Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat5Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat5Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat5Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat5Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat5Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat5Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat5Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat5Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat5Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat5Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat5Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat5Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat5Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat5Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat5Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat5Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, .jekyllPlaceholderClass, .bestsellers-nav-button:hover, .bestsellers-nav-button:active, .bestsellers-nav-button:focus { background-color: rgb(21, 66, 131); } #rdbForBestsellersCat1Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat1Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat1Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat1Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat1Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat1Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat1Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat1Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat1Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat1Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat1Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat1Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat1Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat1Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat1Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat1Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat1Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat1Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat1Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat1Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat2Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat2Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat2Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat2Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat2Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat2Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat2Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat2Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat2Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat2Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat2Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat2Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat2Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat2Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat2Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat2Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat2Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat2Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat2Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat2Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat3Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat3Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat3Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat3Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat3Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat3Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat3Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat3Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat3Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat3Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat3Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat3Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat3Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat3Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat3Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat3Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat3Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat3Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat3Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat3Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat4Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat4Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat4Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat4Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat4Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat4Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat4Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat4Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat4Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat4Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat4Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat4Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat4Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat4Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat4Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat4Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat4Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat4Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat4Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat4Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, #rdbForBestsellersCat5Sublist1:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-1, #rdbForBestsellersCat5Sublist2:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-2, #rdbForBestsellersCat5Sublist3:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-3, #rdbForBestsellersCat5Sublist4:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-4, #rdbForBestsellersCat5Sublist5:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-5, #rdbForBestsellersCat5Sublist6:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-6, #rdbForBestsellersCat5Sublist7:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-7, #rdbForBestsellersCat5Sublist8:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-8, #rdbForBestsellersCat5Sublist9:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-9, #rdbForBestsellersCat5Sublist10:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-10, #rdbForBestsellersCat5Sublist11:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-11, #rdbForBestsellersCat5Sublist12:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-12, #rdbForBestsellersCat5Sublist13:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-13, #rdbForBestsellersCat5Sublist14:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-14, #rdbForBestsellersCat5Sublist15:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-15, #rdbForBestsellersCat5Sublist16:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-16, #rdbForBestsellersCat5Sublist17:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-17, #rdbForBestsellersCat5Sublist18:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-18, #rdbForBestsellersCat5Sublist19:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-19, #rdbForBestsellersCat5Sublist20:checked ~ .bestsellers-nav .bestsellers-nav-button.nthChild-20, .jekyllPlaceholderClass { width: 2em !important; } .bestsellers-categoryTitle { display: block; font-size: 2em; // text-align: center; margin: 0 auto; } .bestsellers-sublist { padding: 0 1em; overflow: auto; text-align: center; } .bestsellers-sublist-item { width: 33.333%; float: left; } .bestsellers-sublist-item:nth-child(2) .bestseller { position: relative; z-index: 20; } .bestseller:hover .bestseller-title, .bestseller:active .bestseller-title, .bestseller:focus .bestseller-title, .bestseller:hover .bestseller-text, .bestseller:active .bestseller-text, .bestseller:focus .bestseller-text { color: white; } .bestsellers-sublist-item:nth-child(1) .bestseller:hover, .bestsellers-sublist-item:nth-child(1) .bestseller:active, .bestsellers-sublist-item:nth-child(1) .bestseller:focus { z-index: 100; } .bestsellers-sublist-item:nth-child(3) .bestseller:hover, .bestsellers-sublist-item:nth-child(3) .bestseller:active, .bestsellers-sublist-item:nth-child(3) .bestseller:focus { z-index: 100; } .bestseller { position: relative; display: block; background-color: white; border-width: .75em; border-style: solid; border-color: rgb(21, 66, 131); color: #363636; } .bestseller:hover { position: relative; top: -1em; background-color: rgb(21, 66, 131); } .chkbxForBestsellersCat1Items:checked ~ .bestseller, .chkbxForBestsellersCat2Items:checked ~ .bestseller, .chkbxForBestsellersCat3Items:checked ~ .bestseller, .chkbxForBestsellersCat4Items:checked ~ .bestseller, .chkbxForBestsellersCat5Items:checked ~ .bestseller, .jekyllPlaceholderClass { position: relative; top: -1em; } .chkbxForBestsellersItems:checked .bestseller:hover, .chkbxForBestsellersItems:checked .bestseller:active, .chkbxForBestsellersItems:checked .bestseller:focus { // top: 0 !important; } .bestseller-figure-img { display: block; padding: 1em; cursor: pointer; border-width: .5em; border-style: solid; border-color: transparent; background-color: white; } .bestseller-figure-img:hover, .bestseller-figure-img:active, .bestseller-figure-img:focus { border-color: #AAA !important; } .bestseller:hover .bestseller-figure-img, .bestseller:active .bestseller-figure-img, .bestseller:focus .bestseller-figure-img { border-color: #363636; } .bestseller-title { font-size: 1.2em; font-weight: bold; padding: 1em .5em; } .bestseller-price { padding: 1em 0; } .bestseller-price-pack { text-transform: lowercase; font-variant: small-caps; // color: #AAA; } .bestseller:hover .bestseller-price-pack, .bestseller:active .bestseller-price-pack, .bestseller:focus .bestseller-price-pack { color: white; } .bestseller-price-one { display: inline-block; margin: 0 auto; cursor: pointer; font-weight: bold; border-radius: 3em; background-color: rgb(21, 66, 131); color: white; } .bestseller-price-one:hover, .bestseller-price-one:active, .bestseller-price-one:focus { // padding: .5em 1em; // letter-spacing: .2em; // letter-spacing: .1em; background-color: #AAA !important; color: #363636; } .bestseller:hover .bestseller-price-one, .bestseller:active .bestseller-price-one, .bestseller:focus .bestseller-price-one { background-color: #363636; } .bestseller-summary { display: block; } .bestseller-details { display: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10; background-color: rgb(21, 66, 131); color: white; } .CHKBXsForBestsellersCat1Items:checked + .bestseller .bestseller-details, .CHKBXsForBestsellersCat2Items:checked + .bestseller .bestseller-details, .CHKBXsForBestsellersCat3Items:checked + .bestseller .bestseller-details, .CHKBXsForBestsellersCat4Items:checked + .bestseller .bestseller-details, .CHKBXsForBestsellersCat5Items:checked + .bestseller .bestseller-details, .jekyllPlaceholderClass { display: block; } .bestseller-details-button { display: block; width: 3em; height: 10%; margin: 0 auto; // padding: 1em; // border: 1px solid red; } .bestseller-details-button-img { width: auto; height: 100%; max-height: 2em; cursor: pointer; } .bestseller-details-content { height: 90%; // padding: .25em; overflow-y: auto; // border: 1px solid yellow; } .bestseller-details-content-p { padding: .5em; } .bestsellers-nav { text-align: center; } .bestsellers-nav-button { width: 1em; height: 1em; display: inline-block; vertical-align: middle; border-radius: 1em; background-color: white; cursor: pointer; } @media screen and (max-width: 50em) { .bestsellers-list-item { overflow-x: auto; } .bestsellers-sublist { width: 270%; } .bestsellers-sublist-item { padding: 1em .5em; } .bestsellers-categoryTitle { padding: 0 1em; } .bestseller { padding: .5em; } .bestseller-price-one { font-size: 2em; padding: .25em .5em; } .bestsellers-nav-button { margin: 1em; } } @media screen and (min-width: 50em) { .bestsellers-list-item { padding: 2em; } .bestsellers-sublist-item { padding: 1em; } .bestsellers-categoryTitle { padding: 0 3em; } .bestseller { padding: 1em; } .bestseller-price-one { font-size: 2em; padding: .5em 1em; } .bestsellers-nav-button { margin: 2em; } } /** Products - Order Form Area **/ .orderArea-nav {} .orderArea-nav-list-item { overflow: auto; } .orderArea-nav-list-item-nav, .orderArea-nav-sublist { float: left; } .orderArea-nav-list-item-nav { display: block; text-align: center; } .orderArea-nav-list-item-nav-label { display: inline-block; padding: .5em; border: .5em; border-style: solid; border-color: white; border-radius: 50%; cursor: pointer; background-color: #AAAAAA; } .orderArea-nav-list-item-nav-label:hover, .orderArea-nav-list-item-nav-label:active, .orderArea-nav-list-item-nav-label:focus { background-color: white; border-color: #AAAAAA; } .orderArea-nav-sublist { // padding: 1em; overflow: auto; } .orderArea-nav-list-item { display: none; } #rdbForOrderAreaSublist1:checked ~ .orderArea-nav .orderArea-nav-list-item.nthChild-1, #rdbForOrderAreaSublist2:checked ~ .orderArea-nav .orderArea-nav-list-item.nthChild-2, #rdbForOrderAreaSublist3:checked ~ .orderArea-nav .orderArea-nav-list-item.nthChild-3, #rdbForOrderAreaSublist4:checked ~ .orderArea-nav .orderArea-nav-list-item.nthChild-4, #rdbForOrderAreaSublist5:checked ~ .orderArea-nav .orderArea-nav-list-item.nthChild-5, .jekyllPlaceholderClass { display: block !important; } .orderArea-nav-sublist-item { float: left; } .orderArea-nav-button { display: inline-block; text-align: center; cursor: pointer; padding: 1em; background-color: white; } .orderArea-nav-sublist-rdbButton:checked ~ .orderArea-nav-button { background-color: red; } .orderArea-nav-button-icon { border-width: .5em; border-style: solid; border-color: transparent; // width: 50%; } .orderArea-nav-button-name { font-size: 1.2em; font-weight: bold; padding: 1em; } .orderArea-content-list-item { display: none; } #rdbForOrderAreaItem1:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-1, #rdbForOrderAreaItem2:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-2, #rdbForOrderAreaItem3:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-3, #rdbForOrderAreaItem4:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-4, #rdbForOrderAreaItem5:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-5, #rdbForOrderAreaItem6:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-6, #rdbForOrderAreaItem7:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-7, #rdbForOrderAreaItem8:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-8, #rdbForOrderAreaItem9:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-9, #rdbForOrderAreaItem10:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-10, #rdbForOrderAreaItem11:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-11, #rdbForOrderAreaItem12:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-12, #rdbForOrderAreaItem13:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-13, #rdbForOrderAreaItem14:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-14, #rdbForOrderAreaItem15:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-15, #rdbForOrderAreaItem16:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-16, #rdbForOrderAreaItem17:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-17, #rdbForOrderAreaItem18:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-18, #rdbForOrderAreaItem19:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-19, #rdbForOrderAreaItem20:checked ~ .orderArea-content .orderArea-content-list-item.nthChild-20, .jekyllPlaceholderClass { display: block !important; } #rdbForOrderAreaItem1:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-1 .orderArea-nav-button, #rdbForOrderAreaItem2:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-2 .orderArea-nav-button, #rdbForOrderAreaItem3:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-3 .orderArea-nav-button, #rdbForOrderAreaItem4:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-4 .orderArea-nav-button, #rdbForOrderAreaItem5:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-5 .orderArea-nav-button, #rdbForOrderAreaItem6:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-6 .orderArea-nav-button, #rdbForOrderAreaItem7:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-7 .orderArea-nav-button, #rdbForOrderAreaItem8:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-8 .orderArea-nav-button, #rdbForOrderAreaItem9:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-9 .orderArea-nav-button, #rdbForOrderAreaItem10:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-10 .orderArea-nav-button, #rdbForOrderAreaItem11:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-11 .orderArea-nav-button, #rdbForOrderAreaItem12:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-12 .orderArea-nav-button, #rdbForOrderAreaItem13:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-13 .orderArea-nav-button, #rdbForOrderAreaItem14:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-14 .orderArea-nav-button, #rdbForOrderAreaItem15:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-15 .orderArea-nav-button, #rdbForOrderAreaItem16:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-16 .orderArea-nav-button, #rdbForOrderAreaItem17:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-17 .orderArea-nav-button, #rdbForOrderAreaItem18:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-18 .orderArea-nav-button, #rdbForOrderAreaItem19:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-19 .orderArea-nav-button, #rdbForOrderAreaItem20:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-20 .orderArea-nav-button, .orderArea-nav-button:hover, .orderArea-nav-button:active, .orderArea-nav-button:focus { background-color: rgb(21, 66, 131); color: white; } #rdbForOrderAreaItem1:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-1 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem2:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-2 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem3:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-3 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem4:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-4 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem5:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-5 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem6:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-6 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem7:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-7 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem8:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-8 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem9:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-9 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem10:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-10 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem11:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-11 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem12:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-12 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem13:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-13 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem14:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-14 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem15:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-15 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem16:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-16 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem17:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-17 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem18:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-18 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem19:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-19 .orderArea-nav-button .orderArea-nav-button-icon, #rdbForOrderAreaItem20:checked ~ .orderArea-nav .orderArea-nav-sublist-item.nthChild-20 .orderArea-nav-button .orderArea-nav-button-icon, .orderArea-nav-button:hover .orderArea-nav-button-icon, .orderArea-nav-button:active .orderArea-nav-button-icon, .orderArea-nav-button:focus .orderArea-nav-button-icon { border-color: #363636; } .orderArea-content { padding: 0 1em; } .orderArea-content-header { overflow: auto; padding: 2em 1em; background-color: white; } .orderArea-content-header-name, .orderArea-content-header-price { float: left; font-weight: bold; } .orderArea-content-header-name { width: 70%; font-size: 1.5em; text-align: left; } .orderArea-content-header-price { width: 30%; text-align: right; } .orderArea-content-header-price-number { font-size: 2em; } .orderArea-content-box { overflow: auto; padding: 1em; margin: .5em auto; background-color: white; } .orderArea-content-box-figure { display: table; padding: 1em; } .orderArea-content-box-figure-img { // width: 30%; display: table-cell; vertical-align: middle; } .orderArea-content-box-data-extra { width: 75%; display: block; padding: .5em; margin: 0 auto; font-size: 1.2em; font-weight: bold; text-align: center; border-width: .5em; border-style: solid; border-color: #aaa transparent transparent; } .orderArea-content-box-data-services-list { overflow: auto; } .orderArea-content-box-data-services-list-item { width: 25%; padding: .5em; float: left; } .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service * { color: #eee; background-color: rgb(21, 66, 131); } .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:hover, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:active, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:focus, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:hover *, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:active *, .chkbxsForOrderDealsServices:checked + .orderArea-content-box-data-service:focus *, .orderArea-content-box-data-service:hover, .orderArea-content-box-data-service:active, .orderArea-content-box-data-service:focus, .orderArea-content-box-data-service:hover *, .orderArea-content-box-data-service:active *, .orderArea-content-box-data-service:focus * { color: #363636 !important; background-color: rgb(243,249,255) !important; } .orderArea-content-box-data-service:hover:after, .orderArea-content-box-data-service:active:after, .orderArea-content-box-data-service:hover:after, .chkbxsForOrderDealsServices:checked ~ .orderArea-content-box-data-service:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-check.png") !important; } .orderArea-content-box-data-service { position: relative; display: inline-block; padding: .5em; margin: 0 auto; text-align: center; cursor: pointer; } .orderArea-content-box-data-service-icon { position: relative; display: inline-block; width: auto; height: 4em; } .orderArea-content-box-data-service:after { content: ""; position: absolute; top: .5em; left: 0; right: 0; z-index: 1000; width: 2em; height: 2em; margin: 0 auto; border-radius: 50%; background: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/icon-cross.png") no-repeat center center #AAAAAA; background-size: 60% !important; } .orderArea-content-box-data-details { overflow: auto; } .orderArea-content-box-data-details-img { } .orderArea-content-box-data-details-img, .orderArea-content-box-data-details-content { float: left; } .orderArea-content-box-data-details-content-title { text-transform: uppercase; font-variant: small-caps; } .orderArea-content-box-data-details-content-subtitle { font-size: 1.2em; font-weight: bold; } .orderArea-content-box-data-details-content-text { padding: 1em 0; } .orderArea-content-box-data-buttons-list { overflow: auto; } .orderArea-content-box-data-button { position: relative; display: block; text-align: center; padding: .5em 1em; text-transform: lowercase; font-variant: small-caps; border-width: .5em; border-style: solid; border-color: rgb(243,249,255); cursor: pointer; border-radius: 5em; } .orderArea-content-box-data-buttons-list-item.nthChild-1 .orderArea-content-box-data-button, .orderArea-content-box-data-button:hover, .orderArea-content-box-data-button:active, .orderArea-content-box-data-button:focus { border-color: rgb(21, 66, 131); background-color: rgb(21, 66, 131); color: white; } .orderArea-content-box-data { position: relative; } .m-popup { display: none; position: absolute; top: 0; left: 0; z-index: 1000; width: 100%; height: 100%; background-color: rgb(21, 66, 131); } .RDBsForALLOrderAreaForms:checked + .m-popup { display: block; } .m-popup-header { height: 10%; // border: 1px solid red; } .m-popup-header-button { display: block; width: 3em; height: 3em; padding: .5em; margin: 0 auto; } .m-popup-header-button-img { width: auto; height: 100%; } .m-popup-body { height: 90%; padding: 1em 2em; overflow-y: auto; text-align: center; // border: 1px solid red; } .m-popup-body-title { font-size: 2em; padding-bottom: 1em; color: white; } .m-popup .u-input { margin: 1em .5em; } .m-popup textarea.u-input { min-height: 10em; } .m-popup .u-submit { text-transform: uppercase; background-color: #AAA; // color: white; } .u-input, .u-submit { border-radius: 5em; vertical-align: top; } textarea.u-input { border-radius: .5em; } textarea.is-hidden { display: none !important; } .orderArea-content-box-data-buttons-list-item.nthChild-share { // position: relative; } .orderArea-content-box-data-button-share { position: absolute; bottom: 4em; right: 0; z-index: 100; display: none; padding: .25em; // background-color: red; } .chkbxForSharingPackageItems:checked ~ .orderArea-content-box-data-button { background-color: rgb(21, 66, 131); border-color: rgb(21, 66, 131); color: white; } .chkbxForSharingPackageItems:checked ~ .orderArea-content-box-data-button-share { display: block !important; } .orderArea-content-box-data-button-share-link { display: block; width: 100%; padding: .5em; cursor: pointer; } .orderArea-content-box-data-button-share-link.is-facebook { background-color: #3b5998; } .orderArea-content-box-data-button-share-link.is-whatsapp { background-color: #4fce5d; } .orderArea-content-box-data-button-share-link.is-linkedin { background-color: #0e76a8; } .orderArea-content-box-data-button-share-link.is-email { background-color: #aaa; } .orderArea-content-box-data-button-share-link:hover, .orderArea-content-box-data-button-share-link:active, .orderArea-content-box-data-button-share-link:focus { background-color: rgb(21, 66, 131); color: white; } @media screen and (max-width: 50em) { .orderArea-nav-list-item-nav { width: 10%; } .orderArea-nav-sublist { width: 80%; } .orderArea-nav-list-item-nav { // border: 1px solid purple; } .orderArea-nav-sublist { padding: 0; } .orderArea-nav-sublist-item { width: 50%; padding: .25em; } .orderArea-content-box { margin: .5em; } .orderArea-content-header { margin: .25em .5em; } .orderArea-content-box-data-details-img { width: 40%; } .orderArea-content-box-data-details-content { width: 60%; } .orderArea-content-box-data-details-img, .orderArea-content-box-data-details-content { padding: 1em; } .orderArea-content-box-data-buttons-list-item { padding: .5em; } .orderArea-content-box-data-button-share { width: 100%; } .m-popup .u-input { width: 95%; } } @media screen and (min-width: 50em) { .orderArea-content-box-figure, .orderArea-content-box-data { width: 50%; float: left; } .orderArea-nav-list-item-nav { width: 5%; } .orderArea-nav-sublist { width: 90%; } .orderArea-nav-sublist-item { width: 25%; padding: 0 1em; } .orderArea-content-header { margin: .5em auto; } .orderArea-content-box-data-details-img, .orderArea-content-box-data-details-content { // padding: 2em; // width: 50%; } .orderArea-content-box-data-details-img { width: 40%; padding: 2em .5em; } .orderArea-content-box-data-details-content { width: 60%; padding: 2em; } .orderArea-content-box-data-buttons-list-item { padding: 1em; width: 33.33%; float: left; } .orderArea-content-box-data-button-share { width: 33.333%; } .m-popup .u-input { min-width: 45%; } .m-popup textarea.u-input { width: 95%; } } /** Services - Numbers **/ .numbers-content-list-item { padding: 2em; // border: 1px solid red; } .numbers-content-box-number, .numbers-content-box-text { display: block; text-align: center; } .numbers-content-box-number { font-size: 3em; } .numbers-content-box-text { // font-size: 1.2em; // font-weight: bold; } @media screen and (min-width: 50em) { .numbers-content-list { overflow: auto; } .numbers-content-list-item { width: 25%; float: left; } } /** Services - List **/ /** Services - Testimonies **/ .testimonies-content-box { position: relative; text-align: center; padding: 1em; } .testimonies-content-box:after { content: ""; position: absolute; top: 0; left: 17%; z-index: 10; display: block; width: 65%; height: 85%; // background-color: white; border-width: 10%; border-style: solid; border-color: rgb(21, 66, 131); } .testimonies-content-box-img, .testimonies-content-box-quote { position: relative; z-index: 20; } .testimonies-content-box-img { width: 60%; } .testimonies-content-box-quote { margin-top: 1em; } @media screen and (min-width: 50em) { .testimonies-content-list { overflow: auto; } .testimonies-content-list-item { width: 33.333%; float: left; } } /** Video **/ .video-tag, .quote-tag { display: block; margin: 0 auto; vertical-align: top; } .video-tag { width: 90%; border-width: 1em; border-style: solid; border-color: white; } .quote-tag { padding: 1em; text-align: center; } .quote-tag-q, .quote-tag-cite { display: inline-block; } @media screen and (max-width: 50em) { .quote-tag-q { font-size: 2em; } .quote-tag-cite { font-size: 1.5em; padding: 1em; } } @media screen and (min-width: 50em) { .quote-tag { width: 100%; } .quote-tag-q, .quote-tag-cite { padding: 1em; } .quote-tag-q { font-size: 3em; } .quote-tag-cite { font-size: 2em; } } /** Shop - Product **/ /* .shopBody { width: 100%; height: 100%; // width: 100vw;// height: 100vh; border: 1px solid red; } .productBody { border: 1px solid red; } body { border: 1px solid green; } */ .TestTestTest { cursor: test; } /*** END COMPONENTS ***/ /*** PAGES ***/ /** Home **/ /** Vision **/ /*** END PAGES ***/ /*** INTERACTIVITY ***/ .u-button, .u-link { cursor: pointer !important; } /*** END INTERACTIVITY ***/ /*** ANIMATIONS ***/ /*** END ANIMATIONS ***/ /*** MEDIA QUERIES ***/ @media screen and (max-width: 50em) { html, body { font-size: 14px; } .header-nav-logo, .header-nav-spacing, .u-button { font-size: 1.35em; } .pgLayout-home .header-banner-block2, .pgLayout-home .header-message { width: 75%; margin-left: 25%; } .pgLayout-other .header-banner-block2, .pgLayout-other .header-message { // width: 75%; width: 40%; // margin-left: 25%; } .pgLayout-home .header:after, .pgLayout-home .header-separator { left: 25%; } .pgLayout-other .header:after, .pgLayout-other .header-separator { left: 60%; } .pgLayout-home .header-separator { width: 20%; } .pgLayout-other .header-separator { width: 10%; } .pgLayout-home .header-message-separator { width: 10%; } .pgLayout-other .header-message-separator { width: 15%; } .pgLayout-home .header-message:after { left: 10%; } .pgLayout-other .header-message:after { left: 15%; } .header-nav-logo { padding-left: 1em; } .header-nav-spacing { min-width: 2.5em; width: 2.5em; max-width: 2.5em; } .header:after { display: none; } .header-banner { // position: relative; } .header-banner-block2 { position: relative; } .header-banner-block2:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1000%; } .header-message { right: -100%; } .header-message-content-number { display: none; } .header-message-content-wrap { border: none; } .header-message-content-wrap:after { display: none; } .u-button { padding: .25em .5em; } .m-header-title { position: relative; width: 75%; } .m-header.is-side-bottom-right .m-header-title { left: 25%; } .m-header.is-side-bottom-center .m-header-title { left: 12.5%; } } @media screen and (min-width: 50em){ html, body { font-size: 16px; } .header-nav-logo, .u-button { font-size: 1.7em; } .header:after, .header-separator { left: 60%; } .header-nav-spacing, .header-separator { min-width: 5em; width: 5em; max-width: 5em; } .pgLayout-other .header:after { margin-left: 5em; } .header-message:after { left: 2.5em; } .header-message-separator { width: 2.5em; } .header-message { right: -50%; } .u-button { padding: .25em .5em; } .m-header-title { width: 50%; position: relative; } .m-header.is-side-bottom-right .m-header-title { left: 50%; } .m-header.is-side-bottom-center .m-header-title { left: 25%; } .m-header-subtitle { width: 75%; position: relative; } .m-header.is-side-bottom-right .m-header-subtitle { left: 25%; } .m-header.is-side-bottom-center .m-header-subtitle { left: 12.5%; } } /*** END MEDIA QUERIES ***/ /*** DECORATIONS ***/ .d-max-normal, .d-max-normal-by50, .d-max-wide { display: block; margin: 0 auto; // border: 1px solid green; } .d-max-wide { max-width: 100em; } .d-max-normal { max-width: 90em; } .d-max-normal-by50 { max-width: 35em; } .u-section.d-has-wings { position: relative; } .u-section.d-has-top-wing { padding-top: 5em; } .u-section.d-has-bottom-wing { padding-bottom: 5em; } .u-section.d-has-top-wing:before, .u-section.d-has-bottom-wing:after { content: ""; position: absolute; left: 0; right: 0; width: 100%; height: 5em; background-size: 100% 100% !important; } .u-section.d-has-top-wing:before { top: 0; } .u-section.d-has-bottom-wing:after { bottom: 0; } .u-section.d-has-top-wing.d-wings_color-lightBlue.d-wings_side-left:before { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/wing_color-lightBlue_side-top-left.png"); } .u-section.d-has-top-wing.d-wings_color-lightBlue.d-wings_side-right:before { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/wing_color-lightBlue_side-top-right.png"); } .u-section.d-has-bottom-wing.d-wings_color-lightBlue.d-wings_side-left:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/wing_color-lightBlue_side-bottom-left.png"); } .u-section.d-has-bottom-wing.d-wings_color-lightBlue.d-wings_side-right:after { background-image: url("https://aqualizwater-beta-friday28jan.intobinary.org/assets/images/wing_color-lightBlue_side-bottom-right.png"); } /*** DECORATIONS ***/ /*** HACKS ***/ body, .pgLayout-home .header { padding-bottom: .1em; } .pgLayout-home .header-message:before { height: .1em; } /*** END HACKS ***/ /*** OVERRIDE ***/ /*** END OVERRIDE ***/ /*** BETAs ***/ /*** END BETAs ***/ /*** TO DELETE ***/ body, html { // min-height: 100em; } .pg-products-waterCoolers, .pg-products-drinkingWaterSolutions, .pg-products-bottledWater, .pg-products-accessories { // min-width: 400px; } .d-theyWantBasic { text-decoration: line-through !important; } /*** END TO DELETE ***/ /*=== END CUSTOM ===*/