h2 {
    position: relative;
    display: inline-flex;
    font-size: 27px;
    margin-bottom: 25px !important;
    color: var(--mainColor);

}
h2::before {content: '';
    position: absolute;width: 100%;
    height: 4px;border-radius: 4px;background-color: var(--mainColor);
    bottom: 0;left: 0;transform-origin: left;
    transform: scaleX(0);transition: transform .6s ease-in-out;
}
.h2-act::before {
    transform-origin: right; transform: scaleX(1);
}

/*
h2:after {
  content: '';
  position: absolute;
  top: 105%;
  width: 120%;
  aspect-ratio: 3 / 1;
  left: 50%;
  transform: translate(-50%, 0) ;
  border-radius: 50%;
  border: 6px solid var(--lightMainColor);
  clip-path: polygon(0 0, 50% 50%, 100% 0);
}*/

.home {width: 100%;
    background-size: cover;
    position: relative;background-repeat: no-repeat;
}
.hmm {min-height: 90vh;padding: 50px 10px;padding-bottom: 0;width: 100%; align-items: center;justify-content: center;}

.home-content {
color: var(--textColor);text-align: right;
padding: 0 50px;
}
.home-content h1 {font-size: 28px;margin: 40px 0;line-height: 45px;}
.home-content p {font-size: 24px;line-height: 44px;}

.discover {background-color: transparent;font-size: 20px;border: 0 ;
margin-top: 20px;justify-content: flex-start;position: relative;transition: all 0.2s ease;
padding: 5px;border-radius: 25px;display: inline-flex;
align-items: center;background-color: var(--mainColor);
}

.discover:hover {background-color: var(--mainColorHover);}


.discover .icc {width: 40px;height: 40px;position: relative;
border-radius: 19px;margin-left: 8px;background-color: var(--mainColor); color: white;
}
.discover .icc2 {height: 40px ;padding-left: 20px;border-radius: 25px;
color: white;position: relative;width: 130px;background-color: var(--mainColor); color: white;
}
.discover .icc2 div {width: 100%;}
.icc i {font-size: 24px !important;}

.discover:hover .icc  {transform: rotate(360deg);background-color: white; color: var(--mainColor);}



.home-img {
    width: 70%;
    max-width: 1000px;
}
.home-img img {
    width: 100%;

}
@keyframes arrow {
    0% {transform: translateX(0px);}
    50% {transform: translateX(-25px);}
    100% {transform: translateX(0px);}
}

.b-p{ background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.2) 100%);
    width: 100%;
}
.partners {display: inline-flex;overflow-x: auto;padding: 20px 0;
    max-width: 100%;
}

.partner {margin: 0 8px;}
.partner img {max-height: 45px;filter: brightness(0) saturate(100%) invert(26%) sepia(90%) saturate(943%) hue-rotate(189deg) brightness(94%) contrast(91%);}
.partner h3 {color: var(--mainColor);}



.show-all {padding: 14px 20px ;background-color: rgba(86, 85, 114, 0.1);color: var(--textColor);
border-radius: 20px;display: inline-flex;align-items: center;justify-content: center;width: 245px;margin-top: 15px;
}
.show-all i {margin-right: 8px;animation:  arrow 1.5s infinite;}
.show-all:hover {cursor: pointer;background-color: rgba(86, 85, 114, 0.13);color: var(--mainColor);}



.section {min-height: 80vh;padding: 50px 0;color: var(--textColor);margin: 40px 0;}
.section h2 {font-size: 28px;margin: 15px 0;padding: 10px;max-width: 95%;}
.section p {font-size: 18px;padding: 10px;max-width: 850px;color: rgb(78, 78, 78);
    text-align: center;
}
.section strong {font-size: 26px;margin: 14px 0;margin-top: 30px;color: var(--mainColor);}

.our-stats {padding-top: 0px;}
.top-our-stats {padding: 100px 0;}



