/* Página de hotel */
/* http://destinia.com/hotels/ritz-madrid/madrid/madrid/espana/europa/3302/es */
@import "../../../../basic_imports";
@import "../../../../../../../common/sass/components/_common_list_bullet";
@import "../../../../../../../common/sass/components/_hotel_points_opinions";
@import "../../../../../../../common/sass/components/_hotel_carousel_photos";
@import "../../../../../../../common/sass/components/_summary_deals2.scss";

/* Importar estilos de opiniones de tripadvisor*/
@import "../../../../../../../common/sass/components/hotel_opinions_tripadvisor";

/* Importar estilos de opiniones de Google*/
@import "../../../../../../../common/sass/components/hotel_opinions_google";

/* Importar estilos de opiniones genericas (tanto para tripadvisor, destinia, google...)*/
@import "../../../../../../../common/sass/components/hotel_opinions_generic";

/* Importar estilos de rating bioscore */
@import "../../../../../../../common/sass/components/hotel_rating_bioscore";

/* Importar estilos de la tabla de precios medios de hoteles */
@import "../../../../../../../common/sass/components/_average_hotel_prices";

@import "../../../../../../../common/sass/components/hotels_info";

@import "../../../../../../../common/sass/components/hotels_top_data";

@import "../../../../../../../common/sass/components/room_selection_map";



/* Modificación títulos subsecciones: BOC */
#info_header {
  margin-bottom: 20px;
  margin-top: 60px;
}
/* Titulo bloque */
.header_content {
  margin-top: 30px;
}
.hotelsNear {
  @media (min-width: $screen-lg-min) {
    width: 80%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
}

/* Modificación títulos subsecciones: EOC */

.help_phone {
  position: absolute;
  top: -32px;
  right: 0;
}

/* Modificaciones tabs modulo opiniones pag SEO*/
.tabs_component .tab-content {
  padding-top: 30px !important;
}

.nombre_hotel {
  color: $brand-grey-dark;
  font-size: 46px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.skyscrapper {
  top: 287px;
}

.mMTop18 {
  margin-top: -18px;
}

.mMLeft15 {
  margin-left: -15px;
}

.mLeft15 {
  margin-left: 15px;
}

.pLR0 {
  padding-left: 0;
  padding-right: 0;
}

.separador {
  margin: 0 5px;
}
.hotel-content {
  padding: 0;
}
.link, .link:hover {
  text-decoration: none;
}
.link.mapa {
  .icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    &, & * {
      fill: $brand-secondary;
    }
  }
}
@media (max-width: 1023px) {
  .hotel-seo-content-tablet {
    padding: 0;
  }
}
@media (min-width: 1024px) and (max-width: 1366px){
  .searcher-seo-content-tablet {
    padding-left: 30px;
  }
}

.tablet-price-cta {
  display: flex;
  flex-wrap: wrap;
  @media (max-width: $grid-float-breakpoint-max) {
    margin-left: 15px;
    margin-top: 15px;
  }
  @media (min-width: $grid-float-breakpoint) and (max-width: 1224px) {
    display: none;
  }
}

.tit_peq {
  text-transform: uppercase;
  font-size: $font-size-base;
  padding: 10px 0;
  .visible-sm-block & {
    display: inline-block;
    padding: 0;
  }
  .room_selection .visible-xs-block & {
    display: block;
  }
}

.sh_map-block {
  @media (min-width: $screen-md-max) {
    padding-top: 15px;
  }
}

.opinions {
  padding-top: 0;
  margin-top: 0 !important;
}

@media (max-width: $grid-float-breakpoint-max) {
  .opinions {
    margin-bottom: 15px;
  }
}

.destinia_summary-box {
  display: flex;
  align-items: center;
  @media (min-width: $grid-float-breakpoint) and (max-width: 1023px) {
    margin-bottom: 40px;
  }
}

.room_selection {
  .searcher-title {
    margin-top: 60px;
    @media (max-width: 1366px) {
      margin-top: 45px;
    }
  }
  .wide_searcher {
    margin-bottom: 60px;
  }
}

.price-period {
  .visible-sm-block & {
    display: inline-block;
    padding: 0;
    text-align: right;
  }
  span {
    display: inline-block;
  }
  .price {
    .price {
      @include medium-weight;
      font-size: 20px;
      line-height: 1.2;
      color: $brand-grey-dark;
      .visible-xs-block & {
        font-size: 24px;
      }
      .symbol {
        color: $brand-grey-dark;
        font-size: 0.85em;
        @include medium-weight;
        .visible-xs-block & {
          font-size: $font-size-base;
        }
      }
      &.eur, &.usd, &.gbp {
        font-size: 24px;
      }
    }
  }
  .period {
    font-size: $font-size-small;
    .visible-xs-block & {
      font-size: $font-size-base;
      line-height: 1;
    }
  }
}

.etiqueta {
  border: 1px solid #a98a54;
  padding: 4px;
  font-weight:$roboto-bold;
  color: #a98a54;
  text-transform: uppercase;
  margin-right: 10px;
}

.linkListado {
  text-align: right;
}

.amenities_icons {
  display: inline;
  cursor: pointer;
}
.btnsUtil {
  background: #f2f2f2;
}

.btnsUtil span {
  text-decoration: none;
  color: #3171c9;
  cursor: pointer;
}

.btnsUtil li {
  padding: 4px 8px;
  font-size: 14px;
  border-left: 2px solid #fff;
}

.btnsUtil li:last-child {
  border-right: 2px solid #fff;
}

.btnsUtil li:first-child {
  border-left: none;
}

.btnsUtil li.activo {
  border-bottom: 3px solid $brand-primary !important;
  color: #333 !important;
}

.tAlign {
  text-align: right;
}

.contPrecio.contPrecioDesde {
  position: absolute;
  text-align: right;
  margin-top: -40px;
  padding-right: 30px;
  z-index:2;
}

.contPrecio {
  color: $brand-grey-dark;
  margin-top: 24px;
  font-size: 12px;
  white-space: nowrap;
}

.contPrecio span {
  margin-right: 3px;
}

.contPrecio .price {
  font-size: 30px;
  font-weight: $roboto-bold;
  color: $brand-grey-dark;
}

.contPrecio .symbol {
  font-size: 24px;
}

.btnsSocial {
  padding-bottom: 10px;
}

.btnsSocial button {
  border-radius: 0;
}

#tripadvisor_summary .col-lg-4 {
  margin-left: -10px;
  margin-right: 10px;
}

