@import "https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@300;400;500;600;700&family=Inter:wght@100;300;400;500;600;700;800;900&display=swap";
@import "bootstrap.min.css";
@import "plugins/fontawesome.min.css";
@import "plugins/nice-select.css";
@import "plugins/slick.min.css";
@import "plugins/odometer-min.css";
@import "plugins/remixicon-min.css";
@import "plugins/materialicons.css";
@import "plugins/animate.css";

:root{
    --body-font: "Inter", sans-serif;
    --head-font: "Chakra Petch", sans-serif;
    --danger-color: #ED5050;
    --success-color: #535C91;
    --warning-color: #EDCB50;
    --info-color: #3F7FCA;
    --gradient-one-color: linear-gradient(179.33deg, rgba(9, 146, 106, 0) 5%, #535C91 90%);
    --box-shadow-one: 0px 4px 4px rgba(19, 40, 34, 0.2);
    --p50: #e7fef7;
    --p75: #9cf9dd;
    --p100: #73f6cf;
    --p200: #37f3bb;
    --p300: #9290C3;
    --p400: #0aa879;
    --p500: #535C91;
    --s50: #e9ebfd;
    --s75: #a6abf8;
    --s100: #8188f5;
    --s200: #4b55f0;
    --s300: #2632ed;
    --s400: #1b23a6;
    --s500: #171f91;
    --n0: #ffffff;
    --n10: #fafafb;
    --n20: #f6f6f6;
    --n30: #ecedee;
    --n40: #e1e1e3;
    --n50: #c5c5ca;
    --n60: #b7b7bd;
    --n70: #abacb2;
    --n80: #9d9ea5;
    --n90: #8f9098;
    --n100: #81828b;
    --n200: #73747f;
    --n300: #656772;
    --n400: #5a5b67;
    --n500: #4c4d5a;
    --n600: #404250;
    --n700: #303141;
    --n800: #222434;
    --n900: #161829;
    --pL50: #e6eeeb;
    --pL75: #99b8af;
    --pL100: #6e9a8d;
    --pL200: #306f5c;
    --pL300: #05513b;
    --pL400: #043929;
    --pL500: #033124;
    --sL50: #e7e8f8;
    --sL75: #9da1e4;
    --sL100: #747ad9;
    --sL200: #3841c8;
    --sL300: #0f1abd;
    --sL400: #0b1284;
    --sL500: #091073
}
.collapsing{
    transition:.3s
}
html{
    scroll-behavior:smooth
}
body{
    font-family:var(--body-font);
    background-color:var(--n900);
    font-size:18px;
    line-height:30px;
    padding:0;
    margin:0;
    font-weight:400;
    overflow-x:hidden;
    position:relative
}
section,footer{
    overflow-x:hidden
}
h1,h1>a,h2,h2>a,h3,h3>a,h4,h4>a,h5,h5>a,h6,h6>a,.display-one,.display-two,.display-three,.display-four,.display-five,.display-six,.heading,.heading-one,.heading-two,.heading-three,.heading-four,.heading-five,.heading-six{
    font-family:var(--head-font);
    color:var(--n0);
    font-weight:700;
    padding:0;
    margin:0;
    display:block;
    text-transform:capitalize;
    transition:all .3s
}
h1 span,h1>a span,h2 span,h2>a span,h3 span,h3>a span,h4 span,h4>a span,h5 span,h5>a span,h6 span,h6>a span,.display-one span,.display-two span,.display-three span,.display-four span,.display-five span,.display-six span,.heading span,.heading-one span,.heading-two span,.heading-three span,.heading-four span,.heading-five span,.heading-six span{
    font-size:inherit;
    font-family:inherit;
    color:var(--p300);
    line-height:inherit;
    font-weight:inherit
}
a{
    text-decoration:none;
    outline:none;
    color:var(--n50);
    transition:.3s
}
a:focus,a:hover{
    text-decoration:none;
    outline:none;
    color:var(--n0)
}
.feature-tag{
    position:relative;
    background-color:var(--p300);
    color:var(--n800);
    text-transform:uppercase;
    font-weight:600;
    width:80px;
    height:120px;
    top:0;
    z-index:1;
    -webkit-clip-path:polygon(0 0, 100% 0%, 100% 100%, 50% 75%, 0 100%);
    clip-path:polygon(0 0, 100% 0%, 100% 100%, 50% 75%, 0 100%)
}
.circle-text{
    width:225px;
    height:225px;
    border-radius:50%;
    background-color:var(--p300);
    border:1px solid var(--p400);
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    border-radius:50%
}
.circle-text .text{
    animation:rotate 50s linear infinite;
    width:100%;
    height:100%;
    position:absolute
}
.circle-text .text p{
    transform:translate(50%, 15px)
}
.circle-text .text span{
    position:absolute;
    color:var(--n800);
    font-weight:600;
    font-size:18px;
    transform-origin:0 100px
}
.circle-text .box-style.btn-box-second{
    background-color:var(--n0);
    border:1px solid var(--p400);
    width:140px;
    height:140px
}
.circle-text .box-style.btn-box-second i{
    color:var(--p300)
}
.box-style{
    position:relative;
    overflow:hidden;
    display:flex;
    height:170px;
    width:170px;
    font-weight:600;
    transition:all .3s;
    z-index:0;
    border-radius:50%
}
.box-style:hover{
    color:var(--n700)
}
.box-style:hover::before{
    width:300%;
    height:300%
}
.box-style::before{
    content:"";
    position:absolute;
    top:var(--y);
    left:var(--x);
    transform:translate(-50%, -50%);
    width:0;
    height:0;
    border-radius:100%;
    background-color:var(--p300);
    transition:all .7s ease;
    z-index:-1
}
.box-style.btn-box{
    padding:13px 25px;
    display:inline-flex;
    background-color:var(--p300);
    width:initial;
    height:initial;
    font-weight:600;
    border-radius:16px
}
.box-style.btn-box:hover{
    color:var(--n0)
}
.box-style.btn-box:hover:before{
    border-radius:15px;
    background-color:var(--p500)
}
.box-style.btn-box-second{
    height:110px;
    width:110px;
    background-color:var(--p300);
    color:var(--n800)
}
.box-style.btn-box-second:hover{
    color:var(--n0)
}
.box-style.btn-box-second:hover:before{
    background-color:var(--p500)
}
.box-style.btn-box-third{
    padding:13px 25px;
    display:inline-flex;
    background-color:rgba(0,0,0,0);
    border:1px solid var(--p300);
    width:initial;
    height:initial;
    font-weight:600;
    border-radius:16px;
    color:var(--n0)
}
.box-style.btn-box-third:hover{
    border-color:rgba(0,0,0,0)
}
.box-style.btn-box-third:hover:before{
    border-radius:15px;
    background-color:var(--p500)
}
.box-style.box-first{
    width:initial;
    height:initial;
    flex-direction:column;
    border-radius:0;
    background-color:rgba(0,0,0,0)
}
.box-style.box-first:before{
    background-color:rgba(0,0,0,0)
}
.box-style.box-first:hover:before{
    background-color:var(--n700);
    border-radius:0
}
.box-style.box-second{
    width:initial;
    height:initial;
    border-top:1px solid var(--n700);
    border-bottom:1px solid var(--n700);
    border-radius:0;
    background-color:rgba(0,0,0,0)
}
.box-style.box-second:before{
    background-color:rgba(0,0,0,0)
}
.box-style.box-second:hover{
    border-color:rgba(0,0,0,0)
}
.box-style.box-second:hover:before{
    background-color:var(--n800);
    border-radius:12px
}
.social-area a{
    width:30px;
    height:30px;
    border:1px solid var(--n500);
    border-radius:15px;
    transition:.3s all
}
.social-area a i{
    color:var(--p300)
}
.social-area a:hover{
    background-color:var(--p400)
}
.social-area a:hover i{
    color:var(--n0)
}
.btn-base{
    color:var(--p300);
    border:2px solid var(--n0);
    line-height:53px;
    line-height:55px;
    padding:0 38px;
    border-radius:0;
    overflow:hidden;
    position:relative;
    transition:all .5s ease;
    font-weight:500;
    border-radius:4px;
    z-index:0;
    overflow:hidden
}
.btn-base::after{
    background:var(--p300);
    border-radius:4px;
    content:"";
    display:block;
    height:100%;
    width:100%;
    position:absolute;
    left:0;
    top:0;
    transform:translate(-100%, 0) rotate(10deg);
    transform-origin:top left;
    transition:.2s transform ease-out;
    will-change:transform;
    z-index:-1
}
.btn-base:hover,.btn-base:focus{
    border-color:rgba(0,0,0,0);
    overflow:hidden;
    color:#fff;
    transform:scale(1.05);
    will-change:transform
}
.btn-base:hover:after,.btn-base:focus:after{
    height:100%;
    width:135%;
    transform:translate(0, 0)
}
.mouse-follower{
    z-index:10
}
.mouse-follower span{
    z-index:10;
    opacity:1;
    top:-10px;
    left:-10px;
    transform:translate(-50%, -50%);
    border-radius:50%;
    position:fixed;
    transition:100ms ease-in-out;
    pointer-events:none
}
.mouse-follower .cursor-outline{
    height:30px;
    width:30px;
    border:1px solid var(--p300)
}
.mouse-follower .cursor-dot{
    height:6px;
    width:6px;
    background:var(--p300)
}
.mouse-follower.hide-cursor span{
    border-color:rgba(0,0,0,0);
    background:rgba(0,0,0,0)
}
img{
    max-width:100%;
    height:auto
}
.max-un{
    max-width:unset
}
.d-rtl{
    direction:rtl
}
ul,ol{
    padding:0;
    margin:0;
    list-style:none
}
ul li,ol li{
    font-size:inherit
}
button{
    border:none;
    cursor:pointer;
    font-size:16px;
    line-height:24px;
    padding:0;
    background-color:rgba(0,0,0,0)
}
.tabcontents{
    position:relative
}
.tabcontents .tabitem{
    transform:translateY(100px);
    position:absolute;
    z-index:-1;
    top:0;
    width:100%;
    opacity:0;
    transition:.8s all
}
.tabcontents .tabitem.active{
    position:initial;
    z-index:1;
    opacity:1;
    transform:translateY(0)
}
.single-input{
    margin-bottom:16px
}

input,textarea{
    padding:15px 20px;
    color:var(--n0);
    width:100%;
    font-family:var(--body-font);
    outline-color:rgba(0,0,0,0);
    border-radius:10px;
    font-size:16px;
    background-color:inherit;
    border:1px solid var(--n500)
}
input::-moz-placeholder, textarea::-moz-placeholder{
    color:var(--n500);
    font-size:16px
}
input::placeholder,textarea::placeholder{
    color:var(--n500);
    font-size:16px
}
input:focus,textarea:focus{
    outline:none;
    box-shadow:none;
    border:1px solid var(--p300)
}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0
}
input[type=number]{
    -moz-appearance:textfield
}
input[type=checkbox]{
    width:initial;
    height:initial
}
select{
    padding:10px 20px;
    border:none;
    cursor:pointer;
    outline:none
}
span{
    display:inline-block
}
.table thead th,.table td,.table th{
    border:none
}
.b-none{
    border:none !important
}
.ovf-unset{
    overflow-x:unset !important
}
iframe{
    border:0;
    width:100%
}
.shadow-none{
    box-shadow:none
}
.display-one{
    font-size:80px;
    line-height:96.8px
}
.display-two{
    font-size:72px;
    line-height:86.4px
}
.display-three{
    font-size:64px;
    line-height:76.8px
}
.display-four{
    font-size:56px;
    line-height:67.2px
}
.display-five{
    font-size:48px;
    line-height:46.4px
}
.display-six{
    font-size:42px;
    line-height:54.6px
}
.fs-one,h1,h1>a{
    font-size:48px;
    line-height:57.6px
}
.fs-two,h2,h2>a{
    font-size:40px;
    line-height:48px
}
.fs-three,h3,h3>a{
    font-size:32px;
    line-height:38.4px
}
.fs-four,h4,h4>a{
    font-size:24px;
    line-height:31.2px
}
.fs-five,h5,h5>a{
    font-size:20px;
    line-height:26px
}
.fs-six,h6,h6>a{
    font-size:16px;
    line-height:20.8px
}
.fs-seven{
    font-size:14px;
    line-height:18.8px
}
table thead tr th{
    font-size:18px;
    line-height:30px
}
a,p,span,label,li{
    margin:0;
    font-family:var(--body-font);
    color:var(--n50);
    font-size:16px;
    font-weight:400;
    line-height:24px
}
.alt-bg a,.alt-bg p,.alt-bg span,.alt-bg h1,.alt-bg h2,.alt-bg h3,.alt-bg h4,.alt-bg h5,.alt-bg h6{
    color:var(--n800)
}
li{
    font-size:inherit
}
.d-center{
    display:flex;
    justify-content:center;
    align-items:center
}
.section-text{
    margin-bottom:32px
}
.section-header{
    margin-bottom:55px
}
.cus-mar{
    margin-bottom:-24px
}
.single-box{
    margin-bottom:24px
}
.sub-title{
    margin-bottom:16px
}
.title{
    margin-bottom:10px
}
.cus-z0{
    z-index:0
}
.cus-z1{
    z-index:1
}
.cus-z2{
    z-index:2
}
.pt-120{
    padding-top:120px
}
@media(max-width: 991px){
    .pt-120{
        padding-top:60px
    }
    .header-section{
        box-shadow:0px 3px 10px 0px rgba(0,0,0,.3)
    }
}
@media(max-width: 575px){
    .pt-120{
        padding-top:50px
    }
}
.pb-120{
    padding-bottom:120px
}
@media(max-width: 991px){
    .pb-120{
        padding-bottom:60px
    }
}
@media(max-width: 575px){
    .pb-120{
        padding-bottom:50px
    }
}
*::-webkit-scrollbar-track{
    background:var(--p300)
}
*::-webkit-scrollbar{
    width:6px
}
*::-webkit-scrollbar-button,*::-webkit-scrollbar-thumb{
    background:var(--p500)
}
.cus-scrollbar{
    overflow-y:auto;
    overflow-x:hidden;
    position:sticky;
    max-height:90vh;
    top:100px
}
.cus-scrollbar::-webkit-scrollbar-track{
    background:rgba(0,0,0,0)
}
.cus-scrollbar::-webkit-scrollbar{
    width:3px;
    background-color:rgba(0,0,0,0)
}
.cus-scrollbar::-webkit-scrollbar-button,.cus-scrollbar::-webkit-scrollbar-thumb{
    background-color:rgba(0,0,0,0)
}
.cus-scrollbar:hover::-webkit-scrollbar{
    width:3px
}
.cus-scrollbar:hover::-webkit-scrollbar-track{
    background:rgba(255,211,198,.5)
}
.cus-scrollbar:hover::-webkit-scrollbar-button,.cus-scrollbar:hover::-webkit-scrollbar-thumb{
    background:var(--p300)
}
.scrollToTop{
    position:fixed;
    bottom:0;
    right:30px;
    color:var(--p300);
    line-height:45px;
    font-size:20px;
    text-align:center;
    z-index:9;
    cursor:pointer;
    transition:all 1s;
    transform:translateY(100%)
}
.scrollToTop.active{
    bottom:120px;
    transform:translateY(0%) rotate(-90deg)
}
.scrollToTop::before{
    content:"";
    position:absolute;
    width:40px;
    height:1px;
    left:-50px;
    background:var(--p300)
}
.preloader{
    width:100%;
    height:100vh;
    background-color:var(--n800);
    position:fixed;
    display:flex;
    overflow:hidden;
    top:0;
    z-index:99999
}
.preloader .loader{
    width:48px;
    height:48px;
    border-radius:50%;
    position:relative;
    animation:rotate 1s linear infinite
}
.preloader .loader::before{
    content:"";
    box-sizing:border-box;
    position:absolute;
    inset:0px;
    border-radius:50%;
    border:5px solid var(--danger-color);
    animation:prixClipFix 2s linear infinite
}
.accordion-button:focus{
    box-shadow:none
}
.animated{
    animation-duration:1s;
    animation-fill-mode:both
}
.fadeInDown{
    animation-name:fadeInDown
}
.slick-arrow{
    position:absolute;
    outline:none;
    bottom:0;
    padding:0;
    width:50px;
    height:50px;
    border-radius:50%;
    background-color:rgba(0,0,0,0);
    border:1px solid var(--n700);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1
}
.slick-arrow:hover{
    border-color:var(--p300);
    box-shadow:var(--box-shadow-one)
}
.slick-arrow:hover i{
    color:var(--n900)
}
.slick-arrow i{
    color:var(--n0);
    font-size:24px;
    transition:.1s
}
.slick-arrow.arafat-prev{
    left:calc(50% - 60px);
    transform:rotate(180deg)
}
.slick-arrow.arafat-next{
    right:calc(50% - 60px)
}
.slick-arrow.top-right{
    bottom:initial;
    left:initial;
    top:-120px
}
.slick-arrow.top-right.arafat-prev{
    right:70px
}
.slick-arrow.top-right.arafat-next{
    right:0
}
.slick-arrow.bottom-right{
    width:35px;
    height:35px;
    bottom:32px;
    border-color:var(--p300)
}
.slick-arrow.bottom-right.arafat-prev{
    left:initial;
    right:84px
}
.slick-arrow.bottom-right.arafat-next{
    right:32px
}
.slick-arrow.bottom-right:hover i{
    color:var(--n0)
}
@keyframes progressBar{
    0%{
        width:0
    }
    100%{
        width:100%
    }
}
.slick-double-dots{
    display:flex;
    justify-content:end;
    align-items:center;
    bottom:33px;
    position:absolute;
    width:calc(100% - 100px);
    right:40px
}
.slick-double-dots .totalString{
    position:absolute;
    right:-20px
}
.slick-double-dots li{
    margin:0 10px;
    display:flex;
    align-items:center;
    justify-content:center
}
.slick-double-dots li::before{
    content:"";
    position:absolute;
    width:3px;
    height:3px;
    border-radius:10px;
    border:1px solid var(--n50);
    z-index:2;
    transition:.3s
}
.slick-double-dots li::after{
    content:"";
    position:absolute;
    width:10px;
    height:10px;
    border-radius:50%;
    border:1px solid rgba(0,0,0,0);
    z-index:2;
    transition:.3s
}
.slick-double-dots li.slick-active::before{
    background-color:var(--p300);
    border-color:rgba(0,0,0,0);
    z-index:5
}
.slick-double-dots li.slick-active::after{
    border-color:var(--p300)
}
.slick-double-dots .progressBar{
    position:absolute;
    width:100%;
    display:flex;
    align-items:center;
    max-width:80px;
    left:0
}
.slick-double-dots .progressBar::before{
    content:"";
    background-color:var(--n0);
    height:1px;
    position:absolute;
    width:100%;
    z-index:4
}
.slick-double-dots .progressBar .string{
    position:absolute;
    opacity:0;
    left:-20px
}
.slick-double-dots .progressBar span{
    font-size:inherit
}
.slick-double-dots .slick-active .string{
    opacity:1
}
.slick-double-dots .slick-active .progressBar::after{
    content:"";
    background-color:var(--p300);
    height:1px;
    position:absolute;
    width:100%;
    animation:progressBar 2s ease-in-out;
    z-index:5
}

