@keyframes fadeInUp{
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.no-touchevents{
  .hotel_card {
    transition: all $transition-time;
    &:hover {
      box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.12);
    }
  }
  .noTabs .hotel_card {
    &:hover {
      @media (min-width: $grid-float-breakpoint) {
        padding: 9px 9px 0 9px;
      }
    }
  }
  .searched_hotel {
    .hotel_card{
      &:hover{
        border: 0;
      }
      tr{
        &.rate-odd:hover {
          background: #f8f8f8;
        }
      }
    }
  }
}
/*ESTILOS HOTEL SELECCIONADO y buscado */
.selected_hotel, .searched_hotel {
  background: $interactive-color;
  border-radius: $border-radius-large;
  margin-top: 0;
  margin-bottom: 10px;
  font-size: $font-size-base;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
  .icon-anyfill-graph-check, .icon-anyfill-graph-clock {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin: 0 5px 0 15px;
    &, & * {
      fill: #FFF;
    }
  }
  .message_hotel_searched{
    color:#FFF;
    line-height:30px;
    font-weight: $roboto-regular
  }
  .hotel_card {
    padding: 10px;
    border-top-right-radius: 0;
    border-top-left-radius:0;
    background-color: #ffffff;
    box-shadow: none;
    margin-bottom: 0;
    clear: both;
    border:0;
    margin-top: 0;
    .cont_discount{
      border-top-right-radius: 0;
    }
  }
}
.selected_hotel {
  border: 1px solid $interactive-color;
}
.searched_hotel {
  border: 2px solid $interactive-color;
}
/*FIN ESTILOS HOTEL SELECCIONADO y buscado */

/* ficha hotel descuento logado */
.logged_discount_hotel {
  position: relative;
  .discount_message_container {
    display: block;
    font-size: $font-size-base;
    position: absolute;
    top: 5px;
    left: 5px;
    right: auto;
    border-radius: 50%;
    background: $blue-grey-dark;
    padding: 4px;
    z-index: 9;
    white-space: nowrap;
    @media (min-width: $grid-float-breakpoint) {
      top: 0;
      left: 50%;
      transform: translate(-50%, 0);
      border-radius: 15px;
      padding: 0 10px;
    }
    .icon {
      width:16px;
      height:16px;
      vertical-align:middle;
      margin:0;
      &, & * {
        fill: $brand-yellow;
      }
    }
  }
  .message_hotel_discount_price {
    color: $brand-yellow;
    line-height: 25px;
    border-bottom: 1px dashed $brand-yellow;
    @media (max-width: $grid-float-breakpoint-max) {
      display: none;
    }
  }
  .dst_exclusivebanner_completo .message_hotel_discount_price {
    border-bottom: 0;
  }

  .exclusiveinfotooltip {
    display: none;
    width: 270px;
    top: 40px;
    left: auto;
    right: 50%;
    z-index: 300;
    .tooltip-arrow {
      left: auto;
      right: 7% !important;
    }
    .tooltip-inner {
      padding: 15px;
      position: relative;
      .exclusiveinfoclose {
        background: transparent;
        border: 0;
        position: absolute;
        top: 14px;
        right: 14px;
        svg {
          width: 10px;
          height: 10px;
          vertical-align: middle;
          &, & * {
            fill: $brand-brown;
          }
        }
      }
      p {
        margin-bottom: 0;
        margin-left: 0;
        text-align: left;
        color: $brand-grey-dark;
      }
    }
  }
  .label_sold_out_block {
    color: $brand-red;
    .label_sold_out {
      margin-bottom: 0;
      color: $brand-red !important;
    }
  }
}
/* Fin ficha hotel descuento logado */


