* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    touch-action: manipulation;
}

.heading-style-h1 {
    font-size: 4.5rem;
    line-height: 1;
    letter-spacing: -.02em;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 900;
}

p {
    margin: 0;
}

body {
    font-family: 'Varela Round', sans-serif;
    color: #141618;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 300;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadein {

    /* Firefox */
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadein {

    /* Safari and Chrome */
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-o-keyframes fadein {

    /* Opera */
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.section_featured {
    animation: fadein 1s;
    -moz-animation: fadein 1s;
    /* Firefox */
    -webkit-animation: fadein 1s;
    /* Safari and Chrome */
    -o-animation: fadein 1s;
    /* Opera */
    margin-bottom: 4rem;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

.padding-global {
    padding-right: 2rem;
    padding-left: 2rem;
}

.padding-models {
    padding-right: 2rem;
}

.container-medium,
.container-small,
.container-large,
.container-xlarge,
.container-full,
.container-mobilekill {
    margin-right: auto !important;
    margin-left: auto !important;
}

.container-mobilekill {}

.affiliate-side {
    top: 13rem !important;
}

#affiliate-banner {
    background: #1b2649;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    display:none;
    opacity: .85;
}

#affiliate-url {
    transition: .25s;
    line-height: 0;
    border-bottom: 1px solid white;
    padding-bottom: .1rem;
}

#affiliate-url:hover {
    color: #c3dfff;
    border-bottom: 1px solid #c3dfff;
    padding-bottom: .3rem;
}

.lightbox-table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: none !important;
    display: table;
    margin-left: auto;
    margin-right: auto;
}

.lightbox-table th, td {
    text-align: center;
    padding: .5rem !important;
    display: table-cell !important;
    border: none !important;
    color: white;
    background-color: #3f4454;
}

.lightbox-table tr, td {
    color: #282b2e;
    background: white;
}

.learnmore-btn {
    transition: .75s;
}
.learnmore-btn:hover {
    color: #a4baff;
}

.table-container {
    margin: auto;
    width: 80%;
    max-width: 700px;
    border-collapse: collapse;
    animation-name: fadeIntest;
    animation-duration: .03s;
    -webkit-animation-name: fadeIntest;
    -webkit-animation-duration: .03s;
}

.table-collapse-header {
    display: none;
    margin-right: 1rem;
}

#pool_dimensions,
#pool_depth,
#pool_name,
#pool_benches,
#pool_seats,
#pool_steps {
    display: inline-block;
}

.flex-row,
.flex-cell {
    text-align: center;
}

.table-bottom-border-right {
    border-bottom-right-radius: .5rem;
}

.table-bottom-border-left {
    border-bottom-left-radius: .5rem;
}

.compare-table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: none !important;
    display: table;
    margin-left: auto;
    margin-right: auto;
}

.compare-table th, td {
    text-align: center;
    padding: .5rem !important;
    display: table-cell !important;
    border: none !important;
    background: none !important;
    color: #282b2e;
}

.compare-table td i {
    margin-left: .2rem;
}

.compare-table th:first-child, td:first-child {
    text-align: left;
}

.lightbox-table th:first-child, td:first-child {
    text-align: center;
}

.fa-check {
    color: green;
}

.fa-remove {
    color: red;
}