.txtTA {
  border-bottom: #d7d7d7 1px solid;
  min-height: 45px;
}

.txtTA .valoracion_TA_big_40 {
  margin-left: -15px;
}

.txtTA .valoracion_TA_big {
  height: 21px;
}

.txtTA span {
  display: block;
  font-size: 13px;
  margin-left: 0;
}

.linkMapaGrande {
  background: url('/headers/ilusion/img/hotels/hotel_map_grande.png') top left no-repeat;
  width: 100%;
  max-width: 752px;
  height: 140px;
  text-align: right;
  padding: 110px 10px 0 0;
  display: block;
  text-decoration: none;
  margin-bottom: 15px;
  font-weight: $roboto-bold;
}

.linkMapaGrande:hover {
  text-decoration: none;
}

.pLR0 .linkMapaGrande {
  background-position: -484px;
}

#map_container {
  display: none;
}

.destaca_por li {
  font-size: 14px;
  color: #777;
  margin-left: 10px;
}

#buscador {
  margin: 0;
  padding: 0;
}

.contTitulo {
  margin: 19px 0;
}

.serviciosHotel {
  display: inline-block;
  margin-right: 15px;
}

/* Nota Destinia hotel */
.tab-content .progress-radial .overlay {
  background-color: #fff !important;
}

.btnEscribir {
  text-align: right;
  margin-bottom: 20px;
}

.btnVerMas {
  text-align: right;
  margin-top: 13px;
  .icon {
    width: 11px;
    height: 11px;
    vertical-align: middle;
    &, & * {
      fill: $brand-secondary;
    }
  }
}


.btnsNota {
  margin-top: 50px;
  padding-top: 25px;
  border-top: #d7d7d7 1px solid;
}

.notaLateral {
  cursor: pointer;
}

