.teach-smart {
  margin: 0;
  text-transform: uppercase;
  font-family: Inter;
  font-size: 40px;
  font-weight: 800;
  line-height: 40px;
  text-align: left;
}
.tech-smart-descritpion{
  font-family: Inter;
  font-size: 16px;
  font-weight: 300;
  /* line-height: 16.8px; */
  text-align: left;
  width: 385px;
  /* height: 34px; */    
}
#teach-smart-description-two{
  width: 369px;
}
#teach-smart-desciption-three{
  width: 385px;
}
#teach-smart-description-one{
  width: 384px;
}
#teach-smart-title-one{
  width: 460px;
  font-family: "Inter";
  font-size: 38px;
}
.tlms-success-stories{
  font-family: Inter;
font-size: 20px;
font-weight: 700;
line-height: 25px;
text-align: left;
width: 142px;
color: #FFFFFF;

}
.image-slider {
  position: relative;
  width: 100%;
  height: 500px;
  overflow: hidden;
  margin: 0 auto; /* Center align if needed */
}

.image-slider .slide {
  position: absolute;
  width: 100%;
  /* height: 100%; */
  opacity: 0;
  transition: opacity 1s ease-in-out;
  /* background-size: 100% 100%; */
  object-fit: contain;
  background-repeat: no-repeat;
}

.image-slider .slide.active {
  opacity: 1;
}

.teach-smart {
  display: none; /* Hide all titles by default */
  opacity: 0;
  transition: opacity 1s ease-in-out;
  line-height: 45px;
}

.teach-smart.show {
  display: block; /* Show only the active title */
  opacity: 1;
  line-height: 45px;
}

.teach-smart-descritpion {
  display: none; /* Hide all descriptions by default */
  opacity: 0;
  transition: opacity 1s ease-in-out;
  font-size: 16px;
  font-family: "Inter";
}

.teach-smart-descritpion.show {
  display: block; /* Show only the active description */
  opacity: 1;
  font-size: 16px;
  font-family: "Inter";
}

.home-360-classroom-description{
  font-family: Inter;
  font-size: 14px;
  font-weight: 300;
  line-height: 14.7px;
  text-align: left;
  width: 391px;
}
.home-360-classroom-contents{
  display: flex;
  flex-direction: column;
  gap: 15px;
}


.teach-smart-learn-container {
  margin: 0;
  align-self: stretch;
  /* height: 126px; */
  position: relative;
  font-family: Inter;
  font-size: 40px;
  font-weight: 800;
  line-height: 40px;
  text-align: left;    
  width: 425px;
  text-transform: uppercase;
  /* width: 464px; */
}
.home-tlms-container-whole{
  /* background: #F9F9F9; */
  background: #121C5E;
  display: flex;
  /* gap: 50px; */
  border-radius: 40px;
  padding: 55px 60px 0px;
  /* height: 571px; */
  width: 1004px;
}
.home-tlms-container-two-whole{
  background: #121C5E;
  display: flex;
  gap: 10px;
  border-radius: 40px;
  padding: 40px 50px 0px;
  width: 1004px;
  /* height: 216px; */
}
.tlms-global-home{
  display: flex;
  flex-direction: column;
  background: #F9F9F9;
  /* gap: 10px; */
}

.tlms-global-home .sec-success-stories{
  background-color: #F2F2F2 !important;
}

.sec-success-stories {
  width: 100%;
  position: relative;
  /* background-color: #eceff1; */
  background: #F9F9F9 !important;
  overflow: hidden;
  flex-direction: column;
  justify-content: center;
  padding: 40px var(--padding-119xl) 0px;
}
.red-divider{
  padding-bottom: 55px;
}
.sec-success-stories-container-two{
  width: 100%;
  position: relative;
  background-color: #eceff1;

  /* overflow: hidden; */
  flex-direction: column;
  justify-content: center;
  padding: 30px var(--padding-119xl);
}
.cards-container {
  width: 490px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px 10px;
  /* flex: 0; */
  
  
}
.cards-container-two{
  width: 346px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px 10px;
  /* flex: 0; */
}

.cards-container-blue-image{
  background-image: url("../../assets/home/katon2.0_home_four_blue.svg");
  background-repeat: no-repeat;
  /* width: 363.7px; */
  position: relative;
  /* border: 2px solid; */
  height: 240px;
  width: 464px;
  /* border: 2px solid; */
  /* width: 100%; */
  height: 247px;
  justify-content: flex-end;
  display: flex;
  /* padding-top: 210px; */
}
.cards-container-blue-image-two{
  background-image: url("../../assets/home/katon2.0_home_tlms_second.svg");
  background-repeat: no-repeat;
  /* width: 363.7px; */
  position: relative;
  /* border: 2px solid; */
  width: 100%;
  height: 185px;
  justify-content: center;
  display: flex;
}
.cards-container-blue-image-two img{
  width: 80%;
  /* width: 100%; */
  position: absolute;
  /* left: 45px; */
  bottom: 0%;
}
.cards-container-blue-image img{
  position: absolute;
  bottom: 0%;
  width: 397px;
  height: 506px;
  right: 30px;

}

