*{
    margin: 0;
    padding: 0;
    user-select: none;
    box-sizing: border-box;
  }
  
  body {
      font-family: var(--aeonik-trial);
      font-weight: 500;
  }
  
  :root {
    --primary:#199C85;
    --sec:#4D4C6E;
       --bg: #ebf3fd;
          --warning: #DB8E27;
          --border:1px solid  #199C85;
      --black: #000000;
      --white: #fff;
    --box-shadow: 2px 2px 12px 2px #b6aeae;
    --fa:FontAwesome;
    --aeonik-trial:aeonik-trial;
    --against-history: against-history;
   }

   button{
          font-family: var(--aeonik-trial);
   }
  .info, .danger, .success, .warning {
      text-align: center;
      padding: 10px;
  }
  .info, .danger, .success {
      color: white;
  }
  
  .info {
      background-color: var(--info);
  }
  
  .success {
      background-color: var(--success);
  }
  .warning {
      background-color: var(--warning);
  }
  .danger {
      background-color: var(--danger);
  }
  p{
      margin: 5px auto;
        font-size: 16px;
  }
   @font-face {
      font-family: aeonik-trial;
      src: url(../fonts/aeonik-trial/AeonikTRIAL-Light.otf) format("truetype");
  font-display: swap;
      font-weight: 200;
      font-style: normal;
  }


     @font-face {
      font-family: aeonik-trial;
      src: url(../fonts/aeonik-trial/AeonikTRIAL-Regular.otf) format("truetype");
  font-display: swap;
      font-weight: 500;
      font-style: normal;
  }

     @font-face {
      font-family: against-history;
      src: url(../fonts/against-history/against-history.otf) format("truetype");
  font-display: swap;
      font-weight: 600;
      font-style: normal;
  }

.c-mob{
    display: none;
}


     @font-face {
      font-family: aeonik-trial;
      src: url(../fonts/aeonik-trial/AeonikTRIAL-Bold.otf) format("truetype");
  font-display: swap;
      font-weight: 700;
      font-style: normal;
  }

  