.txtTA {
  cursor: pointer !important;
}

.notaLateral .valoracion, .notaLateral .basado_en {
  font-size: 13px !important;
}

.notaLateral .progress-radial {
  margin: 0 20px;
}

.notaLateral .progress-radial.progress-radial_seo {
  margin: 0;
  .op_basado_en {
    vertical-align: middle;
  }
}
.notaLateral .txtvaloracion {
  margin-left: 102px;
  min-height: 54px;
}

.notaLateral .txtvaloracion.txtvaloracion_seo {
  margin-left: 50px;
}

.block_container {
  @media (max-width: $grid-float-breakpoint) {
    padding: 0;
  }
}

//MAPA

button.location{
  background-color:transparent;
  background-image:url('/headers/widgets/hotels/availability/hotelavailabilitywidget/img/bg-btn-map.svg');
  background-repeat: no-repeat;
  background-size:cover;
  height: 42px;
  width: 100%;
  //padding: 0 0 40px 10px;
  color: $brand-grey-dark;
  font-size:$font-size-base;
  border:1px solid $brand-brown-medium;
  border-radius: $border-radius-large;
  text-align: center;
  vertical-align: middle;
  margin-bottom: 15px;

  .icon {
    width: $font-size-large;
    height: $font-size-large;
    vertical-align: middle;
    &, & * {
      fill: $brand-grey-dark;
    }
  }
  &:hover{
    border:1px solid $brand-grey-dark;
  }
  .location-title {
    font-size: $font-size-large;
  }
}

.excelent-location-label {
  font-size: 14px;
  color: $brand-secondary;
  font-weight: $roboto-medium;
  margin-bottom: 5px;
}

#uopiniones .titulo {
  font-size: 16px;
  color: $brand-navy;
  font-weight: $roboto-bold;
  margin-bottom: 10px;
}

#uopiniones li {
  margin-bottom: 15px;
}

#uopiniones li, #uopiniones .titulo {
  margin-left: 0;
}

.datosuser {
  font-size: 12px;
}


.vermas {
  text-decoration: none;
  font-size: 13px;
}

.vermas.pull-right,
.vermas.upper {
  position: relative;
  top: 23px;
  @media (max-width: $screen-md-max) {
    float: none !important;
  }
}

.nota {
  border-bottom: 1px solid #7d7d7d;
}

#ubicacion ul {
  display: block;
  border-bottom: #d3d3d3 1px solid;
  padding-bottom: 20px;
  padding-top: 20px;
}

#ubicacion li {
  margin-bottom: 10px;
}

#ubicacion li a, #ubicacion li a:hover {
  text-decoration: none;
  font-weight: $roboto-bold;
}

#ubicacion .glyphicons-map {
  color: #c5c5c5;
}

/* Preguntas frecuentes */
#faq li a, #faq li a:hover {
  color: $brand-grey-dark;
  text-decoration: none;
  font-weight: 300 !important;
}

#faq .list_links.list-group {
  margin-left: 15px;
}

#faq li {
  list-style-type: disc;
}

#faq li a:before {
  width: 0;
  display: inline;
  margin: 0;
  height: 0;
  background: none;
}
#faq .glyphicons-circle-question-mark {
  color: #c5c5c5;
  margin-top: 5px;
  margin-right: 5px;
  float:left;
}

#faq li {
  margin-bottom: 10px;
}

/* Fin de la nota Destinia del hotel */

@media (min-width: 992px) {
  .floating_map_link {
    position: absolute;
    left: 100%;
    z-index: 9;
    margin-left: -130px;
    margin-top: -60px;
  }

  span.mapGallery {
    margin-right: 30px;
    margin-top: -30px;
    display: block;
    min-width: 112px;
    min-height: 65px;
    border-radius: 4px;
    background: #FFF;
    padding: 10px 2px;
    text-align: center;
    line-height: 22px;
    font-size: 12px;
    font-weight: $roboto-bold;
    opacity: 0.7;
    z-index: 9;
  }
  .floating_map_link:hover span.mapGallery {
    opacity: 1;
  }

  span.mapGallery .icon {
    width: 26px;
    height: 26px;
    vertical-align: middle;
    &, & * {
      fill: $brand-secondary;
    }
  }

  .carousel a, .carousel a:hover {
    text-decoration: none;
  }

  .pLR0 .linkMapaGrande {
    display: none;
  }
}