/* testimonials */
.slider {position: relative;width: 100%;}
.slider .buttons {
	 z-index: 1;
	 left: 22%;
	 bottom: 20% ;
	 width: 80px;
	 height: 40px;
	 position: absolute;
	 border-radius: 50px;
	 background-color: #fff !important;
}
.slider .buttons .previous, .slider .buttons .next {
	 width: 50%;
	 height: 100%;
	 position: absolute;
	 background-repeat: no-repeat;
	 background-position: center;
	 cursor: pointer;
}
 .slider .buttons .previous {
	 left: 0;
	 background-image: url('https://alcs-slider.netlify.app/images/icon-prev.svg');
}
 .slider .buttons .previous:hover {
	 transform: scale(1.25);
}
 .slider .buttons .next {
	 right: 0;
	 background-image: url('https://alcs-slider.netlify.app/images/icon-next.svg');
}
 .slider .buttons .next:hover {
	 transform: scale(1.25);
}
 .slider .slide {
	 display: flex;
	 margin: 0 auto;
	 text-align: center;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column-reverse;
}
 .slider .slide .testimonial {
	 padding: 32px 51px;
     width: 100%;
	 background-size: 60px;
	 background-position:right;
     text-align: center;
	 background-repeat: no-repeat;
	 background-image: url("/img/pattern-quotes.svg");
}
 .slider .slide .testimonial blockquote {
	 font-size: 18px;
	 font-weight: 300;
	 line-height: 24px;
	 margin-bottom: 36px;
     padding-right: 120px;
}
 .slider .slide .testimonial .author {
	 font-size: 15px;
	 font-weight: 700;
}
 .slider .slide .testimonial .author span {
	 display: block;
	 color: #babacf;
	 font-weight: 500;
}
 .slider .slide .slider-img {
	 width: 100%;
	 padding: 30px;
	 display: flex;
	 margin-bottom: 40px;
	 align-items: center;
	 justify-content: center;
	 background-size: contain;
	 background-position: center;
	 background-repeat: no-repeat;
	 background-image: url(/img/pattern-bg.svg);
}
 .slider .slide .slider-img img {
	 width: 100%;
	 display: block;
	 border-radius: 10px;
	 box-shadow: 0px 16px 40px 0px rgba(135, 105, 210, 0.4);
}
 .slider .slide .active {
	 opacity: 1;
	 transform: translateX(0) scale(1);
	 transition-delay: 0.4s;
}


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

	 .slider .slide {
		 position: relative;
		 text-align: left;
		 display: flex;
		 flex-direction: row;
	}
	 .slider .slide .testimonial {
		 padding: 32px 0 0 0;
		 background-size: 80px;
		 background-position: 19% -7%;
		 transform: translateX(100px);
	}
	 .slider .slide .testimonial blockquote {
		 font-size: 24px;
		 line-height: 30px;

	}
	 .slider .slide .testimonial .author span {
		 display: contents;
	}
	 .slider .slide .slider-img {
		 padding: 55px;
	}
	 .slider .slide .slider-img img {
		 width: 400px;
	}
}




.stat-card {width: 95%;max-width: 380px;padding: 10px 12px;background-color: white;
     margin: 20px ;color: var(--textColor);
    display: inline-table !important;background-color: white; cursor: pointer ;
    position: relative;
    align-items: center !important;
    transition-duration: .7s !important;
}

.fe-card {width: 95%;max-width: 380px;padding: 10px 12px;background-color: white;
    margin: 20px ;color: var(--textColor);
   display: inline-table !important;background-color: white; cursor: pointer ;
   position: relative;
   align-items: center !important;
   transition-duration: .7s !important;
   box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
   border-radius: 20px;
}
.fe-main {max-width: 450px;padding: 25px 10px;
display: inline-flex !important;align-items: center;justify-content: center;
}

.cr {padding-right: 8px;}



.stat-card img  {width: 50px;height: 50px;object-fit: cover;}
.stats-cards {margin-top: -80px;}

.fe-card img {width: 100px;height: 100px;object-fit: cover;}

.stat-card:hover , .fe-card:hover { border-color:var(--mainColor);transform:translateY(-10px) !important;}

.stat-card h3 {font-size: 40px;text-align: center; font-weight: bold;
    margin: 5px 0;
}
.stat-card p {font-size: 25px;margin: 0px 0;padding: 5px 0;text-align: center;color: rgb(102, 101, 101);}
.fe-main h3 , .fe-main p {text-align: right !important;}

.fe-card h3 {font-size: 28px;text-align: center; font-weight: bold;
    margin: 5px 0;
}
.fe-card p {font-size: 17px;margin: 0px 0;padding: 5px 0;text-align: center;color: rgb(102, 101, 101);
text-align: justify;
}



.login-div .sdr {
    display: inline-flex;padding: 15px 30px;
    border-radius: var(--rad);
    background-color: rgb(247, 247, 247);
    margin: 10px;
    border-radius: 20px ;
    align-items: center; justify-content: center;
    border: 1px solid transparent;
}
.login-div img {width:50px;height: 50px;object-fit: cover;margin-left: 8px;}
.sdr h4 {font-size: 22px ;color: var(--textColor);margin-bottom: -8px;}

