:root { font-family: 'Inter', sans-serif; }
@supports (font-variation-settings: normal) {
  :root { font-family: 'Inter var', sans-serif; }
}


* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
  text-decoration: none;
}


body {
  min-height: 100vh;


  

}

html {
  scroll-behavior: smooth;
  
}


.upbar {
  width: 100%;
  background: #219CD6;
  color: #fff;
  text-align: center;
  font-weight: 700;
  padding: 18px 0;
  margin: 0;
  border: 0;
  font: inherit;
  font-size: 18px;
  font-weight: 700;
}


.p-message {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  font-weight: 700;
}

/*****/
@media (max-width: 768px) {
.upbar {
  font-size: 18px;


}  

.logo img {
  max-width: 194px;
  height: 77px;
  margin-left: 30px;
}
/*****/


}

@media screen and (max-width: 768px) {
  .hero h1 {
    font-size: 30px;
    text-align: center;
    padding: 10px 20px; 
  }
}

  









.logo img {
  max-width: 194px;
  height: 77px;
  margin-left: 17px;
}


header {
  width: 100%;
  height: 82px;
  background: #151B29;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 60px;
  margin: 0 auto;
}



.logo {
  width: 120px;
  margin-top: 8px;
}


nav .logo {
  display: none;
}

nav ul {
  display: flex;
}

nav ul li a {
  
  font-size: 16px;
  color: #FFF;
  display: block;
  margin: 0 2px;
  font-weight: 600;
  padding: 8px 18px;
  transition: 0.2s;
  border-radius: 30px;


}

nav ul li a:hover {
  color: #456ce2;
}


nav ul li a.active {
  background: transparent;
  color: #fff;

}

.hamburger {
  display: none;
  height: fit-content;
  cursor: pointer;
  padding: 3px 8px;
  border-radius: 5px;
  transition: 0.2s;
  
}


.hamburger:hover {
  background: #151B29;
}


.hamburger div {

  width: 30px;
  height: 2px;
  margin: 6px 0;
  background: #fff;

}


@media only screen and ( max-width:1100px) {
  header {
      width: 100%;
      padding: 0 20px;
  }

  nav {
      position: absolute;
      left: -300px;
      top: 0;
      z-index: 999;
      width: 280px;
      height: 100vh;
      background-color: #151B29;
      transition: 0.2s;
      box-shadow: 2px 0 20px 0 rgba(0, 0, 0, 0.05);
      opacity: 0.95;
  }

#nav_check:checked ~ nav {
  left: 0;
}



  nav .logo {
      display: block;
      height: 70px;
      
      align-items: center;
      margin-left: 30px;

  }

nav ul li a {
  margin-bottom: 5px;
  padding: 10px 15px;
  border-radius: 5px;


}

 nav ul {
  display: block;
  padding: 0 20px;
  margin-top: 30px;
 }
  .hamburger {
      display: block;

  }
}










span {
  color: #f6f6f6;
  margin-left: 11px;
}






.hero {
  width: 100%;
  background-image: url('images/hero-bg.png');
  background-size: cover;
  background-position: center;
  background-color: #151B29;
  color: white;
  text-align: left;
  padding: 50px 0;
 
  
}

.hero_outer {
  display: flex;
  align-items: left;
  justify-content: left;
  align-content: left;
  
  transform-origin: left;

}

.hero_inner {
  max-width: 55%;
  
  padding: 20px 20px;
  display: flex;
  flex-direction: column;
}



.rating h4 {
  margin-left: 10px;
  font-size: 16px;
  font-weight: 400;

}




.c-text {
  color: #FFF;
  font-size: 16px;
  font-weight: 700;
}

.hero h1 {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 20px; 
  margin-left: 3rem;
  opacity: 0.9;
  
}

.hero p {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 20px;
  margin-left: 3rem;
  opacity: 0.9;
}

.hero_inner ul {
  
  padding: 0;
  overflow-y: hidden;
  margin-left: 32px;
  opacity: 0.9;
  line-height: 35px;
  font-size: 20px;
  font-weight: 700;
  
  max-width: 50%;
  list-style-image: url('images/cc.svg');


  
}


.m-div {
    display: flex;
    justify-content: center;
    align-items: center;
}


.sq-box h3 {
    font-size: 2rem;
    color: black;
    font-weight: 700;
}

.sq-box p {
    font-size: 1rem;
    color: #000000;
}





@media (max-width: 768px) {
  .hero .btn {
    font-size: 18px;
    margin-left: 53px;
    font-weight: 700;
    padding: 20px;
    margin-left: 17px;
  }


  .hero ul  {
    list-style: none;
    padding: 0px;
    margin-left: 0;
    overflow-y: hidden;
    margin-left: 7px;
    opacity: 0.9;
    text-align: left;
    font-size: 20px;
}
  }

  .rating  {
    display: flex;
   padding: 10px;
    align-items: center;
    margin-left: 38px;
    
  }

  .rating img {
    width: auto;
  }


  .c-text {
    color: white;
    font-size: 16px;
    font-weight: 700;
  }

  span {
    color: #fefefe;
    
  }

  

  



@media (min-width: 768px) {
  
  .text-label,
.text-hero-bold,
.text-hero-regular {
  display: flex;
}
  
}
  



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

}

.text-hero-bold h1  {
    font-size: 40px;
  
 
}

/********/

/*new slider*/

.scroller_out {
  display: grid;
    place-content: center;
}
.scroller {
  max-width: 100%;
  background-color:#F6F6F6 ;
  margin: auto;

}

