.after-in-container{
  width: 100%;
}
.after-in-heading{
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  width: 50%;
  margin: 0 auto;
  margin-bottom: 50px;
  position: relative;
  font-size: 22px;
  font-weight: bold;
  color: black;
} 
.after-in-heading::after , 
  .after-in-heading::before   {
    content: "";
    flex: 1;
    height: 3px;
    background: linear-gradient(to right, #3FA8F4, #39B44A);
    margin: 0 15px;
}
.circle-img-after-in-home {
width: 100%;
max-width: 520px;
height: 350px;
}
.small-circle-after-in-home {
width: 100%;
max-width: 520px;
height: 350px;
}
.after-school h3 , .in-school h3{
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: black;
}
/* .after-school p , .in-school p{
  text-align: center;
  padding: 10px 60px;
  font-size: 15px;
  color: black;
} */
.learn-more-btn-after-in-home{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.learn-more-btn-after-in-home button{
   font-size: 15px;
   color: white ;
   font-weight: 500;
   background: linear-gradient(to right, #3FA8F4, #39B44A);
   padding: 8px 30px;
   border-radius: 20px;
}
.img-after-in-home{
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Initial hidden states for text and images */
.after-school h3, .after-school p, .after-school .circle-img-after-in-home,
.in-school h3, .in-school p, .in-school .small-circle-after-in-home {
  opacity: 1;
  transform: translateX(0);
  transition: all 0.8s ease-out;
}

/* Animation for sliding in from left */
.animate-from-left {
  opacity: 1;
  transform: translateX(0);
  animation: slide-in-left 1.2s ease-out forwards;
}

/* Animation for sliding in from right */
.animate-from-right {
  opacity: 1;
  transform: translateX(0);
  animation: slide-in-right 1.2s ease-out forwards;
}

/* Keyframes for sliding in from left */
@keyframes slide-in-left {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

/* Keyframes for sliding in from right */
@keyframes slide-in-right {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.main-heading {
  margin: 3rem 6rem;
  padding: 1rem 3rem;
  opacity: 1 !important;
  visibility: visible !important;
  background: #eeeeee;
  border-top-right-radius: 100px;
  border-bottom-right-radius: 100px;
}
.main-title-content {
  padding: 2rem 2rem;
  top: 3px;
  background: linear-gradient(to right, #3FA8F4, #39B44A);
  margin-left: -4rem;
  border-top-right-radius: 100px;
  border-bottom-right-radius: 100px;
  text-align: center;
  color: white;
  position: relative;
  font-size: 20px;
  filter: drop-shadow(8px 8px 8px rgba(0, 0, 0, .3));
}

.main-title-content::after {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  background: linear-gradient(to right, #3FA8F4, #39B44A);
  left: 0;
  bottom: -1rem;
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% 100%,
    0% 0%
  );
}
@media (max-width: 920px) {

.main-title-content{
  font-size: 18px;
}
}

@media (max-width: 600px) {
  .main-heading{
  margin:2rem 2rem;
}
.main-title-content{
  font-size: 16px;
}
}


@media (max-width: 500px) {
  .main-title-content{
  font-size: 14px;
}
}
@media (max-width: 400px) {
  .main-heading{
  margin:2rem 2rem;
}
.main-title-content{
  padding: 10px 30px;
}
}