/* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Poppins:wght@400;500;600;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600;700;800&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,300;0,6..12,400;0,6..12,500;0,6..12,600;0,6..12,700;0,6..12,800;1,6..12,900&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Satoshi', sans-serif;

}

a {
    text-decoration: none;
}

li {
    list-style: none;
}


:root {
    --Nunito_Sans: 'Nunito Sans', sans-serif;
    --poppins: 'Poppins', sans-serif;
    --lato: 'Lato', sans-serif;
    --inter: 'Inter', sans-serif;
    --btnColor: #085394;
    --thColor: #7A7A7A;
    --bgMain: #EFEFEF;
    --trOddBg: #F5FBFF;
    --light: #fff;
    --blue: #085394;
    --light-blue: #CFE8FF;
    --grey: #eee;
    --dark-grey: #AAAAAA;
    --dark: #272727;
    --red: #DB504A;
    --yellow: #FFCE26;
    --light-yellow: #FFF2C6;
    --orange: #FD7238;
    --light-orange: #FFE0D3;
    --success-green: #5BA640;
    --bgNew: #053679;
}

.btnFlex a{
    padding: 1%;
}


html {
    overflow-x: hidden;
}

body.dark {
    --light: #0C0C1E;
    --grey: #060714;
    --dark: #FBFBFB;
}

nav {
    position: absolute;
    top: 0;
    width: -webkit-fill-available;

}

.navMain {
    height: 72px;
    padding: 20px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    width: -webkit-fill-available;
    background: #fff;
    z-index: 9999;
    /* box-shadow: 0 5px 4px -6px black; */
}

.menu {
    display: none;
}

.navMain ul {
    list-style-type: none;
    display: flex;
    align-items: center;
    column-gap: 50px;
    margin-top: 20px;
}

.navMain ul li a {
    display: flex;
    column-gap: 5px;
    align-items: center;
    color: var(--dark);
    justify-content: space-between;
}

.navMain ul img {
    object-fit: scale-down;
    width: 32px;
    margin-top:2px;
    height: 25px;

}




.navMain ul li h3 {
    font-size: 16px;
    line-height: 24.36px;
    font-weight: 600;
    /* font-weight:var(--slide-min-width); */
}


.navMain ul li a.active {
    color: #053679;
    cursor: pointer;
    font-weight: 500;
    border-bottom: #053679;
       /* border-bottom: 2px solid #000079;*/
    /* padding-bottom: 0%; */
    /* width: 31%; */
    /* margin: 0 70%; */
    /* display: flex; */
    /* align-items: center; */
    /* justify-content: center; */


}

.navMain ul li p {
    font-weight: 500;
    margin-top: 5px;
    font-size: 16px;
    margin-left:5px;
    
}



.platformsNav {
    position: relative;
}

.downArrowListDis {
    display: none;
}

.arrow-container {
    position: absolute;
    top: -13px;
    width: 0;
    left: 95px;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 13px solid #fff;
    ;
    /* Change var(--bgNew) to your desired color */
}

.navMain ul li .downArrowListDis .downArrowList {
    /* display: none; */
    position: absolute;
    border: none;
    width: 158%;
    border-radius: 10px;
    margin-top: 18px;
     padding: 10px; 
    /* bottom: 30px; */
    /* border-top: 4px solid var(--bgNew); */
    display: grid;
    /* background: #f5f7fa; */
    background-color: white; 
    box-shadow: 0px 0px 4px 4px beige;

}
/* .navMain ul li .downArrowListDis::before{
    position: absolute;
    content: '';
    height: 20px;
    width: 20px;
    background: #fff;
   
    transform: rotate(45deg);
    z-index: -1;
} */

.navMain ul li .downArrowListDis .downArrowList p {
    /* padding: 5px; */
    font-size: 15px;
    font-weight: 400;

}

/* .navMain ul li .downArrowListDis .downArrowList li {
    height: auto;
    box-shadow: 0 4px 4px -6px black;
} */

.navMain ul li .downArrowListDis .downArrowList li a span {
    display: flex;
     padding: 2px; 
    border-radius: 5px;
    border-left: 4px solid #fff;
    border-bottom: none !important;
}

.navMain ul li .downArrowListDis .downArrowList li a span:hover {
    color: var(--bgNew);
    cursor: pointer;
    font-weight: 600;
    border-left: 2px solid #053679;
    border-bottom: none !important;
}

.navMain ul li .downArrowListDis .downArrowList li a span p:hover {

    border-left: none;

}

.navMain ul li .downArrowListDis .downArrowList li a p:hover {
    color: var(--bgNew);
    cursor: pointer;
    font-weight: 500;
    border-left: 4px solid #FFF;
    border-bottom: none !important;
}


.navMain ul li.active a h3 {
    color: #053679; 
    font-weight: 600;
}

/* Responsive styles */
@media screen and (max-width: 1067px) {
    /* Tablet-specific styles */
    .navMain {
        padding: 15px 40px;
        height: 60px;
        width: 100%;
    }

    .leftNav img {
        width: 150px;
    }

    .navMain ul {
        column-gap: 10px;
    }

    .navMain ul li h3 {
        font-size: 16px;
    }

    .menu {
        display: block;
        align-items: center;
        position: relative;
    }

    .navMain .displayMb {
        display: none;
        position: absolute;
        top: 90px;
        width: 85%;
        text-align: left;
        background: var(--light);
    }

    .navMain ul li .downArrowListDis .downArrowList {
        position: absolute;
        display: grid;
        justify-content: flex-start;
        width: 100%;
        margin-top: 25px;
    }

    .navMain ul li .downArrowListDis .downArrowList li {
        text-align: left;
    }

    .navMain ul li .downArrowListDis .downArrowList p {
        padding: 5px;
        font-weight: 500;
    }
}

























@media screen and (max-width: 600px) {
    /* Mobile-specific styles */
    .navMain {
        padding: 20px;
    }
    .leftNav img {
        width: 140px;
    }

    .navMain .displayMb {
        top: 70px;
        margin: 8px 1px 10px 5px;
        padding: 11px 12px 10px 1px;
    }
    .nav-link {
        font-size: 18px;
        text-decoration: none;
        color: #000;
        padding: 1px 15px;
        border-radius: 5px;
        transition: background-color 0.3s ease, color 0.3s ease;
    
    }


    .navMain ul {
        display: none; /* Hide menu by default on mobile */
        flex-direction: column;
        width: 100%;
    }

    .menu {
        display: block;
        font-size: 18px;
        cursor: pointer;
        margin: 8px 4px 13px 0px;
    }

    .menu.active + ul {
        display: flex; /* Show menu on mobile when active */
    }

    .navMain ul li h3 {
        font-size: 16px;
        font-weight: 400;
    }
    .navMain ul li .downArrowListDis .downArrowList p {
        font-size: 16px;
        font-weight: 400;
    }
    .navMain ul li .downArrowListDis .downArrowList img {
     width: 30px;
    }

    .menu-nav-link a {
        margin-left: 15.4px;
    }
    .downArrowListDis {
        display: none;
    }

    .navMain ul li .downArrowListDis .downArrowList {
        position: relative;
        width: 100%;
        margin-top: 0;
        background: var(--light);
    }

    .navMain ul li .downArrowListDis .downArrowList li {
        text-align: left;
    }


    .navMain ul li .downArrowListDis .downArrowList li a span {
        display: flex;
        padding: 5px;
        border-radius: 5px;
        border-left: 4px solid #fff;
        border-bottom: none !important;
    }
    
    .navMain ul li .downArrowListDis .downArrowList li a span:hover {
        color: var(--bgNew);
        cursor: pointer;
        font-weight: 500;
        border-left: 4px solid #053679;
        border-bottom: none !important;
    }

    .link img {
        margin-right: 15.2px;
    }
}













/* ---footer---  */


.footer_main {

    background-color: var(--light);
    background-size: 100%;
    color: var(--dark);

    padding-top: 20px;


}

.footer_span {
    display: flex;
    justify-content: space-around;
    padding-bottom: 20px !important;
    /* margin: 0px 83px 0px; */
}

.footer_logo {
     /* height: 170px; */
    width: auto;
    margin-top: 11px;
    margin-left: 25px;
    /* margin-right: -24px; */
}

.footerDiv a {
    color: white;
    /* font-family: 'Poppins'; */
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 16.94px;

}

.footer_span1 span {
    display: flex;
    gap: 10px;
}

.footer_span1 span img {
    width: 32px;
    aspect-ratio: 1/1;
    object-fit: contain;
    display: flex;
    justify-content: center;
    /* align-items: self-start; */
    align-self: baseline;

}

.footer_span1 {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    row-gap: 8px;
    /* text-align: center; */
}

.hrBottomFooter {
    margin: 10px 62px;
    border: 1px solid white;
}

.footerBottom1{
    display: center;
    text-align: center;
    

}

.footerBottom {
    display: flex;
    justify-content: space-between;
    margin: 10px 45px;
    align-items: center;
}

.footerBottom>div {
    display: flex;
    margin: 0 17px;
    align-items: center;
    row-gap: 15px;
    column-gap: 49px;
}

.socialLinkDiv {
    column-gap: 15px !important;
}

.socialLink {
    display: inline-flex;
    column-gap: 15px;
}

#output {
    /* font-size: 24px; */
    /* font-family: monospace; */
}

.allignLeft {
    text-align: left;
}

/* .footer_span2 {
    margin-top: 95px;
    display: flex;
    flex-direction: column;
}
.footer_span2 img {
    background: #fff;
    width: 20px;
    border-radius: 50%;
    height: 20px;
    padding: 3px;
    object-fit: contain;
    margin: 5px;
} */

.vailoFooterSpan1 h3 {
    /* color: #fff; */
    margin-bottom: 20px;
}

.vailoFooterSpan1 p {
    display: flex   ;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;

    font-size: 14px;
    /* letter-spacing: 1px; */
    color: white;
}

.footerHead {
    font-size: 18px !important;
    margin-bottom: 10px;
}

.footerBottom p {
    font-size: 14px;
    color: white;
}



.footer_icon1 {
    display: flex;
    text-decoration: none;
    justify-content: space-around;
}

.vailoFooterIcons a {
    text-decoration: none;
    color: #fff;
}

.footer_icon1 p {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    text-decoration: none !important;
    color: #fff;
}

.footer_icon1 a:hover {
    list-style: none;
    text-decoration: none;
    color: #4699E3;
}

.footer_icon {
    text-decoration: none;
    padding: 5px;
    display: inline-flex !important;
    font-size: large !important;
}

.footer_icon p {

    margin-left: 10px;
}

.vailoFooterAdres a {
    position: relative;
}

.vailoFooterAdres span {
    position: absolute;
    top: -10px;
}

.line {
    /* width: 100%; */
    height: 2px;
    background-color: #075e54;
    /* Change this to the desired line color */
    position: relative;
    margin: 0 81px;
}

.curve {
    width: 25px;
    height: 30px;
    background-color: #fff;
    /* Change this to the desired curve color */
    border: 3px solid var(--bgNew);
    border-bottom: 3px #fff;
    border-radius: 50% 50% -50% -50%;
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
}

.arrow {
    width: 0;
    height: 0;
    border-left: 2px solid transparent;
    /* Adjust the arrow size as needed */
    border-right: 2px solid transparent;
    border-bottom: 2px solid #333;
    /* Change this to the desired arrow color */
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
}

.imgLine {
    aspect-ratio: 20/1;
    object-fit: contain;
    width: -webkit-fill-available;
    position: relative;
}

.lineImg {
    width: -webkit-fill-available;
    /* aspect-ratio: 20/1; */
    margin: 0 81px;

}

.arrowUpF {
    position: absolute;
    right: 48.9%;
    top: 6px;
    width: 28px;
}

/* --- section---  */

/* #output{
    
    font-weight: 500;
    visibility: visible;
    display: block;
} */

/* --- section---  */



@media screen and (max-width: 600px) {


    .footer_span {
        display: flex !important;
        flex-direction: column !important;
        text-align: start;
        /* align-items: center; */
        margin: 0 20px;
    }

    /* .vailoFooterSpan1 p,.footer_icon1 p,.vailoFooterSpan2 p {
        text-align: center !important;
    } */
    .footerLogoVailo {
        display: flex;
        align-items: center;
        text-align: center;
        justify-content: center;
        width: 100%;
        height: auto;
        object-fit: scale-down;
    }

    .footer_icon1 {
        align-items: center;
    }

    .footer_span1 {
        /* margin-top: 0px; */
        width: 100%;
        margin: 20px 0;
        text-align: left;
    }

    .hrBottomFooter {
        margin: 0;
    }

    .footerBottom {
        /* flex-wrap: wrap; */
        margin: 10px 20px;
        display: grid;
        /* column-gap: 10px; */
        row-gap: 20px;

    }

    .footerBottom>div {
        /* flex-wrap: wrap; */
        display: grid;
        margin: 0;
    }

    .arrowUpF {
        position: absolute;
        right: 48%;
        top: 4px;
        object-fit: contain;
        width: 4%;
    }

    .lineImg {
        width: -webkit-fill-available;
        aspect-ratio: 20/1;
        margin: 0;
    }
}

/* .footer_span2 {
        margin-top: 0px;
    }
    .footer_span3 h3{
        margin: 20px 0;
    }  */



@media screen and (max-width:1050) {
    .footer_span {
        display: flex !important;
        flex-wrap: wrap !important;
        padding-left: 0;
    }

    .footer_span .footerDiv {
        list-style: none;
        flex: 0 0 50% !important;
    }
}

.subsection2add{
    display: flex;
    position: relative;
    padding: 3%;
   
}
.secnew2{
    font-size:16px;
    font-weight:500;
    line-height:24px;
    padding:3% 20% 0% 20%;
}
.secnew1{
    font-size:40px;
    font-weight:500;
    line-height:54px;
}
@media (min-width: 601px) and (max-width: 1024px) {
    .subsection2add {
        padding: 5%;
        flex-direction: column; 
    }
}

@media (max-width: 600px) {
    .subsection2add {
        padding: 10%;  
        flex-direction: column; 
        /* margin-top: -40%; */
    }
}

@media (min-width: 1025px) {
    .subsection2add {
        padding: 2%; 
        flex-direction: column;
        align-items: center; 
        padding-bottom: unset; 
    }
}









.subsectionImgLeft{
    line-height: 50px;
    font-size: 24px;
}


.subsectionImgLeft h1{

    color: rgb(3, 3, 95);
}




@media (min-width: 601px) and (max-width: 1024px) {
    .subsectionImgLeft {
        width: 50%;
        padding: 3%;
        padding-bottom: unset;
    }
}

@media (max-width: 600px) {
    .subsectionImgLeft {
        width: 100%; 
        padding: 5%; 
    }
    .subsectionImgLeft h1{
        font-size: 28px !important;
        line-height: 39px;
        text-align: center;
    }
}

@media (min-width: 1025px) {
    .subsectionImgLeft {
        /* width: 40%; */
        padding: 2%; 
        line-height: 50px;
        font-size: 24px;
        padding-bottom: unset;
    }
}




.subsectionImgright{
    display: flex;
    padding: 2%;
    column-gap: 55px;
    /* width: 60%; */

}

.box1content{
    text-align: center;
    padding: 2%;
    background-color: #fff;
    width: 30%;
    height: 117%;
    border-radius: 16px;
    box-shadow: 0px 4px 8px 0px #ABBED1;
    
}

.box1content p{
    margin-top: 20px;
    font-size: 16px;
    line-height: 21.6px;
    /* font-weight: normal; */  
    font-weight: 400;
}

@media (min-width: 601px) and (max-width: 1024px) {
    .subsectionImgright {
        flex-direction: column; 
        width: 100%;
        column-gap: 30px;
        padding: 4%;
     
    }

    .box1content {
        width: 90%;
        padding: 2%; 
        height: auto;
        box-shadow: 0px 4px 8px 0px #ABBED1;
    }
}

@media (max-width: 600px) {
    .subsectionImgright {
        flex-direction: column;
        width: 100%;
        row-gap: 16px;
        padding: 5%;

    }

    .box1content {
        width: 100%;
        padding: 5%; 
        height: auto;
        box-shadow: 0px 4px 8px 0px #ABBED1;
    }
}

@media (min-width: 1025px) {
    .subsectionImgright {
        /* width: 60%; */
        column-gap: 90px; 
        padding: 2%; 
        justify-content: center;
    }

    .box1content {
        width: 200px;
        padding: 2%;
        height: 200px;
        box-shadow: 0px 4px 6px -1px #ABBED1;
    }
}


.servicestext{
    align-items: center;
    margin-top: -4%;
 
}


@media (min-width: 601px) and (max-width: 1024px) {
    .servicestext {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2%; 
    }
}

@media (max-width: 600px) {
    .servicestext {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0px 0px 111px 0px;
        text-align: center; 
    }
}

@media (min-width: 1025px) {
    .servicestext {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 3%; 
    }
}







.section2add {
    /* background: #7474FF; */
    place-items: center;
    padding: 20px 130px 20px;
    text-align: center;

}

.section2add img {
    height: 32px;
    aspect-ratio: 1/1;
    object-fit: scale-down;
}

.section2add p {
    padding-top: 10px;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
    /* color: #fff; */
    display: flex;
    text-align: left;
}

.sectionParagraph {
    margin: 30px 90px;
}

.sectionParagraph p {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
}

.sectionOneMainDIv {
    display: flex;
    /* padding: 85px 0 30px; */
    justify-content: space-between;
    width: -webkit-fill-available;
    height: 525px;
}

.sectionImgLeft {
    width: 50%;
    display: flex;
    margin-top: 2%;
    justify-content: center;
    flex-direction: column;
    margin-left: 4.5%;
    row-gap: 25px;
}

.sectionImgRight {
    margin-right: 8%;
    margin-bottom: 4%;
    margin-top: 4%;
    display: flex;
    row-gap: 30px;
    flex-basis: content;
}

.sectionMainOne h1 {
    font-size: 32px;
    line-height: 58.09px;
    font-weight: 700;
    text-transform: capitalize;
    
}
.sectionMainOne h2 {
    font-size: 36px;
    line-height: 58.09px;
    font-weight: 700;
    text-transform: capitalize;
    color: var(--bgNew);
}

.sectionOneJs {
    height: 40px;
}

.sectionOneJs h1 {
    color: var(--bgNew);
    font-size: 32px;
    font-weight: 700;
    line-height: 38.73px;
}

button {
    font-size: 16px;
    border: 2px solid var(--bgNew);
    border-radius: 3px;
    padding: 5px 22px;
    background: var(--light);
    color: var(--bgNew);
    font-weight: 500;
    width: fit-content;
}


.activeBtn {
    /* background: var(--bgNew); */
    background-color: #053679;
    color: var(--light);
}


.btnBtmFlex {
    display: flex;
    gap: 10px;
    margin-top: 1%;

}

