.list-searcher{
  position: relative;
}
.acco-nav ul{
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: .5em;
}
.acco-nav-link{
  display: flex;
  align-items: center;
  padding: 0.5em 1em;
  background-color: var(--blue);
  color: #ffffff;
  font-weight: 700;
  min-width: 10rem;
  justify-content: center;
  text-align: center;
}
.acco-nav-link:not(.acco-nav-link--active):hover{
  background-color: var(--lightblue);
}
.acco-nav-link--active{
  background-color: var(--orange);
  cursor: default;
}
.acco-nav-link .acco-icon{
  margin-right: .5em;
  margin-left: -15px;
  color: #ffffff;
}
.levels{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  grid-gap: 1em;
}
.highlight--level .highlight__button-container{
  display: flex;
  font-size: .9em;
}
.highlight--level .highlight__button-container .button{
  flex: 1;
}
.highlight--level .highlight__button-container .button:first-child{
  border-radius: 5px 0 0 5px;
}
.highlight--level .highlight__button-container .button:last-child{
  border-radius: 0 5px 5px 0;
}

.highlight__acco-periods {
    display: flex;
    align-items: center;
    grid-gap: 1em;
    color: var(--blue);
}
.highlight__acco-periods-divider {
    display: flex;
}
.highlight__acco-pricing-total{
  display: flex;
  grid-gap: .5em;
  color: var(--forestgreen);
  font-size: 1.5em;
  font-weight: 800;
}
.highlight a:not(.button){
  text-decoration: none;
  color: inherit;
}
.highlight__acco-info{
  background-color: var(--lightsand);
  color: var(--black);
  padding: .5em 1em;
}
.list-searcher{
  margin-bottom: 1em;
}
.content-container--list{
  margin-top: calc(0em - var(--article-spacing));
}
.ha-level-alternative{
  order: 99 !important;
}
.ha-level-hidden{
  order: 999 !important;
}
.levels--has-booking-arrival .ha-level-hidden{
  filter: grayscale(100%);
  opacity: .9;
}
.highlight__availability-container{
  display: none;
}
.ha-level-hidden .button.booking-widget-extend-link{
  width: 100%;
}
.ha-level-hidden .button.booking-widget-extend-book-link{
  display: none;
}
.ha-level-hidden .highlight__acco-periods,
.ha-level-hidden .highlight__acco-pricing,
.highlight__acco-placeholder,
.highlight__acco-no-avail{
  display:none;
}
.levels.levels--has-booking-arrival .ha-level-hidden .highlight__acco-no-avail,
.levels:not(.levels--has-booking-arrival) .ha-level-hidden .highlight__acco-placeholder{
  display: block;
}
.highlight__alternative-label{
 display: flex;
 background: var(--orange);
 color: #ffffff;
 position: absolute;
 top: 0;
 left: 0;
 padding: .25em .5em;
 z-index: 2;
 border-radius: 5px 0 0 0;
}
.acco-item:not(.ha-level-alternative) .highlight__alternative-label{
  display: none;
}

.ha-level-alternative .highlight__acco-periods-departure,
.ha-level-alternative .highlight__acco-periods-arrival {
    border-bottom: 2px dotted var(--orange);
}
.highlight--level-discount.highlight .layout-article__title a::after{
  display: none;
  pointer-events: none;
}
.highlight--level-discount.highlight:hover .highlight__media-img{
  transform: scale(1);
}
.highlight--level-discount.highlight .highlight__media a:hover .highlight__media-img{
  transform: scale(1.1);
}

/*DISCOUNT*/
.title-offers{
  display: grid;
  margin-bottom: .5em;
  grid-template-columns: repeat(5,1fr);
  background: var(--forestgreen);
  color: #ffffff;
}
.title-offers>div{
  padding: .25em .75em;
}
.title-offers>div{
  border-right: 1px solid #ffffff;
}
.title-price{
  grid-column: span 2;
}

.highlight__acco-pricing {
    display: inline-block;
    position: relative;
    padding: 0.25em 0;
}
.highlight__acco-pricing-original {
    color: var(--forestgreen);
    font-weight: 600;
    opacity: .5;
    position: absolute;
    top: -0.28em;
    right: 0;
    text-decoration: line-through;
}
.highlight--level-discount.highlight.ha-level-hidden{
  display: none;
}
ul.offers{
  list-style: none;
  display: block;
  margin: 0;
  padding: 0;
}
.offer-discount,
.offer-percentage{
  display:none;
}
.offer-price,
.offer-total,
.offer-arrival,
.offer-departure{
  font-size:0;
  padding: .25rem;
}
.offer-price{
  text-decoration: line-through;
  color: var(--forestgreen);
  opacity: 0.5;
}
.offer-total{
  color: var(--forestgreen);
  font-weight: 800;
}
.offer-arrival span,
.offer-departure span{
  font-size:1rem;
}
.offer-price span,
.offer-total span{
  font-size: 1.15rem;
  display:block;
}
ul.offers .offer{
  display: grid;
  padding: 0 0 0 .5em;
  border-radius: 8px;
  grid-template-columns: repeat(5,1fr);
  background: var(--bgblue);
  margin-bottom: .5em;
  align-items: center;
}
.offer-information{
  display: none;
}
.levels--offers{
  grid-template-columns: repeat(2,1fr);
}
.highlight--level-discount:not(.level--has-offer){
  display: none;
}
.offer-price span::before, .offer-total span::before{
 content: "€";
}
.highlight--level-discount .highlight__content{
  flex: 0;
}
.highlight--level-discount .highlight__acco-info{
  flex: 1;
}
@media (max-width: 1439px){
  .highlight--level .highlight__button-container{
    flex-wrap: wrap;
    font-size: 1em;
  }
  .highlight--level .highlight__button-container .button{
    width: 100%;
    flex: 0 0 100%;
  }
  .highlight--level .highlight__button-container .button:first-child{
    border-radius: 5px 5px 0 0;
  }
  .highlight--level .highlight__button-container .button:last-child{
    border-radius:  0 0 5px 5px;
  }
}
@media (max-width: 1299px){
  .levels--offers{
    grid-template-columns: repeat(1,1fr);
  }
}
@media (max-width: 1199px){
  .levels{
    display: grid;
    grid-template-columns: repeat(2,1fr);
  }
  .levels--offers{
    grid-template-columns: repeat(1,1fr);
  }
}
@media (max-width: 799px){
  .levels{
    display: grid;
    grid-template-columns: repeat(1,1fr);
  }
}
@media (max-width: 700px){
  ul.offers .offer{
    grid-template-columns: repeat(4,1fr);
  }
  button.offer-button {
    grid-column: span 4;
  }
  .acco-item__offers-wrapper {
    display: flex;
    flex-direction: column;
  }
  .button--moresoffers{
    margin: 0 auto;
  }
  ul.offers .offer {
    padding: 0 0.5em 0.5em 0.5em;
  }
  .title-price {
    grid-column: span 3;
  }
}
@media (max-width: 480px){
  .title-offers{
    grid-template-columns: repeat(2,1fr);
  }
  .title-price{
    display: none;
  }
  ul.offers .offer{
    grid-template-columns: repeat(2,1fr);
  }
  button.offer-button {
    grid-column: span 2;
  }
  .highlight--level-discount .highlight__acco-info{
    padding: .5em 0;
  }
}