.web-content {
  flex: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* gap: var(--gap-sm); */
  text-align: left;
  font-size: var(--font-size-41xl);
  color: var(--color-black);
  font-family: var(--font-inter);
  gap: 5px;
}
.web-content-lady{
  flex: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  /* gap: var(--gap-sm); */
  text-align: left;
  font-size: var(--font-size-41xl);
  color: var(--color-black);
  font-family: var(--font-inter);
  gap: 5px;
  padding-top: 60px;
}
.web-content-two{
  /* flex: 1; */
  display: flex;
  /* flex-direction: column; */
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  text-align: left;
  font-size: var(--font-size-41xl);
  color: var(--color-black);
  font-family: var(--font-inter);
  width: 275px;

}
.content-section-katon-projectors{
  display: flex;
  /* flex-direction: column; */
  /* align-items: center;
  justify-content: center; */
  gap: var(--gap-sm);
  text-align: left;
  font-size: var(--font-size-41xl);
  color: var(--color-black);
  font-family: var(--font-inter);
  /* width: 275px; */
  flex: 1;
  /* height: 390px; */
}
.main-content,
.sec-success-stories {
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
.sec-success-stories-container-two{
  display: flex;
  align-items: center;
  box-sizing: border-box;
}


.icinterfacearrow-right-icon2 {
  /* width: 24px; */
  position: relative;
  /* height: 24px; */
  object-fit: cover;
}

.cta2 {
  cursor: pointer;
  border: 0;
  padding: 8px 30px;
  
  background-color: #121C5E;
  border-radius: var(--br-base);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-sm);
  width: 100%;
  height: 38px;
  color: #FFFFFF;

}
.cta2-preorder{
  cursor: pointer;
  border: 0;
  /* padding: 8px 10px; */
  
  background-color: #121C5E;
  border-radius: var(--br-base);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  width: 130px;
  height: 38px;
  color: #FFFFFF;
}
.explore4-explore{
  font-family: Inter;
font-size: 14px;
font-weight: 500;
line-height: 16.94px;
/* text-align: left; */

}
.cta2-onboard{
  cursor: pointer;
  border: 0;
  padding: var(--padding-6xs) 17px;
  
  background-color: #121C5E;
  border-radius: var(--br-base);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-sm);
  width: 200px;
  height: 38px;
  color: #FFFFFF;
}
.explore4-onboard{
  font-family: Inter;
  font-size: 14px;
  font-weight: 500;
  line-height: 16.94px;
  /* text-align: left; */

}
.cta2-contact{
  cursor: pointer;
  border: 0;
  padding: 20px 15px;
  background: #F9F9F9;
  /* background-color: #121C5E; */
  border-radius: var(--br-base);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  text-align: center;
  width: 146px;
  height:38px;
  border: 1px solid #121C5E;
  color:  #121C5E;
}
/* .cta2-contact:hover{
  background-color: #121C5E;
} */
.cta2-contact .explore4 {
  color:  #121C5E;
}
.cta2-contact .explore4:hover {
  color:  #121C5E;
}


.explore4 {
  position: relative;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--font-inter);
  /* color:  #121C5E; */
  text-align: left;
}
.explore4:hover{
  color:#FFFFFF;
}

/* .cta2-contact div{
  color: #121C5E;
} */
.cta2-contact .div:hover{
  background-color: #121C5E;
  color:#FFFFFF;
}
.katon-explore-a{
  text-decoration: none;
}

.katon-360-apps {
  position: relative;
  font-weight: 500;
  font-size: 14px;
}

.cta-text2 {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 25px;
  /* gap: var(--gap-15xl); */
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.cta-text2-360-classroom{
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-15xl);
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
  margin-top: 35px;
}
.cta-text2-early-bird{
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-15xl);
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
  margin-top: 30px;
}
.cta-text2-preorder{
  align-self: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-15xl);
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.header-content,
.hero-content,.hero-content-two{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.header-content {
  align-self: stretch;
  /* gap: var(--gap-sm); */
  gap: 5px;
}

.hero-content {
  flex: 1;
  padding: 70px 0 0;
}
.hero-content-two{
  flex: 1;
  padding: 65px 0 0;
}
.little-school-girl-1 {
  align-self: stretch;
  height: 459px;
  position: relative;
  border-radius: var(--br-11xl);
  max-width: 100%;
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
}

.carousal-child {
  width: 5px;
  position: relative;
  border-radius: 50%;
  height: 5px;
  object-fit: cover;
}

.carousal {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  gap: 6px;
}

.image {
  width: 364px;
  height: 484px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: var(--gap-2xs);
}

.contact-us1,
.main-content3,.main-content3-360-classroom{
  font-family: var(--font-inter);
  text-align: left;
}

.main-content3 {
  /* align-self: stretch; */
  display: flex;
  flex-direction: row;
  /* flex-wrap: wrap; */
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-13xl) 0 var(--padding-39xl);
  gap: 70px;
  /* font-size: var(--font-size-41xl); */
  color: var(--color-black);
}
.main-content3-360-classroom{
  display: flex;
  flex-direction: row;
  /* flex-wrap: wrap; */
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 var(--padding-13xl) 0 80px;
  /* gap: 60px; */
  /* font-size: var(--font-size-41xl); */
  color: var(--color-black);
}

.contact-us1 {
  cursor: pointer;
  position: relative;
  font-size: var(--font-size-xs);
  /* font-weight: 300; */
  color: var(--color-midnightblue);
}