.blue123 span {
  color: #219CD6;
}

.blue123 {
  width:100%
}

.scroller__inner {
  padding-block: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: center;
    column-gap: 50px;
}

.scroller__inner h3 {
  color: #219CD6;
   font-size: 26px;
}

.scroller__inner p {
  color: black;
   font-size: 18px;
}

.scroller[data-animated="true"] {
  overflow: hidden;
  -webkit-mask: linear-gradient(
    90deg,
    transparent,
    white 20%,
    white 80%,
    transparent
  );
  mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}

.scroller[data-animated="true"] .scroller__inner {
  width: max-content;
  flex-wrap: nowrap;
  animation: scroll var(--_animation-duration, 40s)
    var(--_animation-direction, forwards) linear infinite;
}

.scroller[data-direction="right"] {
  --_animation-direction: reverse;
}

.scroller[data-direction="left"] {
  --_animation-direction: forwards;
}

.scroller[data-speed="fast"] {
  --_animation-duration: 20s;
}

.scroller[data-speed="slow"] {
  --_animation-duration: 60s;
}

.scroller[data-speed="very_slow"] {
  --_animation-duration: 120s;
}

@keyframes scroll {
  to {
    transform: translate(calc(-50% - 0.5rem));
  }
}

.scroller__inner img {
  width:150px;
}


.tag-list {
  margin: 0;
  padding-inline: 0;
  list-style: none;
}

.tag-list li {
  padding: 1rem;
  background: var(--clr-primary-400);
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1rem -0.25rem var(--clr-primary-900);
}

/* for testing purposed to ensure the animation lined up correctly */
.test {
  background: red !important;
}


/*new slider*/
@keyframes slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.logos {
  overflow: hidden;
  padding: 60px 0;
  background: #F6F6F6;
  white-space: nowrap;
  position: relative;
  
}



.logos p {
  width: -webkit-fill-available;
  height: 10vh;
  text-align: center;
  color: #380000;
  font-family: "Inter-Bold", Helvetica;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 15px;

}


.logos:before,
.logos:after {
  position: absolute;
  top: 0;
  width: 250px;
  height: 100%;
  content: "";
  z-index: 2;
}

.logos:before {
  left: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 0));
}

.logos:after {
  right: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 0),);
}


.logos-slide {
  display: inline-block;
  animation: 10s slide infinite linear;
}

.logos-slide img {
  height: 70px;
  margin: 0 40px;
}
  



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

  .logos p {
    font-size: 10px;
}
  }








/********/

.about-section {
  background-color: #ffffff;
  display: flex;
 
 justify-content: center;
 align-items: center;
 align-content: center;
 margin:auto;
  padding-top: 70px ;
  padding-bottom: 20px;
  
  

}

.about-sec-heading {
  text-align: center;
  display: block;
  width:100%;
  margin: auto;
  transform-origin: right;
  text-transform: capitalize;
}




.about-section-inner {
 max-width: 90%;
  
  display: inline-flex;
  transform-origin: right;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  
 

}
     .text-section {
    
            
            padding: 20px 20px;
            background-image: url('images/bg-3.png');
            background-size: cover;
            background-repeat: no-repeat;
           
            width:60%;
                                }



        .image-section {
          height: 50%;
          text-align: center; 
          width: 50%;
         
          justify-content: center;
          align-items: center;
          align-content: center;
      }    


      .button {
        display: inline-block;
        background-color: #1BCC62;
        color: #fff;
        padding: 20px 20px;
        text-decoration: none;
        margin-top: 20px;
        width: 500px;
        height: 60px;
        

text-align: center;
font-family: Inter;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;
        
    }



    .head-1 {
       font-size: 52px;
       text-align: center;
       color: #380000;
       font-weight: 700;
    }
    

    .head-2 {
       font-size: 18px;
      color: #0F0F0F;
      margin-top: 16px;
      font-weight: 600;
      font-style: normal;
      padding: 0 100px;
    

    }

    .about-paragraph {
      margin-top: 20px;
      line-height: 1.6;
      color: #0F0F0F;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
}
    

    @media screen and (max-width: 768px) {
      .about-section {
          flex-direction: column;
          text-align: center;
      }
  }





 

.get-start {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; 
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0 30px 30px 30px;
  line-height: 1.5;
  
  box-sizing: border-box; 
}


.get-img {
  display: flex;
  justify-content: space-around;
  margin-top: 2vh; 
}


.steps {
  display: flex;
  justify-content: space-around;
  margin-top: 2vh; 
  
}

.get-text {
  padding: 10px;
}





.get-btn {
  margin-top: 2vh; 
  width: 305px;
}

.btn-1 {
  display: inline-block;
  background-color: #1BCC62;
  color: #fff;
  padding: 20px 20px;
  text-decoration: none;
  margin-top: 20px;
  width: 330px;
  height: 60px;
  color: #FFF;

text-align: center;
font-family: Inter;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;
  
}


.btn-2 {
  display: inline-block;
  background-color: #1BCC62;
  color: #fff;
  padding: 20px 0;
  text-decoration: none;
  margin-top: 40px;
  height: 60px;
  color: #FFF;
width: 100%;
text-align: center;
font-family: Inter;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;
margin-left: 3rem;
width: 45%;

  
}


.btn-3 {
  display: inline-block;
  background-color: #1BCC62;
  color: #fff;
  padding-top: 20px;
  text-decoration: none;
  margin-left:0px;
  height: 60px;
  color: #FFF;
width: 100%;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;

width: 45%;
  
}