.input-area{
    border-radius:10px;
    background-color:rgba(0,0,0,0);
    border:1px solid var(--n600)
}
.input-area:focus-within{
    outline:1px solid var(--p300);
    border-color:rgba(0,0,0,0)
}
.input-area.second{
    padding:6px 10px;
    background-color:rgba(0,0,0,0);
    border:1px solid var(--n500)
}
.input-area.second input{
    font-size:16px
}
.input-area input,.input-area textarea{
    border-radius:0;
    padding:0;
    padding-right:15px;
    border:none;
    background:rgba(0,0,0,0)
}
@keyframes rotate{
    100%{
        transform:rotate(360deg)
    }
}
@keyframes prixClipFix{
    0%{
        -webkit-clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);
        clip-path:polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)
    }
    25%{
        -webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);
        clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)
    }
    50%{
        -webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
        clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)
    }
    75%{
        -webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);
        clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)
    }
    100%{
        -webkit-clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
        clip-path:polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)
    }
}
@keyframes leftToRight{
    0%{
        transform:rotateY(0deg)
    }
    100%{
        transform:rotateY(360deg)
    }
}
@keyframes fadeInDown{
    from{
        opacity:0;
        transform:translate3d(0, -100%, 0)
    }
    to{
        opacity:1;
        transform:none
    }
}
@keyframes fadeInOut{
    0%{
        transform:scale(0.9)
    }
    50%{
        transform:scale(1)
    }
    100%{
        transform:scale(0.9)
    }
}
@keyframes loading{
    0%{
        transform:rotate(0deg)
    }
    100%{
        transform:rotate(180deg)
    }
}
@keyframes rotation{
    100%{
        transform:rotatey(360deg)
    }
}
@keyframes spin{
    from{
        transform:rotate(0deg)
    }
    to{
        transform:rotate(360deg)
    }
}
@keyframes ripple2Ani{
    0%{
        transform:translate(0px, 0px)
    }
    33%{
        transform:translate(-5px, -5px)
    }
    66%{
        transform:translate(5px, 5px)
    }
    100%{
        transform:translate(0px, 0px)
    }
}
@keyframes stretch{
    0%{
        transform:scale(0.8, 0.8)
    }
    50%{
        transform:scale(1.1, 1.1)
    }
    100%{
        transform:scale(0.8, 0.8)
    }
}
@keyframes rippleAni{
    0%{
        transform:translate(0px, 0px)
    }
    33%{
        transform:translate(5px, -5px)
    }
    66%{
        transform:translate(-5px, 5px)
    }
    100%{
        transform:translate(0px, 0px)
    }
}
@keyframes rippleAni{
    0%{
        transform:translate(0px, 0px)
    }
    33%{
        transform:translate(5px, -5px)
    }
    66%{
        transform:translate(-5px, 5px)
    }
    100%{
        transform:translate(0px, 0px)
    }
}
@keyframes MoveUpDown{
    0%{
        transform:skew(-17deg) translateY(0)
    }
    100%{
        transform:skew(-17deg) translateY(100%)
    }
}
@keyframes MoveDownUp{
    100%{
        transform:skew(-17deg) translateY(0)
    }
    0%{
        transform:skew(-17deg) translateY(100%)
    }
}
.header-section{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
    background:linear-gradient(153.32deg, rgba(255, 255, 255, 0.3) -65.62%, rgba(255, 255, 255, 0.1) 83.28%);
    box-shadow:0px 4px 24px -1px rgba(0,0,0,.2);
    -webkit-backdrop-filter:blur(15px);
    backdrop-filter:blur(15px)
}
.header-section.header-fixed{
    top:0;
    left:0;
    width:100%;
    z-index:999;
    border-color:rgba(0,0,0,0)
}
.header-section .navbar-toggler{
    padding-right:0;
    display:none;
    border:none
}
.header-section .navbar-toggler:focus{
    box-shadow:none
}
.header-section .navbar-toggler i{
    color:var(--p300)
}
.header-section .navbar{
    position:relative
}
.header-section .navbar::before{
    position:absolute;
    content:"";
    background:#161829;
    opacity:.4;
    width:100%;
    height:100%;
    opacity:.4;
    z-index:-1
}
.header-section .navbar .navbar-nav ul{
    padding:10px 0
}
.header-section .navbar .navbar-nav li{
    padding:5px 0
}
.header-section .navbar .navbar-nav a,.header-section .navbar .navbar-nav button{
    text-transform:capitalize;
    font-weight:600;
    background-color:rgba(0,0,0,0);
    color:var(--bs-white);
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.3s
}
.header-section .navbar .navbar-nav a::before,.header-section .navbar .navbar-nav button::before{
    position:absolute;
    content:"";
    transform:rotate(0deg);
    transition:.3s;
    opacity:0;
    background-color:var(--p300);
    width:30px;
    height:1px
}
.header-section .navbar .navbar-nav a.active,.header-section .navbar .navbar-nav a:hover,.header-section .navbar .navbar-nav button.active,.header-section .navbar .navbar-nav button:hover{
    color:var(--p300)
}
.header-section .navbar .navbar-nav a.active::before,.header-section .navbar .navbar-nav a:hover::before,.header-section .navbar .navbar-nav button.active::before,.header-section .navbar .navbar-nav button:hover::before{
    transform:rotate(-50deg);
    opacity:1;
    transition:.3s
}
.header-section .navbar .navbar-nav .dropdown-menu a,.header-section .navbar .navbar-nav .dropdown-menu button{
    display:initial
}
.header-section .navbar .navbar-nav .dropdown-menu a:hover,.header-section .navbar .navbar-nav .dropdown-menu button:hover{
    letter-spacing:1px;
    transition:.5s
}
.header-section .navbar .navbar-nav .dropdown-menu a::after,.header-section .navbar .navbar-nav .dropdown-menu button::after{
    right:initial
}
.header-section .navbar .navbar-nav .dropdown-menu a::before,.header-section .navbar .navbar-nav .dropdown-menu button::before{
    display:none
}
.header-section .navbar .dropdown-toggle{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    z-index:1
}
.header-section .navbar .dropdown-toggle::after{
    position:absolute;
    content:"";
    border:none;
    font-family:"FontAwesome";
    font-weight:400;
    transform:rotate(90deg);
    font-size:14px;
    right:-10px;
    z-index:-1
}
.header-section .navbar .dropdown-menu{
    padding-right:20px;
    transition:all .5s;
    transform:translateY(50px) translateX(0)
}
.header-section .navbar .dropdown-menu button,.header-section .navbar .dropdown-menu a{
    padding:0 10px
}
.header-section .navbar .dropdown-menu,.header-section .navbar .sub-menu{
    -webkit-backdrop-filter:blur(25px);
    backdrop-filter:blur(25px);
    background:linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 100%);
    box-shadow:0px 4px 24px 1px rgba(35,16,94,.25);
    display:block;
    opacity:0;
    visibility:hidden
}
.header-section .navbar .navbar-toggler:focus{
    outline:0;
    box-shadow:none
}
.header-section .navbar .show-dropdown{
    margin-right:15px
}
.header-section .navbar .show-dropdown:hover .dropdown-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0) translateX(0)
}
.header-section .navbar .sub-dropdown{
    position:relative
}
.header-section .navbar .sub-dropdown:hover .sub-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(-5px) translateX(0)
}
.header-section .navbar .sub-dropdown .dropdown-toggle::after{
    transform:rotate(0deg)
}
.header-section .navbar .sub-dropdown .sub-menu{
    position:absolute;
    left:150px;
    top:0;
    z-index:1;
    transition:all .5s
}
.header-section .navbar .sub-dropdown .sub-menu a{
    font-weight:500
}
@media(max-width: 1199px){
    .header-section .navbar .navbar-toggler{
        display:inline-block
    }
    .header-section .navbar .navbar-brand img{
        max-width:initial
    }
    .header-section .navbar .navbar-collapse .navbar-nav{
        max-height:250px;
        margin:20px 0;
        overflow-y:auto;
        margin-bottom:10px;
        overflow-x:hidden
    }
    .header-section .navbar .navbar-collapse .navbar-nav a,.header-section .navbar .navbar-collapse .navbar-nav button{
        justify-content:start
    }
    .header-section .navbar .dropdown-menu{
        -moz-column-count:1;
        column-count:1
    }
    .header-section .navbar .sub-dropdown .sub-menu{
        position:initial;
        transition:initial
    }
    .header-section .navbar .dropdown-menu,.header-section .navbar .sub-menu{
        opacity:initial;
        visibility:initial;
        transition:initial;
        display:none
    }
    .header-section .navbar .dropdown-menu{
        transform:initial;
        transition:initial;
        display:none
    }
    .header-section .navbar .dropdown-toggle::after{
        z-index:0
    }
    .header-section .navbar .dropend{
        margin-left:18px
    }
    .header-section .navbar .navbar-collapse .right-area{
        margin-left:0
    }
}
.header-section .contact-info i{
    color:var(--n0)
}
.header-section.header-menu{
    z-index:999;
    overflow:unset
}
.header-section.header-menu .cmn-head{
    cursor:pointer
}
.header-section.header-menu .cmn-head .icon-area{
    width:32px;
    height:32px;
    border:1px solid var(--n700);
    border-radius:30px
}
.header-section.header-menu .cmn-head .icon-area i{
    color:var(--n0)
}
.header-section.header-menu .cmn-head .icon-area .abs-area{
    right:initial;
    top:-4px;
    left:-4px
}
.header-section.header-menu .single-item{
    position:relative
}
.header-section.header-menu .single-item.active .main-area{
    opacity:1;
    visibility:visible;
    transform:translateY(0px)
}
.header-section.header-menu .single-item .main-area{
    position:absolute;
    top:50px;
    white-space:nowrap;
    right:0;
    transform:translateY(150px);
    background-color:var(--n700);
    border:1px solid var(--n500);
    border-radius:10px;
    opacity:0;
    transition:.3s;
    visibility:hidden;
    overflow-x:auto;
    min-width:300px;
    max-height:70vh
}
.header-section.header-menu .single-item .avatar .avatar-img{
    border-radius:15px
}
.header-section.header-menu .single-item.profile-area ul a{
    display:flex;
    align-items:center;
    gap:8px;
    margin:16px 0
}
.header-section.header-menu .single-item.profile-area ul li:last-child{
    border-top:1px solid var(--n500);
    border-bottom:1px solid var(--n500)
}
.header-section.header-menu .single-item.cart-area{
    padding-left:200px
}
.header-section.header-menu .single-item.cart-area .close-btn{
    right:15px;
    top:15px;
    color:var(--n0)
}
.header-section.header-menu .single-item.cart-area .nav-items-wrapper{
    position:fixed;
    top:0px;
    right:0px;
    bottom:0px;
    width:100%;
    max-width:500px;
    min-height:100vh;
    overflow-y:auto;
    background:var(--n800);
    box-shadow:0px 7px 16px -2px rgba(88,82,129,.12);
    -webkit-backdrop-filter:blur(22.5px);
    backdrop-filter:blur(22.5px);
    z-index:999;
    transform:translateX(100%);
    transition:all 1.3s
}
.header-section.header-menu .single-item.cart-area.active .nav-items-wrapper{
    transform:translateX(0)
}
.header-section.header-menu .single-item.cart-area .single-box{
    border:1px solid var(--n500);
    border-radius:5px
}
.header-section.header-menu .single-item.cart-area .end-area{
    color:var(--n0)
}
.header-section.header-menu .single-item.cart-area .icon-box img{
    max-width:90px;
    min-width:90px
}
.header-section.header-menu .single-item.cart-area .footer-area .second-btn{
    background-color:var(--n700);
    color:var(--n0)
}
.header-section.header-menu .single-item.cart-area .qtySelector{
    border-radius:10px
}
.header-section.header-menu .single-item.cart-area .qtySelector i{
    cursor:pointer;
    color:var(--n0);
    min-width:32px;
    min-height:32px;
    border-radius:50%;
    background-color:var(--n100)
}
.header-section.header-menu .single-item.cart-area .qtySelector .qtyValue{
    border:none;
    padding:5px;
    width:50px;
    background:rgba(0,0,0,0);
    font-weight:bold;
    color:var(--n0)
}

