/**
* Block Name: hotel_intro
*/

/* layer logik */

section.hotel_intro .colored_content {
  position: relative;
  z-index: 2;
}
section.hotel_intro .backlayer {
  position: absolute;
  top: 0px;
  bottom: 0px;
  background-color: var(--companyColorBG);
}
section.hotel_intro .backlayer.bg_md {
  display: none;
}

section.hotel_intro .backlayer.bg_sm {
  left: 50%;
  width: 100vw;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: -1;
}
@media (min-width: 768px) {
  section.hotel_intro .backlayer.bg_md {
    display: block;
    width: calc(50% + 60px);
  }
  section.hotel_intro .backlayer.bg_sm {
    display: none;
  }
}
@media (min-width: 992px) {
  section.hotel_intro .backlayer.bg_md {
    width: calc(50% + 80px);
  }
}
@media (min-width: 1200px) {
  section.hotel_intro .backlayer.bg_md {
    width: calc(50% + 95px);
  }
}
@media (min-width: 1460px) {
  section.hotel_intro .backlayer.bg_md {
    width: calc(50% + 116.6666px);
  }
}
@media (min-width: 1660px) {
  section.hotel_intro .backlayer.bg_md {
    width: calc(50% + 133.3333px);
  }
}

/* typo */

section.hotel_intro h2 {
  border-bottom: 0px;
}

/* Card */
section.hotel_intro .teaser_card {
  background-color: #fff;
  max-width: 800px;
  padding: 30px;
  border-radius: 6px;
  -webkit-box-shadow: 0px 12px 50px rgba(0, 0, 0, 0.04);
  box-shadow: 0px 12px 50px rgba(0, 0, 0, 0.04);
  -webkit-transition: 0.7s cubic-bezier(0.2, 0.3, 0.2, 1);
  -o-transition: 0.7s cubic-bezier(0.2, 0.3, 0.2, 1);
  transition: 0.7s cubic-bezier(0.2, 0.3, 0.2, 1);
}
section.hotel_intro .teaser_card:hover,
section.hotel_intro .teaser_card:active,
section.hotel_intro .teaser_card:focus {
  -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.04), 0px 12px 50px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.04), 0px 12px 50px rgba(0, 0, 0, 0.05) !important;
  -webkit-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  transform: translateY(-10px);
}

section.hotel_intro .teaser_card.wichtig {
  border: 1px solid var(--importantAction);
  position: relative;
}
section.hotel_intro .teaser_card.wichtig:after {
  content: "";
  position: absolute;
  width: 100px;
  height: 100px;
  top: -1px;
  right: -0px;
  background-image: url("data:image/svg+xml,%3Csvg width='23' height='28' viewBox='0 0 23 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.7329 21.9235L13.5 21.8009L13.2671 21.9235L4.5 26.5378V4.36597C4.5 3.27847 4.22669 2.42961 3.79103 1.77612C3.54339 1.40466 3.24977 1.10595 2.93926 0.865967H19C20.933 0.865967 22.5 2.43297 22.5 4.36597V26.5378L13.7329 21.9235Z' fill='%23FF0000' stroke='%23FF0000'/%3E%3Cpath d='M14.9949 6.68597L14.4999 14.021H13.0599L12.5799 6.68597H14.9949ZM14.9649 16.241C14.9649 16.561 14.8449 16.836 14.6049 17.066C14.3749 17.296 14.0999 17.411 13.7799 17.411C13.4599 17.411 13.1849 17.296 12.9549 17.066C12.7249 16.836 12.6099 16.561 12.6099 16.241C12.6099 15.921 12.7249 15.646 12.9549 15.416C13.1849 15.176 13.4599 15.056 13.7799 15.056C14.0999 15.056 14.3749 15.176 14.6049 15.416C14.8449 15.646 14.9649 15.921 14.9649 16.241Z' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: top right;
}

/* Visual */

section.hotel_intro .visual {
  height: 250px;
  width: 100%;
  margin-bottom: 22px;
}

/* Details */

section.hotel_intro ul.details {
  list-style: none;
  padding-left: 30px;
}

section.hotel_intro ul.details li {
  margin-bottom: 22px;
  position: relative;
}

section.hotel_intro ul.details li:after {
  content: "";
  position: absolute;
  left: -30px;
  top: 0px;
  height: 19px;
  width: 19px;
  background-image: url("data:image/svg+xml,%3Csvg height='556pt' viewBox='-66 -17 556 556.00088' width='556pt' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m356.996094 61.332031c-39.199219-39.269531-92.40625-61.332031-147.890625-61.332031-55.488281 0-108.691407 22.0625-147.894531 61.332031-37.796876 38.003907-60.558594 88.410157-64.078126 141.894531-1.816406 29.296876 2.480469 58.644532 12.613282 86.1875 9.996094 27.359376 26.234375 53.214844 48.339844 76.699219l141.902343 151.140625c2.359375 2.527344 5.65625 3.972656 9.117188 3.996094 3.46875.035156 6.792969-1.417969 9.121093-3.996094l141.894532-151.140625c22.105468-23.484375 38.34375-49.339843 48.339844-76.699219 10.257812-27.507812 14.558593-56.886718 12.617187-86.1875-3.546875-53.476562-26.304687-103.875-64.082031-141.894531zm27.855468 219.464844c-8.867187 24.230469-23.355468 47.21875-43.09375 68.199219l-132.652343 141.402344-132.78125-141.402344c-19.734375-20.980469-34.222657-43.96875-43.09375-68.199219-9.011719-24.25-12.796875-50.128906-11.113281-75.945313 3.089843-47.460937 23.277343-92.195312 56.832031-125.910156 34.503906-34.542968 81.328125-53.960937 130.15625-53.960937s95.648437 19.417969 130.15625 53.960937c33.550781 33.714844 53.746093 78.449219 56.832031 125.910156 1.585938 25.820313-2.242188 51.691407-11.242188 75.945313zm0 0'/%3E%3Cpath d='m209.105469 101.929688c-53.710938 0-97.429688 44.710937-97.429688 99.671874 0 54.960938 43.71875 99.679688 97.429688 99.679688 53.710937 0 97.429687-44.71875 97.429687-99.679688 0-54.960937-43.71875-99.671874-97.429687-99.671874zm0 174.371093c-39.972657 0-72.449219-33.476562-72.449219-74.699219 0-41.21875 32.476562-74.691406 72.449219-74.691406 39.972656 0 72.449219 33.472656 72.449219 74.691406 0 41.222657-32.476563 74.699219-72.449219 74.699219zm0 0'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain;
}