.container-full {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

.container-xlarge {
    width: 95%;
    margin-right: auto;
    margin-left: auto;
}

.container-large {
    width: 85%;
    margin-right: auto;
    margin-left: auto;
}

.container-medium {
    width: 65%;
    margin-right: auto;
    margin-left: auto;
}

.container-small {
    width: 55%;
    margin-right: auto;
    margin-left: auto;
}

.background {
    background: linear-gradient(180deg, #e9f1fc, #ffffff);
    height: 100vh;
}

.home-header-image-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.home-header-image-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.global-styles {
    position: fixed;
    left: 0;
    top: 0;
    right: auto;
    bottom: auto;
    display: block;
}

.padding-vertical {
    padding-right: 0rem !important;
    padding-left: 0rem !important;
}

.page-wrapper {
    position: relative;
}

.navbar_component {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: auto;
    z-index: 48;
    display: block;
    width: 100%;
    height: auto;
    color: #fff;
    transition: all .1s ease-in-out;
    background: rgba(255, 255, 255, .8);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(3.2px);
}

.navbar_container {
    display: grid;
    width: 100%;
    height: 100%;
    max-width: 84rem;
    margin-right: auto;
    margin-left: auto;
    padding-right: 2rem;
    padding-left: 2rem;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 0.3fr 0.8fr 0.3fr;
    grid-template-rows: auto;
}

.navbar_white {
    background-color: white !important;
}

.navbar_menu {
    position: static;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

.w-nav-menu {
    position: relative;
    float: right;
}

.navbar_menu-dropdown-products {
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 4.5rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.w-dropdown {
    position: relative;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    z-index: 51;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.section_home-header {
    position: relative;
    height: 100vh;
    max-height: 42rem;
    min-height: 35rem;
}

.section_explore {
    position: relative;
}

.explore-header {
    color: white;
    font-size: 3rem;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 700;
    margin-bottom: 2rem;
}

.warranty-header {
    color: white;
    font-size: 1.5rem;
    margin-bottom: 2rem;
}

.explore-subtext {
    color: white;
    font-size: 1.2rem;
}

.warranty-subtext {
    color: black;
    font-size: 1.2rem;
}

.navbar_link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    padding: .35rem .75rem;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    font-size: .755rem;
    font-weight: 400;
    text-decoration: none;
}

.home-header-content {
    display: -ms-grid;
    display: grid;
    height: 100vh;
    max-height: 42rem;
    min-height: 35rem;
    padding-bottom: 2rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    color: #273d72;
    text-align: center;
}

.home-header {
    position: relative;
    height: 100vh;
    max-height: 42rem;
    min-height: 35rem;
}

.home-header-video {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.node-text {
    -ms-grid-column-span: 1;
    grid-column-end: 2;
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row-span: 0;
    grid-row-end: 2;
    -ms-grid-row: 2;
    grid-row-start: 2;
}

.z-index-2 {
    position: relative;
    z-index: 2;
}

.navbar_logo-link {
    padding-left: 0.35rem;
}

.navbar-logo {
    display: flex;
    width: 9rem;
    height: auto;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

.w-nav-brand {
    position: relative;
    float: left;
    text-decoration: none;
    color: #333;
}

.w-input,
.w-select,
a {
    color: inherit;
    text-decoration: inherit;
    font-size: inherit;
}

a {
    background-color: transparent;
}

a:hover {
    background-color: transparent;
    text-decoration: none;
}

.header-node {
    -ms-grid-column-span: 1;
    grid-column-end: 2;
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row-span: 1;
    grid-row-end: 4;
    -ms-grid-row: 3;
    grid-row-start: 3;
    -ms-grid-row-align: end;
    align-self: end;
}

.home-header-text-cta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.max-width-small-custom2,
.max-width-xsmall-custom1 {
    width: 100%;
    max-width: 28rem;
}

.home-header-text-cta {
    text-align: center;
}

.home-header-support-text {
    font-size: 1.25rem;
}

.button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 1rem 1.75rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-column-gap: 0.5rem;
    border-radius: 100rem;
    background-color: #2c3c6e;
    color: white;
    font-size: 1.2rem;
    line-height: 1.2;
    font-weight: 400;
    text-align: center;
    letter-spacing: -.02em;
    text-decoration: none;
}

.w-inline-block {
    max-width: 100%;
    display: inline-block;
}

.button.display-inlineflex {
    position: relative;
}

.display-inlineflex {
    display: inline-flex;
}

.padding-bottom {
    padding-top: 0rem !important;
    padding-right: 0rem !important;
    padding-left: 0rem !important;
}

.padding-custom2 {
    padding: 3rem;
}

.navbar_button-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 1rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-column-gap: 1rem;
    justify-self: end;
}

.button.is-small {
    padding: 0.6rem 1.1rem;
    grid-column-gap: 0.25rem;
    font-size: .75rem;
}

.button.is-small.is-nav {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.padding-xlarge {
    padding: 4rem;
}

.padding-large {
    padding: 2rem;
}

.stats-grid {
    display: -ms-grid;
    display: grid;
    grid-column-gap: 2rem;
    grid-row-gap: 6rem;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr .75fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    margin-top: 7rem;
    background: #e8f0f9;
    padding: 2rem;
    border-radius: 2rem;
}

.explore-grid {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.max-width-small {
    width: 100%;
    max-width: 35rem;
}

.resource-header {
    font-size: 2rem;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 500;
    margin-bottom: 2rem;
}

.portal-header {
    font-size: 2rem;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 500;
    margin-bottom: 2rem;
    color: #273d72;
}

.warranty-page-header {
    font-size: 2rem;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 500;
}


.explore-node {}

.cta-bg-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.blog-grid {
    display: -ms-grid;
    display: grid;
    grid-column-gap: 2rem;
    grid-row-gap: 6rem;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}


.pools-grid {
    display: -ms-grid;
    display: grid;
    grid-column-gap: 1.125rem;
    grid-row-gap: 1.125rem;
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

.featured-grid {
    display: -ms-grid;
    display: grid;
    grid-column-gap: 3.1rem;
    grid-row-gap: 3.1rem;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}


.node-stats {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.node-pools {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.node-featured {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.stats-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
}

.pools-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
    border-radius: .5rem;
    position: relative;
    background: linear-gradient(180deg, rgb(242, 247, 255) 0%, rgb(255, 255, 255) 100%);
    padding: 1rem;
}

.featured-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
    border-radius: 2rem;
    position: relative;
}

.blog_image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.pool_image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.pool_image_3D {
    position: absolute;
    left: 0;
    top: -2rem;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.pool_image_header {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.featured_image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: 0.2s;
}

.featured_image:hover {
    opacity: .75;
}

.blog_image-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 80%;
    border-radius: .5rem;
    margin-bottom: 1.5rem;
}

.splash_badge {
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    margin: .8rem;
    line-height: 1;
    z-index: 3;
    border-radius: 50px;
    padding: 6px;
    box-shadow: 0px 0px 2px rgba(16, 47, 75, 0.26);
    background-image: url(/assets/images/branding/ledgeb.svg);
    background-repeat: no-repeat;
    width: 35px;
    height: 35px;
    border: 6px solid white;
    background-color: white;
}

.splash_badge img {
    shape-rendering: geometricprecision;
}

.new_badge {
    position: absolute;
    right: 0;
    pointer-events: none;
    top: 0;
    color: #fff;
    text-align: center;
    margin: 1rem;
    font-size: .7rem;
    padding: 0.5rem .6rem;
    border-radius: 13.5rem;
    line-height: 1;
    background: #0c141f;
}

.new_badge_nav {
    position: absolute;
    right: -.6rem;
    pointer-events: none;
    color: #fff;
    text-align: center;
    margin-top: -1.2rem;
    font-size: 0.4rem;
    padding: 0.2rem .3rem;
    border-radius: 13.5rem;
    background: #182038e1;
}

.pools_image-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 70%;
    margin-bottom: 1rem;
}

.pools_image-wrapper_3D {
    overflow: hidden;
    width: 100%;
    padding-top: 65%;
    margin-bottom: 1rem;
}

.featured_image-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 25rem;
    border-radius: .5rem;
}

.card_full-width {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    min-height: 28.125rem;
    border-radius: .5rem;
    background-color: #fff;
}

.card-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 34rem;
    padding: 4rem 3rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.heading-style-h5 {
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 300;
    letter-spacing: -.02em;
}

.button-outline {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: .5rem .75rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-column-gap: 0.5rem;
    border: 1px solid #fff;
    border-radius: .5rem;
    -webkit-transition: 250ms;
    transition: 250ms;
    font-size: .875rem;
    line-height: 1.2;
    font-weight: 400;
    text-align: center;
    letter-spacing: -.02em;
}

.card-image-wrapper {
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.card-image {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 0% 50%;
    object-position: 0% 50%;
}

.color-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 3rem;
    grid-row-gap: 1.5rem;
}

.color-grid-landmark {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 2rem;
    grid-row-gap: 1.5rem;
}

.color-stats {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.sampler-stats {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.color-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
    border-radius: 2rem;
    position: relative;
}


.sampler-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 1rem;
    padding: 1rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
}

.color-node {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
}

.color-wrapper p {
    padding-top: 1rem;
}

.vertical-align {
    margin-left: auto;
    margin-right: auto;
}

.module-button-blue {
    padding: 0.6rem 1.1rem;
    background: #182038 !important;
    display: inline-block;
    color: white !important;
    border-radius: 100rem;
    margin-top: 1rem;
    transition: 0.2s;
}

.navbar_dropdown-list {
    display: flex;
    min-width: 15rem;
    position: absolute;
    background: rgba(255, 255, 255, 0.97);
    top: 4.5rem;
    border-radius: .5rem;
    padding: 1rem;
    border: 1px solid rgb(197, 197, 197);
    z-index: 999;
    visibility: hidden;
    opacity: 0;
    transform: translateY(0.5rem);
    transition: all 0.1s cubic-bezier(0.16, 1, 0.5, 1);
}

.w-dropdown:hover .navbar_dropdown-list {
    visibility: visible;
    opacity: 1.0;
    transform: translateY(0rem);
}

.navbar_dropdown-links {
    text-align: left;
    width: 100%;
}

.navbar_dropdown-link:hover {
    color: #2c3c6e;
    background: rgb(236, 238, 245);
    transition: background-color 0.1s ease;
    border-radius: .5rem;
}

.navbar_dropdown-link {
    display: flex;
    padding: .75rem;
    align-items: center;
    grid-column-gap: .7rem;
    padding: .5rem;
    max-width: 100%;
    color: #2c3c6e;
}


.navbar_dropdown-link-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0 0 auto;
    border: 1px solid rgb(212, 212, 212);
    background: rgb(251, 252, 253);
    padding: .75rem;
    line-height: 0;
    border-radius: .5rem;
}

.navbar_dropdown-link-description {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.2rem;
}

.blog_image-link {

}

.blog_image-link:hover {
    color: inherit;
}

.module-button-white {
    padding: 0.6rem 1.1rem;
    background: #fff !important;
    display: inline-block;
    color: black !important;
    border-radius: 100rem;
    margin-top: 1rem;
    transition: background-color 0.5s ease;
}

.module-button-black {
    padding: 0.6rem 1.1rem;
    background: black !important;
    display: inline-block;
    color: white !important;
    border-radius: 100rem;
    margin-top: 1rem;
    transition: background-color 0.5s ease;
}

.module-button-black-big {
    padding: 0.9rem 1.4rem;
    background: black !important;
    display: inline-block;
    color: white !important;
    border-radius: 100rem;
    margin-top: 1rem;
}

.module-button-black-small {
    padding: 0.9rem 1.4rem;
    background: black !important;
    display: inline-block;
    color: white !important;
    border-radius: 100rem;
    margin-top: 1rem;
    font-size: 1rem;
    border:0;
}

.module-button-white:hover {
    opacity: .85;
}

.module-button-black:hover {
    opacity: .85;
}

.module-button-blue:hover {
    opacity: .85;
}

.split-module {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    -ms-grid-rows: minmax(100%, 47.5rem);
    grid-template-rows: minmax(100%, 29.5rem);
}

.sampler-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

.w-layout-grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1.2fr 1fr;
    grid-template-columns: 1.2fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    grid-row-gap: 16px;
    grid-column-gap: 16px;
}

.node-split {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column-align: end;
    justify-self: end;
}

.split-module-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 85rem;
    padding: 1rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.split-module-image {
    position: relative;
    width: 100%;
    -ms-grid-column-align: start;
    justify-self: start;
}

.image-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: 0.2s;
    border-radius: .5rem;
}

.half-wrapper {
    width: 60%;
}

.halfcolor-wrapper {
    width: 60%;
}

.max-width-medium-custom2 {
    max-width: 50%;
}

.half-image-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.halfcolor-image-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
}

.colorgallery-image-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    max-height: 25rem;
    margin-bottom: 1rem;
    border-radius: .5rem;
}