.footer-section .social-items{
    background:var(--n700)
}
.footer-section .social-items li{
    width:100%;
    padding-top:24px;
    padding-bottom:24px;
    border-right:1px solid var(--n900)
}
.footer-section .location-area .icon-box{
    width:60px;
    height:60px;
    background:var(--n700);
    border-radius:30px
}
.footer-section .location-area i{
    color:var(--p300)
}
.footer-section .brand-area{
    color:var(--n0);
    font-weight:600;
    letter-spacing:.17em;
    text-transform:uppercase
}
.footer-section .form-group{
    border:1px solid var(--n600);
    border-radius:16px
}
.footer-section .content-right{
    background-color:var(--n800)
}
.footer-section .footer-bottom{
    background-color:var(--n900)
}
.footer-section .footer-bottom p a{
    color:var(--p300)
}
.footer-section .contact-location .icon-area{
    min-width:60px;
    height:60px;
    background:var(--n700);
    border-radius:30px
}
.footer-section .contact-location .icon-area i{
    color:var(--p300)
}
.footer-section .footer-wrapper{
    background:var(--n800)
}
.footer-section .links li a{
    position:relative
}
.footer-section .links li a::before{
    content:"chevron_right";
    font-family:"Material Symbols Outlined";
    z-index:1;
    position:absolute;
    left:-20px;
    font-size:16px;
    width:initial;
    height:initial;
    background-image:none;
    transition:.3s all
}
.footer-section .links li a:hover{
    padding-left:15px;
    transition:.3s all
}
.footer-section .links li a:hover::before{
    left:0
}
.footer-section.index-two{
    position:relative;
    background-image:url(../images/abs-items/footer-ellipse-2.png);
    background-position:top 65px center
}
.footer-section .form-contact{
    background:var(--p500);
    border-radius:16px
}
.footer-section .form-contact .input-area{
    border:1px solid var(--n30)
}
.footer-section .get-start a{
    color:var(--p300);
    text-decoration:underline
}
.footer-section .footer-bottom{
    background:var(--n700);
    border-radius:32px 32px 0px 0px
}
.box-items{
    z-index:-1;
    top:-35px
}
.box-items .single-item{
    width:145px;
    height:149px;
    border:1px solid var(--n700);
    transition:.3s all
}
.box-items .single-item.active-item{
    background:var(--p500)
}
.box-items .single-item:hover{
    background:var(--p500);
    opacity:.3
}
.about-block .counter-item{
    position:relative
}
.about-block .counter-item::before{
    position:absolute;
    content:"";
    background-color:var(--p300);
    width:86px;
    height:1px;
    bottom:0
}
.about-block .fs-three span,.about-block .display-four span{
    color:var(--n0)
}
.about-block .experience{
    border:1px solid var(--p300)
}
.about-block .experience .experience-wrap{
    background-color:var(--p300)
}
.about-block .experience .experience-wrap .display-four span{
    color:var(--n800)
}
.about-block .experience .experience-wrap span{
    color:var(--n800)
}
.about-block .experience.second{
    border-color:var(--s200)
}
.about-block .experience.second .experience-wrap{
    background-color:var(--s200)
}
.about-block .experience.second .experience-wrap .display-four span{
    color:var(--n0)
}
.about-block .experience.second .experience-wrap span{
    color:var(--n0)
}
.about-block .symbol{
    color:var(--p300)
}
.about-block.index-two .sec-img img{
    border-radius:50%
}
.about-block .shape-area img{
    position:absolute;
    animation:rotate 35s linear infinite
}
.about-block .shape-area img.shape-1{
    top:15%;
    left:5%
}
.about-block .shape-area img.shape-2{
    bottom:15%;
    right:5%
}
.about-block.index-three .fs-five{
    color:var(--n0)
}
.about-block.index-three .icon-box{
    min-width:60px;
    height:60px;
    background:var(--p500);
    border-radius:40px
}
.about-block.index-three .icon-box i{
    color:var(--n0)
}
.counter-section .single-box.active-area:before{
    transform:translate(-50%, -50%);
    z-index:-1;
    background-color:var(--n700);
    width:100%;
    height:100%;
    top:0;
    bottom:0;
    right:0;
    left:0;
    transform:translate(0%, 0%);
    border-radius:0
}
.counter-section .single-box p{
    color:var(--n0);
    font-weight:400
}
.counter-section .display-one,.counter-section span{
    color:var(--n800)
}
.counter-section.index-two .single-box{
    background:var(--n800);
    border-radius:16px
}
.counter-section.index-two .fs-two,.counter-section.index-two span{
    color:var(--n0)
}
.counter-section.index-two .icon-box{
    width:60px;
    height:60px;
    background:var(--p500);
    border-radius:40px
}
.counter-section.index-two .icon-box i{
    color:var(--n0)
}
.testimonials{
    position:relative
}
.testimonials::before{
    content:"";
    position:absolute;
    width:100%;
    height:100%;
    opacity:.2;
    background-image:url(../images/testimonial-bg.png);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center bottom
}
.testimonials .single-slider{
    background-color:var(--n800);
    border:8px solid var(--p500);
    border-bottom:none
}
.testimonials .single-slider .img-box img{
    border-radius:50%
}
.testimonials .single-slider i{
    color:var(--warning-color)
}
.testimonials .single-slider .location{
    color:var(--p300);
    border-right:1px solid var(--n70)
}
.testimonials .string{
    color:var(--p300)
}
.testimonials .slick-double-dots li::before,.testimonials .slick-double-dots li::after{
    opacity:0
}
.call-to-action{
    background-image:url(../images/call-to-action-object.png),url(../images/call-to-action-object-2.png);
    background-position:center left,center right;
    background-repeat:no-repeat
}
.call-to-action .sec-img .img-outline{
    animation:fadeInOut 5s linear infinite
}
@keyframes videoTwo{
    0%{
        transform:translate(-50%, -50%) scale(2.3);
        opacity:1
    }
    100%{
        transform:translate(-50%, -50%) scale(5);
        opacity:0
    }
}
.call-to-action .video-bg span{
    position:absolute;
    display:block;
    border-radius:50%;
    width:110px;
    height:110px;
    z-index:-1
}
.call-to-action .video-bg span:nth-child(1)::before{
    animation-delay:5s
}
.call-to-action .video-bg span::after,.call-to-action .video-bg span::before{
    position:absolute;
    content:"";
    width:100%;
    height:100%;
    border-radius:50%;
    border:1px solid var(--p300);
    animation:videoTwo 8s linear infinite
}
.call-to-action .video-bg span:nth-child(1)::after{
    animation-delay:1s
}
.call-to-action .video-bg span:nth-child(2)::before{
    animation-delay:6s
}
.call-to-action .video-bg span:nth-child(2)::after{
    animation-delay:2s
}
.call-to-action .video-bg span:nth-child(3)::before{
    animation-delay:7s
}
.call-to-action .video-bg span:nth-child(3)::after{
    animation-delay:3s
}
.call-to-action .video-bg span:nth-child(4)::after{
    animation-delay:4s
}
.call-to-action .contact-box{
    background-color:var(--n800);
    border-radius:16px
}
.call-to-action .contact-box i,.call-to-action .contact-box span{
    color:var(--p300)
}
.call-to-action.index-two{
    background-image:url(../images/call-to-action-bg.gif);
    background-size:cover
}
.call-to-action.index-two .box-style{
    border:1px solid var(--n40)
}
.call-to-action .about{
    background-color:var(--p300)
}
.call-to-action .about .box-style{
    background-color:var(--n800);
    color:var(--n0)
}
.call-to-action .about .video-bg span::after,.call-to-action .about .video-bg span::before{
    border:1px solid var(--n800)
}
.map-section iframe{
    height:300px
}
.faqs-section{
    background-color:var(--n800)
}
.faqs-section .accordion-item{
    border:none;
    background:var(--n700)
}
.faqs-section .accordion-header,.faqs-section .accordion-collapse{
    background:var(--n700)
}
.faqs-section .shape-area img{
    position:absolute;
    animation:rotate 35s linear infinite
}
.faqs-section .shape-area .shape-1{
    right:8%;
    top:10%
}
.faqs-section .shape-area .shape-2{
    bottom:10%;
    left:4%
}
.faqs-section .accordion-button{
    color:var(--p300);
    font-size:inherit;
    font-weight:inherit;
    gap:16px;
    box-shadow:none;
    background:var(--n700);
    padding-right:15%
}
.faqs-section .accordion-button::after{
    content:"remove";
    font-family:"Material Symbols Outlined";
    z-index:1;
    position:absolute;
    right:20px;
    font-size:16px;
    width:initial;
    height:initial;
    background-image:none
}
.faqs-section .accordion-button.collapsed{
    color:var(--n0)
}
.faqs-section .accordion-button.collapsed::after{
    content:"add"
}
.faqs-section .accordion{
    margin-top:-20px
}
.faqs-section .accordion .accordion-item{
    margin-top:20px;
    border-radius:10px;
    background-color:rgba(0,0,0,0)
}
.faqs-section .accordion-body{
    padding:20px;
    padding-right:10%;
    padding-top:0
}
.faqs-section .faq-bg{
    background-color:var(--n700)
}
.faqs-section.key-platforms .accordion-header,.faqs-section.key-platforms .accordion-body,.faqs-section.key-platforms .accordion-collapse,.faqs-section.key-platforms .accordion-button{
    background-color:rgba(0,0,0,0);
    padding-left:0;
    padding-right:0
}
.faqs-section.key-platforms .accordion-header:after,.faqs-section.key-platforms .accordion-body:after,.faqs-section.key-platforms .accordion-collapse:after,.faqs-section.key-platforms .accordion-button:after{
    right:0
}
.faqs-section.key-platforms .accordion-item{
    padding:24px 0;
    margin:0;
    border-bottom:1px solid var(--n300);
    border-radius:0;
    background-color:rgba(0,0,0,0)
}
.faqs-section.key-platforms .accordion-item:first-child{
    border-top:1px solid var(--n300)
}
.pagination{
    display:inline-flex
}
.pagination .page-item .page-link{
    border-radius:50%;
    background:var(--n800);
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--bs-white);
    border:none;
    font-weight:600;
    margin:0 8px
}
.pagination .page-item .page-link.active,.pagination .page-item .page-link:hover{
    background:var(--p300);
    color:var(--n900)
}
.pagination .page-item .page-link.previous{
    margin-right:20px
}
.pagination .page-item .page-link.next{
    margin-left:20px
}
.related-products .single-slide{
    margin:0 10px
}
.related-products .single-slide .single-box{
    border:none
}
.log-reg .modal-header{
    right:24px;
    top:-30px
}
.log-reg .modal-header .btn-close{
    background-image:none
}
.log-reg .modal-header i{
    color:var(--n0);
    font-weight:600
}
.log-reg .nav li{
    width:100%
}
.log-reg .nav .nav-link{
    background-color:var(--n700);
    width:100%;
    color:var(--n0);
    font-weight:600
}
.log-reg .nav .nav-link.active{
    background-color:var(--p300);
    color:var(--n800)
}
.log-reg .show-hide-pass{
    cursor:pointer;
    color:var(--n0)
}
.log-reg .checkbox span span{
    color:var(--p300)
}
.log-reg .modal{
    background:linear-gradient(180deg, rgba(0, 0, 0, 0.68) 0%, rgba(0, 0, 0, 0.4) 100%);
    box-shadow:0px 4px 24px 1px rgba(35,16,94,.25);
    -webkit-backdrop-filter:blur(22.5px);
    backdrop-filter:blur(22.5px)
}

@media(max-width: 1699px){
    .about-block .shape-area img.shape-2{
        right:0
    }
}