header,label.h {
    position: absolute
}

.bg-box,.btn,.service-image img,button {
    clip-path: polygon(1% 2%,3.5% 0.1%,8.9% 2.7%,16.2% 1.2%,19.7% 0.8%,24.7% 2%,31.2% 0%,35.9% 2.3%,40.6% 0.5%,47.1% 1.8%,49.9% 1%,53.8% 2.5%,62.2% 0.4%,67.3% 1.2%,70.3% 0.3%,75.8% 1.4%,78.5% 1.7%,84% 2.6%,91.1% 0.5%,93.6% 2.4%,97.3% 0.3%,98.9% 6%,98.1% 11.4%,98.6% 15.5%,97.3% 17.8%,97.7% 27.4%,98.3% 28.5%,99.7% 34.1%,98.8% 41.9%,98.3% 45.7%,98.4% 50.9%,98.7% 57.4%,99.6% 60.4%,99.4% 66.6%,99.2% 69.5%,97.4% 77.1%,98.1% 82.3%,99.9% 83.5%,98.2% 91.5%,99.3% 95.3%,98% 98.6%,93.6% 97.4%,90.3% 98.3%,86.8% 98.3%,78.6% 98.5%,76.4% 99.2%,69.7% 99.8%,64.2% 99.3%,61.8% 99.2%,57.2% 98.1%,48.7% 98.3%,46.8% 99%,39.6% 98.9%,33.8% 97.3%,28.2% 99.4%,27% 98.3%,22.1% 98.6%,13.1% 97.1%,8.7% 99.3%,2.7% 97.4%,2% 98.2%,2.1% 94.3%,0.7% 90.5%,0.9% 86.3%,2.2% 78.2%,0.4% 76.7%,1.2% 72.1%,2% 64%,1.4% 59.8%,0.4% 57.3%,0.3% 49.1%,2.9% 44.7%,1.9% 41.3%,0.8% 35.7%,2.9% 31.3%,0.8% 24.9%,2.7% 20.5%,0.8% 17.4%,2.5% 8.6%,1.1% 5.5%)
}

* {
    box-sizing: border-box
}

html {
    scroll-snap-type: y mandatory
}

body,html {
    scroll-behavior: smooth
}

html,select {
    scrollbar-width: thin
}

body,html,select {
    scrollbar-color: rgba(var(--clr-2),1) transparent
}

body,select {
    scrollbar-width: 8px
}

::-webkit-scrollbar {
    width: 8px
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-image: linear-gradient(rgba(var(--clr-2),1),rgba(var(--clr-2),1))
}

::selection {
    color: rgba(var(--clr-1),1);
    background: rgba(var(--dark-color),1)
}

::-moz-selection {
    color: rgba(var(--clr-1),1);
    background: rgba(var(--dark-color),1)
}

:after,:before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}

*,:after,:before,ul.c-list li:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

audio,img,video {
    max-width: 100%;
    height: auto
}