.halfcolor-image-product-cover {
    width: 50%;
    height: auto;
    max-width: 15rem;
}

.navbar_button-wrapper a:hover {
    color: white;
}

.heading-style-h3-custom1 {
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 700;
    font-size: 2.5rem;
    margin-bottom: 1.5rem;
}

.z-index-1 {
    position: relative;
    z-index: 1;
}

.color-header {
    font-size: 2rem;
    line-height: 1;
    font-weight: 300;
    text-align: center;
    letter-spacing: -.02em;
    padding-bottom: 3rem;
    color: #273d72;
}

.sampler-header {
    font-size: 2rem;
    line-height: 1;
    font-weight: 300;
    text-align: center;
    letter-spacing: -.02em;
    padding-bottom: 2rem;
    color: #273d72;
}

.mission-header {
    font-size: 1.3rem;
    line-height: 1.9;
    font-weight: 300;
    text-align: center;
    letter-spacing: -.02em;
    color: #0e1630;
}

.padding-split {
    padding-right: 2rem;
    padding-left: 2rem;
}

.section_logos {
    overflow: hidden;
    width: 100%;
    background-color: #fafafa;
}

.logos-wrapper {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 8.2rem;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
}

.logos-marquee {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.client-carousel-wrapper {
    width: 100%;
    height: 8.2rem;
}

.track-horizontal {
    position: absolute;
    white-space: nowrap;
    will-change: transform;
    animation: marquee-horizontal 40s linear infinite;
}

.logos-collection-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

img {
    border: 0;
    vertical-align: middle;
    display: inline-block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.client-logo {
    width: 11.25rem;
    margin-right: 1.125rem;
}

.track-horizontal,
.track-horizontal-fintech {
    position: absolute;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    background-color: #fff;
}

.pool-name {
    color: #141517;
    display: inline-block;
    line-height: 1.2;
    align-self: flex-end;
    font-size: 1.1rem;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 500;
}

.pool-size {
    font-size: .85rem;
    color:#4b4b4b;
}

.pool-description {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.heading-style-h4 {
    font-size: 2.2rem;
    line-height: 1.2;
    letter-spacing: -.02em;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 700;
    color: #3f4454;
}

.card-image-mobile {
    display: none;
}

.company_full-width {
    display: grid;
    grid-column-gap: 1.6rem;
    grid-template-columns: 1fr repeat(4, 16vw) 1fr;
    width: 100%;
    position: relative;
    padding: 6rem 0rem;
    background-color: #e8f0f9;
    background-image: url('/assets/images/textures/water.png');
    background-attachment: fixed;
}

.warranty_full-width {
    display: grid;
    grid-column-gap: 1.6rem;
    grid-template-columns: 1fr repeat(4, 16vw) 1fr;
    width: 100%;
    position: relative;
    padding: 6rem 0rem;
    background: #fff;
}

.company-grid {
    display: grid;
    row-gap: 1.6rem;
    grid-column-gap: 5.6rem;
    padding: 0 1.6rem;
    z-index: 1;
    grid-column: 2/-2;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: none;
    padding: 0;
}

.company-description-text {
    font-size: 1.1rem;
    color: #22272b;
}

.company-description-logo {
    display: flex;
    align-items: start;
    font-size: 2rem;
    color: #253541;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 700;
}

.warranty-description-logo {
    display: flex;
    align-items: center;
    font-size: 2rem;
    color: #253541;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 600;
}


.blog-header-text {
    font-size: 1.2rem;
    padding-bottom: .75rem;
    font-family: 'Red Hat Display', sans-serif !important;
    font-weight: 700;
    letter-spacing: .04rem;
    color: #2e3039;
}

.space-between {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #d3d3d5;
    margin-bottom: 1rem;
    padding-left: .5rem;
    padding-right: .5rem;
}

.blog-learn-text {
    color: #075aad;
}

.blog-description-text {
    padding-left: .5rem;
    padding-right: .5rem;
}

.header-wrapper {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.flex-center {
    display: flex;
    align-items: center;
    color: #2c3c6e;
    border: .1rem solid #2c3c6e;
    border-radius: 12px;
    padding: 0.5rem 1rem;
    transition: 0.1s;
    line-height: 0;
}

.flex-center:hover {
    background-color: #2c3c6e;
    color:white;
}

.heading-style-h3 i {
    font-size: 1.8rem;
}

.solutions-intro-grid {
    display: -ms-grid;
    display: grid;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -ms-flex-align: start;
    align-items: start;
    grid-auto-columns: 1fr;
    grid-column-gap: 3rem;
    grid-row-gap: 2rem;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    padding-bottom: 4rem;
}

.padding-xxlarge {
    padding: 5rem;
    padding-right: 5rem;
    padding-left: 5rem;
}

.footer_link-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-items: start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    grid-auto-columns: 100%;
    grid-row-gap: 0.25rem;
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

.footer_link {
    -webkit-transition: color 250ms;
    transition: color 250ms;
    color: #f4f4f4;
    font-size: .875rem;
    font-weight: 400;
    text-decoration: none;
}

.text-weight-medium {
    font-weight: 600;
    color: white;
}

.footer_menu-wrapper {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -ms-flex-align: start;
    align-items: start;
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

.footer_right-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-row-gap: 1.5rem;
}

.footer-bottom-flex {
    display: flex;
    justify-content: space-between;
}

.section-container {
    display: flex;
    align-items: flex-start;
    position: relative;
    gap: 2rem;
    margin-left: 2rem;
}

.section-left-header {
    font-size: 3.5rem;
    line-height: 120%;
    writing-mode: vertical-lr;
    transform: scale(-1);
    white-space: nowrap;
    display: inline-block;
    top: 11rem;
    position: sticky;
    font-weight: 400;
    color: black;
    font-family: 'Archivo', sans-serif;
}

.copyright {
    color: #fff;
    display: flex;
    align-self: center;
    padding-bottom: 1rem;
}

.socials {
    font-size: 1.6rem;
    color: white;
    padding-bottom: 1rem;
}

.socials a:hover {
    color: inherit;
}

.padding-footer {
    padding-top: 2rem;
}

.brochure-module-image {
    position: relative;
    width: 100%;
}

.brochure-module {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    -ms-grid-rows: minmax(100%, 40.5rem);
    grid-template-rows: minmax(100%, 40.5rem);
    padding-left: 4rem;
    padding-right: 4rem;
    padding-top: 0;
    padding-bottom: 0;
    background-color: #e8f0f9;
    background-image: url('/assets/images/textures/grain.png');
    background-attachment: fixed;
}

.cop27-image-wrapper {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.cop27-logo-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.brochure-module-content.is-expert-guidance {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.heading-style-h3 {
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 600;

}

.brochure-module-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 42.6875rem;
    padding: 2rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.bg-circle-image.is-cop27-bg {
    position: relative;
    z-index: 1;
    max-width: 33.75rem;
    margin-right: auto;
    margin-left: auto;
}

.eyebrow-text {
    margin-bottom: 1rem;
    font-size: 1.85rem;
    line-height: 1.2;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 700;
    color: #253541;
}

.text-size-large {
    font-size: 1.25rem;
    letter-spacing: -.02em;
}

.pool-first-thumb {
    position: absolute;
    left: auto;
    top: 0;
    right: 0;
    bottom: auto;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 100px;
    background-color: #ffffff40;
    -webkit-transition: .5s;
    transition: .5s;
    border-radius: .5rem;
}

.color-thumb {
    position: absolute;
    left: auto;
    top: 0;
    right: 0;
    bottom: auto;
    z-index: 2;
    display: flex;
    width: 100%;
    height: 100%;
    transition: .2s;
}

.pool-hover {
    position: absolute;
    left: auto;
    top: 0;
    right: 0;
    bottom: auto;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 100px;
    background-color: #ffffff40;
    -webkit-transition: .5s;
    transition: .2s;
    border-radius: .5rem;
}

.pool-hover:after {
    content:'';
    position:absolute;
    left:0; top:0;
    width:100%; height:100%;
    display:inline-block;
    background: linear-gradient(180deg, rgba(255,255,255,0) 61%, rgba(255,255,255,0.7021008232394521) 91%);
    pointer-events: none;
}

.navbar_pools {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    align-items: center;
    justify-content: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
    gap: 2rem;
    backdrop-filter: blur(3.2px);
}

.pool_center_description {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    background: white;

}

.topBar {
    background: #263238;
    color: rgba(255, 255, 255, 0.3);
    font-size: 22px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 20px 0;
    text-align: center;
}

.container {
    margin: 0 auto;
    padding: 0 10px;
    max-width: 800px;
}

.navbar_test {
    background: #455A64;
}

.nav {
    margin: 0 -10px;
    padding: 0 10px;
    list-style: none;
    display: flex;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}

.nav>li>a {
    padding: 14px 16px;
    display: block;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
}

.nav>li>a.active {
    border-bottom: 2px solid #E64A19;
}

.badge-small {
    color: #e85b7a;
    text-align: center;
    margin-left: .4rem;
    font-size: .8rem;
    padding: 0.4rem .6rem;
    border-radius: .5rem;
    line-height: 1;
    border: 1px solid #e85b7a;
    background: #ffffff9c;
}

.badge-medium {
    color: #4e6ccf;
    text-align: center;
    margin-left: .4rem;
    font-size: .8rem;
    padding: 0.4rem .6rem;
    border-radius: .5rem;
    line-height: 1;
    border: 1px solid #4e6ccf;
    background: #ffffff9c;
}

.badge-large {
    color: #f2814e;
    text-align: center;
    margin-left: .4rem;
    font-size: .8rem;
    padding: 0.4rem .6rem;
    border-radius: .5rem;
    line-height: 1;
    border: 1px solid #f2814e;
    background: #ffffff9c;
}

.pool-depth {
    font-size: .85rem;
    color:#4b4b4b;
}

.pool-name-flex {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    z-index: 4;
    justify-content: space-between;
    width: 100%;
    margin-bottom: .5rem;
}

.pool-dims-flex {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    z-index: 4;
    justify-content: space-between;
    width: 100%;
}

.navbar_pools div {
    padding: .4rem 1rem;
    color: #6e6d7a;
    background: rgba(255, 255, 255, 0.87);
    flex: 0 0 auto;
    border-radius: 100rem;
    border: 1px solid #dbdbdb;
    font-size: clamp(16px, 1rem, 14px);
}

.navbar_pools div a {
    display: inline-block;
    text-decoration: none;
    color: #5d5b66;
}

.navbar_pools div:hover {
    border: 1px solid #939393;
    transition: 0.3s ease border;
}

.navbar_pools div.active {
    background-color: #0c141f;
    border: 1px solid #0c141f;
    transition: 0.3s ease background-color;
}

.navbar_pools div.active a {
    color: white;
}

.color-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 100%;
    border-radius: 12px;
}

.sampler-module {
    background-color: #e8f0f9;
    background-image: url('/assets/images/textures/grain.png');
    background-attachment: fixed;
}

.half-grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    grid-row-gap: 16px;
    grid-column-gap: 16px;
}

.half-module {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: minmax(100%, 47.5rem);
    /*grid-template-rows: calc(-56px + 95vh);*/
}

.half-node {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column-align: end;
    justify-self: end;
}

.halfcolor-module-content {
    flex: 1 1 0%;
    width: 100%;
    height: 100%;
    padding: 2rem;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    flex-flow: column nowrap;
    background-color: #fff !important;
    color: black !important;
}

.halfcolor-module-image {
    position: relative;
    width: 100%;
}

.halfcolor-module-image-node {
    justify-self: start;
}

.color-gallery-container {
    max-height: 30rem;
}

.halfcolor-module-product-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 60rem;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.section_halfcolor {
    padding-bottom: 2rem;
}

.halfcolor-grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    grid-row-gap: 16px;
    grid-column-gap: 16px;
}

.halfcolor-module {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: minmax(100%, 25rem);
    margin-bottom: 4rem;
    /*grid-template-rows: calc(-56px + 95vh);*/
}

.half-module {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: minmax(100%, 47.5rem);
    /*grid-template-rows: calc(-56px + 95vh);*/
}

.half-node {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column-align: end;
    justify-self: end;
}

.half-module-content {
    flex: 1 1 0%;
    width: 100%;
    height: 100%;
    padding: 2rem;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    flex-flow: column nowrap;
    background-color: #e8f0f9;
}

.half-module-content-warranty {
    flex: 1 1 0%;
    width: 100%;
    height: 100%;
    padding: 2rem;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    flex-flow: column nowrap;
    background-color: #e8f0f9;
}

.half-module-image {
    position: relative;
    width: 100%;
}

.half-module-image-node {
    justify-self: start;
}

.half-module-product-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 60rem;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.sampler-wrapper p {
    padding-top: 1rem;
    text-wrap: nowrap;
}

.sampler-wrapper img {
    max-width: 8rem;
    min-width: 6rem;
}

.color_image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.color-description {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 1rem;
    font-size: 1.1rem;
    color: #38393b;
}

.show {
    background: rgba(255, 255, 255, .85);
}

.featured_link {
    width: 100%;
    height: 100%;
}

.topnav {
    overflow: hidden;
    display: none;
    padding: 0 2rem;
}

.topnav-fullscreen {
    height: 100vh;
}

.topnav a {
    float: left;
    display: block;
    color: #3b3b3b;
    text-align: center;
    padding: 1rem 0;
    text-decoration: none;
    font-size: 17px;
    border-bottom: .1rem solid #dedede;
}

.active {
    background-color: red;
    color: white;
}

.navbar_container .icon {
    display: none;
    color: black;
    text-decoration: none;
    font-size: 2rem;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 17px;
    border: none;
    outline: none;
    color: #3b3b3b;
    padding: 1rem 0;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.topnav a:hover,
.dropdown:hover .dropbtn {
    background-color: white;
    color: #a1a1a1;
}

.dropdown-content a:hover {
    background-color: #ddd;
    color: black;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.solid-image-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 35rem;
    max-width: 40rem;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.solid-image {
    width: 100%;
    height: 135%;
    max-width: none;
    -o-object-fit: contain;
    object-fit: contain;
}

.solid-content-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    grid-auto-columns: 1fr;
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
}

.padding-xsmall {
    padding: 1rem;
}

.max-width-small-custom2,
.max-width-xsmall-custom1 {
    width: 100%;
    max-width: 28rem;
}

.padding-medium {
    padding: 2rem;
}

.background-color-taupe {
    background-color: #fafafa;
}

.solid-image-wrapper.show-mobile-landscape {
    display: none;
}

/* Slideshow container */
.slideshow-container {
    position: relative;
    margin: auto;
}

/* Next & previous buttons */
.prev,
.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -22px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

/* Position the "next button" to the right */
.next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

/* Caption text */
.text {
    color: #f2f2f2;
    font-size: 15px;
    padding: 8px 12px;
    position: absolute;
    bottom: 8px;
    width: 100%;
    text-align: center;
}

#myBtn {
    display: none;
    /* Hidden by default */
    position: fixed;
    bottom: 1rem;
    right: 0px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #000000c7;
    color: white;
    cursor: pointer;
    padding: .9rem .7rem .9rem 1rem;
    border-radius: .5rem 0 0 .5rem;
    font-size: 18px;
}

#myBtn:hover {
    background-color: #555;
    /* Add a dark-grey background on hover */
}

/* Number text (1/3 etc) */
.numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

/* The dots/bullets/indicators */
.dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active,
.dot:hover {
    background-color: #717171;
}

/* Fading animation */
.fade {
    animation-name: fade;
    animation-duration: 1.5s;
}

.mySlides {
    display: none
}

@keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {

    .prev,
    .next,
    .text {
        font-size: 11px
    }
}

@media screen and (max-width: 767px) {
    .solid-image-wrapper {
        width: 100%;
        height: 19.3rem;
        -o-object-fit: fill;
        object-fit: fill;
        -o-object-position: 50% 0%;
        object-position: 50% 0%;
    }

    .padding-global {
        padding-right: .5rem;
        padding-left: .5rem;
    }

    .section_featured {
        margin-bottom: 0;
    }

    .featured_image-wrapper {
        padding-top: 14rem;
    }

    .section-container {
        gap: 1rem;
        margin-left: 1rem;
    }

    .section-left-header {
        font-size: 2rem;
    }

    .compare-table th:first-child, td:first-child {
        text-align: right;
    }

    .lightbox-table th:first-child, td:first-child {
        text-align: center;
    }

    .top-padding-smaller-mobile {
        padding: 7rem !important;
        padding-right: 0rem !important;
        padding-left: 0rem !important;
    }

    .half-module-content {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
        order: -1;
        grid-row-gap: 2rem;
    }

    .half-module-content-warranty {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
        -webkit-box-ordinal-group: 0;
        -webkit-order: 1;
        -ms-flex-order: 1;
        order: 1;
        grid-row-gap: 2rem;
    }

    .half-wrapper {
        width: 100%;
    }

    .half-module {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .halfcolor-module-content {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
        order: -1;
        grid-row-gap: 2rem;
    }

    .halfcolor-wrapper {
        width: 100%;
    }

    .halfcolor-module {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .sampler-wrapper p {
        padding-top: 1rem;
        font-size: .80rem;
    }

    .sampler-column {
        padding: .5rem;
    }

    .sampler-header {
        font-size: 1.5rem;
        padding-bottom: 0rem;
    }

    .company-description-logo {
        font-size: 1.5rem;
    }

    .warranty-description-logo {
        font-size: 1.5rem;
    }

    .navbar_pools div:hover {
        border: 1px solid white;
    }

    .company_full-width {
        padding: 3rem 0rem;
    }

    .warranty_full-width {
        padding: 3rem 0rem;
    }

    .solid-content-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .slideshow-container {
        padding-left: 0rem;
        padding-right: 0rem;
    }

    .home-header-support-text {
        font-size: 1.1rem;
    }
}

@media screen and (max-width: 991px) {
    .solid-image {
        height: 100%;
    }

    .sampler-wrapper img {
        max-width: 9rem;
    }
}



@media screen and (max-width: 991px) {
    .topnav {
        display: block;
    }

    .topnav a,
    .dropdown .dropbtn {
        display: none;
    }

    .navbar_container a.icon {
        float: right;
        display: block;
    }
}

@media screen and (max-width: 991px) {
    .topnav.responsive {
        position: relative;
    }

    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }

    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }

    .topnav.responsive .dropdown {
        float: none;
    }

    .topnav.responsive .dropdown-content {
        position: relative;
    }

    .topnav.responsive .dropdown .dropbtn {
        display: block;
        width: 100%;
        text-align: left;
    }
}

#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

/* The Modal (background) */
.modal {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 51;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(24, 29, 34, 0.93);
}

/* The Modal (background) */
.lightbox {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 51;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /*     background-color: rgba(255, 255, 255, 0.808);*/
    background-color: rgba(24, 29, 34, 0.93);
}

/* The Modal (background) */
.lightbox-container {
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    height: 100%;
}

.lightbox-module {
    margin: auto;
    display: block;
    max-width: 900px;
    text-align: center;
    color: #ccc;
}

/* Modal Content (image) */
.lightbox-contents {
    background: white;
    pointer-events: all;
    -webkit-animation-name: fadeIntest;
    -webkit-animation-duration: 0.3s;
    animation-name: fadeIntest;
    animation-duration: 0.3s;
    border-radius: .5rem;
}

/* Caption of Modal Image */
#caption_container {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 1rem 0;
    display: none;
}

/* Caption of Modal Image */
#caption {
    border: 1px solid white;
    display: inline-block;
    padding: .5rem 1rem;
    border-radius: 100rem;
    background: white;
    color: black;
}

