/* =========================================
   SANGIOLELE RESULT PAGE
========================================= */
.sg-search-room-card {
  display: grid !important;
  grid-template-columns: 360px 1fr 190px !important;
  gap: 36px !important;
  align-items: start !important;
}

.sg-search-room-main .mphb-reserve-room-section {
  margin-top: 28px !important;
}

.sg-search-room-main .mphb-book-button {
  width: 220px !important;
}

.sg-search-room-price {
  text-align: right;
}

.sg-search-room-card .mphb-view-details-button-wrapper {
  display: none !important;
}

.sg-booking-results-page {
  background: #f7f4ef;
  font-family: 'Futura', sans-serif;
}


.sg-booking-results-hero {
  padding: 170px 24px 80px;
  text-align: center;
  background: #111;
  color: #fff;
}

.sg-booking-results-content {
  max-width: 1120px;
  margin: 0 auto;
  padding: 80px 24px;
}

.mphb-room-type{
    display:grid !important;
    grid-template-columns:360px 1fr 180px !important;
    gap:40px;
    align-items:start;

    max-width:1120px;
    margin:42px auto;
    padding:36px;

    background:#fff;
    border:1px solid rgba(142,119,76,.18);
    box-shadow:0 18px 45px rgba(0,0,0,.06);
}

.mphb-loop-room-thumbnail {
  grid-area: image;
  margin: 0 !important;
}

.mphb-loop-room-thumbnail img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    display: block;
}


.mphb-room-type-title,
.mphb-room-type-title a {
  grid-area: title;
  margin-bottom: 10px !important;
  font-size: 30px !important;
  font-weight: 400 !important;
  color: #2d2d2d !important;
  text-decoration: none !important;
}

.mphb-room-type > p:not(.post-thumbnail):not(.mphb-regular-price):not(.mphb-view-details-button-wrapper) {
  grid-area: desc;
  margin: 0 !important;
}

.mphb-room-type-details-title {
  grid-area: details;
  margin: 10px 0 0 !important;
  font-size: 24px !important;
  font-weight: 400;
}

.mphb-loop-room-type-attributes {
  grid-area: details;
  margin: 10px 0 0 !important;
  padding-left: 18px !important;
}

.mphb-room-type p,
.mphb-room-type li {
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.mphb-regular-price {
  grid-area: price;
  text-align: right;
  margin: 0 !important;
  color: #8e774c !important;
}

.mphb-price {
  display: block;
  font-size: 28px !important;
  color: #8e774c !important;
  margin-top: 8px;
}

.mphb-view-details-button-wrapper {
  grid-area: buttons;
  margin: 10px 0 0 !important;
}

.mphb-reserve-room-section {
  grid-area: buttons;
  justify-self: start;
  margin: 10px 0 0 !important;
}

.mphb-view-details-button,
.mphb-book-button,
.mphb-reserve-btn {
  background:#9b8150;
    color:#fff;
    border:none;
    border-radius: 3px;
    padding:12px 24px;
    text-transform:uppercase;
    letter-spacing:.06em;
    transition:.25s;
    line-height: 1;
    font-size: 15px;
}

.mphb-book-button:hover {
  background:#9b8150;
  color:#fff;
}

@media (max-width: 900px) {
  .mphb-room-type {
    display: block !important;
  }

  .mphb-loop-room-thumbnail img {
    width: 100% !important;
    height: auto !important;
  }

  .mphb-regular-price {
    text-align: left;
    margin: 20px 0 !important;
  }

  .mphb-reserve-room-section {
    width: 100%;
  }
}

.mphb-room-type .mphb-room-type-images {
  display: block !important;
  grid-area: image !important;
  width: 360px !important;
  height: 250px !important;
  overflow: hidden !important;
}

.mphb-room-type .mphb-room-type-images .flex-viewport {
  height: 250px !important;
  overflow: hidden !important;
}

.mphb-room-type .mphb-room-type-images .slides {
  width: 100% !important;
  transform: none !important;
}

.mphb-room-type .mphb-room-type-images .slides li {
  width: 360px !important;
  height: 250px !important;
  display: none !important;
  float: none !important;
}

.mphb-room-type .mphb-room-type-images .slides li.flex-active-slide,
.mphb-room-type .mphb-room-type-images .slides li:first-child {
  display: block !important;
}

.mphb-room-type .mphb-room-type-images img {
  width: 360px !important;
  height: 250px !important;
  object-fit: cover !important;
  display: block !important;
}