@media (max-width: 1024px) {
    .btnBtmFlex {
        gap: 8px; 
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .btnBtmFlex {
        flex-direction: column; 
        gap: 15px; 
        justify-content: center;
        align-items: center; 
    }
}






.btnBtmFlex button:hover,
.partnerThird button:hover,
.subPartner:hover {
    background-color: #053679 !important;
    color: var(--light) !important;
    border: 2px solid #053679 !important;
}

.activeBtnBtm {

    background-color: #d9d9eb;
    color: #053679;
    border: none;
}


@media (max-width: 600px) {
    .activeBtnBtm {
        background-color: #d9d9eb;
        color: #053679;
        border: none;
        width: 175px;
    }


}

.BtnBtm {
    /* background: var(--bgNew); */
    background-color: #053679;
    color: var(--light);
    border: 2px solid #053679;
}


.btnFlex {
    display: flex;
    column-gap: 35px;
}


@media (min-width: 601px) and (max-width: 1024px) {
    .btnFlex {
        column-gap: 25px;
    }
}
@media (max-width: 600px) {
    .isocert1 {
        width: 92% !important;
        margin-left:unset !important;
    }
}
.isocert1{
    display: flex;
    margin-left:-54%;
    margin-top:-3%;
}

@media (max-width: 600px) {
    .btnFlex {
        flex-direction: column;
        display: flex;
        row-gap: 10px;
        /* width: 179px;
        margin: 0px 0px 0px 72px; */
        /* margin-left: 20px; */
        margin: 0px 35px 0px 0px;
    }
}

/* For desktop screens (wider than 1024px) */
@media (min-width: 1025px) {
    .btnFlex {
        column-gap: 16px; /* Maintain original gap for desktops */
        margin-left: -8px;
    }
}


@media(max-width:600px){
    .sectionImgLeft p{
        margin-left: 93px;
        width: 600px;
        /* padding: 13px; */
        column-gap: 0px;
        margin: 0px 96px 32px;
    }
}


.sectionOneMainDIv img {
    /* aspect-ratio: 1/1; */
    object-fit: scale-down;
    width: -webkit-fill-available;
}

.section2 {
    margin: 54px 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#btnPartner:hover {
    color: #fff !important;
}

.maininfo {
    text-align: center;
    background-color: #F5F7FA;
    padding: 20px 0px 0px 14px;
    margin-bottom: 1px;
}

.maininfo a{
    font-size: 18px;
    color: #414042;
}



@media screen and (min-width: 768px) and (max-width: 1024px) {
    .maininfo {
        padding: 15px 0px 0px 10px;
        background-color: #F5F7FA;

        margin-bottom: 2px;
    }

    .maininfo a {
        font-size: 16px;
    }
}

@media screen and (max-width: 767px) {
    .maininfo {
        display: flex;
        padding: 10px 0px 0px 8px;
        margin-bottom: 2px;
        background-color: #F5F7FA;

    }

    .maininfo a {
        font-size: 14px;
    }
}

@media screen and (min-width: 1025px) {
    .maininfo {
        padding: 25px 0px 0px 20px;
        background-color: #F5F7FA;

    }

    .maininfo a {
        font-size: 18px;
        line-height: 27px;
    }
    }










.nav-link {
    font-size: 18px;
    text-decoration: none;
    color: #000; /* Default color */
   /* padding: 10px 15px; */
    border-radius: 5px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.nav-link.active {
    color: #053679;
    font-weight: 600;
    /* padding: 15px; */
    text-underline-offset: 5px;
}



.section2_1 {
    display: flex;
    justify-content: center;
    align-items: center;
    
    padding: 4%;
    column-gap: 25px;
}
.sec_help{
    font-size: 30px;
    line-height: 56px;
    font-weight: 500;
}

.section2_1Imgright{
    width: 64%;
    font-weight: 500;
}

.section2 p{
    margin: 10px;
    font-size: 16px;
    line-height: 16.94px;
    font-weight: 500;
    align-items: center !important;
    padding: 0 11px;


}

.section2_1 p {
    size: 24px;
    line-height: 24px;

}

.flexImgLan {
    display: flex;
    gap: 10px;
    margin: 10px;
}

.flexImgLan img {
    /* display: flex; */
    width: auto;
    object-fit: scale-down;
    aspect-ratio: 1/1;
    margin: 10px;
}

.heightthreeH {
    height: 350px;
}

.heightthreeHOne {
    height: 250px;
}

.bgBlog {
    /* background: #F3F3F9; */
    padding: 0px 60px;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

.sec3Absolute {
    position: absolute;
    top: 0;
}

.bottomAbsolute {
    position: fixed;
    right: 90px;
    bottom: 60px;
    z-index: 99999;
}






@media (min-device-width:601px) and (max-device-width:1024px) {

    section {
        margin: 110px 90px 20px;
    }


@media (min-device-width:601px) and (max-device-width:1024px) {

    .sectionOneMainDIv {
        display: flex;
        flex-direction: column;
        row-gap: 15px;
        height: auto !important
    }
}



/* For screens with device width between 480px and 1024px */
@media (min-width: 480px) and (max-width: 1024px) {
    section {
        margin: 110px 90px 20px;
    }

    .sectionOneMainDiv {
        display: flex;
        flex-direction: column;
        row-gap: 15px;
        height: auto !important;
    }
}



/* For screens with device width between 601px and 1024px */
@media (min-width: 601px) and (max-width: 1024px) {
    section {
        margin: 110px 90px 20px;
    }

    .sectionOneMainDiv {
        display: flex;
        flex-direction: column;
        row-gap: 15px;
        height: auto !important;
    }
}

/* For screens with device width up to 600px (typical mobile screens) */
@media (max-width: 600px) {
    section {
        margin: 50px 30px 10px;
    }

    .sectionOneMainDiv {
        display: block; /* Change to block or other styles suitable for smaller screens */
        margin: 0 10px; /* Example margin adjustment */
    }
}

/* For screens wider than 1024px (typical desktop screens) */
@media (min-width: 1025px) {
    section {
        margin: 150px 120px 30px;
    }

    .sectionOneMainDiv {
        display: flex;
        flex-direction: row; /* Example adjustment for desktop layout */
        row-gap: 20px;
    }
}








    .sectionImgLeft,
    .sectionImgRight {
        width: 100% !important;
        /* margin: 30px 90px; */
    }

    .sectionMainOne h1 {
        font-size: 32px;
        line-height: 38.73px;
    }

    .sliderContiner .container {
        margin: 0 !important;
    }

    .sliderContiner .container .slider .slider__track {
        margin: 0 25px !important;
    }

    .aboutsectionTwo {
        flex-direction: column;
    }

    .aboutsectionTwoImg {
        width: 100% !important;
    }

    .aboutsectionTwoP {
        width: 100% !important;
    }

    .partnerSectionOne h2 {
        font-size: 20px;
        padding: 10px;
    }

    .loginSection {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
       
    }

    .loginSectionRight {
        width: 100% !important;
        
    }

    
    .loginSectionLeft {
        width: 100% !important;
    }

    .section2add {
        padding: 28px 125px 60px !important;
    }

    .section2add :first-child {
        right: -90px !important;
    }

    .section2add :last-child {
        left: -90px !important;
    }

    .section2_1 {
        flex-direction: column;
        margin: 30px 90px;
    }

    .section2_1>* {
        width: 100% !Important;
    }

    .section2_1 div img,
    .sectionServ {
        width: 100% !important;
    }

    .section2_1 p {
        margin: 10px 0;
        padding: 0px;
    }

    .section3 {
        margin: 30px 90px !important;
    }

    .campaignusecase{
        margin: 30px 90px !important;

    }

    
    .campaignusecase .campaignusecaseconatainer{
        flex-direction: column;

    }

    .campaignusecase .campaignusecaseconatainer > ul{
        margin-top: 0 !important;
    
    }

    .section3 .sectionContainer {
        flex-direction: column;
    }




    .sectionServ ul {
        padding-top: 30px;
        grid-template-columns: repeat(1, 1fr) !important;
    }

    .section3 .sectionContainer>ul {
        margin-top: 0 !important;
        /* width: revert-layer !important; */
    }

    .widthSixty {
        width: 40% !important;
        padding: 0 !important;

    }

    .widthThirty {
        width: 30% !important;
    }

    .dcOneLeftSection {
        width: 100% !important;
    }

    .dcOneLeftSection a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .imgWidthSec {
        width: 100% !important;
    }

    .sectionServGrid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* .flexImgLan {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        justify-content: center;
    } */

    .section3 h2 {
        line-height: 33px;
    }

    .partnerThird {
        padding: 30px 20px !important;
    }

    /* .flexImgLanImg:nth-child(3) {
        grid-column: 1 / span 2;
      } */
    .flexImgLan,
    .flexImgLanPricig {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        /* Center align items horizontally */
    }

    .flexImgLanImg {
        width: 250px;
        /* Adjust the width as needed */
        height: 250px;
        /* Set the height to maintain aspect ratio */
        margin: 5px;
        /* Add spacing between images */
    }

    /* Center align the third image in the second row */
    .flexImgLanImg:nth-child(3) {
        margin-left: auto;
        margin-right: auto;
    }

    .arrowUpF {
        right: 49%;
        top: 2px;
        width: 20px;
    }


    /* ---  */
    .footer_span {
        display: grid;
        grid-template-rows: auto auto;
        justify-content: space-around;
        padding-bottom: 20px !important;
        margin: 10px 83px 10px;
    }

    .item1f {
        grid-row: 1;
        grid-column: 1;
    }

    .item2f,
    .item3f {
        grid-row: 2;
    }

    .item4f,
    .item5f {
        grid-row: 3;
    }

    .sec3Absolute {
        top: -40px;
    }

    .flexReverce {
        flex-direction: column-reverse !important;
        margin-top: 20px;
        align-items: center;
        /* justify-content: center !important; */
    }

    .mainDcSection {
        align-items: center;
        justify-content: center !important;
    }

}

@media screen and (max-width:600px) {
    .overflowHidden {
        width: 100%;
        overflow: hidden;
    }

    section {
        /* margin: 110px 20px 20px; */
    }

    .sectionOneMainDIv {
        display: flex;
        flex-direction: column;
        row-gap: 15px;
        height: auto !important
    }

    .sectionImgLeft,
    .sectionImgRight {
        width: 100% !important;
    }

    .sectionMainOne h1 {
        font-size: 32px;
        line-height: 38.73px;
    }

    .sliderContiner .container {
        margin: 0 !important;
    }

    .sliderContiner .container .slider .slider__track {
        margin: 0 25px !important;
    }

    .aboutsectionTwo {
        flex-direction: column;
    }

    .aboutsectionTwoImg {
        width: 100% !important;
    }

    .aboutsectionTwoP {
        width: 100% !important;
    }

    .partnerSectionOne h2 {
        font-size: 20px;
        padding: 10px;
    }

    .loginSection {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;

    }

    .loginSectionRight {
        width: 100% !important;
        margin: unset !important;
    }

    .loginSectionLeft {
        width: 100% !important;
    }

    .section2add {
        padding: 28px 55px 60px !important;
    }

    .section2add :first-child {
        right: -20px !important;
    }

    .section2add :last-child {
        left: -20px !important;
    }

    .section2_1 {
        flex-direction: column;
        margin: 30px 20px;
    }

    .section2_1>* {
        width: 100% !Important;
    }

    .section2_1 div img,
    .sectionServ {
        width: 100% !important;
    }

    .section2_1 p {
        margin: 10px 0;
        padding: 0px;
    }

    .section3,
    .section2 {
        margin: 30px 20px !important;
    }

    .mainDcSection {
        margin: 0px 20px !important;
    }

    .section3 .sectionContainer {
        flex-direction: column;
        display: flex;
        flex-direction: column-reverse;
    }



    .sectionServ ul {
        padding-top: 30px;
        grid-template-columns: repeat(1, 1fr) !important;
    }

    .section3 .sectionContainer>ul {
        margin-top: 0 !important;
        /* width: revert-layer !important; */
    }

    .dcOneLeftSection {
        width: 100% !important;

    }

    .widthSixty,
    .widthThirty {
        width: 100% !important;
        padding: 0 !important;

    }

    .flexReverce {
        flex-direction: column-reverse !important;
        margin-top: 20px;
        /* justify-content: center !important; */
    }

    .flexEnd {
        justify-content: center !important;
    }

    .dcOneLeftSection a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .imgWidthSec {
        width: 100% !important;
    }

    .sectionServGrid {
        grid-template-columns: repeat(1, 1fr) !important;
    }

    .flexImgLan,
    .flexImgLanPricig {
        flex-direction: column;
    }

    .section3 h2 {
        line-height: 33px;
    }

    .partnerThird {
        padding: 30px 20px !important;
    }

    .dcOneLeftSection ul li::before {

        width: 8% !important;
    }

    .sectionParagraph {
        margin: 30px 20px;
    }

    .serviceUseCase {
        margin: 0 !important;
    }


}


@media screen and (max-width: 600px) {
    .sectionOneMainDIv {
        display: flex;
        flex-direction: column-reverse;
        row-gap: 15px;
        height: auto !important;
    }

    .sectionImgLeft, .sectionImgRight {
        width: 100% !important;
    }

    .sectionImgRight img {
        width: 300px;
        height: auto;
        margin: 0px 40px;
        display: none;
    }
}

.sliderContiner {
    box-sizing: border-box;
    background: var(--bgNew);
    position: relative;
}

.sliderContiner .container .slider {
    --slider-padding: 1rem;
    --slider-column-gap: 50px;
    --slide-width: 23%;
    --slide-min-width: 15rem;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
}

/* .sliderContiner .container .slider .slider__track {
    display: flex;
    column-gap: 20px;
    overflow-x: auto;
    -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory;
    padding-inline: var(--slider-padding);
    scroll-behavior: smooth;
    list-style-type: none;
    padding: 0;
    margin-right: calc(var(--slider-column-gap) * -1);
    scrollbar-width: none;
    margin: 20px 70px;
  } */
.sliderContiner .container .slider .slider__track {
    display: flex;
    column-gap: 20px;
    /* Adjust the gap between slides */
    overflow-x: auto;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    padding-inline: var(--slider-padding);
    scroll-behavior: smooth;
    list-style-type: none;
    padding: 0;
    margin: 0 50px;
}

.sliderContiner .container .slider .slider__track>* {
    /* flex: 0 0 calc((100% - 2 * 20px - var(--slider-column-gap)) / 3);    min-width: var(--slide-min-width); */
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

.slideSub>div {
    width: 50%;
    aspect-ratio: 1/1;
}

.slideSub img {
    /* width: 100px; */
    width: -webkit-fill-available;
    aspect-ratio: 1/1;
    object-fit: scale-down;
}

/* .sliderContiner .container .slider .slider__track > * {
    flex: 0 0 100%;
  } */

/* Media query for desktop view */
@media screen and (min-width: 768px) {
    .sliderContiner .container .slider .slider__track>* {
        flex: 0 0 calc((100% - var(--slider-column-gap)) / 2);
        /* Display 4 slides on desktop */
    }
}

.sliderContiner .container .slider .slider__buttons {
    top: 50%;
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: space-between;
    /* margin-top: 20px; */
    /* Add margin between slides and buttons */
}

/* .sliderContiner .container .slider .slider__track > * {
    flex: 0 0 var(--slide-width);
    min-width: var(--slide-min-width);
    scroll-snap-align: start;
    scroll-snap-stop: always;
    padding-right: var(--slider-column-gap);
  } */
.sliderContiner .container .slider .slider__track::-webkit-scrollbar {
    display: none;
}

/* .sliderContiner .container .slider .slider__buttons {
    top: 50%;
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: space-between;
  } */
.sliderContiner .container .slider__buttons [disabled] {
    opacity: 0.5;
}

.sliderContiner .container .slider .slider__track .slide {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    min-width: 100%;
    /* Minimum width for each container */
    height: 350px;
    border-radius: 5px;
    background: #fff;
    color: #000;
    column-gap: 15px;
    border: 1px solid #f4eded;
    box-shadow: rgba(0, 0, 0, 0.1);
}


.sliderContiner .container {
    padding: 1rem;
    /* max-width: 1200px; */
    margin: 0 52px;
    color: var(--light);
    text-align: center;
    /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; */
}

.slide .slideSub {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    row-gap: 20px;
    flex-direction: row;
}

.slide .slideSub h2 {
    font-size: 20px;
    line-height: 24.2px;
    font-weight: 600;
    margin: 10px;
}

.container p {
    /* font-size: f; */
    padding: 10px;
    font-weight: 400;
}

.container p,
.slide p {
    /* font-size: 14px; */
    line-height: 16.94px;
    font-weight: 400;
    align-items: center !important;
    padding: 10px 50px;
}

.slider__button {
    padding: 10px;
}

.serviceBox .slider__track .slide {
    /* background: var(--bgNew) !important; */
}



/* --service--- */

.serviceContiner {
    /* background: #8B8BFE1A; */
    display: flex;
    color: #000;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 20px 90px;
    color: var(--light);
}

.partnerContiner {
    background: var(--light);
    display: flex;
    color: #000;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 20px 52px;
    color: var(--light);
}

.serviceContiner .container h2 {
    color: #000;
}

.serviceContiner .container p {
    color: #000;
    font-size: 18px;
    line-height: 30px;
}

.flexImgLanPricig {
    display: flex;
}

.partnerContiner .container h2 {
    color: #000;
}

.partnerContiner .container p {
    color: #000;
}

.benifitsContiner {
    background: var(--bgNew);
    color: var(--light);
    display: flex;
    align-items: center;
    text-align: center;
    padding: 20px 52px;
}

.serviceBox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
    row-gap: 20px;
}

.benfitsBox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
    row-gap: 20px;
}

.partnerBox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
    row-gap: 20px;
}

.serviceItem {
    width: 292px;
    /* height: 350px; */
    /* aspect-ratio: 1/1; */
    display: flex;
    justify-content: center;
    border: 1px solid #C7C7C7;
    padding: 16px;
    /* align-items: center; */
    /* background: var(--bgNew); */
    border-radius: 5px;
}

.benfitsItem {
    width: 250px;
    height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #0F776B;
}

.partnerItem {
    width: 250px;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
}

.activeBenfits {
    background: #fff !important;
}







.benifitsContiner .container .benfitsBox .activeBenfits .benfitsItemeSub h2,
.benifitsContiner .container .benfitsBox .activeBenfits .benfitsItemeSub p {
    color: #000 !important;
}

.serviceItemeSub,
.benfitsItemeSub,
.partnerItemeSub {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    align-items: center;
    column-gap: 15px;
}

.serviceItemeSub img,
.benfitsItemeSub img {
    aspect-ratio: 1/1;
    object-fit: contain;
    /* width: fit-content; */
    margin-top: 10px;
}

.serviceItemeSub h2,
.benfitsContiner .container .benfitsItemeSub h2 {
    font-weight: 600;
    font-size: 24px;
    line-height: 32.74px;
    width: max-content;

    /* height: 70px; */
    display: flex;
    /* align-items: center; */
    /* color: var(--light); */
}

.partnerContiner .container .partnerItemeSub h2 {
    font-size: 20px;
    color: #000;
}

.serviceContiner .container .serviceItemeSub p {
    /* color: var(--light); */
    padding: 0 10px;
}

.serviceItemeSub p {
    
    font-size: 16px;
    font-weight: 400;
    line-height: 21.84px !important;
    margin-bottom: 0 !important;
}

.benfitsItemeSub p {
    font-size: 14px;
    color: var(--light);
}


.aboutSectionOne {
    /* background: url("{% static 'img/aboutImgBg.png' %}"); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.dcSectionOne {
    /* background: url(./img/dcBackgroundImg.png); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}


.partnerSectionOne {
    /* background: url(./img/partnerBgImg.png); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.donationSectionOne {
    /* background: url(./img/donationBgImg.png); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.scannerSectionOne {
    /* background: url(./img/scannerBgImg.png); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.ticketSectionOne {
    /* background: url(./img/ticketBgImg.png); */
    height: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.aboutSectionOne h2 {
    font-size: 44px;
    font-weight: 700;
    line-height: 53.25px;
    color: #000;
}

.partnerSectionOne h2 {
    font-size: 44px;
    font-weight: 700;
    line-height: 53.25px;
    color: var(--light);
}

.aboutSectionOne p,
.partnerSectionOne p {
    font-size: 14px;
    font-weight: 500;
    line-height: 16.94px;
    color: var(--light);
    padding: 10px 50px;
}

.aboutsectionTwoP p {
    font-size: 14px;
    font-weight: 500;
    line-height: 16.94px;
    color: #000;
    /* padding: 10px 50px; */
}

.aboutsectionTwo {
    display: flex;
    margin: 20px 52px;
    flex-wrap: wrap;
    column-gap: 15px;

}

.aboutsectionTwoImg {
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.aboutsectionTwoImg img {
    width: -webkit-fill-available;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.aboutsectionTwoP {
    width: 50%;
}

.abtWhat {
    display: flex;
    column-gap: 15px;
    align-items: center;

}

.abtWhat1 {
    font-size: 16px;
    display: flex;
    justify-content: flex-end;
    width: -webkit-fill-available;
    margin: 0 15px;
    column-gap: 10px;
    /* padding: 0px !important; */

}

.abtWhat1 p {
    padding: 0;
}

.partnerItemeSub img {
    width: 100%;
    object-fit: contain;
    background: #B7C6C4;
    aspect-ratio: 1/1;
}

.partnerWorkH2 {
    display: flex;
    justify-content: flex-start;
    width: -webkit-fill-available;
    padding: 0 5px;
}

.partnerItemeSub p {
    padding: 5px;
    text-align: justify;
}

.partnerThird {
    display: flex;
    width: 86%;
    margin: auto;
    margin-top: 5%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* background: #053679;; */
    background-image: url(/static/img/updatefoter1.png);
    padding: 45px 0px;
    border-radius:24px;
    column-gap: 15px;
    row-gap: 10px;
    color: #fff;
}
.partnerThirdnew1{
  display: flex;
  flex-direction:column;
  justify-content: center;
  gap: 20px;
  align-items: center;
  

}
.navup{
    display: flex;
    flex-direction: row;
    padding: 35px 0px;
    justify-content: center;
}

@media (max-width: 1024px) {
    .partnerThird {
        padding: 30px 0;
        column-gap: 10px; /* Reduce gap between elements */
        row-gap: 8px;
    }
}

/* Adjust for mobile screen sizes */
@media (max-width: 600px) {
    .partnerThird {
        padding: 20px 0;
        column-gap: 5px;
        row-gap: 5px;
    }
}
.navup{
    /* background-image: linear-gradient(#F3F7FF,#FDFDFF); */
    background-color: #f3f7ff;
}
.partnerThird h2 {
    font-size: 32px;
    font-weight: 600;
    line-height: 32.73px; 
    color: #053679;
    /* margin-top: 45px; */
}



.partnerThird h1{
    font-size: 40px;
    line-height: 54px;
}


.partnerThird p {
    margin: 0px 145px;
    font-size: 19px;
    font-weight: 500;
    margin-top: 8px;
    line-height: 23.6px;
}


@media (max-width: 1024px) {
    .partnerThird h1 {
        font-size: 32px;
        line-height: 46px;
    }

    .partnerThird p {
        margin: 0px 50px; 
        font-size: 20px;
        line-height: 26px;
    }
}

@media (max-width: 600px) {
    .partnerThird h1 {
        font-size: 28px;
        text-align: center;
        line-height: 40px;
    }

    .partnerThird p {
        margin: 0px 20px;
        text-align: center;
        font-size: 16px;
        line-height: 22px;
    }
}

.partnerThird button {
   
    border: 2px solid #053679;
  
}



.joinForm {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 10px 52px;
    row-gap: 15px;
}

.joinForm form {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 16px;
    width: 35%;
    justify-content: center;
    align-items: center;
}

.joinForm p {
    font-size: 14px;
    font-weight: 500;
    line-height: 16.94px;
}

.joinForm form input {
    border: 1px solid ;
    background-color:#fff;
    padding: 10px;
    color: black;
    width: 550px;
}

.joinForm form input::placeholder {
    color:black;
    line-height: 21.04px;
    size: 16px;
}

.joinForm form input[type=submit] {
    background-color: #053679;
    color: #7474FF;
    border: none;
    border-radius: 5px;
}




.joinFormMin {
    width: minmax(auto, auto) !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 15px;
}


@media (min-width: 601px) and (max-width: 1024px) {
    .joinForm {
        margin: 10px 30px; 
    }

    .joinForm form {
        width: 50%; 
    }

    .joinForm form input {
        width: 400px; 
    }
}

@media (max-width: 600px) {
    .joinForm {
        margin: 5px 15px; 
        
        row-gap: 10px;
    }

    .joinForm form {
        width: 90%;
    }

    .joinForm form input {
        width: 100%; 
        padding: 8px; 
    }

    .joinForm p {
        font-size: 12px; 
    }

    .joinForm form input[type="submit"] {
        width: 100%; 
        padding: 12px;
    }
}

@media (min-width: 1025px) {
    .joinForm {
        margin: 17px 52px;
    }

    .joinForm form {
        width: 35%; 
    }

    .joinForm form input {
        width: 550px;
    }
}








.loginhead{
    /* width: 80%; */
    margin-top: -20%;
}


.demohead{
    width: 80%;

}

@media (max-width: 480px) {
    .demohead {
        
        margin-left: unset !important; 
    }
}

@media (max-width: 1024px) {
    .loginhead {
        width: 90%; 
        margin-top: -10%; 
    }
}

@media (max-width: 768px) {
    .loginhead {
        width: 95%;
        margin-top: -5%; 
    }
}

@media (max-width: 480px) {
    .loginhead {
        width: 83%;
        margin-top: 0%; 
    }
}





/* Default styles (for large screens and desktops) */
.responsive-button {
    width: 36%;
    margin-left: 43%;
    margin-top: -15%;
    padding: 10px 20px; /* You can adjust the padding if needed */
}

/* For tablets (screen width between 768px and 1024px) */
@media (max-width: 1024px) {
    .responsive-button {
        width: 50%;
        margin-left: 25%;
        margin-top: -10%;
    }
}

/* For mobile devices (screen width less than 768px) */
@media (max-width: 768px) {
    .responsive-button {
        width: 70%;
        margin-left: 15%;
        margin-top: -5%;
    }
}

/* For very small mobile screens (screen width less than 480px) */
@media (max-width: 480px) {
    .responsive-button {
        width: 90%;
        margin-left: 5%;
        margin-top: 0%;
    }
}





.loginSection {
    display: flex;
    flex-wrap: wrap;
      /*  height: 90vh; */
}

.loginSectionLeft {
    width: 48%;
    /* background: var(--bgNew); */
    color:white;
    /* background-color: #F5F7FA; */
    display: flex;
    flex-direction: column; 
    justify-content: center;
    align-items: center;
    position: relative;
    padding: 10px;
}

.loginSectionLeft img {
    /* margin-top: -150px; */
    /* width: 64%; */
    object-fit: scale-down;
}

@media (max-width: 600px) {
    .loginSectionLeft img {
       width: 100% !important;
       padding: unset !important;
    }
}
.loginSectionLeftImg {
    width: -webkit-fill-available;
    object-fit: scale-down;
}

.loginSectionlefttext{
    padding: 4%;
}
.newtry{
    font-size: 12px;
    font-weight: 300;
}
.textflex{
    display: flex;
    padding: 2%;
}

.loginSectionRight {
    width: 46%;
    display: flex
;
    flex-direction: column;
    background-color: #fff;
    align-items: center;
    justify-content: center;
    /* background: #075E5433; */
    margin: 2% 3% 5.5% 2%;
    row-gap: 24px;
    border-radius: 24px;
    padding-top: 5%;
}

.demoFIrstName {
    display: flex;
    column-gap: 10px;
    justify-content: space-between;
    /* flex-wrap: wrap; */
}


.loginSectionRight form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 92%;
    padding: 10px;
    margin-left:10%;
}


@media (max-width: 600px) {
    .loginSectionRight form {
        margin-left: unset;
    }
}
@media (max-width: 600px) {
    .secnew1 {
        font-size: unset;
    }
}
@media (max-width: 600px) {
    .secnew2 {
        padding: unset;
    }
}

@media (max-width: 600px) {
    .solbenifits {
       display: none;
    }
}
@media (max-width: 600px) {
    .secnewimg1 {
        width: -webkit-fill-available;
    }
}
@media (max-width: 480px) {
    .greentag{
       width: 86% !important;
    }
}
@media (max-width: 600px) {
    .text-container{
       font-size: unset;
    }
}
.formReset {
    display: grid !important;
    grid-template-columns: repeat (1, minmax(-webkit-min-content, -moz-min-content)) !important;
    padding: 10px 10px !important;
    row-gap: 20px !important;
    width: 82% !important;
}

.loginSectionRight form span {

    row-gap: 10px;

}

.demohead  h2{
    font-size: 35px;
    line-height: 33.9px;

}

.loginSectionRight form span input {
    border: 1px solid #D8D6BF;
    border-radius: 4px;
    box-shadow: 0 0 0 transparent;
    font-size: 16px;
    line-height: 24px;
    outline: transparent;
    padding: 11px 16px;
    transition: border .3s, box-shadow .3s;
    width: 100%;
}


.loginSectionRight a{
    color: #053679;
    /* text-decoration: underline; */
    font-weight: 500;
}


.loginSectionRight form span {

    row-gap: 10px;

}




.formReset input {
    /* padding: 5px;   demo
    border: 1px solid var(--bgNew);
    border-radius: 5px; */
    border: 1px solid #dadce0 !important;
    border-radius: 4px !important;
    box-shadow: 0 0 0 transparent !important;
    font-size: 16px !important;
    line-height: 24px !important;
    outline: transparent !important;
    padding: 11px 16px !important;
    transition: border .3s, box-shadow .3s !important;
    width: 100% !important;
}

.loginSectionRight form span input[type='submit'] {
    background: var(--bgNew);
    color: #fff;
    width: 100%;
}

.loginLog {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    row-gap: 10px;
    margin: 10px;
}

.mainDcSection {
    display: flex;
    column-gap: 10px;
    row-gap: 10px;
    flex-wrap: wrap;
   
    justify-content: space-between;


}

.dcOneLeftSection {
    display: flex;
    flex-direction: column;
    width: 50%;
    /* align-items: center; */
    justify-content: center;
    row-gap: 10px;

}

.dcOneLeftSection div {
    display: flex;
    column-gap: 10px;
    /* flex-direction: column; */

}

.imgDcOneLeftSection {
    display: flex;
    flex-direction: column;
}

.dcOneLeftSection div img {
    aspect-ratio: 1/1;
    object-fit: scale-down;

}

.dcTwoRightSection {

    width: 40%
}


.dcTwoRightSection img {
    width: 80%;
    object-fit: scale-down;
    /* aspect-ratio: 1/1; */
}

.widthThirty {
    width: 35%
}

.widthThirtyLeft {
    display: flex;
    justify-content: flex-end;
}

.widthSixty {
    width: 60%;
    padding: 0px 31px 14px 0px;
}

@media screen and (max-width: 768px) {
    .mainDcSection {
        margin: 20px;
        flex-direction: column;
    }

    .dcTwoRightSection,
    .widthThirty,
    .widthSixty {
        width: -webkit-fill-available !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .dcOneLeftSection {
        width: -webkit-fill-available;
        margin-top: -75px;
    }

}


/* testimonial  */

.shadow-effect {
    background: #fff;
    padding: 20px;
    border-radius: 4px;
    text-align: center;
    border: 1px solid #ececec;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.1), 0 15px 12px rgba(0, 0, 0, 0.02);
}

#customers-testimonials .shadow-effect p {
    /* font-family: inherit; */
    font-size: 17px;
    line-height: 1.5;
    margin: 0 0 17px 0;
    font-weight: 300;
}

.testimonial-name {
    margin: -17px auto 0;
    display: table;
    width: auto;
    background: #3190e7;
    padding: 9px 35px;
    border-radius: 12px;
    text-align: center;
    color: #fff;
    box-shadow: 0 9px 18px rgba(0, 0, 0, 0.12), 0 5px 7px rgba(0, 0, 0, 0.05);
}

#customers-testimonials .item {
    text-align: center;
    padding: 50px;
    margin-bottom: 80px;
    opacity: 0.2;
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#customers-testimonials .owl-item.active.center .item {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}

.owl-carousel .owl-item img {
    transform-style: preserve-3d;
    max-width: 90px;
    margin: 0 auto 17px;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#customers-testimonials.owl-carousel .owl-dots .owl-dot:hover span {
    background: #3190e7;
    transform: translate3d(0px, -50%, 0px) scale(0.7);
}

#customers-testimonials.owl-carousel .owl-dots {
    display: inline-block;
    width: 100%;
    text-align: center;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot {
    display: inline-block;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot span {
    background: #3190e7;
    display: inline-block;
    height: 20px;
    margin: 0 2px 5px;
    transform: translate3d(0px, -50%, 0px) scale(0.3);
    transform-origin: 50% 50% 0;
    transition: all 250ms ease-out 0s;
    width: 20px;
}

.industyBack {
    display: flex;
    flex-direction: column;
}

.industyBack img {
    width: 25px;
    aspect-ratio: 1/1;
    object-fit: scale-down;
}

.serviceUseCase {

    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 96px;
    place-items: flex-start;
    row-gap: 40px;
}

.serviceUseCaseSub {
    display: flex;
    gap: 10px;
    max-width: 370px;

}

.serviceUseCaseImg {
    display: flex;
    margin-top: 10px;
    flex-direction: column;

}

.serviceUseCaseImg img {
    width: 50px;
    aspect-ratio: 1/1;
    object-fit: scale-down;
}



.section3 {
    margin: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}




h2 {
    color: #212121;
    font-size: 32px;
    line-height: 27px;
    font-weight: 500;
}


.dcOneLeftSection h3{
    font-size: 24px;
    font-weight: 500;
    /* line-height: 24px; */
    padding: 0%;
}




@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .mainDcSection {
        column-gap: 8px; /* Slightly reduce column gap */
        row-gap: 30px;   /* Reduce row gap for smaller screens */
        padding: 4%;     /* Adjust padding for tablet screens */
    }
}

@media only screen and (max-width: 767px) {
    .mainDcSection {
        display: block; /* Change to block for single column layout */
        padding: 5%;    /* Increase padding for better spacing on mobile */
        row-gap: 20px;  /* Further reduce the row gap */
    }
}



/* Tablet screens (768px to 1024px) */
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .dcOneLeftSection h3 {
        font-size: 22px; /* Slightly reduce the font size */
       /* line-height: 26px; /* Adjust line height for better readability */
    }

    .dcOneLeftSection p {
        font-size: 16px; /* Reduce paragraph font size */
        line-height: 28px; /* Adjust line height for better spacing */
    }
}

/* Mobile screens (up to 767px) */
@media only screen and (max-width: 767px) {
    .dcOneLeftSection h3 {
        font-size: 26px;
        line-height: 29px;
        text-align: left;
    }

    .dcOneLeftSection p {
        font-size: 14px; /* Smaller font size for mobile */
        line-height: 26px; /* Keep line height readable */
    }
}




h3 {
    font-size: 23px;
    font-weight: 500;
    line-height: 24px;
    padding: 2%;
 
}
.top{
    margin-left: -85%;
    margin-bottom: -8%;
    margin-top: -2.5%;
}

.bottom{
    margin-top: -7%;
    margin-bottom: -2.4%;
    margin-left: 85%;
}


@media (max-width: 600px) {
    .top, .bottom {
        display: none;
    }
}

.section3 .sectionContainer {
    display: flex;
    width: -webkit-fill-available;
    column-gap: 50px;
    align-items: center;
}


.section3 .sectionContainer>ul li {
    cursor: pointer;
    position: relative;
    color: #053679;
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    opacity: 0.5;
    z-index: 99;
    line-height: 21.83px;
    margin-bottom: 23px;
}


.section3 .sectionContainer>ul li::before {
    content: "•";
    font-size: 32px;
    padding-right: 5px;
    color: #053679;
    opacity: 0.5;
    /* Default opacity for circles */
    z-index: 99;
}





.section3 .sectionContainer>ul::before {
    content: '';
    position: absolute;
    top: 190px;
    left: 7px;
    width: 2px;
    height: 355px;
    background-color: #053679;
    transform: translateY(-50%);
    z-index: -1;
    opacity: 0.1;



}




.section3 .sectionContainer>ul li.active::before,
.section3 .sectionContainer>ul li.active {
    color: #053679;
    opacity: 1;
    /* Opacity for the active circle */
}

@keyframes slideInFromBottom {
    0% {
        transform: translateY(100%);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.details {
    opacity: 0;
    display: none;
    transform: translateY(100%);
    /* Initial position, off the screen */
    animation: slideInFromBottom 0.5s ease-in-out;
    /* Added animation property */
}

.details.active {
    opacity: 1;
    display: block;
    transform: translateY(0);
    /* Final position, on the screen */
}





.mainDcSection {
    display: flex;
    column-gap: 10px;
    row-gap: 40px;
    flex-wrap: wrap;
    justify-content: space-between;
    /* background-color: #F5F7FA; */
    /* padding: 3%; */
}

.sectionMainOne h2 {    
    font-weight: 600;
}

.marginZero {
    margin: 0;
    padding: 0 !important;
}

.dcOneLeftSection {
    display: flex;
    flex-direction: column;
    width: 50%;
    justify-content: center;
    row-gap: 10px;
}

.imgWidthSec {
    width: 40%;
    /* height: 375px; */
    object-fit: scale-down;
}

.imgWidthSec img {
    width: 100%;
    aspect-ratio: 1/1;
    /* height: 375px; */
    object-fit: scale-down;
}


.widthSixty {
    width: 55.5%;
    /* padding: 50px; */
}

.dcTwoRightSection {
    width: 45%
}

.dcTwoRightSection img {
    width: 100%;
    object-fit: scale-down;
    aspect-ratio: 1/1;
}

.dcTwoRightSection img {
    width: 100%;
    object-fit: scale-down;

}

.widthThirty {
    width: 40%;
    display: flex;
    align-items: center;
    margin-top: -7%;
    margin-left: 16px;
    padding: 0%;
}

.dcOneLeftSection ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    /* Align items vertically */
}

.dcOneLeftSection ul li {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    /* Align items to start from the top */
}

.dcOneLeftSection ul li::before {
    content: '';
    /* width: 15px; */
    aspect-ratio: 1/1;
    padding: 5px;
    height: 18px;
    /* padding-top: 5px; */
    /* background: url(/img/lslist.png) no-repeat center center; */
    background-size: 300px 100px;
    background: url(/static/img/lslist.png) no-repeat center center;
    background-size: 18px 18px;
    margin-right: 10px;
}





.dcOneLeftSection h2 {
    font-size: 24px;
    font-weight: 600;
}

.dcOneLeftSection p {
    font-size: 17px;
    margin-bottom: 11px;
    /* line-height: 30px; */
}

.flexEnd {
    justify-content: flex-end;
}

.campaignsubDiv {
    display: flex;
    flex-direction: column;
    column-gap: 10px;
    padding: 16px;

}

.campaignsubDivBg {
    background: #F3F3FF;

}

.campaignsubDiv h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 27.28px;
    text-transform: capitalize;
}

.campaignsubDiv p {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

button {
    font-size: 16px;
    border: 2px solid #fff;
    border-radius: 5px;
    padding: 10px 22px;
    background: #fff;
    color: #053679;
    font-weight: 700;
    width: fit-content;
    text-transform: capitalize;
}



@media (min-width: 601px) and (max-width: 1024px) {
    button {
        font-size: 14px; 
        padding: 8px 18px; 
        width: fit-content;
    }
}

@media (max-width: 600px) {
    button {
        font-size: 16px;
        padding: 12px;
        border: 2px solid white;
        width: 100%;
        text-align: center;
    }
}

@media (min-width: 1025px) {
    button {
        font-size: 16px;
        padding: 10px 22px; 
        width: fit-content;
    }
}



























.activeBtn {
    /* background: var(--bgNew); */
    background-color: #053679;
    border-color: white;
    color: #fff;
}


#detailssectionContainer {
    width: 100%;

}

.sectionServGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.sectionServ ul {
    margin-top: 20px;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 40px;

}

.sectionServ ul li {
    display: flex;
    padding: 15px 0;
    border-bottom: 1px solid #B7B7B7;
    font-size: 19px;
    width: 262px;
}

.sectionServ ul li:first-child {
    border-top: 1px solid #B7B7B7;
    font-size: 22px;
}

.secLiServ {
    border-top: 1px solid #B7B7B7;
    font-size: 18px;
    font-weight: 500;

}

.sectionServ{
    /* margin-top: -16%; */
    width: 60%;
    padding: 2%;
}



.sectionServ ul li::before {
    content: '';
    /* Remove content from default marker */
    width: 18px;
    height: 18px;
    padding-top: 5px;
    background: url('/static/img/imgRight.png') no-repeat center center;
    /* Set the marker image */
    background-size: contain;
    /* Ensure the image size is adjusted */
    margin-right: 10px;
    aspect-ratio: 1/1;
    /* Add spacing between marker and text */
}

.sectionServ ul li div h3 {
    font-size: 24px !important;
    line-height: 32.74px;
    font-weight: 600;
}

.sectionServ ul li div p {
    font-size: 14px !important;
    line-height: 19.1px;
    font-weight: 400;
    margin-bottom: 0;
}



.pricing-main {
    display: flex;
    justify-content: center;
    width: 35%;
    padding: 3px;
}



@media (max-width: 1024px) {
    .pricing-main {
        width: 50%; 
    }
}

@media (max-width: 768px) {
    .pricing-main {
        width: 90%;
        flex-direction: column;
    }
}

.pricing-sub1,
.pricing-sub2,
.pricing-sub3 {
    width: 363px;
    height: auto;
    padding: 4px 19px 19px 19px;
    /* border: 1px solid #d0d5dd; */
    /* background-color: #fff; */
    border-radius: 20px;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 3px 2px 0 rgba(0, 0, 0, 0.19);
    margin: 8px;
    /* border-bottom: 5px solid #000079; */
}


@media (max-width: 1024px) {
    .pricing-sub1, .pricing-sub2, .pricing-sub3 {
        width: 300px;
        padding: 15px;
        margin: 10px auto; 
    }
}

@media (max-width: 768px) {
    .pricing-sub1, .pricing-sub2, .pricing-sub3 {
        width: 100%;
        padding: 12px;
        margin: 10px 0; 
    }
}





.express,
.Enterprise,
.Business {
    /* background-color: rgb(3, 3, 67);
    text-align: center;
    padding: 16px;
    border-radius: 42px;
    color: white; */
    background-color: rgb(3, 3, 67);
    margin: 9px 100px;
    text-align: center;
    margin: 9px 77px;
    padding: 16px;
    border-radius: 42px;
    color: white;
}

.text {
    color: blue;
    text-align: center;
}

.text h3,
.text p {
    display: inline-block;
    margin: 5px;
}

.price-body img,
.price-body1 img,
.price-body2 img,
.price-body p,
.price-body1 p,
.price-body2 p {
    display: inline-flex;   
    margin-right: 10px;
    font-weight: 500;
}

.get-started {
    text-align: center;
    border: 1px solid rgb(74, 54, 247);
    border-radius: 8px;
    background-color: #053679;
    width: 321px;
    height: 50px;
    margin-top: 14px;
    padding: 6px;
}


/* Responsive adjustments */
@media only screen and (max-width: 768px) {
    .pricing-main {
        flex-direction: column;
        align-items: center;
    }

    .pricing-sub1,
    .pricing-sub2,
    .pricing-sub3 {
        width: 100%; 
        margin: 20px 0;
    }
    .get-started{
     width: 80%; 
    margin: 20px 30px;
    }
}


/* new */
.faq {
    max-width: 500px;
    margin: 0 auto;
    
}

.question {
    /* margin-bottom: 20px; */
    /* border: 1px solid #ccc; */
    border-radius: 5px;
    overflow: hidden;
    box-shadow: -2px 3px 22px rgb(20 43 66 / 5%);
    transition: 300ms ease-in-out;
    /* margin: 2% 20% 2% 20%; */
    background-color: #f1f5f9;
    margin: 4%;
    /* padding: 10px; */
}
@media (max-width: 600px) {
    .question {
       margin: 3% !important;

    }
}
.questionnewfaq{
    /* background-color: #f3f7ff ; */
    /* margin: 2%; */
}
.flip {
    padding: 15px;

    /* background-color: #F5F7FA; */
    cursor: pointer;
    font-size: 18px;
    line-height: 24px;
}

.panel {
    padding: 20px;
    /* margin-top: -20px; */
    display: none;
    /* background-color: #3d59ab; */
    /* color: #fff; */
}

.submain1{
    padding: 19px;
    display: flex;
    justify-content:center;
}

.popup .popuptext {
    visibility: hidden;
    width: 160px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%; /* Position the popup above the link */
    left: 50%;
    margin-left: -80px;
    opacity: 0;
    transition: opacity 0.3s;
}

.popup .popuptext::after {
    content: "";
    position: absolute;
    top: 100%; /* At the bottom of the tooltip */
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.popup .show {
    visibility: visible;
    opacity: 1;
}


  .whatsapp-icon {
    position: fixed;
    right: 21px;
    bottom: 50px;
    z-index: 1000;
}

.tooltip {
    position: fixed;
    right: 55px;
    bottom: 60px;
    z-index: 1000;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 190px;
    background-color: rgb(42 157 8 / 98%);
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 60px; /* Position the tooltip above the icon */
    right: 60px;
    transform: translateY(50px);
    opacity: 0;
    transition: opacity 0.3s;
} 

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}





.brillionsolution {
    /* background-color: #F5F7FA; */
    /* margin-top: -16%; */
    padding: 2%;
}



@media (min-width: 601px) and (max-width: 1024px) {
    .brillionsolution {
        margin-top: -10%;
        padding: 4%;
    }
}

@media (max-width: 600px) {
    .brillionsolution {
        /* margin-top: -8%; */
        padding: 5%;

    }
}

@media (min-width: 1025px) {
    .brillionsolution {
        padding: 2%; 
    }
}




.solution3grid1{
    display: flex;
    padding: 2%;
}

.solution3grid2{
    display:flex; 
    margin-top: -4%; 
    padding: 2%

}



@media (min-width: 601px) and (max-width: 1024px) {
    .solution3grid1 {
        flex-direction: column;
        padding: 4%;
    }

    .solution3grid2 {
        flex-direction: column; 
        margin-top: 0; 
        padding: 4%; 
    }
}

@media (max-width: 600px) {
    .solution3grid1 {
        flex-direction: column;
        padding: 5%; 
    }

    .solution3grid2 {
        flex-direction: column; 
        margin-top: 0; 
        padding: 5%;
    }
}

@media (min-width: 1025px) {
    .solution3grid1 {
        flex-direction: row; 
        padding: 2%; 
    }

    .solution3grid2 {
        flex-direction: row; 
        margin-top: -4%;
        padding: 2%; 
    }
}






.gridone {
    width: 36%;
    padding: 2%;
    background-color: initial; 
    transition: background-color 0.3s ease;
}



@media (min-width: 601px) and (max-width: 1024px) {
    .gridone {
        width: 50%;
        padding: 3%;
        background-color: initial;
    }
}

@media (max-width: 600px) {
    .gridone {
        width: 100% !important;
        padding: 5%;
        background-color: initial;
    }
}
.headcoil11{
    display: flex;
    flex-direction: row;
}
@media (max-width:480px){
    .headcoil11{
        display: flex;
        flex-direction: column;
    }
}
@media (min-width: 1025px) {
    .gridone {
        width: 36%; 
        padding: 2%;
        background-color: initial;
    }
}







.gridone:hover {
    background-color: white;

}


.gridoneime {
    text-align: center;
    
    padding: 3%;
    border-radius: 20px;
}   


.bgimg-container {
    position: relative;
}

.bgimgoneonone {
    display: none;
}

.bgimgone {
    display: block;
}

.bgimg-container:hover .bgimgone {
    display: none;
}

.bgimg-container:hover .bgimgoneonone {
    display: block;
}
.headicol{
    text-align: left;
    font-weight: 500;
}
@media (max-width:480px){
    .headicol{
        text-align: center;
    }
}
.paratextnew{
    font-weight: 400;
    
}








.heading{
    text-align: center;
}

.heading h2{
    padding: 1%;
    margin-top: 31px;
}


.gridconatent{
    /* text-align: center; */
    column-gap: 4%;
    display: flex;
    width: 100%;
    margin-top:1%;
}

.conatent{
    margin-top: -8%; 
    padding: 45px; 
}


.gridcontone{
    width: 25%;
}


@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .gridconatent {
        flex-direction: column;
        column-gap: 2%;
        width: 90%;
    }

    .conatent {
        margin-top: -5%;
        padding: 8%;
    }

    .gridcontone {
        width: 50%; 
    }
}

@media only screen and (max-width: 767px) {
    .gridconatent {
        flex-direction: column;
        column-gap: 0; 
        width: 100%;
        text-align: center;
    }

    .conatent {
        margin-top: 0%;
        padding: 5%;
    }

    .gridcontone {
        width: 100%; 
    }
}




.footerdata{
    margin-top: -7%;
    background-color: white;
}


.footertext{
    text-align: center;
    padding: 25px;

}



@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .footerdata {
        margin-top: -4%; 
    }

    .footertext {
        text-align: center; 
    }
}