/* ficha de hotel */
.hotel_card {
  padding: 10px;
  border: 1px solid $colorBordes;
  border-radius: $border-radius-large;
  background-color: #ffffff;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
  margin-bottom: 10px;
  clear: both;
  .fadeInUp{
    animation-name: fadeInUp;
    animation-duration: 1s;
    animation-fill-mode: both;
  }
  .txt_regimen{
    font-size: $font-size-base;
    color:$brand-green;
  }
  .cont_img_hotel{
    padding:0 15px!important;
  }
  .container_img_hotel, .img_hotel.generic-pic, .bg_mystery {
    overflow: hidden;
    padding-right:0;
    position: relative;
    min-height: 135px;
  }

  .bg_holiday, .bg_apartment {
    background: $brand-primary;
    top:10px;
    position:absolute;
    color:#FFF;
    border-radius: 15px;
    font-size:$font-size-base;
    padding:2px 10px 2px 30px;
    left:10px;
    z-index:1;
    max-width: 93%;
    .icon {
      vertical-align:middle;
      width:16px;
      height: 16px;
      position: absolute;
      top: 50%;
      left: 10px;
      transform: translateY(-50%);
      &, & * {
        fill: #FFF;
      }
    }
    span {
      @include medium-weight;
      display: block;
    }
  }
  @media (max-width: $grid-float-breakpoint-max) {
    .bg_holiday, .bg_apartment {
      top: auto;
      bottom: 0;
      padding: 4px 10px;
      border-radius: 0;
      font-size: $font-size-small;
      left: 0;
      z-index: 1;
      width: 100%;
      max-width: 100%;
      text-align: center;
      border-bottom-left-radius: $border-radius-large;
      .icon {
        display: none;
      }
    }
  }

  .container_img_hotel {
    .bg_popular {
      background: $interactive-color;
      top:10px;
      position:absolute;
      left:10px;
      z-index:1;
    }
    @media (max-width: $grid-float-breakpoint-max) {
      .bg_popular {
        top: auto;
        bottom: 0;
        padding: 4px 10px;
        border-radius: 0;
        font-size: $font-size-small;
        left: 0;
        z-index: 1;
        width: 100%;
        max-width: 100%;
        text-align: center;
        border-bottom-left-radius: $border-radius-large;
        .icon {
          display: none
        }
      }
    }
  }
  .button_availability {
    margin:3px 0;
  }
  .panel-body {
    padding: 0;
  }
  .panel-group {
    margin:0;
  }
  .hotelAdress_map {
    margin-top: 10px;
    font-size: 14px;
    svg {
      width: 14px;
      height: 14px;
      vertical-align: sub;
      &, & * {
        fill: $brand-grey-dark;
      }
    }
  }
  #map_container {
    margin-top: 10px;
  }
  .view-more-text.view-more-text-container {
    overflow: hidden;
    height: 112px;
    margin-bottom: 10px;
  }
  .panel-body {
    padding: 0;
  }
  .tab-content {
    .gallery_availability {
      height: 258px;
      .loader-inner {
        margin-top: 30px;
      }
    }
    .map_availability {
      height: 338px;
      position: relative;
      .loader-inner {
        margin-top: 30px;
      }
    }
  }

  /* tarifas tabla */
  .tipo_regimen {
    li {
      &.regimenAlojamientoContainer {
        border-top: solid 1px #e3e3e3;
        &:first-child{
          border-top:0;
        }
        .regimenAlojamiento {
          padding: 6px;
        }
        .hotels-information-box {
          padding: 7px;
        }
        table.info_habitacionContainer {
          width: 76%;
          border-left: solid 1px #e3e3e3;
          border-bottom: 0;
          tr {
            /*border: 0;
             display: table;
             width:100%;*/
            &:hover {
              background: none;
            }
            &.rate-odd {
              background: #f8f8f8;
            }
            .extra_services {
              @include medium-weight;
            }

            &.two_files {
              /* border-top: 1px solid #e3e3e3;
               &:first-child {
                 border-top: 0 !important;
               }*/
              td {
                width: 100%;
                > div {
                  display: inline-block;
                  &.payment {
                    width: 49%;
                    svg {
                      cursor:pointer;
                      vertical-align:middle;
                      width:16px;
                      height: 16px;
                      &, & * {
                        fill: #c7c7c7;
                      }
                    }
                  }
                  &.refundable {
                    width: 50%;
                    span [data-tooltip-hoverarea] {
                      color: $brand-grey-dark;
                    }
                    svg {
                      cursor:pointer;
                      vertical-align:middle;
                      width:16px;
                      height: 16px;
                      &, & * {
                        fill: #c7c7c7;
                      }
                    }
                  }
                  &.extra_services {
                    width: 49%;
                    @include medium-weight;
                    svg.icon-anyfill-prod-ski {
                      width: 14px;
                      height: 14px;
                    }
                  }
                  &.price {
                    width: 50%;
                    text-align: right;
                    font-size: 18px;
                    color: $brand-grey-dark;
                    @include medium-weight;
                    padding-left: 0;
                    &.cont_tax {
                      line-height: 15px;
                      del.oldPrice {
                        display: block;
                        line-height: 14px;
                      }
                      .pvp_taxes {
                        display: block;
                        color: #8c8885;
                        font-size: $font-size-small;
                        font-weight: 300;
                      }
                    }
                    del.oldPrice {
                      display: inline-block;
                      color: #74716e;
                    }
                    .symbol {
                      font-weight: normal;
                    }
                    .price_pvp {
                      display: inline-block;
                    }

                  }

                }
              }
            }

            td {
              padding: 8px 10px;
              &.pvp_recommended {
                color: $brand-copy-light;
                text-align: right;
                font-size: $font-size-base;
              }
              &.refundable {
                width: 22%;
              }
              &.forfait {
                width: 27%;
                svg {
                  &.icon-anyfill-prod-ski {
                    margin-right: 5px
                  }
                }
              }
              &.price {
                span.txt_total {
                  font-size: 11px;
                  color: $brand-copy-light;
                  text-transform: lowercase;
                  font-weight: $roboto-regular;
                }
                [data-tooltip-hoverarea] {
                  display: inline-block;
                }
              }
              /*rtl:ignore*/
              .arrow_box[data-tooltip-right] {
                left: 100%;
              }
            }
          }
        }
      }
    }
  }
  .more-types {
    margin-top: 9px;
    display: inline-block;
    cursor: pointer;
  }
  .general_hotel_information {
    position: relative;
    min-height:86px;/* dispo con tabs */
    @media (min-width: $grid-float-breakpoint) {
      display: flex;
      flex-flow: row wrap;
    }
    svg.icon-anyfill-graph-info-circle {
      width: 16px;
      height: 16px;
      vertical-align: sub;
      &, & * {
        fill: $brand-brown-medium;
      }
    }
    .detail_information_hotel{
      @media(min-width: $grid-float-breakpoint) {
        flex:1 1 60%;
        position:relative;
        &:after {
          content:'';
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          height: 100%;
          width: 1px;
          border-right:2px dotted $input-border;
        }
      }
    }
  }
  .bg_mystery {
    width: 100%;
    min-height: 150px;
    padding: 15px 0;
    border-top-left-radius: $border-radius-large;
    border-bottom-left-radius: $border-radius-large;
    .icon {
      height: 114px;
      margin: 0;
      width: 100%;
    }
  }
  .img_hotel {
    width: 202px;
    height: 150px;
    background-size: cover;
    &.photo_link {
      cursor: pointer;
    }
  }
  svg.icon-anyfill-ui-photo {
    width: 45px;
    height: 45px;
    margin: 53px auto 0;
  }

  .detail_information {
    max-width: 350px;
    @media (min-width: $grid-float-breakpoint) and (max-width: $screen-md-max) {
      max-width: 300px;
    }
  }

  .hotel_name {
    margin: 0 0 3px 0;
    color: #515253;
    font-size: 18px;
    display: block;
    @include medium-weight;
    a {
      color: #515253;
      text-decoration: none;
      cursor: pointer;
    }
    .phone-tooltip {
      vertical-align: middle;
      display: inline-block;
      height: 20px;
      cursor: pointer;
      .icon {
        vertical-align: top;
        width: 20px;
        height: 20px;
        &, & * {
          fill: $brand-copy-light;
        }
      }
    }
  }

  .city {
    font-size: $font-size-base;
    color: $brand-copy-light;
    line-height: 14px;
    display: inline-block;
    margin-bottom:5px;
  }
  .island_name {
    font-size: $font-size-small;
  }
  .distance {
    font-size: $font-size-base;
    color: $brand-copy-light;
    line-height: 14px;
    display: inline-block;
    &[data-toggle="tooltip"] {
      border-bottom: 1px dashed $brand-copy-light;
      cursor: pointer;
    }
  }
  .opinions {
    font-size: $font-size-base;
    color: $brand-copy-light;
    text-decoration: none;
    vertical-align: sub;
    display:block;
    float:none;
    margin:5px 0;
    color: $brand-copy-light;
    text-decoration: none;
    cursor: pointer;
    .icon {
      vertical-align: middle;
    }
    .num_opinions {
      vertical-align: middle;
      text-decoration: none;
      padding-right:30px;
      font-size:$font-size-base;
      &:hover{
        text-decoration:none;
      }
    }
    a {
      text-decoration: none;
      .num_opinions {
        color: $brand-copy-light;
        &:hover{
          text-decoration:none;
        }
      }
    }
  }
  .perPerson {
    font-size: 14px;
    font-weight: 300;
    display: block;
  }
  .rate_type, .discountApplied {
    color:$brand-green;
    font-size:$font-size-base;
    font-weight: $roboto-light;
    svg{
      cursor: pointer;
    }
  }
  .discountApplied {
    margin-top: 5px;
    @include medium-weight;
  }
  .txt_payment{
    color:$brand-green;
    font-size:$font-size-base;
    font-weight:$roboto-regular;
    display:block;
    @media (min-width: $grid-float-breakpoint) {
      padding: 0 5px;
    }
  }
  .txt_deferred_payment{
    color: $brand-green;
    font-size:$font-size-base;
    text-wrap: balance;
    svg{
      cursor:pointer;
    }
  }
  .popular{
    color:$brand-red;
    font-size:$font-size-base;
    margin-top:10px;
    font-weight:$roboto-regular;
  }

  .location {
    color: $brand-secondary;
    font-size: $font-size-base;
    @include medium-weight;
    margin-right: 4px;
    display: inline-block;
  }
  .bioscore_icon {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    @media (max-width: $grid-float-breakpoint-max) {
      top: 4px;
      right: 8px;
      width: 30px;
      height: 30px;
    }
  }
  .cont_price_card{
    display: block;
    margin-top:20px;
    .txt_nights{
      font-size:$font-size-small;
      font-weight: $roboto-regular;
    }
    .txt_from{
      font-size:$font-size-small;
    }
    .oldPriceContainer {
      @include medium-weight;
      color: $brand-red;
      margin-bottom: 5px;
      .oldPriceNoTabs {
        .price {
          color: $brand-red;
          font-size: 14px !important;
          .symbol {
            display: initial;
            font-size: 14px !important;
          }
        }
      }
    }
    .oldPriceNoTabs {
      .price{
        font-size: $font-size-small!important;
        color:$brand-copy-light;
        font-weight:$roboto-light;
        &.eur, &.usd, &.gbp {
          font-size: $font-size-base!important;
        }
        .symbol{
          display: none;
        }
      }
      &.priceWithoutDiscounts {
        .price {
          .symbol {
            display: initial;
          }
        }
      }
    }
    &.oldPriceNoTabs .price .symbol {
      display: initial;
    }
    .price_definitive{
      display: inline-block;
      .price{
        @include medium-weight;
        font-size: $font-size-large;
        white-space: nowrap;
        .symbol{
          font-size: 0.8em;
        }
        &.eur, &.usd, &.gbp {
          font-size:20px;
          @include medium-weight;
        }
      }

    }
    .price{
      font-size:22px;
      @include medium-weight;
    }

    .symbol{
      font-size: 18px;
      @include medium-weight;
    }
  }

  @media (min-width: $grid-float-breakpoint) {
    .cont_info_priceTabs {
      margin-top: 0;
      position: absolute;
      right: 15px;
      &--bottom {
        bottom: 15px;
      }
      .reservationBtn {
        margin: 3px 0;
        [lang|="hu"] & {
          padding-left: 10px;
          padding-right: 10px;
        }
      }
    }
  }

  .cont_info_price {
    .label_sold_out_block {
      color: $brand-red !important;
      .label_sold_out {
        margin-bottom: 0;
        color: $brand-red !important;
      }
    }
  }
  .cont_info_price_sold {
    @media (min-width: $grid-float-breakpoint-max) {
      justify-content: center;
    }
    .label_sold_out_block {
      color: $brand-red !important;
      .label_sold_out {
        margin-bottom: 0;
        color: $brand-red !important;
        text-decoration: none;
      }
    }
  }
  /* estilos para dispo sin tabs */
  .cont_info_price{
    text-align:right;
    @media (min-width: $grid-float-breakpoint) {
      text-align: center;
      flex:1 1 40%;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      padding-top: 15px;
      padding-right:0;
      padding-bottom: 15px;
      padding-left: 0;
      .logged_discount_hotel & {
        padding-top: 40px;
      }
      .discount_message_container {
        top: 10px;
        width: auto;
        & + .exclusiveinfotooltip {
          display: none;
        }
        &:hover {
          cursor: pointer;
          & + .exclusiveinfotooltip {
            display: block;
          }
        }
      }
    }
    .cont_price_card{
      line-height:19px;
      margin-top:0;
      margin-bottom: 6px;
      @media (min-width: $grid-float-breakpoint) {
        margin-top: auto;
      }
      .cont_price_from{
        display: flex;
        flex-direction: column;
        vertical-align: top;
        //display: inline-block;
        .cont_price_per_night {
          font-size: 12px;
          &, html.fonts-loaded & {
            font-weight: 300;
          }
          .price {
            &, .symbol {
              font-size: 12px;
              &, html.fonts-loaded & {
                font-weight: 300;
              }
            }
          }
        }
        .cont_text_nights {
          margin-top: auto;
        }
        .txt_nights{
          display: inline;
          @include medium-weight;
        }
        .txt_from {

        }
        .price_from {
          display: inline-block;
          &.newline {
            display: block;
          }
        }
      }
      .txt_rates{
        font-size: $font-size-small;
        line-height: 14px;
        border-bottom: 1px dashed $brand-copy-light;
        cursor: pointer;
        color: $brand-copy-light;
        .price,
        .symbol{
          font-size: $font-size-small;
          color: $brand-copy-light;
          font-weight: $roboto-light;
        }
      }
    }
    .included_taxes_and_fee {
      font-size: 12px;
    }
  }

  .cont_discount {
    width: 0;
    height: 0;
    border-top: 55px solid $brand-primary;
    border-left: 55px solid #FFF;
    position: absolute;
    right: 5px;
    top: -10px;
    border-top-right-radius: $border-radius-large;
  }
  .discount {
    position: absolute;
    top: -2px;
    color: #FFF;
    right: 7px;
    transform: rotate(45deg);
  }
  .button_availability {
    /* cambio en hungaro porque al cambiar la etiqueta buscar habitacion por Ver detalles que en hungaro es muy larga */
    html[lang|="hu"] & {
      @media (min-width: $screen-lg-min) {
        padding-left: 10px;
        padding-right: 10px;
      }
    }
  }
  .hurry_up_message{
    color: $brand-red;
    font-size: $font-size-base;
    margin: 4px 0 0 0;
    font-weight: $roboto-light;
    display: block;
    @media (min-width: $grid-float-breakpoint) {
      opacity: 0;
    }
  }
  .room_type {
    color: $brand-grey-dark;
    font-size: $font-size-small;
    text-transform: uppercase;
    font-weight: $roboto-regular;
    padding: 7px;
    float:left;
  }
  .panel.clearfix {
    clear: both;
  }
  .details ul.amenities_icons_hotels li {
    width: 100%;
  }

  /* tabs Menú info hotel */
  ul.menu_info_hotel {
    border-top: 1px solid $colorBordes;
    border-bottom: 1px solid $colorBordes;
    overflow: hidden;
    height: 40px;
    margin-bottom: 0;
    li {
      float: left;
      border-bottom: 2px solid transparent;
      &.opinions {
        margin: 0;
      }
      &:hover, &:active {
        border-bottom: 2px solid $brand-primary;
      }
      &.active {
        border-bottom: 2px solid $brand-primary;
        @include medium-weight;
      }
      &.mistery_hotel a {
        color: $brand-primary;
        font-weight: $roboto-bold;
      }
      a {
        font-size: $font-size-small;
        text-transform: uppercase;
        color: $brand-copy-light;
        display: block;
        padding: 9px 20px;
        text-decoration: none;
      }
    }
  }
  /* Fin tabs menú hotel */

  .mystery_description {
    background: $brand-grey-light;
    font-size: $font-size-small;
    line-height: 18px;
    padding: 10px;
    color: $brand-brown;
    .title {
      color: $brand-primary;
      text-transform: uppercase;
      font-size: $font-size-base;
      font-weight: $roboto-bold;
      padding-bottom: 8px;
    }
  }
}
/* Dispo nueva hoteles sin tabs*/
.showPricesFrom{
  .availability_list_sold-hotel-card {
    border-radius: 6px;
    .hotel-card_border {
      border-radius: 6px;
    }
    .dst-select-hotel-border {
      border-top-left-radius: 6px !important;
    }
  }
  .hotel_card {
    padding:0;
    > .row{
      display:flex;
    }
    .cont_img_hotel {
      @media (max-width: $grid-float-breakpoint-max) {
        padding-right: 10px !important;
        position: relative;
        display: flex;
        align-items: stretch;
        align-content: stretch;
        flex-direction: column;
      }
    }
    .detail_information_hotel {
      @media (min-width: $grid-float-breakpoint) {
        padding-top: 15px;
        padding-bottom: 15px;
      }
    }
    .hotel_name {
      padding:0 38px 0 0;
      @media (min-width: $grid-float-breakpoint) {
        padding:0 50px 0 0;
      }
      line-height: 1.3;
      font-size: 20px;
    }
    .general_hotel_information {
      padding-top:0;
      padding-bottom:0;
      min-height:156px;
      padding-left:0;
      ul.amenities_icons_hotels {
        display: block;
        clear: both;
        li {
          margin-right: 16px;
          margin-bottom: 10px;
        }
      }
     }
     .container_img_hotel{
      a{display: block}
    }
    .container_img_hotel, .generic-pic, .bg_mystery {
      border-top-left-radius: $border-radius-large;
      border-bottom-left-radius: $border-radius-large;
      min-height: 174px;
      width: 100%;
      overflow: hidden;
      margin: 0;
      height: 100%;
      @media (max-width: $grid-float-breakpoint-max) {
        min-height: 103px;
        flex: 1 0 100%;
      }
      a {
        position: absolute;
        overflow: hidden;
        height: 100%;
        width: 100%;
        left: 0;
        top: 0;
      }
    }
    .generic-pic{
      background-image: url(/headers/img/hotel_rooms/generic-250x200.jpg) !important;
      height:100%;
      .icon {
        width:40px;
        height:40px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
      }
      .bg_holiday, .bg_apartment {
        left: 25px;
        .icon {
          vertical-align:middle;
          width:16px;
          height: 16px;
          position: absolute;
          top: 50%;
          left: 10px;
          transform: translateY(-50%);
          &, & * {
            fill: #FFF;
          }
        }
        span {
          @include medium-weight;
          display: block;
        }
      }
      @media (max-width: $grid-float-breakpoint-max) {
        .bg_holiday, .bg_apartment {
          left: 0;
          .icon {
            display: none;
          }
          span.holiday_label {
            font-weight: 300 !important;
          }
        }
      }
    }
    .bg_mystery {
      position: relative;
      min-height: 0;
      padding: 0;
      .icon {
        width: 100%;
        height: 48px;
        position: absolute;
        top: 15px;
        left: 0;
        @media (min-width: 400px) and (max-width:$grid-float-breakpoint-max) {
          height: 60px;
        }
        @media (min-width: $grid-float-breakpoint) {
          height: 88px;
        }
      }
      .txt_mystery {
        background: #ec5b14;
        color: #fff;
        text-transform: uppercase;
        font-size: 12px;
        position: absolute;
        top: auto;
        bottom: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        max-width: 100%;
        padding: 2px 10px;
        border-radius: 0;
        font-size: 12px;
        text-align: center;
        border-bottom-left-radius: 6px;
        @media (min-width: $grid-float-breakpoint) {
          font-size: 14px;
          padding: 10px;
        }
      }
    }
    .img_hotel {
      margin-right: 0;
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;

      &.photo_link {
        cursor: pointer;
      }
    }
    svg.icon-anyfill-ui-photo {
      width: 45px;
      height: 45px;
      margin: 53px auto 0;
    }
    .opinions {
      display: block;
      @media (max-width: $grid-float-breakpoint-max) {
        width: 100%;
      }
    }
    .txt_regimen{
      @media (max-width: $grid-float-breakpoint-max) {
        font-size:$font-size-base;
      }
    }
    .txt_payment {
      @media (max-width: $grid-float-breakpoint-max) {
        font-size:$font-size-base;
      }
    }
  }
  .searched_hotel, .selected_hotel {
    .hotel_card {
      .container_img_hotel, .generic-pic, .bg_mystery {
        border-top-left-radius: 0;
      }
    }
  }
}
.cont_hotels {
  margin-bottom:60px;
  .cont_banner > div {
    margin: 10px auto;
  }
}