.cta3 {
  cursor: pointer;
  border: 1px solid var(--color-midnightblue);
  padding: var(--padding-xs-5) var(--padding-22xl);
  background-color: #f1f1f1;
  border-radius: var(--br-base);
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.cta3-a{
  width: 100%;
  height: 38px;
  display: flex;
}
.cta3:hover{
  background-color: var(--color-steelblue);
  border: none;
}
.cta3:hover label{
  color: white;
}
.stats1 {
  cursor: pointer;
  position: relative;
  font-size: 12px;
  font-weight: 300;
  font-family: var(--font-inter);
  color: var(--color-white);
  text-align: left;
}

.stats-child {
  width: 4px;
  position: relative;
  border-radius: 10px;
  height: 17px;
  object-fit: cover;
}

.contact-us,
.stats {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
}

.stats {
  cursor: pointer;
  border: 0;
  padding: var(--padding-2xs-5) 12px var(--padding-2xs-5) var(--padding-xl);
  background-color: var(--color-steelblue);
  border-radius: var(--br-base);
  gap: var(--gap-base);
}

.contact-us {
  align-self: stretch;
  flex-wrap: wrap;
  padding: 0 0 0 var(--padding-39xl);
  gap: 15px;
  margin-top: 20px;
  /* width: 946px; */
}

.container3,
.sec-banner,
.home_360_classroom {
  display: flex;
  flex-direction: column;
  /* align-items: center; */
}

.container3 {
  /* width: 1004px; */
  justify-content: flex-start;
  /* max-width: 1004px; */
}


.rotate-on-hover {
  transition: transform 0.3s ease;
}

.rotate-on-hover:hover {
  transform: rotate(-180deg);
  /* Adjust the degree of rotation as per your preference */
}
.rotate-on-hover.touch-hover {
  transform: rotate(-180deg);
  /* Adjust the degree of rotation as per your preference */
}
.rotate-on-hover.remove-touch-hover {
  transform: rotate(0deg);
}
.sec-banner {
  width: 100%;
  /* height: 720px; */
  position: relative;
  justify-content: end;
  padding: 175px var(--padding-119xl) var(--padding-8xl);
  box-sizing: border-box;
  /* background-image: url(../../assets/home/banner_bg.png); */
  /* background-size: cover; */
  background-size: 100% 100% !important;
  background-repeat: no-repeat;
  background-position: top;
  /* background-color: #f1f1f1; */
  background: #F9F9F9;
}
.home_360_classroom{
  width: 100%;
  /* height: 720px; */
  position: relative;
  justify-content: end;
  padding: 152px var(--padding-119xl) 152px;
  box-sizing: border-box;
  /* background-image: url(../../assets/home/banner_bg.png); */
  /* background-size: cover; */
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: top;
  /* background-color: #f1f1f1; */
  background: #F2F2F2;
  height: 735px;
}

.reconceptualizing-education-content-Ict {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.early-bird-banner{
  display: flex;
  flex-direction: column;
  background: #F2F2F2;
  padding: 70px var(--padding-119xl) 112px;
  box-sizing: border-box;
 
  background-repeat: no-repeat;
  background-position: top;
  background-size: 100% 100%;
}
.early-bird-container-section{
  padding: 0px 0px 0 60px;
  display: flex;
  gap: 60px;
}
.early-bird-content-title{
  font-family: Inter;
  font-size: 40px;
  font-weight: 800;
  line-height: 38.4px;
  text-align: left;
  width: 431px;
  color: #000000;
}
.early-bird-content-description{
  font-family: Inter;
  font-size: 16px;
  font-weight: 300;
  line-height: 20.48px;
  text-align: left;
  width: 421px;
  color: #000000;  
  padding-top: 34px;   
}
.cta2-early-button{
  cursor: pointer;
  border: 0;
  /* padding: var(--padding-6xs) 17px; */
  background-color: #121C5E;
  border-radius: 16px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-sm);
  width: 100%;
  height: 38px;
  padding: 7px 26px 7px 26px;
  gap: 10px;
}
.explore4{
  font-family: Inter;
  font-size: 14px;
  font-weight: 500;
  line-height: 16.94px;
  text-align: left;
  color: #FFFFFF;
}

@media screen and (max-width: 500px) {
  .sec-banner{
      background-color: #eceff1;
      background-image: unset !important;
  }
}
/* #accordionExample{
  display: none;
} */
.outerContainer-accordion{
  display: none;
}
@media screen and (max-width: 1200px) {
  .teach-smart-learn-container {
      font-size: 48px;
      flex: 1;
  }

  .header-content {
      gap: var(--gap-sm);
  }
}

@media screen and (max-width: 992px) {
  .main-content3-360-classroom{
      display: block;
  }
}

@media screen and (max-width: 960px) {
  .image-slider {
      width: 100%;
      margin-top: 20px;
  }
  .main-content3 {
      display: block;
  }
  .sec-banner {
      background-image: none !important;
  }
  .teach-smart-learn-container {
      font-size: var(--font-size-23xl);
  }

  .container3 {
      width: 100%;
  }

  .sec-banner {
      padding-left: var(--padding-31xl);
      padding-right: var(--padding-31xl);
      padding-top: 170px;
      box-sizing: border-box;
  }
  .grow:hover{
      width: 79%;
  }

  .outerContainer-accordion{
      display: flex;
      width: 364px;
      position: relative;
  }
  .Contact-us-anchor{
      width: 364px;
  }
  .accordion{
      width: 100%;
      position: absolute;
      z-index: 9;
  }
  .accordion-item{
      background-color: var(--color-steelblue);
      border: none;
      border-radius: 16px !important;
  }
  .accordion-button{
      background: transparent;
      border: none;
      outline: none;
      font-size: var(--font-size-xs);
      font-weight: 500;
      font-family: var(--font-inter);
      color: var(--color-white);
      text-align: left;
      height: 50px;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  .cta3{
      height: 50px;
  }
 .labelStyle{
  width: 100%;
  text-align: center;
 }
  .accordion-button:focus{
      box-shadow: none;
      border: none;
  }
  .accordion-button::after{
      background-image: url(../../assets/home/Caretup.png);
  }
  .accordion-button:not(.collapsed){
      background-color: transparent;
      box-shadow: none;
      color: #53BEFB;
  }
  .accordion-button:not(.collapsed)::after{
      background-image: url(../../assets/home/Caretup.png);
      transform: rotate(-180deg);
  }
  .accordion-body{
      font-size: 16.5px;
      font-family: var(--font-inter);
      color: #FFFFFF;
      font-weight: 300;
  }
  .stats{
      display: none;
  }
  .slider-container{
      width: 100% !important;
  }
  .slide{
      width: 100% !important;
  }
  .cta3{
      background-color: var(--color-steelblue);
      border: none;
      flex: 1;
  }
  .cta3 label{
      color: white;
  }
  .home-tlms-container-two-whole {
      display: block;
      width: 100%;
      padding: 70px;
      margin-top: 30%;
  }
  .web-content-two {
      width: 100%;
      padding-top: 10px;
  }
  .cta-text-two {
      align-self: auto !important;
  }
  .home-360-classroom-description {
      width: 100%;
  }
  .home-360-image-container img {
      width: 100%;
  }
  .main-content3-360-classroom {
      padding: 10px 15px;
      display: block;
  }
  .home_360_classroom {
      padding: 10px 15px;
      justify-content: flex-start;
  }
}

@media screen and (max-width: 920px) {
  .grow{
      width: 10% !important;
  }
  .grow:hover{
      width: 100% !important;
  }
}

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

  .outerContainer-accordion{
      display: flex;
      width: 364px;
      position: relative;
  }
  .Contact-us-anchor{
      width: 364px;
  }
  .accordion{
      width: 100%;
      position: absolute;
      z-index: 9;
  }
  .accordion-item{
      background-color: var(--color-steelblue);
      border: none;
      border-radius: 16px !important;
  }
  .accordion-button{
      background: transparent;
      border: none;
      outline: none;
      font-size: var(--font-size-xs);
      font-weight: 500;
      font-family: var(--font-inter);
      color: var(--color-white);
      text-align: left;
      height: 50px;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  .cta3{
      height: 50px;
  }
 .labelStyle{
  width: 100%;
  text-align: center;
 }
  .accordion-button:focus{
      box-shadow: none;
      border: none;
  }
  .accordion-button::after{
      background-image: url(../../assets/home/Caretup.png);
  }
  .accordion-button:not(.collapsed){
      background-color: transparent;
      box-shadow: none;
      color: #53BEFB;
  }
  .accordion-button:not(.collapsed)::after{
      background-image: url(../../assets/home/Caretup.png);
      transform: rotate(-180deg);
  }
  .accordion-body{
      font-size: 16.5px;
      font-family: var(--font-inter);
      color: #FFFFFF;
      font-weight: 300;
  }
  .stats{
      display: none;
  }
  .slider-container{
      width: 100% !important;
  }
  .slide{
      width: 100% !important;
  }
  .cta3{
      background-color: var(--color-steelblue);
      border: none;
      flex: 1;
  }
  .cta3 label{
      color: white;
  }
  .home-tlms-container-two-whole {
      display: block;
      width: 100%;
      padding: 70px;
      margin-top: 30%;
  }
  .web-content-two {
      width: 100%;
      padding-top: 10px;
  }
  .cta-text-two {
      align-self: auto !important;
  }
  .home-360-classroom-description {
      width: 100%;
  }
  .home-360-image-container img {
      width: 100%;
  }
  .main-content3-360-classroom {
      padding: 10px 15px;
      display: block;
  }
  .home_360_classroom {
      padding: 10px 15px;
      justify-content: flex-start;
  }
}

@media screen and (max-width: 762px) {
  .sec-banner{
      padding-top: 55px;
  }
}
@media screen and (max-width: 500px) {
  .contact-us{
      gap: 43px;
  }
  .sec-success-stories-container-two {
      padding: 0px 15px;
  }
  .home-tlms-container-two-whole {
      display: block;
      width: 100%;
      padding: 50px 15px;
      margin-top: 45%;
  }
  .web-content-two {
      width: 100%;
  }
  .cta-text-two {
      align-self: auto;
  }
  .home-360-classroom-description {
      width: 100%;
  }
  .home-360-image-container img {
      width: 100%;
  }
  .main-content3-360-classroom {
      padding: 10px 15px;
      display: block;
  }
  .home_360_classroom {
      padding: 10px 15px;
  }
  .download {
      height: auto !important;
  }
  .cta-text2-360-classroom {
      display: block;
  }
  .content-section-katon-projectors-title {
      width: 100% !important;
      text-align: center !important;
  }
  .content-section-description-katon-projectors-one {
      line-height: 30px !important;
  }
  .content-section-description-katon-projectors {
      line-height: 30px !important;
  }
  /* .web-content-two .cta-text-two {
      display: block !important;
  } */
  .content-section-cta-text .cta-text-two {
      display: block;
  }
  .web-content-description-one {
      margin-top: 20px;
  }
  .content-section-cta-text .cta-text2-360-classroom {
      display: contents;
  }
}

@media screen and (max-width: 500px) {
  #teach-smart-description-one{
      width: 100% !important;
  }
  #teach-smart-title-four{
      width: 100% !important;
  }
}
@media screen and (max-width: 430px) {
  .sec-banner{
      padding-left: 30px !important;
      padding-right: 30px !important;
  }
  .contact-us{
      padding: 0;
  }
  .teach-smart-learn-container{
      font-size: 42px;
      font-weight: 800;
  }
  .katon-360-apps{
      margin-left: 5px;
      margin-bottom: -11px;
  }
  .container3{
      gap: 30px;
  }

  .teach-smart-learn-container {
      font-family: var(--font-inter);
      flex: 1;
  }

  .katon-360-apps {
      flex: 1;
  }

  .cta-text2 {
      gap: var(--gap-15xl);
  }

  .header-content,
  .hero-content {
      padding-top: 0;
      padding-bottom: 0;
      box-sizing: border-box;
  }

  .header-content {
      height: auto;
      gap: var(--gap-sm);
  }

  .hero-content {
      gap: 20px 181px;
      align-items: flex-start;
      justify-content: flex-start;
      flex: unset;
      align-self: stretch;
  }

  .little-school-girl-1 {
      align-self: stretch;
      width: auto;
      height: 420px;
  }

  .image,
  .main-content3 {
      align-self: stretch;
      width: auto;
      box-sizing: border-box;
  }

  .image {
      height: auto;
      gap: 12px 11px;
      align-items: center;
      justify-content: center;
      padding-top: 0;
  }

  .main-content3 {
      flex-direction: column;
      gap: var(--gap-51xl);
      padding: 0 0 40px;
  }

  .cta3 {
      flex: 1;
      padding-left: var(--padding-22xl);
      box-sizing: border-box;
  }

  .contact-us,
  .stats {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: flex-start;
  }

  .stats {
      width: 388px;
      gap: var(--gap-base);
      justify-content: center;
  }

  .contact-us {
      align-self: stretch;
      width: auto;
      justify-content: flex-start;
      padding-left: 0;
      box-sizing: border-box;
  }

  .container3,
  .sec-banner {
      width: 100%;
      align-items: center;
      box-sizing: border-box;
      margin-top: 60px;
  }
  .sec-banner {
      display: block;
  }

  .container3 {
      height: auto;
      justify-content: flex-start;
      padding-left: 0;
  }

  .sec-banner {
      /* height: 998px; */
      height: auto;
      flex-direction: column;
      gap: var(--gap-45xl);
      justify-content: flex-end;
      padding: var(--padding-8xl);
  }
  #teach-smart-desciption-three {
      width: 100% !important;
  }
  #teach-smart-description-two{
      width: 100% !important;
  }
  #teach-smart-description-one{
      width: 100% !important;
  }
  .teach-smart-descritpion {
      font-size: 15px;
  }
  .teach-smart-learn-container {
      width: 100%;
  }
  .teach-smart {
      font-size: 25px;
  }
  #teach-smart-title-three, #teach-smart-title-two, #teach-smart-title-one,#teach-smart-title-four {
      width: 100% !important;
  } 
  .image-slider {
      width: 100%;
  } 
}

