#he-section {
  background-image: url("../assets/images/educationalDevelopment/hero-img.png");
  height: 60vh;
  width: 100%;
  margin-top: 60px;
  background-size: contain;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: row;
  align-items: center;
}
#he-text h1 {
  color: #fff;
  font-weight: 700;
  font-size: 50px;
}
#ecd-section {
  margin-top: 30px;
}
#ecd-col-1 h1,
#ecd-col-4 h1 {
  font-weight: 700;
  font-size: 32px;
  margin-bottom: 20px;
}
#ecd-col-1 h5 {
  font-weight: 500;
  font-size: 22px;
}
#ecd-col-2 p {
  font-weight: 400;
  font-size: 16px;
}
#ecd-col-3 p {
  font-weight: 400;
  font-size: 16px;
}
.green-color {
  color: #0e793d;
}
#ecd-col-5 h1 {
  font-weight: 700;
  font-size: 32px;
}
#ecd-col-5 p {
  font-weight: 400;
  font-size: 16px;
}
#ecd-row-6 {
  margin-top: 30px;
}
#ecd-col-7 h1 {
  font-weight: 700;
  font-size: 32px;
}
#ecd-col-7 p {
  font-weight: 400;
  font-size: 16px;
}

/* MEDIA QUERIES */
@media (min-width: 2560px) {
  #he-section {
    /* height: 53vh;
    margin-top: 153px; */
  }
}
@media (min-width: 769px) and (max-width: 1024px) {
  #he-text h1 {
    font-size: 38px;
  }
  #ecd-section {
    margin-top: -10px;
  }
}
@media (min-width: 426px) and (max-width: 768px) {
  #he-text h1 {
    font-size: 35px;
    margin-top: -80px;
  }
  #ecd-section {
    margin-top: -90px;
  }
  #ecd-col-1 h5 {
    font-size: 18px;
  }
}
@media (min-width: 376px) and (max-width: 425px) {
  #he-text h1 {
    font-size: 22px;
    margin-top: -120px;
  }
  #ecd-section {
    margin-top: -190px;
  }
  #ecd-col-1 h1,
  #ecd-col-4 h1,
  #ecd-col-8 h1,
  #ecd-col-5 h1,
  #ecd-col-9 h1,
  #ecd-col-7 h1 {
    font-size: 23px;
  }
  #ecd-col-1 h5 {
    font-size: 16px;
  }
  #ecd-col-6 img {
    margin-bottom: 20px;
  }
}
@media (min-width: 321px) and (max-width: 375px) {
  #he-text h1 {
    font-size: 20px;
    margin-top: -130px;
  }
  #ecd-section {
    margin-top: -210px;
  }
  #ecd-col-1 h1,
  #ecd-col-4 h1,
  #ecd-col-8 h1,
  #ecd-col-5 h1,
  #ecd-col-9 h1,
  #ecd-col-7 h1 {
    font-size: 20px;
  }
  #ecd-col-1 h5 {
    font-size: 16px;
  }
  #ecd-col-6 img {
    margin-bottom: 20px;
  }
}
@media (min-width: 0px) and (max-width: 320px) {
  #he-text h1 {
    font-size: 18px;
    margin-top: -130px;
  }
  #ecd-section {
    margin-top: -225px;
  }
  #ecd-col-1 h1,
  #ecd-col-4 h1,
  #ecd-col-8 h1,
  #ecd-col-5 h1,
  #ecd-col-9 h1,
  #ecd-col-7 h1 {
    font-size: 18px;
  }
  #ecd-col-1 h5 {
    font-size: 16px;
  }
  #ecd-col-6 img {
    margin-bottom: 20px;
  }
}