@media only screen and (max-width: 767px) {
    .footerdata {
        margin-top: 0%; 
        padding: 10px 15px; 
    }

    .footertext {
        text-align: center; 
    }
}







  .aboutsectiontwo{
    /* background-color: #DBE6FE; */
  }

  .gridsconatent{
    background-color: #F3F7FF !important;
    width: 28%;
    border-radius: 20px;
   text-align: center;
    padding: 2%;
    box-shadow: #053679;
    /* box-shadow: 10px 16px 29px 10px #4545b51a; */
    /* border-bottom: 5px solid #ffd700; */
  }
 /* .gridsconatent:hover{
    background-color: #35436c;
    color:white;
    
 } */

.aboutsectiontwobody{
    /* margin-top: -15px; */
    display: flex;
    padding: 1.5%;
    column-gap: 2%;
    justify-content: center;
}

.gridtext h4{
    margin-bottom: 2px;
    margin-top: 30px;
    font-size: 24px;
    line-height: 34px;
    text-align: center;
}

.gridtext p{
    font-size: 16px;
    text-align:left;
    line-height: 27px;
    margin-top:10px;
    /* font-weight: 500; */
}
.gridimage h4{
    margin-left: 20px;
    display: flex;
    align-items: center;
}
.gridsconatent{
    background-color: white;
    width: 30%;
    border-radius: 24px;
    padding: 2%;
  }


