@font-face {
    font-family: "General Sans";
    src: url("/fonts/GeneralSans-Regular.otf") format("opentype");
    font-weight: 400;
}

@font-face {
    font-family: "General Sans";
    src: url("/fonts/GeneralSans-Medium.otf") format("opentype");
    font-weight: 500;
}

@font-face {
    font-family: "General Sans";
    src: url("/fonts/GeneralSans-Semibold.otf") format("opentype");
    font-weight: 600;
}

@font-face {
    font-family: "General Sans";
    src: url("/fonts/GeneralSans-Bold.otf") format("opentype");
    font-weight: 700;
}



h1, h2, h3, h4, h5, h6, p, a, b,
li, select, input, button, span,
::placeholder{
    font-family: "General Sans"!important;
    margin:0px!important;
}

.navbar-brand img{
    width: 150px;
    object-fit: contain;
}


.headerSec{
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    padding-bottom:40px;
    position: relative;
    z-index: 99;
}

.homeBanner{
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -80px;
    padding:150px 20px 200px;
    position: relative;
    z-index: 0;
}

.bannerImg{
    background-color: #fff;
    border-radius: 20px;
    padding:30px;
}

.bannerImg img {
    width: 400px;
    object-fit: contain;
}

.bannerTitle{
    background-image: url(../img/image2.webp);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    padding:30px 40px 30px;
}

.bannerTitle h1{
    transform: rotate(-2deg);
    font-size: 50px;
    font-weight: 700;
    color:#4F66FA;
}

.bannerImg p{
    padding:10px;
    background-color: #000;
    color:#fff;
    width: 70%;
    text-align: center;
    font-size: 13px;
    border-radius: 50px;
}


.bannerContent p{
    padding-left:45px;
    font-size: 25px;
}

.buttonSec{
    padding-left:45px;
}


.btn-primary{
    background-color: #4F66FA!important;
    color:#fff!important;
    font-size: 17px!important;
    font-weight: 600!important;
    border-radius: 50px!important;
    padding: 15px!important;
    border: 0px!important;
    text-transform: uppercase;
}

.btn-secondary{
    background-color: #B5F3F9!important;
    color:#4F66FA!important;
    font-size: 17px!important;
    font-weight: 600!important;
    border-radius: 50px!important;
    padding: 15px!important;
    border: 0px!important;
    text-transform: uppercase;
}

.foundersSec{
    padding:60px 20px;
}

.foundersSec h4{
    color:#000;
    font-size: 30px;
    font-weight: 700;
}

.foundersSec img{
    width: 100%;
    object-fit: contain;
}

.twoColSec{
    padding:60px 20px;
}

.secTitle{
    background-image: url(/img/image5.webp);
    background-position: center center;
    background-size: contain;
    padding:40px 20px;
    background-repeat: no-repeat;
    width: 50%;
}

.secTitle h2{
    font-size: 57px;
    font-weight: 700;
    color:#fff;
    transform: rotate(-2deg);
}

.wwdList{
    list-style: none;
}

.wwditems{
    position: relative;
}

.wwditems img{
    width: 20px;
    height: 20px;
    object-fit: contain;
    position: absolute;
    top: 1px;
    left: -30px;
}