.btn-4 {
  display: inline-block;
  background-color: #1BCC62;
  color: #fff;
  padding-top: 20px;
  text-decoration: none;
  margin-left:0px;
  height: 60px;
  color: #FFF;
width: 100%;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;
margin-top: 20px;
width: 58%;
  
}



.step {
  width: 100%; 
  max-width: 400px; 
  margin: 20px;
  text-align: center;
  
}

.step img {
  max-width: 100%;
  height: auto;
}

.step h2 {
  margin: 15px 0;
  color: #cc0000;
}

.step p {
  margin: 15px 0;
  line-height: 30px;
  text-align: center;
}


@media screen and (min-width: 768px) { 
  .step {
    width: calc(33.33% - 40px); 
    max-width: 100%; 
  }
}






/* Your existing CSS */

.achievement {
  width: 100%;
 background-image: url(images/achiev.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  display: flex;
  justify-content: center;
  align-items: center;
 
  padding: 75px;
  box-sizing: border-box; 
  margin-top: 16px;
}

.achiev {
  display: flex;
  justify-content: space-around;
  text-align: center;
  max-width: 1200px;
  width: 100%;
}

.achievement-item {
  flex: 1;
  padding: 20px;
}

.achievement-item p {
  color: #fff;
  text-transform: uppercase;

}



/* Media query for responsiveness */
@media screen and (max-width: 768px) {
  .achiev {
    flex-wrap: wrap; 
  }

  .achievement-item {
    flex: 0 0 45%; 
    margin: 10px;
  }
}



.head-3 {
  display: flex;
  justify-content: center;
  width: auto;
  height: max-content;
  text-align: center;
  font-family: "Inter-Bold", Helvetica;
  font-weight: 700;
  color: #380000;
  font-size: 35px;
  letter-spacing: 1.75px;
  line-height: 38px;
  margin-top: 15vh;
 

}


.achiev  h3 {
  color: #219CD6;
  text-align: center;
  font-size: 56px;
  font-weight: 300;
  line-height: normal;
  font-style: normal;
}



.last_section_inner2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 30px;
  padding: 40px 0;
  
}


.looking-to-learn {
    text-align: center;
    font-family: "Inter-Bold", Helvetica;
    font-weight: 700;
    color: #380000;
    font-size: 35px;
    text-align: center;
    padding: 30px;
}

.looking-to-learn-2 {
  font-size: 23px;
  font-weight: 400;
  text-align: center;
  color: #0F0F0F;
}


.last_section_box img {
 max-width: 100%; 
 height: 210px;

}

.last_section_box {
  flex: 0 0 100%; 
  max-width: 100%; 

    padding: 20px;
}

.last_section_box h1 {
  text-align: center; 

    color: #000;
    font-Family: Inter;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
   
    text-align: left;
}

.last_section_box p {
  
    color: #000;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    opacity: 0.6;
   
}


.read-more {
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 700;
    color: #ffffff;
    font-size: 15px;
    text-align: center;
    letter-spacing: 0.75px;
    line-height: normal;
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #1bcc62;
    margin-top: 10px;
    height: 55px;
    max-width: 274px;
}




@media screen and (min-width: 768px) {
  .last_section_box {
    flex: 0 0 calc(33.333% - 40px); 
    max-width: calc(33.333% - 40px);
  }
}
        


@keyframes slid {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}




.log {
  

  overflow: hidden;
  padding: 80px 0;
  background: rgb(21, 29, 43);;
  white-space: nowrap;
  position: relative;
  display: flex;
  margin-top: 35px;
  

}



.log h1 {
  color: #fff;
  margin-left: 7rem;
  text-transform: uppercase;
}


.log span {
  color: #219CD6;
}

.log p {

  height: 10vh;
  text-align: center;
  color: #FFF;
  font-family: "Inter-Bold", Helvetica;
  font-size: 20px;

}



.log:before,
.log:after {
  position: absolute;
  top: 0;
  width: 250px;
  height: 100%;
  content: "";
  z-index: 2;
}


.log:before {
  left: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 0),);
}

.log:after {
  right: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 0),);
}



.log-slid {
  display: flex;
  justify-content: center;
  text-align: center;
  margin-top: 10vh;
  animation: 50s slid infinite linear;
}






.log-slid img {
  height: 70px;
  margin: 0 40px;
}

.log-slid h3 {
  padding: 0px 20px 0;
  margin-top: 10px;
  margin-left: 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: #fff;
}

.inner-text {
  padding: 10px;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  margin-top: 10px;
  color: #fff;
}


@media only screen and (max-width: 768px)  {
  .log p {
    height: 10vh;
    text-align: center;
    color: #FFF;
    font-family: "Inter-Bold", Helvetica;
    font-size: 14px;
}



.log h1 {
  color: #fff;
  margin-left: 1rem;
  text-transform: uppercase;
  font-size: 17px;
  font-weight: 700;
  font-style: normal;
  font-family: 'Inter';
  line-height: 0px;
  letter-spacing: 1px;
  margin-left: 25px;
}
  
}




.overlap-7 {
  justify-content: center;
  height:400px;
  width: 100%;
  background-image: url('images/client3.png');
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 20px 0;

  
 
  
  
}



.clients-feedback {
  font-family: "Inter-Regular", Helvetica;
  font-weight: 400;
  color: #fff;
  font-size: 25px;
  letter-spacing: 2.4px;
  line-height: normal;
  margin-bottom: 10px;
  text-align: center;
  padding: 44px;



}





