:root {
  --row-padding-vertical: 50px;
}

p {
  line-height: normal;
}

button {
  cursor: pointer;
}

p a {
  font-weight: bold;
}

.hidden {
  display: none;
}

.headline > div,
.item > div {
  display: inline-block;
  width: 49%;
  border-bottom: 1px solid grey;
}

.price:before {
  content: "ab";
}

.price:after {
  content: "€";
}

.resultwrapper {
  background-color: #E7E1DF;
  border-radius: 18px;
  padding: 74px 79px;
}

.resultwrapper:not(:has(.results .item:not(.hidden))) {
  padding: 0;
}

.resultwrapper:not(:has(.results .item:not(.hidden))) .headline {
  display: none;
}

.resultwrapper .title a:hover {
  color: var(--pink-2);
  font-weight: bold;
  text-decoration: none;
}

.results .item.hidden {
  display: none;
}

.results .item {
  display: flex;
  flex-wrap: wrap;
  padding: 14px 0;
}

.headline > div,
.item > div {
  border-bottom: none;
}

.priceguide-render {
  button:not(.invisible-button) {
    padding: 29px;
    height: fit-content;
    background-color: var(--grey-2);
    border: none;
    width: 340px;
    max-width: 100%;
    word-break: break-word;
    color: var(--font);
  }

  button:not(.invisible-button).buttonactive,
  button:not(.invisible-button):hover {
    background-color: var(--pink-2);
    color: var(--white);
  }
}

.filterwrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  --webkit-justify-content: space-between;
  gap: 25px;
}

div.item,
div.titleleft {
  line-height: normal;
}

.page-wrapper div.uncoltable a:hover {
  color: #D7007F;
}

div.uncoltable a,
div.uncoltable p {
  color: black;
}

.item .price {
  color: black;
}

.item > .price {
  display: inline-flex;
  column-gap: 0.5rem;
  justify-content: space-between;
  flex: 1 1 auto;
  max-width: 10rem;
}

.aufenthalt {
  margin-bottom: 100px;
}

.preisrechner-faq {
  color: white;
  background-color: #D7007F;
  border-radius: 18px;
  padding: 2rem 3rem;
  font-size: 32px;
  padding-bottom: 8rem;
}

div.preisrechner-faq p {
  color: white;
  margin-top: 0.5rem;
}

div.preisrechner-faq p strong {
  color: white;
  font-weight: bold;
  font-size: 34px;
  line-height: 42px;
}

.uncoltable p {
  font-size: 32px;
}

p::selection {
  background-color: #D7007F;
}

.headline {
  display: flex;
  align-items: center;
  font-weight: bold;
      padding: 8px 0;
}

div.filterwrapper.aufenthalt,
.resultwrapper,
.yourresults,
.guestgroup,
.allprices {
  visibility: hidden;
  max-height: 0;
  opacity: 0;
  transition: opacity 800ms;
}

.visible {
  visibility: visible;
  max-height: initial;
  opacity: 1;
}

div.filterwrapper.visible {
  visibility: visible;
  max-height: initial;
  opacity: 1;
}

.page-wrapper a:focus {
  outline: solid 1px #D7007F;
  outline-offset: -1px;
}

button:focus {
  outline: solid 2px #D7007F;
  outline-offset: 4px;
}

.buttonactive:focus {
  outline: solid 2px #D7007F;
  outline-offset: 4px;
}

button:hover {
  border: 2px solid #D7007F;
}

div .price {
  font-family: Dosis-Regular, sans-serif;
  padding-left: 3rem;
}

.noHover {
  pointer-events: none;
}

.hiddenbutton {
  visibility: hidden;
  max-height: initial;
}

p.allprices.visible {
  margin-bottom: 84px;
  margin-top: 38px;
}

.filterwrapper.jahr {
  margin-bottom: 90px;
}

.preisrechner-faq.text-accent-color:not(.preisrechner-faq-grey) p,
.preisrechner-faq.text-accent-color:not(.preisrechner-faq-grey) strong,
.preisrechner-faq.text-accent-color:not(.preisrechner-faq-grey) a {
  &::selection {
    background-color: white !important;
    color: #D7007F !important;
  }
}