.wwdSec{
    background-image: url(/img/image6.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    height: 500px;
}


.wwdSec::before{
    position: absolute;
    width: 100%;
    height: 100%;
    content: ' ';
    top: 0;
    left: 0;
    opacity: .8;
    background: #B5F3F9;
    background: linear-gradient(180deg, rgba(181, 243, 249, 1) 0%, rgba(79, 102, 250, 1) 100%);
}

.wwdContent{
    position: relative;
    padding:30px;
}

.wwdTitle{
    width: 50%;
    padding:10px 20px;
    background-color: #B5F3F9;
    transform: rotate(-2deg);
    margin-bottom: 10px;
}

.wwdTitle h2{
    color:#4F66FA;
    font-size: 45px;
    font-weight: 700;
}


.wwdContent p{
    padding-left:25px;
    color:#fff;
}




.what-we-do{
    padding-bottom:350px;
}


.why-were-different{
    background-image: url('/img/image10.webp');
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    padding:200px 20px 250px;
    margin-top: -200px;
}


.whywd-title{
    background-image: url('/img/image9.webp');
    background-size: contain;
    padding:35px;
    background-repeat: no-repeat;
}

.whywd-title h2{
    transform: rotate(3deg);
    font-size: 60px;
    color:#4F66FA;
    font-weight: 600;
    width: 400px;
}


.wwd-img{
    width: 250px;
    height: 250px;
    object-fit: contain;
}


.why-were-different h4{
    width: 100%;
    font-size: 30px;
    color:#0016a1;
    font-weight: 600;
}


.why-were-different p{
    width: 100%;
    font-size: 18px;
    color:#000;
    font-weight: 400;

}

.linebroke{
    position: absolute;
    bottom: 170px;
    width: 65%!important;
    left: 17%;
    z-index:0;
}


.contemporaryFL{
    background-image: url('/img/image15.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    padding:180px 20px 250px;
    margin-top: -150px;
}

.contemporaryFL h2{
    font-size: 45px;
    color: #000;
    font-weight: 700;
}

.titleTag{
    background-color: #b5f3f9;
    padding:10px 20px;
    font-size: 30px!important;
    font-weight: 700;
    color: #4F66FA;
    transform: rotate(-10deg);
    width: auto!important;
    margin-bottom:-40px!important;
    margin-left: -20px!important;
}

.contemporaryFL h3{
    font-size: 80px;
    color: #4F66FA;
    font-weight: 700;
    line-height: 1em!important;
}

.contemporaryFL p{
    font-size: 20px;
}


.how-we-move{
    background-image: url('/img/image24.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    padding:300px 20px 250px;
    margin-top:-250px;
}


.cardItems{
    padding:15px;
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0px 0px 5px #0000008c;
    width: 400px;
}


.cardItems.rotate{
    transform: rotate(5deg);
    top: 150px;
    left: 100px;
}

.cardItems img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 20px;
}



.hwm-title{
    padding:15px 30px;
    background-image: url('/img/image19.webp');
    background-size: contain;
    background-repeat: no-repeat;
}


.hwm-title h2{
    font-size: 62px;
    font-weight: 700;
    color:#4F66FA;
    transform: rotate(-2deg);
}


.contentSect p{
    font-size: 25px;
}


.what-our-client{
    background-image: url('/img/image20.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    padding:250px 20px 250px;
    margin-top: -100px;
}



.what-our-client h2{
    background-image: url('/img/image21.webp');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    padding:25px;
    font-size: 65px;
    color:#4F66FA;
    font-weight: 700;
    text-align: center;
}


.what-our-client p{
    font-size: 30px;
    color:#000;
}



.what-our-client h5{
    font-size: 30px;
    color:#000;
    font-weight: 700;
}




.pick-a-line{
    background-image: url(/img/image24.webp);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    padding:250px 20px 250px;
    margin-top: -250px;
}




.pick-a-line h2{
    text-align: center;
    font-size: 60px;
    color:#0016a1;
    font-weight: 700;
}


.laptopSec{
    background-image: url('/img/image25.webp');
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    padding:25px 10px 220px;
}

.laptopInneContent{
    width:800px;
    height: 530px;
    background: #536AFA;
    background: linear-gradient(90deg, rgba(83, 106, 250, 1) 0%, rgba(79, 102, 250, 0.01) 70%);
    border-radius: 15px;
    padding:40px 70px;
}


.laptopInneContent ul {
    list-style: none;
    margin: 0px!important;
    width: 50%;
    padding: 20px 0px;
    padding-left:30px;
}

.laptopInneContent ul li{
    position: relative;
    color:#fff;
    font-size: 18px;
}

.laptopInneContent ul li i{
    position: absolute;
    top:-1px;
    left: -30px;
    color:#fff;
    font-size: 20px;
}



.laptopInneContent h4{
    font-size: 45px;
    color:#fff;
    font-weight: 600;
}

.laptopInneContent h6{
    font-size: 25px;
    color:#fff;
    font-weight: 600;
}

.laptopInneContent p{
    font-size: 20px;
    font-weight: 600;
    color:#fff;
    width: 50%;
}

.btmInnerSec {
    margin-top:-50px;
}

.btmInnerSec h6{
    width:70%;
    text-align: center;
    font-size: 40px;
    color:#000;
}





.faqSec{
    padding:250px 20px 250px;
    background-image: url('/img/image27.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -150px;
}


.faqTitle {
    padding:10px 20px 30px;
    background-image: url('/img/image26.webp');
    background-repeat: no-repeat;
    background-size: contain;
}


.faqTitle h2{
    font-size: 65px;
    color:#4F66FA;
    font-weight: 700;
    line-height: 1em;
    transform: rotate(-2deg);
}

#faqInnerSection, #faqInnerSection .accordion-item{
    background-color: transparent!important;
    border: none!important;
}


#faqInnerSection .accordion-button{
    border-radius: 10px;
    font-size: 30px;
    font-weight: 600;
    color:#0016a1;
    padding:25px;
    background-color: transparent;
}


#faqInnerSection .accordion-button:not(.collapsed){
    background-color: #0016a1;
    border-radius: 10px;
    font-size: 30px;
    font-weight: 600;
    color:#fff;
    padding:25px;
    outline: none!important;
}

#faqInnerSection .accordion-button:focus{
    border: none!important;
    outline: none!important;
    box-shadow:none!important;
}

