@charset "UTF-8";
/* CSS Document */

/*
Theme Name: LALO Center Heidenheim Custom
Author: Werbeagentur Hüper GmbH – Stefan Wiebel
Author URI: https://www.hueper.de/
Description: A custom template build especially for LALO Center Heidenheim.
Version: 1.5
Text Domain: custom-lalo
Copyright: © 2025 by Stefan Wiebel – Werbeagentur Hüper GmbH
*/


/***** text mark colors *****/
::-moz-selection {
  color: #fff;
  background: var(--dark);
}

::selection {
  color: #fff;
  background: var(--dark);
}




/***** colors *****/
:root {
  /* general */
  --background-grey: #f6f5f4;
  --light-grey: #959595;
  --dark: #1a1a1a;
  --error-red: #ff7369;

  /* lalo specific */
  --lalo-green: #9ac52e;
  --lalo-orange: #f2801f;
  --lalino-blue: #00b6ed;
  --lalino-yellow: #ffbf00;
  --lalino-green: #95c11f;
  --np-blue: #160663
}



/***** fonts *****/
/* lalo und lalino headline font */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cookies';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/cookies.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* night-park headline font */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Night Park';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/chemrea.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* tt commons pro – regular */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'TT Commons Pro';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/tt-commons-pro-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('assets/fonts/tt-commons-pro-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* tt commons pro – medium */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'TT Commons Pro';
  font-style: normal;
  font-weight: 600;
  src: url('assets/fonts/tt-commons-pro-medium.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('assets/fonts/tt-commons-pro-medium.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* tt commons pro – demibold */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'TT Commons Pro';
  font-style: normal;
  font-weight: 700;
  src: url('assets/fonts/tt-commons-pro-demibold.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('assets/fonts/tt-commons-pro-demibold.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}




/***** main elements *****/
html, body {
  margin: 0px;
  padding: 0px;
  font-family: 'TT Commons Pro', sans-serif;
  font-weight: 400;
  height: 100%;
  font-style: normal;
  background-color: var(--background-grey);
  color: var(--dark);
  letter-spacing: 0.03rem;
}

html {
  scroll-behavior: smooth;
}

h1,
.h1,
h2,
.h2, 
h3,
.h3,
h4,
.h4,
h5,
.h5, 
h6,
.h6 {
  letter-spacing: 0.05rem;
  font-weight: 700;
  z-index: 1;
  position: relative;
  /*hyphens: auto;*/
}

h1,
.h1, 
h2,
.h2 {
  font-family: 'Cookies', sans-serif;
  color: var(--lalo-orange);
  font-weight: 400;
}

.lalino h1,
.lalino .h1, 
.lalino h2,
.lalino .h2 {
  color: var(--lalino-blue);
  font-weight: 400;
}

.np h1,
.np .h1,
.np h2,
.np .h2 {
  font-family: 'Night Park', sans-serif;
  color: var(--np-blue);
  font-weight: 400;
}

.impressum h1,
.impressum .h1,
.impressum h2,
.impressum .h2, 
.impressum h3,
.impressum .h3,
.impressum h4,
.impressum .h4,
.impressum h5,
.impressum .h5, 
.impressum h6,
.impressum .h6 {
  hyphens: auto;
}

h3,
.h3,
h4,
.h4,
h5,
.h5, 
h6,
.h6 {
  font-family: 'TT Commons Pro', sans-serif !important;
  color: var(--dark);
}

h1,
.h1 {
  font-size: 3.2rem;
  line-height: 3.6rem;
  padding-bottom: 8px;
}

h2,
.h2 {
  font-size: 2.3rem;
  line-height: 2.7rem;
  padding-bottom: 8px;
}

h3,
.h3 {
  font-size: 1.8rem;
  line-height: 2.2rem;
}

h4,
.h4 {
  font-size: 1.6rem;
  line-height: 2rem;
}

@media (max-width: 576px) {
  h1,
  .h1 {
    font-size: 2.7rem;
    line-height: 3.1rem;
  }
  
  h2,
  .h2 {
    font-size: 2.2rem;
    line-height: 2.6rem;
  }
  
  h3,
  .h3 {
    font-size: 1.9rem;
    line-height: 2.3rem;
  }
  
  h4,
  .h4 {
    font-size: 1.3rem;
    line-height: 1.7rem;
  }
}

.text-white h1,
.text-white .h1,
.text-white h2,
.text-white .h2, 
.headline-white h2,
.headline-white .h2, 
.text-white h3,
.text-white .h3,
.text-white h4,
.text-white .h4,
.text-white h5,
.text-white .h5, 
.text-white h6,
.text-white .h6 {
  color: #fff;
}

a {
  color: var(--dark);
  text-decoration: none;
  transition: 0.25s ease-in-out;
  font-size: 1.3rem;
  line-height: 2rem;
  border-bottom: 1px solid var(--dark);
}

a:hover, 
a:focus {
  color: var(--dark);
  border-bottom: 1px solid var(--dark);
  padding-bottom: 3px;
}

.text-white a {
  color: #fff !important;
  border-bottom: 1px solid transparent !important;
}

.text-white a:hover, 
.text-white a:focus {
  color: #fff !important;
  border-bottom: 1px solid #fff !important;
}

p, 
ul {
  line-height: 2rem;
  font-size: 1.3rem;
  z-index: 1;
  position: relative;
}

.fa-ul {
  margin-left: 32px !important;
}

.small {
  font-size: 1rem;
  line-height: 1.4rem !important;
}

.wp-block-column {
  padding: 0px;
  margin: 0px;
}

b, 
strong,
.fw-bold {
  font-weight: 600 !important;
}

.italic {
  font-style: italic;
}

.hr {
  margin: 0px 0px 110px 0px;
}

@media (max-width: 576px) {
  .hr {
    margin: 0px 0px 60px 0px;
  }
}

.color-icons {
  color: var(--lalo-green);
}

.lalino .color-icons {
  color: var(--lalino-blue);
}

.np .color-icons {
  color: var(--np-blue);
}

.no-hover{
    pointer-events: none;
}




/***** container *****/
/* match outer container with hamburger menu + contact plane */
@media (max-width: 576px) {
  .container {
    padding-left: calc(var(--bs-gutter-x) * .5 + 7px);
    padding-right: calc(var(--bs-gutter-x) * .5 + 7px);
  }
}


/*** small container ***/
.container-small {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

@media (min-width: 576px) {
  .container-small {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 768px) {
  .container-small {
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 992px) {
  .container-small {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1200px) {
  .container-small {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1400px) {
  .container-small {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
  }
}


/*** large container ***/
@media (min-width: 576px) {
  .container-lg {
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 768px) {
  .container-lg {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 992px) {
  .container-lg {
    max-width: 972px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1200px) {
  .container-slgmall {
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1400px) {
  .container-lg {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1800px) {
  .container-lg {
    max-width: 1720px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 2100px) {
  .container-lg {
    max-width: 2020px;
    margin-left: auto;
    margin-right: auto;
  }
}




/***** utilities *****/
.grow {
  transition: 0.3s ease-in-out;
  transform: scale(1.0);
  -webkit-transform: scale(1.0);
}

.grow:hover, 
.grow:focus {
  scale: 1.01;
  transform: scale(1.01);
  -webkit-transform: scale(1.01);
}

.img-rounded {
  border-radius: 35px!important;
}

@media (max-width: 576px) {
  .img-rounded {
    border-radius: 25px!important;
  }
}

.rounded-top {
  border-top-left-radius: 35px !important;
  border-top-right-radius: 35px !important;
}

@media (max-width: 576px) {
  .rounded-top {
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px !important;
  }
}

.rounded-bottom {
  border-bottom-left-radius: 35px !important;
  border-bottom-right-radius: 35px !important;
}

@media (max-width: 576px) {
  .rounded-bottom {
    border-bottom-left-radius: 25px !important;
    border-bottom-right-radius: 25px !important;
  }
}

.rounded-left {
  border-top-left-radius: 35px !important;
  border-bottom-left-radius: 35px !important;
}

@media (max-width: 992px) {
  .rounded-left {
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px !important;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
  }
}

.wp-block-separator {
  border-top: solid 1px var(--dark) !important;
  border-bottom: none !important;
}

.text-lalo-green {
  color: var(--lalo-green);
}

.text-lalino-blue {
  color: var(--lalino-blue);
}

.text-np-blue {
  color: var(--np-blue);
}

.text-dark,
.text-dark a {
  color: var(--dark);
}

.bg-white-blur {
  background: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.bg-dark {
  background-color: var(--dark);
}

.bg-error {
  background-color: var(--error-red);
  border-radius: 15px;
}

.gradient-lalo-green,
.bg {
  background: linear-gradient(151deg,rgba(166, 209, 58, 1) 0%, rgba(136, 175, 38, 1) 100%);
}

.gradient-lalino-blue,
.lalino .bg {
  background: linear-gradient(151deg,rgba(43, 206, 255, 1) 0%, rgba(0, 182, 237, 1) 100%);
}

.gradient-np-blue,
.np .bg {
  background: linear-gradient(151deg,rgba(22, 6, 99, 1) 0%, rgba(60, 47, 124, 1) 100%);
}

.bg-lalo-green {
  background: var(--lalo-green);
  color: #fff;
}

.bg-lalo-orange {
  background: var(--lalo-orange);
  color: #fff;
}

.bg-lalino-blue {
  background: var(--lalino-blue);
  color: #fff;
}

.bg-lalino-yellow {
  background: var(--lalino-yellow);
  color: var(--dark);
}

.bg-np-blue {
  background: var(--np-blue);
  color: #fff;
}

.display-1 {
  font-size: 6.1rem;
  line-height: 6.8rem;
  letter-spacing: 0.02rem;
}

@media (max-width: 768px) {
  .display-1 {
    font-size: 3.5rem;
    line-height: 4.2rem;
  }
}

img {
  z-index: 1;
  position: relative;
}

.wp-block-image img,
.carousel-item img {
  width: 100%;
}


/*** chevron arrows ***/
.chevron {
  font-size: 1.9rem !important;
  padding: 14px 40px 14px 19px !important;
  box-shadow: 0 0.2rem 3rem rgba(0,0,0,.1) ;
  -webkit-box-shadow: 0 0.2rem 3rem rgba(0,0,0,.1);
}

@media (max-width: 768px) {
  .chevron {
    font-size: 1.5rem !important;
    padding: 13px 33px 13px 15px !important;
  }
}

.chevron-hero {
  position: absolute;
  bottom: -27px;
  left: 55px;
  z-index: 2;
}

.chevron-menu {
  position: absolute;
  top: 60px;
  left: 50px;
}

.chevron-slider-left {
  position: absolute;
  left: 50px;
  top: 48%;
}

.chevron-slider-right {
  position: absolute;
  right: 50px;
  top: 48%;
}

@media (max-width: 768px) {
  .chevron-slider-left {
    position: absolute;
    left: 15px;
    top: 45%;
  }

  .chevron-slider-right {
    position: absolute;
    right: 15px;
    top: 45%;
  }
}

.container .chevron-slider-left,
.container-small .chevron-slider-left {
  left: -30px;
}

.container .chevron-slider-right,
.container-small .chevron-slider-right {
  right: -30px;
}

@media (max-width: 768px) {
  .container .chevron-slider-left,
  .container-small .chevron-slider-left {
    left: -12px;
  }

  .container .chevron-slider-right,
  .container-small .chevron-slider-right {
    right: -12px;
  }
}

.chevron-quote-left {
  position: absolute;
  left: -90px;
  top: 20%;
}

.chevron-quote-right {
  position: absolute;
  right: -90px;
  top: 20%;
}

@media (max-width: 768px) {
  .chevron-quote-left {
    position: absolute;
    left: 200%;
    top: unset;
    bottom: -80px;
  }

  .chevron-quote-right {
    position: absolute;
    right: 200%;
    top: unset;
    bottom: -80px;
  }
}

.chevron-buchung {
  position: absolute;
  bottom: -30px;
  left: 50px;
  z-index: 2;
}

@media (max-width: 576px) {
  .chevron-buchung {
    bottom: -15px;
  }
}


/*** b blocks carousel ***/
.swiper-button-next,
.swiper-button-prev {
  font-size: 1.9rem !important;
  background-color: #fff !important;
  color: var(--dark) !important;
  border: solid 1px #fff !important;
  border-radius: 15px !important;
  font-weight: 400 !important;
  transition: 0.2s ease-in-out !important;
  top: 49%;
}

.swiper-button-next:hover,
.swiper-button-next:focus,
.swiper-button-prev:hover,
.swiper-button-prev:focus {
  background-color: var(--dark) !important;
  color: #fff !important;
  text-decoration: none !important;
  border: solid 1px var(--dark) !important;
  cursor: pointer !important;
}

.swiper-button-next {
  padding: 29px 26px 27px 29px !important;
  right: 3px;
}

.swiper-button-prev {
  padding: 29px 29px 27px 26px !important;
  left: 3px;
}

@media (max-width: 768px) {
  .swiper-button-next,
  .swiper-button-prev {
    font-size: 1.5rem !important;
    top: 51%;
  }

  .swiper-button-next {
    padding: 15px 21px 15px 23px !important;
    right: 6px;
  }

  .swiper-button-prev {
    padding: 15px 23px 15px 21px !important;
    left: 6px;
  }
}

.wp-block-bicb-carousel .bicbCarousel .swiper-button-next::after, 
.wp-block-bicb-carousel .bicbCarousel .swiper-button-prev::after {
	font-weight: 400 !important;
}

.swiper-slide img {
  border-radius: 35px !important;
}

.bicbCarousel {
	padding: 30px 30px !important;
}




/***** navigation *****/
#main,
#menu-main-menu-right {
  transition: 0.35s ease-in-out;
}

nav li {
  display: inline;
  list-style-type: none;
  padding: 5px;
}

@media (max-width: 992px) {
  nav li {
    padding: 10px;
  }
}

@media (max-width: 768px) {
  nav li {
    padding: 3px;
    line-height: 1.5rem;
  }
}

nav ul {
  font-size: 1.2rem;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  letter-spacing: 0.05rem;
  transition: 0.5s ease-in-out;
  position: absolute;
  top: 40px;
  left: 30px;
}

@media (max-width: 576px) {
  nav ul {
    top: 30px;
    left: 20px;
  }
}

li a {
  text-decoration: none;
}

li a:hover, 
li a:focus {
  text-decoration: none;
}

#menu-main-menu-de a {
  font-size: 1.4rem;
  letter-spacing: 0.15rem;
}

@media (max-width: 992px) {
  #menu-main-menu-de a {
    font-size: 1.4rem;
  }
}

@media (max-width: 768px) {
  #menu-main-menu-de a {
    font-size: 1.2rem;
    line-height: 1.5rem;
  }
}

.current-menu-item a {
  box-shadow: 0 0.2rem 2rem rgba(0,0,0,.3);
  -webkit-box-shadow: 0 0.2rem 2rem rgba(0,0,0,.3);
  text-decoration: none;
}

.navbar {
  display: block !important;
  padding: 8px 0px;
}

/* small menu */
.navbar-collapse {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
}

/* open button */
.navbar-open {
  font-size: 2.15rem;
  color: #fff;
  transition: 0.3s ease-in-out;
  transform-origin: center center;
  background: var(--dark);
  padding: 1px 6px 2px 6px;
  border: 1px solid var(--dark);
  right: 40px;
  top: 30px;
  position: absolute;
  border-radius: 15px;
}

@media (max-width: 768px) {
  .navbar-open {
    right: 15px;
    top: 15px;
  }
}

.navbar-open:hover, 
.navbar-open:focus {
  color: var(--dark);
  background-color: #fff;
  border: 1px solid var(--dark);
  cursor: pointer;
  -webkit-transform: scale(.92);
  transform: scale(.92);
}

/* close button */
.navbar-close i {
  font-size: 2.15rem;
  position: absolute;
  right: 40px;
  top: 30px;
  color: var(--dark);
  float: right;
  transition: 0.2s ease-in-out;
  z-index: 1;
  background-color: #fff;
  border-radius: 15px;
  padding: 12px 42px 12px 16px;
}

@media (max-width: 768px) {
  .navbar-close i {
    right: 21px;
    top: 20px;
    font-size: 1.7rem;
    padding: 12px 36px 12px 16px;
  }
}

.navbar-close i:hover, 
.navbar-close i:focus {
  cursor: pointer;
  transform: rotate(90deg);
  transform-origin: center;
  background-color: var(--dark);
  color: #fff;
}

.navigation li {
  list-style-type: none !important;
}

.menu-icons a {
  position: unset;
}

.menu-icons a i {
  font-size: 1.6rem;
  position: absolute;
  color: #AFB992;
  left: 50%;
  transform: translateY(-50%);
  bottom: 35px;
  transition: 0.2s ease-in-out;
}

.menu-icons a i:hover,
.menu-icons a i:focus {
  color: #fff;
}


/*** menu background images ***/
.menu-bg {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  width: 100%;
  transition: 0.4s ease-in-out;
}

.menu-bg:hover,
.menu-bg:focus {
  transform: scale(1.025);
}

@media (max-width: 768px) {
  .menu-bg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 33.33333vh;
    width: 100%;
  }
}

.menu-bg-lalo {
  background-image: url('assets/images/menu-bg-lalo.jpg');
}

.menu-bg-lalino {
  background-image: url('assets/images/menu-bg-lalino.jpg');
}

.menu-bg-np {
  background-image: url('assets/images/menu-bg-night-park.jpg');
}

@media (max-width: 768px) {
  .menu-bg-lalo {
    background-image: url('assets/images/menu-bg-small-lalo.jpg');
  }

  .menu-bg-lalino {
    background-image: url('assets/images/menu-bg-small-lalino.jpg');
  }

  .menu-bg-np {
    background-image: url('assets/images/menu-bg-small-night-park.jpg');
  }
}


/*** menu buttons ***/
.btn-menu {
  color: #fff;
  border: solid 2px #fff;
  text-decoration: none;
  font-size: 1.2rem;
  border-radius: 20px;
  font-weight: 600;
  padding: 17px 0px 18px;
  transition: 0.2s ease-in-out;
  width: 350px;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.075) ;
  -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.075);
}

@media (max-width: 1400px) {
  .btn-menu {
    width: 250px;
  }
}

.btn-menu:hover, 
.btn-menu:focus {
  background-color: #fff;
  border: solid 2px #fff;
  text-decoration: none;
  cursor: pointer;
}

.btn-menu-lalo {
  background-color: var(--lalo-green);
}

.btn-menu-lalo:hover, 
.btn-menu-lalo:focus {
  color: var(--lalo-green);
}

.btn-menu-lalino {
  background-color: var(--lalino-blue);
}

.btn-menu-lalino:hover, 
.btn-menu-lalino:focus {
  color: var(--lalino-blue);
}

.btn-menu-np {
  background-color: var(--np-blue);
}

.btn-menu-np:hover, 
.btn-menu-np:focus {
  color: var(--np-blue);
}


/*** jetzt buchen ***/
.jetzt-buchen {
  right: 110px;
  top: 30px;
  position: fixed;
  box-shadow: 0 0.2rem 3rem rgba(0,0,0,.1) ;
  -webkit-box-shadow: 0 0.2rem 3rem rgba(0,0,0,.1);
}

@media (max-width: 768px) {
  .jetzt-buchen {
    right: 85px;
    top: 15px;
  }
}

.bg-buchung {
  height: 350px;
}

@media (max-width: 1600px) {
  .bg-buchung {
    height: 340px;
  }
}

@media (max-width: 1400px) {
  .bg-buchung {
    height: 300px;
  }
}

@media (max-width: 1200px) {
  .bg-buchung {
    height: 240px;
  }
}

@media (max-width: 992px) {
  .bg-buchung {
    height: 170px;
  }
}

@media (max-width: 768px) {
  .bg-buchung {
    height: 290px;
  }
}

@media (max-width: 576px) {
  .bg-buchung {
    height: 120px;
  }

  .bg-buchung img {
    height: 120px;
  }
}




/***** video hero *****/
.video-hero {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
}

.video-wrapper {
  width: 100vw;
  height: 100vh;
  position: relative;
  overflow: hidden;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}




/***** hero *****/
/*** home page hero ***/
.hero-background {
  background-image: url('assets/images/lalo-strahlen-header.jpg');
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.palm-left,
.palm-right {
  position: absolute;
  bottom: 0px;
  z-index: 2;
}

.palm-left {
  left: -150px;
  width: auto;
  height: 780px;
}

.palm-right {
  right: -170px;
  width: auto;
  height: 780px;
}

@media (max-width: 2000px) {
  .palm-left {
    left: -250px;
  }

  .palm-right {
    right: -270px;
  }
}

@media (max-width: 1800px) {
  .palm-left {
    height: 750px;
    left: -230px;
  }

  .palm-right {
    height: 750px;
    right: -250px;
  }
}

@media (max-width: 1600px) {
  .palm-left {
    height: 500px;
    left: -230px;
  }

  .palm-right {
    height: 500px;
    right: -250px;
  }
}

@media (max-width: 1450px) {
  .palm-left,
  .palm-right {
    z-index: 0;
  }

  .palm-left {
    height: 700px;
    left: -150px;
  }

  .palm-right {
    height: 700px;
    right: -170px;
  }
}

@media (max-width: 1200px) {
  .palm-left {
    height: 500px;
    left: -150px;
  }

  .palm-right {
    height: 500px;
    right: -170px;
  }
}

@media (max-width: 768px) {
  .palm-left {
    height: 600px;
    left: -170px;
  }

  .palm-right {
    height: 600px;
    right: -190px;
  }
}

.hero-video-container {
  position: relative;
  max-width: 100%;
  margin-top: 50px;
  margin-bottom: -90px;
}

@media (max-width: 768px) {
  .hero-video-container {
    margin-bottom: 0px;
    margin-top: 40px;
  }

  .last-video {
    margin-bottom: -70px;
  }
}

.hero-video-container:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg,rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
  border-radius: 35px;
}

@media (max-width: 768px) {
  .hero-video-container:before {
    border-radius: 25px;
  }
}

.hero-logo {
  position: absolute;
  bottom: 100px;
  left: 50%;
  transform: translateX(-50%);
  width: 350px;
}

@media (max-width: 768px) {
  .hero-logo {
    bottom: 70px;
    width: 290px;
  }
}

@media (max-width: 576px) {
  .hero-logo {
    bottom: 50px;
    width: 200px;
  }
}

.hero-text {
  position: absolute;
  bottom: 60px;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  line-height: 1.7rem;
}

@media (max-width: 992px) {
  .hero-text {
    bottom: 37px;
  }
}

@media (max-width: 768px) {
  .hero-text {
    bottom: 15px;
  }
}


/*** other heros ***/
.hero {
  width: 100%;
  height: 800px;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: -152px;
}

@media (max-width: 992px) {
  .hero {
    height: 600px;
    margin-top: -152px;
  }
}

.hero-slider {
  height: 650px;
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 992px) {
  .hero-slider {
    height: 450px;
  }
}

.hero-pt {
  padding-top: 180px;
}

.hero-button {
	position: absolute;
	bottom: -27px;
	z-index: 2;
	left: 50%;
	transform: translateX(-50%);
}

/* lalo animation */
.hero-lalo-animation {
  position: absolute;
  z-index: 2;
}

.hero-lalo-animation-jump {
  bottom: -50px;
  left: -138px;
  height: 250px;
}

@media (max-width: 992px) {
  .hero-lalo-animation-jump {
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    height: 150px;
  }
}

.hero-lalo-animation-run {
  bottom: -50px;
  left: -177px;
  height: 250px;
}

@media (max-width: 992px) {
  .hero-lalo-animation-run {
    bottom: -55px;
    left: 50%;
    transform: translateX(-50%);
    height: 150px;
  }
}

.hero-lalo-animation-balloon {
	bottom: -99px;
	right: -194px;
	height: 350px;
}

@media (max-width: 992px) {
  .hero-lalo-animation-balloon {
    bottom: -75px;
    right: unset;
    left: 50%;
    transform: translateX(-50%);
    height: 220px;
  }
}

@media (max-width: 576px) {
  .hero-lalo-animation-balloon {
    bottom: -75px;
    right: unset;
    left: 50%;
    transform: translateX(-50%);
    height: 190px;
  }
}





.hero-small {
  width: 100%;
  height: 600px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero-404 {
  background-image: url('assets/images/404.jpg');
  width: 100%;
  height: 100%;
  background-position: center right;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 992px) {
  .hero-404 {
    background-image: url("assets/images/404-sm.jpg");
  }
}




/***** logo *****/
.logo-lalo {
  position: absolute;
  top: -1px;
  left: 1px;
  width: 250px;
}

@media (max-width: 768px) {
  .logo-lalo {
    top: -1px;
    left: -10px;
    width: 175px;
  }
}

.logo-lalino {
  position: absolute;
  top: 3px;
  left: -30px;
  width: 250px;
}

@media (max-width: 768px) {
  .logo-lalino {
    top: 3px;
    left: -30px;
    width: 200px;
  }
}

.logo-night-park {
  position: absolute;
  top: -4px;
  left: -55px;
  width: 250px;
}

@media (max-width: 768px) {
  .logo-night-park {
    position: absolute;
    top: -5px;
    left: -44px;
    width: 200px;
  }
}




/***** tables *****/
.wp-block-table td, 
.wp-block-table th {
  min-width: 150px;
  padding: 15px 0px 15px 30px;
}

.wp-block-table th {
  background-color: #bfbfbf;
  color: #fff;
}

@media (min-width: 576px) {
  .wp-block-table {
    width: 100% !important;
  }
}

.scrollable {
  overflow: scroll;
}




/***** cards *****/
.card {
  border: none !important;
}

.card-lalino-border {
  border: 2px solid var(--lalino-blue) !important;
  border-radius: 15px;
}

.card-lalo-border {
  border: 2px solid var(--lalo-green) !important;
  border-radius: 15px;
}

.card-np-border {
  border: 2px solid var(--np-blue) !important;
  border-radius: 15px;
}

.dotted-line {
  border-top: 3px dotted var(--lalino-blue);
}

.dotted-line-lalo {
  border-top: 3px dotted var(--lalo-green);
}

.dotted-line-np {
  border-top: 3px dotted var(--np-blue);
}

.dotted-line-dark {
  border-top: 3px dotted var(--dark);
}



/***** jobs *****/
.palm-jobs {
  position: absolute;
  left: 150px;
  z-index: -2;
  height: 900px;
}

@media (max-width: 1920px) {
  .palm-jobs {
    left: 100px;
  }
}

@media (max-width: 1600px) {
  .palm-jobs {
    left: 50px;
  }
}

@media (max-width: 1400px) {
  .palm-jobs {
    left: 10px;
  }
}

@media (max-width: 1200px) {
  .palm-jobs {
    height: 650px;
  }
}

@media (max-width: 992px) {
  .palm-jobs {
    height: 550px;
  }
}

@media (max-width: 768px) {
  .palm-jobs {
    display: none;
  }
}




/***** buttons + links *****/
/* general buttons */
.btn-dark {
  background-color: var(--dark) !important;
  color: #fff !important;
  border: solid 1px var(--dark) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 400 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-dark:hover, 
.btn-dark:focus {
  background-color: transparent !important;
  color: var(--dark) !important;
  text-decoration: none !important;
  border: solid 1px var(--dark) !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.btn-dark-outline {
  background-color: transparent !important;
  color: var(--dark) !important;
  border: solid 1px var(--dark) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 400 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-dark-outline:hover, 
.btn-dark-outline:focus {
  background-color: var(--dark) !important;
  color: #fff !important;
  text-decoration: none !important;
  border: solid 1px var(--dark) !important;
  cursor: pointer !important;
}

.btn-light-grey,
.forminator-button-back,
.forminator-button {
  background-color: var(--light-grey) !important;
  color: #fff !important;
  border: solid 1px var(--light-grey) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 400 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-light-grey:hover, 
.btn-light-grey:focus,
.forminator-back-next:hover,
.forminator-back-next:focus,
.forminator-button:hover,
.forminator-button:focus {
  background-color: transparent !important;
  color: var(--dark) !important;
  text-decoration: none !important;
  border: solid 1px var(--light-grey) !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.btn-white,
#menu-main-menu li a {
  background-color: #fff;
  color: var(--dark);
  border: solid 1px #fff;
  font-size: 1.25rem;
  border-radius: 15px;
  font-weight: 400;
  padding: 12px 37px 13px;
  transition: 0.2s ease-in-out;
}

.btn-white:hover, 
.btn-white:focus,
#menu-main-menu li a:hover,
#menu-main-menu li a:focus {
  background-color: var(--dark);
  color: #fff;
  text-decoration: none;
  border: solid 1px var(--dark);
  padding: 12px 37px 13px;
  cursor: pointer;
}

@media (max-width: 576px) {
  .jetzt-buchen,
  #menu-main-menu li a {
    padding: 12px 21px 13px !important;
  }
}

.btn-white-outline {
  background-color: transparent;
  color: #fff;
  border: solid 1px #fff;
  font-size: 1.25rem;
  border-radius: 15px;
  font-weight: 400;
  padding: 12px 37px 13px;
  transition: 0.2s ease-in-out;
}

.btn-white-outline:hover, 
.btn-white-outline:focus {
  background-color: transparent;
  color: #fff;
  text-decoration: none;
  border: solid 1px #fff;
  padding: 12px 37px 13px;
  cursor: pointer;
}

/* lalo buttons */
.btn-lalo-green,
.lalo .forminator-button-next,
.frm_button_submit, 
.wp-block-button__link, 
.wp-block-button__link:visited, 
.post-password-form input[type=submit],
.btn-general {
  background-color: var(--lalo-green) !important;
  color: #fff !important;
  text-decoration: none !important;
  border: solid 1px var(--lalo-green) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-lalo-green:hover, 
.btn-lalo-green:focus,
.lalo .forminator-button-next:hover,
.lalo .forminator-button-next:focus,
.wp-block-button__link:hover, 
.wp-block-button__link:focus, 
.post-password-form input[type=submit]:hover, 
.post-password-form input[type=submit]:focus,
.btn-general:hover,
.btn-general:focus {
  background-color: transparent !important;
  color: var(--lalo-green) !important;
  text-decoration: none !important;
  border: solid 1px var(--lalo-green) !important;
  padding: 12px 37px 13px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.lalo .hero-button .btn-general:hover, 
.lalo .hero-button .btn-general:focus  {
  background-color: var(--lalo-green) !important;
  color: #fff !important;
  cursor: unset !important;
}

.btn-lalo-orange {
  background-color: var(--lalo-orange);
  color: #fff;
  border: solid 1px var(--lalo-orange);
  font-size: 1.2rem;
  border-radius: 15px;
  font-weight: 600;
  padding: 12px 37px 13px;
  transition: 0.2s ease-in-out;
}

.btn-lalo-orange:hover, 
.btn-lalo-orange:focus {
  background-color: transparent;
  color: var(--lalo-orange);
  text-decoration: none;
  border: solid 1px var(--lalo-orange);
  padding: 12px 37px 13px !important;
  cursor: pointer;
}

/* lalino buttons */
.btn-lalino-blue,
.lalino .forminator-button-next,
.lalino .btn-general {
  background-color: var(--lalino-blue) !important;
  color: #fff !important;
  border: solid 1px var(--lalino-blue) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-lalino-blue:hover, 
.btn-lalino-blue:focus,
.lalino .forminator-button-next:hover,
.lalino .forminator-button-next:focus,
.lalino .btn-general:hover,
.lalino .btn-general:focus {
  background-color: transparent !important;
  color: var(--lalino-blue) !important;
  text-decoration: none !important;
  border: solid 1px var(--lalino-blue) !important;
  padding: 12px 37px 13px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.lalino .hero-button .btn-general:hover, 
.lalino .hero-button .btn-general:focus  {
  background-color: var(--lalino-blue) !important;
  color: #fff !important;
  cursor: unset !important;
}

.btn-lalino-yellow {
  background-color: var(--lalino-yellow);
  color: var(--dark);
  border: solid 1px var(--lalino-yellow);
  font-size: 1.2rem;
  border-radius: 15px;
  font-weight: 600;
  padding: 12px 37px 13px;
  transition: 0.2s ease-in-out;
}

.btn-lalino-yellow:hover, 
.btn-lalino-yellow:focus {
  background-color: #fff;
  color: var(--dark);
  text-decoration: none;
  border: solid 1px #fff;
  padding: 12px 37px 13px;
  cursor: pointer;
  box-shadow: none;
}

/* night park buttons */
.btn-np-blue,
.np .btn-general,
.np .forminator-button-next {
  background-color: var(--np-blue) !important;
  color: #fff !important;
  border: solid 1px var(--np-blue) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.btn-np-blue:hover, 
.btn-np-blue:focus,
.np .btn-general:hover,
.np .btn-general:focus,
.np .forminator-button-next:focus,
.np .forminator-button-next:hover {
  background-color: transparent !important;
  color: var(--np-blue) !important;
  text-decoration: none !important;
  border: solid 1px var(--np-blue) !important;
  padding: 12px 37px 13px !important;
  cursor: pointer !important;
}

.np .hero-button .btn-general:hover, 
.np .hero-button .btn-general:focus  {
  background-color: var(--np-blue) !important;
  color: #fff !important;
  cursor: unset !important;
}

/* Pills */
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
  background-color: var(--np-blue) !important;
  color: #fff !important;
  border: solid 1px var(--np-blue) !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}

.nav-pills .nav-link {
  border: solid 1px transparent !important;
  font-size: 1.2rem !important;
  border-radius: 15px !important;
  font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: 0.2s ease-in-out !important;
}



/***** over-big-image *****/
.leaf-over-big-image {
	position: absolute;
	top: -200px;
	right: -80px;
	height: 400px;
}

@media (max-width: 1200px) {
  .leaf-over-big-image {
    position: absolute;
    top: -150px;
    height: 300px;
  }
}

@media (max-width: 576px) {
  .leaf-over-big-image {
    position: absolute;
    top: -120px;
    height: 250px;
  }
}

.palm-over-big-image {
	position: absolute;
	top: -450px;
	right: -127px;
	height: 700px;
}

@media (max-width: 1500px) {
  .palm-over-big-image {
    position: absolute;
    top: -350px;
    right: -98px;
    height: 500px;
  }
}

@media (max-width: 992px) {
  .palm-over-big-image {
    position: absolute;
    top: -258px;
    right: -79px;
    height: 400px;
  }
}

@media (max-width: 576px) {
  .palm-over-big-image {
    position: absolute;
    top: -169px;
    right: -60px;
    height: 300px;
  }
}
 



/***** modal *****/
.modal {
  background: #ffffffb5;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.modal-close-btn:hover {
  color: #2a2b2e;
  text-decoration: none;
}

.modal-content {
  border: none;
  border-radius: 0px;
  background-color: var(--background-grey) !important;
}

.modal-header {
  border-bottom: none;
}

.modal-footer {
  border-top: none;
}




/***** password protected sites *****/
.password-custom {
  height: 60px;
  padding: 15px 22px;
  border-radius: 15px;
  border: none;
  background-color: #fff;
  margin-top: 6px;
  margin-right: 20px;
  font-size: 1.25rem;
  color: var(--dark);
  box-shadow: 0 1rem 3rem rgba(0,0,0,.075);
  -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.075);
  transition: 0.3s ease-in-out;
}




/***** animations *****/
/* wobble */
.anim-wobble-slow {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    animation: wobble ease-in-out 4.0s infinite alternate;
}

.anim-wobble {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    animation: wobble ease-in-out 1.2s infinite alternate;
}

@keyframes wobble {
    0% {
        transform: rotate(7deg);
    }

    50% {
        transform: rotate(-7deg);
    }

    100% {
        transform: rotate(7deg);
    }
}




/***** slider *****/
.slider-button {
  position: absolute;
  bottom: 50px;
  z-index: 2;
  left: 50%;
  transform: translateX(-50%);
}

.slider-button:hover,
.slider-button:focus,
.lalo .slider-button:hover,
.lalo .slider-button:focus,
.lalino .slider-button:hover,
.lalino .slider-button:focus,
.np .slider-button:hover,
.np .slider-button:focus,
.white-hover:hover,
.white-hover:focus {
  color: var(--dark) !important;
  background: #fff !important;
  border: 1px solid #fff !important;
}

@media (max-width: 768px) {
  .slider-button {
    position: relative;
    bottom: 12px;
    z-index: 2;
    left: 0;
    display: block;
    text-align: center;
    margin-bottom: -12px;
    transform: unset;
  }
}




/***** ropes *****/
.rope {
  margin-bottom: -85px;
  z-index: 2;
}

@media (max-width: 992px) {
  .rope {
    margin-bottom: -46px;
  }
}

@media (max-width: 768px) {
  .rope {
    margin-bottom: -50px;
  }
}




/***** meow gallery *****/
.mwl-img,
.mgl-img-container,
.mgl-icon {
	border-radius: 30px;
}

.mgl-masonry .mgl-item figcaption {
	opacity: 1 !important;
}

.mgl-masonry .mgl-item figcaption p {
  border-bottom-left-radius: 35px;
  border-bottom-right-radius: 35px;
  padding: 25px !important;
  margin: 0px 2px 1px 2px !important;
  font-size: 1.25rem !important;
}

.mwl__topbar__slide-counter {
  font-family: 'TT Commons Pro', sans-serif !important;
}

/* Meow Gallery: nur die ersten zwei Bilder anzeigen (robust für Desktop & Mobile) */
.mgl-gallery.mgl-one-thumb > figure,
.mgl-gallery.mgl-one-thumb .mgl-item {
  display: none !important;
}

/* Die ersten zwei wieder einschalten */
.mgl-gallery.mgl-one-thumb > figure:nth-child(-n+2),
.mgl-gallery.mgl-one-thumb .mgl-item:nth-child(-n+2) {
  display: block !important;
}


/*** youtube video ***/
.video-container {
  position: relative;
  padding-bottom: calc(var(--aspect-ratio, .5625) * 100%);
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}




/***** faq accordion *****/ 
.accordion {
  background-color: unset !important;
  --bs-accordion-bg: unset !important;
}

.accordion-item h2 {
  padding-bottom: 0px;
}

.accordion-item {
  border-radius: 25px !important;
  border: none !important;
}

.accordion-body {
	padding: 2rem 1.5rem 1rem 1.5rem;
}

.accordion-button, 
.accordion-button:focus {
	border-radius: 25px !important;
  box-shadow: none !important;
  font-weight: 200;
  font-size: 1.3rem;
  background-color: #fff;
  padding: 23px 30px 25px 30px;
  color: var(--dark);
  margin-top: 20px;
}

.accordion-button:not(.collapsed),
.accordion-button:focus {
  background-color: #fff;
  color: var(--dark);
}

/* bofy background */
#accordionFaq .accordion-body {
  background-color: var(--background-grey);
}

#accordionFaq .accordion-body p {
  color: var(--dark);
}


/*** arrows ***/
.accordion-header .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239AC52E'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
	/* change color of arrows with 'fill' – the last 6 charcters are hex code */
}

.lalino .accordion-header .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2300B6ED'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
	/* change color of arrows with 'fill' – the last 6 charcters are hex code */
}

.np .accordion-header .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233C2F7C'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
	/* change color of arrows with 'fill' – the last 6 charcters are hex code */
}




/***** news *****/
.blog {
  background-color: #fff;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important;
}

.blog .main-content {
  padding: 20px 25px 25px 25px;
}

.main-content h4 {
  font-size: 1.9rem;
  line-height: 2.3rem;
  text-transform: none;
  letter-spacing: 0.01rem;
  font-weight: 600;
  color: #272727;
}

.badge {
  font-size: 0.8rem;
	border-radius: 100px;
  font-weight: 400;
}




/***** übersicht *****/
.uebersicht-icon {
  font-size: 3.3rem;
}

@media (max-width: 768px) {
  .uebersicht-icon {
    font-size: 2.7rem;
  }
}




/***** footer *****/
/*** lalo footer palm trees ***/
.palm-footer-left, 
.palm-footer-right {
  position: absolute;
}

.palm-footer-left {
	left: -155px;
	bottom: -100px;
	height: 750px;
}

.palm-footer-right {
  right: -155px;
  bottom: -100px;
	height: 750px;
}

@media (max-width: 1600px) {
  .palm-footer-left {
    left: -135px;
    height: 650px;
  }

  .palm-footer-right {
    right: -135px;
    height: 650px;
  }
}

@media (max-width: 1200px) {
  .palm-footer-left {
    left: -125px;
    height: 600px;
  }

  .palm-footer-right {
    right: -125px;
    height: 600px;
  }
}

@media (max-width: 992px) {
  .palm-footer-left {
    left: -103px;
    bottom: -40px;
    height: 500px;
  }

  .palm-footer-right {
    right: -103px;
    bottom: -40px;
    height: 500px;
  }
}

@media (max-width: 768px) {
  .palm-footer-left {
    left: -87px;
    bottom: -35px;
    height: 420px;
  }

  .palm-footer-right {
    right: -87px;
    bottom: -35px;
    height: 420px;
  }
}

@media (max-width: 576px) {
  .palm-footer-left {
    left: -49px;
    bottom: -26px;
    height: 230px;
  }

  .palm-footer-right {
    right: -49px;
    bottom: -26px;
    height: 230px; 
  }
}


/*** lalino footer leafs ***/
.leaf-footer-left, 
.leaf-footer-right {
  position: absolute;
}

.leaf-footer-left {
	left: -75px;
	bottom: -151px;
	height: 450px;
}

.leaf-footer-right {
	right: -66px;
	bottom: -141px;
	height: 450px;
}

@media (max-width: 1200px) {
  .leaf-footer-left {
    left: -63px;
    bottom: -115px;
    height: 350px;
  }

  .leaf-footer-right {
    right: -82px;
    bottom: -115px;
    height: 350px;
  }
}

@media (max-width: 576px) {
  .leaf-footer-left {
    left: -56px;
    bottom: -64px;
    height: 200px;
  }

  .leaf-footer-right {
    right: -57px;
    bottom: -64px;
    height: 200px;
  }
}


/*** backgrounds for opening hours ***/
.opening-bg-lalo {
  background-image: url('assets/images/lalo-footer.jpg');
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 768px) {
  .opening-bg-lalo {
    background-image: url('assets/images/lalo-footer-sm.jpg');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

.opening-bg-lalino {
  background-image: url('assets/images/lalino-footer.jpg');
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 768px) {
  .opening-bg-lalino {
    background-image: url('assets/images/lalino-footer-sm.jpg');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

.opening-bg-np {
  background-image: url('assets/images/night-park-footer.jpg');
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 768px) {
  .opening-bg-np {
    background-image: url('assets/images/night-park-footer-sm.jpg');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

.clock {
	padding: 5px 9px 5px 10px;
	background-color: #fff;
	border-radius: 999px;
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
	margin-top: -37px;
	z-index: 2;
	font-size: 2.5rem;
}

#footer .fa-clock {
  font-size: 2.9rem;
}

#footer {
  padding-bottom: 50px;
  overflow: hidden;
}

.footer-bg-lalo {
  background: var(--lalo-green);
  background: linear-gradient(344deg, rgba(136, 175, 38, 1) 0%, rgba(166, 209, 58, 1) 100%);
}

.footer-bg-lalino {
  background: var(--lalino-blue);
  background: linear-gradient(344deg, rgba(0, 182, 237, 1) 0%, rgba(43, 206, 255, 1) 100%);
}

.footer-bg-np {
  background: var(--np-blue);
  background: linear-gradient(344deg, rgba(22, 6, 99, 1) 0%, rgba(60, 47, 124, 1) 100%);
}

.footer-logo-border {
  border: 2px solid #FFFFFF49;
  border-radius: 35px;
  padding: 25px 30px 24px 30px;
}

.footer-logo-border a:hover,
.footer-logo-border a:focus {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

.footer-logo {
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 350px;
}

@media (max-width: 992px) {
  .footer-logo {
    width: 360px;
  }
}

#footer a, 
.copy-links a {
  transition: 0.2s ease-in-out;
  color: var(--dark);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  text-decoration-color: transparent;
  border-bottom: none;
}

#footer a:hover,
#footer a:focus,
#footer a:active,  
.copy-links a:hover,
.copy-links a:focus,
.copy-links a:active {
  text-decoration: underline;
  text-decoration-color: var(--dark);
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  border-bottom: none;
}

.text-white.copy-links a {
  color: #fff !important;
}

.text-white.copy-links a:hover,
.text-white.copy-links a:focus,
.text-white.copy-links a:active {
  text-decoration-color: #fff !important;
}

.copyright p, 
.copyright a {
  font-size: 1.15rem !important;
  line-height: 1.6rem;
}

.non-underline-link a i,
.non-underline-link a img {
  transition: 0.4s ease-in-out;
  border-bottom: none;
}

.non-underline-link a i:hover,
.non-underline-link a i:focus,
.non-underline-link a img:hover,
.non-underline-link a img:focus {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  border-bottom: none;
}

.non-underline-link a .footer-logo:hover,
.non-underline-link a .footer-logo:focus {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  border-bottom: none;
}

.non-underline-link a {
  border-bottom: none;
}

.non-underline-link a:hover,
.non-underline-link a:focus {
  opacity: 0.8;
  border-bottom: none;
}

/* social links icons */
.social-links-footer a i {
  font-size: 1.9rem;
  padding: 0px 6px;
}

@media (max-width: 768px) {
  .social-links-footer a i {
    font-size: 1.5rem;
    padding: 0px 4px;
  }
}

@media (min-width: 768px) {
  #menu-footer,
  #menu-footer-lalino {
    right: 8px;
    position: relative;
  }
}

#menu-footer li a,
#menu-footer-lalino li a {
  margin: 0px 3px;
}




/***** footer menu *****/
#menu-footer .current-menu-item a,
#menu-footer-lalino .current-menu-item a {
	box-shadow: none;
	-webkit-box-shadow: none;
  text-decoration: underline;
}

#menu-footer,
#menu-footer-lalino {
  display: inline;
  padding-left: 15px;
}

#menu-footer li,
#menu-footer-lalino li {
  display: inline-block;
  list-style-type: none;
}

#menu-footer li:last-child,
#menu-footer-lalino li:last-child {
  margin-right: -10px;
}

@media (max-width: 768px) {
  #menu-footer,
  #menu-footer-lalino {
    text-align: center;
    padding-left: 5px;
  }

  #menu-footer li:last-child,
  #menu-footer-lalino li:last-child {
    margin-right: 0px;
  }
}




/***** forminator formulare allgemein *****/
/* placeholder */
.select2-selection__placeholder,
.forminator-input::placeholder {
  color: var(--light-grey) !important;
}

/* inputs general */
.forminator-input,
.forminator-textarea,
.forminator-select--field,
.forminator-select2,
.select2-selection,
.select2-selection--single {
  width: 100% !important;
  height: 60px !important;
  padding: 15px 22px !important;
  border-radius: 15px !important;
  border: none !important;
  background-color: #fff !important;
  margin-top: 6px !important;
  font-size: 1.25rem !important;
  color: var(--dark) !important;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.075) !important;
  -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.075) !important;
  transition: 0.3s ease-in-out;
}

/* labels */
.forminator-consent__label {
  display: inline-block !important;
}

.forminator-consent__label p {
  padding-left: 8px !important;
}

.forminator-consent__label p,
.forminator-consent__label a,
.forminator-checkbox__label p,
.forminator-checkbox__label a {
  font-family: 'TT Commons Pro', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.25rem !important;
}

/* sternchen */
.forminator-required {
  color: #ff2d1c !important;
}

.forminator-row {
  margin-bottom: 25px !important;
}

.forminator-label,
.forminator-checkbox__label,
.forminator-checkbox-label {
  color: var(--dark) !important;
  font-family: 'TT Commons Pro', sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.25rem !important;
}

.forminator-checkbox input {
  height: 20px !important;
  width: 20px !important;
}

.forminator-checkbox-box {
	color: var(--dark) !important;
  background-color: #fff !important;
  -webkit-box-shadow: 3px 3px 17px -4px rgba(0,0,0,.8) !important;
  box-shadow: 3px 3px 17px -4px rgba(0,0,0,.8) !important;
  border-radius: 5px !important;
}

.forminator-checkbox .forminator-checkbox-box {
	width: 26px !important;
	height: 26px !important;
  flex: inherit !important;
}

.forminator-checkbox-image {
  margin: 0px 10px 0px 0px!important;
  padding: 0px!important;
}

.forminator-checkbox__label {
  line-height: unset !important;
}

.forminator-field .forminator-checkbox .forminator-checkbox-image span {
  width: 80px!important;
  height: 80px!important;
  border-radius: 15px !important;
}

/* error messages */
.forminator-error-message {
  background-color: var(--error-red) !important;
  color: #fff !important;
  width: 100% !important;
  display: inline-block !important;
  padding: 10px 15px !important;
  font-size: 0.8rem !important;
}

.forminator-card-message .forminator-error-message {
  background-color: transparent !important;
  color: var(--dark) !important;
}

/* success messages */
.forminator-response-message.forminator-success {
	background-color: var(--lalo-green) !important;
  border-radius: 25px !important;
  box-shadow: none !important;
}

.forminator-response-message.forminator-success, 
.forminator-response-message.forminator-success p {
    color: #fff !important;
    padding: 14px 18px !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
}


/*** date picker ***/
.forminator-calendar--flat::before {
	background-color: #fff !important;
  border-radius: 25px !important;
}

.ui-datepicker-calendar tbody td a.ui-state-default, 
.ui-datepicker-calendar tbody td.ui-state-disabled span {
	background-color: unset !important;
	color: unset !important;
}

.ui-datepicker-calendar tbody td a.ui-state-default:hover, 
.ui-datepicker-calendar tbody td.ui-state-disabled span:hover {
	color: var(--dark) !important;
  font-weight: 400 !important;
}

/* prev and next buttons calender */
.ui-datepicker-header .ui-datepicker-next {
	right: 0 !important;
}

.ui-datepicker-header .ui-datepicker-prev {
	left: 0 !important;
}

.ui-datepicker-header .ui-corner-all {
	background-color: var(--dark) !important;
	color: #fff !important;
  border: 1px solid var(--dark) !important;
}

.ui-datepicker-header .ui-corner-all:hover,
.ui-datepicker-header .ui-corner-all:focus {
  background-color: var(--background-grey) !important;
	color: var(--dark) !important;
  border: 1px solid var(--dark) !important;
  padding-bottom: unset !important;
}

.ui-datepicker-header .ui-corner-all.ui-datepicker-next::before {
	padding-bottom: 1px;
	padding-left: 2px;
}

.ui-datepicker-header .ui-corner-all.ui-datepicker-prev::before {
	padding-bottom: 1px;
	padding-right: 2px;
}

.ui-datepicker-calendar thead th {
	color: unset !important;
}

.ui-datepicker.forminator-calendar--flat {
	background-color: unset !important;
}

.ui-datepicker .ui-datepicker-calendar tbody tr td a, 
.ui-datepicker .ui-datepicker-calendar tbody tr td span {
	line-height: 35px !important;
}

.forminator-checkbox, 
.forminator-checkbox__label, 
.forminator-checkbox__label p {
	color: unset !important;
  margin-top: -6px !important;
  padding-left: 0px !important;
}

.et-db #et-boc .et_pb_module .forminator-ui.forminator-custom-form[data-design="flat"] .forminator-checkbox .forminator-checkbox-box::before, 
.forminator-ui.forminator-custom-form[data-design="flat"] .forminator-checkbox .forminator-checkbox-box::before {
	color: var(--dark) !important;
}

.forminator-calendar,
.forminator-calendar--flat {
	background: var(--dark) !important;
  -webkit-box-shadow: 3px 12px 26px -3px rgba(0, 0, 0, 0.58) !important;
	box-shadow: 3px 12px 26px -3px rgba(0, 0, 0, 0.58) !important;
	padding: 25px 25px 20px 25px !important;
  border-radius: 25px !important;
}

.forminator-calendar a {
  font-size: unset !important;
}

.ui-datepicker-calendar th span {
  font-weight: 400 !important;
}

.ui-datepicker-other-month,
.ui-datepicker-week-end,
.ui-datepicker-unselectable,
.enabledDate,
.ui-datepicker-calendar th {
	padding: 0px 4px !important;
	text-align: center !important;
}

.ui-datepicker-next {
  right: 30px !important;
  position: absolute !important;
}

.ui-datepicker-calendar tbody td a.ui-state-default:hover, 
.ui-datepicker-calendar tbody td a.ui-state-default.ui-state-hove,
.ui-datepicker-calendar tbody td a.ui-state-default:active, 
.ui-datepicker-calendar tbody td a.ui-state-default.ui-state-active {
	background-color: var(--light-grey) !important;
	color: #fff !important;
	border-radius: 60px !important;
}

.ui-datepicker-year,
.ui-datepicker-month {
  text-align: center !important;
  color: var(--dark) !important;
  font-weight: 600 !important;
}


/*** select ***/
.select2-selection,
.select2-selection--single {
  padding: 15px;
}

.select2-selection__arrow {
  color: var(--dark) !important;
}

.select2-selection__arrow:hover,
.select2-selection__arrow:focus {
  color: var(--dark) !important;
}

.select2-selection__rendered {
  color: var(--dark) !important;
}

.forminator-select,
.select2-selection__rendered {
  font-size: 1.25rem !important;
}

/* dropdowns */
.forminator-select-dropdown-container--open .forminator-dropdown--flat {
	background-color: #fff !important;
  border-radius: 15px !important;
}

.forminator-select-dropdown-container--open .forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option:not(.select2-results__option--selected).select2-results__option--highlighted, 
.forminator-select-dropdown-container--open .forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option:not(.select2-results__option--selected).select2-results__option--highlighted span:not(.forminator-checkbox-box) {
	background-color: var(--background-grey) !important;
	color: var(--dark) !important;
}

/* selected dropdowns */
.forminator-select-dropdown-container--open .select2-results .select2-results__options .select2-results__option.select2-results__option--selected, 
.forminator-select-dropdown-container--open .select2-results .select2-results__options .select2-results__option.select2-results__option--selected span:not(.forminator-checkbox-box) {
	background-color: var(--light-grey) !important;
	color: #fff !important;
}

/* upload */
.forminator-multi-upload {
    background: #ffffff;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .075) !important;
    -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, .075) !important;
    padding: 15px 22px !important;
    border-radius: 15px !important;
    border: 1px dashed #495057!important;
    cursor: pointer;
}

.forminator-multi-upload-message > p,
.forminator-multi-upload-message > p > a {
  font-size: 1.25rem!important;
  text-decoration: none!important;
}

/* phone flag */
.iti__tel-input {
  padding-left: 76px !important;
}

/* progress */
.forminator-step-label {
	font-size: 1rem !important;
	font-weight: 400 !important;
  width: 250px;
}

@media (max-width: 576px) {
  .forminator-step-label {
    text-align: left !important;
    padding-left: 8px !important;
  }
}

.forminator-pagination-steps .forminator-step.forminator-current ~ .forminator-step .forminator-step-label {
	color: var(--light-grey) !important;
}

.forminator-pagination-steps .forminator-step.forminator-current ~ .forminator-step .forminator-step-dot,
.forminator-pagination-steps .forminator-break {
	background-color: var(--light-grey) !important;
}




/***** forminator formular calculations allgemein *****/
.forminator-suffix {
  font-size: 1.25rem !important;
}

.cart {
  flex: 0 0 auto !important;
}

@media (max-width: 576px) {
  .cart {
    margin-top: 50px;
  }
}

.cart .forminator-grouped-fields {
  padding: 35px 25px 20px 25px;
  background-color: #fff;
  border-radius: 35px;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.175);
  -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.175);
}