/* tablet */
@media (min-width: $grid-float-breakpoint) and (max-width: $screen-sm-max) {
  .cont_hotels {
    overflow-x: hidden; /* solucion rtl */
    min-height:616px;
  }
  .hotel_card {
    .img_hotel {
    }
    svg.icon-anyfill-ui-photo {
      width: 40px;
      height: 40px;
      margin: 55px auto 0;
    }
    .tipo_regimen {
      li.regimenAlojamientoContainer {
        table.info_habitacionContainer {
          width: 100%;
          border-left: 0;
          tr {
            border-top: 1px solid #e3e3e3;
            &.rate-odd {
              background: #fff;
            }
            td {
              padding: inherit;
            }
          }
        }
      }
    }
  }
}

/* Mobile */
@media (max-width: $grid-float-breakpoint-max) {
  .showPricesFrom{
    .hotel_card {
      .hotel_name {
        font-size: 18px;
        margin-bottom: 2px;
      }
    }
  }
  .hotel_card {
    padding: 0;
    margin: 5px 0;
    color: $brand-grey-dark;
    line-height: 1.25;
    position: relative;
    .container_img_hotel {
      .img_hotel {
        width: 100%;
        height: 100%;
        object-fit: cover;
        margin-right: 0;
        position: absolute;
        border-top-left-radius: $border-radius-large;
        border-bottom-left-radius: $border-radius-large;
       }
    }
    .rate_type{
      margin-right:0;
      svg{
        display:none;
      }
    }
    .txt_payment{
      font-size:$font-size-small;
    }
    .cont_img_hotel{
      padding:0 5px 0 15px!important;
    }
    .txt_regimen{
      font-size:$font-size-small;
      float:none!important;
    }
    .all_without_price{
      /*min-height:65px;*/
      margin-bottom:8px;
    }

    .txt_extras{
      text-align:left;
      display: table;
    }
    .row {
      display: flex;
      margin-right:0;
    }
    .general_hotel_information {
      min-height: 103px!important;
      padding: 7px 8px 7px 0 !important;
      position: static;
      display: flex;
      flex-direction: column;
        hr{
          display:none;
        }
        .detail_information_reservation{
          font-size: $font-size-small;
          text-align:right;
        }
    }
    .cont_info_priceTabs {
      margin-top: auto;
    }
    .city,
    .distance {
      line-height: 14px;
      font-size:$font-size-base;
    }
    .hotel_name {
      font-size: 18px;
      margin:0;
      padding:0;
    }
    .amenities_icons {
      display: none;
    }
    .container_img_hotel, .generic-pic, .bg_mystery {
      border-top-left-radius: $border-radius-large;
      border-bottom-left-radius: $border-radius-large;
      min-height: 103px;
      width: 100%;
      overflow: hidden;
      position: relative;
      margin: 0;
      height: 100%;
    }

    .generic-pic {
      background-position: top center !important;
      background-size: cover !important;
      svg.icon-anyfill-ui-photo {
        width: 40px;
        height: 40px;
        margin: 32px auto 0;
        .showPricesFrom & {
          margin: 0;
        }
      }
    }
    .bg_mystery {
      padding: 10px 0;
      .icon {
        height: 78px;
      }
    }
    .cont_discount_mobile {
      width: 0;
      height: 0;
      border-top: 55px solid $brand-primary;
      border-right: 55px solid transparent;
      position: absolute;
      left: 15px;
      top: 0;
      /*border-top-left-radius:6px*/
    }
    .discount_mobile {
      position: absolute;
      top: 8px;
      color: #FFF;
      left: 19px;
      transform: rotate(-45deg);
    }

    .pvp_foreign {
      font-size: 11px;
      color: $brand-grey-dark;
      line-height: 18px;
      .price{
        color: $brand-grey-dark;
        @include medium-weight;
        font-size: $font-size-large;
        white-space: nowrap;
        .symbol{
          color: $brand-grey-dark;
          font-size: 0.8em;
        }
        &.eur, &.usd, &.gbp {
          font-size:20px;
        }
      }
    }
    .go_mobile {
      position: absolute;
      top: 50%;
      right: 5px;
      transform: translate(0, -50%);
      svg {
        width: 10px;
        height: 10px;
        /*rtl:ignore*/
        [dir='rtl'] & {
          transform: rotate(-180deg);
        }
        &, & * {
          fill: $brand-brown-medium;
        }
      }
    }
    .visible-xs-block {
      .txt_nights{
        display: inline;
        @include medium-weight;
      }
      .cont_price_from{
        display: inline-block;
        .txt_from {
          font-size: $font-size-small;
        }
      }
      .total_price_text {
        font-size: $font-size-small;
      }
     }
     .pR5{
      padding-right: 5px;
     }

  }

 .opinions{
    display: block;
    margin-top:3px;
   .num_opinions{
     padding-right:0!important;
   }
  }

  /* ficha hotel buscado */
  .searched_hotel {
    .hotel_card {
      margin: 0;
      padding-left: 0;
      padding-top: 0;
      padding-bottom: 0;
      .container_img_hotel, .img_hotel.generic-pic, .bg_mystery {
        border-top-left-radius: 0;
      }
    }
  }
}