#faqInnerSection .accordion-button:not(.collapsed)::after{
    color:#fff!important;
}




.bottomSection{
    padding:200px 20px 200px;
    margin-top: -150px;
    background-image: url('/img/image29.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}


.bottomSection h2{
    font-size: 75px;
    font-weight: 700;
    color:#4F66FA;
    background-image: url('/img/image28.webp');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    padding:30px 20px;
    text-align: center;
}



.footerSection{
    padding:150px 20px 10px;
    margin-top: -150px;
    background-image: url('/img/image31.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 99;
}



.footerIcons li a{
    height: 60px;
    width: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background-color: #4F66FA;
    color:#fff;
    padding:10px;
    font-size: 25px;
}



.footerSection h2{
    font-size: 70px;
    color:#4F66FA;
    font-weight: 700;
    line-height: 1em;
}

.footerSection p{
    font-size: 20px;
    color:#4F66FA;
    font-weight: 400;
}


.footerBtm p{
    font-size: 15px!important;
    color:#0016a1;
    font-weight: 500;
}

.footerBtm ul {
    list-style: none;
}

.footerBtm ul li a{
    text-decoration: none;
    color:#0016a1;
    font-size: 15px;
    font-weight: 500;
}




.innerSec h4{
    font-size: 35px;
    font-weight: 600;
    color:#000;
}

.innerSec p{
    font-size: 20px;
    font-weight: 400;
    color:#000;
}

.worksTitle{
    padding:20px;
    background-image: url('/img/image32.webp');
    background-position: left top;
    background-size: cover;
    background-repeat: no-repeat;
}

.worksTitle h1{
    font-size: 45px;
    font-weight: 700;
    color: #4F66FA;
}

.worksCard img {
    height: 450px;
    object-fit: cover;
    border-radius: 20px;
}

.worksImgSec{
    position: relative;
}

.tagsSec{
    position: absolute;
    left: 20px;
    bottom: 20px;
}


.worksDetails h5{
    font-size: 30px;
    font-weight: 600;
    color:#0016a1;
}

.worksDetails h6{
    font-size: 15px;
    font-weight: 400;
    color:#0016a1;
}

/* Inner Repeatd Section */

.innerSec.banner{
    padding-bottom:70px;
}

.innerSec{
    padding:70px 20px 200px;
}

.worksTags{
    padding:10px 25px;
    background-color: #ffffff41;
    color:#fff!important;
    font-size: 15px!important;
    font-weight: 700;
    border-radius: 50px;
}

.gradient-text {
    font-weight: 900;
    font-size: 100px;
    line-height: 1em;
    text-transform: uppercase;
    text-align: center;
    background: linear-gradient(90deg, #5b6cff, #84dbff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}


.btn-success{
    background-color: #00000052!important;
    border-radius: 50px!important;
    color:#fff;
    border-color:#00000052!important;
}


.workInner{
    padding:50px 20px 250px;
    background-image: none!important;
}

.cfl-tags{
    padding:10px 20px;
    font-size: 15px!important;
    font-weight: 600;
    color:#fff;
    border-radius: 50px;
    background-color: #0016a1;
}


.rateSec h3{
    color:#0016a1;
    font-size: 100px;
    font-weight: 700;
}


.rateSec p{
    color:#000;
    font-size: 20px;
    font-weight: 400;
}


.imgUnderText{
    font-size: 30px!important;
    color:#0016a1;
    text-align: center;
}

.workInner-2{
    background-image: url('/img/image40.webp');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}


.projectSheet{
    padding:20px;
    border-radius: 20px;
    box-shadow: 0px 0px 5px #0000004b;
    background-color: #fff;
    height: 600px;
    width: 80%;
}


.projectSheet h3{
    font-size: 35px;
    font-weight: 600;
    color:#000;
}


.projInfo{
    padding:10px;
    border-radius: 5px;
    background-color: #f2f2f2;
}


.projInfo span{
    font-size: 15px;
    color:#2f2f2f;
}

.projInfo h4{
    font-size: 35px;
    color:#2f2f2f;
}

.projInfo p {
    padding:5px 10px;
    background-color: #000;
    border-radius: 50px;
    color:#fff;
    text-align: center;
    font-size: 14px;
}



.workDetails h2{
    font-size: 30px;
    font-weight: 500;
    color:#0016a1;
}


.workDetails p {
    font-size: 20px;
    color:#000;
}


.crafting h2{
    font-size: 70px;
    color:#0016a1;
    line-height: 1em;
    font-weight: 700;
}

.crafting p{
    font-size: 25px;
    color:#000;
    line-height: 1.3em;
    font-weight: 400;
}


.secList {
    list-style: none;
}

.secList li{
    position: relative;
    font-size: 25px;
    color:#000;
    line-height: 1.3em;
}

.secList li i{
    position: absolute;
    top: 0;
    left: -30px;
    color:#ff0707;
}


.secList.checked li i{
    color:#8091fd!important;
}


.innerSec.banner h1{
    font-size: 50px;
    font-weight: 700;
    color:#0016a1;
}


.innerSec h2{
    font-size: 50px;
    font-weight: 600;
    color: #4F66FA;
    line-height: 1em;
}


.innerSec .cfl-tags {
    color:#fff!important;
}


.responsiveSec{
    padding:200px 20px 350px;
    margin-top:-100px;
    background-image: url('/img/image52.webp');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}



.weWorkWith{
    padding:100px 70px 0px;
    background: #475EF1;
    background: linear-gradient(180deg, rgba(71, 94, 241, 1) 0%, rgba(7, 29, 168, 1) 70%);
    border-radius: 20px;
    position: relative;
}

.btnArrow{
    width: 200px;
    position: absolute;
    top:50px;
    right:100px;
}


.weWorkWith h2{
    font-size: 70px;
    color:#fff;
    font-weight: 700;
    line-height: 1em;
    text-align: center;
}

.btnForWho{
    background-color:#6275f0;
    padding:15px 30px;
    border-radius: 50px;
    text-align: center;
    color:#fff;
    text-decoration: none;
}

.btnArrow img{
    width: 60%;
    height: 150px;
    object-fit: contain;
}


.weWorkWith h2 span{
    color:#b5f3f9;
}


.serviceSec{
    background-image: none!important;
    padding:100px 20px 300px;
}



.aboutSec{
    padding:200px 20px 300px;
    background-image: url('/img/image56.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
    height:1000px;
    position: relative;
    z-index: 0;
    margin-top: -60px;
}


.playSec{
    width: 400px;
}

.playSec i{
    font-size: 70px;
    color:#fff;
}

.playSec p{
    font-weight: 400;
    color:#fff;
}

.contantUsSec{
    padding:50px 20px 400px;
    background-image:url('/img/image57.webp');
    background-position: bottom center;
    background-size: 70%;
    background-repeat: no-repeat;
    margin-bottom: 80px;
}

.contantUsSec h2{
    color:#0016a1;
    font-size: 60px;
    font-weight: 700;
}


.contantUsSec ul{
    list-style: none;
}

.contantUsSec ul li{
    position: relative;
    font-size: 20px;
    color:#0016a1;
}

.contantUsSec ul li i{
    position: absolute;
    top:2px;
    left: -25px;
    color:#0016a1;
}

.contantUsSec p{
    font-size: 20px;
    color:#000;
}

.userName img{
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50px;
}

.userName p{
    font-size: 17px;
    color:#0016a1;
}


.form-check{
    position: relative;
    padding: 0px!important;
}

.formSec .form-check-input{
    position: absolute;
    background-color: transparent;
    width: 100%;
    z-index: 1;
    height: 100%;
    border-radius: 50px;
    border: 0px;
    outline: none!important;
}

.formSec .form-check-input:checked{
    background-color: transparent;
    outline: none!important;
}

.form-check-input:checked[type=checkbox]{
    --bs-form-check-bg-image:none!important;
}

/* .formSec .form-check-input:checked + .form-check-label{
    background-color: #3040a5;
} */


.formSec{
    padding:40px;
    background-color: #04126b;
    border-radius: 20px;
}

.formSec .form-check-input:focus{
    outline: none!important;
    box-shadow: none!important;
}

.form-check-label{
    position: relative;
    z-index: 0;
    padding:10px 20px;
    background-color: #475EF1;
    border-radius: 50px;
    color:#fff;
    font-weight: 500;
    font-family: 'General Sans';
    transition: .4s;
}

.toggleActive{
    background-color: #3040a5;
}

.formSec p{
    font-weight: 600;
    color:#fff;
}

.form-control{
    color:#fff!important;
    font-weight: 600;
    background-color: #00083d!important;
    padding:15px 20px!important;
    border: 0px!important   ;
}

.form-control::placeholder{
    color:#fff!important;
    font-weight: 600;
}