/* page default css */
    html,body{ scroll-behavior: smooth !important; }
    .hot-tub-category{ width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
    .hot-tub-category h1{ font-size: 3.1rem;text-align: left; line-height: 1.05; }
    .hot-tub-category h2{ font-size: 2.5rem; text-align: left;}
    .hot-tub-category p{ color: #3d3d3d;font-size: 1.06rem;line-height: 1.75;text-align: left; }
    

    .hot-tub-category img{ display: block; width: 100%; max-width: 100%;margin: 0 auto; }

    .hot-tub-category{ padding-top: 40px; }

    /* slider css */
    .slider:not(.slick-slider){ display: flex;flex-wrap: nowrap;  }
    .slider .slide{ padding: 0px 7px; box-sizing: border-box; }
    .slider .slick-arrow{ position: absolute;top: 50% !important;font-size: 0px;padding: 0px;display: none !important; }
    .slider .slick-arrow.slick-prev{left: 0%;transform: translate(-50%, -50%);}
    .slider .slick-arrow.slick-next{ right: 0%;transform: translate(0%, -50%); } 

    .slider button.slick-arrow{position: absolute;background-color: transparent;display: flex;align-items: center;justify-content: center;font-size: 0px;height: 120px;width: 120px;top: 50%;z-index: 99;opacity: 1;}
    .slider button.slick-arrow:before{content:"";display: block;border-top: 2px solid #0090d2;background-color: transparent;width: 60px;height: 60px;opacity: 1;}
    .slider button.slick-prev:before{border-left: 2px solid #0090d2;transform: rotate(-45deg);}
    .slider button.slick-next:before{border-right: 2px solid #0090d2;transform: rotate(45deg);}
    .slider  .slick-dots{ display: flex !important;justify-content: center; }
    .slider  .slick-dots li { padding: 4px; }
    .slider  .slick-dots li button{ font-size: 0px;width:10px;height: 10px;border-radius: 50%;background-color: #ddd; }
    .slider  .slick-dots li.slick-active button{ background-color: #EF5B3F; }
    .slider .slick-dots li:only-child { display: none; }


    /* container|row|column css */
    .custom-container { position: relative;display: block;width: 100%;max-width: 1200px;margin: 0px auto; padding: 10px;box-sizing: border-box; }
    .custom-row { display: flex;flex-wrap: wrap;margin: 0px;margin-left: -10px;margin-right: -10px;box-sizing: border-box; }
    .col-full { width: 100%;padding: 15px; }
    .col-half { width: 50%;padding: 15px; }
    .col-8{ width: 66.66%;padding: 15px; }
    .col-4{ width: 33.33%;padding: 15px; }
    li.col-half{ width: 100%;max-width: 48%; }

    /* some css rules */
    .first-letter-capital{ text-transform: lowercase; }
    .first-letter-capital:first-letter{ text-transform: uppercase; }
    .bold{ font-weight: bold; }
    .semi-bold{ font-weight: 600; }
    .w-100{ width: 100%; }
    .text-center, h1.text-center, h2.text-center, div.text-center{ text-align: center; }
    .font-size-normal, p.font-size-normal, .card p.font-size-normal{ font-size: 1rem; }
    .flex, .list.flex{ display: flex;gap: 10px; }
    .flex-wrap{ flex-wrap: wrap; }
    .inline-flex, .btn.inline-flex{ display: inline-flex;gap: 10px; }
    .item-center, .btn.item-center{ align-items: center; }
    .page .no-shadow, .page div.no-shadow, .card.no-shadow, .no-shadow{ box-shadow: none; }
    .page .no-border, .page div.no-border, .card.no-border, .no-border{ border: none; }
    .padding-top-0, div.padding-top-0{ padding-top: 0px; }
    .padding-0, div.padding-0{ padding: 0px; }

    .btn{ display: inline-block;box-shadow: 0 2px 3px rgba(0,0,0,0.2); padding: 10px 12px;font-size: 1rem; text-align: center; text-decoration: none; border-radius: 4px; }

    .btn svg{width: 20px; height: 20px;}
    .btn-orange{ background-color: #EF5B3F; color: #fff; }
    .btn-orange svg path{ fill: #fff; }

    .btn-primary{ background-color: #294697; color: #fff; }
    .btn-primary svg path{ fill: #fff; }

    .btn-secondary{ background-color: #0090d2; color: #fff; }
    .btn-secondary svg path{ fill: #fff; }

    .btn-white{ background-color: #fff; color: #294697; }
    .btn-white svg path{ fill: #294697; }

    .only-link { text-decoration: underline; }
    .only-link svg{width: 20px; height: 20px;}
    .only-link.secondary-color svg path{ fill: #0090d2; }


    /* colors */
    .primary-color { color: #294697; }
    .secondary-color, div.secondary-color, h1.secondary-color, h2.secondary-color, p.secondary-color, a.secondary-color, span.secondary-color{ color: #0090d2 !important; }
    .white-color, .category-page .white-color { color: #fff !important; }
    .bg-orange { background-color: #EF5B3F; color: #fff; }
    .bg-blue { background-color: #294697; color: #fff; }
    .bg-light-blue { background-color: #0090d2; color: #fff; }
    .bg-white { background-color: #fff; }

    /* banner css */
    .newport-hot-tub .banner{ position: relative; display: block; padding: 0px;width: 100%;background-size: cover; background-position: center; height: 400px; margin: 15px 0px; }

    .newport-hot-tub .banner-1{ display: flex;align-items: end;width: 100%;background-image: url('/Themes/Lighthouse/Content/images/assets/static_page/all_swim_hot_tub_explainer/photo_6.webp');background-position-y: 75%; } 
    .newport-hot-tub .banner.banner-1 .custom-container{ margin: 0px auto 55px auto; }
    .newport-hot-tub .banner.banner-1 h2{ color: #fff !important;text-shadow: 0 2px 3px rgba(0,0,0,0.3);font-size: 2.97rem; }

    /* section css */
    .section:first-child{ padding-top: 0px; }
    .section{ position: relative; display: block; padding: 30px 0px; }
    .section.bg-blue h1:not(.no-blue-bg-effect), .section.bg-blue h2:not(.no-blue-bg-effect), .section.bg-blue p:not(.no-blue-bg-effect), .section.bg-blue li:not(.no-blue-bg-effect){ color: #fff !important; }

    /* section-list css */
    .sections-list{ display: flex;flex-wrap: wrap;width: 100%; }
    .sections-list .section.bg-section{ padding: 0px;min-height: 520px;background-color: #f5fbff; }
    .sections-list .section{ display: block;width: 100%;overflow: hidden; }
    .sections-list .section .custom-container, .sections-list .section .custom-row{ height: 100%; }
    .sections-list .section .custom-row{ margin: 0px;width: 100%; }
    .sections-list .section .col-half{ display: flex;flex-wrap: wrap; justify-content: center; align-items: center; padding: 0px;height: 100%; }
    .sections-list .section .picture-col{ display: block; padding: 0px;background-repeat: no-repeat;background-size: cover;background-image: none !important; }
    .sections-list .section.bg-section .picture-col img{ display: block;width: 100%;height: 100%;object-fit: cover; }
    
    .sections-list .custom-content-block{ max-width: 580px;padding: 15px 45px 15px 10px; }
    .sections-list.zizzag .col-half:first-child{ padding: 0px;justify-content: flex-end; }    
    .sections-list.zizzag .section:nth-of-type(even) .col-half:first-child{ justify-content: flex-start; }       
    .sections-list.zizzag .section:nth-of-type(even) .custom-content-block{ padding: 15px 10px 15px 45px; }

    .sections-list.zizzag .section:nth-of-type(even) .custom-row { flex-direction: row-reverse; }
    .section.bg-section.is-blue{ background-color: #294697;color: #fff; }
    .section.bg-section.is-blue .text-primary, .section.bg-section.is-blue h2, .section.bg-section.is-blue p, .section.bg-section.is-blue li{color: #fff;}
    .section.bg-section.is-blue .text-primary, .category-page .section.bg-section.is-blue h2{ color: #fff !important; }



    /* card css */
    .card { position: relative;display: flex;flex-direction: column;height: 100%; background-color: #fff;border: 1px solid #dee2e6;box-shadow: 0 2px 4px rgba(0,0,0,0.1); border-radius: 1rem;padding: 0px;overflow: hidden;width: 100%; }    
    .card .card-preview{ display: block;width: 100%; height: 250px; }
    .card .card-preview img{ object-fit: cover;height: 100%; }
    .card .card-info{ display: block;height: 100%;width: 100%; padding: 1.5rem 1.2rem 1rem 1.2rem; }
    .card-info h3{ display: block; margin: 0px 0px 10px 0px; font-size: 1.2rem;text-align: left; }
    .card-info p{ display: block; margin: 0px 0px 10px 0px; font-size: 0.9rem;text-align: left; }
    .card-footer{ display: flex;flex-wrap: wrap; justify-content: end;width: 100%;padding: 10px;gap: 5px; } 
    .card .btn:not(.not-card-style){ position: relative; display: flex;align-items: center;justify-content: center;border-radius: 50%;transition: 0.2s; padding: 5px;width: 30px;height: 30px; background-color: #EF5B3F;color: #fff;font-weight: bold; }

    .slider .card-info{ min-height: 200px;}
    .slider .card-preview{ overflow: hidden; }
    .slider-1 .card-preview { height: 200px; }
    .card .list li{ margin: 0px 0px 5px 0px;color: #3d3d3d;font-size: 1rem;text-align: left; }

    .card .btn.bg-orange svg path{ transition: 0.2s; }
    .card .btn.bg-orange:hover{ background-color: #fff;border:2px solid #EF5B3F;transform: scale(1.1); }
    .card .btn.bg-orange:hover svg path{ fill: #EF5B3F; }


    .stacked-cards .card .card-info{ padding: 1rem 1.2rem 0px 1.2rem; }
    .stacked-cards .card .card-footer{ padding: 0px 10px 1rem 0px; }
    .stacked-cards .card { display: flex;flex-direction: row; }
    .stacked-cards .card .card-content{display: flex;flex-direction: column;width: 100%;}
    .stacked-cards .card .card-preview{ max-width: 170px;padding: 12px; }
    .stacked-cards .card .card-preview img{object-fit: contain;height: auto;}

    .cards{ display: flex;flex-wrap: wrap; } 
    .cards .card.only-image img{ position: relative;width: 100%;height: 100%;object-fit: contain; margin: 0 auto; }

    .card-grid-view > .col-half{ padding: 10px; }

    /* list css */
    .list{ list-style: none;display: block; width: 100%; }
    .list li{ position: relative; padding: 0px 0px 10px 30px;margin: 0px 0px 10px 0px;color: #3d3d3d;font-size: 1rem;text-align: left; }
    .list.white-color li{ color: #fff; }
    .list li:before{ content: "";position: absolute;top: 0px; left: 0px; display: block; width: 20px;height: 20px;border-radius: 100%; background-position: center;background-repeat: no-repeat;background-size: 115%; background-image: url(/Themes/Lighthouse/Content/images/assets/static_page/all_swim_hot_tub_explainer/checkmark.png) }  


    /* tabs css */
    .tabs-wrapper { max-width: 100%; margin: auto; background: #fff; }
    .tabs { display: flex; list-style: none; margin: 0; padding: 0; overflow-x: auto;gap: 5px; }
    .tab-link { padding: 14px 18px; cursor: pointer; white-space: nowrap; color: #333;font-weight: bold; transition: 0.3s;border-top: 1px solid #1f4aa8; border-left: 1px solid #1f4aa8; border-right: 1px solid #1f4aa8; }
    .tab-link:hover { background: #1f4aa8;color: #fff; }
    .tab-link.active { background: #1f4aa8; color: #fff; }
    .tab-content { display: none; padding: 25px;border: 1px solid #d9d9d9; }
    .tab-content.active { display: block; }
    .tab-content label { display: block; color: #0090d2;font-size: 1rem; margin-bottom: 10px;font-weight: bold; }
    .tab-content p { margin: 0 0 15px; }

    /* accordion css */
    .accordion { width: 100%; border: 1px solid #ccc; background: #fff; }
    .accordion-item { border-bottom: 1px solid #ccc; }
    .accordion-header { display: flex;justify-content: space-between;align-items: center; background: #fff; padding: 12px 15px; cursor: pointer; position: relative; font-weight: bold; } 
    .section .accordion-header span{ display: block ;margin: 0px;font-size:1.06rem;text-transform: capitalize; }
    .accordion-header .title{ color: #2f4b87; }
    .accordion-header .icon { position: absolute; top: 50%; right: 10px;transform: translateY(-50%);transition: 0.2s; }
    .accordion-header .icon svg{ fill: #2f4b87;width: 35px;height: 35px; }
    .accordion-item.active .accordion-header { background-color: #2f4b87; color: #fff; } 
    .accordion-item.active .accordion-header .title{ color: #fff; }
    .accordion-item.active .accordion-header .icon svg{ fill: #fff }
    .accordion-item.active .accordion-header .icon{ transform: rotate(-180deg) translateY(50%);  }
    .accordion-content { display: none; padding: 15px; background: #fff; line-height: 1.6; }


    .bg-img{background-color: #fff; min-height: 520px;height: 100%; background-size: cover; background-position: center;background-repeat: no-repeat;border-radius: 8px;}
    .bg-img img{ display: none; }
    

    /*media queries*/ 
    @media(max-width:  1200px){
        .sections-list .custom-content-block{  padding: 15px 40px 15px 15px; }
        .sections-list.zizzag .section:nth-of-type(even) .custom-content-block{ padding: 15px 15px 15px 40px; }
    }
    @media(max-width: 990px) {
        .section{ padding: 20px 0px; }
        div{ text-align: left; }
        .custom-row { flex-wrap: wrap; }
        .col-half { width: 100%; }
        .col-8 { width: 100%; }
        .col-4 { width: 100%; }
        .col-4{ max-width: 50%;width: 100%; }
        .col-4.md-col-3{ max-width: 33.33%; }
        .col-half.md-col-half { max-width: 50%; }
        .stacked-cards .card .card-preview{ max-width: 170px;padding: 10px; }

        /* section-list css */
        .sections-list .section.bg-section .custom-row{ flex-wrap: nowrap; }
        .sections-list .section.bg-section{ min-height:  200px; }
        .sections-list .custom-content-block, .sections-list .section.zizzag .custom-content-block, .sections-list.zizzag .section:nth-of-type(even) .custom-content-block{ max-width: 100%;padding: 15px 15px 15px 15px; }
        
        .card .card-info{ height: auto; }

    }
    @media(max-width: 768px){
        
        .section{ padding: 10px 0px; }
        .hot-tub-category h1{ font-size: 2.5rem;}
        .hot-tub-category h2{ font-size: 2rem;}
        .newport-hot-tub .banner.banner-1 h2{ font-size: 2rem; }
        .hot-tub-category p{ color: #3d3d3d;font-size: 1rem;}
        li.col-half{ max-width: 100%; }

        .stacked-cards .card .card-preview{ max-width: 120px;padding: 10px; }

        /* card-grid-view css */
        .card-grid-view .card .card-info .col-half{ padding: 10px; }
        .card-grid-view .card .card-info{ padding: 12px 20px; }
        .card-grid-view > .col-half{ padding: 10px; }

        .bg-img{ background-image: none !important;min-height: unset;overflow: hidden; }
        .bg-img img{ display: block; }

        /* .banner */
        .banner, .newport-hot-tub .banner{height: auto;}
        .newport-hot-tub .banner-1{ min-height: 250px !important; }
        .newport-hot-tub .banner.banner-1 .custom-container{ padding: 10px 15px; }

        /* section-list css */
        .sections-list .section.bg-section .custom-row{ flex-wrap: wrap;flex-direction: column-reverse; }
        .sections-list .section .custom-container, .sections-list .section .custom-row{ height: auto; }
        .sections-list .section .col-half:first-child{ padding: 20px 15px 30px 15px; }
        .sections-list .section .custom-content-block, .sections-list .custom-content-block, .sections-list.zizzag .section:nth-of-type(even) .custom-content-block{ padding: 0px 0px 20px 0px;margin: 0px;border-bottom: 1px solid #d9d9d9; }
        .sections-list.zizzag .section:nth-of-type(even) .custom-row { flex-direction: column-reverse; }
        .sections-list.zizzag .section:last-child .col-half:first-child{ padding: 20px 15px 25px 15px; }
        .sections-list.zizzag .section:last-child .custom-content-block{ border-bottom: none;padding: 0px; }
        

    }
    @media(max-width: 580px){   
        .card-grid-view.custom-row{ padding: 0px 10px; }
        .card-grid-view > .col-half{ padding: 5px; }
    }
    @media(max-width: 489px){
        .hot-tub-category h1{ font-size: 2rem;}
        .hot-tub-category h2{ font-size: 1.5rem;}
        .newport-hot-tub .banner.banner-1 h2{ font-size: 1.5rem; }
        
        .col-4{ max-width: 100%;}
        .col-half.md-col-half { max-width: 100%; }
        
        .newport-hot-tub .banner-1{ min-height: 200px !important; }
        .newport-hot-tub .banner.banner-1 .custom-container{  margin: 0px auto 20px auto; }

        .stacked-cards .card { flex-direction: column; }
        .stacked-cards .card .card-preview{ min-height: 80px;height: auto; width: 100%;max-width: 100%; }
        .stacked-cards .card .card-preview img{object-fit: cover;height: auto; margin: 0 auto;  max-width: 100px !important; }

        
    }