@media (max-width: 1024px) {
    .aboutsectiontwobody {
        flex-direction: column;
        align-items: center;
        padding: 4%;
        row-gap: 20px; 
    }

    .gridsconatent {
        width: 60%; 
    }

    .gridtext h4 {
        font-size: 22px;
        line-height: 32px;
    }

    .gridtext p {
        font-size: 16px;
        line-height: 24px;
    }
}

@media (max-width: 600px) {
    .aboutsectiontwobody {
        flex-direction: column;
        padding: 5%;
    }

    .gridsconatent {
        width: 100%; 
    }

    .gridtext h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .gridtext p {
        font-size: 15px;
        line-height: 22px;
    }
}





.aboutusfooter{
    /* margin-top: 2%; */
    padding: 2% 5% 5% 5%;
    display: flex;
    column-gap: 2%;
}
.aboutusfooterbody{
    width: 31%;
    text-align: center;
    border-radius: 20px;
    /* border:2px solid #000079; */
    /* background-color: #F5F7FA; */
    /* box-shadow: 0px 6px 0px 0px #053679; */
}

.aboutusfootertext {
    justify-content: center;
}
.sectionusecasenew{
    display: flex;
    flex-direction: row;
    padding: 3%;
}

.aboutusfooterbody p{
    font-size: 17px;
    line-height: 30px;
    margin-top: -20px;
    padding: 7%;
}

@media (max-width: 1024px) {
    .aboutusfooter {
        flex-direction: column; 
        padding: 6%; 
        row-gap: 20px;
    }

    .aboutusfooterbody {
        width: 70%; 
    }

    .aboutusfooterbody p {
        font-size: 16px;
        line-height: 28px;
    }
}

@media (max-width: 600px) {
    .aboutusfooter {
        flex-direction: column;
        padding: 8%; 
    }

    .aboutusfooterbody {
        width: 100% !important;
        margin-top: 45px;
    }

    .aboutusfooterbody p {
        font-size: 14px; 
        line-height: 26px;
        margin-top: 0; 
        padding: 10%; 
    }
}

@media (max-width:480px){
    .nnn{
        display: flex;
        flex-direction: column !important;
    }
}
.aboutusfooterbody{
    width: 50%;
}




.partnerbodypage{
    /* background-color: #F5F7FA; */
}


.partnerbodytext{
    padding: 1%;
    text-align: center;
    margin: 0% 16% 0% 16%;
}


.partnerbodytext h3{ 
    font-size: 32px;
    line-height: 48px;
}


.partnerbodytext p{
    font-size: 18px;
    line-height: 27px;
}

@media (max-width: 1024px) {
    .partnerbodytext {
        margin: 0% 8% 0% 8%; 
        padding: 2%;
    }

    .partnerbodytext h3 { 
        font-size: 28px; 
        line-height: 42px;
    }

    .partnerbodytext p {
        font-size: 16px; 
        line-height: 24px;
    }
}

@media (max-width: 600px) {
    .partnerbodytext {
        margin: 0% 4% 0% 4%; 
        padding: 5%;
    }

    .partnerbodytext h3 { 
        font-size: 22px;
        line-height: 32px;
    }

    .partnerbodytext p {
        font-size: 14px; 
        line-height: 20px;
    }
}






.flip {
    cursor: pointer;
    position: relative;
    padding-right: 20px;
    font-weight: 500;
}

.flip::after {
    content: " +";
    position: absolute;
    right: 21px;
    top: 19px;
}

.flip.active::after {
    content: " -";
}

.panel {
    display: none;
}



hr {
    height: 2px;
    border-width: 0;
    background-color: #e0e0e0;
    margin-top: 6%;
  }



  .hr  hr {
    height: 2px;
    border-width: 0;
    background-color: #e0e0e0;
    margin-top: 6%;
  }



.partnerbodytwo{
    background-color: white;
}
 .partnerbodyinfo{
    text-align: center;
 }

.partnerfooterPtext p{
    font-size: 14px;
    line-height: 18.9px;
}

 

 .partnerbodyinfo h3{
    font-size: 32px;
    line-height: 48px;
 }

 .paddingelement{
    /* padding: 1%; */
    /* width: 132%;
    margin: 0px 0px 0px -100px; */
}

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .paddingelement {
        padding: 2%;  
        width: 600px;
    }
}

@media only screen and (max-width: 767px) {
    .partnerbodyinfo h3 {
        font-size: 18px;
        line-height: 48px;
    }
    .partnerfooterPtext p {
        font-size: 15px;
        line-height: 27px;
        text-align: center;
    }
    
    
    .paddingelement {
        margin-left: -76px;
        padding: 5%;
        width: 182%; 
    }
}

.partnerfooterPtext{
    margin: 0% 20%;
}

.partnerfooterPtext p{
    font-size: 18px;
    line-height: 27px;
}


.partnerfooterfoot{
    display: flex;
    margin: 0% 15%;
    padding: 1%;
}




/* new css for sildering*/

.slide-center {
    width: fit-content;
    margin: 30px;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateX(calc(68% - 130px));
  }
  .slider {
    width: fit-content;
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.25s ease-in-out;
  }
  .slide {
    width: 140px;
    height: 175px;
    position: relative;
    border-radius: 2mm;
    margin: 0 10px;
    transition: 0.25s;
  }


  .slide::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    box-shadow: inset 5px 5px 15px rgba(255, 255, 255, 0.5);
    border-radius: 2mm;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .desc {
    position: absolute;
    width: 90%;
    height: 60px;
    bottom: 10px;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 10mm;
    background: rgba(0, 0, 0, 0.7);
    font-family: poppins;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    box-sizing: border-box;
    padding: 15px;
    color: white;
    transition: 0.2s;
  }
  .slide .desc {
    opacity: 0;
  }
  .slide.active {
    width: 280px;
    height: 350px;
  }
 
  .slide.active:hover .desc {
    opacity: 1;
  }



  .slide img {
    width: 140px;
    height: 175px;
    border-radius: 2mm;
    -webkit-box-reflect: none;
    transition: 0.25s;
  }
  
  .slide.active img {
    width: 280px;
    height: 350px;
    -webkit-box-reflect: none;
  }
  


  






  .serviceshead {
    display: flex;
    flex-direction: column;
    padding: 5%;
    padding-top: 79px;
    background-color: #F5F7FA;
    height: 450px;
}

/* For tablet screens (between 601px and 1024px) */
@media screen and (max-width: 1024px) {
    .serviceshead {
        padding: 4%;
        padding-top: 60px;
        height: 400px; /* Adjust height for tablets */
    }
}

/* For mobile screens (600px and below) */
@media screen and (max-width: 600px) {
    .serviceshead {
        padding: 3%;
        /* padding-top: 40px; */
        display: flex;
        /* flex-direction: column-reverse; */
        height: auto !important;
    }

}


/* @media screen and (max-width:600px){
    .serviceshead span{
        display: none;
    }

} */



.servicesheadleft {
    width: 100%; 
}

.servicesheadright {
    width: 100%;
}
@media screen and (max-width:600px){
    .servicesheadright {
        /* width: 80%; */
    }

}
@media screen and (max-width:600px){
    .servicesheadright img{
        width: 95%;
        display: none;
    }

}
.servicesheadleft h2 {
    /* color: #000079; */
    font-size: 28px; 
    line-height: 40px;
}

.serviceshead p {
    font-size: 16px;
    line-height: 22px;
}

@media (min-width: 601px) and (max-width: 1024px) {
    .serviceshead {
        flex-direction: row; 
        justify-content: space-between;
    }

    .servicesheadleft,
    .servicesheadright {
        width: 48%;
    }

    .servicesheadleft h2 {
        font-size: 32px; 
        line-height: 48px;
    }

    .serviceshead p {
        font-size: 16px; 
        line-height: 24px; 
    }
}

@media (min-width: 1025px) {
    .serviceshead {
        flex-direction: row; 
    }

    .servicesheadleft {
        width: 56%; 
    }

    .servicesheadright {
        width: 40%;
    }

    .servicesheadleft h2 {
        font-size: 32px;
        font-weight: 700;
        margin-top: 12%;
        line-height: 51.4px;
    }

    .serviceshead p {
        font-weight: 500;
    line-height: 30px;
    font-size: 16px;
    }
}










.campaignbodyheader{
    text-align: center;
    margin: 0% 16% 0% 23%;
    margin-top: 2%;
}




.campaignbodyheader h2{
    font-size: 32px;
    line-height: 43px;

}
@media screen and (max-width:600px){
    .secondsection2{
        display: contents !important;
        margin-left:unset !important;
    }
}
@media screen and (max-width:600px){
    .secondsection2 img{
        
        margin:unset !important;
        display: none
    }
}

@media screen and (max-width:600px){
    .campaignbodyheader h2{
        font-size: 18px;
        font-weight: 600;
        /* line-height: 35px; */
        /* margin: unset !important; */
    }


}
@media screen and (max-width:600px){
    .campaignbodyheader {
        
                margin: unset !important;
    }


}
@media screen and (max-width:600px){
    .dcTwoRightSection img{
        width: 100%;
        object-fit: scale-down;
        display: none;
    
    }


}


.campaignbodyheader p{
    font-size: 18px;
    line-height: 20px;
    font-weight: 400;
    margin-top: 6px;
}


.campaignbodytext h3{
    font-size: 24px;
    line-height: 32.4px;

}




.campaignusecaseconatainer{
    display: flex;
    position: relative;
    
}


