.regular { font-family: "Space Grotesk", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal;}
.medium { font-family: "Space Grotesk", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }
.semibold {font-family: "Space Grotesk", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; }
.bold { font-family: "Space Grotesk", sans-serif; font-optical-sizing: auto; font-weight: 700; font-style: normal; }
.bold-italic { font-family: "Space Grotesk", sans-serif; font-optical-sizing: auto; font-weight: 700; font-style: italic; font-variation-settings: 'ital' 1;
}
body { font-family: "Space Grotesk", serif !important; color: var(--grayDark); overflow-x: hidden; font-weight: 400; }
.btn{ --bs-btn-font-weight: 500; }
html { font-size: 20px; }


:root{
    --blue: #0076CA;
    --blueDark: #00488A;
    --blueLight: #E5FBFF;    
    --green: #009F8C;
    --greenLight: #00AD98;
    --gray:#666666;
    --grayDark:#333333;
    --grayLight:#F4F4F4;
    
    /* gradients */
    --headingGradient: linear-gradient(270deg, #0076CA 0%, #00B8A2 100%);    
}


a, a:hover { color: inherit;}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {    
    padding-right: 15px;
    padding-left: 15px;
}

@media (min-width: 576px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:90%
    }
}

@media (min-width: 768px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:90%
    }
}

@media (min-width: 992px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:90%
    }
}

@media (min-width: 1366px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1300px
    }
}

@media (min-width: 1600px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1500px
    }
}


/* Utilit classes start */
.font-12 { font-size: 0.75rem; }
/* body {  font-size: 16px; } */
.font-16 { font-size: 1rem; }
.font-18 { font-size: 1.125rem; }
.font-20 { font-size: 1.25rem; }
.font-24 { font-size: 1.5rem; }
.font-26 { font-size: 1.625rem; }
.font-28 { font-size: 1.75rem; }
.font-30 { font-size: 1.875rem; }
.font-36 { font-size: 2.25rem; }
.font-44 { font-size: 2.75rem; }
.font-54 { font-size: 3.25rem; }
.font-60 { font-size: 3.75rem; }

.clrBlue { color: var(--blue) }
.clrBlueDark { color: var(--blueDark) }
.clrGray { color: var(--gray) }

.bgBlueLight { background-color: var(--blueLight); }

.lh-md { line-height: 1.8 }