.at-exion-we {
  font-family: "Inter-Bold", Helvetica;
  font-weight: 700;
  color: #fff;
  font-size: 52px;
  line-height: normal;
  letter-spacing: 0;
  margin-bottom: 20px;
  text-align: center;
  margin-top: -15px;

}

@media only  screen and (max-width:768px) 
{
  .at-exion-we {
    font-family: "Inter-Bold", Helvetica;
    font-weight: 700;
    color: white;  
    font-size: 30px;
    line-height: normal;
    letter-spacing: 0;
    margin-bottom: 20px;
    text-align: center;
    padding: 0 30px;
    margin-left: 40px;
  }

  .overlap-7 {
    width: 100%;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px;
   margin-top: -100%;
   background-color: #e7e7e7;
    
   
    
    
  }


}
  


.review {
  padding: 20px;
 
  margin: 17px;
  width: 90%;
  max-width: 400px; 
}
  .review img {
    border-radius: none;
  }


.text-wrapper-12,
.text-wrapper-13 {
  text-align: center;
  margin-top: 10px;
}

.text-wrapper-12 {
  font-size: 20px;
  letter-spacing: 1px;
}

.text-wrapper-13 {
  font-size: 16px;
  letter-spacing: 0;
  word-wrap: break-word;
}






@media (min-width: 768px) {
  .review-container {
    display: flex;
    justify-content: space-between;
    margin-left: 40px;
  }

  .review {
    width: calc(33.33% - 20px);
    max-width: 300px;
  }

  .text-wrapper-13 {
    max-height: 200px; 
    overflow: hidden; 
  }

  .scroll-down-button {
    display: none; 
  }
}