@media screen and (max-width: 375px) {
  .teach-smart-learn-container {
      font-family: var(--font-inter);
  }
}

@media screen and (max-width: 350px) {
  .teach-smart-learn-container {
      font-weight: 700;
      font-family: var(--font-inter);
      font-size: var(--font-size-17xl);
      align-self: stretch;
      width: auto;
  }

  .header-content,
  .hero-content {
      align-self: stretch;
      width: auto;
      align-items: flex-start;
      justify-content: flex-start;
  }

  .hero-content {
      align-items: center;
      padding-top: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .little-school-girl-1 {
      align-self: stretch;
      width: auto;
      height: 350px;
  }

  .carousal {
      width: 318px;
      align-items: flex-start;
      justify-content: center;
  }

  .image,
  .main-content3 {
      padding-right: 0;
      box-sizing: border-box;
  }

  .image {
      width: 100%;
      flex: 1;
      gap: var(--gap-2xs);
      align-items: center;
      justify-content: center;
  }

  .main-content3 {
      align-self: stretch;
      width: auto;
      height: auto;
      gap: 70px 20px;
      padding-left: 0;
  }

  .container3,
  .sec-banner {
      align-items: center;
      justify-content: center;
      box-sizing: border-box;
  }

  .container3 {
      flex: 1;
      flex-direction: column;
      gap: 30px -1px;
      padding-left: 0;
      padding-right: 0;
  }

  .sec-banner {
      /* height: 1101px; */
      height: 1400px;
      gap: var(--gap-45xl);
      padding-left: var(--padding-base);
      padding-right: var(--padding-base);
  }
}





.steps-through {
  margin: 0;
  font-family: Inter;
  font-size: 40px;
  font-weight: 700;
  line-height: 40px;
  text-align: left;
  width: 448px;
  text-transform: uppercase;
}

.steps-through-to-container {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: inherit;
  /* line-height: 105.02%; */
  /* font-weight: 800; */
  /* font-family: inherit; */
  /* font-family: var(--font-inter);
  font-size: 40px;
  font-weight: 700;
  line-height: 40px;
  text-align: left;
  width: 370px; */
  color: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
#teach-smart-title-two{
  width: 500px;
  font-family: "Inter";
  font-size: 40px;
}
#teach-smart-title-three{
  width: 450px;
  font-family: "Inter";
  font-size: 40px;
}
#teach-smart-title-four{
  width: 404px;
  font-family: "Inter";
  font-size: 48px;
}
.home-tlms-global-description{
  font-family: Inter;
font-size: 16px;
font-weight: 300;
line-height: 16.8px;
text-align: left;
width: 380px;

color: #FFFFFF;

}