.campaignusecaseconatainer img{
    /* width: 90%; */
}

@media screen and (max-width: 600px){
    .campaignusecaseconatainer img{
        width: 90%;
        margin-left: 34px;
    }
    
}



@media screen and (max-width:600px){
    .campaignusecaseconatainer{
        display: flex;
        flex-direction: column-reverse;
        width: 95% !important;
        margin-top: 5% !important;
    }


}
@media screen and (max-width:600px){
    .campaignusecaseconatainer1{
        display: flex;
        flex-direction: column ;
        width: 95% !important;
        margin-top: 5% !important;
    }


}

.twocampaignssectionContainer{
    display: flex;
    margin-top: 2%;
    margin-left: 16%;
}

.productinfoheader{
    margin-top: 3%;
    text-align: center;
    margin-bottom: 2%;
    /* background-color: #f5f7fa; */
    padding: 3%;
}


.productinfoheader p{
    
    padding: 1%;
    font-size: 20px;
    line-height: 27px;

}


.productinfo{
    /* background-color: #f5f7fa; */


}

.productinfoprice{
    margin-top: -8%;
    display: flex;
    padding: 5%;
    /* background-color: #f5f7fa; */
}


@media (max-width: 1024px) {
    .productinfoprice {
        margin-top: 0%; 
        padding: 4%; 
        flex-wrap: wrap; 
    }
}

@media (max-width: 768px) {
    .productinfoprice {
        margin-top: 0%; 
        padding: 3%; 
        flex-direction: column; 
        align-items: center;
    }
}

.get-started hr{
    /* height: 2px; */
    border-width: 0;
    margin-left: -9px;
    width: 283px;
    background-color: #e0e0e0;
    margin-top: 11%;
}

@media screen and (max-width: 1067px) {
    .get-started hr {
        width: 200px; 
        margin-left: -5px; 
        margin-top: 8%; 
    }
}

@media screen and (max-width: 768px) {
    .get-started hr {
        width: 407px;
        margin-left: -38PX;
        margin-top: 11%;
    }
}

@media screen and (max-width: 480px) {
    .get-started hr {
        width: 273px;
        margin-left: -38PX;
        margin-top: 11%;
    }
} 


.price-body{
    margin-top: 6%;
}

.pricelist{
    /* padding: 3%; */
    margin: 14px 0px 10px;
    margin-left: -7px;
    display: flex;
    /* color: #000079; */

}



.campaignusecaseheader{
    text-align:center;
    padding: 5%;
}


@media (max-width: 600px) {
    .campaignusecaseheader h2{
        font-size: 24px;
        line-height: 35px;
       /*  padding: 5%; */
    }
    .servicesheadleft{
        width: 100%;
        text-align: center;

    }
    .servicesheadleft button{
        margin: 10px 10px;
        margin-top: -10px;
    }
}

@media (min-width: 601px) and (max-width: 1024px) {
    .campaignusecaseheader {
        padding: 4%;
    }
}

@media (min-width: 1025px) {
    .campaignusecaseheader {
        padding: 3%;
    }
}








.campaignusecase{
    margin-top: -18%;
}

@media (max-width: 600px) {
    .campaignusecase {
        margin-top: 10%; 
        gap:unset !important;
    }
}

@media (min-width: 601px) and (max-width: 1024px) {
    .campaignusecase {
        margin-top: 5%; 
    }
}

@media (min-width: 1025px) {
    .campaignusecase {
        margin-top: -18%;
    }
}

  


.main-section {
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
}




@media (max-width: 1024px) {
    .main-section {
        width: 85%; /* Reduce width for tablets */
        height: auto; /* Let the height adjust automatically */
        padding: 30px; /* Adjust padding for smaller screens */
        margin-top: 5%; /* Adjust top margin */
        margin-bottom: 5%; /* Adjust bottom margin */
        margin-left: 3%; /* Adjust left margin for better fit */
    }
}

@media (max-width: 768px) {
    .main-section {
        width: 95%; /* Further reduce width for mobile */
        height: auto; /* Auto height for better fit */
        padding: 20px; /* Smaller padding for mobile */
        margin-top: 3%; /* Adjust top margin */
        margin-bottom: 3%; /* Adjust bottom margin */
        margin-left: 2%; /* Adjust left margin */
        flex-direction: column; /* Stack content vertically on mobile */
    }
}



.main-section:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 101.5%;
    /* background-color: #F3B600; */
}


.linewhitetop:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}






.main-sectionfirst{
    /* color: white; */
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    /* margin-top: 7%; */
    /* margin-bottom: 7%; */
    /* margin-left: 5%; */
    display: flex;
} 


.main-sectionfirst ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionfirst ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionfirst ul li img{
    width: 2%;
}


@media screen and (max-width: 1067px) {
    .main-sectionfirst {
        width: 80%;
        height: auto;
        padding: 30px;
        margin-left: 3%;
        margin-top: 5%;
        margin-bottom: 5%;
        flex-direction: column;
    }

    .main-sectionfirst ul {
        margin-left: 0;
    }

    .main-sectionfirst ul li {
        font-size: 16px; 
        padding-left: 30px;
    }
}

@media screen and (max-width: 768px) {
    .main-sectionfirst {
        width: 90%; 
        padding: 20px;
        margin-left: 0;
        margin-top: 3%;
        margin-bottom: 3%;
    }

    .main-sectionfirst ul {
        margin-left: 0; 
    }

    .main-sectionfirst ul li {
        font-size: 14px; 
        margin-bottom: 10px;
        padding-left: 20px;
    }
}

@media screen and (max-width: 480px) {
    .main-sectionfirst {
        width: 95%;
        padding: 15px;
        margin: 2% auto;
        /* margin-top: -40px; */
    }

    .main-sectionfirst ul li {
        font-size: 12px;
        padding-left: 15px;
    }
}






.linewhitetopfirst::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionfirst::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 142.9%;
    /* background-color: #F3B600; */
}


@media screen and (max-width:600px)  {
    .linewhitetopfirst::before, .main-sectionfirst::before {
        display: none;
    }
    
}


@media screen and (max-width:600px)  {
   .linewhitetopsecond::before, .main-sectionsecond::before {
        display: none;
    }
    
}


@media screen and (max-width:600px)  {
    .linewhitetopthree::before, .main-sectionthree::before {
         display: none;
     }
     
 }

 @media screen and (max-width:600px)  {
    .linewhitetopfour::before, .main-sectionfour::before {
         display: none;
     }
     
 }

 @media screen and (max-width:600px)  {
    .linewhitetopfive::before, .main-sectionfive::before {
         display: none;
     }
     
 }

 @media screen and (max-width:600px)  {
    .linewhitetopsix::before, .main-sectionsix::before {
         display: none;
     }
     
 }

 @media screen and (max-width:600px)  {
    .linewhitetopseven::before, .main-sectionseven::before {
         display: none;
     }
     
 }





 
@media screen and (max-width:800px)  {
    .linewhitetopfirst::before, .main-sectionfirst::before {
        display: none;
    }
    
}


@media screen and (max-width:800px)  {
   .linewhitetopsecond::before, .main-sectionsecond::before {
        display: none;
    }
    
}


@media screen and (max-width:800px)  {
    .linewhitetopthree::before, .main-sectionthree::before {
         display: none;
     }
     
 }

 @media screen and (max-width:800px)  {
    .linewhitetopfour::before, .main-sectionfour::before {
         display: none;
     }
     
 }

 @media screen and (max-width:800px)  {
    .linewhitetopfive::before, .main-sectionfive::before {
         display: none;
     }
     
 }

 @media screen and (max-width:800px)  {
    .linewhitetopsix::before, .main-sectionsix::before {
         display: none;
     }
     
 }

 @media screen and (max-width:800px)  {
    .linewhitetopseven::before, .main-sectionseven::before {
         display: none;
     }
     
 }

.main-sectionsecond{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionsecond ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionsecond ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionsecond ul li img{
    width: 2%;
    margin-left: 4px;
}

@media screen and (width: 1440px) {
    .main-sectionsecond ul li img {
        width: 2%; 
        margin-left: 11px;
    }
}



@media screen and (max-width: 1067px) {
    .main-sectionsecond {
        width: 80%;
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionsecond ul li {
        font-size: 16px; 
        padding-left: 30px;
    }

    .main-sectionsecond ul li img {
        width: 4%; 
    }
}

@media screen and (max-width: 768px) {
    .main-sectionsecond {
        width: 90%; 
        margin-left: 2%;
        padding: 20px;
        flex-direction: column; 
    }

    .main-sectionsecond ul {
        margin-left: 0;
    }

    .main-sectionsecond ul li {
        font-size: 14px; 
        padding-left: 25px;
    }

    .main-sectionsecond ul li img {
        width: 6%; 
    }
}

@media screen and (max-width: 480px) {
    .main-sectionsecond {
        width: 100%;
        padding: 15px;
        margin-top: 0px;

    }

    .main-sectionsecond ul li {
        font-size: 12px; 
        padding-left: 20px;
    }

    .main-sectionsecond ul li img {
        width: 4%; 
        margin-left: -16px;
    }
}



.linewhitetopsecond::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionsecond::before{
    content: '';
    position: absolute;
    top: 121px;
    left: 0;
    width: 8px;
    height: 119.5%;
    /* background-color: #F3B600; */
}





.main-sectionthree::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 134.5%;
    /* background-color: #F3B600; */
}



.main-sectionthree{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionthree ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionthree ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionthree ul li img{
    width: 2%;
    margin-left: 4px;
}



@media screen and (width: 1440px) {
    .main-sectionthree ul li img {
        width: 2%; 
        margin-left: 11px;
    }
}

@media screen and (max-width: 1067px) {
    .main-sectionthree {
        width: 80%; 
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionthree ul li {
        font-size: 16px; 
        padding-left: 30px;
    }

    .main-sectionthree ul li img {
        width: 4%;
    }
}

@media screen and (max-width: 768px) {
    .main-sectionthree {
        width: 90%; 
        margin-left: 2%;
        padding: 20px;
        flex-direction: column; 
    }

    .main-sectionthree ul {
        margin-left: 0; 
    }

    .main-sectionthree ul li {
        font-size: 14px; 
        padding-left: 25px;
    }

    .main-sectionthree ul li img {
        width: 6%; 
    }
}

@media screen and (max-width: 480px) {
    .main-sectionthree {
        width: 100%; 
        margin-top: -40px;

        padding: 15px;
    }

    .main-sectionthree ul li {
        font-size: 12px; 
        padding-left: 20px;
    }

    .main-sectionthree ul li img {
        width: 4%;
        margin-left: -15px;
    }
}













.linewhitetopthree::before{
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionthree::before{
    content: '';
    position: absolute;
    top: 160px;
    left: 0;
    width: 8px;
    height: 110.5%;
    /* background-color: #F3B600; */
}



.main-sectionfour::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 134.5%;
    /* background-color: #F3B600; */
}



.main-sectionfour{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionfour ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionfour ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionfour ul li img{
    width: 2%;
}


@media screen and (max-width: 1067px) {
    .main-sectionfour {
        width: 80%;
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionfour ul li {
        font-size: 16px; 
        padding-left: 30px;
    }

    .main-sectionfour ul li img {
        width: 4%;
    }
}

@media screen and (max-width: 768px) {
    .main-sectionfour {
        width: 90%;
        margin-left: 2%;
        padding: 20px;
        flex-direction: column; 
    }

    .main-sectionfour ul {
        margin-left: 0;
    }

    .main-sectionfour ul li {
        font-size: 14px;
        padding-left: 25px;
    }

    .main-sectionfour ul li img {
        width: 6%; 
    }
}

@media screen and (max-width: 480px) {
    .main-sectionfour {
        width: 100%; 
        margin-top: 0px;

        padding: 15px;
    }

    .main-sectionfour ul li {
        font-size: 12px;
        padding-left: 20px;
    }

    .main-sectionfour ul li img {
        width: 4%; 
        margin-left: -16px;
    }
}







.linewhitetopfour::before{
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionfour::before{
    content: '';
    position: absolute;
    top: 185px;
    left: 0;
    width: 8px;
    height: 110.5%;
    /* background-color: #F3B600; */
}



.main-sectionfive::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 134.5%;
    /* background-color: #F3B600; */
}



.main-sectionfive{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionfive ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionfive ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionfive ul li img{
    width: 2%;
    margin-left: 4px;
}


@media screen and (width: 1440px) {
    .main-sectionfive ul li img {
        width: 2%; 
        margin-left: 11px;
    }
}

@media screen and (max-width: 1067px) {
    .main-sectionfive {
        width: 80%;
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionfive ul li {
        font-size: 16px; 
        padding-left: 30px;
    }

    .main-sectionfive ul li img {
        width: 4%;
    }
}

@media screen and (max-width: 768px) {
    .main-sectionfive {
        width: 90%;
        margin-left: 2%;
        padding: 20px;
        flex-direction: column;
    }

    .main-sectionfive ul {
        margin-left: 0; 
    }

    .main-sectionfive ul li {
        font-size: 14px;
        padding-left: 25px;
    }

    .main-sectionfive ul li img {
        width: 6%; 
    }
}

@media screen and (max-width: 480px) {
    .main-sectionfive {
        width: 100%; 
        margin-top: -40px;

        padding: 15px;
    }

    .main-sectionfive ul li {
        font-size: 12px; 
        padding-left: 20px;
    }

    .main-sectionfive ul li img {
        width: 4%;
        margin-left: -16px;
    }
}










.linewhitetopfive::before{
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionfive::before{
    content: '';
    position: absolute;
    top: 230px;
    left: 0;
    width: 8px;
    height: 110.5%;
    /* background-color: #F3B600; */
}




.main-sectionsix::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 134.5%;
    /* background-color: #F3B600; */
}



.main-sectionsix{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionsix ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionsix ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-sectionsix ul li img{
    width: 2%;
}

@media screen and (max-width: 1067px) {
    .main-sectionsix {
        width: 80%; 
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionsix ul li {
        font-size: 16px;
        padding-left: 30px;
    }

    .main-sectionsix ul li img {
        width: 4%; 
    }
}

@media screen and (max-width: 768px) {
    .main-sectionsix {
        width: 90%;
        margin-left: 2%;
        padding: 20px;
        flex-direction: column; 
    }

    .main-sectionsix ul {
        margin-left: 0;
    }

    .main-sectionsix ul li {
        font-size: 14px; 
        padding-left: 25px;
    }

    .main-sectionsix ul li img {
        width: 6%; 
    }
}

@media screen and (max-width: 480px) {
    .main-sectionsix {
        width: 100%;
        margin-top: 0px;

        padding: 15px;
    }

    .main-sectionsix ul li {
        font-size: 12px; 
        padding-left: 20px;
    }

    .main-sectionsix ul li img {
        width: 4%;
        margin-left: -16px;
    }
}












.linewhitetopsix::before{
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 71.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionsix::before{
    content: '';
    position: absolute;
    top: 265px;
    left: 0;
    width: 8px;
    height: 110.5%;
    /* background-color: #F3B600; */
}





.main-sectionseven::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 134.5%;
    /* background-color: #F3B600; */
}



.main-sectionseven{
    color: white;
    width: 65%;
    height: 58%;
    padding: 40px;
    position: relative;
    margin-top: 7%;
    margin-bottom: 7%;
    margin-left: 5%;
    display: flex;
} 


.main-sectionseven ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.main-sectionseven ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}


@media screen and (max-width: 1067px) {
    .main-sectionseven {
        width: 80%; 
        margin-left: 3%;
        padding: 30px;
    }

    .main-sectionseven ul li {
        font-size: 16px; 
        padding-left: 30px;
    }
}

@media screen and (max-width: 768px) {
    .main-sectionseven {
        width: 90%; 
        margin-left: 2%;
        padding: 20px;
        flex-direction: column;
    }

    .main-sectionseven ul {
        margin-left: 0; 
    }

    .main-sectionseven ul li {
        font-size: 14px;
        padding-left: 25px;
    }
}

@media screen and (max-width: 480px) {
    .main-sectionseven {
        width: 100%; 
        margin-top: -40px;

        padding: 15px;
    }

    .main-sectionseven ul li {
        font-size: 12px;
        padding-left: 20px;
    }
}

.singalwhiteline{
    margin: 0px 74px;
    border: 1px solid white;
}















.linewhitetopseven::before{
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 102.3%;
    background-color: #fff;
    opacity: 0.8;

}

.main-sectionseven::before{
    content: '';
    position: absolute;
    top: 0px;
    left: 0;
    width: 8px;
    height: 0%;
    background-color: #F3B600;
}

























.linewhitefourtop:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 20%;
    background-color: #fff;
    opacity: 0.8;

}

.linewhitebottom:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 29%;
    /* bottom: 27%; */
    margin-top: 30.5%;
    background-color: #fff;
    opacity: 0.8;

}

.linewhitefourbottom:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    margin-left: 5%;
    height: 31%;
    /* bottom: 27%; */
    margin-top: 29.7%;
    background-color: #fff;
    opacity: 0.8;
}







@media (max-width: 600px) {
    .main-section {
        width: 90%; 
        padding: 20px;
        margin-left: 0; 
        margin-top: 5%;
        margin-bottom: 5%;
    }

    .main-section:before {
        width: 4px; 
        height: 100%;
    }

    .linewhitetop:before {
        margin-left: 0%; 
    }

    .linewhitebottom:before {
        margin-left: 2%;
    }
}

@media (min-width: 601px) and (max-width: 1024px) {
    .main-section {
        width: 80%; 
        padding: 30px; 
        margin-left: 10%; 
    }

    .main-section:before {
        width: 6px;
    }

    .linewhitetop:before {
        margin-left: 4%; 
    }

    .linewhitebottom:before {
        margin-left: 4%; 
    }
}

@media (min-width: 1025px) {
    
}


@media (min-width: 601px) and (max-width: 1024px) {
    .main-section {
        width: 80%; 
        padding: 30px; 
        margin-left: 10%; 
    }

    .main-section:before {
        width: 6px;
    }

    .linewhitetop:before {
        margin-left: 4%; 
    }

    .linewhitebottom:before {
        margin-left: 4%; 
    }
}

@media (min-width: 1025px) {
    
}




.text-box{
    padding: 1%;
}

.text-box h1 {
    font-size: 32px;
    font-weight: 500;
    line-height: 42.2px;
}

.text-box p {
    font-size: 18px;
    line-height: 27px;
    font-weight: 400;
}
.text-box h4{
    font-size: 16px;
    font-weight: 400;
    border: 2px solid #93BAFD;
    width: max-content;
    padding: 5px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: #fff;
    border-radius: 18px;
}
.text-box ul{
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}


.text-box ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
}

.text-box ul li img{
    width: 2%;

}
@media screen and (max-width: 480px) {
    .text-box h4 {
        width: unset !important; 
    }
}

@media screen and (max-width: 1067px) {
    .main-sectionfirst ul li img {
        width: 4%; 
    }
}

@media screen and (width: 1336px) {
    .main-sectionfirst ul li img {
        width: 2%; 
        margin-left: 11px;
    }
}



@media screen and (max-width: 768px) {
    .main-sectionfirst ul li img {
        width: 6%;
    }
}

@media screen and (max-width: 480px) {
    .main-sectionfirst ul li img {
        width: 4%; 
        margin-left: -19px;
    }
}






.main-section ul {
    margin-top: 12px;
    list-style: none;
    margin-left: -5%;
}

.main-section ul li {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 400;
    position: relative;
    padding-left: 38px;
}
.main-section ul li img{
    width: 2%;
}

.bodyimg {
    margin-right: 5%;
    margin-top: 3%;
    margin-bottom: 30px;
    
}
.bodyimg1{
    /* margin-right: 13%; */
    margin-top: 2%;
    /* margin-left:-10%; */
    /* margin-bottom: 30px; */
}
@media (max-width: 600px) {
    .bodyimg1{
        margin-right: 50%;
    }
    
}
.contcamp{
    margin-top: 4%;
    font-weight: 500;
}




.movingbody {
    display: none;    
    opacity: 0;        
    transform: translateY(100%);
    transition: transform 1s ease, opacity 1s ease; 
}

.movingbody.active {
    display: flex;    
    opacity: 1;          
    transform: translateY(0); 
}

.movingbody.slide-up {
    display: flex;
    opacity: 1;
    transform: translateY(0);  
}

.movingbody.slide-out {
    opacity: 0;
    transform: translateY(-100%);
}


@media (max-width: 600px) {
    .text-box h1 {
        font-size: 26px;
        line-height: 35px;
        padding: 2%; 
    }

    .text-box p {
        font-size: 16px; 
        line-height: 24px;
        padding: 2%;
    }

    .main-section ul {
        margin-left: 0;
    }

    .main-section ul li {
        font-size: 16px;
        padding-left: 25px; 
    }

    .main-section ul li img {
        width: 5%;
    }

    .bodyimg {
        margin-right: auto; 
        margin-top: 5%; 
    }
    
    .movingbody {
        display: block;
    }
}

@media (min-width: 601px) and (max-width: 1024px) {
    .text-box h1 {
        font-size: 28px;
        line-height: 38px;
        padding: 1.5%;
    }

    .text-box p {
        font-size: 17px;
        line-height: 26px;
        padding: 1.5%;
    }

    .main-section ul {
        margin-left: -3%;
    }

    .main-section ul li {
        font-size: 17px;
        padding-left: 30px;
    }

    .main-section ul li img {
        width: 3%;
    }

    .bodyimg {
        margin-right: 3%; 
        margin-top: 6%;
    }
}

@media (min-width: 1025px) {
    /* Default styles apply */
}


.platformsNav1 {
    text-decoration: none;
    color: #000; 
    font-weight: normal;
    
}

.active {
    font-weight: 500;
    color: black;
}

.downArrowListDis {
    display: none;
}


.abouthotesectiontwo{
    /* background-color: #F5F7FA; */
    margin-top: -10%;
}



h4{
    font-size: 24px;
    margin-bottom: 13px;
}


.headerboxright{
    margin-left: 5%;
    width: 30%;
    border-radius: 6px;
    background-color: white;
    box-shadow: 0px -7px 0px 0px #053679;
}
@media (max-width: 600px) {
    .headerboxright{
     width: auto;
     margin-left: unset;
    }
    
}

.headerboxcenter{
    margin-left: 36%;
    width: 30%;
    border-radius: 6px;
    background-color: white;
    box-shadow: 0px -7px 0px 0px #053679;

}
@media (max-width: 600px) {
    .headerboxcenter{
        width: auto;
        margin-left: unset;
    }
    
}


.headerboxleft{
    margin-left: 65%;
    margin-top: -6%;
    width: 30%;
    border-radius: 6px;
    background-color: white;
    box-shadow: 0px -7px 0px 0px #053679;

}
@media (max-width: 600px) {
    .headerboxleft{
        width: auto;
        margin-left: unset;
    }
    
}

.headerbox{
    padding: 6%;
}

.dashed-box {
    width: 75px;
    height: 97px;
    border-right: 4px dashed #e0e0e0;
    border-top: 4px dashed #e0e0e0;
    display: flex;
    justify-content: center;
    margin-left: 35%;
    margin-top: -6%;
    align-items: center;
    opacity: 1;
    z-index: 0.1;
}
@media (max-width: 600px) {
    .dashed-box{
        margin-top: unset;
        border-top: unset;
    }
    
}
.dashed-box-center{
    width: 195px;
    height: 118px;
    border-left: 4px dashed #e0e0e0;
    border-bottom: 4px dashed #e0e0e0;
    display: flex;
    justify-content: center;
    margin-left: 51%;
    align-items: center;
    opacity: 1;

}


.productinfofooter{
    display: flex;
    margin-top: -8%;
    padding: 3%;
    margin-left: 5%;
}

.hotelhelps{
    padding: 2% 0% 0% 0%;
}

.helpimages{
    display: flex;
    /* margin: 10%; */
    justify-content:space-evenly;
    margin-top: 4%;
    width: 100%;

}

.helpimagesone{
    text-align: center;
    /* width: 30%; */
    border-radius: 24px;
    height: fit-content;
    background-color: #E9F0FE;
}


.maindotlinetwo{
    margin-top: 4.6%;
    margin-left: -10.2%;    

}

.maindotlineone{
    margin-top: 4.6%;
    margin-left: -10.2%;
}

.maindotlinethree{
    margin-top: 15.2%;
    margin-left: 1.2%;

}
.dotlineone{
    width: 92px;
    border-bottom: 4px dashed #0000ff6b;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;

}

.helpimagestwo{
    text-align: center;
    /* width: 30%; */
    border-radius: 24px;
    height: fit-content;
    background-color: #E9F0FE;
}


.dotlinetwo{
    width: 90px;
    border-bottom: 4px dashed #0000ff6b;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;

}

.dotlinethree{
    width: 110px;
    border-bottom: 4px dashed #0000ff6b;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;

}


.bodycontent{
    width: 100%;
    /* margin-top: -15%; */
}



.helpimagesthree{
    text-align: center;
    /* width: 30%; */
    border-radius: 24px;
    height: fit-content;
    background-color: #E9F0FE;

}

.hotelfoter{
    text-align: center;
    padding: 3%;
}

.fooetrtextinfo{
    /* background-color: #F5F7FA; */
    background-image: linear-gradient(to bottom,#f5f7fA, #fff);
    width: 25%;
    /* height:45vh; */
    margin-left: 4%;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 3px 2px 0 rgba(0, 0, 0, 0.19);
    /* border:1px solid #D0D5DD; */
    border-radius: 24px;
    color: #053679;
    /* border-bottom: 5px solid #000079; */
}



.fooetrtextinfoone h3 {
    font-size: 18px;
    line-height: 27px;
    padding: 1% 4% 0% 5%;
    font-weight: 500 !important;
    color: #000 !important;
    text-align: left !important;
}

.footerimgtext{
    display: flex;
    padding: 4%;
    /* justify-content: end; */
}

.hotelfoterbody{
    display: flex;
    column-gap: 4%;
}

@media (max-width: 600px) {
    .hotelfoterbody {
        display: flex;
        flex-direction: column;
        /* width: 100%; */
    }
}
@media (max-width: 600px) {
    .fooetrtextinfo{
        margin: 10px;
        width: 100%;
    }
    
}
@media (max-width: 600px) {
    .hotelhelps{
        display: none;
    }
    
}
@media (max-width: 600px) {
    .productinfofooter{
        margin-bottom: 15%;
    }
    
}
.bodytext h5{
    padding: 2%;
    font-size: 20px;
    line-height: 24px;
    padding-left: unset;

}



.bodytext p{
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    text-align: left;
}

.button-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
    column-gap: 4px;
}






.button-container button {
    font-size: 16px;
    border: 2px solid #053679;
    border-radius: 6px;
    padding: 10px 22px;
    background: #053679;
    color: #fff;
    font-weight: 700;
    width: fit-content;
    text-transform: capitalize;
}

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .button-container button {
        font-size: 14px;
        padding: 8px 18px;
        width: 90%; 
        text-align: center;
    }
}

@media only screen and (max-width: 767px) {
    .button-container button {
        font-size: 12px;
        padding: 6px 14px;
        width: 100%;
        text-align: center;
    }
}






@media (min-width: 601px) and (max-width: 1024px) {
    .button-container {
        gap: 15px; 
    }

    .activeBtn {
        padding: 8px 12px; 
        font-size: 14px; 
    }
}

@media (max-width: 600px) {
    .button-container button {
        width: 112%;
        align-items: center;
    }

    .activeBtn {
        margin-top: 11px;
        /* width: 113%; */
        padding: 12px;
        font-size: 16px;
    }
}


#boxwidth button{
    margin-left: 15px;
     width: 105%;
}

@media (max-width: 600px) {
    #boxwidth {
        margin-left: -11px;
        width: 113px;
    }

}


#boxwidthleft button{
    margin-left: 26px; 
    width: 105%;

}