@media only screen and (max-width: 768px) {
  .overlap-2 {
    width: 100%;
    height: auto;
    top: 0;
    position: relative;
    background-color: #151b29;
  }

  .img,
  .pitch-deck {
    width: 100%;
    height: auto;
    top: 0;
    left: 0;
    position: relative;
  }

  .pitch-deck {
    top: 20px;
  }

  .text-wrapper-6 {
    width: 100%;
    top: 20px;
    left: 0;
    font-size: 18px;
  }

  .element-info,
  .element-info-2 {
    left: 0;
  }

  .text-wrapper-7 {
    width: 100%;
    left: 0;
    font-size: 18px;
  }

  .text-wrapper-8,
  .text-wrapper-9,
  .text-wrapper-10 {
    width: 100%;
    left: 0;
    font-size: 20px;
  }
}

   /******CERTICICATION_SLIDER**SECTION*****/

   .wrapper {
    width: 100%;
   
    position: relative;
    padding: 35px 35px;
    background: #151B29;
    display: inline-block;


  }


  .wrapper p {
    color: #FFF;
    font-size: 35px;
    text-align: center;
    font-weight: 700;
    font-style: normal;
    line-height: 30px;
    padding: 50px;

  }


  
  .wrapper h1 {
     font-size: 35px;
     font-weight: 700;
     line-height: 35px;
     text-transform: uppercase;
     color: #fff;
     margin-left: auto;
     margin-right: auto;
     padding: 20px;
     margin-left: 150px;



  }



  

  .wrapper i {
    top: 50%;
    text-align: center;
    line-height: 46px;
    height: 46px;
    width: 46px;
    position: absolute;
    background: #ffffff88;
       border-radius: 50%;
    cursor: pointer;
    font-size: 1.2rem;
    transform: translateY(-50%);
    color:151B29;
    
  }

  .wrapper i:first-child {
    left: 2px;
    display: none;
  }

  .wrapper i:last-child {
    right: 4px;
  }

  .wrapper .carousel {
    white-space: nowrap;
    font-size: 0px;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    scroll-behavior: smooth;
    padding: 10px 0;
    display:flex;
    column-gap: 20px;
    
  }


  .wrapper .carousel .testc {
display: inline-block;
text-align: center;
max-width: 100%;

  }

  .testc h1 {
    font-size: 20px;
    font-family: "Inter";
    font-weight: 600;
   text-transform: uppercase;
    color: #fff;
    margin-left: auto;
    margin-right: auto;

  }

  .carousel.dragging {
    cursor: grab;
    scroll-behavior: auto;
  }

  .carousel.dragging img {
    pointer-events: none;
  }

  .carousel img {
    height: 340px;
    object-fit:contain;
    
  }

  .carousel img:first-child {
    margin-left: 0px;
  }

  @media screen and (max-width: 900px) {
    .carousel img {
      width: calc(100% / 2);
    }
  }

  @media screen and (max-width: 550px) {
    .carousel img {
      width: 100%;
    }
  }

  @media screen and (max-width: 768px) {
    .wrapper h1 {
      font-size: 19px;
      font-weight: 700;
      line-height: 35px;
      text-transform: uppercase;
      color: #fff;
      margin-left: auto;
      margin-right: auto;
      padding: 32px;
      
  }


  .wrapper p {
    color: #fff;
    margin-left: 1rem;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center;
    font-size: 24px;
}
     
    }
  

  


             /******FAQ**SECTION*****/


             .box21 {
              display: flex;
              width: 100%;
              justify-content: center;
              background-color: #F6F6F6;
              padding: 30px 0;
             
             
              
            }
            
            
            .box_inner {
              display:flex;
              width: 80%;
              column-gap: 3rem;
              
              justify-content: center;
            }
            
            .container99 {
              display: block;
              max-width: 40%;
              



            }
            .container100 {
              
              max-width: 60%;
              
              padding-left:30px;
              

            }
            
            .container99 h6 {
              color: #222C49;
            font-size: 16px;
            padding-top: 20px;
            font-weight: 400;
            font-family: sans-serif;
            
           
            }
            
            
            .container99 h2 {
              color: #222C49;
            font-size: 16px;
            padding-bottom: 15px;
            max-width: 523px;
            
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            letter-spacing: 2.4px;
            margin-left: 5px;
            text-transform: uppercase;
           
            
            }
            
            .container99 h1 {
              color: #380000;
              font-size: 46px;
              width: 100%;
             
              font-weight: 700;
              line-height: normal;
              


            
            
            }
            
            /*FAQ QUESTION*/
         
            
            .panel {
            
              padding: 0 15px;
          
              margin-left: 25px;
              font-size: 15px;
              color: #222C49;
              text-align: justify;
              overflow: hidden;
              max-height: 0;
              transition: all 0.3s ease-in;
            }
            
            
            
            @media (max-width: 768px) {
              .box21 {
                display: block;
                width: 100%;
             
                justify-content: center;
                
              }
              
              
              .box_inner {
                display:block;
                width: 100%;
              padding: 1px;
                column-gap: 10px;
              }
              
              .container99 {
                display: block;
                max-width: 100%;
                 text-align: -webkit-center ;
                justify-content: left;
              
              }
              
              .container99 h6 {
                color: #222C49;
              font-size: 18px;
              padding-top: 30px;
              }
              
              
              .container99 h2 {
                color: #222C49;
              font-size: 18px;
              padding-bottom: 15px;
              
              }
              
              .container99 h1 {
                color: #222C49;
              font-size: 33px;
              
              
              }
              .container100 {
              
                max-width: 100%;
                padding-bottom: 25px;
                
              }
              hr.new1{
              
               
                  width:150px;
                  margin: 0px;
                  padding-top:20px;
                  
                
              }
            
              .accordion {
                width: 100%;
                line-height: 40px;
               
                cursor: pointer;
                display: flex;
                margin: 10px 0;
                align-items: center;
                padding: 5px;
              }
              
              .accordion .icon {
              
                width: 33px;
                height: 33px;
                background: url(faq-qs.svg),
                  no-repeat 0px 0px #ffffff;
                    float: left;
                transition: all 0.5s ease-in;
              }
              
              .accordion h5 {
                font-size: 24px;
                margin: 0;
                padding: 3px 0 0 25px;
                font-weight: 300;
                color: #222C49;
                width: 505px;
                font-weight: 600;
            
            
            
            }

            .panel {
              font-size: 20px;
            }
            }
            




            footer {
              background-image: url('images/footer_bg.png');
              background-size: cover;
              background-position: left;
              text-align: center;
              padding: 20px;
              color: #c8c5c5;
              width: 100%;
              background-color: #151B29;
              
              background-position-x:-1;
              
            }

     
          
            .container {
              display: flex;
              justify-content: right;
              text-align: left;
              margin-left: 14rem;
              margin-top: 3vh;
            }
          
            .container img {
              margin: -4px 8px -4px -4px;
            }
          
            .footer-heading {
              flex-basis: 30%;
              margin-bottom: 20px;
            }
          
            .footer-heading h3 {
              font-size: 20px;
              margin-bottom: 10px;
            }
          
            .footer-heading p {
              padding: 10px;
              font-size: 18px;
              font-weight: 400;
              line-height: 30px;
            }
          
            .footer-bottom {
              margin-top: 20px;
            }
          
            .footer-text {
              margin-left: -9px;
            }
          
           
            @media only screen and (max-width: 768px) {
              .container {
                flex-wrap: wrap;
                margin-left: 0;
              }
          
              .footer-heading {
                flex-basis: 100%;
              }
            }



            .fa-phone::before {
                content: "";
                color:#fff;
                padding: 10px;
                margin-left: -18px;

            


            }.fa-envelope::before {
              content: "";
              color:#fff;
              padding: 10px;
              margin-left: -18px;
          }




          @media (max-width: 480px) {


            .upbar {
              font-size: 14px;
            }

            .rating h4 {
             
              font-size: 13px;
            
            }
          




            .log h1 {
              color: #fff;
              text-align: center;
              font-size: 10px;
              margin-left: 8px;
          }


          .accordion .icon {
            width: 42px;
            height: 33px;
          }
        
.hero h1 {
  font-size: 36px;
}
 
.hero p {
  font-size: 18px;
  margin-left:0px;
  text-align: center;
}

.hero ul {
font-size: 14px;
}

.hero .btn {
  margin-left: 3rem;
}

.logos p {
  font-size: 15px;
}


.last_section_inner2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 24px;
  padding: 40px 0;
  margin-left: 4rem;
}



.looking-to-learn-2  {
  font-size: 22px;
  font-weight: 400;
  text-align: center;
  color: #0F0F0F;
}




.at-exion-we {
  font-size: 28px;
  margin-left: 10px;
  color: #fff;
  padding: 0 30px;
  font-weight: 700;
  margin-bottom: 25px;
  text-align: center;


}

.c-text {
  color: white;
  font-size: 13px;
  font-weight: 700;
}
.container99 h1 {
  color: #222C49;
  font-size: 33px;
  margin-top: 70px;
}

.container99 h6 {
  color: #222C49;
  font-size: 22px;
  padding-top: 32px;
  font-weight: 500;
}

.container100  {
  max-width: 100%;
  padding-bottom: 35px;
}

