.tui-hotel-content {
  border-radius: $border-radius-double;
  box-shadow: 0 1px 0 0 rgba($color-black, .1);
  padding: $margin-enterprise;

  @include breakpoint(sm) {
    padding: $margin-triple;
  }

  &.map-content {
    padding: $margin-normal;
  }
}

.tui-hotel-section {
  background: inherit;

  .tui-hotel-heading {
    @extend %flexbox-row;
    height: 72px;
    align-items: center;

    h2 {
      margin: 0;
    }

    .open-tui-modal {
      margin-left: auto;
      font-weight: bold;
    }

    .sub-heading {
      margin-left: $margin-double;
    }
  }

  &.light-blue {
    .tui-hotel-content {
      background: $color-blue-100;
    }
  }

  &.light-beige {
    .tui-hotel-content {
      box-shadow: none;
      padding: $margin-double 0;
    }
  }

  &.dark-beige {
    .tui-hotel-content {
      background: $color-beige-200;
    }
  }
}

.image-hotel-description {
  @include breakpoint(md) {
    display: flex;
    padding-top: $margin-triple;

    > div {
      width: 50%;
    }

    .hotel-swipe {
      padding-right: $margin-double;
    }

    .tui-text-content {
      padding-left: $margin-double;
    }
  }
}

.hotel-swipe {
  margin-bottom: $margin-enterprise;
  background: inherit;
}

.to-hotels-btn-container {
  text-align: center;
  margin-top: $margin-normal;
}

.blockquote-container {
  @extend %flexbox-column;
  border-top: 1px solid $color-blue-300;
  border-bottom: 1px solid $color-blue-300;
  padding: $margin-quadruple 0 $margin-normal;

  .read-more-link {
    align-self: flex-start;
    font-weight: bold;
    margin-top: $margin-normal;

    @include breakpoint(sm) {
      align-self: flex-end;
      margin-top: 0;
    }
  }
}

.hotellistpage {
  .tui-text-content {
    width: 100%;

    @include breakpoint(lg) {
      width: 70%;
    }
  }
}