.explore1 {
  cursor: pointer;
  position: relative;
  font-size: var(--font-size-sm);
  font-weight: 500;
  font-family: var(--font-inter);
  /* color: var(--color-white); */
  text-align: left;
}

.icinterfacearrow-right-icon {
  width: 24px;
  position: relative;
  height: 24px;
  object-fit: cover;
}

.explore {
  cursor: pointer;
  border: 0;
  padding: var(--padding-6xs) var(--padding-xl-5);
  /* background-color: var(--color-steelblue); */
  border-radius: var(--br-base);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-sm);
  margin-top: 35px;
  background: #FFFFFF;
  width: 130px;
  height: 38px;
}

.explore1{
  color: #121C5E;

}
.tlms-success-stories {
  position: relative;
  font-weight: 600;
  font-size: 18px;
}

.cta-text,
.mob-content,
.content-section-cta-text {
  justify-content: flex-start;
  text-align: left;
  font-family: var(--font-inter);
}

.cta-text {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* gap: var(--gap-15xl); */
  gap: 10px;
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.content-section-cta-text{
  align-self: stretch;
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  /* gap: var(--gap-15xl); */
  gap: 35px;
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.cta-text-container-one{
  align-self: stretch;
  display: flex;
  /* flex-direction: column; */
  align-items: center;
  /* gap: var(--gap-15xl); */
  gap: 10px;
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.web-content-description-one{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.web-content-description-one-first-row{
  display: flex;
  flex-direction: column;
  gap: 65px;
}
.cta-text-two{
  align-self: stretch;
  display: flex;
  /* flex-direction: column; */
  /* align-items: center; */
  /* padding-top:25px; */
  /* gap: var(--gap-15xl); */
  gap: 40px;
  /* gap: 5px; */
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
}
.cta-text-onboard-stats{
  gap: 5px;
  font-size: var(--font-size-3xs);
  color: var(--color-gray-100);
  /* align-self: stretch; */
  display: flex;
}

.web-content-outer{
  width: 150.97px;
  height: 28.45px;
  border-radius: 9.92px 0px 0px 9.92px;
  opacity: 0px;
  background: #222C6D;
  /* text-align: center; */
  padding: 7px 20px;
  font-family: Inter;
  font-size: 11.61px;
  font-weight: 700;
  line-height: 14.52px;
  text-align: left;
  color: #FFFFFF;
  text-transform: uppercase;
}
.content-section-katon-projectors-outer{
  /* width: 150.97px;
  height: 28.45px; */
  border-radius: 9.92px 0px 0px 9.92px;
  opacity: 0px;
  /* text-align: center; */
  /* padding: 7px 20px; */
  font-family: Inter;
  font-size: 11.61px;
  font-weight: 700;
  line-height: 14.52px;
  text-align: left;
  color: #FFFFFF;
  /* text-transform: uppercase; */
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.content-section-katon-projectors-outer-title{
  text-align: center;
  padding-top: 10px;
  font-family: Inter;
font-size: 16px;
font-weight: 600;
line-height: 16.8px;
text-align: left;

}
.content-section-description-katon-projectors-one{
  color: #FFFFFF;

  /* width: 250px; */
  font-family: Inter;
font-size: 16px;
font-weight: 300;
line-height: 16.8px;
text-align: left;
padding-right: 20px;
width: 205px;
}
.content-section-description-katon-projectors{
 color: #FFFFFF;
 width: 208px;
/* width: 250px; */
font-family: Inter;
font-size: 16px;
font-weight: 300;
line-height: 16.8px;
text-align: left;
padding-right: 20px;

}
.web-content-title{
  font-family: Inter;
font-size: 12px;
font-weight: 300;
line-height: 15px;
text-align: left;
color: #FFFFFF;

}
.content-section-katon-projectors-title{
  width: 424px;
  font-family: Inter;
  font-size: 40px;
  font-weight: 800;
  line-height: 40px;
  text-align: left;
  color: #FFFFFF;
  text-transform: uppercase;

}
.web-content-outer-number{
  width: 95px;
  height: 28.45px;
  border-radius: 9.92px 0px 0px 9.92px;
  opacity: 0px;
  background: #222C6D;
  padding: 7px;
  border-radius: 0px 9.92px 9.92px 0px;
  opacity: 0px;
  font-family: Inter;
  font-size: 11.61px;
  font-weight: 700;
  line-height: 14.52px;
  text-align: center;
  color: #FFFFFF;

}
.mob-content {
  width: 206.2px;
  display: none;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--gap-13xl);
  font-size: var(--font-size-41xl);
  color: var(--color-black);
}

.image-icon {
  width: 100%;
  position: relative;
  /* border-radius: 27.35px; */
  /* height: 205.1px; */
  object-fit: cover;
}


.main-content {
  width: 1004px;
  /* height: 418px; */
  flex-direction: row;
  /* flex-wrap: wrap; */
  justify-content: flex-start;
  padding: 0 var(--padding-22xl);
  gap: 73px;
}

.testimonials-section{
  padding: 84px 0 142px 0;
  display: flex;
  flex-direction: column;
  gap: 37px;
  background-color: #F2F2F2;
}

.testimonial-title-style{
  text-align: center;
  font-size: 40px;
  line-height: 40px;
  color: black;
  font-weight: 800;
  font-family: 'Inter';
}

.testimonial-image-style{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.testimonial{
  width: 363px;
  min-width: 363px;
  padding: 36px 40px 67px 41px;
  background-color: #ECEFF1;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.image-and-subtitle-container{
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.image-and-subtitle-container .subtitle-style{
  font-size: 12px;
  line-height: 14.52px;
  font-weight: 500;
  font-family: 'Inter';
  color: #000000;
}

.testimonial .description-style{
  font-size: 12px;
  font-family: 'Inter';
  font-weight: 500;
  line-height: 14.52px;
  color: #000000;
}

.testimonials-scroll-container{
  display: flex;
  gap: 20px;
  overflow-x: auto;
}

.testimonials-scroll-container .testimonial:first-of-type {
  margin-left: 15%;
}

.testimonials-scroll-container::-webkit-scrollbar {
  display: none; /* Hide scrollbar in Chrome, Safari, and Edge */
}

.testimonials-scroll-container {
  -ms-overflow-style: none;  /* Hide scrollbar in IE and Edge */
  scrollbar-width: none;     /* Hide scrollbar in Firefox */
}

@media screen and (max-width: 1200px) {
  .testimonials-scroll-container .testimonial:first-of-type {
      margin-left: 12%;
  }

  .main-content {
      align-self: stretch;
      width: auto;
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .sec-success-stories {
      width: 100%;
      padding-left: var(--padding-119xl);
      padding-right: var(--padding-119xl);
      box-sizing: border-box;
  }

  .home-tlms-container-whole {
      width: 100%;
  }
}

@media screen and (max-width: 1080px) {
  .testimonials-scroll-container .testimonial:first-of-type {
      margin-left: 8%;
  }
}
@media screen and (max-width: 960px) {
  .steps-through-to-container {
      font-size: var(--font-size-23xl);
  }

  .image-icon {
      width: 100%;
      height: auto;
  }

  .cards-container {
      display: flex;
      flex: 1;
  }

  .web-content {
      flex: 1;
  }

  .main-content {
      align-self: stretch;
      width: auto;
      height: auto;
  }

  .sec-success-stories {
      display: flex;
      width: 100%;
      padding-left: var(--padding-31xl);
      padding-right: var(--padding-31xl);
      box-sizing: border-box;
  }
}

@media screen and (max-width: 646px) {
  .main-content{
      flex-direction: column-reverse;
  }
}
@media screen and (max-width: 670px) {
  .testimonials-scroll-container .testimonial:first-of-type {
      margin-left: 46px;
  }
  .testimonials-section{
      padding: 30px 0 30px 0px;
      gap: 32px;
  }
  .testimonial-title-style{
      font-size: 30px;
      line-height: 36.31px;
  }
  .testimonial{
      border: 1px solid #0000001F;
      padding: 30px 16px;
      width: 348px;
      min-width: 348px;
      gap: 12px;
  }
  .testimonials-scroll-container{
      gap: 14px;
  }
  .image-and-subtitle-container{
      flex-direction: row;
      align-items: end;
      gap: 7px;
  }
  .image-and-subtitle-container .subtitle-style{
      font-size: 14px;
      line-height: 16.94px;
  }
  .testimonial .description-style{
      text-align: center;
      width: 320px;
  }
}
@media screen and (max-width: 430px) {
  .sec-success-stories{
      padding-left: 30px;
      padding-right: 30px;
      padding-top: 115px;
  }
  .sec-download-apps{
      padding-left: 30px !important;
      padding-right: 30px !important;
  }
  .steps-through-to-container{
      font-size: 43px;
      font-weight: 800;
  }
}
@media screen and (max-width: 420px) {
  .steps-through-to-container {
      font-family: var(--font-inter);
  }

  .mob-content {
      display: flex;
      align-self: stretch;
      width: auto;
      flex-direction: column;
      gap: 5px;
  }

  .image-icon {
      width: 100%;
      height: auto;
  }

  .cards-container {
      width: auto;
      align-self: unset;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .main-content,
  .web-content {
      align-self: stretch;
      width: auto;
      flex-direction: column;
  }

  /* .web-content {
      display: none;
      flex: unset;
  } */

  .main-content {
      height: auto;
      gap: 64px 73px;
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .sec-success-stories {
      width: 100%;
      padding-bottom: var(--padding-61xl);
      padding-left: 30px;
      padding-right: 30px;
      box-sizing: border-box;
  }
  .steps-through{
      max-width: 100%;
      font-size: 27px;
      /* color: #000; */
  }
}

@media screen and (max-width: 375px) {
  .steps-through-to-container {
      font-family: var(--font-inter);
  }

  .image-icon {
      width: 100%;
      height: auto;
  }

  .cards-container {
      align-self: stretch;
      width: auto;
      align-items: flex-start;
      justify-content: center;
  }

  .web-content {
      flex: unset;
      align-self: stretch;
  }

  .main-content {
      flex-direction: column;
      gap: 48px 73px;
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .sec-success-stories {
      width: 100%;
      padding-bottom: var(--padding-61xl);
      padding-left: 30px;
      padding-right: 30px;
      box-sizing: border-box;
  }
}

@media screen and (max-width: 350px) {
  .steps-through-to-container {
      font-family: var(--font-inter);
  }

  .mob-content {
      align-items: center;
      justify-content: flex-start;
      display: none;
  }

  .image-icon {
      width: 100%;
      height: auto;
  }

  .cards-container {
      align-self: stretch;
      width: auto;
  }

  .main-content,
  .web-content {
      align-items: center;
      justify-content: flex-start;
  }

  .main-content {
      gap: 73px 32px;
      justify-content: center;
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }

  .sec-success-stories {
      padding-bottom: var(--padding-61xl);
      padding-left: 30px;
      padding-right: 30px;
      box-sizing: border-box;
  }
}




.qr-code-for-mobile-english-wik-icon {
  /* width: 138px;
  height: 138px; */
  width: 100%;
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
}
.qr-code-container{
  display: flex;
  flex-direction: column;
  /* gap: 20px; */
}
.qr-code-text-container{
  display: flex;
}
.download-the-katon {
  margin: 0;
  align-self: stretch;
  /* height: 66px; */
  position: relative;
  font-size: inherit;
  line-height: 101.66%;
  font-weight: 700;
  font-family: inherit;
  display: inline-block;
  width: 255px;
}

.download-the-katon1 {
  align-self: stretch;
  position: relative;
  font-family: Inter;
  font-size: 12.88px;
  font-weight: 400;
  line-height: 15.59px;
  text-align: left;
}

.container-home,
.download-text {
  flex: 1;
  display: flex;
  align-items: flex-start;
}

.download-text {
  height: 138px;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  text-align: left;
  font-size: var(--font-size-13xl);
  color: var(--color-white);
  font-family: var(--font-inter);
}

.container-home {
  flex-direction: row;
  justify-content: flex-start;
  gap: var(--gap-9xl);
}

.solid-icon {
  height: 62px;
  width: 62px;
  border-radius: var(--br-xl);
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
  /* position: absolute; */
}
.arrow-bg{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
}
.arrow-bg:hover {
  border-radius: 12px;
  background-color: #ffffff1a;
  padding: 60px 0px 60px 0px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
}

.main-content1 {
  /* flex: 0; */
  /* border-radius: 19px;
  border: 5px solid var(--color-white); */
  box-sizing: border-box;
  /* height: 227px; */
  height: 100%;
  display: flex;
  flex-direction: column;
  /* flex-wrap: wrap; */
  /* align-items: center; */
  justify-content: center;
  padding: 36px 15px;
      /* gap: var(--gap-9xl); */
}

.app-store-icon {
  width: 126px;
  height: 29.7px;
  object-fit: cover;
}

.apple-store {
  cursor: pointer;
  border: 1px solid var(--color-gray-200);
  padding: 0;
  background-color: transparent;
  width: 162px;
  border-radius: 8px;
  box-sizing: border-box;
  height: 47px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.image-icon4 {
  width: 126px;
  position: relative;
  height: 31.8px;
  object-fit: cover;
}

.google {
  cursor: pointer;
  border: 1px solid var(--color-gray-200);
  padding: 0;
  background-color: transparent;
  width: 162px;
  border-radius: var(--br-7xs);
  box-sizing: border-box;
  height: 47px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.image-icon5 {
  width: 126px;
  height: 32.7px;
  object-fit: cover;
}

.desktop {
  cursor: pointer;
  border: 1px solid var(--color-gray-200);
  padding: 0;
  background-color: transparent;
  width: 162px;
  border-radius: var(--br-7xs);
  box-sizing: border-box;
  height: 47px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.stores {
  border-radius: var(--br-11xl);
  background-color: var(--color-white);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: var(--padding-8xl) var(--padding-26xl);
  gap: var(--gap-base);
}

.download,
.sec-download-apps {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.download {
  /* width: 984px; */
  gap: 45px;
  background: #008CD1;
  width: 1004px;
  border-radius: 40px;
  height: 571px;
  padding: 30px;
}

.sec-download-apps {
  width: 100%;
  position: relative;
  /* background-color: var(--color-steelblue); */
  flex-wrap: wrap;
  padding: 60px 0px;
  box-sizing: border-box;
  background: #ECEFF1;
}

@media screen and (max-width: 1200px) {
  .download-the-katon {
      font-size: var(--font-size-13xl);
      align-self: stretch;
      width: auto;
  }

  .download-text {
      flex: 1;
      flex-direction: column;
      align-items: center;
      justify-content: center;
  }

  .container-home {
      flex: 1;
      flex-direction: row;
      gap: 28px 24px;
      justify-content: center;
      align-items: center;
  }

  .solid-icon {
      display: flex;
      width: 100px;
      align-self: stretch;
      height: auto;
      padding-left: var(--padding-base);
      padding-right: var(--padding-base);
      box-sizing: border-box;
  }

  .main-content1 {
      flex: 1;
      /* gap: 28px 100px; */
      align-items: center;
      justify-content: center;
  }

  .stores {
      padding-left: var(--padding-19xl);
      padding-right: var(--padding-19xl);
      box-sizing: border-box;
  }
  .arrow-bg{
      width: 59px;
  }
  .arrow-bg:hover{
      border-radius: 17px !important;
      padding: 38px 0 !important;
      height: 130px !important;
  }
}

@media screen and (max-width: 960px) {
  .qr-code-for-mobile-english-wik-icon {
      width: 100%;
  }
  .download{
      gap: 0px;
  }
  .main-content1{
      padding: 0px;
  }
  /* .arrow-bg{
      height: 60px;
      width: 60px;
  } */
  .download-the-katon {
      font-size: 24px;
      align-self: stretch;
      width: auto;
  }

  .solid-icon {
      display: flex;
  }

  .sec-download-apps {
      padding-left: 30px;
      padding-right:30px;
      box-sizing: border-box;
  }
}

@media screen and (max-width: 663px){
  .download,
  .stores {
      align-self: stretch;
      width: auto;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100%;
  }
}

@media screen and (max-width: 430px) {
  .download-the-katon{
      font-size: 17px;
      width: 118px;
  }
  .solid-icon{
      width: 75px;
  }
  .download-the-katon1{
      font-size: 8.22px;
  }
  .stores{
      padding-top: 50px !important;
      padding-bottom: 50px !important;
      border-radius: 19px;
  }
  .sec-download-apps{
      padding-top: 100px;
      padding-bottom: 100px;
  }
}

@media screen and (max-width: 420px) {
  .qr-code-for-mobile-english-wik-icon {
      flex: 1;
      padding: 0;
      box-sizing: border-box;
  }
  /* .arrow-bg{
      margin-right: 55px;
  } */
  /* .download-the-katon {
      font-size: 22px;
      align-self: stretch;
      width: auto;
  } */

  .download-text {
      flex: 1;
  }

  .container-home {
      flex-direction: row;
      gap: 28px 16px;
  }

  .container-home,
  .main-content1,
  .solid-icon {
      align-items: center;
      justify-content: center;
  }

  .solid-icon {
      display: flex;
      flex: 1;
  }

  .main-content1 {
      width: auto;
      align-self: stretch;
      flex-direction: row;
      gap: 28px 5px;
      padding-left: var(--padding-3xs);
      padding-right: var(--padding-3xs);
      box-sizing: border-box;
      flex: unset;
  }

  .stores {
      gap: 20px 16px;
      align-items: center;
      justify-content: flex-start;
  }

  .download,
  .stores {
      align-self: stretch;
      width: 100%;
      flex-direction: column;
  }

  .sec-download-apps {
      flex-direction: column;
      /* padding-left: var(--padding-base);
      padding-right: var(--padding-base); */
      box-sizing: border-box;
  }
}

@media screen and (max-width: 375px) {
  .qr-code-for-mobile-english-wik-icon {
      flex: 1;
  }

  /* .download-the-katon {
      font-size: var(--font-size-lg);
      align-self: stretch;
      width: auto;
  } */

  /* .download-the-katon1 {
      font-size: var(--font-size-3xs);
  } */

  .download-text {
      flex: 1;
      gap: 8px 7px;
  }

  .container-home {
      gap: 28px 16px;
      padding-left: var(--padding-xl);
      box-sizing: border-box;
  }

  .solid-icon {
      flex: 1;
      /* padding-top: var(--padding-15xl);
      padding-bottom: var(--padding-15xl); */
      box-sizing: border-box;
  }

  .main-content1 {
      align-self: stretch;
      width: auto;
      gap: 28px 20px;
      padding-left: var(--padding-3xs);
      /* padding-right: var(--padding-3xs); */
      box-sizing: border-box;
  }

  .stores {
      padding-left: 0;
      padding-right: 0;
      box-sizing: border-box;
  }
}

@media screen and (max-width: 350px) {
  .qr-code-for-mobile-english-wik-icon {
      flex: 1;
  }

  /* .download-the-katon {
      font-size: 20px;
  } */

  .container-home {
      width: auto;
      align-self: unset;
      flex-direction: row;
      gap: 28px 12px;
      padding-left: var(--padding-3xs);
      padding-right: var(--padding-3xs);
      box-sizing: border-box;
  }

  .main-content1 {
      align-self: stretch;
      width: auto;
      flex: 1;
      gap: 28px 10px;
      align-items: center;
      /* justify-content: flex-end; */
      /* padding: 30px var(--padding-base); */
      box-sizing: border-box;
  }

  .stores {
      padding-left: var(--padding-13xl);
      padding-right: var(--padding-13xl);
      box-sizing: border-box;
  }

  .download,
  .stores {
      align-self: stretch;
      width: auto;
  }
}

/* slick */
.slider-container {
   width: 364px;
   height: 483px;
   overflow: hidden;
   position: relative;
}

@media screen and (max-width: 390px) {
  .slider-container{
      width: 100% !important;
  }
  .slide{
      width: 100% !important;
  }
}
.slider {
   position: absolute;
   top: 0;
   left: 0;
   width: auto;
   display: flex;
   transition: transform 1s ease;
}

.slide {
   flex: 0 0 auto;
   width: 364px;
   height: 459px;
}

.dots {
   position: absolute;
   bottom: 0px;
   left: 50%;
   transform: translateX(-50%);
   display: flex;
   justify-content: center;
}

.dot {
   width: 5px;
   height: 5px;
   background-color: #aaa;
   border-radius: 50%;
   margin: 0 5px;
}

.dot.active {
   background-color: #008cd1;
}


/* stats */
#hide {
   display: inline-block;
   max-width: 0%;
   vertical-align: bottom;
   overflow: hidden;
   white-space: nowrap;
   transition: max-width 1s ease-in-out;
}

.stats1 {
   cursor: default;
   /* font-size: 5vw; */
}

/* On hover of the h1 tag, we are gonna max out the max-width. */
.stats1:hover #hide {
  max-width: 100%;
  background-color: var(--color-steelblue);
}




@media screen and (max-width: 320px) {
  .download,
  .sec-download-apps {
      display: grid;
  }
}


.grow {
   /* padding: 5px 5px 5px 5px; */
   border-radius: 16px;
   /* height: 49px; */
   width: 8%;
   /* margin: 5px 1% 5px 1%; */
   float: left;
   position: relative;
   transition: width 0.5s;
   -webkit-transition: height 0.5s;
   text-align: left;
   overflow: hidden;
   transition: 1.5s;
   white-space: nowrap;
}



.grow:hover {
  /*   height: 145px; */
  width: 80%;
}

html[lang="en-US"] .grow {
   width: 8%;
}

html[lang="en-US"] .grow:hover {
  width: 80%;
}
html[lang="fr-FR"] .grow {
   width: 12%;
}
html[lang="fr-FR"] .grow:hover {
  width: 80%;
}
html[lang="pt-PT"] .grow {
   width: 12%;
}
html[lang="pt-PT"] .grow:hover {
  width: 80%;
}