@media (max-width: 600px) {
    #boxwidthleft {
        margin-left: 10px;
        width: 125px;
    }
     button{
        width: 90%;
        margin-left: 20px;

    }

}


@media (max-width: 600px) {
    #boxwidthleft button{
        width: 97%;
        margin-left: 12px;

    }

}

@media (max-width: 600px) {
    .button-container {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .button-container a {
        margin-bottom: 10px;
    }

    .button-container button {
        width: 100%;
        margin-left: 0;
    }

    .activeBtns {
        width: 64%;
        padding: 12px;
        font-size: 16px;
        background-color: #053679;
        color: #fff;
        margin-left: 63px;
    }
}

@media (min-width: 1025px) {
    .activeBtn {
        padding: 10px 20px;
        font-size: 16px;
        width: 118%;
        height: 102%;
    }
}


@media (min-width: 1025px) {
    .activeBtns {
        padding: 10px 20px;
        font-size: 16px;
        background-color: #053679;
        color: #fff;

    }
}




@media (min-width: 1025px) {
    .servicesheadleft button .activeBtn {
        padding: 10px 20px;
        font-size: 16px;
    }
}



.sectionServ1 {
    display: flex;
    justify-content: center;
    /* width: 38%; */
    /* margin-bottom: 21%; */
}

.sectionServ1 img {
    width: 90%; 
    max-width: 800px;
    height: auto; 
}

@media (min-width: 601px) and (max-width: 1024px) {
    .sectionServ1 {
        margin-bottom: 20%; 
    }
}

@media (max-width: 600px) {
    .sectionServ1 {
        margin-bottom: 15%; 
    }

    .sectionServ1 img {
        max-width: 90%;
        margin-top: -111px;
    }
}

@media (min-width: 1025px) {
    .sectionServ1 {
        /* margin-bottom: 26%; */
    }
}






.wrapper {
    position: relative;
    position: relative;
    margin-top: -7%;
    margin-bottom: -9%;
}

  .wrapper i {
    top: 50%;
    height: 50px;
    width: 50px;
    cursor: pointer;
    font-size: 1.25rem;
    position: absolute;
    text-align: center;
    line-height: 50px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 3px 6px rgba(0,0,0,0.23);
    transform: translateY(-50%);
    transition: transform 0.1s linear;
  }
  .wrapper i:active{
    transform: translateY(-50%) scale(0.85);
  }
  .wrapper i:first-child{
    left: 9px;
  }
  .wrapper i:last-child{
    right: 9px;
  }
  .wrapper .carousel{
    display: grid;
    margin-left: 0.7%;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% / 3) - 59px);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    /* gap: 16px; */
    /* border-radius: 8px; */
    scroll-behavior: smooth;
    /* scrollbar-width: none; */
    padding: 14%;
    width: 102%;
}



  .carousel::-webkit-scrollbar {
    display: none;
  }
  .carousel.no-transition {
    scroll-behavior: auto;
  }
  .carousel.dragging {
    scroll-snap-type: none;
    scroll-behavior: auto;
  }
  .carousel.dragging .card {
    cursor: grab;
    user-select: none;
  }
  .carousel :where(.card, .img) {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .carousel .card {
    scroll-snap-align: start;
    height: 342px;
    list-style: none;
    background: #fff;
    cursor: pointer;
    padding-bottom: 15px;
    flex-direction: column;
    border-radius: 8px;
  }
  .carousel .card .img {
    /* background: #8B53FF; */
    height: 100px;
    /* width: 148px; */
    /* border-radius: 50%;*/
  }


  .card .img img {
    /* width: 140px; */
     height: 380%; 
    /* border-radius: 50%; */
    /* object-fit: cover; */
    /* border: 4px solid #fff; */
  }



  .carousel .card h2 {
    font-weight: 500;
    font-size: 1.56rem;
    margin: 30px 0 5px;
  }
  .carousel .card span {
    color: #6A6D78;
    font-size: 1.31rem;
  }




  @media screen and (max-width: 900px) {
    .wrapper .carousel {
      grid-auto-columns: calc((100% / 2) - 9px);
    }
  }
  @media screen and (max-width: 600px) {
    .wrapper .carousel {
      grid-auto-columns: calc((100% / 1) - 9px);
      grid-auto-columns: 144%;
    }
  }


   

.learnmore button {
    font-size: 18px;
    line-height: 23.3px;
    border: 2px solid;
    background-color: #053679;
    color: #fff;

}


.customefooter{
    margin-top: -190px;
    background-color: #F5F7FA;
    padding: 1%;
}


.customefooterhead{
    text-align: center;
    margin: 0px 200px;
   

}


.customefooterbody{
    display: flex;
    margin: 20px 53px 25px 47px;
    padding-top: 2%;
}




.customefooterbodyfirst{
    width: 50%;
    border-radius: 10px;
    padding: 1%;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #47C694;
    border-bottom: 5px solid #47c694;

}
.customefooterbodyfirst:hover{
    background-color: #47C694;
}

.customefooterbodysecond{
    margin-left: 21px;
    width: 50%;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #FF9771;
    border-bottom: 5px solid #ff9771;

}
.customefooterbodysecond:hover{
    background-color: #ff9771;
}
.customefooterbodythree{
    width: 50%;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #afc6479e;
    border-bottom: 5px solid #afc6479e;

}
.customefooterbodythree:hover{
    background-color: #afc6479e;
}
.customefooterbodyfour{
    margin-left: 21px;

    width: 50%;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #7173fff0;
    border-bottom: 5px solid #7173fff0;

}
.customefooterbodyfour:hover{
    background-color: #7173fff0;
}

.customefooterbodyfive{
    width: 50%;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #c647979e;
    border-bottom: 5px solid #c647979e;

}
.customefooterbodyfive:hover{
    background-color: #c647979e;
    color: black;
}


.customefooterbodysix{
    margin-left: 21px;

    width: 50%;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0px -6px 0px 0px #85ff71b3;
    border-bottom: 5px solid #85ff71b3;

}
.customefooterbodysix:hover{
    background-color: #85ff71b3;
}


.custombody{
    padding: 18px;
}
.custombody h2{
    color: #053679; 
    display:flex;
    justify-content:center;
    font-weight:600;
}

.custombody p{
    margin-top: 11px;
    font-size: 15px;
    line-height: 27px;
    font-weight: 500;
    padding-top: 2%;
}


.custombody {
    font-size: 24px;
}



@media (max-width: 1024px) {
    .customefooterhead {
        margin: 0px 100px; 
    }

    .customefooterbody {
        display: flex;
        flex-wrap: wrap; 
        margin: 20px 20px; 
    }

    .customefooterbodyfirst,
    .customefooterbodysecond,
    .customefooterbodythree,
    .customefooterbodyfour,
    .customefooterbodyfive,
    .customefooterbodysix {
        width: 48%;
        margin-bottom: 20px; 
    }
}

@media (max-width: 768px) {
    .customefooter {
        margin-top: -100px; 
        padding: 3%;
    }

    .customefooterhead {
        margin: 0px 20px; 
    }

    .customefooterbody {
        display: block; 
        margin: 0; 
    }

    .customefooterbodyfirst,
    .customefooterbodysecond,
    .customefooterbodythree,
    .customefooterbodyfour,
    .customefooterbodyfive,
    .customefooterbodysix {
        width: 100%;
        margin-left: 0; 
        margin-bottom: 20px;
    }

    .custombody {
        font-size: 20px; 
    }

    .custombody p {
        font-size: 16px;
        line-height: 24px; 
    }
}












.customefootersecond{
    background-color: #fff;
    margin: 40px 50px;

}

.customefootersecondheader{
    text-align: center;
}


.mainbackground{
    display: flex;
    width: 83%;
    margin: 0px 178px;
}

.mainimgsectiontwo{
    width: 474px;
    margin-top: 34px;
}

.mainimgsectionone{
    margin-top: 180px;
    width: 501px;
}

.cutomemaindotlineone{
    margin-top: -43%;
    margin-left: 46%;

}
/* Container styling */
/* Container */
.slider-container {
  width: 100%;
  max-width: 1200px; /* keeps layout centered on large screens */
  margin: -145px auto;
  overflow: hidden;
  position: relative;
  height: auto;
  padding: 10px 0;
}

/* Slider track */
.slider {
  display: flex;
  gap: 40px;
  animation: slide 30s linear infinite;
  align-items: center;
}

/* Images */
.slider img {
  height: 65px;
  width: auto;
  flex-shrink: 0;
  transition: transform 0.3s ease-in-out;
}

.slider img:hover {
  transform: scale(1.05);
}

/* Keyframes for sliding */
@keyframes slide {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* ✅ Tablet View */
@media (max-width: 992px) {
  .slider {
    gap: 25px;
    animation: slide 25s linear infinite;
  }

  .slider img {
    height: 55px;
  }
}

/* ✅ Mobile View */
@media (max-width: 600px) {
  .slider-container {
    padding: 5px 0;
  }

  .slider {
    gap: 20px;
    animation: slide 20s linear infinite;
  }

  .slider img {
    height: 45px;
  }
}

  
.customefootersecond {
  padding: 50px 20px;
  text-align: center;
  background: #f9faff;
}

.customefootersecondheader h2 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 40px;
  color: #24262D;
}

.mainbackground {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
  width: 100%;
  max-width: 1200px;
  margin: auto;
}

.imgsection {
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0px 4px 15px rgba(0,0,0,0.08);
  max-width: 260px;
  flex: 1 1 220px;
  text-align: center;
  position: relative;
}

.imgsection img {
  width: 120px;
  height: auto;
  margin: 0 auto 20px;
}

.imgsection h2 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
}

.imgsection p {
  font-size: 14px;
  font-weight: 500;
  color: #555;
}

.customedotlineone, 
.customedotlinetwo {
  width: 100%;
  max-width: 130px;
  border-bottom: 4px dashed #0000ff6b;
  margin: 20px auto;
  opacity: 1;
}

/* Responsive design */
@media (max-width: 1024px) {
  .customefootersecondheader h2 {
    font-size: 24px;
  }
  .mainbackground {
    gap: 30px;
  }
}

@media (max-width: 768px) {
  .mainbackground {
    flex-direction: row;
    justify-content: center;
    gap: 20px;
  }
  .imgsection {
    max-width: 45%;
  }
}

@media (max-width: 480px) {
  .customefootersecondheader h2 {
    font-size: 20px;
  }
  .imgsection {
    max-width: 100%;
  }
  .customedotlineone,
  .customedotlinetwo {
    max-width: 80px;
  }
}


.imgsectiontext{
    margin-top: 110px;
}


.imgsectiontextone{
    margin-top:110px;
}

.imgsection h2{
    font-size: 24px;
    line-height: 32px;
}


.imgsection p{
    font-size: 18px;
}

.nnn{
    display: flex;
    flex-direction: row;
    margin-top: 5%;
    gap:8%;
    justify-content: space-around;
}



.popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}
.popup-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
}


.blogfirstpart{
    background-color: #f5f7fa;
    padding: 5%;
    display: flex;
    justify-content: center;
}
@media screen and (max-width: 600px) {
    .blogfirstpart {
        display: flex;
        flex-direction: column;
    }
  }

  @media screen and (max-width: 600px) {
    .blogfirstpart img{
        display: none;
    }
  }



.Headerblog{
    /* color: #000079; */
    font-weight: 600;
    display: flex;
    text-align: center;
    justify-content: center;
    padding: 3%;
}
.headerdesblog{
    /* font-weight: 500; */
    display: flex;
    text-align: center;
    justify-content: center;
    line-height:32px;
    margin-left: 5%;
}
.blogsecondpart{
    width: 100%;
    display: flex;
}
.blogsideimg img{
    width: 370px;
}
.similarblog{
    margin-top:6%;
    font-weight: 500;
    font-size: 25px;
}
.hover-imageblog {
    transition: all 0.3s ease;
    filter: grayscale(70%);
  }
  
  .hover-imageblog:hover {
    filter: grayscale(0%);
  }