.accordion h5 {

    font-size: 20px;
    margin: 0;
    padding: 3px 0 0 10px;
    font-weight: 300;
    color: #222C49;
    width: 505px;
 
}
}

/*testimonial carousel */

.card_outer {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: 'Popins', sans-serif;
  transition: all 0.5s ease;
  justify-content: center;
  align-items: center;
  align-content: center;
  
  display: flex;
  margin-top: -5rem;
}
.card_inner_1 {
  width: 80%;
  
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
    padding: 0 50px;
}



.card {
  
  padding: 20px 60px;
    display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.card .image {
  width: 130px;
  height: 130px;
  padding: 3px;
  border: 1px solid white;
  background: #fff;
  border-radius: 50%;
  margin-bottom: 20px;
}
.card .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.card h3 {
  color: #222C49;
  text-align: center;
  font-family: Inter;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 3px;
  text-transform: uppercase;


  padding-top:20px;
  
}
.card p {
  font:inter;
  font-size: 16px;
  opacity: 0.8;
  color: black;
  text-align: center;
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
}
.swiper-container {
  position: relative;
  margin: 0 auto;
  width: 100%;
}
.swiper {
  margin: 0 auto;
  cursor: grab;
}
.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper-button-next,
.swiper-button-prev {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 10px #ccc;
}
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 16px;
  font-weight: bold;
  color: #000;
}
.swiper-button-next:hover {
  transform: scale(1.2) translateX(80%);
}
.swiper-button-prev:hover {
  transform: scale(1.2) translateX(-80%);
}
.swiper-button-next {
  transform: translateX(100%);
}
.swiper-button-prev {
  transform: translateX(-100%);
}
.swiper-pagination {
  transform: translateY(200%);
}
.swiper-pagination-bullet {
  background: #fff;
  width: 15px;
  height: 15px;
}

