/*Comfort Landing Page Theme */



    /*Base CSS Starts */
    :root{
        --color-dark: #2c2c4b;
        --color-dark-1: #353555;
        --color-dark-2: #333353;
        --color-yellow: #ffd600;
        --color-red: #ff3759;
        --color-red-rgba-8: rgba(255, 55, 89, .8);
        --color-green: #BFB5E4;
        --color-green-rgba-8: rgba(191, 181, 228, .8);
        --color-pink: #ed50e8;
        --color-blue: #BFB5E4;
        --color-blue-rgba-8: rgba(191, 181, 228, .8);
        --color-purple: #4A467E;
        --color-grey: #5b5b71;
        --color-grey-1: #e1e1ec;
        --color-grey-2: #9797ad;
        --color-grey-3: #9797a6;
        --color-grey-4: #808093;
        --color-grey-5: #f1f3f7;
        --color-grey-6: #707577;
        --color-light: #f4f5f9
    }
    h1{
        font-size:6rem;
        font-weight:700;
        letter-spacing:-.3rem
    }
    @media (max-width: 991px){
        h1{
            font-size:5rem
        }
    }
    h2{
        font-size:4rem;
        font-weight:700;
        letter-spacing:-.1rem
    }
    h3{
        font-size:2rem;
        font-weight:700;
        line-height:3rem
    }
    h4{
        font-size:1.8rem;
        font-weight:700;
        line-height:3rem
    }
    h5{
        font-size:1.4rem;
        font-weight:600;
        line-height:3rem
    }
    h6{
        font-size:1.2rem;
        font-weight:500
    }
    p{
        font-size:1.6rem;
        font-weight:500;
        line-height:3rem;
        color:var(--color-grey)
    }
    a{
        text-decoration:none
    }
    ul{
        padding:0;
        margin:0
    }
    *,*::before,*::after{
        margin:0;
        padding:0;
        -webkit-box-sizing:inherit;
        box-sizing:inherit
    }
    html{
        font-size:62.5%;
        overflow-x:hidden;
        margin-top:0;
        padding:0
    }
    @media (max-width: 991px){
        html{
            font-size:58.5%
        }
    }
    @media (max-width: 800px){
        html{
            font-size:56.5%
        }
    }
    @media (max-width: 767px){
        html{
            font-size:53.5%
        }
    }
    @media (max-width: 600px){
        html{
            font-size:51.5%
        }
    }
    body{
        font-family:'Spartan', sans-serif;
        -webkit-box-sizing:border-box;
        box-sizing:border-box;
        overflow-x:hidden;
        max-width: 100vw;
    }
    @media (min-width: 1400px){
        .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{
            max-width:unset
        }
    }
    @media (min-width: 1200px){
        .container,.container-lg,.container-md,.container-sm,.container-xl{
            max-width:1200px
        }
    }
    @media (max-width: 991px){
        .container {
            overflow-x: hidden;
        }
    }
    .t-center{
        text-align:center
    }
    .m-horz-auto{
        margin-left:auto;
        margin-right:auto
    }
    .heading-width-56{
        width:56%
    }
    .heading-width-60{
        width:60%
    }
    .heading-width-65{
        width:65%
    }
    .heading-width-67{
        width:67%
    }
    .heading-width-76{
        width:76%
    }
    .heading-width-83{
        width:83%
    }
    .heading-width-92{
        width:92%
    }
    @media (max-width: 991px){
        .heading-width-res-full{
            width:100%
        }
    }
    .c-white{
        color:#fff
    }
    .c-dark{
        color:var(--color-dark)
    }
    .c-yellow{
        color:var(--color-yellow)
    }
    .c-red{
        color:var(--color-red)
    }
    .c-green{
        color:var(--color-green)
    }
    .c-pink{
        color:var(--color-pink)
    }
    .c-blue{
        color:var(--color-blue)
    }
    .c-purple{
        color:var(--color-purple)
    }
    .c-grey{
        color:var(--color-grey)
    }
    .c-grey-3{
        color:var(--color-grey-3)
    }
    .c-grey-4{
        color:var(--color-grey-4)
    }
    .bg-red{
        background-color:var(--color-red)
    }
    .bg-red-rgba-8{
        background-color:var(--color-red-rgba-8)
    }
    .bg-pink{
        background-color:var(--color-pink)
    }
    .bg-light{
        background-color:var(--color-light)
    }
    .bg-darkk{
        background-color:var(--color-dark)
    }
    .bg-dark-1{
        background-color:var(--color-dark-1)
    }
    .bg-purple{
        background-color:var(--color-purple)
    }
    .bg-blue{
        background-color:var(--color-blue)
    }
    .bg-blue-rgba-8{
        background-color:var(--color-blue-rgba-8)
    }
    .bg-yellow{
        background-color:var(--color-yellow)
    }
    .bg-green{
        background-color:var(--color-green)
    }
    .bg-green-rgba-8{
        background-color:var(--color-green-rgba-8)
    }
    .video-section-bg{
        background-color: #2D2C4C;
    }
    .bg-grey{
        background-color:var(--color-grey)
    }
    .bg-grey-5{
        background-color:var(--color-grey-5)
    }
    .box-small{
        width:3rem;
        height:3rem
    }
    .box-top-left{
        position:absolute;
        top:0;
        left:0
    }
    .fw-600{
        font-weight:600
    }
    .fw-500{
        font-weight:500
    }
    .lt-24{
        line-height:2.4rem
    }
    .lt-60{
        line-height:6rem
    }
    .lt-80{
        line-height:8rem
    }
    .ls-1{
        letter-spacing:-.1rem
    }
    .icon{
        font-size:6rem
    }
    .icon-small{
        font-size:3.4rem
    }
    .icon-text{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        -webkit-box-align:start;
        -ms-flex-align:start;
        align-items:flex-start
    }
    .icon-text .icon{
        width:30%
    }
    .icon-text .content p{
        margin-top:1rem
    }
    @media (max-width: 575px){
        .icon-text{
            -webkit-box-orient:vertical;
            -webkit-box-direction:normal;
            -ms-flex-direction:column;
            flex-direction:column
        }
    }
    .pattern-image{
        position:relative
    }
    .pattern-image .image{
        position:relative;
        z-index:3
    }
    .pattern-image .image img{
        max-width:100%;
        width: 100%;
        height: auto;
    }
    .pattern-image .background-layout{
        width:100%;
        height:100%;
        position:absolute;
        top:0;
        left:0;
        z-index:1
    }
    .pattern-image .box-image{
        width:112%;
        aspect-ratio:164 / 117;
        background-repeat:no-repeat;
        background-size:cover;
        position:absolute;
        top:12.5rem;
        left:-40%;
        z-index:3
    }
    .pattern-image .box-1-1{
        position:absolute;
        bottom:100%;
        left:-10%;
        width:10%;
        aspect-ratio:1 / 1
    }
    .pattern-image .box-1-2{
        position:absolute;
        bottom:100%;
        right:-13%;
        width:13%;
        aspect-ratio:1 / 1
    }
    .pattern-image .box-2{
        width:112%;
        aspect-ratio:164 / 117;
        position:absolute;
        top:17.5rem;
        left:-32.5%;
        z-index:2
    }
    .pattern-image .box-2-1{
        position:absolute;
        top:100%;
        left:-16%;
        width:16%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 991px){
        .pattern-image{
            margin-bottom:3rem
        }
        .pattern-image .image{
            text-align:center;
            padding: 0 2rem;
        }
        .pattern-image .image img{
            max-width:100%;
            width: auto;
            height: auto;
        }
        .pattern-image .background-layout{
            top:10%
        }
        .pattern-image .box-image{
            width:90%;
            left:0%
        }
        .pattern-image .box-2{
            width:90%;
            left:-10%
        }
    }
    @media (max-width: 575px){
        .pattern-image .background-layout{
            top:0
        }
        .pattern-image .box-image{
            top:10%
        }
        .pattern-image .box-2{
            top:18%
        }
    }
    .pattern-image-reverse{
        text-align:right
    }
    .pattern-image-reverse .box-image{
        left:initial;
        right:-40%
    }
    .pattern-image-reverse .box-1-1{
        left:-13%;
        width:13%
    }
    .pattern-image-reverse .box-1-2{
        right:-10%;
        width:10%
    }
    .pattern-image-reverse .box-2{
        left:initial;
        right:-32.5%
    }
    .pattern-image-reverse .box-2-1{
        left:initial;
        right:-16%
    }
    @media (max-width: 991px){
        .pattern-image-reverse{
            text-align:center
        }
        .pattern-image-reverse .image{
            text-align:center;
            padding: 0 2rem;
        }
        .pattern-image-reverse .image img{
            max-width:100%;
            width: auto;
            height: auto;
        }
        .pattern-image-reverse .box-image{
            right:0
        }
        .pattern-image-reverse .box-2{
            right:-10%
        }
    }
    .link-underline>span{
        position:relative;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .link-underline>span::before{
        content:'';
        display:block;
        position:absolute;
        left:0;
        right:0rem;
        bottom:-.25rem;
        height:.1rem;
        background-color:#fff;
        -webkit-transform-origin:right center;
        transform-origin:right center;
        -webkit-transform:scale(0, 1);
        transform:scale(0, 1);
        -webkit-transition:-webkit-transform .3s ease;
        transition:-webkit-transform .3s ease;
        transition:transform .3s ease;
        transition:transform .3s ease, -webkit-transform .3s ease
    }
    .link-underline:hover{
        color:unset
    }
    .link-underline:hover>span{
        text-decoration:none
    }
    .link-underline:hover>span::before{
        -webkit-transform-origin:left center;
        transform-origin:left center;
        -webkit-transform:scale(1, 1);
        transform:scale(1, 1)
    }
    .link-underline-1>span::before{
        background-color:var(--color-grey)
    }
    .paragraph-big{
        font-size:2rem;
        line-height:3.4rem
    }
    .form-floating .form-control{
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey);
        height:5.1rem;
        padding:0 3rem 0 1rem;
        outline:none;
        border:none;
        border-bottom:0.2rem solid var(--color-grey-1);
        -webkit-box-shadow:none;
        box-shadow:none;
        background-color:transparent
    }
    .form-floating .form-control:focus{
        border-color:var(--color-red)
    }
    .form-floating label{
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey);
        padding:0;
        height:auto;
        top:50%;
        left:1rem;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .form-floating>.form-control:focus ~ label,.form-floating>.form-control:not(:placeholder-shown) ~ label,.form-floating>.form-select ~ label{
        top:0;
        -webkit-transform:translateY(-10%) scale(0.85);
        transform:translateY(-10%) scale(0.85)
    }
    .checkbox{
        position:relative
    }
    .checkbox input{
        position:absolute;
        top:50%;
        left:0;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        opacity:0;
        width:2.3rem;
        height:2.3rem
    }
    .checkbox input:checked+label::after{
        opacity:1
    }
    .checkbox label{
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey);
        margin-left:4.3rem
    }
    .checkbox label::before{
        content:'';
        position:absolute;
        top:50%;
        left:0;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        width:2.3rem;
        height:2.3rem;
        background-color:#fff
    }
    .checkbox label::after{
        content:'\f00c';
        font-family:'Font Awesome 5 Free';
        font-size:1.4rem;
        font-weight:900;
        color:var(--color-green);
        opacity:0;
        position:absolute;
        top:50%;
        left:.5rem;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .form-row{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center
    }
    .button{
        text-decoration:none;
        position:relative;
        overflow:hidden;
        display:inline-block;
        border:none;
        background-color:transparent;
        text-align:center;
        padding:1.9rem 6.5rem 1.6rem
    }
    .button::before,.button::after{
        content:'';
        position:absolute;
        left:0;
        width:100%;
        height:100%;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s;
        z-index:1
    }
    .button::before{
        top:0
    }
    .button::after{
        top:100%
    }
    .button span{
        position:relative;
        z-index:2;
        font-size:1.6rem;
        font-weight:700;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .button:hover::before{
        top:-100%
    }
    .button:hover::after{
        top:0
    }
    .button-full-width{
        width:100%;
        padding-left:0;
        padding-right:0
    }
    .button-red span{
        color:#fff
    }
    .button-red::before{
        background-color:var(--color-red)
    }
    .button-red::after{
        background-color:var(--color-dark)
    }
    .button-red-hover-white:hover span{
        color:var(--color-dark)
    }
    .button-red-hover-white::after{
        background-color:var(--color-light)
    }
    .button-blue span{
        color:#fff
    }
    .button-blue::before{
        background-color:var(--color-blue)
    }
    .button-blue::after{
        background-color:var(--color-dark)
    }
    .button-blue-2 span{
        color:#fff
    }
    .button-blue-2::before{
        background-color:var(--color-blue)
    }
    .button-blue-2::after{
        background-color:#fff
    }
    .button-blue-2:hover span{
        color:var(--color-dark)
    }
    .button-light span{
        color:var(--color-grey)
    }
    .button-light::before{
        background-color:var(--color-light)
    }
    .button-light::after{
        background-color:var(--color-dark)
    }
    .button-light:hover span{
        color:#fff
    }
    .button-light-2 span{
        color:var(--color-grey-6)
    }
    .button-light-2::before{
        background-color:var(--color-light)
    }
    .button-light-2::after{
        background-color:var(--color-blue)
    }
    .button-light-2:hover span{
        color:#fff
    }
    .button-dark span{
        color:#fff
    }
    .button-dark::before{
        background-color:var(--color-dark-2)
    }
    .button-dark::after{
        background-color:var(--color-blue)
    }
    .button-dark:hover span{
        color:#fff
    }
    .button-green span{
        color:#fff
    }
    .button-green::before{
        background-color:var(--color-green)
    }
    .button-green::after{
        background-color:var(--color-dark)
    }
    .button-purple span{
        color:#fff
    }
    .button-purple::before{
        background-color:var(--color-purple)
    }
    .button-purple::after{
        background-color:var(--color-dark)
    }
    .button-purple-hover-white:hover span{
        color:var(--color-dark)
    }
    .button-purple-hover-white::after{
        background-color:var(--color-light)
    }
    .button-navigation{
        padding:1.6rem 2.7rem 1.2rem 2.7rem;
        position:relative;
        z-index:2
    }
    .button-navigation span{
        font-size:1.4rem
    }
    @media (max-width: 1199px){
        .button-navigation{
            display:block;
            margin:3rem auto 0 auto;
            width:70%;
            padding:2.2rem 2.7rem 1.8rem 2.7rem
        }
    }
    .button-group{
        margin-top:-.7rem;
        margin-right:-.7rem
    }
    .button-group .button{
        margin-top:.7rem;
        margin-right:.7rem;
        min-width: 200px;
    }
    @media (max-width: 575px){
        .button-group .button{
            min-width: 180px;
        }
    }
    .button-group-center{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap
    }
    .feature-section-wrapper{
        padding:15rem 0 13.5rem 0
    }
    @media (max-width: 991px){
        .feature-section-wrapper{
            padding:5rem 0
        }
    }
    .feature-section-content-row{
        margin-top:9.4rem
    }
    .feature-section-content-row div[class*='col']:nth-child(n+4){
        margin-top:3.2rem
    }
    @media (max-width: 991px){
        .feature-section-content-row div[class*='col']:nth-child(n+2){
            margin-top:3.2rem
        }
    }
    @media (max-width: 991px){
        .feature-section-content-row{
            margin-top:3rem
        }
    }
    .feature-section-content h3{
        margin:4.7rem 0 3.2rem 0
    }
    @media (max-width: 991px){
        .feature-section-content h3{
            margin-top:3rem
        }
    }
    .feature-section .button-group{
        margin-top:8.4rem
    }
    @media (max-width: 991px){
        .feature-section .button-group{
            margin-top:3rem
        }
    }
    .features-padding-1 .features-wrapper{
        padding:5.5rem 0 5.5rem 0
    }
    @media (max-width: 991px){
        .features-padding-1 .features-wrapper{
            padding:5rem 0
        }
    }
    .features-padding-2 .features-wrapper{
        padding:2.3rem 0 2.5rem 0
    }
    @media (max-width: 991px){
        .features-padding-2 .features-wrapper{
            padding:5rem 0
        }
    }
    .features-content>*:nth-child(n+2){
        margin-top:3rem
    }
    .features-wrapper{
        position:relative;
        z-index:4
    }
    .features>.background-layout{
        width:100%;
        height:100%;
        position:absolute;
        top:0;
        left:0
    }
    .features>.background-layout .box-1{
        position:absolute;
        top:0;
        right:0;
        width:91%;
        height:100%;
        z-index:-1
    }
    @media (max-width: 991px){
        .features>.background-layout .box-1{
            width:98%
        }
    }
    .features-2 .background-layout .box-1{
        width:100%
    }
    @media (max-width: 991px){
        .features-2 .background-layout .box-1{
            width:100%
        }
    }
    .accordion-header{
        background-color:transparent;
        outline:none
    }
    .accordion-item{
        border:0;
        width:90%;
        outline:none;
        border-top:0.1rem solid var(--color-grey-1) !important;
        padding:2rem 0 1.9rem 0;
        background-color:transparent
    }
    .accordion-item-wrapper{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-align:start;
        -ms-flex-align:start;
        align-items:flex-start
    }
    .accordion-item-wrapper>.icon-small{
        width:10%;
        margin-top:1.7rem
    }
    @media (max-width: 575px){
        .accordion-item{
            width:85%
        }
        .accordion-item-wrapper>.icon-small{
            width:15%
        }
    }
    .accordion-1 .accordion-item:first-child{
        border-top:none !important
    }
    .accordion-button{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        width:100%;
        outline:none;
        padding:0 0 0 0;
        background-color:transparent
    }
    .accordion-button:focus{
        -webkit-box-shadow:none;
        box-shadow:none
    }
    .accordion-button h4{
        margin:0
    }
    .accordion-button:not(.collapsed){
        background-color:transparent;
        -webkit-box-shadow:none;
        box-shadow:none;
        color:initial
    }
    .accordion-button:not(.collapsed)::after{
        background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239797ad'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
    }
    .accordion-button::after{
        background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239797ad'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
        background-size:cover;
        width:2rem;
        height:2rem
    }
    .accordion-body{
        padding:1rem 0 .4rem 0,
        
    }
    .accordion-body {
        color: #000000 !important; /* This forces the style, but use as a last resort */
    }


    .slider-pagination{
        position:relative;
        z-index:2;
        width:-webkit-max-content;
        width:-moz-max-content;
        width:max-content;
        margin:3rem auto 0 auto
    }
    .slider-pagination .swiper-pagination-bullet{
        width:1.2rem;
        height:1.2rem;
        background:var(--color-grey-4);
        opacity:1
    }
    .slider-pagination .swiper-pagination-bullet:not(:last-child){
        margin-right:1rem
    }
    .slider-pagination .swiper-pagination-bullet-active{
        background:var(--color-green)
    }
    .testimonial-slide{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex
    }


    .pricing-section-wrapper{
        position:relative;
        padding:14.6rem 0 15rem 0
    }
    @media (max-width: 991px){
        .pricing-section-wrapper{
            padding:5rem 0
        }
    }
    .pricing-section-content{
        position:relative;
        z-index:2
    }
    .pricing-section-content .heading{
        margin-bottom:10rem
    }
    @media (max-width: 991px){
        .pricing-section-content .heading{
            margin-bottom:3rem
        }
    }
    .pricing-section .background-layout{
        position:absolute;
        top:0;
        left:0;
        z-index:1;
        width:100%;
        height:100%
    }
    .pricing-section .background-layout .box-1{
        position:absolute;
        top:0;
        right:0;
        width:92%;
        height:100%
    }
    @media (max-width: 1599px){
        .pricing-section .background-layout .box-1{
            width:98%
        }
    }
    @media (max-width: 1299px){
        .pricing-section .background-layout .box-1{
            width:100%
        }
    }
    .pricing-section .background-layout .box-2{
        position:absolute;
        top:100%;
        left:0;
        width:8%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 1599px){
        .pricing-section .background-layout .box-2{
            width:2%;
            right:100%
        }
    }
    @media (max-width: 1299px){
        .pricing-section .background-layout .box-2{
            width:6%;
            right:94%
        }
    }
    .pricing-section .background-layout .box-2-1{
        position:absolute;
        top:100%;
        left:100%;
        width:50%;
        aspect-ratio:1 / 1
    }
    .pricing-section-1 .background-layout .box-1{
        width:100%
    }
    @media (max-width: 1599px){
        .pricing-section-1 .background-layout .box-1{
            width:100%
        }
    }
    .pricing-slider .swiper-container{
        overflow:visible
    }
    .pricing-single-wrapper{
        padding:7rem 4rem 5.5rem 4rem;
        text-align:center;
        position:relative;
        background-color:#fff
    }
    .pricing-single .price{
        font-size:3rem;
        font-weight:500;
        margin:2.8rem 0 5.9rem 0
    }
    .pricing-single ul{
        text-align:left;
        width:-webkit-max-content;
        width:-moz-max-content;
        width:max-content;
        list-style:none;
        margin:4.4rem auto 6.8rem auto
    }
    .pricing-single ul li{
        font-size:1.6rem;
        font-weight:500;
        line-height:4rem;
        color:var(--color-grey)
    }
    .pricing-single ul li::before{
        content:'\f00d';
        font-family:'Font Awesome 5 Free';
        font-weight:700;
        font-size:1.4rem;
        color:var(--color-red);
        margin-right:1.3rem
    }
    .pricing-single ul li.available::before{
        content:'\f00c';
        color:var(--color-green)
    }
    .pricing-single .box{
        width:3rem;
        height:3rem;
        position:absolute;
        top:0;
        left:0
    }
    .faq-section-wrapper{
        padding:14.6rem 0 12.9rem 0
    }
    @media (max-width: 991px){
        .faq-section-wrapper{
            padding:5rem 0
        }
    }
    .faq-section .heading{
        margin-bottom:7.4rem
    }

    .related-posts-wrapper{
        position:relative;
        padding:15rem 0 14.5rem 0
    }
    @media (max-width: 991px){
        .related-posts-wrapper{
            padding:5rem 0
        }
    }
    .related-posts-content{
        position:relative;
        z-index:2
    }
    .related-posts-slider{
        margin-top:3.5rem
    }
    @media (max-width: 991px){
        .related-posts-slider-container{
            max-width:100%
        }
        .related-posts-slider-container div[class*='col']{
            width:100%;
            margin:0
        }
    }
    .related-posts .background-layout{
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        z-index:1
    }
    .related-posts .background-layout .box-1{
        position:absolute;
        top:0;
        left:0;
        width:92%;
        height:100%;
        overflow:hidden
    }
    @media (max-width: 1599px){
        .related-posts .background-layout .box-1{
            width:98%
        }
    }
    @media (max-width: 1299px){
        .related-posts .background-layout .box-1{
            width:100%
        }
    }
    .related-posts .background-layout .box-1-1{
        position:absolute;
        bottom:0;
        right:0;
        width:8.7%;
        aspect-ratio:1 / 1
    }
    .related-posts .background-layout .box-1-1-1{
        position:absolute;
        bottom:100%;
        left:-40%;
        width:40%;
        aspect-ratio:1 / 1
    }
    .related-posts .background-layout .box-2{
        position:absolute;
        bottom:100%;
        right:0;
        width:8%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 1599px){
        .related-posts .background-layout .box-2{
            width:2%
        }
    }
    @media (max-width: 1299px){
        .related-posts .background-layout .box-2{
            width:6%
        }
    }
    .related-posts .background-layout .box-2-1{
        position:absolute;
        bottom:100%;
        left:-20%;
        width:20%;
        aspect-ratio:1 / 1
    }
    .related-posts .background-layout .box-3{
        position:absolute;
        top:100%;
        right:0;
        width:8%;
        aspect-ratio:1 / 1;
        z-index:2
    }
    @media (max-width: 1599px){
        .related-posts .background-layout .box-3{
            width:2%
        }
    }
    @media (max-width: 1299px){
        .related-posts .background-layout .box-3{
            width:6%
        }
    }
    .related-posts .background-layout .box-3-1{
        position:absolute;
        top:100%;
        left:-75%;
        width:75%;
        aspect-ratio:1 / 1
    }
    .comments-list{
        padding:15rem 0 12rem 0
    }
    .comments-heading{
        margin-bottom:5.2rem
    }
    .comments-heading h3{
        font-size:3rem
    }
    @media (max-width: 991px){
        .comments-heading{
            margin-bottom:3rem
        }
    }
    .comments-single{
        padding-top:1rem
    }
    .comments-single-wrapper{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        position:relative
    }
    .comments-single-content{
        padding:3.5rem 6.5rem 2rem 5.5rem;
        position:relative;
        background-color:var(--color-light)
    }
    .comments-single h5{
        font-size:1.8rem;
        font-weight:700;
        color:var(--color-dark)
    }
    .comments-single-image{
        margin-right:1rem
    }
    .comments-single .date{
        font-size:1.2rem;
        font-weight:500;
        color:var(--color-grey)
    }
    .comments-single .comment{
        font-size:1.4rem;
        font-weight:500;
        line-height:3rem;
        color:var(--color-grey);
        margin-top:.8rem
    }
    .comments-single .reply-button{
        padding:1.1rem 2rem;
        position:absolute;
        top:0;
        right:0
    }
    .comments-single .reply-button span{
        font-size:1.4rem;
        color:var(--color-grey)
    }
    .comments-single .reply-button::before{
        background-color:#fff
    }
    .comments-single .reply-button::after{
        background-color:var(--color-blue)
    }
    .comments-single .reply-button:hover span{
        color:#fff
    }
    .comments-single .comments-single{
        padding-left:14.2%
    }
    @media (max-width: 767px){
        .comments-single .comments-single{
            padding-left:5%
        }
    }
    @media (max-width: 575px){
        .comments-single-wrapper{
            -webkit-box-orient:vertical;
            -webkit-box-direction:normal;
            -ms-flex-direction:column;
            flex-direction:column
        }
        .comments-single-content{
            margin-top:1rem
        }
    }
    @media (max-width: 991px){
        .comments-list{
            padding:5rem 0
        }
    }
    .comments-form-wrapper{
        padding-bottom:15rem
    }
    .comments-form-heading{
        margin-bottom:6.2rem
    }
    .comments-form-heading h3{
        font-size:3rem
    }
    @media (max-width: 991px){
        .comments-form-heading{
            margin-bottom:3rem
        }
    }
    .comments-form .button{
        display:block;
        margin:5rem auto 0 auto
    }
    @media (max-width: 991px){
        .comments-form .button{
            width:100%;
            padding-left:0;
            padding-right:0
        }
    }
    @media (max-width: 991px){
        .comments-form-wrapper{
            padding-bottom:5rem
        }
        .comments-form-heading{
            margin-bottom:3rem
        }
        .comments-form .textarea-form{
            margin-top:2.3rem;
            height:20rem
        }
    }
    .form-floating .input{
        height:6.3rem;
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey);
        padding:0 1rem;
        border:none;
        border-bottom:0.2rem solid var(--color-grey-1)
    }
    .form-floating .input:focus,.form-floating .input:active{
        border-color:var(--color-red);
        outline:none;
        -webkit-box-shadow:none;
        box-shadow:none
    }
    .form-floating label{
        padding:1.9rem 1rem;
        top:0;
        left:0;
        -webkit-transform:none;
        transform:none;
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey)
    }
    .form-floating:nth-child(n+2){
        margin-top:2.7rem
    }
    .form-floating .textarea{
        height:100%;
        padding:2.3rem 1rem !important;
        resize:none
    }
    .form-floating.textarea-form{
        height:100%
    }
    .form-floating>.form-control:focus ~ label,.form-floating>.form-control:not(:placeholder-shown) ~ label,.form-floating>.form-select ~ label{
        -webkit-transform:scale(0.85) translateY(-2rem) translateX(0.15rem);
        transform:scale(0.85) translateY(-2rem) translateX(0.15rem)
    }
    .contact-section-wrapper{
        padding-top:11.8rem
    }
    @media (max-width: 991px){
        .contact-section-wrapper{
            padding-top:9.7rem
        }
        .contact-section-wrapper .row {
            align-items: center;
        }
    }
    @media (min-width: 768px) and (max-width: 1199px) {
        .contact-section-wrapper .row {
            align-items: center;
        }
    }
    .login-section-wrapper{
        padding-top:19.8rem
    }
    @media (max-width: 991px){
        .login-section-wrapper{
            padding-top:14.7rem
        }
    }
    .contact-section h3{
        font-size:3.4rem;
        line-height:5.4rem;
        margin-bottom:3.2rem
    }
    .contact-form-wrapper{
        padding:7rem 8rem 8rem 8rem
    }
    @media (max-width: 991px){
        .contact-form-wrapper{
            padding:5rem
        }
    }
    .contact-form .form-floating:nth-child(n+2){
        margin-top:3.3rem
    }
    .contact-form .form-row:nth-child(n+2){
        margin:3rem 0
    }
    .cta{
        height:100%
    }
    .cta-wrapper{
        height:100%;
        overflow:hidden;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column
    }
    .cta h3{
        margin-bottom:0
    }
    .cta .heading{
        padding:7rem 0 3.2rem 0;
        -webkit-box-flex:.25;
        -ms-flex:.25;
        flex:.25
    }
    .cta .image{
        width:100%;
        -webkit-box-flex:.75;
        -ms-flex:.75;
        flex:.75;
        overflow:hidden;
        background-repeat:no-repeat;
        background-size:cover;
        background-position:center bottom
    }
    @media (max-width: 991px){
        .cta .image{
            min-height:42.3rem
        }
    }
    .cta img{
        width:100%;
        height:100%;
        -o-object-fit:cover;
        object-fit:cover
    }
    .cta .button{
        position:absolute;
        left:50%;
        bottom:8rem;
        -webkit-transform:translateX(-50%);
        transform:translateX(-50%);
        width:calc(100% - 16rem)
    }
    .screen-section .heading{
        margin-bottom:8.2rem
    }
    @media (max-width: 991px){
        .screen-section .heading{
            margin-bottom:3rem
        }
    }
    .screen-slider-wrapper{
        width:90%;
        margin:0 auto
    }
    @media (max-width: 991px){
        .screen-slider-wrapper{
            width:100%
        }
    }
    .screen-slider .background-layout .box-1{
        position:absolute;
        top:50%;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        left:0;
        width:92%;
        height:85%
    }
    .screen-slider .background-layout .box-2{
        position:absolute;
        bottom:100%;
        left:100%;
        width:8.7%;
        aspect-ratio:1 / 1
    }
    .screen-slider .background-layout .box-2-1{
        position:absolute;
        bottom:100%;
        left:-57%;
        width:57%;
        aspect-ratio:1 / 1
    }
    .screen-slider .background-layout .box-3{
        position:absolute;
        top:100%;
        left:100%;
        width:8.7%;
        aspect-ratio:1 / 1
    }
    .screen-slider .background-layout .box-3-1{
        position:absolute;
        top:100%;
        left:-57%;
        width:57%;
        aspect-ratio:1 / 1
    }
    .screen-section-1 .screen-slider .background-layout .box-1{
        width:100%
    }
    .screen-slide img{
        max-width:100%
    }
    .cta-section-wrapper{
        position:relative;
        z-index:2
    }
    @media (max-width: 991px){
        .cta-section-wrapper{
            padding:5rem 0
        }
    }
    .cta-section-content h2{
        font-size:5rem;
        line-height:7rem;
        margin-bottom:3.8rem
    }
    @media (max-width: 991px){
        .cta-section-content h2{
            font-size:4rem;
            line-height:6rem
        }
    }
    @media (max-width: 991px){
        .cta-section-content{
            text-align:center
        }
    }
    .cta-section-image{
        text-align:right;
        position:relative
    }
    .cta-section-image img{
        max-width:100%
    }
    .cta-section-image .box-1{
        position:absolute;
        top:35%;
        left:25%;
        width:16.4rem;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-2{
        position:absolute;
        bottom:100%;
        left:-50%;
        width:50%;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-2-1{
        position:absolute;
        top:100%;
        left:-80%;
        width:80%;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-3{
        position:absolute;
        top:100%;
        left:-75%;
        width:75%;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-4{
        position:absolute;
        top:20%;
        right:-4rem;
        width:8.4rem;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-5{
        position:absolute;
        top:100%;
        left:100%;
        width:150%;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-6{
        position:absolute;
        top:100%;
        left:100%;
        width:75%;
        aspect-ratio:1 / 1
    }
    .cta-section-image .box-7{
        position:absolute;
        top:100%;
        right:100%;
        width:70%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 991px){
        .cta-section-image{
            text-align:center;
            margin-bottom:3rem;
            padding: 0 2rem;
        }
        .cta-section-image img{
            max-width:100% !important;
            width: auto !important;
            height: auto !important;
        }
        .cta-section-image .box-1{
            left:5%
        }
        .cta-section-image .box-4{
            right:2rem
        }
    }
    .cta-section .background-layout .box-1{
        position:absolute;
        top:50%;
        right:0;
        -webkit-transform:translateY(-50%);
        transform:translateY(-50%);
        width:92%;
        height:90%
    }
    @media (max-width: 1599px){
        .cta-section .background-layout .box-1{
            width:98%
        }
    }
    @media (max-width: 1299px){
        .cta-section .background-layout .box-1{
            width:100%
        }
    }
    .cta-section .background-layout .box-1-1{
        position:absolute;
        bottom:0;
        left:0;
        width:6%;
        aspect-ratio:1 / 1
    }
    .cta-section .background-layout .box-1-1-1{
        position:absolute;
        bottom:100%;
        right:-60%;
        width:60%;
        aspect-ratio:1 / 1
    }
    .cta-section .background-layout .box-2{
        position:absolute;
        bottom:100%;
        right:100%;
        width:8.7%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 1599px){
        .cta-section .background-layout .box-2{
            width:2%;
            right:100%
        }
    }
    @media (max-width: 1299px){
        .cta-section .background-layout .box-2{
            width:6%;
            right:94%
        }
    }
    .cta-section .background-layout .box-2-1{
        position:absolute;
        bottom:100%;
        right:-40%;
        width:40%;
        aspect-ratio:1 / 1
    }
    .cta-section .background-layout .box-3{
        position:absolute;
        top:100%;
        right:100%;
        width:8.7%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 1599px){
        .cta-section .background-layout .box-3{
            width:2%;
            right:100%
        }
    }
    @media (max-width: 1299px){
        .cta-section .background-layout .box-3{
            width:6%;
            right:94%
        }
    }
    .cta-section .background-layout .box-3-1{
        position:absolute;
        top:100%;
        right:-40%;
        width:40%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 991px){
        .cta-section .background-layout .box-1{
            height:100%
        }
    }
    .cta-section-1 .background-layout .box-1{
        width:100%
    }
    @media (max-width: 1599px){
        .cta-section-1 .background-layout .box-1{
            width:100%
        }
    }
    .footer-wrapper{
        position:relative;
        padding:15rem 0 15rem 0
    }
    @media (max-width: 991px){
        .footer-wrapper{
            padding:10rem 0 5rem 0
        }
    }
    .footer-row{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        position:relative;
        z-index:2
    }
    @media (max-width: 991px){
        .footer-row{
            -webkit-box-orient:vertical;
            -webkit-box-direction:normal;
            -ms-flex-direction:column;
            flex-direction:column
        }
        .footer-row>div:nth-child(n+2){
            margin-top:3rem
        }
    }
    .footer-detail{
        -webkit-box-flex:.5;
        -ms-flex:.5;
        flex:.5
    }
    .footer-detail p{
        margin:1.7rem 0 3.4rem 0
    }
    @media (max-width: 991px){
        .footer-detail p{
            margin:2rem 0
        }
    }
    .footer-list h6{
        font-size:1.5rem;
        font-weight:bold;
        color:black;
        margin-bottom:5rem
    }
    .footer-list li{
        list-style:none
    }
    .footer-list li a{
        font-size:1.5rem;
        font-weight:500;
        line-height:4rem;
        color:var(--color-grey)
    }
    .footer-list li a i{
        margin-right:.4rem
    }
    .footer-list li a span::before{
        background-color:var(--color-grey)
    }
    @media (max-width: 991px){
        .footer-list h6{
            margin-bottom:1.5rem
        }
    }
    .footer .social{
        list-style:none
    }
    .footer .social li{
        display:inline-block
    }
    .footer .social li:not(:last-child){
        margin-right:.7rem
    }
    .footer .social .button{
        width:4.3rem;
        height:4.3rem;
        padding:0;
        display:-webkit-inline-box;
        display:-ms-inline-flexbox;
        display:inline-flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center
    }
    .footer-copyright{
        position:relative;
        z-index:2
    }
    .footer-copyright .inline {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex-wrap: wrap;
    }
    @media (max-width: 991px){
        .footer-copyright{
            margin-top:5rem
        }
        .footer-copyright .inline {
            flex-direction: column;
            align-items: flex-start;
            text-align: left;
        }
    }
    .footer .footer-bottom .box-1{
        position:absolute;
        bottom:0;
        right:0;
        width:11.5rem;
        aspect-ratio:1 / 1
    }
    @media (max-width: 991px){
        .footer .footer-bottom .box-1{
            width:8rem;
            bottom:2rem;
            right:2rem;
        }
    }
    .footer .footer-bottom .box-2{
        position:absolute;
        bottom:100%;
        left:-50%;
        width:50%;
        aspect-ratio:1 / 1
    }
    .footer .footer-bottom .button{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        padding:0;
        width:100%;
        height:100%
    }
    .footer .footer-bottom .button span{
        font-size:2rem
    }
    .header-wrapper{
        padding-top:20.5rem
    }
    @media (max-width: 991px){
        .header-wrapper{
            padding-top:15rem
        }
        .header-wrapper .row {
            overflow-x: hidden;
        }
    }
    .header-content p{
        margin-top:2.5rem;
        margin-bottom:5.5rem
    }
    @media (max-width: 991px){
        .header-content {
            padding: 0 1rem;
        }
        .header-content h1, .header-content p {
            max-width: 100%;
        }
    }
    .header-content .background-layout .box-1{
        position:absolute;
        bottom:0;
        left:-40%;
        width:12.4rem;
        aspect-ratio:1 / 1
    }
    @media (max-width: 991px){
        .header-content .background-layout .box-1{
            width:8.2rem
        }
    }
    .header-content .background-layout .box-2{
        position:absolute;
        bottom:100%;
        left:100%;
        width:130%;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-3{
        position:absolute;
        bottom:100%;
        right:100%;
        width:70%;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-4{
        position:absolute;
        bottom:-100%;
        left:-100%;
        width:50%;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-5{
        position:absolute;
        top:25%;
        right:-2rem;
        width:8.4rem;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-6{
        position:absolute;
        top:100%;
        left:100%;
        width:150%;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-7{
        position:absolute;
        top:125%;
        left:125%;
        width:75%;
        aspect-ratio:1 / 1
    }
    .header-content .background-layout .box-8{
        position:absolute;
        top:-60%;
        right:-60%;
        width:40%;
        aspect-ratio:1 / 1
    }
    .header-image{
        width:-webkit-max-content;
        width:-moz-max-content;
        width:max-content
    }
    .header-image img{
        max-width:100%
    }
    @media (max-width: 991px){
        .header-image{
            width:80%
        }
    }
    .header-2 .header-wrapper{
        padding-top:22rem
    }
    .navigation-wrapper{
        width:100%;
        position:fixed;
        top:3rem;
        left:0;
        z-index:500;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation-inner{
        width:100%;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        background-color:transparent;
        padding:0 3.5rem;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation .social{
        display:none;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        width:100%;
        position:absolute;
        left:50%;
        -webkit-transform:translateX(-50%);
        transform:translateX(-50%);
        bottom:10px;
        z-index:2;
        padding:0 30px 0 40px
    }
    .navigation .social h5{
        font-weight:700;
        color:#fff
    }
    .navigation .social ul{
        list-style:none
    }
    .navigation .social ul li{
        display:inline-block
    }
    .navigation .social ul li:not(:last-child){
        margin-right:1rem
    }
    .navigation .social ul li a{
        display:block;
        width:46px;
        height:46px;
        padding:0;
        position:relative;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation .social ul li a span{
        font-size:2rem;
        position:absolute;
        top:50%;
        left:50%;
        -webkit-transform:translate(-50%, -50%);
        transform:translate(-50%, -50%)
    }
    .navigation .social ul li a:hover{
        background-color:var(--pink-1)
    }
    .navigation .social ul li a:hover i{
        color:#fff
    }
    @media (max-width: 350px){
        .navigation .social{
            width:100%;
            -webkit-box-orient:vertical;
            -webkit-box-direction:normal;
            -ms-flex-direction:column;
            flex-direction:column;
            -webkit-box-pack:center;
            -ms-flex-pack:center;
            justify-content:center
        }
        .navigation .social ul{
            margin:2rem 0 0 0
        }
    }
    .navigation-menu .parent{
        margin:0;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center
    }
    .navigation-menu .parent>li{
        list-style:none;
        position:relative
    }
    .navigation-menu .parent>li>a:not(.button){
        position:relative;
        z-index:50
    }
    .navigation-menu .parent>li>a:not(.button)>span{
        font-size:1.6rem;
        font-weight:700;
        color:var(--color-grey)
    }
    .navigation-menu .parent>li+li{
        margin-left:4.5rem
    }
    .navigation-menu .parent>li::after{
        content:'';
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:8rem;
        z-index:1
    }
    .navigation-menu .parent>li .child{
        position:absolute;
        top:8rem;
        opacity:0;
        visibility:hidden;
        min-width:25rem;
        background-color:#fff;
        -webkit-box-shadow:0px 1px 20px 0px rgba(0,0,0,0.1);
        box-shadow:0px 1px 20px 0px rgba(0,0,0,0.1);
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s;
        padding:.3rem
    }
    .navigation-menu .parent>li .child ul{
        background-color:#fff;
        padding:1rem 4rem 1rem 2rem
    }
    .navigation-menu .parent>li .child li{
        list-style:none
    }
    .navigation-menu .parent>li .child li a{
        display:block;
        padding:1.5rem 0 1.5rem 2rem;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation-menu .parent>li .child li a span{
        font-size:1.5rem;
        color:var(--color-grey);
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation-menu .parent>li .child li a span::before{
        background-color:var(--color-dark)
    }
    .navigation-menu .parent>li .child li a:hover{
        background-color:#fff
    }
    .navigation-menu .parent>li .child li a:hover span{
        color:var(--color-dark)
    }
    .navigation-menu .parent>li:hover .child{
        top:4rem;
        opacity:1;
        visibility:visible
    }
    .navigation-menu .mobile-header{
        display:none;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        padding:0 30px 0 40px;
        margin:21px 0 24px 0
    }
    .navigation-menu .mobile-header ul{
        list-style:none;
        margin:0
    }
    .navigation-menu .mobile-header ul li{
        display:-webkit-inline-box;
        display:-ms-inline-flexbox;
        display:inline-flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        cursor:pointer;
        width:35px;
        height:35px;
        background-color:#fff
    }
    .navigation-menu .mobile-header ul li i{
        font-size:14px
    }
    .navigation-menu .mobile-header ul li:nth-child(n+2){
        margin-left:.5rem
    }
    .navigation-menu .background-pattern{
        display:none
    }
    @media (max-width: 1199px){
        .navigation-menu{
            position:absolute;
            top:-3rem;
            left:-100%;
            width:100%;
            height:100vh;
            background-color:var(--color-dark);
            -webkit-transition:all .25s ease-out 0s;
            transition:all .25s ease-out 0s
        }
        .navigation-menu .close-button{
            display:none;
            position:relative;
            z-index:2
        }
        .navigation-menu .mobile-header{
            display:-webkit-box;
            display:-ms-flexbox;
            display:flex;
            position:relative;
            z-index:2
        }
        .navigation-menu .tagline{
            display:block
        }
        .navigation-menu .background-pattern{
            display:block;
            top:0;
            left:0;
            width:100%
        }
        .navigation-menu .parent{
            display:block
        }
        .navigation-menu .parent li{
            display:block
        }
        .navigation-menu .parent li::after{
            display:none
        }
        .navigation-menu .parent li>a:not(.button){
            display:block
        }
        .navigation-menu .parent li>a:not(.button)>span{
            display:block;
            color:#fff;
            width:100%;
            padding:15px 40px;
            font-size:20px;
            font-weight:500
        }
        .navigation-menu .parent li span::before{
            display:none
        }
        .navigation-menu .parent li.main-search{
            display:none
        }
        .navigation-menu .parent li.has-child a{
            position:relative
        }
        .navigation-menu .parent li.has-child a::after{
            content:'\f107';
            font-family:'Font Awesome 5 Free';
            font-size:20px;
            font-weight:900;
            color:#fff;
            position:absolute;
            top:50%;
            right:40px;
            -webkit-transform:translateY(-50%);
            transform:translateY(-50%);
            -webkit-transition:all .25s ease-out 0s;
            transition:all .25s ease-out 0s
        }
        .navigation-menu .parent li.has-child .child{
            box-shadow:none;
            -webkit-box-shadow:none;
            -moz-box-shadow:none;
            border:none;
            border-radius:0;
            z-index:2
        }
        .navigation-menu .parent li.has-child .child ul{
            border-radius:0
        }
        .navigation-menu .parent li.has-child .child a::after{
            content:'\f105'
        }
        .navigation-menu .parent li .child{
            position:relative;
            top:0 !important;
            opacity:1 !important;
            visibility:visible;
            display:none;
            padding:0;
            background-color:#fff
        }
        .navigation-menu .parent li .child li a{
            padding:0
        }
        .navigation-menu .parent li .child li a span{
            display:inline-block;
            color:var(--color-grey);
            font-size:20px;
            font-weight:500;
            padding:11.5px 40px
        }
        .navigation-menu .parent li .child li:first-child{
            padding-top:5.75px
        }
        .navigation-menu .parent li .child li:last-child{
            padding-bottom:5.75px
        }
        .navigation-menu .parent li+li{
            margin-left:0
        }
        .navigation-menu .parent li.has-child.dropped>a::after{
            -webkit-transform:translateY(-50%) rotate(180deg);
            transform:translateY(-50%) rotate(180deg)
        }
    }
    @media (max-width: 350px){
        .navigation-menu .mobile-header{
            -webkit-box-orient:vertical;
            -webkit-box-direction:normal;
            -ms-flex-direction:column;
            flex-direction:column
        }
        .navigation-menu .mobile-header ul{
            margin-top:3rem
        }
    }
    @media (min-width: 992px){
        .navigation-menu .has-child .child{
            position:absolute !important;
            max-height:initial !important;
            -webkit-transition:all 0.25s ease !important;
            transition:all 0.25s ease !important
        }
    }
    .navigation.scrolled .navigation-wrapper{
        top:0;
        background-color:rgba(255, 255, 255, 0.782);
        backdrop-filter: blur(10px);
        -webkit-box-shadow:0px 1px 20px 0px rgba(0,0,0,0.1);
        box-shadow:0px 1px 20px 0px rgba(0,0,0,0.1)
    }
    .navigation.scrolled .navigation-inner{
        padding:3rem 3.5rem 3rem 3.5rem
    }
    @media (max-width: 991px){
        .navigation.scrolled .navigation-inner{
            padding:3.1rem 2rem 3.1rem 2rem
        }
    }
    .navigation.scrolled .navigation-menu .parent li:hover .child{
        top:6.7rem
    }
    @media (max-width: 991px){
        .navigation.scrolled .navigation-menu{
            top:0
        }
    }
    .navigation-bar{
        width:4rem;
        height:16px;
        display:none;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        cursor:pointer;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation-bar div{
        display:block;
        width:100%;
        height:2px;
        background-color:var(--color-dark)
    }
    @media (max-width: 1199px){
        .navigation-bar{
            display:-webkit-box;
            display:-ms-flexbox;
            display:flex
        }
    }
    .navigation-1:not(.scrolled) .navigation-logo{
        position:relative;
        height:3.3rem
    }
    .navigation-1:not(.scrolled) .navigation-logo a{
        position:absolute;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .navigation-1:not(.scrolled) .navigation-logo .logo{
        opacity:0;
        visibility:none
    }
    .navigation-1:not(.scrolled) span::before{
        background-color:#fff
    }
    .navigation-1:not(.scrolled) .navigation-menu .parent>li>a>span{
        color:#fff
    }
    .navigation-1:not(.scrolled) .navigation-bar div{
        background-color:#fff
    }
    .navigation-1.scrolled .navigation-logo .logo{
        opacity:1;
        visibility:visible
    }
    .navigation-1.scrolled .navigation-logo .logo-white{
        opacity:0;
        visibility:hidden
    }
    .navigation.shown .navigation-menu{
        top:-3rem;
        left:0
    }
    @media (max-width: 991px){
        .navigation.shown.scrolled .navigation-menu{
            top:0
        }
    }
    @media (max-width: 1199px){
        .navigation-inner{
            top:8rem;
            -webkit-box-align:center;
            -ms-flex-align:center;
            align-items:center;
            padding:0 2rem 0 2rem
        }
        .navigation-inner .search{
            display:block
        }
        .navigation .social{
            display:-webkit-box;
            display:-ms-flexbox;
            display:flex
        }
    }
    @media (max-width: 730px){
        .navigation-inner{
            top:5rem
        }
    }
    .video-section-wrapper{
        padding:15rem 0
    }
    @media (max-width: 991px){
        .video-section-wrapper{
            padding:5rem 0
        }
    }
    .video-section-content>*:nth-child(n+2){
        margin-top:3rem
    }
    @media (max-width: 991px){
        .video-section-content{
            margin-top:3rem
        }
    }
    .video-layout{
        --box-height: 17rem;
        width:100%;
        min-height:calc(var(--box-height) * 3 + (var(--box-height) * .6) + ((var(--box-height) * .6) * .5))
    }
    .video-layout .icon{
        width:var(--box-height);
        height:var(--box-height);
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        position:relative;
        top:var(--box-height);
        left:13.4rem
    }
    .video-layout .icon i{
        font-size:8rem;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s
    }
    .video-layout .icon i:hover{
        color:var(--color-dark)
    }
    .video-layout .icon i.blue-hover:hover{
        color:var(--color-blue)
    }
    @media (max-width: 991px){
        .video-layout .icon{
            left:50%;
            -webkit-transform:translateX(-50%);
            transform:translateX(-50%)
        }
    }
    .video-layout .box-1,.video-layout .box-2,.video-layout .box-3,.video-layout .box-4{
        width:100%;
        height:100%;
        position:absolute;
        background-size:cover;
        background-repeat:no-repeat
    }
    .video-layout .box-1{
        top:-100%;
        left:0
    }
    .video-layout .box-2{
        top:0;
        left:100%
    }
    .video-layout .box-3{
        top:100%;
        left:0
    }
    .video-layout .box-4{
        top:0;
        left:-100%
    }
    .video-layout .box-5{
        width:100%;
        height:100%;
        position:absolute;
        top:-100%;
        left:-100%
    }
    .video-layout .box-6{
        width:50%;
        height:50%;
        position:absolute;
        top:100%;
        left:-75%
    }
    .video-layout .box-7{
        width:60%;
        height:60%;
        position:absolute;
        top:100%;
        left:-60%
    }
    .video-layout .box-8{
        width:40%;
        height:40%;
        position:absolute;
        bottom:100%;
        right:-40%
    }
    .video-layout .box-9{
        width:60%;
        height:60%;
        position:absolute;
        top:100%;
        right:-60%
    }
    .video-layout .box-10{
        width:80%;
        height:80%;
        position:absolute;
        top:100%;
        left:-80%
    }
    .video-layout .box-11{
        width:50%;
        height:50%;
        position:absolute;
        top:100%;
        right:-100%
    }
    .page-header-wrapper{
        position:relative;
        padding:15rem 0 4.8rem 0
    }
    .page-header-content{
        position:relative;
        z-index:2
    }
    .page-header ul{
        text-align:right
    }
    .page-header ul li{
        display:inline-block;
        list-style:none
    }
    .page-header ul li:nth-child(n+2){
        margin-left:1.4rem
    }
    .page-header ul li span{
        font-size:1.6rem;
        font-weight:500;
        color:var(--color-grey)
    }
    @media (max-width: 991px){
        .page-header{
            text-align:center
        }
        .page-header ul{
            text-align:center;
            margin-top:1.5rem
        }
    }
    .page-header .background-layout{
        width:100%;
        height:100%;
        position:absolute;
        top:0;
        left:0;
        z-index:1
    }
    .page-header .background-layout .box-1{
        position:absolute;
        top:0;
        left:0;
        width:91.5%;
        height:100%
    }
    @media (max-width: 1599px){
        .page-header .background-layout .box-1{
            width:98%
        }
    }
    @media (max-width: 1299px){
        .page-header .background-layout .box-1{
            width:100%
        }
    }
    .page-header .background-layout .box-2{
        position:absolute;
        top:100%;
        right:0;
        width:8.5%;
        aspect-ratio:1 / 1
    }
    @media (max-width: 1599px){
        .page-header .background-layout .box-2{
            width:2%
        }
    }
    @media (max-width: 1299px){
        .page-header .background-layout .box-2{
            width:8.5%
        }
    }
    .page-header .background-layout .box-3{
        position:absolute;
        top:100%;
        left:-32%;
        width:32%;
        aspect-ratio:1 / 1
    }
    .preloader{
        position:fixed;
        top:0;
        left:0;
        width:100vw;
        height:100vh;
        z-index:999;
        -webkit-transition:all .25s ease-out 0s;
        transition:all .25s ease-out 0s;
        -webkit-transition-delay:1s;
        transition-delay:1s;
        background-color:var(--color-dark);
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center
    }
    .preloader .sk-folding-cube{
        width:8rem;
        height:8rem;
        position:relative;
        margin:auto;
        -webkit-transform:rotateZ(45deg);
        transform:rotateZ(45deg)
    }
    .preloader .sk-folding-cube .sk-cube{
        float:left;
        width:50%;
        height:50%;
        position:relative;
        -webkit-transform:scale(1.1);
        transform:scale(1.1)
    }
    .preloader .sk-folding-cube .sk-cube:before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background-color:#fff;
        -webkit-animation:sk-folding-cube-angle 2.4s infinite linear both;
        animation:sk-folding-cube-angle 2.4s infinite linear both;
        -webkit-transform-origin:100% 100%;
        transform-origin:100% 100%
    }
    .preloader .sk-folding-cube .sk-cube-2{
        -webkit-transform:scale(1.1) rotateZ(90deg);
        transform:scale(1.1) rotateZ(90deg)
    }
    .preloader .sk-folding-cube .sk-cube-3{
        -webkit-transform:scale(1.1) rotateZ(180deg);
        transform:scale(1.1) rotateZ(180deg)
    }
    .preloader .sk-folding-cube .sk-cube-4{
        -webkit-transform:scale(1.1) rotateZ(270deg);
        transform:scale(1.1) rotateZ(270deg)
    }
    .preloader .sk-folding-cube .sk-cube-2:before{
        -webkit-animation-delay:.3s;
        animation-delay:.3s
    }
    .preloader .sk-folding-cube .sk-cube-3:before{
        -webkit-animation-delay:.6s;
        animation-delay:.6s
    }
    .preloader .sk-folding-cube .sk-cube-4:before{
        -webkit-animation-delay:.9s;
        animation-delay:.9s
    }
    @-webkit-keyframes sk-folding-cube-angle{
        0%,10%{
            -webkit-transform:perspective(140px) rotateX(-180deg);
            transform:perspective(140px) rotateX(-180deg);
            opacity:0
        }
        25%,75%{
            -webkit-transform:perspective(140px) rotateX(0deg);
            transform:perspective(140px) rotateX(0deg);
            opacity:1
        }
        90%,100%{
            -webkit-transform:perspective(140px) rotateY(180deg);
            transform:perspective(140px) rotateY(180deg);
            opacity:0
        }
    }
    @keyframes sk-folding-cube-angle{
        0%,10%{
            -webkit-transform:perspective(140px) rotateX(-180deg);
            transform:perspective(140px) rotateX(-180deg);
            opacity:0
        }
        25%,75%{
            -webkit-transform:perspective(140px) rotateX(0deg);
            transform:perspective(140px) rotateX(0deg);
            opacity:1
        }
        90%,100%{
            -webkit-transform:perspective(140px) rotateY(180deg);
            transform:perspective(140px) rotateY(180deg);
            opacity:0
        }
    }
    body.loaded .preloader{
        -webkit-transform:translateY(-100%);
        transform:translateY(-100%)
    }
    /*# sourceMappingURL=style.css.map */
.area{
    /* background-image: url(/assets/images/background/blob.png);
    background-size: cover;
    background-position: center;
    background-repeat: space; */
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);
    width: 100%;
    height:100vh;
    min-height: 700px;
}
@media (max-width: 991px){
    .area{
        height: auto;
        min-height: 100vh;
        padding-bottom: 5rem;
    }
}

.circles{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
}
@media (max-width: 991px){
    .circles{
        position: relative;
        min-height: 100vh;
    }
}

.circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: #BFB5E4;
    animation: animate 25s linear infinite;
    bottom: -150px;
    position: absolute;
    border-radius: 0;
    
}

.circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}



@keyframes animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 2%;
    }

}




.casestudybg {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    height: 100vh;
  }
  
  @keyframes gradient {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }

/* QR Code Styles */
.qr-codes-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    gap: 3rem;
    padding: 2rem 1rem;
    flex-wrap: wrap;
}

.qr-code-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 1 auto;
    min-width: 180px;
}

.qr-code-wrapper {
    padding: 1rem;
    background: white;
    border-radius: 1rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.qr-code-wrapper:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15);
}

.qr-code-image {
    display: block;
    border-radius: 0.5rem;
}

.qr-code-label {
    margin-top: 1.5rem;
    font-weight: 700;
    color: var(--color-grey);
    font-size: 1.6rem;
    text-align: center;
}

.qr-code-label a {
    color: var(--color-dark);
    text-decoration: none;
}

.qr-code-label a:hover {
    color: var(--color-blue);
}

@media (max-width: 575px) {
    .qr-codes-container {
        gap: 2rem;
    }

    .qr-code-item {
        min-width: 140px;
    }

    .qr-code-wrapper {
        padding: 0.75rem;
    }
}

/* QR Code Modal Styles */
.qr-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    padding: 2rem;
    animation: fadeIn 0.3s ease;
}

.qr-modal-content {
    background: white;
    border-radius: 2rem;
    padding: 3rem;
    max-width: 500px;
    width: 100%;
    position: relative;
    animation: slideUp 0.3s ease;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.qr-modal-close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    background: var(--color-grey-1);
    border: none;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 2rem;
    color: var(--color-dark);
}

.qr-modal-close:hover {
    background: var(--color-blue);
    color: white;
    transform: rotate(90deg);
}

.qr-modal-title {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--color-dark);
    text-align: center;
    margin-bottom: 2rem;
    padding-right: 4rem;
}

.qr-modal-image-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem;
    background: var(--color-grey-5);
    border-radius: 1.5rem;
    margin-bottom: 2rem;
}

.qr-modal-instruction {
    font-size: 1.6rem;
    color: var(--color-grey);
    text-align: center;
    margin: 0;
    font-weight: 500;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        transform: translateY(50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@media (max-width: 575px) {
    .qr-modal-content {
        padding: 2rem;
        max-width: 90%;
    }

    .qr-modal-title {
        font-size: 2rem;
        padding-right: 3rem;
    }

    .qr-modal-image-wrapper {
        padding: 1.5rem;
    }

    .qr-modal-close {
        width: 3.5rem;
        height: 3.5rem;
        font-size: 1.8rem;
        top: 1rem;
        right: 1rem;
    }
}