.calc-field {
  margin-bottom: -25px !important;
}

.calc-field input,
.calc-sum input {
  text-align: right !important;
  background-color: transparent !important;
  font-size: 1.25rem !important;
}

.calc-field .forminator-input,
.calc-sum .forminator-input {
  font-size: 1.25rem !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding-right: 0px !important;
}

.calc-field .forminator-input,
.calc-anzahlung .forminator-input {
  margin-top: -45px !important;
  padding-right: 0px !important;
}

.calc-sum {
  margin-bottom: -25px;
}

.calc-sum input,
.calc-sum .forminator-suffix {
  font-weight: 700 !important;
  font-size: 1.6rem !important;
}

.calc-anzahl {
  margin-bottom: -25px !important;
  max-width: 30px !important;
  margin-right: -7px !important;
}

@media (max-width: 768px) {
  .calc-anzahl {
    max-width: 10% !important;
  }
}

.calc-anzahl input {
  background-color: transparent !important;
  font-size: 1.25rem !important;
}

.calc-anzahl .forminator-input {
  font-size: 1.25rem !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding-right: 0px !important;
  margin-top: -13px !important;
  padding-left: 0px !important;
  width: 50px !important;
}

.forminator-border {
  margin-top: 25px !important;
  margin-bottom: -20px !important;
}

