/* IMAGE WITH RISING TEXT FOR SERVICES */
.mb-4 {
  margin: 5px 10px;
}

.overlay-img {
  display: block;
  color: white;
  background: transparent;
  position: relative;
  overflow: hidden;
  margin-bottom: 25px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
}

.overlay-img img {
  width: 100%;
  border-radius: 5px;
}

.overlay-img .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(70, 70, 70, 0.35);
  -webkit-transition: all, 1s;
  transition: all, 1s;
}

@media (prefers-reduced-motion: reduce) {
  .overlay-img .overlay {
    -webkit-transition: none;
    transition: none;
  }
}

.overlay-img .des {
  position: absolute;
  top: 60%;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all, 0.8s;
  transition: all, 0.8s;
}

@media (prefers-reduced-motion: reduce) {
  .overlay-img .des {
    -webkit-transition: none;
    transition: none;
  }
}

.overlay-img .des .title {
  font-weight: bold;
  font-size: 24px;
  color: rgb(255, 255, 255);
  padding: 0px 25px;
}

.overlay-img .des .subtitle {
  opacity: 1;
  color: rgb(255, 255, 255);
  padding: 0px 25px;
}

.overlay-img .des p {
  margin-top: 100px;
  color: rgb(255, 255, 255);
  opacity: 1;
  -webkit-transition: all, 1.2s;
  transition: all, 1.2s;
  visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .overlay-img .des p {
    -webkit-transition: none;
    transition: none;
  }
}

.overlay-img:hover .overlay, .overlay-img:focus .overlay {
  background: rgba(122, 86, 70, 0.7);
}

.overlay-img:hover .des, .overlay-img:focus .des {
  top: 10%;
}

.overlay-img:hover .des p, .overlay-img:focus .des p {
  margin-top: 0;
  opacity: 1;
  visibility: visible;
}