main {
  gap: 150px !important;
  padding-bottom: 150px !important;
}
main .video-text-container {
  position: relative;
  width: calc(100% + 60px);
}
main .video-text-container video{
  box-shadow: 0 0 10px var(--color-green);
}
main .video-text-container .text {
  position: absolute;
  text-align: center;
  height: 30%;
  width: 90%;
  top: 45%;
  left: 30%;
  margin: -15% 0 0 -25%;
}
main .video-text-container .text h1 {
  font-size: 5vw;
  color: var(--color-white);
}
main .video-text-container .text h2 {
  color: var(--color-white);
}
main .video-text-container .text h1,
main .video-text-container .text h2 {
  text-shadow: 0 0 10px var(--color-green-dark);
}
main .about-us-container .text h2 {
  font-size: 4vw !important;
}

#slider {
  position: relative;
  overflow: hidden;
  width: 100%;
  border-radius: 4px;
  max-width: 1200px;
}
#slider .recommendations {
  display: flex;
  position: relative;
}
#slider .card-container {
  display: inline-block;
  position: relative;
  width: 341px;
  height: 400px;
  margin: 10px;
}
#slider .card-container .card-image-container {
  width: 341px;
  height: 250px;
}
.card-container .card-content p{
  -webkit-line-clamp: 5 !important;
}
a.control_prev,
a.control_next {
  position: absolute;
  top: 40%;
  z-index: 1;
  margin: auto;
  cursor: pointer;
  user-select: none;
  border: solid 1px var(--color-green);
  border-radius: 5px;
  background-color: var(--color-white);
}
a.control_prev img,
a.control_next img {
  height: 50px;
  display: block;
}
a.control_prev img.hover,
a.control_next img.hover {
  display: none;
}
a.control_prev:hover img,
a.control_next:hover img{
  display: none;
  transition: 0.3s;
}
a.control_prev:hover img.hover,
a.control_next:hover img.hover {
  display: block;
}
a.control_prev img {
  transform: rotate(180deg);
}
a.control_next {
  right: 0;
}

@media (max-width: 600px) {
  main {
    gap: 50px !important;
    padding-bottom: 50px !important;
  }
  main .video-text-container .text {
    top: 30%;
  }
  main .video-text-container .text h2 {
    font-size: 4vw;
  }
}
@media (min-width: 1300px) {
  main .about-us-container .text h2 {
    font-size: 80px !important;
  }
}
@media (max-width: 1300px) {
  #slider {
    max-width: 800px;
  }
}
@media (max-width: 900px) {
  #slider {
    max-width: 400px;
  }
}
@media (max-width: 500px) {
  #slider {
    max-width: 310px;
  }
  #slider .card-container {
    width: 250px;
  }
  #slider .card-container .card-image-container {
    width: 250px;
  }
}
/* http://agromenorca.rwdesarrollos.es/es/ */