       @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
        \ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
        body {
            font-family: 'Poppins', sans-serif;
        }

        .page {
            position: absolute;
            top: 0;
            display: none;
        }

        .max-height {
            width: 100vw;
            height: 100vh;
            overflow: hidden;
        }

        a {
            text-decoration: none;
            color: black;
            font-size: 12px;
        }

        /* visited link */

        a:visited {
            color: black;
        }

        /* mouse over link */

        a:hover {
            color: black;
        }

        /* selected link */

        a:active {
            color: black;
        }

        p {
            margin-bottom: 0;
        }

        h1 {
            font-size: 26px;
            font-style: normal;
            font-weight: 600;
            line-height: 20px;
            /* 66.667% */
            letter-spacing: 0.1px;
            margin: auto;
            text-transform: uppercase;
        }

        h2 {
            color: #404040;
            font-size: 28px;
            margin: 0 0 40px 0;
            font-weight: 600;
            line-height: normal;
            text-transform: uppercase;
        }

        h3 {
            color: #000;
            margin: auto;
            text-align: center;
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 25px;
            /* 125% */
            letter-spacing: 0.1px;
            text-transform: uppercase;
        }

        h4 {
            color: #000;
            text-align: center;
            font-family: Poppins;
            font-size: 18px;
            font-style: normal;
            font-weight: 500;
            line-height: 27px;
            /* 150% */
            letter-spacing: 0.135px;
            text-transform: uppercase;
            padding: 20px 10px 5px 10px;
        }

        /* bring to top arrow */

        #return-to-top {
            z-index: 100000;
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: rgb(0, 0, 0);
            background: rgba(0, 0, 0, 0.7);
            width: 50px;
            height: 50px;
            display: block;
            text-decoration: none;
            -webkit-border-radius: 35px;
            -moz-border-radius: 35px;
            border-radius: 35px;
            display: none;
            -webkit-transition: all 0.3s linear;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        #return-to-top i {
            color: #fff;
            z-index: 10000;
            margin: 0;
            position: relative;
            left: 16px;
            top: 13px;
            font-size: 19px;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        #return-to-top:hover {
            background: rgba(0, 0, 0, 0.9);
        }

        /* #return-to-top:hover i {
color: #fff;
z-index: 1000000;
top: 5px;
} */

        /* ------------ HERO ------------ */

        .hero {
            height: 100vh;
            padding-top: 8vh;
        }

        .navbar {
            height: 6vh;
            width: 100%;
            display: flex;
            background-color: white;
            z-index: 3000000;
            position: fixed;
        }

        .logo {
            height: 30px;
        }

        .button-navbar {
            border-radius: 100px;
            padding: 6px 15px;
            font-size: 12px;
            border: 2px solid #000;
            background: rgba(24, 161, 3, 0.00);
        }

        .navbar-content {
            width: 85%;
            height: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: auto;
        }

        .verticals-navbar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 15px;
        }

        #box-rest-hero {
            width: 85%;
            height: 90vh;
            border-radius: 10px;
            border: 0.5px solid rgba(0, 0, 0, 0.08);
            background: rgba(255, 255, 255, 0.45);
            box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.15);
            backdrop-filter: blur(15px);
            margin: auto;
        }

        #middle-box-hero {
            border-radius: 10px 10px 0px 0px;
            background-image: url("images/trytest1.svg");
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
            height: 81%;
        }

        .USPs-hero {
            display: flex;
            margin: auto;
            justify-content: space-between;
            width: 50%;
            padding: 40px 0 50px 0;
        }

        .USP-hero {
            display: flex;
            align-items: center;
            flex-direction: column;
            gap: 5px;
        }

        .usp-icon-hero {
            max-height: 45px;
        }

        .small-titles {
            font-size: 10px;
            font-weight: 500;
        }

        .cta-box-hero {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .cta {
            margin-top: 35px;
            border-radius: 15px;
            border: 4px solid #18A103;
            background: #18A103;
            width: 320px;
            padding: 15px 30px;
            color: white;
            font-size: 28px;
            font-weight: 700;
        }

        .connection {
            margin: 20px 0 40px 0;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .connection .material-symbols-outlined {
            opacity: 0.4;
            font-size: 16px !important;
        }

        .connection p {
            font-size: 12px;
            font-weight: 400;
            /*   font-family: "Open Sans", sans-serif; */
        }

        .bottom-box-hero {
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 19%;
            padding: 0 0 20px 0;
            justify-content: space-evenly;
        }

        .bottom-box-hero h3 {
            margin: 0 auto;
            font-size: 14px;
            padding: 10px 0;
        }

        .steps-hero {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 5%;
            margin: 0;
            width: 85%;
        }

        .step-hero {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 10px;
        }

        .arrow {
            width: 40px;
        }

        .step-number {
            min-width: 30px;
            min-height: 30px;
            border: solid 2px #40c22d;
            background-color: white;
            color: black;
            font-weight: 500;
            border-radius: 100px;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 14px;
        }

        .step-number.active {
            background-color: #40c22d;
        }

        .step-text {
            font-size: 12px;
        }

        .step-text.active {
            font-weight: 600;
        }

        #part1 {
            height: 20%;
            flex-direction: column;
            display: flex;
            justify-content: center;
            align-items: center;
            margin-bottom: 20px;
        }

        /* ------------ FOLD 1 ------------ */

        .fold1 {
            margin-top: 60px;
        }

        .USPs {
            width: 85%;
            margin: auto;
            display: flex;
            justify-content: space-between;
        }

        .USP {
            width: 30%;
            border-radius: 10px;
            border: 0.5px solid rgba(0, 0, 0, 0.08);
            background: rgba(255, 255, 255, 0.25);
            box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.15);
            backdrop-filter: blur(15px);
        }

        .USP p {
            width: 85%;
            margin: auto;
            font-size: 16px;
            font-style: normal;
            font-weight: 300;
            line-height: 24px;
            padding-bottom: 20px;
        }

        #subtitle-fold1 {
            margin-bottom: 30px;
        }

        /* ------------ FOLD 2 ------------ */

        .fold2 {
            margin-top: 60px;
        }

        .fold2-content {
            display: flex;
            justify-content: center;
            align-items: center;
            max-width: 90%;
            margin: auto;
        }

        .device-covers {
            max-height: 240px;
        }

        .fold2-content ul li {
            text-align: left;
            padding-bottom: 16px;
        }

        /* ------------ FOLD 3 ------------ */

        .fold3 {
            display: flex;
            margin: auto;
            justify-content: space-between;
            width: 85%;
            margin-top: 60px;
        }

        .vertical {
            max-width: 22%;
            border-radius: 10px;
            background: #FFF;
            box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.20);
            padding: 0px 0 20px 0;
        }

        .vertical p {
            max-width: 90%;
            text-align: center;
            color: #000;
            font-size: 13px;
            font-weight: 300;
            line-height: 24px;
            margin: auto;
        }

        .vertical a {
            text-decoration: none;
            color: rgba(0, 0, 0, 0.70);
            font-size: 12px;
            font-weight: 300;
            line-height: 24px;
            /* 200% */
            letter-spacing: 0.135px;
        }

        .sub-txt-2 {
            padding: 20px 0;
        }

        .cover-verticals {
            border-radius: 10px 10px 0px 0px;
        }

        /* ---------- Strip covers -------- */

        .film-strip-wrap {
            display: block;
            height: 150px;
            width: 100%;
            overflow: hidden;
            position: relative;
            margin: 50px 0 60px 0;
        }

        .film-strip-wrap img {
            z-index: 10;
            position: absolute;
            height: 150px;
            /*     width: 6560px; */
            max-width: 6000px;
            left: 0;
            animation: left 45s linear infinite;
            /*     filter: grayscale(100%); */
        }

        /*   .film-strip-wrap:hover {
cursor: pointer;
}

.film-strip-wrap:hover .caption {
top: 150px;
} */

        .film-strip-wrap:hover img {
            filter: grayscale(0%);
            -webkit-animation-play-state: paused;
            -moz-animation-play-state: paused;
            -o-animation-play-state: paused;
            animation-play-state: paused;
        }

        @keyframes left {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(calc(-100% + 100vw));
            }
        }

        /* ---------- Footer ---------- */

        .footer {
            color: rgba(32, 32, 32, 0.70);
            text-align: center;
            font-size: 8px;
            font-style: normal;
            font-weight: 300;
            line-height: 14px;
            /* 175% */
            width: 85%;
            margin: auto;
            padding-bottom: 40px;
        }

        .privacypolicy {
            color: rgba(32, 32, 32, 0.70);
            text-align: center;
            font-family: Poppins;
            font-size: 8px;
            font-style: normal;
            font-weight: 300;
            line-height: 14px;
            /* 175% */
            letter-spacing: 0.135px;
            text-decoration-line: underline;
        }

        /* -------- Responsive -------- */

        /* Extra large devices (large laptops and desktops, 1200px and up) */

        @media only screen and (min-width: 1350px) {
            .cta-box-hero {
                margin-top: 7%;
            }
        }

        /* Large devices (laptops/desktops, 992px and up) */

        @media only screen and (min-width: 992px) {
            ...
        }

        /* Medium devices (landscape tablets, 768px and up) */

        @media only screen and (min-width: 680px) and (orientation: portrait) {
            #box-rest-hero {
                height: 55vh;
            }
            .fold1 {
                max-width: 85%;
            }
            .USPs {
                width: 100%;
            }
            .fold2 {
                max-width: 85%;
            }
            .device-covers {
                max-height: 150px;
            }
            .cta-box-hero {
                padding-top: 6%;
            }
            .hero {
                height: 100vh;
                padding-top: 0;
                display: flex !important;
                justify-content: center;
            }
        }

        /* Small devices (portrait tablets and large phones, 600px and up) */

        @media only screen and (max-width: 767px) {
            .modal__wrapper2_close {
                border: none;
                background-color: transparent;
                margin: 20px 20px 0 0;
                color: black;
                opacity: 0.2;
                width: 5px;
            }
            .cta {
                max-width: 266px;
                margin-top: 0;
            }
            .modal .overlay {
                position: fixed;
                width: 100%;
                height: 100%;
                background: rgba(148, 148, 148, 0.8) !important;
                /*     backdrop-filter: blur(5px); */
            }
            .form-title1 span {
                font-weight: 400;
            }
            .hero-mobile {
                width: 100vw;
            }
            .step-text {
                font-size: 9px;
            }
            .navbar-mobile {
                background-color: white;
                width: 100%;
                height: 5vh;
                position: fixed;
                z-index: 10000000;
            }
            .rest-of-hero-mobile {
                width: 85%;
                height: calc(90vh - 5vh);
                margin: auto;
                padding-top: 5vh;
                display: flex;
                flex-direction: column;
                justify-content: space-around;
            }
            h1 {
                font-size: 22px;
                margin: 0;
                padding: 0 0 20px 0;
            }
            h2 {
                width: 85%;
                font-size: 17px;
                font-weight: 600;
                width: 85%;
                margin: auto;
                padding-bottom: 20px;
            }
            h3 {
                font-size: 14px;
                font-style: normal;
                font-weight: 500;
                margin: 0;
                padding-bottom: 5%;
            }
            .arrow {
                max-width: 40px;
            }
            .step-hero {
                flex-direction: column;
            }
            .cta-mobile {
                border-radius: 10px;
                border: 0.5px solid rgba(0, 0, 0, 0.08);
                background: #FFF;
                box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.15);
                backdrop-filter: blur(15px);
                padding: 0 3%;
                height: 43%;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
            }
            .connection {
                margin: 10px 0 0 0;
                justify-content: center;
                gap: 10px;
            }
            .flippy-verticals-mobile {
                display: flex;
                justify-content: center;
                height: 28%;
                align-items: center;
            }
            .USPs {
                flex-direction: column;
            }
            .USP {
                width: 100%;
                margin-bottom: 5%;
            }
            .fold2 {
                max-width: 85%;
            }
            #subtitle-fold1 {
                font-size: 14px;
                font-style: normal;
                font-weight: 300;
                width: 85%;
                margin: auto;
                padding-bottom: 20px;
            }
            .fold2-content {
                flex-direction: column;
            }
            .fold3 {
                flex-direction: column;
            }
            .vertical {
                max-width: 100%;
                margin-bottom: 5%;
            }
            ul {
                margin-top: 1.5rem;
                margin-left: 3%;
            }
            .footer {
                padding: 40px 0;
            }
            .fold2-content ul li {
                padding-bottom: 10px;
                font-size: 14px;
            }
        }

        /*------------------------------------ Modal --------------------------------------*/

        .blur {
            filter: blur(5px);
            /*   -webkit-backdrop-filter: blur(5px); */
            /*   backdrop-filter: blur(5px); */
            -moz-filter: blur(5px);
            -o-filter: blur(5px);
        }

        .input_img {
            position: absolute;
            height: 26px;
            width: 26px;
            left: 15px;
            top: 18px;
        }

        .material-symbols-outlined {
            opacity: 0.4;
        }

        /* Modal */

        .modal__wrapper {
            width: 100%;
            height: 100vh;
            /*   background: rgba(242, 242, 242, 0.7); */
            position: absolute;
            display: none;
            top: 0;
        }

        .modal {
            /*   display: visible; */
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: 10;
            color: #000;
        }

        .modal .overlay {
            position: fixed;
            width: 100%;
            height: 100%;
            background: rgba(148, 148, 148, 0.8) !important;
        }

        .modal .formbox {
            justify-content: center;
            /*     background: #fff; */
            text-align: left;
            display: flex;
            flex-direction: column;
            position: relative;
            top: 10%;
            border-radius: 10px;
            border: 1px solid rgba(0, 0, 0, 0.05);
            background: #FFF;
            box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.05);
            /* overflow: hidden; */
            margin: auto;
            max-width: 30vw;
        }

        .formbox-left-cta {
            height: 100%;
            width: 100%;
            padding: 20px 20px 0px 20px;
        }

        .formbox-left {
            padding-left: 0;
            padding-right: 0;
        }

        .formbox-right {
            /*   padding-top: 50px; */
            border-radius: 0 0 10px 10px;
            background: #F4F4F4;
            padding: 30px 0px;
            display: flex;
        }

        .modal .formbox .formbox-header .form-title1 {
            color: #000;
            text-align: center;
            font-size: 14px;
            font-weight: 600;
            line-height: 25px;
            /* 138.889% */
            letter-spacing: 0.1px;
            text-transform: uppercase;
            max-width: 95%;
            margin: auto;
        }

        #active {
            background-color: #40c22d;
        }

        .formbox .steps-formbox {
            margin: auto;
            max-width: 95%;
            margin-top: 15px;
        }

        .formbox .steps-formbox .step-formbox {
            overflow: hidden;
            position: relative;
            width: 100%;
            padding-bottom: 15px;
            display: flex;
            align-items: center;
            margin: auto;
        }

        .formbox .nr span {
            min-width: 35px;
            min-height: 35px;
            border: solid 2px #40c22d;
            background-color: white;
            color: black;
            font-weight: 600;
            border-radius: 100px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .form-fields {
            width: 85%;
        }

        .formbox .text {
            width: calc(100% - 45px);
            float: right;
            text-align: left;
            color: rgba(0, 0, 0);
            font-size: 14px;
            font-style: normal;
            font-weight: 300;
            line-height: 25px;
            /* 156.25% */
            letter-spacing: 0.1px;
            padding-left: 20px;
        }

        .modal .formbox .field {
            position: relative;
            padding-bottom: 10px;
        }

        .modal .formbox .field input {
            border-radius: 15px;
            border: 0.5px solid rgba(0, 0, 0, 0.50);
            background: #FFF;
            padding: 20px 0 20px 50px;
            width: 100%;
            height: 60px;
            margin: auto;
            font-size: 14px;
        }

        .modal .formbox .field input::placeholder {
            color: #B9B9B9;
        }

        .error {
            display: none;
            color: #ec0909;
            font-size: 12px;
            padding: 2px 0;
            margin-top: 10px !important;
            /*   margin-bottom: 10px !important; */
            text-align: center;
        }

        .formbox-right .btn-submit {
            border: none;
            border-radius: 15px;
            background: #18a103;
            width: 100%;
            height: 60px;
            /*   padding: 20px 30px; */
            color: white;
            font-size: 25px;
            font-style: normal;
            font-weight: 700;
            position: relative;
            text-transform: uppercase;
        }

        .formbox-right .btn-submit:hover {
            background: #58b04a;
        }

        .formbox-right .btn-submit:active {
            background: #4C9840;
        }

        .spinning {
            background: #4C9840 !important;
        }

        .footer-form {
            font-size: 9px;
            margin-top: 5%;
        }

        /*------------------------------------------------------------------------ main email form EXIT button*/

        .modal__wrapper_close_mobile,
        .modal__wrapper_close_desktop,
        .ri-close {
            box-sizing: content-box;
            width: 5px;
            height: 5px;
            padding: 0.25em 0.25em;
            color: #000;
            background: transparent url("images/exit-button.svg") center/1em auto no-repeat;
            border: 0;
            border-radius: 0.25rem;
            opacity: 0.2;
            margin-top: 3.5%;
            margin-right: 3.5%;
            float: right;
            position: absolute;
            top: 0;
            right: 5px;
            z-index: 999;
        }

        .modal__wrapper_close_mobile:hover,
        .modal__wrapper_close_desktop:hover,
        .ri-close:hover {
            opacity: 0.7;
        }

        @media only screen and (max-width: 640px) {
            .modal__wrapper_close_mobile,
            .modal__wrapper_close_desktop,
            .ri-close {
                margin-top: 3.5%;
                margin-right: 3.5%;
            }
            .modal .formbox {
                max-width: 90vw;
            }
        }

        @media only screen and (max-width: 799px) {
            .modal__wrapper_close_desktop {
                display: none;
            }
            .modal .formbox {
                max-width: 90vw;
            }
            .steps-formbox {
                max-width: 95% !important;
            }
            .modal .formbox .formbox-header .form-title1 {
                color: #000;
                text-align: center;
                font-size: 17px;
                font-weight: 600;
                line-height: 25px;
                /* 138.889% */
                letter-spacing: 0.1px;
                text-transform: uppercase;
                max-width: 95%;
                margin: auto;
            }
        }

        @media only screen and (min-width: 800px) and (max-width: 900px) {
            .modal__wrapper_close_desktop {
                display: none;
            }
            .modal .formbox {
                max-width: 60vw;
            }
        }

        /* modal2 for desktop+tablet */

        .modal__wrapper2_close {
            border: none;
            background-color: transparent;
            margin: 15px 25px 0 0;
            color: black;
            opacity: 0.2;
            width: 5px;
        }

        .modal__wrapper2 {
            width: 100%;
            height: 100vh;
            background: rgba(148, 148, 148, 0.8) !important;
            position: absolute;
            display: none;
            top: 0;
        }

        .modal2 .formbox2 {
            justify-content: center;
            /* background: #fff; */
            text-align: right;
            /* display: flex; */
            position: relative;
            top: 25%;
            border-radius: 10px;
            background-color: #fff;
            /* overflow: hidden; */
            margin: auto;
            max-width: 35%;
            top: calc(25vh);
        }

        .modal2 {
            display: visible;
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: 10;
            color: #000;
        }

        .formbox2 .row {
            padding: 0;
        }

        .modal__wrapper2 .formbox-left {
            padding: 20px 15px;
        }

        .alert-btn {
            padding: 25px 20px;
            width: 100%;
            /*     margin: 0 auto;
  display: flex;
  justify-content: center; */
        }

        .alert-btn .btn-submit {
            background: #18A103;
            display: block;
            min-width: 100%;
            padding: 20px;
            text-align: center;
            font-size: 22px;
            font-weight: 700;
            color: white;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            text-transform: uppercase;
        }

        /* .alert-btn .btn-submit:hover {
background: #58b04a;
}
.alert-btn .btn-submit:active {
background: #4C9840;
} */

        .modal__wrapper2 .footer-form {
            margin-top: 3%;
        }

        /* .alert-headline, .alert-sub-headline {
background: #fff;
} */

        .alert-headline p {
            font-weight: 700;
            font-size: 20px;
            color: #282828;
            text-align: center;
            margin: 30px 0 15px;
        }

        .alert-sub-headline p {
            font-weight: 500;
            font-size: 14px;
            color: #606060;
            margin-bottom: 20px;
            padding: 0 15px;
            text-align: center;
        }

        .alert-copy {
            background: #f7f7f7;
        }

        .alert-copy p {
            color: #606060;
            text-align: center;
            padding: 30px 20px;
            margin-bottom: 0;
            font-size: 14px;
        }

        /* end */

        /* modal2 for mobile and tablet */

        @media only screen and (min-device-width: 641px) and (max-device-width: 1024px) and (orientation: portrait) {
            .modal2 .formbox2 {
                max-width: 60%;
                top: calc(30vh);
            }
        }

        @media only screen and (max-width: 640px) {
            .formbox-right {
                border-radius: 0 0 10px 10px;
            }
            .modal__wrapper2 .modal__2 .formbox__2 {
                width: 90%;
                top: calc(5vh);
            }
            .modal2 .formbox2 {
                max-width: 90vw;
                top: 15%;
            }
            /*   .modal__wrapper2_close {
  margin-top: 3.5%;
  margin-right: 3.5%;
} */
            .alert-btn {
                width: 100%;
            }
            .alert-btn .btn-submit {
                font-size: 20px;
            }
            /*   .alert-headline p {
  font-size: 25px;
} */
            .alert-copy p {
                padding: 30px 20px;
            }
        }

        /* modal2 ends */

        /*------------------------------------------------------------------------ read more... */

        .read-more {
            background-color: #fff;
        }

        /* collpse and set the height of the toggle text */

        .read-more .text_inner {
            max-height: 165px;
            transition: max-height 0.2s ease-out;
            overflow: hidden;
            position: relative;
        }

        /* add gradient to the collapsed text */

        .read-more .text_inner:after {
            content: "";
            display: inline-block;
            position: absolute;
            pointer-events: none;
            height: 100px;
            width: 100%;
            left: 0;
            right: 0;
            bottom: 0;
            transition: background-image 0.2s ease-in;
            background-image: linear-gradient(0deg, #fff 5%, transparent);
        }

        /* style the expand text link */

        .read-more .read-more-button {
            padding: 0.5em;
            text-align: center;
            color: #00d263 !important;
        }

        .read-more .read-more-expand-button span {
            cursor: pointer;
        }

        /* set the max height and transition of the expanded toggle */

        .read-more .read-more-expanded {
            max-height: 2000px;
            transition: max-height 0.3s ease-in;
            margin-bottom: 20px;
        }

        /* hide the gradient when the toggle is expanded */

        .read-more .read-more-expanded.text_inner:after {
            background-image: none;
        }

        /* Space around Read More... */

        .default-expand-button {
            margin: 20px 0 !important;
        }

        .text_inner p {
            font-size: 14px !important;
            line-height: 1.4 !important;
        }

        .sub-txt-2 {
            margin: 16px 0;
            font-weight: 700 !important;
        }

        .sub-txt-3 {
            margin-bottom: 16px;
        }

        .article {
            margin-bottom: 20px;
            text-decoration-line: underline;
            max-width: 90%;
            margin: auto;
        }

        .article-link {
            color: #222222;
            text-decoration: underline;
            line-height: 1.2;
        }

        /* Read More... styling */

        span.read-more-collapse-button {
            /*   background: linear-gradient(180deg, rgba(255,255,255,0) 40%, #26c6501c 40%);
  padding: 5px;
  display: inline; */
            color: #ababab;
        }

        /* END */

        /*------------------------ NEW flipping cards ---*/

        /*cards*/

        .flip-cards {
            display: flex;
            gap: 10px;
            width: 100%;
            margin: 50px auto 0;
            justify-content: space-between;
        }

        /*flip cards*/

        .vertical-flip-card {
            overflow: visible;
            /*   min-width: 70px; */
            width: 100%;
            min-height: 70px;
            /*   margin-bottom: 15px; */
            background-color: #fff;
            box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.15);
            border-radius: 10px;
        }

        .content {
            width: 100%;
            height: 100%;
            transform-style: preserve-3d;
            transition: transform 300ms;
            border-radius: 10px;
            border: var(--box-border);
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .front,
        .back {
            position: absolute;
            width: 100%;
            height: 100%;
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            border-radius: 10px;
            overflow: hidden;
        }

        .back-content {
            position: absolute;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            /*   border-radius: 10px; */
            flex-direction: column;
            /*   background-color: #f9f9f9; */
        }

        .back-content img {
            max-height: 250px;
            /*   margin-bottom: 20px; */
        }

        /* FOR MOBILE THE CARDS WILL ONLY WORK WITH THE CLASS 'open' THAT WE CAN APPLY ON CLICK FOR EXAMPLE */

        .vertical-flip-card.open .content,
        .vertical-flip-card.open .content {
            transform: rotateY(180deg);
        }

        .front {
            transform: rotateY(180deg);
            /*color: white;*/
        }

        .front .front-content {
            position: absolute;
            width: 100%;
            height: 100%;
            padding: 5px;
            display: flex;
            /*   background-color: #f9f9f9; */
            flex-direction: column;
            justify-content: center;
        }

        .vertical-flip-card h3 {
            text-align: center;
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            margin-bottom: 0;
            padding: 0;
            line-height: 1.4;
        }

        @media screen and (min-width: 481px) {
            .flip-cards {
                display: none;
            }
        }

        /*------------------------ FAQ ---*/

        .faq {
            margin-top: 60px;
            max-width: 85%;
        }

        .faq .small-12 {
            padding: 0;
        }

        .faq .header h1 {
            color: inherit;
            font-size: 40px;
            font-style: normal;
            font-weight: 700;
            margin-bottom: 50px;
        }

        /* .accordion-icon {
transition: transform 0.3s ease;
} */

        .accordion-title::before {
            /*   content: url('images/down-chevron.svg') !important;
  margin-top: 0; */
            transform: scale(1);
            top: 45%;
            right: 1.5rem;
        }

        /*
.is-active>.accordion-title::before {
content: url('images/up-chevron.svg') !important;
} */

        .accordion-item.is-active .accordion-icon {
            /*   transform: rotate(180deg); /* Rotates the icon 180 degrees when active */
            */
        }

        .accordion {
            border: 0px;
        }

        .accordion-title {
            color: #404040;
            font-feature-settings: 'clig' off, 'liga' off;
            font-size: 16px;
            font-style: normal;
            /*   font-weight: 700; */
            line-height: 24px;
            /* 150% */
            letter-spacing: -0.32px;
            text-align: left;
            background-color: #eaeaea;
            border-bottom: 1px solid #fff;
            padding: 1.2rem !important;
        }

        .accordion .accordion-item:first-child .accordion-title {
            border-radius: 20px 20px 0 0;
        }

        .accordion .accordion-item:last-child .accordion-title {
            border-radius: 0 0 20px 20px;
        }

        .accordion .accordion-item:last-child.is-active .accordion-title {
            border-radius: 0;
            border-bottom: 1px solid #fff;
        }

        .accordion .accordion-item:last-child .accordion-content {
            border-radius: 0 0 20px 20px;
        }

        .accordion-title:hover,
        .accordion-title:focus {
            background-color: #eaeaea;
            color: #404040;
        }

        .accordion-content {
            background-color: #eaeaea;
            border-bottom: 0.5px solid #fff;
        }

        .accordion-content p {
            color: #404040;
            font-feature-settings: 'clig' off, 'liga' off;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 24px;
            /* 150% */
            letter-spacing: -0.16px;
            text-align: left;
        }

        @media only screen and (max-width: 500px) and (orientation: portrait) {
            .faq {
                max-width: 90%;
            }
            .accordion-title,
            .accordion-content p {
                font-size: 12px;
            }
        }
		
		
		.spinning {
			background-color: #57b349;
			padding-right: 20px;
			position: relative;
		}

		.spinning:after {
			content: '';
			position: absolute;
			right: 15px;
			top: 50%;
			width: 0;
			height: 0;
			box-shadow: 0px 0px 0 1px #69c35b;
			position: absolute;
			border-radius: 50%;
			z-index: 50;
			animation: rotate360 .5s infinite linear, exist .1s forwards ease;
		}

		.spinning:before {
			content: "";
			z-index: 50;
			width: 0px;
			height: 0px;
			border-radius: 50%;
			right: 15px;
			top: 50%;
			position: absolute;
			border: 2px solid #69c35b;
			border-right: 3px solid #fff;
			animation: rotate360 .5s infinite linear, exist .1s forwards ease;
		}

		@keyframes rotate360 {
			100% {
				transform: rotate(360deg);
			}
		}

		@keyframes exist {
			100% {
				width: 15px;
				height: 15px;
				margin: -8px 5px 0 0;
			}
		}