.box {
  position: relative;
}

.mainTitle {
  font-size: 1.5rem !important;
}

.courseCard {
  margin: 0 auto 80px;
  box-shadow: 0px 0px 25px 15px rgba(192, 192, 192, 0.35);
  border-radius: 8px;
}

.courseCard .imgBox {
  height: 230px;
  width: 100%;
  object-position: center;
  object-fit: fill;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.cardContent {
  /* height: 60%; */
  padding: 20px 15px;
  display: flex;
  flex-direction: column;
}

.cardContent p {
  margin: 20px 0;
  font-size: 1.25rem;
  line-height: 1.8rem;
}

/* bg */
.googleEarthImg {
  background-image: url("../images/Training/google_earth_cover.jpg");
}
.gdalImg {
  background-image: url("../images/Training/Gdal_course_cover.jpg");
}
.gis {
  background-image: url("../images/Training/gis.jpg");
}
.Portal1 {
  background-image: url("../images/Training/portal!.jpg");
}

.qGisImg {
  background-image: url("../images/Training/qgis_course_cover.jpg");
}
.bi {
  background-image: url("../images/Training/bi.jpg");
}
.mapCarto {
  background-image: url("../images/Training/map.jpg");
}
.esri {
  background-image: url("../images/Training/geovision-webinars-updated.jpg");
}
.mapData {
  background-image: url("../images/Training/opendatasites.jpg");
}
.analysis {
  background-image: url("../images/Training/Analysis.jpg");
}
.observatories {
  background-image: url("../images/Training/urban-observatory.jpeg");
}
.qgs2 {
  background-image: url("../images/Training/Quantum-GIS.jpg");
}
.qgs1 {
  background-image: url("../images/Training/QGIS-Free-Download.webp");
}

.GeoNode2 {
  background-image: url("../images/Training/geonode4-RC.png");
}
.GeoNode1 {
  background-image: url("../images/Training/data_menu.png");
}

@media screen and (min-width: 992px) {
  .courseCard {
    flex-direction: row;
    align-items: stretch;
    display: flex;
  }

  .cardContent p {
    margin: 0;  
    font-size: small;
    text-align: start;
  }
  .courseCard .imgBox {
    object-fit: fill;
    width: 40%;
    height: 350px;
  }

  .cardContent {
    height: inherit;
    width: 60%;
    padding: 10px 20px;
    display: flex;
    margin: 0%;
    justify-content: space-around;
    flex-direction: column;
  }

  .manIntroImg {
    width: 100% !important;
  }

  .manIntroImg {
    width: 80% !important;
  }
  .mainTitle {
    font-size: 2rem !important;
  }
}