/* no-break – felder nicht umbrechen lassen auf mobile */
@media (max-width: 768px) {
  .cart .forminator-row:has(.no-break) {
    display: flex;
  }

  .no-break {
    flex: auto;
    width: 80%;
  }
}







/***** forminator formular specific *****/
/*** progress lalo ***/
.lalo .forminator-pagination-steps .forminator-step .forminator-step-label {
	color: var(--lalo-green) !important;
}

.lalo .forminator-pagination-steps .forminator-step .forminator-step-dot,
.lalo .forminator-pagination-steps .forminator-break::before {
	background-color: var(--lalo-green) !important;
}


/*** progress lalino ***/
.lalino .forminator-pagination-steps .forminator-step .forminator-step-label {
	color: var(--lalino-blue) !important;
}

.lalino .forminator-pagination-steps .forminator-step .forminator-step-dot,
.lalino .forminator-pagination-steps .forminator-break::before {
	background-color: var(--lalino-blue) !important;
}


/*** progress night park ***/
.np .forminator-pagination-steps .forminator-step .forminator-step-label {
	color: var(--np-blue) !important;
}

.np .forminator-pagination-steps .forminator-step .forminator-step-dot,
.np .forminator-pagination-steps .forminator-break::before {
	background-color: var(--np-blue) !important;
}