@font-face {
    font-family: FontAwesome;
    src: url("../fonts/fontawesome/fontawesome-webfont.eot?v=4.7.0");
    src: url("../fonts/fontawesome/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"),
     url("../fonts/fontawesome/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),
      url("../fonts/fontawesome/fontawesome-webfont.woff?v=4.7.0") format("woff"), 
      url("../fonts/fontawesome/fontawesome-webfont.ttf?v=4.7.0") format("truetype"),
       url("../fonts/fontawesome/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}


.m-auto{
  width: 1140px;
  margin: auto;
}
header {
  padding: 10px 0;
}
.header-flex, .learn-flx{
  display: flex;
  justify-content: space-between;
}

.header-call a {
  text-decoration: none;
  color:var(--black);
    display: flex;
  align-items: center;
}
.header-call a:hover{
  color: var(--primary);
}
.header-call a span{
  border-bottom: var(--border);
}
.banner-flex{
  display: flex;
  align-items: center;
  justify-content: space-between;
    margin-top: 30px;
}
.banner-flxs{
  display: flex;
  margin-top: 20px;
}

.banner-flex > div{
  width: 48%;
}
.banner-content h1 {
font-weight: 500;
font-size: 42px;
}
.banner-content h1 b{
color: var(--primary);
font-weight: 500;
}
.enroll-now{
  display: inline-block;
  background-color: var(--primary);
  padding: 15px 35px;
  margin: 30px 0;
  color: var(--white);
  text-decoration: none;
  border-radius: 26px;
  font-size: 16px;
  position: relative;
    z-index: 1;
    overflow: hidden;
}
/*.enroll-now:hover{
     background-color: var(--warning) !important;
     transition: .2s;
}*/
.enroll-now i:after {
   font-family: var(--fa);
    content: "\f087";
    font-weight: 100;
    font-size: 18px;
    margin-right: 5px;
}

.banner-flxs > div{
  margin-right: 60px;
}

.banner-flxs > div b{
font-size: 22px;
font-weight: 700;
}
.banner-flxs > div p {
  font-size: 15px;
    color: #5c5b5b;
}
.banner-flxs > div span{
  background-color: var(--warning);
  height: 2px;
  display: block;
  margin: 2px 0 7px;
  width: 70px;
}
.banner-img{
  text-align: right;
}

.step-auto{
  background-color: var(--primary);
  border-radius: 20px;
  display: flex;
  padding: 40px 50px;
  justify-content: space-between;
}
.step-flx{
  display: flex;
  align-items: center;
  width: 23%;
  color: var(--white);
}
.content-heading h2 b, .heading-sec h2 b{
color: var(--primary);
}
.step-flx img{
width: 50px;
margin-right: 15px;
}
.step-flx p {
  font-weight: 500;
  margin-left: 0;
}
.m-auto-green {
  width: 1240px;
  margin: auto;
}
.content-flex{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 40px 0;
}
.content-flex > div{
  width: 48%;
}
.content-flex > div h2{
  width: 70%;
}
.content-flex > div  p {
  line-height: 24px;
  font-size: 16px;
}
.arrow-bg{
  background-image: url(../img/home/arrow.png);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 100px 20px 20px;
  margin: 20px;
}
.heading-sec{
  text-align: center;
  margin: 40px 0;
}
.heading-sec h2{
  font-weight: 700;
}
.heading-sec p {
  margin-top: 14px;
}
.learn-flx > div{
 display: flex;
  align-items: center;
  width: 21%;
}
.learn-flx > div img{
  margin-right: 10px;
}
.learn-flx > div p{
  font-weight: 500;
}

.button-sec{
  text-align: center;
  margin: 20px 0;
}
.interested:before{
   font-family: var(--fa);
    content: "\f087";
    font-weight: 500;
    font-size: 18px;
    margin-right: 10px;
}
.interested {
      display: inline-block;
    background-color: var(--primary);
    padding: 15px 35px;
    margin: 30px 0;
    color: var(--white);
    border-radius: 30px;
    text-decoration: none;
    font-weight: 500;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.skill-job{
  margin: 20px;
  background-color: #FBF9F6;
  padding: 40px 100px;
  border-radius: 20px;
  position: relative;
}
.skill-job:after{
content: "";
    position: absolute;
    top: -44px;
    right: -19px;
    background-image: url(../img/home/green.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 589px;
    width: 248px;
    z-index: -1;
}
.heading-flex{
  display: flex;
  justify-content: space-between;
}
.heading-flex h2{
  width: 30%;
  font-size: 30px;
}
.heading-flex h2 b, .faq-heading h2 b{
  color: var(--primary);
}
.heading-flex p {
  width: 50%;
  line-height: 23px;
  font-size: 18px;
}

.contact-skill{
  display: flex;
  justify-content: space-between;
  margin-top: 50px;
}

.contact-one{
  width: 20%;
}
.contact-img{
  width: 70%;
}

.contact-one ul li{
 display: flex;
 margin-bottom: 40px;
 position: relative;
}
.contact-one ul li:after{
content: "";
    position: absolute;
    border-bottom: 1px dashed black;
    height: 4px;
    width: 19%;
    transform: rotate(90deg);
    top: 66px;
}
.contact-one ul li:last-child:after{
   border-bottom: 0px dotted black;
}
.contact-one ul li img{
  width: 40px;
  height: 40px;
  margin-right: 20px;
  position: relative;
  z-index: 999999;
}
.contact-img img{
  width: 100%;
}

.feedback-flex{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.feedback-flex > div{
  width: 30%;
  color: var(--white);
}
.feedback{
background-color: var(--sec);
padding: 60px 20px;
}

.feedback-flex .st-feedback{
display: flex;
align-items: center;
justify-content: start;
}
.feedback-flex .st-feedback p {
  color: var(--white);
  margin-left: 10px;
}
.feedback-flex > div h2{
  margin: 20px 0;
  font-size: 30px;
}
.footer-bottom{
  border-top: 1px solid #ddd;
  padding: 20px 0;
}
.footer, .footer-flex{
  display: flex;
  justify-content: space-between;
}
.footer > div:nth-child(1){ 
 width: 20%;
}

.footer > div:nth-child(2){ 
 width: 40%;
 text-align: center;
}

.footer > div:nth-child(3){ 
 width: 25%;
}

.footer-bottom a{
  color: var(--black);
  text-decoration: none;
}
footer{
  margin: 70px 0;
}

.slick-list {
  max-width: 700px;
  margin: 0 auto;
  padding: 30px 0;
}
.slick-list .slick-slide {
  font-size: 16px;
  text-align: left;
  padding: 40px 20px;
  line-height: 2;
  color: var(--black);
}
.slick-list .slick-slide:nth-child(even) {
  background-color: var(--white);
    border-radius: 10px;
}
.slick-list .slick-slide:nth-child(odd) {
  background-color: var(--white);
  border-radius: 10px;
}
.slick-arrow {
  z-index: 1;
  width: 40px;
  height: 40px;
}


.slick-prev:before{
    font-size: 18px !important;
    color: var(--black) !important;
    content: '\f053' !important;
    font-family: var(--fa) !important;
    right: -26px !important;
    position: relative !important;
    /* background: red; */
    background-color: #efeaea;
    padding: 14px 17px;
    border-radius: 30px;
       opacity: 1 !important;
}
.slick-list{
  margin: 20px !important;
}
.slick-next:before{
    font-size: 18px !important;
    color: var(--black) !important;
    content: '\f054' !important;
    font-family: var(--fa) !important;
    right: 52px !important;
    position: relative !important;
    background-color: #efeaea;
    padding: 14px 17px;
    border-radius: 30px;
    opacity: 1 !important;
}
.slick-disabled{
      opacity: 0.6 !important;
}
.btn-wrap
.slick-next {
  right: 0;
}
.slick-prev {
  left: 0;
}

.btn-wrap {
  text-align: center;
  width: 100%;
}
.btn-wrap button {
  background-color: #ddd;
  border: none;
  padding: 10px 20px;
  border-radius: 5px;
  margin: 10px;
  font-size: 18px;
  font-weight: 600;
  transition: all 0.5s;
}
.btn-wrap button.slick-disabled {
  opacity: 0.6;
}

.design-dozo-tab .dozo-tab{
display: flex;
}
.m-auto-dozo{
  width: 1140px;
  margin: auto;
}
.dozo-tab {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #ddd;
  padding-bottom: 15px;
}
.dozo-tab button {
  background-color: transparent;
  border: 0;
  cursor: pointer;
  font-weight: 700;
  font-size: 23px;
  color: #b7b7b7;
  position: relative;
  padding: 0 30px;
}
.dozo-tab button:foucs{
  outline: none;
}
.dozo-flex{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 30px 0;
}
.dozo-flex >div{
  width: 48%;
}
.dozo-image img{
  width: 80%;
}
.encl a {
  background-color: var(--warning) !important;
}
.dozo-content ul li{
position: relative;
list-style: none;
margin-bottom: 20px;
margin-left: 25px;
}
.dozo-content ul li b{
  margin-bottom: 2px;
  display: inline-block;
}
.dozo-content ul li:after{
   font-family: var(--fa);
    content: "\f14a";
  position: absolute;
  top: 0;
  left: -20px;
  color: var(--primary);
}
.tab{
  display: none;
}

.active_div{
  display: block;
}
.hidden_div{
  display: none;
}
.selected_div{
  color: var(--black) !important;
}
.selected_div:after {
    content: "";
    position: absolute;
    background-image: url(../img/home/border.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 3px;
    width: 100%;
    left: 0;
    bottom: -15px;
}

.faq-heading span{
  font-family: var(--against-history);
}

.faq-section{
  padding: 50px 0 20px;
  background-color: #FBF9F6;
}
.faq-heading{
  text-align: center;
  margin-bottom: 50px;
  position: relative;
}
.faq-dv b{
  text-align: center;
  display: block;
}

.faq-dv img{
  width: 55%;
  margin-left: auto;
}
.img-faq{
  text-align: center;
}
.faq-heading h2{
  font-size: 30px;
  margin-bottom: 10px;
}
.faq-heading span {
  display: none;
  font-size: 30px;
  margin-top: 10px;
}
.faq-dflex{
  display: flex;
  justify-content: center;
  align-items: center;
}

.content{
     display: none;
 }
.active  .content{
    display: block !important;
    padding: 15px;
    font-size: 16px;
}
.faq button{
    width: 100%;
    background-color: transparent;
    padding: 16px 40px 16px 16px;
    cursor: pointer;
    border-radius: 5px;
    text-align: left;
    position: relative;
    font-weight: 700;
    border: 0;
}
.faq button:after{
   font-family: var(--fa);
  content: "\f055";
 position: absolute;
     top: 12px;
 right: 10px;
 font-size: 25px;
}
.faq{
  margin-bottom: 10px;
    border: 4px solid #F1ECE6;
    border-radius: 4px;
}
.faq-dflex > div{
width: 48%;
}
.faq-dflex > div:nth-child(1){
  width: 40%;
}
.faq.active button:after {
    font-family: var(--fa);
    content: "\f056";
    position: absolute;
    top: 12px;
    right: 10px;
    font-size: 25px;
}
.social {
  display: flex;
}
.social li {
  list-style: none;
}
.social li img{
  margin: 50px 20px 0 0;
}
.fixed-div{
   /* transform: rotate(90deg);*/
   width: 7% !important;
}
.feedback-flex > div:nth-child(2){
  width: 50%;
}
.pop-row, .popup-flex{
  display: flex;
  justify-content: space-between;
}
 .popup-flex > div, .pop-row > div{
  width: 48%;
  margin: 4px 0;
}
.pop-row > div input, .pop-rows > div select, .pop-rows textarea{
width: 100%;
padding: 8px;
margin-top: 4px;
border: 1px solid #C7C7C7;
border-radius: 3px;
}
.pop-row > div input:focus, .pop-rows > div select:focus, .message-row textarea{
  outline: none;
}
.pop-row > div span, .pop-rows > div span, .message-row span{
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 2px;
  display: inline-block;
}
.pop-rows > div{
  width: 100%;
}
.pop-rows > div  {
  margin-top: 10px;
}
.student-pro{
  display: flex;
  justify-content: space-between;
}
.student-pro img{
  object-fit: contain;
}
.student-section{
  margin-top: 80px;
  margin-bottom: 70px;
}
.message-row{
  margin-top: 10px;
}
.pop-submit input{
  width: 100%;
  padding: 13px;
  border-radius: 30px;
  background-color: var(--primary);
  cursor: pointer;
  border: 0;
  color: var(--white);
  margin-top: 15px;
  font-weight: 500;
  font-family: var(--aeonik-trial);
}
.pop-submit p {
  margin-top:6px;
}

.rating{
  display: flex;
  align-items: center;
}
.rating b{
 font-size: 30px;
 margin-right: 3px;
}
.rating i {
  color: #DB8E27;
  margin-left: 2px;
}
.review-name {
  text-align: left;
    margin-top: 30px;
}
.review-name span{
  color: #cfcccc;
}
.review-name p{
  line-height: 10px;
font-weight: 700;
}
.h-vvr-close-btn{
  position: relative;
}

.h-vvr-close-btn::after {
    content: "\f00d";
    font-size: 1em;
    background-color: var(--black);
    color: var(--white);
    position: absolute;
    padding: 10px 12px;
    border-radius: 40px;
    top: -10px;
    right: 0;
    cursor: pointer;
    font-family: var(--fa);
}

.vvr-lgn{
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.6);
    top: 0;
    left: 0;
    position: fixed;
    z-index: 5;
display: none;
}
a{
  cursor: pointer;
}

.vvr-lgn .m-auto {
    margin: 40px auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 20px;
}
.privacy-policy ol ul, .privacy-policy ol {
  margin:10px 20px;
}
.privacy-policy ol > li{
  font-weight: 700;
  margin-top: 40px;
}
.privacy-policy ol ul li {
  margin: 4px 0;
}
.privacy-policy h1{
  font-size: 28px;
  margin: 50px 0;
}
.privacy-policy p a{
  color: var(--primary);
}
.privacy-policy p{
  font-size: 16px;
  margin-top: 40px;
}

.br {
  border-bottom: 1px solid var(--black);
  margin-top: 50px;
}
.thumb:before{
      font-family: var(--fa);
    content: "\f087";
    font-weight: 100;
    font-size: 18px;
    margin-right: 5px;
}
.contact-us-sl{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--sec);
    width: fit-content;
    margin: auto;
    padding: 14px 20px;
    border-radius: 10px;
    color: var(--white);
    margin-top: -30px;
    z-index: 1;
    position: relative;
}
.contact-us-sl p {
  margin: 0;
}
.contact-us-sl a{
    color: var(--white);
    background-color: var(--primary);
    padding: 8px;
    margin-left: 13px;
    border-radius: 4px;
    text-decoration: none;
}
















.enroll-now:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 100%;
    background-color: var(--sec);
  transition: all 0.3s;
  border-radius: 10rem;
  z-index: -1;
}
.enroll-now:hover {
  color: #fff;
}
.enroll-now:hover:before {
  width: 100%;
}
.interested:hover{
      background-color: var(--sec);
}
.thumb:hover{
  background-color: var(--white);
  color: var(--black);
  transition: .2s;
}
.dir:before{
  font-family: var(--fa);
    content: "\f041";
    font-weight: 100;
    font-size: 18px;
    margin-right: 5px;
}
.dir{
   text-decoration: none; 
     color: var(--black);
}
.dir span{

  border-bottom: 2px solid var(--primary);

  font-weight: 700;
}

.enroll-nows:hover{
background-color: var(--white)!important;
color: var(--black) !important;
}
.enroll-nows:before{
  background-color: var(--white)!important;
}
.dir span:hover, .footer-bottom a:hover, .header-call a span:hover{
  color: var(--primary);
}