@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Bold.eot');
    src: url('../fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Bold.woff2') format('woff2'),
        url('../fonts/Lato-Bold.woff') format('woff'),
        url('../fonts/Lato-Bold.ttf') format('truetype'),
        url('../fonts/Lato-Bold.svg#Lato-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Medium.eot');
    src: url('../fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Lato-Medium.woff2') format('woff2'),
        url('../fonts/Lato-Medium.woff') format('woff'),
        url('../fonts/Lato-Medium.ttf') format('truetype'),
        url('../fonts/Lato-Medium.svg#Lato-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Lato';
    src: url('../fontsLato-Regular.eot');
    src: url('../fontsLato-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fontsLato-Regular.woff2') format('woff2'),
        url('../fontsLato-Regular.woff') format('woff'),
        url('../fontsLato-Regular.ttf') format('truetype'),
        url('../fontsLato-Regular.svg#Lato-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
    scroll-padding: var(--scroll-padding, 7rem);
  }
body {
    background: #fff;
    color: #000;
    font-family: 'Lato', sans-serif;
    font-size: 1.8rem;
    color: #0D1963;
}
h1, h2, h3, h4{
    margin: 0;
}
p{
    margin: 0;
    font-size: 1.8rem;
    color: #0D1963;
}
.nopadding {
    padding: 0
}
.w-100{
    width: 100%;
}
.mrg{margin: 0 auto;}
.scroll-top-inner {
    width: 32px;
    height: 32px;
    opacity: .7;
    position: fixed;
    bottom: 80px;
    right: 40px;
    z-index: 9;
    padding: 0;
    cursor: pointer
}

.scroll-top-inner:hover {
    opacity: .9;
    padding: 0
}

.scroll-top-inner .fa-angle-up {
    border: 3px solid #114d89;
    color: #114d89;
    font-size: 25px;
    border-radius: 50px;
    display: block;
    line-height: 1.5;
    text-align: center;
    height: 50px;
    width: 25px;
    vertical-align: top;
}


#overlay-ss{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.82);
    /* backdrop-filter: blur(4px); */
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: .5s ease;
    z-index: 2;
}

.header-sec {
    background: #ffffff;
    width: 100%;
    height: 80px;
    position: fixed;
    z-index: 2;
    padding-top: 10px;
}

.cnt-hdr{
    
}
.navbar-logo {
    float: left;
}
.navbar-logo img{
   width: 180px;
}

nav {
    float: right;
   
}
.header-sec nav ul {
    margin: 0;
    padding: 0;
    display: flex;
}
.header-sec nav ul li {
    list-style: none;
    margin: 10px 0;
}
.header-sec nav ul li a {
    height: 50px;
    line-height: 50px;
    color: #0D1963;
    padding: 0 20px;
    text-decoration: none;
    display: block;
}
.header-sec nav ul li a:hover, .header-sec nav ul li a.active {
 
}
.header-sec .menu-toggle {
    cursor: pointer;
    float: right;
    height: 50px;
    padding-top: 12px;
    box-sizing: border-box;
    width: 30px;
    position: relative;
    top: 0;
    right: 0;
    
}
.bar1, .bar2, .bar3 {
    width: 30px;
    height: 3px;
    background: #000;
    margin: 7px 0;
    transition: 0.4s;
    border-radius: 1px;
}
/* .change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-3px, 4px);
    transform: rotate(-45deg) translate(-3px, 4px);
}
.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-5px, -7px);
    transform: rotate(45deg) translate(-5px, -7px);
} */


.menu-toggle {
    display: block;
    
}
.header-sec nav {
    position: absolute;
    top: 0;
    background: #fff;
    width: auto;
    right:-450px;
    transition: 0.5s;
    height: 100vh;
    z-index: 3;
    /* height: calc(100vh - 50px); */
}

.nav-top{
    padding: 15px;
    font-size: 30px;
    cursor: pointer;
}
.header-sec nav.active {
    right: 0;
}
.header-sec nav ul {
    display: block;
}
.header-sec nav ul li a {
    border-bottom: 1px solid rgba(0,0,0,0.2);
}

