.button.mywidthh {
  width: 270px !important;
}
@media (max-width: 575px) {
  .button.mywidthh {
    width: 100% !important;
  }
  
}
@media (max-width: 1199px) {
  .button.mywidthh {
    width: 100% !important;
  }
  
}

.venue-image {
  height: 100%;
}

.venue-image img {
  width: 100%;
  height: 90vh;      /* 75% of screen height on desktop */
  object-fit: cover;
}

@media (max-width: 768px) {
  .venue-image img {
    height: 35vh;   /* shorter for mobile */
  }
}
.venue-image1 {
  height: 100%;
}

.venue-image1 img {
  width: 100%;
  height: 80vh;      /* 75% of screen height on desktop */
  object-fit: cover;
}

@media (max-width: 768px) {
  .venue-image1 img {
    height: 35vh;   
   }
} 


.venue-image3 {
  height: 100%;
}

.venue-image3 img {
  width: 100%;
  height: 100%;      /* 75% of screen height on desktop */
  object-fit: cover;
}

/* @media (max-width: 768px) {
  .venue-image3 img {
    height: 35vh;   
  }
} */

/* ================= TABLET (iPad) ================= */
@media (min-width: 769px) and (max-width: 1024px) {

  .venue-image img {
    height: 60vh;   /* was 90vh desktop */
  }

  .venue-image1 img {
    height: 55vh;   /* between desktop and mobile */
  }

  .venue-image3 img {
    height: 50vh;   /* since desktop was flexible */
  }

}