/* -------------------------------------------------- Mixins */
/*
<div class="progress-circle p{VALUE_OF_PROGRESS} {if VALUE_OF_PROGRESS > 50}over50{/if}">
	<span>{VALUE_OF_PROGRESS}%</span>
	<div class="left-half-clipper">
		<div class="first50-bar"></div>
		<div class="value-bar"></div>
	</div>
</div>
*/
/* --------------------------------------------------------------------- */
/* -------------------------------------------------- Hotel Details */
[data-page-name~=hotel] main {
  margin: 0 auto;
  max-width: 192rem;
  position: relative;
  width: 100%;
}
[data-page-name~=hotel] .recommendation__wrapper {
  align-items: center;
  display: flex;
  margin-bottom: 1rem;
}

#ibeHotel {
  display: flex;
  width: 100%;
}
@media (min-width: 1200px) {
  #ibeHotel {
    margin: 5rem 0 0 0;
  }
}

.ibeHotelDetails {
  position: relative;
  width: 100%;
}

.hotel {
  padding: 1.5rem 1.5rem 0 1.5rem;
}
@media (min-width: 1200px) {
  .hotel {
    padding: 0 5rem;
  }
}
.hotel .headline h3 {
  font-size: 2rem;
}
.hotel__header {
  display: flex;
  justify-content: space-between;
}
.hotel__header__share {
  display: flex;
  flex-direction: column;
}
.hotel__header__share span {
  color: var(--secondary);
  font-size: 1.4rem;
}
.hotel__header h1 {
  width: 100%;
}
.hotel__stars {
  height: 2.2rem;
  margin-bottom: 1rem;
  position: relative;
  width: 100%;
}
.hotel__rating {
  align-items: center;
  color: var(--primary);
  display: flex;
  justify-content: flex-start;
  position: absolute;
  top: 0;
  width: 13rem;
  z-index: 1;
}
.hotel__rating i {
  font-size: 2.2rem;
  margin: 0 0.1rem;
}
.hotel__rating__background {
  align-items: center;
  display: flex;
  justify-content: flex-start;
  position: absolute;
  top: 0;
  width: 13rem;
}
.hotel__rating__background i {
  color: var(--grey--lite);
  font-size: 2.2rem;
  margin: 0 0.1rem;
}
.hotel h2 {
  color: var(--secondary);
  font-weight: bold;
  margin-bottom: 1rem;
  width: 100%;
}
.hotel h2 a {
  color: var(--secondary);
}
.hotel__location {
  margin-bottom: 2rem;
  width: 100%;
}
.hotel__location span {
  font-weight: bold;
}
.hotel__slider {
  margin-bottom: 5rem;
}
.hotel__slider .swiper {
  height: 100%;
  width: 100%;
}
.hotel__slider .swiper-slide {
  background-position: center;
  background-size: cover;
  max-width: 70rem;
}
.hotel__slider .swiper-slide:not(.swiper-slide-active) {
  opacity: 0.5;
}
.hotel__slider .swiper-button-lock {
  display: none !important;
}
.hotel__slider .swiper-button-prev, .hotel__slider .swiper-button-next {
  cursor: pointer;
  display: block;
  height: 100%;
  margin: 0;
  top: 0;
  width: 10%;
  z-index: 2;
}
.hotel__slider .swiper-button-prev:before, .hotel__slider .swiper-button-next:before {
  background: var(--grey--lite);
  content: "";
  display: block;
  height: 3rem;
  position: absolute;
  top: calc(50% - 1.5rem);
  width: 2.2rem;
}
.hotel__slider .swiper-button-prev:after, .hotel__slider .swiper-button-next:after {
  color: var(--secondary);
  font-family: "easyWeb-Standard";
  font-size: 1.2rem;
  font-weight: bold;
  position: absolute;
  top: calc(50% - 0.6rem);
}
.hotel__slider .swiper-button-prev {
  left: 0;
}
.hotel__slider .swiper-button-prev:before {
  border-bottom-right-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  left: 0;
}
.hotel__slider .swiper-button-prev:after {
  content: "\e94f";
  left: 0.4rem;
}
.hotel__slider .swiper-button-next {
  right: 0;
}
.hotel__slider .swiper-button-next:before {
  border-bottom-left-radius: 2.2rem;
  border-top-left-radius: 2.2rem;
  right: 0;
}
.hotel__slider .swiper-button-next:after {
  content: "\e951";
  right: 0.4rem;
}
.hotel__slider .hotel__image {
  aspect-ratio: 16/9;
  margin-bottom: 0;
}
.hotel__slider .hotel__image img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.hotel__image {
  aspect-ratio: 16/9;
  margin-bottom: 5rem;
  max-height: 40rem;
}
.hotel__image img {
  height: 100%;
  width: auto;
}
.hotel__details {
  margin-bottom: 5rem;
}
.hotel__details.active .hotel__details__text {
  max-height: 100%;
}
.hotel__details__text {
  max-height: 7rem;
  overflow: hidden;
}
.hotel__details__readMore {
  display: flex;
  justify-content: center;
}
.hotel__details__readMore button {
  background: #fff;
  border-radius: 50%;
  box-shadow: var(--box-shadow);
  height: 4rem;
  width: 4rem;
}
.hotel__details__readMore button i {
  color: var(--secondary);
  font-size: 1rem;
  font-weight: bold;
}
.hotel__details.iniMap {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  width: 100%;
}
.hotel__details.iniMap .showMap {
  color: var(--secondary);
  cursor: pointer;
  font-weight: bold;
  text-align: right;
  text-decoration: underline;
  width: 100%;
}
.hotel__map {
  height: 40rem;
  width: 100%;
}
.hotel__map .wkMapbox {
  height: 100%;
  width: 100%;
}
.hotel__map .mapboxWrapper {
  height: 100%;
  width: 100%;
}
.hotel__map .map {
  height: 100%;
  width: 100%;
}
.hotel__attributes {
  margin-bottom: 5rem;
}
.hotel__attributes__content {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem 5rem;
}
.hotel__attribute {
  align-items: center;
  display: flex;
  flex-shrink: 0;
}
.hotel__attribute i {
  color: var(--secondary);
  font-size: 3rem;
  margin-right: 1rem;
}
.hotel__share {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  position: relative;
}
.hotel__share:hover > i, .hotel__share:focus > i, .hotel__share:active > i {
  color: var(--primary--hover);
}
.hotel__share:hover > .description, .hotel__share:focus > .description, .hotel__share:active > .description {
  color: var(--primary--hover);
}
.hotel__share .ew-share {
  color: var(--secondary);
  font-size: 2rem;
}
.hotel__share .menu {
  background: white;
  border-radius: 0.2rem;
  box-shadow: var(--box-shadow);
  height: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 100%;
  transition: width 0.3s, height 0.3s;
  width: 0;
  z-index: 3;
  /*&.active {
  	height     : auto;
  	transition : width .3s, height .3s;
  	width      : 100%;
  }*/
}
.hotel__share .menu > div {
  cursor: pointer;
  margin: 0 1rem;
  padding: 0.5rem 1rem;
}
.hotel__share .menu > div:hover, .hotel__share .menu > div:focus, .hotel__share .menu > div:active {
  background: var(--primary--hover);
}
.hotel__share .menu > div:hover > a, .hotel__share .menu > div:focus > a, .hotel__share .menu > div:active > a {
  color: var(--white);
}
.hotel__share .menu > div:hover > a > i, .hotel__share .menu > div:focus > a > i, .hotel__share .menu > div:active > a > i {
  color: var(--white);
}
.hotel__share .menu > div:first-child {
  margin-top: 1rem;
}
.hotel__share .menu > div:last-child {
  margin-bottom: 1rem;
}
.hotel__share .menu > div > a {
  color: var(--primary);
}
.hotel__share .menu > div > a > i {
  margin-right: 1.5rem;
}
.hotel__share .menu > p {
  align-items: center;
  background: white;
  display: flex;
  height: 100%;
  justify-content: center;
  margin: 0 0;
  opacity: 0.7;
  padding: 1rem;
  position: absolute;
  top: 0;
  width: 100%;
}
.hotel__share .menu > p > i {
  animation: rotate 2s linear infinite;
  position: unset;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-360deg);
  }
}
.hotel__share__trigger {
  position: relative;
  right: 0.2rem;
}

