#fourth {
  background: linear-gradient(to bottom, #c4a483, #fdfdfd);
  padding-top: 40px;
  padding-bottom: 40px;
  overflow-x: hidden;
}

#fourth .row-custom {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  background-color: #fdfdfd;
}

#fourth img {
  width: 100%;
  height: 100%;
  height: 340px;
  object-fit: cover;
  display: block;
}

#fourth .texts {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #fdfdfd;
  z-index: 2;
  transition:
    transform 0.8s cubic-bezier(0.25, 1, 0.5, 1),
    opacity 0.6s ease;
}

@media (max-width: 991px) {
  #fourth .texts {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
  }

  #fourth .from-right .texts {
    transform: translateX(100%);
  }

  #fourth .from-left .texts {
    transform: translateX(-100%);
  }

  #fourth .row-custom.active .texts {
    transform: translateX(0);
    opacity: 0.75;
  }
}

@media (min-width: 992px) {
  #fourth h1 {
    font-size: 60px;
  }
  #fourth h2 {
    font-size: 36px;
  }
}

@media (min-width: 992px) {
  #fourth .row-custom {
    max-height: 530px;
    display: flex;
    align-items: stretch;
  }
}