/*faq-section*/
.questions-container-inner{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.questions-container-outer{
  font-family: 'Open Sans', sans-serif;
  color: #222C49;
 
}
.questions-container{
  max-width: 800px;
  margin: 0 auto;
}

.question{
  border-bottom: none;
}
.question button{
  width: 100%;
  background-color: #F6F6F6;
  display: flex;
  column-gap: 1rem;
  transform-origin: left;
  align-items: center;
  padding: 20px 0;
  border:none;
  outline: none;
  font-size: 22px;
  color:  #222C49;;
  cursor: pointer;
  font-family: 'Inter';
font-size: 22px;
font-style: normal;
font-weight: 300;
line-height: 25px;
}
.question p{
    max-height: 0;
  opacity: 0;
  
  overflow: hidden;
  transition: all 0.6s ease;
  color: #222C49;

font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 23px;
}
.d-arrow{
  transition: transform 0.5s ease-in ;
  color: #fff;
  content: url('images/c_plus.svg');
  height: 30px;
  width: 30px;
}

/*add this class when click*/
.question p.show{
  max-height: fit-content; 
  opacity: 1;
  padding:0px 15px 30px 15px;
  margin-top: 10px;
}


.rotate {
    content: url('images/c_minus.svg');
}


/*blog slider*/

.slider-ctn__1 {
  padding: 20px 0;
  width: 80%;
  margin: auto;
  /*overflow: hidden;*/
  position: relative;
  margin-top: 20px;
  
  
}

.s_100 {
  display: flex;
  transition: opacity 0.5s ease-in-out;
}

.ctn__1 {
  flex: 0 0 100%;
  text-align: center;
  opacity: 1;
  display: none;
  
}

.ctn__1.active {
  display: flex;
  justify-content: center;
  

}

.image-ctn__1 {
 width:50%;
 height: auto;
  box-sizing: border-box;
 margin: auto;
  
  

}

.ctn__1 img {
  height:90%;
  width: 90%;
  
}

.text-ctn__1 {
 
  color:#000;
  width: 70%;
  box-sizing: border-box;
  padding: 20px;
  text-align: left;

}

.text-ctn__1 p {
  color: #001D3D;
padding: 10px 0;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;

}


.text-ctn__1 h2 {
  color: #001D3D;
  

font-family: Inter;
font-size: 35px;
font-style: normal;
font-weight: 600;
line-height: 38px; /* 108.571% */
letter-spacing: 1.75px;
text-transform: uppercase;
}

.nav-buttons100 {
  text-align: center;
  margin-top: 10px;

}

.nav-button100 {
  cursor: pointer;
  font-size: 14px;
  padding: 20px 15px;
  margin: 0 5px;
  color: #000;
 text-align: center;
  font-family: Inter;
  background-color: white;
  font-style: normal;
  font-weight: 600;
  line-height: 20px; /* 133.333% */
  letter-spacing: 0.75px;
  text-transform: uppercase;
border:none; }

.nav-button100.active {
  position: relative;
  border-bottom: 2px solid red; /* Red line below the selected button */
  
}


.rating__2 {
	display:flex;
	align-items:center;
  padding:10px 0;
}
.rating__2 img {
	width:80px;
}
.rating__2 span {
	margin-left:5px;
	font-size:16px;
	color:#151D2B;
}
.rating span strong {
	font-weight:700;
}


.container99 hr {
  margin-top:20px;
 
  width:30%;
  text-align: center;
  
}

.strong {
  font-weight: 900;
  color:white;
}







/**********HERO LIST ****************/


.section23 {
  width: 90%;
  display: flex;
  transform-origin:left;
  margin: auto;
  align-content: center;
  padding: 10px 0;

}

.div23 {
	width: 5%;
  display: flex;
   justify-content: center;
  align-items: flex-start;

 
}
.div24
{
 width: 80%;
 display: block;
 font-family: 'inter';
 color:white;
 overflow-x:hidden;
 font-size: 18px;
 padding: 0 10px;
}






@media only screen and (max-width:480px) {
  .nav-button100.active {
    position: relative;
    border-bottom: 2px solid red; /* Red line below the selected button */
   
    background-color: aliceblue; /* Red line above the selected button */
  }
  
 
  .rating__2 img {
    width:73px;
    }
    .rating__2 span {
    font-size:14px;
    }
    .rating__2 {
      display:block;
      align-items:center;
    }


    .slider-ctn__1 {
      padding: 0 0;
      width: 100%;
      margin: auto;
      overflow: hidden;
      position: relative;
      margin-top: 20px;
      
      flex-wrap: wrap;
      display: block;
      
    }
    
    .s_100 {
      display: block;
      transition: opacity 0.5s ease-in-out;
    }
    
    .ctn__1 {
      flex: 0 0 100%;
      text-align: center;
      opacity: 1;
      display: none;
      
    }

    .text-ctn__1 {
     
      color:#000;
      width: 100%;
      box-sizing: border-box;
      padding: 20px;
      text-align: center;
    
    }
    .image-ctn__1 {
    
      width:100%;
      
       box-sizing: border-box;}
      
       .ctn__1.active {
        display: block;
        justify-content: center;
       }

        .nav-button100 {
          cursor: pointer;
          font-size: 16px;
          padding: 20px 15px;
          margin: 0 5px;
          color: #000;
         text-align: center;
          font-family: Inter;
          background-color: white;
          font-style: normal;
          font-weight: 900;
          line-height: 20px; /* 133.333% */
          letter-spacing: 0.75px;
          text-transform: uppercase;
        border:none; }
     

}

/*blog slider*/



/*about us */
@media only screen and (max-width:480px) {
.image-section {

  display: none;
  text-align: center; 
  width: 40%;
 
}

.text-section {
    
            
  
  background-image: url('images/bg-3.png');
  background-size: cover;
  background-repeat: no-repeat;
  
  width:100%;
                      }
                    }
/**/

/*faq section*/
@media only screen and (max-width:480px) {
.box21 {
  display: flex;
  width: 100%;
  justify-content: center;
  background-color: #F6F6F6;
  
 
  
}


.box_inner {
  display:block;
  width: 90%;
  
  
  justify-content: center;
}

.container99 {
  display: block;
  text-align: center;
  



}
.container100 {
  
  max-width: 100%;
    padding: 10px 10px;
  
 

}

.container99 h6 {
  color: #222C49;
font-size: 16px;
font-weight: 400;
font-family: sans-serif;


}


.container99 h2 {
  color: #222C49;
font-size: 16px;
padding: 10px 0;
max-width: 523px;
font-style: normal;
font-weight: 400;
line-height: normal;
letter-spacing: 2.4px;
text-transform: uppercase;



}

.container99 h1 {
  color: #380000;
  font-size: 46px;
  width: 100%;
   font-weight: 700;
  line-height: normal;
  margin:auto;

}


.questions-container-inner{
  margin: auto;
  padding: 0;
  box-sizing: border-box;
}

.questions-container-outer{
   color: #222C49;
 
}
.questions-container{
  margin:  auto;
  display: block;
}

.question{
  border-bottom: none;
}
.question button{
  width: 100%;
  background-color: #F6F6F6;
  display: flex;
  transform-origin: left;
  padding: 20px 0;
  border:none;
  outline: none;
  font-size: 22px;
  color:  #222C49;;
  cursor: pointer;
  font-family: 'Inter';
font-size: 16px;
font-style: normal;
font-weight: 300;
line-height: 25px;
text-align: left;
column-gap: 1rem;

}
.question p{
    max-height: 0;
  opacity: 0;
    overflow: hidden;
  transition: all 0.6s ease;
  color: #222C49;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 23px;
text-align: center;
}
.d-arrow{
  transition: transform 0.5s ease-in ;
  color: #fff;
  content: url('images/c_plus.svg');
  height: 30px;
  width: 30px;
}

/*add this class when click*/
.question p.show{
  max-height: fit-content; 
  opacity: 1;
  padding:0px 15px 30px 15px;
}


.rotate {
    content: url('images/c_minus.svg');
}
.container99 hr {
  display: none;
  
  width:20%;
  text-align: center;
  margin: auto;
}

footer {
  background-image: url('images/hero-bg.png');
  background-size: cover;
  background-position: right center;
  text-align: center;
  padding: 20px;
  color: #c8c5c5;
  width: 100%;
  background-color: #151B29;
}

.container {
  display: flex;
 text-align: center;
}



}


/***************** HOW TO DO IT ****************/

@media only screen and (max-width:480px) {
.steps {

  display: block;
  
 
  margin: auto;
}
.step {
  padding: 20px 0;
  margin: auto;
  text-align: center;
  
}

.get-start {
  padding: 10px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1.5;
 
  box-sizing: border-box; 
}

.btn-1 {
  display: inline-block;
  background-color: #1BCC62;
  color: #fff;
  padding: 20px 0;
  text-decoration: none;
  margin: 30px 0;
  height: 60px;
  color: #FFF;
width: 100%;
text-align: center;
font-family: Inter;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.75px;
text-transform: uppercase;
  
}

.scroller__inner img {
  width:200px;
  list-style-type:none;
}



}


/***********************************************TESTIMONIALS*******************/
@media only screen and (max-width:480px) {
.card_outer {
  padding: 0;
  margin: 0;
  box-sizing: 0;
  font-family: 'Popins', sans-serif;
  transition: all 0.5s ease;
  justify-content: center;
  align-items: center;
  align-content: center;
  
  display: flex;
  margin-top: -5rem;
}
.card_inner_1 {
  width: 90%;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding:0;
  
}



.card {
  
  padding: 0 0;
      display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin: 20px 0;
  
}

.card_outer {
  padding: 0;
  margin: 0;
  box-sizing:none;
  font-family: 'Popins', sans-serif;
  transition: all 0.5s ease;
  justify-content: center;
  align-items: center;
  align-content: center;
 
  display: flex;
  margin-top: -5rem;
}

.swiper-pagination-bullet {
  background: #fff;
  width: 15px;
  height: 15px;
  display:none;
}

.card h3 {
  color: #222C49;
  text-align: center;
  font-family: Inter;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 3px;
  text-transform: uppercase;


  padding-top:20px;
  padding-bottom: 40px;
}
}


/****************************************************************LOOKING FOR MORE****/



/******************HERO*****/
@media only screen and (max-width:480px) {
      .hero h1 {
      font-size: 26px;
      text-align: center;
      padding: 10px 20px; 
      margin-left: 0;

    }

    .hero_inner {
      
      max-width: 100%;
      align-items: center;
      
    }

  

    .hero {
      display: block;
margin: auto;

    }

    .section23 {
      width: 80%;
      display: flex;
      transform-origin:left;
      margin: auto;
      justify-content: center;
      align-items: center;
      padding: 10px 0;
      align-content: center;
    }
      .div24 {
width: 100%;
font-size: 17px;
padding: 0 20px;
      }

      .btn-2 {
        display: inline-block;
        background-color: #1BCC62;
        color: #fff;
        padding: 20px 0;
        text-decoration: none;
        margin-left:0px;
        height: 60px;
        color: #FFF;
      width: 100%;
      text-align: center;
      font-family: Inter;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      letter-spacing: 0.75px;
      text-transform: uppercase;
      margin: 30px 0;
        
      }

      .about-section {
        padding: 0 0;
        text-transform: uppercase;
      }

      .text-section {
        padding: 0 0;
        
      }

      .about-paragraph {
        font-size:18px;
      }

      .head-1 {
        line-height: 1.2;
        font-size: 32px;
      }
      
      .step h2 {
        margin: 15px 0;
        color: #cc0000;
        font-size: 26px;
      }
      
      .step p {
        font-size: 18px;
        margin: 15px 0;
        line-height: 30px;
        text-align: center;
      }

      .head-2 {
        font-size: 16px;
        padding: 0 20px;
      }


      .btn-3 {
        display: inline-block;
        background-color: #1BCC62;
        color: #fff;
        padding-top: 20px;
        text-decoration: none;
        margin-left:0px;
        height: 60px;
        color: #FFF;
      width: 100%;
      text-align: center;
      font-family: Inter;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      letter-spacing: 0.75px;
      text-transform: uppercase;
      margin: 0;
        
      }
  
      

.last_section_inner2 {
  margin-left: 0;
  display: flex;
  
}

.last_section_box { 
display: flex;
flex-direction: column;
  
  justify-content: center;
  align-items: center;
  align-content: center;
  }
  .last_section_box img { 
   height: 420px;
      }

      .last_section_box h1 { 
        height: auto;
        width: auto;
        text-align: center;
        padding:0;
        padding-top:0px;
        padding-bottom:10px;
           }
           .last_section_box p { 
            height: auto;
            width: auto;
            text-align: center;
            padding:10px 0
               }

               .read-more-wrapper
               {
                width: 100%;
                margin: 10px 0;
               }

               .overlap-7 {
                margin-top: 0;
                max-height: 500px;
               }


               .card_outer {
                margin-top:0;
               }

               .text-ctn__1 h2 {
                font-size: 20px;
                letter-spacing: 0;
                line-height: normal;
                font-weight: 900;
               }

               .about-section p {
                text-transform: none;
               }

               .about-section {
                width:100%;
                padding-top: 30px;
               }

               .about-paragraph {
                margin-top: 0;
                padding: 10px 0;
               }

               .about-sec-heading {
              
                width:100%;
                
              }

              .rating { 
                flex-direction:column;
                gap:10px;
                margin-left: 0;

              }

              .rating img {

                width:auto;
                height:auto;


              }

              .achievement-item p {
                font-size: 22px;
                font-weight: 700;



              }

              .achiev h3 {
                font-size: 70px;
                font-weight: 400;
                padding-bottom: 10px;


              }
              .achievement {
                padding:0;
              }

              .achievement-item {
flex:none;
margin: 0;

              }

              .achiev {
                padding: 30px 0;


              }

              .btn-4  {
                margin:0;
                margin-top: 20px;
                width: 100%;


              }


}


nav.sticky {
  position: fixed;
  top:0;
  left:0;
}

.counter {
font-size: 56px;


}


.card.Custom_card_swiper {
    padding: 20px 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border: solid;
    background: white;
    border-radius: 5px;
box-shadow: 0px 0px 5px 3px rgba(227,227,227,0.57);
    height: -webkit-fill-available;
    margin-bottom: 50px;
    min-height: 36vw;
    
}


.card.Custom_card_swiper p {
    flex: 1;
}