.preisrechner-content.open p {
  margin: 0;
  margin-bottom: 1rem;
}

.preisrechner-header {
  font-weight: bold;
  cursor: pointer;

  & i {
    padding: 0 var(--faq-accordion-pad-left--alignment);
  }

  background: transparent;
}

button.preisrechner-header:hover {
  border: var(--border-width) solid white;
}

.preisrechner-faq-grey button.preisrechner-header {
  & i {
    filter: invert(1);
  }
}

.preisrechner-faq-grey button.preisrechner-header:hover {
  border: var(--border-width) solid black;
}

.preisrechner-faq:not(.preisrechner-faq-grey) .preisrechner-header:focus-visible,
.preisrechner-faq:not(.preisrechner-faq-grey) .preisrechner-header:focus {
  outline: var(--border-width) solid black;
  outline-offset: calc(2 * var(--border-width));
}

.preisrechner-faq:not(.preisrechner-faq-grey) > p:first-child {
  margin-bottom: 2rem;
}

button.preisrechner-header {
  border: var(--border-width) solid transparent;
  display: flex;
  padding: var(--faq-accordion-pad-left--alignment) 0;
  align-items: center;
  justify-content: space-between;
}

.preisrechner-content {
  display: none;
  padding-left: 20px;
  color: #333;
}

.preisrechner-content {
  transition: max-height 0.3s ease-out;
  max-height: 0;
  overflow: hidden;
}

.preisrechner-faq {
  --faq-accordion-pad-left--alignment: 0.5rem;
  --border-width: 2px;
}

.preisrechner-content.open {
  display: block;
  max-height: fit-content;
  padding-left: var(--faq-accordion-pad-left--alignment);
  margin-top: 0.5rem;
}

div .notice-asterisk {
  width: auto;
  color: black;
}

div.item > div.notice-infotext {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5rem;
  flex: 1 1 100%;
}

.row.limit-width.row-parent:has(.allprices.visible) {
  position: relative;
}

.price:has(+ .notice-asterisk) {
  width: auto;
}

.item:has(> .notice-asterisk) {
  flex-wrap: wrap;
}

.preisrechner-content.open p {
  text-align: left;
}

.preisrechner-faq p b,
.preisrechner-faq p strong {
  text-align: left;
}

.jsmove-adjust {
  color: black;
  line-height: 1.2;
  font-size: 18px;
  margin: 18px 0 0 0;
  display: flex;
  column-gap: 0.5rem;
  flex-wrap: wrap;
}

@media (max-width: 1200px){
    button.hiddenbutton{
        display: none !important;
    }
    .filterwrapper{
        justify-content: center;
        --webkit-justify-content: center;
    }
}

@media (max-width: 1056px) {
  .hiddenbutton {
    max-height: 0px;
    height: 0px;
  }

  .filterwrapper.hiddenbutton {
    height: 0px;
  }

  .titleleft,
  .titleright {
    font-size: 20px;
  }

  .item {
    font-size: 20px;
    display: flex;
    flex-wrap: wrap;
  }

  .price {
    align-self: center;
  }

  .resultwrapper {
    padding: 15px;
  }

  .preisrechner-faq {
    padding: 15px;
  }

  .uncoltable p {
    font-size: 24px;
  }

  .aufenthalt {
    margin-bottom: 25px;
  }

  div.item,
  div.titleleft,
  div.title {
    line-height: 36px;
  }

  .filterwrapper {
    justify-content: space-around;
  }
}

@media (max-width: 730px) {
  .filterwrapper {
    justify-content: center;
  }

  .row div[class*=col-lg-].align_left > .uncol > .uncoltable > .uncell > .uncont .btn {
    min-width: 0px !important;
  }

  html .main-container .row-container .row-parent,
  .row.single-top-padding.single-bottom-padding.single-h-padding.limit-width.row-parent,
  .row.limit-width.row-parent {
    padding: var(--row-padding-vertical) 10px !important;
  }
}

@media (max-width: 375px) {

  .titleleft,
  .titleright {
    font-size: 16px;
  }

  .item {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  div.preisrechner-faq p strong {
    font-size: 18px;
  }
}