.sidesubheaderblog{
    display: flex;
    padding: 0% 3% 3% 4%;
    font-weight: 500;
    font-size: 26px;
}
@media screen and (max-width: 600px) {
    .blogsecondpart{
        display: flex;
        width: 100%;
        flex-direction: column;
    }   
}
@media screen and (max-width: 600px) {
    .blogleft{
        display: flex;
        width: 100% !important;
        flex-direction: column;
    }   
}
@media screen and (max-width: 600px) {
    .blogright{
        display: flex;
        width: 100% !important;
        flex-direction: column;
    }   
}
.blogleft{
    width: 70%;
    padding: 4% 5% 9% 9%;
}
.bloglefthead{
    /* color:#000079; */
    font-size:20px;
    line-height: 40px;
    font-weight: 500;
    margin-top:3%;
}
.subbloglefthead1{
    
    font-size:18px;
    font-weight: 600;
    
}
.subbloglefthead{
    color:#053679;
    font-size:18px;
    font-weight: 600;
    margin-top: 3%;
}
.blogleftcont{
    font-size: 16px;
    margin-top: 8px;
    line-height: 30px;
    font-weight: 400;
}
.blogright{
    width: 30%;
    padding: 3%;

}
.blogdemo{
    background-color: #f5f7fa;
    padding: 10% 3% 10% 12%;
}
.blogbtn{
 background-color: #053679;
 margin-top:5%;
 color:white;
 cursor: pointer;

}
.sidehead{
    line-height: 120%;
    font-weight: 600;
}

/* Container styling */
.text-container {
    font-size: 16px; /* Adjust size as needed */
    
    display: flex;
    align-items: center;
    
  }
  
  /* Animation container */
  .changing-text {
    display: inline-block;
    margin-left:2px;
    height: 1.2em;
    font-weight: bold; 
    overflow: hidden; 
    position: relative;
    width: 33%;
    color: #000079;
    text-decoration-style:dotted;
    margin-bottom: -3px; 
  }
  
  
  .changing-text span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; 
    text-align: left;
    opacity: 0; 
    transform: translateY(100%); 
    animation: slide-up 15s infinite;
  }
  
  
  .changing-text span:nth-child(1) {
    animation-delay: 0s;
  }
  .changing-text span:nth-child(2) {
    animation-delay: 3s;
  }
  .changing-text span:nth-child(3) {
    animation-delay: 6s;
  }
  .changing-text span:nth-child(4) {
    animation-delay: 9s;
  }
  .changing-text span:nth-child(5) {
    animation-delay: 12s;
  }
  
  
  @keyframes slide-up {
    0%, 20% {
      opacity: 1; /* Visible */
      transform: translateY(0); /* Stay in place */
    }
    25%, 100% {
      opacity: 0; /* Fade out */
      transform: translateY(-100%); /* Slide up */
    }
  }
  
.greentag{
    border: 1px solid #DBE6FE1A;
    border-radius: 12px;
    background-color: #dbe6fe;
    padding: 1%;
    width: 56%;
    padding-left: 2%;
    
}
.solutionsname{
    width: 15%;
    padding: 2%;
    background-color: #E9F0FE;
    color: #000;
    border-radius: 20px 20px 20px 20px;
    font-weight: 600;
}

.learnmorenew{
    margin-bottom:unset;
    margin-left:6px;
    /* text-decoration: underline; */
    color:#053679;
    font-size:14px;
    line-height: 21px;

}
.headerh2new{
    font-weight: 600;
    /* color:#000079; */
    font-size:34px;
}
.priceplanhead{
    display: flex;
    justify-content:center;
    /* color:#053679; */
    background-color: #f3f7ff;
    /* width: max-content; */
    /* border-radius: 0px 20px 20px 0px; */
    margin-left: -19px;
    margin-right: -19px;
    padding-bottom: 10px;
    padding-top: 5px;
    font-weight: 500;
    font-size: 24px;
    padding-left: 6%;
    padding-right: 18px;
    margin-top: 16px;
    border-top: 2px solid #053679;
}
.btnFlexnew{
    display: flex;
    column-gap: 20px;
}
@media screen and (max-width: 600px) {
    .btnFlexnew{
        display: flex;
        column-gap: 1px;
        justify-content: center;
        /* flex-direction: column; */
    }
    
}
.newbutton{
    width: 194px;
    height: 48px;
    border-radius: 8px;
    color: #fff;
    background-color: #053679;
    border-color: #053679;
}
.newbutton1{
    width: 194px;
    height: 48px;
    border-radius: 8px;
    background-color: unset;
    border-color: #053679;
}
.sect31img{
    display: flex;
    justify-content:center;
}
.sect31img1{
    display: flex;
    justify-content:center;
    margin-bottom: 30px;
}
/* Banking CSS */
.firstsection{
    display: flex;
    flex-direction: row;
    /* padding-bottom: 5%; */
    /* background-image: linear-gradient(#DBE6FE, #F3f7ff); */
}
.firstsection1{
    display: flex;
    flex-direction: column;
    padding: 8% 0% 4% 4%;
    /* height: 89vh !important;
    background-color: white;
    justify-content: center; */
    
}
.firstsection1 h1{
    /* margin-top:18%; */
    color: black;
    font-weight: 600;
    /* text-align: center; */
    font-size: 40px;
    line-height: 60px;

}
.firstsection1 p{
    font-weight: 500;
    line-height: 30px;
    
    font-size:16px;
    
    display: flex;
    /* justify-content: center; */
}
.secondsectionmain{
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
}
.scndsecsubcont{
    /* background-color: #fff; */
    padding: 10px;
    border-radius: 24px;
}
.scndsecsubcont h3{
    background-color: #fff;
    padding: 10px;
    border-radius: 24px;
    text-align: center;
    font-size: 17px;
}
.thirdsectionsubsub2 h4{
    font-weight: 500;
    margin-bottom: 8px !important;
    border-bottom: 4px solid #DBE6FE;
    /* background-color: #DBE6FE; */
    width: max-content;
    padding: 8px;
    padding-right: 16px;
    /* border-radius: 0px 24px 24px 0px; */
}
@media screen and (max-width: 600px) {
    .firstsection{
        display: flex;
        
        flex-direction: column;
    }
    
}
@media screen and (max-width: 600px) {
    .firstsection1{
        display: flex;
        width: 100%;
        /* flex-direction: column; */
    }
    
}
@media screen and (max-width: 600px) {
    .firstsection1 background-image {
        display: flex;
        width: 100%;
        /* flex-direction: column; */
    }
    
}
@media screen and (max-width: 600px) {
    .secondsectionmain{
        display: flex;
        flex-direction: column;
        width: 100%;
    }
}
@media screen and (max-width: 600px) {
    .secondsectionsub1{
        display: flex;
        flex-direction: column;
        width: 100% !important;
        margin-left: unset !important;
    }
    .secondsectionsub2{
        
        margin-left: 12% !important;
    }
    .secondsectionsub3{
        display: flex;
        flex-direction: column;
        width: 100% !important;
    }
}
@media screen and (max-width: 600px) {
    .thirdsectionmain{
        display: flex;
        flex-direction: column;
       
        width: 100%;
    }
}
@media screen and (max-width: 600px) {
    .thirdsectionsub1{
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: unset !important;
        padding: unset !important;
    }
}
@media screen and (max-width: 600px) {
    .sectionfourmain{
        display: flex;
        flex-direction: column;
    }
    
}

.faqnew{
 display: flex;
 justify-content: center;
 padding: 2%;
 font-weight: 600;
 font-size: 30px;
 /* box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 0px 0px, rgba(0, 0, 0, 0.19) 0px 3px 2px 0px; */
}
.integrationcardnew{
    padding: 2%;
    display: flex;
    background-color: #dbe6fe;
    /* margin: 0%; */
    margin-left: -20px;
    margin-right: -20px;
    margin-top: 13px;
    margin-bottom: -19px;
    border-radius: 0px 0px 16px 16px;
}
.secondsectionsub1
{
    display: flex;
    width: 30%;
    flex-direction: column;
    background-color: #E9F0FE;
    /* padding: 10px 50px 50px 50px; */
    margin-left: 5%;
    border-radius: 18px;
    border: 8px solid #DBE6FE;
    gap: 40px;
}
.secondsectionsub1 h3{
    font-weight: 600;
    /* margin-left: -6px; */
    /* color: #000079; */
    
}
.secondsectionsub1 p{
    font-weight: 400;
    line-height: 27px;
    margin-top: 3%;
}
.secondsectionsub3{
    display: flex;
    width: 30%;
    border-radius: 18px;
    background-color: #E9F0FE;
    border: 8px solid #DBE6FE;
    flex-direction: column;
    /* padding: 10px 50px 50px 50px; */
    margin-right: 5%;
    gap: 40px;
}
.secondsectionsub3 h3{
    font-weight: 600;
    /* margin-left: -6px; */
    /* color: #000079; */
}
.secondsectionsub3 p{
    font-weight: 400;
    line-height: 27px;
    margin-top: 3%;
}
.thirdsectionmain{
    display: flex;
    /* flex-direction: row; */
    width: 100%;
    justify-content: space-around;
    margin-top: 4%;
    margin-bottom: 4%;
    /* background-color: #f5f7fa; */
}
.thirdsectionsub1{
    /* width: 50%; */
    /* padding: 7% 0% 4% 7%; */
    margin-left: 20px;
    margin-top:10px;
}
.thirdsectionsub2{
    /* width: 50%; */
    padding: 40px;
    /* margin-bottom: 6%; */
    /* margin-top: 3%; */
    /* background-color: #F3F7FF; */
    border-radius: 40px 0px 0px 40px;
    /* box-shadow: 0px 10px 0px 10px #DBE6FE; */
}
@media screen and (max-width: 600px) {
    .thirdsectionsub2{
        padding: 20px;
    }
    
}
/* .secondsectionsub1 p{
    margin-left: 8px;
}
.secondsectionsub3 p{
    margin-left: 8px;
} */
.sectionfourmain{
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 70px;
    margin-left: 5%;
}
.sectionfoursub1{
    /* width:40%; */
    padding: 40px;
    display: flex;
    gap:30px;
}
.sectionfoursub2{
    /* width: 50%; */
    /* background-color: #fff; */
    background-image:  url(/static/img/bank4secc.png);;
    padding: 50px;
    padding-bottom: 1%;
    padding-left: 14%;
    /* border:2px solid #93bafd; */
    margin-right: 9%;
    border-radius: 20px;
}
.sectionfoursub2 img{
    display: flex;
    margin-left: 42%;
    margin-top: -2%;
}
@media screen and (max-width: 600px) {
    .sectionfoursub1{
        display: flex;
        flex-direction: column;
        width: 100%;
        padding-left: unset !important;
    }
}
@media screen and (max-width: 480px) {
    .solutionsname{
       width: fit-content !important;
    }
}

.sectionfoursub2 p{
    font-weight: 500;
    font-size: 20px;
    margin-top:25px;
    line-height: 34px;
}
.sectionfoursub2 h2{
    font-size:32px;
    font-weight: 600;
    line-height: 48px;
    
}
.sectionfoursub2 h4{
    font-size: 24px;
}
.secondsectionmall{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.secondsectionmall h3{
    color: #000;
    font-weight: 500;
}
@media screen and (max-width: 600px) {
    .secondsectionmall{
        display: flex;
        flex-direction: column;
        width: 100%;
    }   
}
@media screen and (max-width: 600px) {
    .thirdsectionmall{
        display: flex;
        flex-direction: column-reverse;
        width: 100%;
    }   
}

.thirdsectionmall{
    display: flex;
    /* flex-direction: row; */
    width: 100%;
    justify-content: space-between;
}
.thirdmallsub1{
    /* width: 60%; */
    padding: 5%;
    /* background-color: #F3F7FF;
    border-radius: 0px 40px 40px 0px;
    box-shadow: 5px 10px #DBE6FE; */
}
.thirdmallsub1 h2{
   font-size:24px ;
   font-weight: 600;
   line-height: 48px;
   color: #053679;
}
.thirdmallsub1 h5{
    font-size:18px ;
    line-height:43px ;
    font-weight: 500;
}
.thirdmallsub1 p{
    font-size: 18px;
    line-height:37px ;
}
.thirdmallsub2{
    width: 50%;
}
.thirdmallsub2 img{
    width: 352px;
    margin-top: 45px;
    margin-left: 50px;
}
@media screen and (max-width: 600px) {
    .thirdmallsub2 img{
        margin-left: 1px !important;

    }   
}
@media screen and (max-width: 600px) {
    .thirdmallsub1{
        margin-top:10px;

    }   
}
.thirdmallsub1{

}

/* Add underline effect to all the links in the menu */
.underline-effect {
    position: relative;
   
  }
  .underline-effect:hover{
    color: #053679;
  }
  
  
  .underline-effect::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #053679;
    transition: width 0.5s ease-out;
  }
  
  .underline-effect:hover::after {
    width: 72%;
    color: #053679;
  }
  @media (max-width: 768px) {
    .underline-effect::after {
      content: none; /* No underline effect on mobile */
    }
  }
  .underline-effect1 {
    position: relative;
   
  }
  .underline-effect1:hover{
    color: #053679;
  }
  
  
  .underline-effect1::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 3px;
    background-color: #053679;
    transition: width 0.5s ease-out;
  }
  
  .underline-effect1:hover::after {
    width: 100%;
    color: #053679;
  }
  @media (max-width: 768px) {
    .underline-effect1::after {
      content: none; /* No underline effect on mobile */
    }
  }
  .underline-effect2 {
    position: relative;
   
  }
  .underline-effect2:hover{
    color: #053679;
  }
  
  
  .underline-effect2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 8px;
    width: 0%;
    height: 2.5px;
    background-color: #053679;
    transition: width 0.5s ease-out;
  }
  
  .underline-effect2:hover::after {
    width: 70%;
    color: #053679;
  }
  @media (max-width: 768px) {
    .underline-effect2::after {
      content: none; /* No underline effect on mobile */
    }
  }
  .underline-effect3 {
    position: relative;
   
  }
  .underline-effect3:hover{
    color: #000079;
  }
  
  
  .underline-effect3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2.5px;
    background-color: #000079;
    transition: width 0.5s ease-out;
  }
  
  .underline-effect3:hover::after {
    width: 100%;
    color: #000079;
  }
  @media (max-width: 768px) {
    .underline-effect3::after {
      content: none; /* No underline effect on mobile */
    }
  }
  .feature-container {
    position: relative;
    width: 80%; 
    height: 200px; 
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto; 
}
.feature {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    padding: 20px;
    background-color: #dbe6fe;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transform: translateX(100%);
    opacity: 0;
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}

.feature.active {
    transform: translateX(0);
    opacity: 1;
    z-index: 2; 
}

.feature.exiting {
    transform: translateX(-100%);
    opacity: 0;
}

.feature h3 {
    font-size: 26px;
    color: #053679;
    margin-top:-20px;
}

.feature:before {
    content: "“";
    color: #3d59ab;
    font-size: 90px;
    line-height: 1;
    font-family: avenirheavy;
    position: absolute;
    left: 50px;
    
}
@media (max-width: 768px) {
    .feature:before {
        content: none;  
    }
}
.feature p {
    font-size: 20px;
    line-height: 1.4;
}
 .logo-container {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 30px;
        margin-top: 20px;
        padding: 20px;
        margin-bottom: 20px;
        position: relative;
    }
   .logo {
        width: 30px; 
        height: 30px;
        opacity: 0.5; 
        transition: opacity 0.3s ease, transform 0.3s ease;
    }
    .logo.active {
        width: 50px; 
        height: 50px;
        opacity: 1; 
        transform: scale(1.2); 
    }
    .arrow {
        position: absolute;
        width: 20px;
        height: 10px;
        background-color: #000079; 
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        bottom: -15px; 
        left: 15px; 
        display: none; 
        transition: left 0.3s ease; 
    }
    .arrow.active {
        display: block; 
    }

    /* @keyframes slideInFromLeft {
        from {
          transform: translateX(-100%);
          opacity: 0;
        }
        to {
          transform: translateX(0);
          opacity: 1;
        }
      } */
      
      @keyframes slideInFromRight {
        from {
          transform: translateX(100%);
          opacity: 0;
        }
        to {
          transform: translateX(0);
          opacity: 1;
        }
      }
      
      .servicesheadleft {
        animation: slideInFromLeft 1.5s ease-in-out forwards;
      }
      
      .servicesheadright {
        animation: slideInFromRight 1.5s ease-in-out forwards;
      }
     
      [data-animation="blurInFromCenter"] {
        opacity: 0;
        filter: blur(10px); /* Apply the blur */
        transform: scale(0.95); /* Optional: Add a slight scale effect */
        transition: opacity 1s ease-in-out, filter 1s ease-in-out, transform 1s ease-in-out; /* Ensure smooth transitions */
        will-change: opacity, filter, transform; /* Improve performance */
    }
    
    [data-animation="blurInFromCenter"].animate {
        opacity: 1; /* Fully visible */
        filter: blur(0); /* Clear effect */
        transform: scale(1); /* Reset scale */
    }


        [data-animation="cardSlideUp"] {
            transform: translateY(50px);
        }

        [data-animation="cardSlideUp"].animate {
            opacity: 1;
            transform: translateY(0);
        }
        
      
    




.onboardingsection {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: 10px;
    padding: 10px;
    row-gap: 24px;
    
}


.onboardingsection form {
    display: flex;
    flex-direction: column;
    gap: 10px;
   
    padding: 2px 25px 25px 25px; 
}



.onboardingsection form span input {
    border: 2px solid #d0d5dd;
    border-radius: 8px;
    box-shadow: 0 0 0 transparent;
    font-size: 15px;
    font-weight: 500;
    line-height: 24px;
    margin-top:10px;
    outline: transparent;
    padding: 11px 16px;
    transition: border .3s, box-shadow .3s;
    width: 100%;
}


.onboardingsection a{
    color: #000079;
    /* text-decoration: underline; */
    font-weight: bold;
}

@media screen and (max-width: 600px) {
    .onboardingsection{
        display: flex;
        flex-direction: column;
        width: 100%;
    }   
}
@media screen and (max-width: 600px) {
    .fourgridform{
        display: contents !important;
        
        width: 100%;
    }   
}
/* .onboardingsection form span {

    row-gap: 10px;

} */

.onboardingsection form span input[type='submit'] {
    background: var(--bgNew);
    color: #fff;
    width: 100%;
}
.error-message {
    margin-top: 5px;
    display: block;
  }
  

.formgridclass{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 35px;
    margin-top:20px;
    row-gap: 20px;
}
.formgridclass span input {
    border: 2px solid #D8D6BF;
    border-radius: 8px;
    box-shadow: 0 0 0 transparent;
    font-size: 15px;
    font-weight: 500;
    line-height: 24px;
    margin-top: 10px;
    outline: transparent;
    padding: 11px 16px;
    transition: border .3s, box-shadow .3s;
    width: 100%;
}


.fourgridform{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 35px;
    gap:20px;
}

.onbordingseyus h5{
    margin-left: 319px;
    margin-top: -35px;
}
#termsCheckbox {
    transform: scale(1.5); 
    margin-right: 8px;
}


.onbordingseyus a{
    display: inline-block; 
    padding: 5px 5px; 
    background-color: #007BFF; 
    color: white; 
    text-decoration: none; 
    border-radius: 5px; 
    cursor: pointer;

}

.demohead1{
    background-color: #053679;
    padding: 40px;
    color:#fff;
    border-radius: 8px;
}
.demohead1 h2{
    color: #fff;
    display: flex;
    justify-content: center;
    padding:20px;
}
.club2sec{
    display: flex;
    flex-direction: row;
    gap: 32px;
}
.club2sec span{
    display: flex;
    flex-direction: column;
}
.demohead2{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-left: unset !important;
    
}