.sdr:hover {border: 1px solid var(--mainColor);}



/*Faq*/


.faq-container {  margin: 20px auto;border-radius: var(--rad);  background-color: #fff;
    overflow: hidden;box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    width: 95%;
}

.faq {box-sizing: border-box;
    background: transparent;padding: 30px 8px;position: relative;overflow: hidden;
    color: var(--textColor);
}

  .faq:not(:first-child) {border-top: 1px solid #e6e6e6;}
  .faq-title {margin: 0 15px 0 0;font-size: 20px;text-align: right;font-weight: bold;}
  .faq-text {margin: 15px 0 0;display: none;line-height: 35px;text-align: right;font-size: 19px;max-width: 100% !important;
    text-align: right !important;
   }
  .faq.active {box-shadow: inset 4px 0px 0px 0px var(--mainColor)}
  .faq.active .faq-title {color: var(--mainColor);}

  .faq.active .faq-text {display: block;}

  .faq-toggle {background-color: var(--lightMainColor);
    color: inherit; border-radius: 50%;color: var(--mainColor);
    cursor: pointer; display: flex;align-items: center;
    justify-content: center;font-size: 16px; padding-top: 3px;
    position: absolute; top: 8px;left: 8px;
    height: 30px;width: 30px;transition: 0.3s ease;border: 0;
    border: 1px solid var(--lightMainColor);
  }


  .faq-toggle:focus { outline: none;}

  .faq.active .faq-toggle { transform: rotate(180deg);border-color: var(--mainColor);}



/*end Faq*/





.contact {max-width: 900px;}
.contact  h5 {width: 65%; max-width: 400px;
  text-align: center; border-bottom: 2px solid var(--mainColor);
  line-height: 0.1em;margin: 20px 0; font-size: 20px;color: var(--textColor);
}


.contact form {padding: 20px 0;}
.contact .form_wrap.in {width: 47% !important;display: inline-table;margin: 10px;}

.b_form_wrap {width: 96% !important;margin: 20px 0;}
.contact textarea {width: 100%;
min-height: 300px;resize: vertical;
}
.contact input:focus , .contact textarea:focus {border-color: var(--mainColor);}



.contact button {padding: 15px 10px;text-align: center;background-color: var(--mainColor);
color: white;cursor: pointer;border-radius: 10px;margin: 10px 0;border: 0;width: 96%;
}
.contact button:hover {background-color: var(--mainColorHover);}


@media (max-width: 900px) {
    .hmm {overflow: hidden; display: flex !important;
        flex-direction: column-reverse !important;}
    .home-img {display: block !important;margin: 20px  0 ;width: 95%;}
    .slider .slide .testimonial blockquote {
        padding-right: 0 !important;
   }
   .slider .slide .testimonial {
    padding: 20px 5px !important;
   }
   .slider .buttons {
    left: 50%;
    transform: translateX(-50%);
    bottom: auto;top: 50%;
   }

}
@media (max-width: 768px) {
  .testimonial-container {padding: 20px 30px;}
.fa-quote-left {left: 20px; font-size: 23px; bottom: 120px;}
.fa-quote-right {right: 20px ;font-size: 23px;}
  .contact button  {width: 95% !important;margin: 15px 0;
  max-width: auto !important;}

}


@media only screen and (max-width: 600px ) {
.contact .form_wrap , .contact .form_wrap.in , .b_form_wrap{width: 95% !important;margin: 10px 0 !important;}
.hmm {min-height: auto;align-items: flex-start;}
.sdr {width: 90% !important;margin: 20px 0 !important;}
.testimonial-container {padding: 20px 5px;}
.fa-quote-left {left: 1px;}
.fa-quote-right {right: 1px ; }
.stat-card , .fe-card{margin: 20px 0;max-width:350px;}
.fe-card p , .fe-card h3{text-align: center !important;}
.fe-main {max-width: 350px;display: block !important;margin: 20px 0;}
.cr {width: 100% !important;}

.home-content {width: 100%;padding: 0 10px;text-align: right;}
.home-content h1 {font-size: 28px;margin: 20px 0;line-height: 36px;}
.home-content p {font-size: 22px;padding: 10px 0;line-height: normal;}
.discover {justify-content: center !important;align-items: center;}
.faq-title {font-size: 18px;padding-left: 10px !important;line-height: 27px;}
.faq-text {font-size: 16px !important;}
.faq-container {width: 98%;margin: 20px 0;}
}