header {
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

footer,section {
    overflow-x: hidden;
    overflow-y: clip
}

body {
    margin: 0;
    right: 0;
    -webkit-transition: margin-left .3s ease-in-out;
    transition: margin-left .3s ease-in-out;
    -webkit-overflow-scrolling: touch;
    font-family: Rubik,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(var(--dark-color),1);
    background: rgba(var(--light-color),1);
    overflow-x: hidden
}

.bg-box,.cta,.drop-down-cont,.platform,.service-image {
    overflow: hidden
}

.heading,h1,h2,h3,h4,h5,h6 {
    font-style: normal;
    font-family: "Barlow Condensed",sans-serif;
    transition: .8s
}

.fw-700,b,strong {
    font-weight: 700
}

.fw-400 {
    font-weight: 400
}

.fw-500 {
    font-weight: 500
}

.fw-600 {
    font-weight: 600
}

.fw-800 {
    font-weight: 800
}

.btn,button {
    background: linear-gradient(45deg ,rgba(var(--clr-2)),rgba(var(--clr-Û²),1));
    background: rgba(var(--clr-1),1);
    border: none!important;
    text-transform: uppercase;
    padding: 10px 20px;
    border-radius: unset!important;
    transition-duration: .8s;
    font-size: inherit;
    font-weight: 500
}

.btn.active,.btn:active,.btn:focus,.btn:hover,button.active,button:active,button:focus,button:hover {
    color: rgba(var(--light-color),1)!important;
    background: linear-gradient(225deg,rgba(var(--clr-2),1),rgba(var(--clr-1),.9))!important;
    outline: 0
}

a,a.active,a:active,a:focus,a:hover {
    text-decoration: none;
    cursor: pointer;
    outline: 0!important
}

.btn,.clr-l,button {
    color: rgba(var(--light-color),1)!important
}

.bg-1,.sub-services button {
    background: rgba(var(--clr-1),1)
}

.bg-2 {
    padding: 0 5px
}

.bg-2,.btn-2 {
    background: rgba(var(--clr-2),1)
}

.bg-l,.form-control:focus,input:focus {
    background: rgba(var(--light-color),1)
}

.bg-1-l {
    background: rgba(var(--clr-1),.12)
}

.bg-d,.btn-3 {
    background: rgba(var(--dark-color),1)
}

.clr-1 {
    color: rgba(var(--clr-1),1)
}

.clr-2 {
    color: rgba(var(--clr-2),1)
}

.clr-3 {
    color: rgba(var(--clr-3),1)
}

.clr-4 {
    color: rgba(var(--clr-4),1)
}

.clr-5 {
    color: rgba(var(--clr-5),1)
}

.clr-grey {
    color: rgb(119 125 132)
}

a {
    color: inherit
}

a.active,a:active,a:focus,a:hover {
    color: rgba(var(--clr-1),1)
}

.form-group {
    filter: drop-shadow(0px 1px 6px rgba(0, 0, 0, .2))
}

.form-control,input,select,select input {
    background: rgba(var(--clr-2),1);
    color: inherit;
    border: unset!important;
    padding: 10px 20px;
    border-radius: 5px!important;
    box-shadow: unset!important;
    transition-duration: .8s;
    resize: none;
    height: auto;
    overflow: hidden
}

.bg,.bg-size {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.obj-ctn,.obj-cvr {
    height: 100%;
    width: 100%
}

.form-control:focus,input:focus {
    outline: 0;
    box-shadow: none;
    color: rgba(var(--dark-color),1);
    border: 1px solid rgba(var(--clr-1),1)!important
}

.form-control:focus::placeholder,input:focus::placeholder {
    color: rgba(var(--clr-2),1)
}

.form-control::placeholder,input::placeholder {
    color: rgba(var(--light-color),1);
    opacity: 1
}

input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input.phone,input[name=phone] {
    padding-left: 85px
}

input[type=checkbox],input[type=radio] {
    padding: 0
}

input[type=number] {
    -moz-appearance: textfield
}

label.h {
    opacity: 0;
    z-index: -999
}

.f-16,input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea {
    font-size: 16px
}

.iti {
    display: block!important;
    width: 100%!important
}

.iti--separate-dial-code .iti__selected-flag {
    background-color: rgba(var(--clr-2),.8);
    border-radius: 0
}

.iti input:focus .iti__selected-dial-code {
    color: rgba(var(--dark-color),1)!important
}

.bg {
    background-attachment: fixed
}

.obj-cvr {
    object-fit: cover
}

.obj-ctn {
    object-fit: contain
}

.overlay {
    background: linear-gradient(rgb(0 0 0 / 70%), rgb(255 243 243));
}

footer .overlay {
    background: linear-gradient(rgba(var(--light-color),1),rgba(var(--light-color),.8))
}

.cta .overlay {
    background: rgba(var(--clr-1),.9)
}

.f-90 {
    font-size: 90px
}

.f-80 {
    font-size: 80px
}

.f-60 {
    font-size: 60px
}

.f-55 {
    font-size: 55px
}

.f-48 {
    font-size: 48px
}

.f-40 {
    font-size: 40px
}

.f-30 {
    font-size: 30px
}

.f-26 {
    font-size: 26px
}

.f-24 {
    font-size: 24px
}

.f-22 {
    font-size: 22px
}

.f-20 {
    font-size: 20px
}

.f-18 {
    font-size: 18px
}

.f-14 {
    font-size: 14px
}

.f-12 {
    font-size: 12px
}

.slick-next:before,.slick-prev:before {
    color: rgba(var(--clr-2),1)
}

.nav-pills {
    padding: 50px 0!important
}

.slick-dots li button,.slick-next,.slick-next:focus,.slick-next:hover,.slick-prev,.slick-prev:focus,.slick-prev:hover {
    background: 0 0!important
}

.slick-next {
    right: -10px
}

.slick-prev {
    left: -20px;
    z-index: 9999
}

@supports (-moz-appearance: none) {
    SELECT {
        -moz-appearance:none!important;
        background: url(data:image/gif;base64,R0lGODlhBgAGAKEDAFVVVX9/f9TU1CgmNyH5BAEKAAMALAAAAAAGAAYAAAIODA4hCDKWxlhNvmCnGwUAOw==) right center no-repeat!important;
        background-position: calc(100% - 5px) center!important
    }
}

.cta {
    background: #231f20
}

.c-list li:before,.icon {
    background: rgba(var(--clr-1),1);
    color: rgba(var(--light-color),1);
    justify-content: center;
    display: flex
}

.c-list li,.cta {
    position: relative
}

.c-list li {
    padding: 10px 0 10px 35px
}

.c-list li:before {
    content: "\e903";
    position: absolute;
    left: 5px;
    align-items: center;
    border-radius: 100%;
    width: 25px;
    height: 25px;
    padding: 2px;
    font-size: 10px;
    font-family: icomoon
}

.icon {
    width: 40px;
    height: 40px;
    align-items: center;
    transition: .8s;
    border-radius: 50px
}

.icona:hover .icon {
    background: linear-gradient(225deg,rgba(var(--clr-2),1),rgba(var(--clr-1),.9))!important
}

img.logo {
    width: 100%;
    height: 100px
}

footer img.logo {
    height: 150px
}

.nav-icon,img.logo {
    object-fit: contain;
    object-position: left
}

.nav-icon {
    width: 30px;
    height: 30px;
    margin-right: 5px;
    filter: brightness(30.5);
}

.drop-down-cont {
    position: absolute;
    right: 0;
    width: 100%;
    max-height: 0;
    transition: max-height .4s ease-in-out;
    top: 80%;
    box-shadow: 0 55px 36px rgba(var(--dark-color),.4);
    z-index: 999;
    background-color: rgb(0 0 0);
    border-radius: 0 0 25px 25px;
    color: #000
}

.drop-down:hover .drop-down-cont {
    transition: max-height .8s ease-out;
    max-height: 140vh
}

.drop-down-cont ul li {
    margin-right: 0;
    display: block
}

.drop-down-cont ul li a {
    font-size: 14px!important
}

.drop-down-cont ul li a:hover .nav-icon {
    filter: invert(49%) sepia(59%) saturate(643%) hue-rotate(331deg) brightness(94%) contrast(83%)
}

.modal {
    z-index: 999999
}

button.btn-close {
    position: absolute;
    right: 0;
    top: -5px;
    opacity: 1;
    padding: 10px!important;
    background: red;
    z-index: 999999
}

.platform {
    height: 60px;
    width: 74%;
    margin: 0 auto
}

.platform img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center
}

.bg-box {
    height: 300px;
    position: relative;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.bg-box .overlay {
    height: 100%;
    width: 100%;
    background: linear-gradient(rgba(var(--clr-1),.8),rgba(var(--clr-2),.8));
    padding: 20px;
    transform: translateY(70%);
    transition-duration: .8s
}

.bg-box:hover .overlay {
    transform: translateY(0)
}

.bg-box p {
    opacity: 0
}

.bg-box:hover p {
    opacity: 1
}

.reviews .box {
    background: #26262a;
    padding: 20px;
    border: 1px solid #000
}

.reviews {
    background: #1f1f23;
    color: #a7a7ab
}

.reviews::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    background: url('../img/bg-test.webp') 0 0/100% no-repeat;
    max-width: 100%;
    width: 100%;
    z-index: -1;
    height: 100%;
    opacity: .3
}

.reviews-silder .slick-track {
    display: flex
}

.bdr-bfr::before {
    content: "";
    position: absolute;
    width: 200px;
    height: 8px;
    background: #004785;
    bottom: -8px;
    left: 0
}

.team-count-info {
    padding: 15px;
    border-radius: 20px;
    background: #fff6ec;
    display: flex;
    height: 100%
}

.service-image {
    width: 100%;
    height: 400px;
    filter: drop-shadow(0 0px 14px rgba(var(--dark-color), .3))
}

.service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.center-icon img {
    /* filter: brightness(0) saturate(100%) invert(77%) sepia(10%) saturate(3011%) hue-rotate(320deg) brightness(88%) contrast(83%); */
}

.seats-us-sec-box {
    border-radius: 8px;
    box-shadow: 1px 1px 10px 2px rgb(51 51 51 / .47);
    display: flex;
    justify-content: center;
    align-items: center;
    row-gap: 10px;
    flex-flow: column;
    height: 290px;
    padding: 15px 18px;
    margin: 0 10px
}

.box {
    background-position: bottom;
    z-index: 9;
    filter: drop-shadow(0 3px 4px rgba(var(--dark-color), .16));
    background-repeat: no-repeat;
    background-size: cover
}

.sub-ban-left,.sub-ban-right {
    position: absolute;
    bottom: 10%;
    width: 200px;
    height: 200px;
    object-fit: contain;
    z-index: -1
}

.sub-ban-left {
    left: 0;
    bottom: 5%;
    object-position: center left
}

.sub-ban-right {
    top: 10%;
    object-position: center right;
    right: 0
}

.top-tape {
    position: absolute;
    height: 14px;
    top: -7px;
    width: 20%;
    background-color: rgba(var(--clr-1),1);
    border-right: 1px dotted rgba(var(--clr-1),1);
    border-left: 1px dotted rgba(var(--clr-1),1);
    opacity: .8;
    transform: translateX(-50%) rotate(-3deg);
    right: 50%;
    left: 50%
}

@media screen and (max-width: 1399px) {
    .f-90 {
        font-size:80px
    }

    .f-60 {
        font-size: 50px
    }
}

@media screen and (max-width: 1199px) {
    .f-24 {
        font-size:20px
    }

    .f-90 {
        font-size: 64px
    }

    .f-30 {
        font-size: 24px
    }

    .f-40 {
        font-size: 35px
    }

    .f-55,.f-60 {
        font-size: 45px
    }
}

@media screen and (max-width: 991px) {
    .drop-down-cont,.nav-bar {
        color:rgba(var(--light-color),1)
    }

    .f-90 {
        font-size: 50px
    }

    .f-80 {
        font-size: 60px
    }

    .banner {
        background-position: 15% -60px
    }

    img.logo {
        object-position: center
    }

    .drop-down-cont {
        position: relative;
        height: auto;
        max-height: none;
        box-shadow: unset
    }

    .drop-down-cont,.nav-bar {
        background: rgba(var(--dark-color),1)
    }

    .nav-bar {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        transform: translateX(200%);
        z-index: 99999999;
        transition: .8s;
        padding-left: 20px;
        padding-right: 20px;
        overflow-y: scroll
    }

    .nav-bar.active {
        transform: translateX(0)
    }

    .nav-bar li {
        margin: 10px auto
    }

    .drop-down-cont li {
        margin: 5px 0!important
    }
}

@media screen and (max-width: 767px) {
    .f-55,.f-60,.f-90 {
        font-size:40px
    }

    .f-80 {
        font-size: 45px
    }

    .f-26,.f-30 {
        font-size: 20px
    }

    .f-18 {
        font-size: 16px
    }
}

@media screen and (max-width: 576px) {
    .sub-ban-left {
        bottom:0;
        height: 100px
    }

    .f-55,.f-60,.f-80,.f-90 {
        font-size: 30px
    }

    .f-40 {
        font-size: 28px
    }

    .f-48 {
        font-size: 26px
    }

    .f-20 {
        font-size: 16px
    }

    .drop-down-cont {
        width: 100%
    }
}

@media screen and (max-width: 431px) {
    body {
        font-size:14px
    }
}






/* saad-css */

.orbit-add li a {
    color: #fff;
}

.main-head {
    color: #fff;
}