/* Caption of Modal Image */
#toggle_btn {
    display: block;
    text-align: center;
    background: #fff;
    color: black;
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    max-width: 18%;
    border-radius: .5rem;
    opacity: .8;
    transition: 0.3s;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    pointer-events: all;
}

#toggle_btn:hover {
    opacity: 1;
    transform: scale(1.05);
}

.modal-container {
    position: relative;
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    margin-top: 2rem;
}

#dimensions {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
}

/* Add Animation */
.modal-container,
#caption {
    -webkit-animation-name: fadeIntest;
    -webkit-animation-duration: 0.3s;
    animation-name: fadeIntest;
    animation-duration: 0.3s;
}

@keyframes fadeIntest {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOuttest {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(0)
    }

    to {
        -webkit-transform: scale(1)
    }
}

@keyframes zoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

/* The Close Button */
.close {
    position: absolute;
    top: 0rem;
    right: 2rem;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

caption {
    display: none;
}

div {
    box-sizing: border-box;
}
.portal-guide-grid-container {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto;
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    padding: 3rem 0;
}
.portal-item-header {
  font-size: 2rem;
  padding:1rem;
  font-family: 'Archivo', sans-serif;
  font-weight: 400;
  padding-left: 1.5rem;
}
.portal-column {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
    border-radius: .5rem;
    position: relative;
    background: linear-gradient(180deg, rgb(242, 247, 255) 0%, rgb(255, 255, 255) 100%);
    padding: 6rem;
}
.portal_image_header {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.portal-first-thumb {
    position: absolute;
    left: auto;
    top: 0;
    right: 0;
    bottom: auto;
    z-index: 2;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background-color: #ffffff40;
    transition: .5s;
    border-radius: .5rem;
}
.portal-guide-desc {
    color: #394650;
  position: absolute;
  z-index: 4;
  bottom: 0;
  left: 0;
  padding: 2.4rem;
  line-height: 0;
  font-size: 1.2rem;
  font-weight: 600;
  font-family: 'Archivo', sans-serif;
}
.portal-first-thumb:after {
    content:'';
    position:absolute;
    left:0; top:0;
    width:100%; height:100%;
    display:inline-block;
    background: linear-gradient(-130deg, rgba(255,255,255,0) 21%, rgba(255,255,255,0.9021008232394521) 91%);
    pointer-events: none;
}
.portal-grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  padding: 1rem;
  grid-column-gap: 1.125rem;
  grid-row-gap: 1.125rem;
}
.portal-grid-item {
  padding: 1rem;
  font-size: 1rem;
  text-align: center;
  position: relative;
  border-radius: 1rem;
  background: linear-gradient(180deg, rgb(242, 247, 255) 0%, rgb(255, 255, 255) 100%);
  text-decoration:none;
}

@media screen and (max-width: 1200px) {
    .portal-grid-container {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}

@media screen and (max-width: 991px) {
    .portal-grid-container {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .portal-guide-grid-container {
        grid-template-columns: auto;
    }
}

@media screen and (max-width: 767px) {
    .portal-grid-container {
        grid-template-columns: 1fr 1fr;
    }
        .portal-guide-grid-container {
            grid-template-columns: auto;
    }
}
.portal-grid-dl-icon {
    position: absolute;
  right: 0;
  top: 0;
  padding: 1rem;
}
.portal-grid-img {
max-width: 9rem;
}

.table-container {
    margin: auto;
    width: 80%;
    max-width: 700px;
    border-collapse: collapse;
    animation-name: fadeIntest;
    animation-duration: .03s;
    -webkit-animation-name: fadeIntest;
    -webkit-animation-duration: .03s;
}

.table-collapse-header {
    display: none;
    margin-right: 1rem;
}

#pool_dimensions,
#pool_depth,
#pool_name,
#pool_benches,
#pool_seats,
#pool_steps {
    display: inline-block;
}

td {
    padding: 1em;
    background: white;
}

th {
    background: #54637b;
    color: #fff;
    padding: 0.5em;
}

.flex-row,
.flex-cell {
    text-align: center;
}

.table-bottom-border-right {
    border-bottom-right-radius: .5rem;
}

.table-bottom-border-left {
    border-bottom-left-radius: .5rem;
}

.cta-bg-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.padding-xhuge {
    padding: 11rem;
}

.padding-huge {
    padding: 9rem;
}

.slide-caption-colors {
    position: absolute;
    top: 70%;
    left: 50%;
    display: flex;
    align-content: center;
    z-index: 1;
    color: #fff;
    text-align: center;
    transition: opacity .15s ease;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 900;
    transform: translate(-50%, -50%);
    font-size: 4rem;
    animation: fadein 1s;
    -moz-animation: fadein 1s;
    -webkit-animation: fadein 1s;
    -o-animation: fadein 1s;
}

.caption-color {
    display: block;
    border-radius: 100rem;
    padding: 1rem;
    margin: .5rem;
    border: 5px solid white;
}

.video-grid {
    width: 100%;
    background-color: rgb(255, 255, 255);
}

.video-container {
    background-color: black;
    margin: 0 auto;
    max-width: 65rem;
}

.flex-video {
    padding: 56.25% 0 0 0;
    position: relative;
    margin-bottom: 7rem;
}

.slides-content {
    height: 100vh;
    max-height: 42rem;
    min-height: 35rem;
    padding-bottom: 2.5rem;
    color: #273d72;
    position: relative;
}

.slide-item-container {
    height: 100vh !important;
}

.subpage-item-container {
    height: 90vh !important;
}

.dealer-item-container {
    height: 75vh !important;
}

.page404-item-container {
    height: 100vh !important;
}

.slide-caption {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    color: #fff;
    text-align: center;
    transition: opacity .15s ease;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 600;
    transform: translate(-50%, -50%);
    font-size: 4rem;
    text-shadow: 4px 5px 19px rgba(0, 0, 0, 0.2);
    animation: fadein 1s;
    -moz-animation: fadein 1s;
    -webkit-animation: fadein 1s;
    -o-animation: fadein 1s;
}

.login-caption {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    color: #fff;
    text-align: center;
    transition: opacity .15s ease;
    font-family: 'Red Hat Display', sans-serif;
    font-weight: 600;
    transform: translate(-50%, -50%);
    font-size: 1.5rem;
    animation: fadein 1s;
    -moz-animation: fadein 1s;
    -webkit-animation: fadein 1s;
    -o-animation: fadein 1s;
    background: #fffffff2;
  padding: 2rem;
  border-radius: 1.5rem;
  max-width: 26rem;
}

.carousel-control-container {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 3rem;
    padding: 1.6rem 4.1rem;
    z-index: 1;
    background: rgba(24, 32, 56, 0.8);
    border-radius: 5rem;
    box-shadow: 0 4px 30px rgb(0,0, 0, .1);
    backdrop-filter: blur(3.2px);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.carousel-caption-container {
    z-index: 1;
    bottom: 0;
    left: 0;
    position: absolute;
    padding: 0.85rem 1.4rem;
    right: unset;
    max-width: 60vw;
    text-align: left;
    background: rgba(24, 32, 56, 0.8);
    border-radius: 5rem;
    box-shadow: 0 4px 30px rgb(0,0, 0, .1);
    backdrop-filter: blur(3.2px);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.carousel-overlay-margin {
    margin: 2.3rem;
}

.carousel-control-container a {
    width: 50%;
}

.carousel-border-radius {
    border-radius: 0rem;
}

.featured-description-container {
    position: absolute;
    left: 0;
    display: block;
    background: #182038;
    color: white;
    border-radius: 0 .5rem;
    padding: 1rem;
    text-align: left;
    bottom: 0;
}

.featured-description-container-right {
    position: absolute;
    right: 0;
    display: block;
    background: #182038;
    color: white;
    border-radius: .5rem 0;
    padding: 1rem;
    text-align: right;
    bottom: 0;
}

.featured-pool-name {
    font-size: 1.2rem;
}

.featured-pool-dimensions {
    display: none;
}

.featured-pool-learn {
    display: none;
}

@media only screen and (max-width: 767px) {
    
    .carousel-border-radius {
        border-radius: 0;
    }

    .carousel-control-container {
        padding: 1.2rem 3rem;
    }

    .carousel-caption-container {
        padding: 0.45rem 1.4rem;
    }

    .carousel-control-prev-icon,
    .carousel-control-next-icon {
        width: 15px;
        height: 15px;
    }

    .carousel-overlay-margin {
        margin: 1.3rem;
    }

    .slide-item-container {
        max-height: 36rem;
    }

    .subpage-item-container {
        max-height: 36rem;
    }
    
    .dealer-item-container {
        max-height: 36rem;
    }

    .home-header-content {
        max-height: 32rem;
        min-height: 32rem;
    }

    .home-header {
        max-height: 32rem;
        min-height: 32rem;
    }

    .slide-caption {
        font-size: 2rem;
    }
    
        .login-caption {
            top: 55%;
        font-size: 1.1rem;
    }

    .lightbox-table {
        width: 100%;
    }

    .modal-content {
        border-radius: 0;
    }

    .table-bottom-border-right {
        border-bottom-right-radius: 0;
    }

    .table-bottom-border-left {
        border-bottom-left-radius: 0;
    }

    .table-collapse-header {
        display: inline-block;
    }

    .lightbox-table thead {
        display: none;
    }

    .lightbox-table th, td {
        width: auto;
        display: block;
        border: 0;
    }

    .lightbox-table th {
        border-left: solid 1px #1565C0;
        border-right: solid 1px #1565C0;
        border-bottom: solid 1px #1565C0;
    }

    .lightbox-table td {
        border-left: solid 1px #d9d9d9;
        border-right: solid 1px #d9d9d9;
        border-bottom: solid 1px #d9d9d9;
    }

    .lightbox-table tr {
        display: flex;
        flex-direction: column;
    }

    .flex-row {
        width: 100%;
    }
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px) {
    .modal-container {
        width: 100%;
    }
}

@media screen and (max-width: 767px) {
    .card_full-width {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}

@media screen and (max-width: 991px) {
    .card_full-width {
        min-height: 24rem;
    }
}

@media screen and (max-width: 479px) {
    .section_home-header {
        height: auto;
    }
}

@media screen and (max-width: 991px) {
    .section_home-header {
        max-height: 46rem;
    }
}

@media only screen and (max-width: 1920px) and (min-width: 991px) {

    .dropdown-menu-title,
    .navbar_link,
    .min-size-14 {
        font-size: clamp(18px, 1rem, 16px);
    }

    .min-size-16-small {
        font-size: clamp(16px, 1rem, 16px);
    }

}

@media screen and (max-width: 767px) {
    .split-module {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}

@media screen and (max-width: 991px) {
    .split-module {
        -ms-grid-rows: minmax(100%, 30rem);
        grid-template-rows: minmax(100%, 30rem);
    }

    .featured-description-container-right {
        left: 0;
        right: unset;
        border-radius: 0 .5rem;
    }

    .featured-grid {
        grid-template-columns: 1fr;
        grid-row-gap: 2rem;
    }

    .sampler-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .color-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .color-grid-landmark {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media screen and (max-width: 991px) {
    .heading-style-h4 {
        font-size: 2.1rem;
    }
}


@media screen and (max-width: 1200px) {
    .container-large {
        width: 90%;
    }

    .container-medium {
        width: 80%;
    }

    .pools-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-row-gap: 2rem;
    }
}

@media screen and (max-width: 767px) {
    .heading-style-h4 {
        font-size: 1.5rem;
    }

    .color-grid {
        grid-template-columns: 1fr 1fr;
    }

    .color-grid-landmark {
        grid-template-columns: 1fr 1fr;
    }

    .footer-bottom-flex {
        display: block;
    }

    .company-grid {
        grid-template-columns: none;
        row-gap: 2.6rem;
    }
}

@media screen and (max-width: 767px) {
    .brochure-module {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .container-large {
        width: 95%;
        margin-right: auto;
        margin-left: auto;
    }

    .compare-table th, td {
        font-size: .75rem;
        padding: 1rem 0rem !important;
    }
}

@media screen and (max-width: 767px) {
    .split-module-content {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
        order: -1;
        grid-row-gap: 2rem;
    }

    .container-mobilekill {
        width: 100% !important;
    }

    .navbar_pools {
        padding-left: 1rem;
        padding-right: 1rem;
        justify-content: start;
        gap: .75rem;
    }
}

@media screen and (max-width: 991px) {
    .split-module-content {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
    }

    .navbar_menu {
        display: none;
    }

    .padding-split {
        padding-right: 0;
        padding-left: 0;
    }

    .pools-grid {
        grid-template-columns: 1fr 1fr;
        grid-row-gap: 2rem;
    }

    .navbar_button-wrapper {
        display: none;
    }

    .navbar_container {
        min-height: 4.48rem;
        display: flex;
    }

    .modal-container {
        margin-top: 5rem;
    }
}

@media screen and (max-width: 991px) {
    .heading-style-h1 {
        font-size: 3.25rem;
    }

    .stats-grid {
        grid-row-gap: 2rem;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
    }

    .blog-grid {
        grid-row-gap: 2rem;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        -ms-grid-rows: auto auto auto;
        grid-template-rows: auto auto auto;
    }
}

@media screen and (max-width: 767px) {
    .navbar_container {
        padding-left: 1rem;
    }

    .pools-grid {
        grid-template-columns: 1fr;
        grid-row-gap: 2rem;
    }

}