.mallgradient{
    /* margin-top:-12px; */
    border-radius: 12px;
  background-image: linear-gradient(#F3F7FF, #FDFDFF);
}
.hrmall{
    width: 100%;
    background-image: linear-gradient(#DBE6FE, #F3f7ff);
    border: 1px solid #93BAFD;
}
.mallgradient h3 {
text-align: center;
margin-bottom: 18px;
margin-top: 6px;
}

.solsec1{
    display: flex;
    flex-direction: column ;
}
.solsec1sub{
    display: flex;
    flex-direction: row;
}
.solsec11new{
    display: flex;
    flex-direction: column;
    border: 2px solid #93BAFD;
    padding: 3%;
}
.solsec22new{
    display: flex;
    flex-direction:column;
    border-left: unset;
    margin-left: -10px;
    border: 2px solid #93BAFD;
    padding: 3%;
}
.solsec33new{
    display: flex;
    flex-direction: column;
    border: 2px solid #93BAFD;
    padding: 3%;
    border-top: unset;
}
.solsec11new p{
    margin-top: 10px;
}
.solsec22new p{
    margin-top: 10px;
}
.solsec33new p{
    margin-top: 10px;
}


.partnermain{
    display: flex;
}



  .partnermain {
    display: flex;
    height: 100vh;
    overflow: hidden;
  }


.partnerloginheadbody{
    border: 2px solid;
    border-radius: 22px;
    padding: 37px;
}



  .partnerloginleft {
    flex: 1;
    background-color: #053679;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .partnerloginleft img {
    max-width: 80%;
    max-height: 80%;
    border-radius: 10px;
  }

  .partnerloginright {
    flex: 1;
    background: #Ffff;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .partnerloginhead {
    text-align: center;
    margin-bottom: 30px;
  }

  .partnerloginhead h2 {
    font-size: 28px;
    color: #053679;
    margin: 0;
  }

  .partnermain form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 400px;
    margin: 0 auto;
  }

  .partnermain label {
    font-weight: 500;
    margin-bottom: 5px;
    color: #333;
  }

  .partnermain input[type="text"],
    .partnermain input[type="email"],
  .partnermain input[type="password"],
  .partnermain input[type="Number"] {
    padding: 12px 15px;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-size: 16px;
    width: 100%;
  }


  
  .partnermain input[type="submit"] {
    background-color: #053679;
    color: #fff;
    margin-left: 152px;
    border: none;
    padding: 14px;
    font-size: 16px;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.3s ease;
  }

  .partnermain input[type="submit"]:hover {
    background-color: #042c5d;
  }

  @media (max-width: 768px) {
    .partnermain {
      flex-direction: column;
    }

    .partnerloginleft, .partnerloginright {
      flex: none;
      width: 100%;
      height: auto;
    }

    .partnerloginleft {
      padding: 20px;
    }
  }

.integration_content {
     color: #333333;
     margin: 12px !important
 }

 

 /* Formalls CSS */
 /* FAQ Section Container */
.faq-section {
  max-width: 900px;
  margin: 0 auto;
}

/* FAQ Container */
.faq-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* FAQ Item */
.faq-item {
  border: 1px solid #e1e5f0;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
  background: #fff;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.05);
}

/* FAQ Question Button */
.faq-question {
  width: 100%;
  background: #f7f9ff;
  border: none;
  outline: none;
  text-align: left;
  font-size: 1.1rem;
  font-weight: 600;
  padding: 1rem;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #2c3e50;
  transition: background 0.3s ease;
}

.faq-question:hover {
  background: #e6edff;
}

/* FAQ Icon (+ or –) */
.faq-icon {
  font-size: 1.5rem;
  font-weight: bold;
  transition: transform 0.3s ease;
}

/* Rotate icon when active */
.faq-item.active .faq-icon {
  transform: rotate(45deg);
}

/* FAQ Answer */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.35s ease;
  padding: 0 1rem;
  background: #fff;
  font-size: 0.95rem;
  color: #555;
  line-height: 1.5;
}

/* Show answer when active */
.faq-item.active .faq-answer {
  max-height: 300px; /* enough for most answers */
  padding: 1rem;
}

/* Responsive */
@media (max-width: 576px) {
  .faq-question {
    font-size: 1rem;
    padding: 0.8rem;
  }
  .faq-answer {
    font-size: 0.9rem;
  }
}

/* Formalls */

.features-section {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
    background-color: #F3F7FF;
    padding: 40px 20px;
}

/* Header */
.features-header {
    text-align: center;
}
.features-header h3 {
    color: #24262D;
    font-weight: 700;
    font-size: 32px;
    margin: 0;
    line-height: 1.4;
}
.features-header p {
    font-weight: 500;
    font-size: 18px;
    margin: 10px 0 0 0;
    color: #555;
}

/* Layout rows */
.features-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

/* Feature cards */
.feature-card {
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px;
    border-radius: 8px;
    width: 48%;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
.feature-text {
    flex: 1;
}
.feature-number {
    margin-bottom: 20px;
    width: 40px;
    height: 40px;
}
.feature-card h4 {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 10px 0;
}
.feature-card p {
    margin: 0 0 10px 0;
    font-size: 15px;
    color: #444;
}

/* Feature list */
.feature-list {
    margin-top: 0px;
    padding: 0;
    list-style: none;
    font-size: 14px;
    color: #333;
}
.feature-list li {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Image */
.feature-image {
    height: 180px;
    width: auto;
    margin-left: 20px;
}

/* Responsive */
@media (max-width: 992px) {
    .feature-card {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
    .feature-image {
        margin: 20px 0 0 0;
        align-self: center;
    }
}



/* Fromalls Media Query */
/* =======================================
   MEDIA QUERIES FOR RESPONSIVENESS
   ======================================= */

/* Tablets and smaller desktops (max-width: 992px) */
@media (max-width: 992px) {
  .mainDcSection {
    display: flex;
    flex-direction: column !important;
    padding: 20px !important;
    text-align: center;
  }
  .mainDcSection .col-md-6 {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
  .mainDcSection img {
    width: 100% !important;
    height: auto !important;
  }

  .feature-section {
    height: auto !important;
    padding: 40px 20px !important;
    text-align: center;
  }
  .feature-section .row {
    flex-direction: column !important;
    align-items: center !important;
  }
  .feature-section img {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 20px !important;
  }

  .partnerThird {
    padding: 40px 20px !important;
  }
  .partnerThird p {
    font-size: 1rem !important;
    padding: 0 10% !important;
  }
  .BtnBtm {
    width: 80% !important;
    font-size: 1rem !important;
  }
}

/* Mobile (max-width: 576px) */
@media (max-width: 576px) {
  h2.fw-bold {
    font-size: 1.5rem !important;
  }
  p.text-muted {
    font-size: 0.95rem !important;
  }
  ul.feature-list li {
    font-size: 0.9rem !important;
  }
  .partnerThird h2 {
    font-size: 1.4rem !important;
  }
  .partnerThird p {
    font-size: 1rem !important;
  }
  .BtnBtm {
    width: 90% !important;
    height: 48px !important;
    font-size: 1rem !important;
  }
}



@media screen and (max-width: 600px) {
 .thirdsectionsub1 img{
    display: none;
 }
    
}


.thirdsectionmain {
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    margin: 20px auto;
    gap: 30px;
    max-width: 1200px;
    padding: 20px;
    flex-wrap: wrap; /* allows stacking on smaller screens */
}

.thirdsectionsub1 img {
    max-width: 100%;
    height: auto;
}

.thirdsectionsub2 {
    flex: 1;
    min-width: 280px;
}

.thirdsectionsub2 h3 {
    font-weight: 700;
    font-size: 28px;
    line-height: 36px;
    margin-bottom: 12px;
}

.thirdsectionsub2 p {
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
}

.features-box {
    margin-top: 20px;
    background: #f9faff;
    padding: 16px;
    border-radius: 10px;
}

.features-box h4 {
    font-weight: 500;
    margin-bottom: 12px;
    background-color: #dbe6fe;
    border-radius: 8px;
    display: inline-block;
    padding: 8px 12px;
    font-size: 18px;
}

.features-box p {
    font-weight: 400;
    line-height: 1.8;
    margin-bottom: 10px;
}

.features-box img {
    margin-right: 8px;
    margin-bottom: -5px;
    width: 18px;
    height: 18px;
}

/* --- Responsive styles --- */
@media (max-width: 1024px) {
    .thirdsectionmain {
        flex-direction: column;
        /* text-align: center; */
    }

    .thirdsectionsub2 {
        margin-top: 20px;
    }

    .features-box {
        text-align: left;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .thirdsectionsub2 h3 {
        font-size: 24px;
    }
    .thirdsectionsub2 p {
        font-size: 16px;
        line-height: 24px;
    }
    .features-box h4 {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .thirdsectionmain {
        padding: 10px;
        margin-top: -118px;
    }
    .thirdsectionsub2 h3 {
        font-size: 20px;
    }
    .thirdsectionsub2 p {
        font-size: 15px;
    }
}


.benifits {
  margin-top: -80px;
  padding: 20px;
}

.heading h2 {
  font-weight: 600;
  text-align: center;
  font-size: 28px;
  margin-bottom: 10px;
}

.heading .paratextnew {
  text-align: center;
  margin-bottom: 30px;
  font-size: 16px;
}

.gridconatent {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
}

.gridcontone {
  flex: 1 1 calc(33.33% - 20px);
  max-width: calc(33.33% - 20px);
  background: #f9faff;
  border-radius: 12px;
  padding: 20px;
  /* text-align: center; */
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.gridcontone:hover {
  background: #eef4ff;
  transform: translateY(-5px);
}

.gridcontone img {
  height: 65px;
}

.gridcontone h4 {
  margin-top: 15px;
  font-size: 18px;
  font-weight: 600;
}

.gridcontone p {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
}

/* 📱 Mobile Responsive */
@media (max-width: 1024px) {
  .gridcontone {
    flex: 1 1 calc(50% - 20px);
    max-width: calc(50% - 20px);
  }
}

@media (max-width: 600px) {
  .gridcontone {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .heading h2 {
    font-size: 24px;
  }

  .heading .paratextnew {
    font-size: 14px;
  }

  .gridcontone h4 {
    font-size: 16px;
  }

  .gridcontone p {
    font-size: 14px;
  }
}



.thirdsectionmain {
  display: flex;
  /* align-items: center; */
  justify-content: space-between;
  gap: 40px;
  max-width: 1200px;
  margin: 20px auto;
  padding: 20px;
  flex-wrap: wrap;
    margin-top: -66px;
}

.thirdsectionsub2 {
  flex: 1;
  min-width: 280px;
}

.thirdsectionsub2 h3 {
  font-weight: 700;
  font-size: 31px;
  line-height: 43px;
  margin-bottom: 15px;
}

.thirdsectionsub2 p {
  font-weight: 400;
  font-size: 18px;
  line-height: 27px;
  margin-bottom: 15px;
}

.thirdsectionsubsub2 h4 {
  font-weight: 500;
  font-size: 22px;
  margin-top: 15px;
  display: flex;
  /* align-items: center; */
}

.thirdsectionsubsub2 h4 img {
  margin-right: 8px;
  width: 20px;
  height: 20px;
}

.thirdsectionsubsub2 p {
  font-size: 16px;
  margin-left: 28px; /* aligns with tickmark */
  margin-bottom: 8px;
  line-height: 1.6;
}

.thirdsectionsub1 img {
  max-width: 100%;
  height: auto;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
  .thirdsectionmain {
    flex-direction: column;
    /* text-align: center; */
  }

  .thirdsectionsub2 {
    order: 2;
  }

  .thirdsectionsub1 {
    order: 1;
  }

  .thirdsectionsubsub2 h4 {
    justify-content: center;
  }

  .thirdsectionsubsub2 p {
    margin-left: 0;
  }
}

@media (max-width: 600px) {
  .thirdsectionsub2 h3 {
    font-size: 24px;
    line-height: 32px;
  }

  .thirdsectionsub2 p {
    font-size: 16px;
  }

  .thirdsectionsubsub2 h4 {
    font-size: 18px;
  }

  .thirdsectionsubsub2 p {
    font-size: 14px;
  }
}



.newwww {
  display: flex;
  justify-content: center;
  margin: 20px auto;
  padding: 20px;
}

.campaignusecaseconatainer {
  display: flex;
  align-items: center;
  gap: 40px;
  max-width: 1200px;
  flex-wrap: wrap;
}

.image-box img {
  width: 100%;
  max-width: 451px;
  height: auto;
  border-radius: 12px;
}

.main-sectionfirst {
  flex: 1;
  position: relative;
  z-index: 3;
}


.feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.feature-list li {
  font-size: 18px;
  margin-bottom: 12px;
  position: relative;
  padding-left: 28px;
}

.feature-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #053679;
  font-weight: bold;
}

/* --- Responsive Breakpoints --- */
@media (max-width: 1024px) {
  .campaignusecaseconatainer {
    flex-direction: column;
    text-align: center;
  }

  .image-box img {
    margin: 0 auto 20px;
  }



  .feature-list li {
    font-size: 16px;
    text-align: left;
  }
}

@media (max-width: 600px) {

  .feature-list li {
    font-size: 15px;
  }
}




.newwww {
  display: flex;
  justify-content: center;
  margin: 20px auto;
  padding: 20px;
}

.campaignusecaseconatainer {
  display: flex;
  align-items: center;
  gap: 40px;
  max-width: 1200px;
  flex-wrap: wrap;
}

.image-box img {
  width: 100%;
  max-width: 451px;
  height: auto;
  border-radius: 12px;
}

.main-sectionfirst {
  flex: 1;
  position: relative;
  z-index: 3;
}

.text-box h1 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 15px;
  line-height: 1.3;
}

.text-box .contcamp {
  font-size: 20px;
  line-height: 28px;
  margin-bottom: 20px;
}

.feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.feature-list li {
  font-size: 18px;
  margin-bottom: 12px;
  position: relative;
  padding-left: 28px;
}

.feature-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #053679;
  font-weight: bold;
}

/* --- Responsive Breakpoints --- */
@media (max-width: 1024px) {
  .campaignusecaseconatainer {
    flex-direction: column;
    text-align: center;
  }

  .image-box img {
    margin: 0 auto 20px;
  }

  .text-box h1 {
    font-size: 28px;
  }

  .feature-list li {
    font-size: 16px;
    text-align: left;
  }
}

@media (max-width: 600px) {
  .text-box h1 {
    font-size: 24px;
  }

  .text-box .contcamp {
    font-size: 16px;
    line-height: 24px;
  }

  .feature-list li {
    font-size: 15px;
  }
}



.partnerThird {
  margin: 46px auto 73px auto;
  padding: 45px 20px;
  background-image: url(/static/img/updatefoter1.png);
  background-size: cover;
  background-position: center;
  border-radius: 24px;
  width: 85%;
  overflow: hidden;
  text-align: center;
  color: #fff;
}

.partnerThird h2 {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 15px;
}

.partnerThird p {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 25px;
}

.partnerFeatures {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 30px;
  display: flex;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
}

.partnerFeatures .divider {
  color: #ccc;
}

.BtnBtm {
  background-color: #fff;
  color: #085394;
  border: none;
  width: 280px;
  height: 56px;
  border-radius: 8px;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s;
}

.BtnBtm:hover {
  background-color: #f0f0f0;
}

.btnBtmFlex {
  display: flex;
  justify-content: center;
}

/* --- Responsive Breakpoints --- */
@media (max-width: 1024px) {
  .partnerThird h2 {
    font-size: 28px;
  }
  .partnerThird p {
    font-size: 16px;
  }
  .BtnBtm {
    width: 240px;
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .partnerFeatures {
    flex-direction: column;
    gap: 10px;
  }
  .partnerFeatures .divider {
    display: none;
  }
  .partnerThird h2 {
    font-size: 24px;
  }
}

@media (max-width: 480px) {
  .partnerThird {
    width: 95%;
    padding: 30px 15px;
  }
  .partnerThird h2 {
    font-size: 20px;
  }
  .partnerThird p {
    font-size: 14px;
  }
  .BtnBtm {
    width: 200px;
    height: 50px;
    font-size: 16px;
  }
}


@media (max-width: 480px) {
    .aboutusfooterimg img {
        display: none;

    }
}



/*  */

.thirdsection {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 40px 60px;
  gap: 40px;
}

.thirdsectionsub2 {
  flex: 1;
}

.thirdsectionsub2 h3 {
  font-weight: 700;
  font-size: 24px;
  line-height: 36px;
  margin-bottom: 20px;
}

.thirdsectionsubsub2 h4 {
  font-weight: 500;
  margin: 15px 0 8px;
  font-size: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.thirdsectionsubsub2 p {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 20px;
  color: #333;
  margin-left: 3px;
}

.thirdsectionsubsub2 img {
  width: 18px;
  height: 18px;
}

.thirdsection-image {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.thirdsection-image img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

/* ✅ Tablet View */
@media (max-width: 992px) {
  .thirdsection {
    flex-direction: column;
    text-align: center;
    padding: 30px 30px;
  }

  .thirdsectionsub2 h3 {
    font-size: 22px;
  }

  .thirdsectionsubsub2 h4 {
    justify-content: center;
  }

  .thirdsectionsubsub2 p {
    font-size: 15px;
  }

  .thirdsection-image {
    margin-top: 20px;
  }
}

/* ✅ Mobile View */
@media (max-width: 600px) {
  .thirdsection {
    padding: 20px;
    gap: 20px;
  }

  .thirdsectionsub2 h3 {
    font-size: 20px;
    line-height: 30px;
  }

  .thirdsectionsubsub2 h4 {
    font-size: 16px;
  }

  .thirdsectionsubsub2 p {
    font-size: 14px;
    line-height: 22px;
  }
    .thirdsection-image {
        display: none;
  }

}


/*  */

@media (max-width: 480px) {
    .aboutusfooterbody img{
        display: none;

    }
}


@media (max-width: 600px) {
    .aboutusfooterbody img {
        display: none;

    }
}



/* aaaaa  */

/* Section Wrapper */
.platform-benefits-section {
  margin: 50px auto;
  padding: 20px;
  max-width: 1200px;
}

/* Header */
.platform-benefits-header {
  text-align: center;
  margin-bottom: 30px;
}

.platform-benefits-title {
  font-size: 2rem;
  font-weight: 600;
  color: #24262d;
}

.platform-benefits-title .highlight {
  color: #053679;
}

.platform-benefits-desc {
  margin-top: 10px;
  font-size: 1rem;
  color: #555;
  line-height: 1.6;
  padding: 0 10%;
}

/* Grid */
.platform-benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 25px;
}

/* Card */
.platform-benefit-card {
  background: #dbe6fe85;
  padding: 20px;
  border-radius: 12px;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.platform-benefit-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}

.platform-benefit-img img {
  max-width: 80px;
  margin: 0 auto 15px;
  display: block;
}

.platform-benefit-heading {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 10px;
  color: #24262d;
}

.platform-benefit-text {
  font-size: 0.95rem;
  color: #555;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 768px) {
  .platform-benefits-title {
    font-size: 1.6rem;
  }

  .platform-benefits-desc {
    padding: 0 5%;
    font-size: 0.95rem;
  }

  .platform-benefit-heading {
    font-size: 1rem;
  }

  .platform-benefit-text {
    font-size: 0.9rem;
  }
}

@media (max-width: 480px) {
  .platform-benefits-title {
    font-size: 1.4rem;
  }

  .platform-benefits-desc {
    padding: 0;
    font-size: 0.9rem;
  }

  .platform-benefit-card {
    padding: 15px;
  }

  .platform-benefit-img img {
    max-width: 60px;
  }
}