.cont_precio{
  font-size: $font-size-small;
  padding-top: 4px;
  text-align: right;
  line-height: 17px;
  color: $brand-grey-dark;
  .current-price {
    display: inline-block;
  }
  .price,
  .current-price .price {
    display: block;
    font-size: $font-size-large;
    @include medium-weight;
    &.eur, &.usd, &.gbp {
      font-size: 20px;
    }
    abbr, .symbol{
      font-size: 0.8em;
      @include medium-weight;
    }
  }
}

@media (max-width: 420px) {
  .hotel_card {
    .container_img_hotel {
      .img_hotel {
        min-height: 103px;
        height: 100%;
        width: 100%;
        object-fit: cover;
        top: 0;
        bottom: 0;
      }
    }
  }
}

.percent_message_container {
  @include medium-weight;
  background: $brand-red;
  color: #FFFFFF;
  border-radius: 15px;
  padding: 3px 10px;
  align-self: center;
  margin-bottom: auto;
  display: inline-block;
  @media (max-width: $grid-float-breakpoint-max) {
    position: absolute;
    top: 5px;
    left: 5px;
    right: auto;
    .logged_discount_hotel & {
      left: 35px;
    }
  }
}


@media (max-width: $grid-float-breakpoint-max) {

  .hotel_card {
    .coupon_message_container {
      &--mobile {
        position: absolute;
        top: 5px;
        left: 5px;
        right: auto;
        padding: 4px !important;
        border-radius: 50% !important;
        margin: 0;
        width: 24px;
        height: 24px;
      }
    }
  }
}


