ul.rest {
    position: relative;
}

ul.rest li {
    position: relative;
    margin-bottom: 20px;
    padding-right: 150px; /* Espacio para la imagen */
}

ul.rest li .hover-image {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    width: 200px;
}

ul.rest li:hover .hover-image {
    opacity: 1;
    visibility: visible;
}

ul.rest li .hover-image img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    transition: transform 0.5s ease; /* Suavidad */
}

ul.rest li:hover .hover-image img {
    transform: scale(1.1); /* Pequeño zoom en hover */
}

.height-600px {
  height: 600px;
}

.social-logo {
  width: 700px; /* Ajuste de tamaño pequeño */
  height: auto;
  transition: transform 0.3s ease;
}

.social-logo:hover {
  transform: scale(1.1); /* Efecto de zoom en hover */
}


/*----------------------------------------*/
/*  7.12 instagram css start
/*----------------------------------------*/
.footer-top {
    margin-top: 400px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-top {
      margin-top: 170px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-top {
      margin-top: 0px;
    }
  }
  @media (max-width: 767px) {
    .footer-top {
      margin-top: 100px;
    }
  }