.headingGradient1 { background: var(--headingGradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}

.borderMineShaftV2 { --bs-border-color: var(--mineShaftV2); }

.btn-primary{ --bs-btn-color: #fff; --bs-btn-bg: var(--blue); --bs-btn-border-color: var(--blue); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--blueDark); --bs-btn-hover-border-color: var(--blueDark); --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--blueDark); --bs-btn-active-border-color: var(--blueDark); }
.btn-secondary{ --bs-btn-color: #fff; --bs-btn-bg: var(--blueDark); --bs-btn-border-color: var(--blueDark); --bs-btn-hover-color: var(--blueDark); --bs-btn-hover-bg: #fff; --bs-btn-hover-border-color: #fff; --bs-btn-active-color: var(--blueDark); --bs-btn-active-bg: #fff; --bs-btn-active-border-color: #fff; }
.btn-white{ --bs-btn-color: #fff; --bs-btn-bg: var(--blueDark); --bs-btn-border-color: var(--blueDark); --bs-btn-hover-color: var(--blueDark); --bs-btn-hover-bg: #fff; --bs-btn-hover-border-color: #fff; --bs-btn-active-color: var(--blueDark); --bs-btn-active-bg: #fff; --bs-btn-active-border-color: #fff; }
.btn-gradient{ --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; --bs-btn-border-color: none;     background-image: linear-gradient(to right, #00B8A2 0%, #0076CA 100%) !important; transition: all 0.2s ease; position: relative; z-index: 1; overflow: hidden; }
.btn-gradient::before { position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background-color: var(--blueDark); z-index: -1; transition: opacity 0.2s ease; opacity: 0; }
.btn-gradient:hover::before { opacity: 1; }
.btn{--bs-btn-padding-x: 1.5rem; --bs-btn-padding-y: 0.55rem; --bs-btn-font-size: 1rem; --bs-btn-line-height: 1.8;}

.py-6 { padding-top: 3rem; padding-bottom: 3rem; }
.pt-6 { padding-top: 3rem; }
.pb-6 { padding-bottom: 3rem; }
.pt-7 { padding-top: 4rem; }
.pb-7 { padding-bottom: 4rem; }

.rounded-24 { border-radius: 1.5rem; }
/* Utilit classes end */

main{ padding-top: 88px; }

/* header, nav start */
header::after { content: ''; position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: rgba(255, 255, 255, 0.70);  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05); backdrop-filter: blur(12.5px); z-index: -1; }
header .row { height: 88px; }
.w-224px { width:224px; }
nav a { text-decoration: none; text-underline-offset: 10px; }
nav a:hover { text-decoration: underline; }
nav a.active { color: var(--green); font-weight: 500; text-decoration: underline; }
nav a.active:hover { cursor: default; }
/* header, nav end */

/* footer start */
footer { background-color: var(--grayLight); color: var(--gray);}
footer a { text-decoration: none; color: var(--gray); }
footer a:hover { text-decoration: underline; }
/* footer end */

/* Home page start */
.banner-bg { background-color: #EFF9FF; position: relative; height: calc(100vh - 88px);}
.banner-bg::after { content: ''; position: absolute; height: 100px; width: 100%; bottom: 0; left: 0; background-image: linear-gradient(to bottom, rgba(0, 113, 194, 0) 0%, rgba(0, 113, 194, 0.15) 100%);}
.gradient-bg { background: url(../images/bg-line.png) repeat, linear-gradient(109deg, rgba(173, 255, 239, 0.50) 0.64%, rgba(241, 252, 255, 0.50) 47.83%, rgba(107, 211, 255, 0.50) 100%) }
@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
    40% { -webkit-transform: translateY(-12px); -moz-transform: translateY(-12px); -ms-transform: translateY(-12px); transform: translateY(-12px); }
    60% { -webkit-transform: translateY(-6px);-moz-transform: translateY(-6px);-ms-transform: translateY(-6px);transform: translateY(-6px); }
}  
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0); }
    40% {-webkit-transform: translateY(-12px);-moz-transform: translateY(-12px);-ms-transform: translateY(-12px);transform: translateY(-12px); }
    60% {-webkit-transform: translateY(-6px);-moz-transform: translateY(-6px);-ms-transform: translateY(-6px);transform: translateY(-6px); }
}
.bounce { -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; animation: bounce 2s infinite; }
.bounce img { rotate: 90deg; height: 50px; width: 50px; opacity: 75%; }
  
.box-links { box-shadow: 0px 10px 20px 0px rgba(0, 118, 202, 0.15); padding: 2.25rem; border-radius: 22px; transition: all 0.2s ease; }
.box-links:hover { box-shadow: 0px 10px 20px 0px rgba(0, 118, 202, 0.5); }
.box-links .ms-auto { transition: all 0.2s ease; }
.box-links:hover .ms-auto { transform: translateX(5px); }
.box-links::after { content:''; position: absolute; height: calc(100% + 4px); width: calc(100% + 4px); top: -2px; left: -2px; background: linear-gradient(111deg, #00B8A2 0%, #0076CA 100%); z-index: -1; border-radius: 24px; transition: all 0.1s linear;}
.box-links:hover::after { height: calc(100% + 8px); width: calc(100% + 8px); top: -4px; left: -4px; border-radius: 26px;}
.card-roadmap li { border: 1px solid #E0E0E0; border-radius: 24px; padding: 2.25rem; margin-bottom: 24px; position: relative; counter-increment: step-counter; }
.card-roadmap > li:before { color: #fff; content: counter(step-counter); font-size: 18px; font-weight: 700; position: absolute; left: -18px; top: 3.125rem; transform: translateY(-50%); height: 36px; width: 36px; border-radius: 50%; text-align: center; line-height: 36px; background-color: var(--blue); }
.bg-abstract1 { background: url(../images/img-bg-abstract2.jpg) center center no-repeat; background-size: cover; }
.stat-box { background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); border-radius: 20px; }
.p-80px { padding: 80px; }
.looking-list li { border-radius: 24px 0px 0px 24px; background: linear-gradient(90deg, #FFF 0%, rgba(255, 255, 255, 0.00) 100%); box-shadow: -10px 0px 20px 0px rgba(0, 118, 202, 0.10); display: flex; align-items:center; padding: 12px; margin-bottom: 16px; position: relative; }
.looking-list li:last-child { margin-bottom: 36px}
.looking-list li > div { height: 52px; width: 52px; border-radius: 12px; background-color: var(--blueLight); display: flex; flex-shrink: 0; align-items: center; justify-content: center; }
.que-img { right: 80px; top: 30px; z-index: 0; position: absolute; }
.gradient-bg2 { background: url(../images/bg-line-opaq.png) repeat, linear-gradient(270deg, #0076CA 0%, #00B8A2 100%) }
.gradient-bg3 { background: url(../images/bg-line.png) repeat, linear-gradient(109deg, rgba(107, 211, 255, 0.50) 0.64%, rgba(223, 243, 255, 0.50) 31.44%, rgba(224, 255, 231, 0.50) 65.22%, rgba(173, 255, 239, 0.50) 100%) }
.card-advantage { border-radius: 8px; padding: 36px; background: #fff; box-shadow: 0px 10px 20px 0px rgba(0, 118, 202, 0.20); position: relative;}
.card-advantage::after { content:''; position: absolute; left: 0; bottom: 0; height: 8px; width: 100%; background: var(--headingGradient); border-radius: 0 0 8px 8px; overflow: hidden;}
.card-advantage::before { content:''; position: absolute; left: 0; bottom: 4px; height: 8px; width: 100%; background: #fff; border-radius: 0 0 8px 8px; z-index: 1;}
.card-advantage > div { background: var(--headingGradient); border-radius: 6px; height: 60px; width: 60px; display: flex; align-items:center; justify-content: center; margin-top: -66px }
.bg-abstract2 { background: url(../images/img-bg-abstract2.jpg) center center no-repeat; background-size: cover; }
.item .title { position: relative; display: block; padding: 25px 16px 25px 16px; cursor: pointer; }
.item .title span { line-height: 24px; }
.item .title .arrow { background: url(../images/icon-more.svg); width: 24px; height: 24px; flex-shrink: 0; }
.item .title .arrow.rotate { background: url(../images/icon-less.svg); }
.item .content { padding: 0 30px 30px 56px; display: none;}
.modal { --bs-modal-width: 640px; }
.modal-content { background-color: var(--blueDark); --bs-modal-border-radius: 40px; }
.modal .btn-gradient::before { background-color: var(--blue); }
.modal .btn-gradient:hover::before { opacity: 1; }
.modal-header { height: 150px; border: none; background: url(../images/moda-header-bg.jpg) center center no-repeat; background-size: cover; --bs-modal-inner-border-radius: 40px; --bs-modal-header-padding: 40px; }
.modal-header h1 { bottom: -6px; }
.modal-header .btn-close { position: absolute; right: 26px; top: 26px; height: auto; width: auto; opacity: 0.75; }
.modal-header .btn-close:hover { opacity: 1; }
.modal-body { --bs-modal-padding:40px; }
.modal-backdrop { --bs-backdrop-bg: #00488A80; backdrop-filter: blur(10px); --bs-backdrop-opacity: 1; }
.modal .form-control { background-color: transparent; border-radius: 0; border: 0; border-bottom: 2px solid rgba(255,255,255,0.25) !important; padding-left: 0; padding-right: 0; font-size: 16px; color: #fff; }
.modal .form-control::-webkit-input-placeholder { color: #fff; opacity: 0.5; }
.modal .form-control::-moz-placeholder { color: #fff; opacity: 0.5; }
.modal .form-control:-ms-input-placeholder { color: #fff; opacity: 0.5; }
.modal .form-control::-ms-input-placeholder { color: #fff; opacity: 0.5; }
.modal .form-control::placeholder { color: #fff; opacity: 0.5; }
.modal .form-control:focus { border-bottom: 2px solid #fff !important; box-shadow: none; }
.capchaContainer { display: flex; align-items: center; }
.capchaContainer p { margin-bottom: 0 ;}
.load_captcha { border: 2px solid rgba(2552,255,255,0.25); height: 50px; width: 50px; display: inline-flex; margin: 0 0 0 10px; border-radius: 3px; }
.load_captcha:hover { background-color: rgba(2552,255,255,0.25); }
.load_captcha img { padding: 10px; filter: invert(1); }
/* Home page end */

/* DiGA page start */
.banner-bg-diga { background-color: #e8f4f4; height: calc(100vh - 88px);}
.content-box { position:relative; width:100%; }
.img-box.left { top:0; right:0; bottom:0; width:calc( 50vw - 15px ); position: absolute; }
.img-box.right { top:-15px; left:-15px; bottom:-15px; width:calc( 50vw - 15px ); position: static; }
.img-box.right::after{ content: ''; position: absolute; left: 0; top: 0; width: 100px; height: 100%; background-image: linear-gradient(to right, #E8F4F3 15%, #E8F4F300 100%); }
.img-box.left::after{ content: ''; position: absolute; right: 0; top: 0; width: 200px; height: 100%; background-image: linear-gradient(to right, #DDF7FF00 0%, #DDF7FF 100% ); }
.card-roadmap-diga { border-radius: 60px; padding: 50px; }
.rounded-60px { border-radius: 60px; }
.diga-guide-box { padding-right: 400px !important; position: relative; padding: 60px; }
.diga-guide { position: absolute; right: 40px; bottom: 20px; transition: all 0.2s ease; }
.diga-guide:hover { bottom:28px }
.list-pre-req { list-style: none; padding: 0; margin: 00; }
.list-pre-req li { margin-bottom: 1rem; background: url(../images/icon-check.svg) 0 9px no-repeat; padding-left: 30px; }
.bg-abstract3 { background:var(--green) url(../images/img-bg-abstract3.png) center center no-repeat; background-size: cover; padding: 60px; }
.banner-bg-pecan { background-color: #DDF7FF; height: calc(100vh - 88px);}
.img-businessman { position: absolute; right: -40px; bottom: 0; }
/* DiGA page end */

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

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

@media screen and (max-width:1399px) {
    html {  font-size: 18px; }
    .p-80px { padding: 60px; }
    .que-img { right: 30px; max-width: 100px;}
}

@media screen and (max-width:1199px) {
    html {  font-size: 16px; }
    .font-16 { font-size: 1rem; } /*15*/
    .font-18 { font-size: 1.133rem; } /*17*/
    .font-20 { font-size: 1.2rem; } /*18*/
    .font-24 { font-size: 1.467rem; } /*22*/
    .font-26 { font-size: 1.6rem; } /*24*/
    .font-28 { font-size: 1.733rem; } /*26*/
    .font-30 { font-size: 1.867rem; } /*28*/
    .font-36 { font-size: 2.133rem; } /*32*/
    .font-44 { font-size: 2.667rem; } /*40*/
    .font-54 { font-size: 3rem; }
    .font-60 { font-size: 3.333rem; } /*50*/
    .diga-guide-box { padding-right: 150px !important; position: relative; padding: 60px; padding-bottom: 140px; }
    .diga-guide-box.diga { padding-right: 200px !important; padding-bottom: 60px; }
    .img-businessman { max-width: 250px; right: -20px;  }
    .diga-guide { right: 20px; bottom: 0; }
    .diga-guide img { max-width: 200px; }
}

@media screen and (max-width:991px) {
    .p-80px { padding: 40px; }
    .que-img { right: 20px; max-width: 80px;}
    .card-roadmap-diga { border-radius: 40px; padding: 35px; }
    .diga-guide-box { padding-right: 200px !important; position: relative; padding: 60px; padding-bottom: 100px; }
    .img-businessman { max-width: 220px; right: -10px; }
    .bg-abstract3 { padding: 40px; border-radius: 40px; }
    .diga-guide { right: 10px; bottom: 0; }
    .banner-bg { height: auto; }
    .banner-bg img { max-height: 500px; }
    .banner-bg-diga, .banner-bg-pecan { height: auto; }
    .bounce { display: none; }    
}

@media screen and (max-width: 767px) {
    html {  font-size: 15px; }
    .font-16 { font-size: 1rem; } /*14*/
    .font-18 { font-size: 1.143rem; } /*16*/
    .font-20 { font-size: 1.214rem; } /*17*/
    .font-24 { font-size: 1.429rem; } /*20*/
    .font-26 { font-size: 1.571rem; } /*22*/
    .font-28 { font-size: 1.714rem; } /*24*/
    .font-30 { font-size: 1.857rem; } /*26*/
    .font-36 { font-size: 2.143rem; } /*30*/
    .font-44 { font-size: 2.571rem; } /*36*/
    .font-54 { font-size: 2.75rem; }
    .font-60 { font-size: 2.857rem; } /*40*/
    .img-box.left, .img-box.right  { top:0px; left:0px; right:0px; bottom:0px; width:100%; position: relative; }
    .img-box.left::after{ content: ''; position: absolute; right: 100%; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to right, #2f7fb0 0%, #2f7fb0 100% ); }
    .img-box.left::before{ content: ''; position: absolute; left: 100%; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to right, #a5deef 0%, #a5deef 100% ); }
    .p-80px { padding: 30px; }
    .que-img { right: 20px; top: 10px; max-width: 60px;}
    .card-roadmap-diga { border-radius: 25px; padding: 25px; }
    .diga-guide-box { padding-right: 30px !important; padding: 30px; padding-bottom: 230px; border-radius: 30px; }
    .img-businessman { max-width: 250px; right: 50%; margin-right: -125px; }
    .bg-abstract3 { padding: 30px; border-radius: 30px; }
    .pt-75vw { padding-top: 75vw; }
    .diga-banner-img { max-height: 500px; object-position: top center; } 
    .navbar { position: absolute; left: 0; width: 100%; justify-content: end; }
    .navbar-collapse { position: absolute; left: 0; top: 69px; width: 100%; background: rgba(255, 255, 255, 0.70);  backdrop-filter: blur(12.5px); text-align: center; justify-content: space-around;}
    nav a { display: inline-block; padding: 20px; font-size: 18px; }
    .navbar-toggler:focus { box-shadow: none; }   
}

@media screen and (max-width:575px) {
    header .row { height: 68px; }
    header .btn-gradient { padding: 4px 8px !important; margin-right: 16px; }
    main { padding-top: 68px; }
    .navbar-collapse { top: 59px; }
    .w-224px { width: 120px; }
    .card-roadmap li img { height: 70px; width: auto; position: absolute; right: 2.25rem; top: 2rem; }
    .card-roadmap li h3 { padding-right: 90px; }
    .card-roadmap > li:before { left: -12px; }
    .p-80px { padding: 20px; }
    .que-img { display: none;}
    .card-roadmap-diga img { max-width: 200px; margin-bottom: 16px; }
    .bg-abstract3 > div { flex-direction: column; text-align: center;}
    .bg-abstract3 > div img { max-width: 100px; }
    .bg-abstract3 > div p { text-align: left;}
    .bg-abstract3 { background:url(../images/img-bg-abstract3-mob.jpg) center center no-repeat; background-size: cover; }
    .img-mobile-hand { max-width: 200px; margin-top: -150px; }
    .diga-guide-box.diga { padding-right: 60px !important; padding-bottom: 260px; }
    .diga-guide { right: 50%; margin-right: -100px; }

}

@media screen and (min-width: 768px) {
}

@media screen and (min-width: 992px) {
    .py-6 { padding-top: 4rem; padding-bottom: 4rem; }
    .pt-6, .pt-lg-6 { padding-top: 4rem !important; }
    .pb-6 { padding-bottom: 4rem; }
    .pt-7 { padding-top: 5rem; }
    .pb-7 { padding-bottom: 5rem; }     
}
@media screen and (min-width: 1200px) {          
    .py-6 { padding-top: 5rem; padding-bottom: 5rem; }
    .pt-6, .pt-lg-6 { padding-top: 5rem !important; }
    .pb-6 { padding-bottom: 5rem; }
    .pt-7 { padding-top: 6rem; }
    .pb-7 { padding-bottom: 6rem; }
}
@media screen and (min-width: 1366px) {
    
}
@media screen and (min-width: 1400px) {
    .py-6 { padding-top: 6rem; padding-bottom: 6rem; }
    .pt-6, .pt-lg-6 { padding-top: 6rem !important; }
    .pb-6 { padding-bottom: 6rem; }
    .pt-7 { padding-top: 9rem; }
    .pb-7 { padding-bottom: 9rem; }
}

.theme-widget { right: -150px !important; }
.theme-widget.open { right: 0px !important; }
.theme-btns { width: 150px; }
.theme-btns button { border: none }
.theme-btns button.active { background-color: var(--blue); color:#fff }



/* form css */

.contactForm button[type=submit] {
    cursor: pointer;
}

h4.agree-text{
    padding: .25rem 1rem .25rem 1rem;
    font-size: 16px;
}
.form-check-input {
    position: absolute;
    margin-top: .15rem;
    margin-left: -1.25rem;
}


.validation {
    color: #ff8080;
    font-size: 13px;
}

 #sendmessage {
    color: #28a745;
    border: 1px solid #28a745;
    display: none;
    text-align: center;
    padding: 15px;
    font-weight: 600;
    margin-bottom: 15px;
    font-size: 16px;
}
#sendmessage.show{
    display: block;
}

 #errormessage {
    color: red;
    display: none;
    border: 1px solid red;
    text-align: center;
    padding: 15px;
    font-weight: 600;
    margin-bottom: 15px;
}
#errormessage.show{
    display: block;
}

.iti--separate-dial-code .iti__selected-dial-code{
    font-size: 16px !important;
}
.iti__flag-box, .iti__country-name{
    color: #000 !important  ;
}

.iti__country-list{
    font-size: 13px !important;
}

.iti__arrow--up {
    border-bottom: 4px solid #ffffff !important;
    border-top: none !important;
  }
.iti__arrow{
    border-top-color:  #fff ;
  }

  .mb-25{
    margin-bottom: 25px;
  }