.ibe__wrapper {
  display: flex;
  margin: 0 0 5rem 0;
  width: 100%;
}
@media (min-width: 1200px) {
  .ibe__wrapper {
    margin: 5rem 0;
  }
}
.ibe__container {
  padding: 1.5rem 1.5rem 5rem 1.5rem;
  width: 100%;
}
@media (min-width: 1200px) {
  .ibe__container {
    padding: 0 5rem 5rem 5rem;
  }
}
.ibe__container .headline h3 {
  font-size: 2rem;
}
.ibe__placeholder {
  position: absolute;
}
@media (min-width: 1366px) {
  .ibe__placeholder {
    flex-shrink: 0;
    max-width: 32rem;
    position: relative;
    width: 100%;
  }
}

#offers {
  display: grid;
  gap: 5rem;
  position: relative;
}

.ibeOffer {
  border-radius: 1.5rem;
  box-shadow: var(--box-shadow);
  display: flex;
  flex-direction: column;
  padding: 2rem;
  position: relative;
  width: 100%;
}
.ibeOffer__shortInfo {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.ibeOffer__shortInfo--data {
  padding: 0 2rem 2rem 0;
}
.ibeOffer__shortInfo--data > span {
  color: var(--secondary);
  font-size: 1.6rem;
}
@media (min-width: 576px) {
  .ibeOffer__shortInfo--data > span {
    font-size: 2rem;
  }
}
.ibeOffer__shortInfo--sub {
  color: var(--grey--dark);
  font-size: 1.4rem;
}
@media (min-width: 576px) {
  .ibeOffer__shortInfo--sub {
    font-size: 1.6rem;
  }
}
.ibeOffer__shortInfo--operator {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  justify-content: flex-end;
  margin-bottom: 2rem;
  max-width: 15rem;
  width: 100%;
}
.ibeOffer__shortInfo--operator img {
  height: auto;
  width: auto;
}
.ibeOffer__details {
  border-right: 0.1rem solid var(--grey--lite);
  border-top: 0.1rem solid var(--grey--lite);
  display: grid;
}
@media (min-width: 768px) {
  .ibeOffer__details {
    grid-template-columns: repeat(auto-fit, minmax(34rem, 1fr));
  }
}
@media (min-width: 1024px) {
  .ibeOffer__details {
    grid-template-columns: repeat(auto-fit, minmax(47rem, 1fr));
  }
}
@media (min-width: 1200px) {
  .ibeOffer__details {
    grid-template-columns: repeat(auto-fit, minmax(34rem, 1fr));
  }
}
.ibeOffer__details > div {
  border-bottom: 0.1rem solid var(--grey--lite);
  border-left: 0.1rem solid var(--grey--lite);
  font-size: 1.4rem;
}
@media (min-width: 576px) {
  .ibeOffer__details > div {
    font-size: 1.6rem;
  }
}
.ibeOffer__outbound, .ibeOffer__inbound {
  display: flex;
  flex-direction: column;
  padding: 2rem;
}
.ibeOffer__outbound.isChecked > div, .ibeOffer__inbound.isChecked > div {
  margin-bottom: 1rem;
}
.ibeOffer__outbound--head, .ibeOffer__inbound--head {
  align-items: center;
  display: flex;
  margin-bottom: 1rem;
  width: 100%;
}
.ibeOffer__outbound--head i, .ibeOffer__inbound--head i {
  font-size: 1.4rem;
  margin-right: 1rem;
}
.ibeOffer__outbound--head span:first-of-type, .ibeOffer__inbound--head span:first-of-type {
  flex-shrink: 0;
  font-weight: bold;
}
.ibeOffer__outbound--container, .ibeOffer__inbound--container {
  display: flex;
}
.ibeOffer__outbound--time, .ibeOffer__inbound--time {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.ibeOffer__outbound--time span, .ibeOffer__inbound--time span {
  color: var(--secondary);
  font-weight: bold;
}
.ibeOffer__outbound--connector, .ibeOffer__inbound--connector {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin: 0 1rem;
  padding: 0.6rem 0;
}
.ibeOffer__outbound--dot, .ibeOffer__inbound--dot {
  background: var(--secondary);
  border-radius: 50%;
  height: 1rem;
  width: 1rem;
}
.ibeOffer__outbound--line, .ibeOffer__inbound--line {
  background: var(--secondary);
  flex-grow: 1;
  width: 0.2rem;
}
.ibeOffer__outbound--airports, .ibeOffer__inbound--airports {
  display: flex;
  flex-direction: column;
}
.ibeOffer__outbound--airport, .ibeOffer__inbound--airport {
  font-size: 1.4rem;
}
@media (min-width: 576px) {
  .ibeOffer__outbound--airport, .ibeOffer__inbound--airport {
    font-size: 1.6rem;
  }
}
.ibeOffer__outbound--duration, .ibeOffer__inbound--duration {
  font-size: 1.4rem;
}
.ibeOffer__outbound--type, .ibeOffer__inbound--type {
  font-size: 1.1rem;
}
@media (min-width: 576px) {
  .ibeOffer__outbound--type, .ibeOffer__inbound--type {
    font-size: 1.6rem;
  }
}
.ibeOffer__attributes {
  padding: 2rem;
}
.ibeOffer__attributes__item {
  display: flex;
  margin-bottom: 0.5rem;
}
.ibeOffer__attributes__item i {
  flex-shrink: 0;
  margin-right: 0.5rem;
  padding-top: 0.3rem;
  width: 2rem;
}
.ibeOffer__price {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2rem;
}
@media (min-width: 1200px) {
  .ibeOffer__price {
    grid-column: 1/span 4;
  }
}
@media (min-width: 1366px) {
  .ibeOffer__price {
    grid-column: auto;
  }
}
@media (min-width: 1511px) {
  .ibeOffer__price {
    grid-column: 1/span 3;
  }
}
@media (min-width: 1861px) {
  .ibeOffer__price {
    grid-column: auto;
  }
}
.ibeOffer__price .price {
  cursor: pointer;
  margin-bottom: 1rem;
}
.ibeOffer__price .price .priceLabel {
  margin-right: 0.5rem;
}
.ibeOffer__price .price .priceTotal {
  margin-right: 0.5rem;
}
.ibeOffer__price .price .priceTotal,
.ibeOffer__price .price .pricePerPerson {
  color: var(--secondary);
  font-size: 1.8rem;
  font-weight: bold;
}
.ibeOffer__price .checkOffer.active .button {
  background: var(--secondary);
}
.ibeOffer__price .checkOffer .button {
  background: var(--grey--lite);
  width: 22rem;
}
.ibeOffer__infos {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-size: 1.4rem;
  padding: 2rem 2rem 0 2rem;
}
@media (min-width: 576px) {
  .ibeOffer__infos {
    font-size: 1.6rem;
  }
}
.ibeOffer__infos i {
  color: var(--primary);
  font-size: 0.8rem;
  font-weight: bold;
  margin-left: 1rem;
}
.ibeOffer__iframe {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  position: relative;
  transition: all 0.1s ease-in-out;
  width: 100%;
}
.ibeOffer__iframe.expanded {
  background: var(--white);
  max-height: 1000rem;
  opacity: 1;
  transition: all 0.1s ease-in-out;
}
.ibeOffer__iframe iframe {
  border: 0;
  height: 40rem;
  margin: 1.5rem;
  width: 100%;
}
.ibeOffer__unavailable {
  text-align: center;
}

#loadMoreOffers {
  cursor: pointer;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 5rem;
}
#loadMoreOffers hr {
  width: 100%;
}
#loadMoreOffers button {
  margin-top: 1rem;
  padding: 0 2rem;
}

.magicbutton {
  background: #fff;
  border: 0.1rem solid #d7d7d7;
  border-radius: 50%;
  bottom: 13rem;
  box-shadow: 0 0.2rem 1rem 0.1rem #d2d2d2;
  cursor: pointer;
  font-family: Helvetica, Arial, sans-serif;
  height: 5rem;
  left: 1rem;
  overflow: hidden;
  position: fixed;
  width: 5rem;
  z-index: 9999;
}
.magicbutton button {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%;
  font-size: 6.5rem;
}
/*# sourceMappingURL=hotel.css.map */