/***** hustle pop up *****/
.hustle-group-content h2 {
  color: var(--lalo-orange) !important;
}

@media (max-width: 576px) {
.hustle-group-content h2 {
    font-size: 2.4rem !important;
    line-height: 2.8rem !important;
    padding-top: 35px !important;
  }
}

.hustle-popup-mask {
	background-color: rgba(26,26,26,0.63) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
}

.hustle-ui [class*="hustle-icon-"]::after, .hustle-ui [class*="hustle-icon-"]::before {
	padding-left: 34px !important;
}



/**** matomo *****/
.matomo form {
  font-size: 1.2rem !important;
}




/***** 404 styles *****/
.error {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#error-text:hover,
#error-text:focus {
  color: #112E57;
  text-decoration: none;
}

#error-text .footer-logo {
  padding-top: 50px;
  margin-right: 10px;
}




/***** Musicplayer *****/
/* Range-Thumb (Kreis) – immer schwarz */
input[type="range"].form-range::-webkit-slider-thumb { background-color: #000 !important; }
input[type="range"].form-range::-moz-range-thumb    { background-color: #000 !important; }
input[type="range"].form-range::-ms-thumb          { background-color: #000 !important; }

/* list group */
.list-group { border-radius: 15px; }

.list-group-item.active{
  background-color: var(--brand-color) !important;
  color: #fff !important;
  border: solid 1px var(--brand-color) !important;
  font-size: 1.2rem !important; font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: .2s ease-in-out !important;
}
.list-group-item.active:hover{
  background-color: transparent !important;
  color: var(--brand-color) !important;
  border: solid 1px var(--brand-color) !important;
  padding: 12px 37px 13px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
.list-group-item{
  background-color: #fff !important;
  color: var(--brand-color) !important;
  border: solid 1px #fff !important;
  font-size: 1.2rem !important; font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: .2s ease-in-out !important;
}
.list-group-item:hover{
  background-color: var(--brand-color) !important;
  color: #fff !important;
  border: solid 1px var(--brand-color) !important;
  font-size: 1.2rem !important; font-weight: 600 !important;
  padding: 12px 37px 13px !important;
  transition: .2s ease-in-out !important;
}

/* Inaktive Items – Button färben beim Zeilen-Hover */
[data-role="playlist"] .list-group-item:not(.active) [data-role="dl"]{
  background: transparent;
  border-color: currentColor;
  color: inherit;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
[data-role="playlist"] .list-group-item:not(.active):hover [data-role="dl"]{
  background:#fff; 
  color: var(--brand-color);
  border-color:#fff;
}

/* Aktive Items – Button-Kontrast + Hover-Invertierung */
[data-role="playlist"] .list-group-item.active [data-role="dl"]{
  background: #fff; 
  color: var(--brand-color); 
  border-color:#fff;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
[data-role="playlist"] .list-group-item.active:hover [data-role="dl"]{
  background: var(--brand-color);
  color:#fff;
  border-color:var(--brand-color);
}

/* Fokus für Tastatur */
[data-role="playlist"] .list-group-item [data-role="dl"]:focus-visible{
  outline: 2px solid currentColor; outline-offset:2px;
}

.btn-download {
  padding-bottom:.375rem !important;
}

.btn-download:hover {
  opacity:.7 !important;
}

/* Progress-Füllung – immer schwarz */
.progress-bar {
  background-color: #000 !important;
}

/* Nummernspalte: Titel beginnt immer auf gleicher Achse, Farbe erbt vom Text */
.track-index{
  min-width: 2.2ch;
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: currentColor !important;
}

.track-title {
  flex: 1 1 auto;
  min-width: 0;
}