@media (max-width: 991px) {
  span.mapGallery {
    display: none;
  }

  .pLR0 .linkMapaGrande {
    display: block;
  }
}

@media (width: 1024px) {
  .txtvaloracion span {
    font-size: 14px;
    padding-bottom: 2px;
  }

  .txtvaloracion {
    padding-top: 20px;
    margin-left: 80px;
  }

  .btnsNota button {
    margin-bottom: 15px;
  }
}

@media (min-width: 1200px) {
  .txtvaloracion {
    padding-top: 0;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .contPrecio {
    margin-top: 38px;
  }

  .txtvaloracion {
    padding-top: 0;
    margin-left: 65px;
  }


  .notaLateral .txtvaloracion {
    padding-top: 0;
  }



  .notaLateral .cajanota {
    clear: both;
    margin: 0 0 65px -50px;
    text-align: center;
  }



  .notaLateral .cajanota span:after {
    content: '';
    position: absolute;
    top: 111%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid $brand-navy;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
  }

  .notaLateral .cajanota span {
    margin-left: 14px;
  }



  .notaLateral .txtvaloracion {
    text-align: left;
    margin-left: 0;
  }

  .notaLateral .nota {
    margin-bottom: 20px;
  }

  .txtTA {
    text-align: center;
  }

  .valoracion_TA_owl {
    margin-left: 30% !important;
  }


}

@media (min-width: 768px) and (max-width: 991px) {
  #uopiniones {
    margin-top: 20px;
  }
  .btnsNota {
    margin-top: 20px;
  }

  .titulo_producto {
    line-height: 19px;
    font-size: 23px;
  }

  .contPrecio {
    margin-top: 18px;
  }

  .notaLateral .valoracion, .notaLateral .basado_en {
    font-size: 13px;
  }

  .notaLateral .txtvaloracion {
    margin-left: 0;
    padding-bottom: 1px;
    padding-left: 0;
    margin-top: -10px;
  }

  .pLR0 .linkMapaGrande {
    background-position: -28px;
  }
}

@media (max-width: 767px) {
  .contPrecio {
    margin-top: 0px;
  }
}

@media (min-width: 521px) and (max-width: 991px) {
  .txtvaloracion.txtvaloracion_seo {
    padding-top: 5px;
    padding-left: 0;
  }


}

@media (min-width: 521px) and (max-width: 767px) {
  .notaLateral .txtvaloracion.txtvaloracion_seo {
    margin-left: -5px;
    padding-bottom: 4px;
    padding-left: 55px;
  }

  .txtvaloracion {
    padding-top: 4px;
  }

  .notaLateral .valoracion, .notaLateral .basado_en {
    font-size: 13px !important;
  }


  .txtTA span {
    text-align: left;
  }


  .txtTA .TAbasado_en, .txtTA .TAvaloracion {
    padding-left: 115px;
  }


  .txtTA .TAvaloracion {
    margin-top: -23px;
  }

  .txtTA .valoracion_TA_owl {
    margin-left: 0 !important;
  }
}

@media (min-width: 320px) and (max-width: 520px) {
  .cajanota {
    clear: both;
    margin: 0 0 65px -50px;
    text-align: center;
  }


  .cajanota span:after {
    content: '';
    position: absolute;
    top: 111%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid $brand-blue-dark;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
  }
  .progress-radial {
    margin: 0 auto;
    margin-right: 8px;
  }
  .txtvaloracion {
    text-align: left;
  }
  .notaLateral .progress-radial {
    margin: 0 auto;
  }
  .notaLateral .txtvaloracion {
    margin-left: 0;
    padding-top: 0;
    text-align: left;
  }

  .txtvaloracion strong {
    white-space: normal;
  }
  #tripadvisor_summary .txtTA {
    text-align: center;
  }
}

.btnEscribir.opinions_destinia_header_01 {
  @media (min-width: 996px) {
    display: none;
  }
  @media (min-width: 600px) and (max-width: 1024px) {
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
  }
}