.coupon_message_container {
  display: inline-block;
  z-index: 9;
  border-radius: 15px;
  padding: 0 10px;
  align-self: center;
  margin-bottom: auto;
  margin: 0 5px;

  @media (max-width: $grid-float-breakpoint-max) {



    &--cashback {
      margin: 0;
    }

  }

  &--cashback {
    background: $brand-green;
    .icon {
      &, & * {
        fill: $brand-white;
      }
    }
  }

  &--mobile {
    background: $brand-green-light;
    .icon {
      &, & * {
        fill: $brand-green;
      }
    }
  }

  .icon_container {
    display: inline-block;
    line-height: 1;
    vertical-align: top;
  }

  .icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin: 0;
  }
}

.message_hotel_coupon_price {
  color: $brand-white;
  font-weight: $roboto-light;
  line-height: 25px;
  cursor: pointer;
  .price {
    display: inline-block;
  }
  @media (max-width: $grid-float-breakpoint-max) {
    &--mobile {
      display: none;
    }
  }
}

.container_img_hotel {
  .main_highlights_container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    padding: 8px;

    .main_highlight {
      background: $brand-primary;
      color:#FFF;
      padding:2px 10px;
      border-radius: 15px;
      font-size:$font-size-base;
      z-index: 1;
      max-width: 93%;

      display: flex;
      flex-direction: row;
      gap: 5px;
      justify-content: flex-start;
      align-items: center;

      .icon {
        background-repeat: no-repeat;
        background-size: 100% 100%;
        display: inline-block;
        height: 16px;
        width: 16px;
        &, & * {
          fill: #FFF;
        }
      }

      &--popular, &--value_money {
        background-color: $interactive-color;
      }

      &--black_friday {
        background-color: #222;

        .icon {
          &, & * {
            fill: #E50000;
          }
        }
      }

      &--popular, &--value_money, &--apartment, &--holiday {
        @media (max-width: $grid-float-breakpoint-max) {
          top: auto;
          bottom: 0;
          padding: 4px 10px;
          border-radius: 0;
          font-size: $font-size-small;
          left: 0;
          z-index: 1;
          width: 100%;
          max-width: 100%;
          text-align: center;
          position:absolute;
          display: block;
          border-bottom-left-radius: $border-radius-large;
          .icon {
            display: none;
          }
        }
      }
    }

  }
}

// Excepciones idiomas
html[lang|="ja"] .hotel_card .button_availability{font-size:11px;}


.nocache20260325{
  color: green;
}