/*---Banner---*/
.banner-sec{
    padding-top: 50px;
    position: relative;
    background: rgb(171, 58, 90);
    background: -moz-linear-gradient(90deg, rgba(171, 58, 90, 1) 0%, rgba(42, 32, 118, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(171, 58, 90, 1) 0%, rgba(42, 32, 118, 1) 100%);
    background: linear-gradient(90deg, rgb(167 21 83) 0%, rgba(42, 32, 118, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ab3a5a", endColorstr="#2a2076", GradientType=1);
}

.main-slider{
    overflow: hidden;
}

.main-slider .owl-dots{
    position: absolute;
    right: 20%;
    bottom: 20%;
    -webkit-transform: translate(-50%);
    -moz-transform: translate(-50%);
    transform: translate(-50%);
  }
  .main-slider .owl-dot {
    background-color: #CCC6C6 !important;
    width: 15px;
    height: 15px;
    margin: 0 5px;
    border-radius: 50%;
}

.main-slider .owl-dot.active {
    background-color: #2A2076 !important;
}
.banner-sec img {
    width: 100%;
}

.banner-left{
    position: absolute;
    top: 130px;
    color: #ffffff;
    z-index: 1;
}
.mitra-logo{
    width: 300px !important;
}

.banner-left h3{
    font-size: 2.3rem;
    font-weight: 600;
    margin-top: 20px;
    line-height:30px;
}


.carousel-indicators {
    width: 100%;    
    bottom: 20% !important;
}

.register-form{
    background: #ffffff;
    border-radius: 18px;
    max-width: 500px;
    padding: 20px;
    color: #0D1963;
    text-align: left;
    margin-top: 20px;
    margin-bottom: 30px;
}

.register-form p{
    font-size: 10px;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 0;
}

.register-form .form-title{
    font-size: 20px;
    margin-bottom: 10px;
    color: #2b3278;
    text-transform: uppercase;
    font-weight: 600;
}

.register-form .radio{
    display: flex;
    justify-content: flex-start;
}

.register-form .radio label{
    color: #0D1963;
    font-weight: normal;
    margin-right: 10px;
}


.register-form .checklabel{
    color: #0D1963;
    font-weight: normal;
    font-size: 13px;
    color: #000;
    text-align: left;
    line-height: 15px;
    margin-bottom: 0;

}

.register-form ::placeholder{
    color: #0D1963;
    font-size: 16px;
}

.checkbox label, .radio label {
    padding-left: 0px;
}

input[type="text"] {
  width: 100%;
  border: none;
  border-radius: 7px;
 margin-bottom: 8px;
  outline: none;
  padding: 8px;
  box-sizing: border-box;
  transition: 0.3s;
    font-size: 14px;
}


input{

}
 .divider::before {
    content: "";
    position: absolute;
     top: 9px;
    left: 40px;
    height: 20px;
    width: 1px;
    background: #0D1963;
}

input[type="text"]:focus {
  border-color: dodgerBlue;
  box-shadow: 0 0 8px 0 dodgerBlue;
}

.inputWithIcon input[type="text"] {
  padding-left: 50px;
  height: 40px;
  border: 1px solid #0D1963;
}

.inputWithIcon {
  position: relative;
  /* background: #ccc; */
}


.inputWithIcon.inputIconBg img {
 position: absolute;
    left: 10px;
    top: 8px;
    width: 20px;
}


.register-form .captcha img{
    margin-top: -14px;
width: 100px !important;
margin-left: 20px;


}
.captcha{
    margin-bottom: 0;
}
.captcha-sec{
    display: flex;
    align-items: center;
}

.captcha-sec img{
    left: 0!important;
    top: 0 !important;
}

.captcha-input{
    text-align: right;
}
.captcha-input img{
    position: relative!important;
    top: 0!important;
    left: -15px!important;
}

.register-form .inputWithIcon .c-input{
  padding-left: 10px!important;
    width: 170px;
    
}

.submit, .submit:hover, .submit:focus{
    text-transform: uppercase;
    background: #0D1963;
    color: #ffffff;
    margin-top: 15px;
    padding: 8px 30px;
    border-radius: 5px;
    border: none;
}
/*---Banner End---*/
.pd-1{
    padding: 50px 0 !important;

}

.pdb-1{
    padding-bottom: 0 !important;

}

.mfp-container {
    position: fixed!important;

}
.title-wrapper{

}

.title-wrapper h2{
    color: #0D1963;
    font-size: 2.8rem;
    font-weight: 600;
    text-wrap: balance;
}
.sec-1{
    width: 100%;
}

.title-wrapper h3{
    font-size: 2rem;
    font-weight: 500;
    color: #0D1963;
    width: 70%;
    margin: 15px auto;
    line-height: 26px;

}


.video-sec{
  float: left;
  width: 100%;
 }
 


.video{
    position: relative;
    max-width: 980px;
    margin: 0 auto;
    margin-top: 20px;
 }
 
 .video img{
     width: 100%;
 }
 
 

 
 .vdo-i {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     -moz-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     cursor: pointer;
  
 }
 

 
 .vdo-i a:hover{
     color: #ffffff;
     text-decoration: none;
 }
 
 .vdo-i .fa-play {
     position: relative;
     z-index: 9;
     color: #5A5A5A;
     font-size: 20px;
     
 }
 
 
 .video-play-button:before {
   content: "";
   position: absolute;
   z-index: 0;
   left: 50%;
   top: 50%;
   transform: translateX(-50%) translateY(-50%);
   display: block;
   width: 51px;
   height: 51px;
   background: #FFF;
   border-radius: 50%;
   animation: pulse-border 1500ms ease-out infinite;
 }
 
 .video-play-button:after {
   content: "";
   position: absolute;
   z-index: 1;
   left: 50%;
   top: 50%;
   transform: translateX(-50%) translateY(-50%);
   display: block;
   width: 55px;
   height: 55px;
   background: transparent;
   border-radius: 50%;
   transition: all 200ms;
   border: 5px solid #5A5A5A;
 }
 
 @keyframes pulse-border {
   0% {
     transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
     opacity: 1;
   }
   100% {
     transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
     opacity: 0;
   }
 }
 
 
 .close-btn {
     background: #ED3237 !important;
     color: #fff;
     width: 38px;
     height: 38px;
     border-radius: 50%;
     z-index: 9999999;
     position: absolute;
     top: -21px;
     right: -18px;
     opacity: 9;
 }
 
 .close:focus, .close:hover {
    text-decoration: none;
    cursor: pointer;
    filter: alpha(opacity = 50);
    opacity: 1;
    color: #fff;
}
 .v-popup .modal-dialog {
    width: 50%;
    top: 15%;
    -webkit-transform: translateY(-25%);
    -moz-transform: translateY(-25%);
    transform: translateY(-25%);
    padding: 5px;
}
 .v-popup .modal-body {
    position: relative;
    padding: 5px;
}
/*---sec-1---*/
.step-slider{
    background: #ffffff;
    border-radius: 20px;
    margin-top: 35px;

}

.step-slider .owl-carousel .owl-stage-outer {
   overflow: unset!important;
}
.discover-item{
    padding:  20px;
    transition: all 0.5s;
    min-height: 380px;
    
}
.discover-item img{
    width: 100px !important;
    margin: 0 auto;
    margin-bottom: 20px;
}
.discover-item:hover{
    background: #0D1963;
    color: #ffffff;
    border-radius: 20px;
 
}

.discover-item:hover::before{
    content: "";
    background: #0D1963;
    height: 105%;
    width: 100%;
    position: absolute;
    top: -10px;
    left: 0;
    border-radius: 20px;
    z-index: -2;
    
}


.discover-item:hover img{
    filter: invert(89%) sepia(64%) saturate(0%) hue-rotate(45deg) brightness(110%) contrast(100%);
}
.discover-item .title-c{
    font-weight: 600;
    margin-bottom: 8px;
}
.discover-item ul{
    margin: 0 0 0 15px;

}
.discover-item ul li{
    list-style: disc;
    font-size: 16px;
}


.discover-item ul li::marker {

  }

  .owl-one .owl-dots, .owlvideo .owl-dots{
    position: absolute;
    left: 50%;
    bottom: -45px;
    transform: translate(-50%);
  }
  .owl-one .owl-dot, .owlvideo .owl-dot {
    background-color: #CCC6C6 !important;
    width: 15px;
    height: 15px;
    margin: 0 5px;
    border-radius: 50%;
}

.owl-one .owl-dot.active, .owlvideo .owl-dot.active {
    background-color: #2A2076 !important;
}
.owl-theme .owl-dots .owl-dot span, .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{
    background: transparent !important;
}


/*---sec-2---*/
.bg-gradient {
    background: #ab3a5a;
    background: -moz-linear-gradient(90deg, rgba(171, 58, 90, .2) 0, rgba(42, 32, 118, .2) 100%);
    background: -webkit-linear-gradient(90deg, rgba(171, 58, 90, .2) 0, rgba(42, 32, 118, .2) 100%);
    background: linear-gradient(90deg, rgba(171, 58, 90, .2) 0, rgba(42, 32, 118, .2) 100%);
}
.sec-2{
    width: 100%;
}


.card-sec{
    margin-top: 35px;
}

.card-btm {
    margin-bottom: 3em;
}
.card {
    text-align: center;
    width: 100%;
}

.card img {
    width: 200px !important;
    margin: 0 auto;
}
.card h3 {
    font-size: 2rem; 
    font-weight: 600;
    margin-bottom: 15px;
}
.card p {
    margin: 0;
    font-size: 18px;
}
.card-body {
    width: 100%;
    margin: 0 auto;
}

.card-sec .owl-nav{}

.card-sec .owl-prev, .owl-next {
	position: absolute;
	top: 0;
	height: 100%;
}

.card-sec .owl-nav .owl-prev, .card-sec .owl-nav .owl-next {
    background: #EFEFEF !important;
    width: 40px;
    height: 40px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 5px;
}

.card-sec .owl-nav .owl-prev {
	left: 7px;

}

.card-sec .owl-nav .owl-next {
	right: 7px;
}

/*---sec-1---*/
/*---sec-1---*/
.sec-3{
    width: 100%;
}



svg:hover path { 
    fill: #fce57e;
}
/*---Banner---*/

/*---FAQs---*/
.faq-acc{
    width: 100%;
    /* max-width: 900px; */
    margin: 0 auto;
    margin-bottom: 30px; 
    margin-top: 30px; 
  }
.faq-acc .panel {
    background: transparent;
}

.faq-acc .panel-default>.panel-heading {

    background: transparent;
}

.faq-acc .panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 20px;
    color: inherit;
    font-weight: 300;
    color: #343434;
}

.faq-acc .panel-title a{
    display: flex;
    justify-content: space-between;

 }

.faq-acc .panel-title a:hover, .faq-acc .panel-title a:focus {
   text-decoration: none;
}

.faq-acc .panel-group .panel-heading+.panel-collapse>.list-group, .faq-acc .panel-group .panel-heading+.panel-collapse>.panel-body {
    border-top: transparent;
}


.faq-acc .panel-default {
    border: 0;
    border-bottom: 1px solid #707070;
    border-radius: 0;
    margin-bottom: 20px;
}

.faq-acc .panel-body p {
    color: #343434;
    font-size: 16px;
}
.glyphiconArrow{

}
.glyphiconArrow img{
 width: 20px;  
 text-align: right; 
}

.rotate {
    -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
    -moz-transform: rotate(-180deg); /* Firefox */
    -ms-transform: rotate(-180deg); /* IE 9 */
    transform: rotate(-180deg); /* Standard syntax */
  }
  
/*---FAQs---*/

/*-----Responsive------*/

@media (min-width: 1200px) {
    .sec-discover .container {
        width: 90%;
    }
}

@media(max-width:1300px) {
    .banner-sec {
        padding-top: 50px;
    padding-bottom: 50px;
    min-height: calc(100vh + 100px);
    }


}

@media(max-width:990px) {
.banner-left {
    position: relative;
    top: -50px;
    color: #ffffff;
}
.step-slider .owl-carousel .owl-stage-outer {
    overflow: hidden!important;
 }

}


@media(max-width:800px) {
.carousel-indicators {
    position: absolute;    
    left: 50%;    
    width: 60%;
    bottom: 17% !important;
    
}
.mitra-logo {
    width: 200px !important;
}
.step-slider {
    margin-bottom: 50px;
}

.title-wrapper h2 {
    font-size: 3rem;
    
}
.card h3 {
    font-size: 2.5rem;
    
}
.card p {
    font-size: 2rem;
}
.title-wrapper h3, #who_is_life_mitra p {
    
    width: 100%;
    font-size: 16px;
    line-height: 1.4;
    /* text-wrap: balance; */
}

.discover-item:hover, .discover-item:hover::before{
    background: none;
    color: #0D1963;
    border-radius: 20px;
}
.discover-item:hover img {
    filter: none;
}

.banner-sec {
min-height: calc(100vh + 50px);
}

}
@media(max-width:767px) {

.header-sec .menu-toggle {
    position: absolute;
    top: 0;
    right: 15px;
}

.banner-sec {
padding-bottom: 10px;
}

.main-slider .owl-dots {
    right: 30%;
}


.discover-item img {
    width: 150px !important;
}
.captcha-input img {
    left: -6px !important;
    width: 16px !important;
}
}