.btnEscribir.opinions_destinia_header_02 {
  @media (max-width: $grid-float-breakpoint) {
    display: none;
  }
}


@media (max-width: 600px) {
  .btnEscribir {
    text-align: center;
  }
  .btnEscribir.opinions_destinia_header_01 {
    margin-bottom: 0;
    padding-bottom: 15px;
  }

  .btnVerMas {
    text-align: left;
  }
}

@media (min-width: 600px) and (max-width: 1024px) {
  .opinions_destinia_header {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    border-bottom: 2px solid #e6e6e6;
    padding: 0;
  }
}

@media (min-width: 320px) and (max-width: 767px) {
  .btnsNota {
    margin-top: 10px;
  }

  #uopiniones {
    margin-top: 20px;
  }

  #uopiniones li, #uopiniones .titulo {
    margin-left: -15px;
  }

  .notacomentario {
    margin-right: 5px;
  }
  /*
    .txtTA {
      text-align: center;


    /*.valoracion_TA_owl{
        margin-left: 30%!important;
    }*/

  #ubicacion ul {
    padding-bottom: 14px;
  }

  .pLR0 .linkMapaGrande {
    background-position: 90%;
  }
}

@media (max-width: 1199px) {
  .linkListado {
    text-align: left;
  }

}

.iframe_Tripadvisor {
  width: 100%;
  height: 650px;
  border: 0;
}

.hotel_chain {
  text-align: center;
  height: 315px;
  white-space: nowrap;
  margin-top: 49px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #ccc;
  background-size: 370px 315px;
}

.hotel_chain_01 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-01.jpg');
}

.hotel_chain_02 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-02.jpg');
}

.hotel_chain_03 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-03.jpg');
}

.hotel_chain_04 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-04.jpg');
}

.hotel_chain_05 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-05.jpg');
}

.hotel_chain_06 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-06.jpg');
}

.hotel_chain_07 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-07.jpg');
}

.hotel_chain_08 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-08.jpg');
}

.hotel_chain_09 {
  background-image: url('/headers/ilusion/img/hotels/hotel_photo_background/cadena-09.jpg');
}

.hotel_chain span.centering {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.hotel_chain .centered {
  display: inline-block;
  vertical-align: middle;
}

.hotel_chain span.chain_name {
  display: block;
  color: #FFF;
  font-size: 21px;
  letter-spacing: 1px;
  margin-top: 20px;
}

.hotel_chain a {
  text-decoration: none;
}

.hotel_chain span.chain_text_link {
  color: #fff;
  font-size: 14px;
  text-decoration: none;
  border: 1px solid #fff;
  padding: 10px 20px;
  display: inline-block;
  margin-top: 20px;
  white-space: normal;
}

.hotel_description,
.hotel_ubication {
  font-size: 14px;
}

p.hotel_description.view-more-text {
  overflow: hidden;
  height: 112px;
}

.close-points-title {
  margin-top: 60px;
}

.lista_enlaces.lista_poi li a {
  color: $brand-grey-dark;
  &:hover {
    text-decoration: none;
  }
}

.lista_enlaces.lista_poi li {
  margin-bottom: 10px;
}

span.tipolista {
  font-weight: 500;
}

ul.lista_poi {
  list-style-type: disc;
  margin-left: 15px;
}

.lista_enlaces.lista_poi li a:before {
  width:0;
  height: 0;
  background: none;
}
ul.list_links {
  list-style-type: disc;
}

.list_links.list_group li a {
  color: $brand-grey-dark;
}
.carousel_photos_2015 .generic-pic.pic-lg {
  width: 100%;
  height: 264px;
  svg {
    margin-top: 102px;
    width: 72px;
    height: 60px;
  }
}

/* ETIQUETA MUY POPULAR */
.bg_popular {
  background: $interactive-color;
  top:10px;
  position:absolute;
  color:#FFF;
  border-radius: 15px;
  font-size:$font-size-base;
  padding:2px 10px 2px 30px;
  left: 25px;
  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_popular {
    top: auto;
    bottom: 0;
    padding: 2px 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
    }
  }
}