html {
  scroll-behavior: smooth;
  scroll-padding-top: 255px;
}

@media screen and (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body.no-scroll {
  overflow: hidden;
}

footer .footer-inner .container #socialbookmarks svg.fa-stack-15x {
  height: 1em;
  margin-top: 24px;
}

@media (min-width: 1220px) {
  footer .footer-inner .container #socialbookmarks svg.fa-stack-15x {
    margin-top: 25px;
  }
}

footer .footer-inner .adress > span {
  font-size: .9em;
}

#cookie-consent .buttons .btn--secondary.deny {
  display: none;
}

.privacy_info_video {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.privacy_info_button {
  margin-bottom: 15px;
}

.privacy_info_button p,
.privacy_info_button a {
  margin-bottom: 0;
}

.gd-closure-list .gdclosurelist-closure {
  padding-bottom: 30px;
}

.gd-closure-list .gdclosurelist-closure:not(:last-child) {
  margin-bottom: 30px;
  border-bottom: 1px solid #d5d6d1;
}

.gd-closure-list .gdclosurelist-closure h4 {
  margin-bottom: 10px;
}

.gd-closure-list .gdclosurelist-closure h4 button {
  padding: 0 0 0 15px;
  color: #2f2f2f;
  font-family: InterstateGreekandCyrillic-Bold, sans-serif;
  font-size: 0.8em;
  text-transform: uppercase;
  text-decoration: none;
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation.png) no-repeat 0;
  border: none;
}

.gd-closure-list .gdclosurelist-closure .gdclosurelist-closure-reason {
  font-style: italic;
}

.gd-closure-list .gdclosurelist-closure .gdclosurelist-closure-description {
  margin-bottom: 0;
}

a:focus {
  outline: 2px solid #4c563b;
  outline-offset: 3px;
  position: relative;
  z-index: 10;
}

.infonavigation a:focus {
  outline: none;
  color: #fff;
}

.infonavigation a {
  text-decoration: none;
}

.infonavigation ul li.info-site-145:focus-within {
  background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/btn_children_hover.png);
}

.infonavigation ul li.info-site-146:focus-within {
  background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/btn_teacher_hover.png);
}

.infonavigation ul li.info-site-147:focus-within {
  background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/btn_journalist_hover.png);
}

.two-face-box-content a:not(.more):focus {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.footer-inner a:focus {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.footer-inner #socialbookmarks > a:focus {
  outline: none;
}

a.iframe.popup-video:focus {
  outline: none;
}

a.iframe.popup-video:focus > img {
  outline: 2px solid #4c563b;
  outline-offset: 3px;
}

.gallery a.fresco:focus {
  outline: none;
}

.gallery a.fresco:focus > img {
  outline: 3px solid #b12e19;
  outline-offset: -3px;
}

.content-left-inner .frame-type-image .image a:focus {
  outline-offset: -1px;
}

.news-list-view .article.archive .inner:focus-within,
.news-list-view .article.press .inner:focus-within {
  background: #4c563b;
  color: #fff;
}

.ce-image .image a:focus {
  outline: 2px solid #4c563b;
  outline-offset: -3px;
}

.slick-list.draggable:focus {
  filter: brightness(1.1);
}

#map:focus {
  filter: brightness(1.1);
}

.event-inner .btn-event-canceled {
  color: #FFF;
  background-color: #c83c3c;
  background-image: url("/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow_hover.png");
  border-color: #c83c3c;
}

.mainnavigation ul.nav > li.main-link > a {
  font-size: 1.267em;
  text-wrap: nowrap;
}

.mainnavigation ul.nav > li ul.sublevel-2 > li > a,
.mainnavigation ul.nav > li ul.sublevel-1 > li > a {
  font-size: 1.025em;
}

.mainnavigation ul.nav.metanavigation > li > a {
  font-size: 1.025em;
}

.mainnavigation ul.nav.metanavigation {
  margin-left: 10px;
}

@media (max-width: 1619px) {
  .mainnavigation ul.nav.metanavigation {
    margin-bottom: 40px;
  }
}

@media (max-width: 440px) {
  .mainnavigation ul.nav.metanavigation li {
    width: 100% !important;
  }
}

ol ol.level-3, ol ul.level-3, ul ol.level-3, ul ul.level-3,
ol ol.level-4, ol ul.level-4, ul ol.level-4, ul ul.level-4,
ol ol.level-5, ol ul.level-5, ul ol.level-5, ul ul.level-5 {
  margin-left: 1rem;
}

.two-face-box-extended .icon .copyright {
  display: none;
}

.two-face-box-container-extended .two-face-box-extended .two-face-box-content .content {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding-bottom: 1rem;
}


@media (max-width: 767px) {
  .two-face-box-container-extended {
    max-width: 100%;
  }
}

@media (min-width: 520px) and (max-width: 767px) {
  .two-face-box-container-extended > .col-xs-12 {
    width: 50% !important;
  }
}

@media (max-width: 767px) {
  .two-face-box-container-extended .two-face-box-extended.box-double-height {
    height: 500px;
  }
}

.two-face-box-extended .two-face-box-content .content a.more {
  width: fit-content;
}

.two-face-box-extended .two-face-box-content p.copyright {
  margin-top: auto;
  font-size: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.event-list .event .event-inner .group {
  display: flex;
  flex-wrap: wrap;
}

/**
 * Veranstaltungen
 */

.event-list .event .event-inner .group > span {
  line-height: 18px;
}

.event-latest .event .event-inner .group span::after, .event-list .event .event-inner .group span::after {
  margin: 0 5px;
}

#eventStartDate_url {
  margin-left: calc(50% - 100px);
}

.events-detail-view .date_title,
.events-detail-view .date_large {
  margin-bottom: 2rem;
}

.events-detail-view .date_large {
  line-height: initial;
}

.events-detail-view h3 {
  margin-bottom: 2rem;
}

.events-detail-view .event-level-details {
  border: 2px solid #4c563b;
  padding: 2rem;
}

#edit_eventorder_container h2 {
  margin-bottom: 3rem;
}

.events-edit-view .edit_booking_searchForm label span {
  text-transform: revert;
}

.shariff-button.mastodon a {
  background-color: #6364ff;
}

.shariff-button.mastodon a:hover {
  background-color: #8283ff;
}

.shariff-button.twitter a {
  background-color: #000000;
}

.shariff-button.twitter a:hover {
  background-color: #333333;
}

.fa-twitter::before {
  content: "𝕏";
}

/* Webfonts */
/* Interstate */
@font-face {
  font-family: "InterstateGreekandCyrillic-Bold";
  font-style: normal;
  font-weight: bold;
  src: local("InterstateGreekandCyrillic-Bold"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Bold.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Bold.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-BoldItalic";
  font-style: italic;
  font-weight: bold;
  src: local("InterstateGreekandCyrillic-BoldItalic"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-BoldItalic.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-BoldItalic.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-Italic";
  font-style: italic;
  font-weight: normal;
  src: local("InterstateGreekandCyrillic-Italic"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Italic.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Italic.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-Light";
  font-style: normal;
  font-weight: 300;
  src: local("InterstateGreekandCyrillic-Light"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Light.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Light.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-LightItalic";
  font-style: italic;
  font-weight: 300;
  src: local("InterstateGreekandCyrillic-LightItalic"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-LightItalic.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-LightItalic.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-Regular";
  font-style: normal;
  font-weight: normal;
  src: local("InterstateGreekandCyrillic-Regular"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Regular.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-Regular.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-XLight";
  font-style: normal;
  font-weight: 200;
  src: local("InterstateGreekandCyrillic-XLight"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-XLight.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-XLight.woff") format("woff");
}

@font-face {
  font-family: "InterstateGreekandCyrillic-XLightItalic";
  font-style: italic;
  font-weight: 200;
  src: local("InterstateGreekandCyrillic-XLightItalic"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-XLightItalic.woff2") format("woff2"),
  url("../fonts/InterstateGreekAndCyrillic/InterstateGreekandCyrillic-XLightItalic.woff") format("woff");
}

/**
 * General
 */
body {
  font-size: 17px;
  line-height: 24px;
}

h1, h2, h3, h4 {
  letter-spacing: normal;
}

h1, #main-content h1, .h1 {
  font-size: 2.5em;
  margin-bottom: 20px;
}

h2, #main-content h2, .h2 {
  font-family: "InterstateGreekandCyrillic-Light";
  font-size: 2em;
  text-transform: revert;
  margin-bottom: 1rem;
}

h3, #main-content h3, .h3 {
  font-family: "InterstateGreekandCyrillic-Light";
  font-size: 1.25em;
  text-transform: revert;
}

h4, #main-content h4 {
  font-family: "InterstateGreekandCyrillic-Bold";
  font-size: 1em;
  text-transform: revert;
  margin-bottom: 10px;
}

#main-content h4.panel-title {
  margin-bottom: 0;
}

#main-content h3.panel-title {
  font-family: "InterstateGreekandCyrillic-Bold";
  font-size: 1em;
  text-transform: revert;
  margin-bottom: 0;
}

@media (max-width: 575.98px) {
  h1, #main-content h1, .h1 {
    font-size: 1.5em;
  }
  h2, #main-content h2, .h2 {
    font-size: 1.2em;
    margin-bottom: 0.6rem;
  }
}

.panel-group .panel .panel-heading .panel-title a {
  padding: 0 20px 0 20px;
}

@media (max-width: 767px) {
  .panel-group .panel .panel-heading .panel-title a {
    padding: 0 20px 0 5px;
  }
  .mq-accordion .panel-body {
    padding: 15px 20px;
  }
}


/**
 * Blog
 */
.blog-moreposts {
  margin-top: 6rem;
}

div.blog-moreposts > h3.blog-moreposts__headline {
  font-weight: bold;
}

@media (max-width: 575.98px) {
  .blog-container .blog-meta-wrap {
    margin: 1.5rem 0;
  }
}

.uppercase {
  text-transform: uppercase;
}

.two-face-box-container-extended .two-face-box-extended h3 {
  font-size: 1.65em;
  padding-right: 24px;
}

/* Lemon Yellow Sun */
.lemon-yellow-sun {
  font-family: "LemonYellowSunExtraBoldW05";
  font-size: 1.15em;
}

/* Abstand davor */
.frame-space-before-small {
  margin-top: 10px;
}

.frame-space-before-medium {
  margin-top: 61px;
}

.frame-space-before-large {
  margin-top: 81px;
}

.frame-space-before-extra-large {
  margin-top: 150px;
}

/* Abstand danach */
.frame-space-after-small {
  margin-bottom: 10px;
}

.frame-space-after-medium {
  margin-bottom: 61px;
}

.frame-space-after-large {
  margin-bottom: 81px;
}

.frame-space-after-extra-large {
  margin-bottom: 150px;
}

.news-list-view .article.publication .news-headline {
  line-height: revert;
  text-transform: none;
}

.news-list-view .article.publication{
  padding-left: 0;
  padding-right: 40px;
}

.frame-type-mqlayoutnationalpark_servicebox .news-list-view {
  overflow: hidden;
}

@media (max-width: 767px) {
  .frame-type-mqlayoutnationalpark_servicebox .news-list-view {
    display: flex;
    flex-wrap: wrap;
  }

  .frame-type-mqlayoutnationalpark_servicebox .news-list-view .article.publication {
    padding: 0;
    margin: 2rem 0;
    width: 100%;
    flex: calc(50% - 2rem);
    margin-right: 2rem;
  }
  .frame-type-mqlayoutnationalpark_servicebox .news-list-view .article.publication .h4.news-headline {
    font-size: 1.1em;
  }
}

.btn.more-filters {
  border: 1px solid #2f2f2f;
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/ico_btn_plus_black.png) no-repeat 17px;
}

.btn.more-filters.close {
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/ico_btn_minus_black.png) no-repeat 17px;
}

@media (max-width: 767px) {
  #facet-accordion-eventStartDateRange {
    flex-direction: column;
  }

  .input-daterange {
    display: flex;
    flex-direction: column;
    align-content: center;
  }

  .btn.search {
    margin-left: calc(50% - 65px);
  }

  .btn#more-filters {
    margin-left: calc(50% - 125px);
  }

  .btn#less-filters {
    margin-left: calc(50% - 125px);
    float: none;
  }

  #eventStartDate_url {
    margin-top: 1rem;
  }
}

/* Language */
#dropdown-lang-menu {
  border: none;
  background: none;
  text-decoration: none;
  color: #2f2f2f;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding-right: 14px;
}

#dropdown-lang-menu:hover {
  color: #2f2f2f;
}

#dropdown-lang-menu .fa.fa-chevron-down {
  font-size: 12px;
}

#top-navigation > .container .lang-menu {
  min-width: 100px;
  padding-left: 0;
  padding-right: 0;
  border-radius: 0;
  margin-top: 10px;
}

#top-navigation > .container a.dropdown-item {
  display: block;
  padding-left: 8px;
  padding-right: 8px;
}

#top-navigation > .container .lang-menu li {
  border-right: none;
}

#top-navigation > .container .lang-link {
  padding-left: 4px;
  padding-right: 4px;
}

#top-navigation > .container .lang-link::before {
  display: none !important;
  visibility: hidden !important;
}

@media (max-width: 575.98px) {
  #top-navigation .hide-mobile {
    display: none !important;
    visibility: hidden !important;
  }

  #top-navigation > .container .lang-menu {
    min-width: 96px;
  }
}

@media (min-width: 576px) {
  #top-navigation .hide-desktop {
    display: none !important;
    visibility: hidden !important;
  }
}

#dropdown-lang-menu span.active,
#top-navigation .lang-link.active {
  font-weight: 600;
}

@media (max-width: 1220px) {
  .event-list .event .event-inner {
    height: 660px;
  }
}

@media (max-width: 1023px) {
  .event-list .event .event-inner {
    height: 530px;
  }
  .no-scroll .mfp-content {
    height: 100vh;
    overflow-y: auto;
  }
}

@media (max-width: 767px) {
  .event-list .event .event-inner {
    height: 510px;
  }
}

#teaser {
  min-height: unset;
}

/**
 * Wimmelbild-Element
 */
.sound-toggle-on,
.sound-toggle-off,
.fullscreen-toggle-on,
.fullscreen-toggle-off {
  position: absolute;
  z-index: 10;
  width: 80px;
  margin-left: 50px;
  margin-top: 50px;
  cursor: pointer;
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.2));
  border: 0px solid #e30814;
  border-radius: 100%;
  transition: 0.2s ease-in-out;
}

.fullscreen-mode .sound-toggle-on,
.fullscreen-mode .sound-toggle-off,
.fullscreen-mode .fullscreen-toggle-on,
.fullscreen-mode .fullscreen-toggle-off {
  left: 10px;
  top: 3vh;
}

#images-container:not([data-loaded="true"]) .map-icon{
  opacity: 0;
  transition-property: opacity;
  transition-duration: 0.04s;
  z-index: 5;
}

.map-icon.visible{
  opacity: 100;
}

.fullscreen-toggle-on,
.fullscreen-toggle-off {
  margin-left: 150px;
}

.sound-toggle-off,
.fullscreen-toggle-off {
  z-index: 5;
}

.image-placeholder{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 3;
  cursor: pointer;
  display: none;
}

@media (max-width: 1619px) and (orientation: portrait) {
  .image-placeholder{
    display: block;
    /*background: rgba(255,0,0,0.5);*/
  }
}
@media (max-width: 1619px) and (orientation: landscape) {
  .image-placeholder{
    display: block;
    /*background: rgba(255,0,0,0.5);*/
  }
}

.fullscreen-mode-active .image-placeholder{
  z-index: 0;
}

.fullscreen-mode .container-leftright.fullscreen-entered:after {
  content: "";
  background: url("/fileadmin/Mediendatenbank_Nationalpark/03_Erleben/Kinderseite/rotate.gif") no-repeat center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: -1;
  visibility: hidden;

}

@media (max-width: 1619px) and (orientation: portrait) {
  .fullscreen-mode .container-leftright.fullscreen-entered:after {
    visibility: visible;
    z-index: 3;
  }
}

@media (max-width: 1619px) and (orientation: landscape) {

  .fullscreen-mode .sound-toggle-on,
  .fullscreen-mode .sound-toggle-off {
    top: 6.5rem;
    left: 1.5rem;
  }

  .fullscreen-mode .fullscreen-toggle-on,
  .fullscreen-mode .fullscreen-toggle-off{
    top: 0rem;
    left: 4.5rem;
    margin-left: 0px !important;
  }

  body.fullscreen-ios .fullscreen-mode .sound-toggle-on,
  body.fullscreen-ios .fullscreen-mode .sound-toggle-off {
    top: 5rem !important;
    left: 4rem !important;
  }
}

body.fullscreen-ios .fullscreen-mode .fullscreen-toggle-off {
  visibility: hidden;
}

body.fullscreen-ios .fullscreen-mode .sound-toggle-on,
body.fullscreen-ios .fullscreen-mode .sound-toggle-off {
  top: 10rem;
  left: 1.5rem;
}

body.fullscreen-mode-active {
  touch-action: none;
  overscroll-behavior: none;
}

.fullscreen-mode.container {
  width: 100%;
}

.fullscreen-mode .col-md-12 {
  padding: 0;
  margin: 0px;
}

.fullscreen-mode > .row {
  margin: 0;
}

.fullscreen-mode .frame {
  position: relative;
  z-index: 9999;
  box-shadow: 0 0 100rem 100rem #000;
  background: #000;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100dvh;
}

.container-leftright img.right {
  max-width: inherit;
  min-height: 100%;
  max-height: 100%;
  width: auto !important;
}

#container-leftright .mover {
  background-color: transparent !important;
  background: url("/fileadmin/Mediendatenbank_Nationalpark/03_Erleben/Kinderseite/Button-Lotta.png");
  border-radius: 0 !important;
  background-size: cover;
  width: 250px !important;
  height: 250px !important;
  cursor: pointer;
  cursor: grab;
}

#container-leftright .mover:active,
#container-leftright .mover:focus {
  cursor: grabbing;
}

#container-leftright-simple .mover {
  cursor: pointer;
  cursor: grab;
}

.container-leftright .divider {
  opacity: 1 !important;
}

/* hover effect */
#images-container {
  position: relative;
  display: inline-block;
  aspect-ratio: 40/27;
  overflow: hidden;
}

.leftright img {
  display: block;
}

#images-container .map-selector {
  visibility: hidden;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  color: #ffffff00;
  transition-duration: .3s;
  transition-timing-function: ease-out;
  transition-property: color;
}

#images-container .map-selector.hover {
  color: #ffffff60;
  visibility: visible;
}

.map-selector:after {
  content: '';
  position: absolute;
  top: inherit;
  right: inherit;
  bottom: inherit;
  left: inherit;
  width: inherit;
  height: inherit;
  background: currentColor;
  transition-duration: .3s;
  transition-timing-function: ease-out;
  transition-property: color;
  pointer-events: none;
  border-radius: 100%;
  z-index: 1;
}


@media (max-width: 1619px) {
  .sound-toggle-on,
  .sound-toggle-off,
  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    width: 60px;
    margin-left: 30px;
    margin-top: 30px;
  }

  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    margin-left: 100px;
  }

  #container-leftright .mover {
    width: 200px !important;
    height: 200px !important;
  }
}

@media (max-width: 1219px) {
  #container-leftright .mover {
    width: 180px !important;
    height: 180px !important;
  }
}

@media (max-width: 1022px) {
  .sound-toggle-on,
  .sound-toggle-off,
  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    width: 50px;
    margin-left: 30px;
    margin-top: 30px;
  }

  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    margin-left: 90px;
  }

  #container-leftright .mover {
    width: 140px !important;
    height: 140px !important;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  .fullscreen-mode .fullscreen-toggle-on,
  .fullscreen-mode .fullscreen-toggle-off{
    margin-left: 20px !important;
  }
  .fullscreen-mode .sound-toggle-on,
  .fullscreen-mode .sound-toggle-off {
    top: 5.5rem;
  }
}


@media (max-width: 767px) {

  .sound-toggle-on,
  .sound-toggle-off,
  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    width: 40px;
    margin-left: 20px;
    margin-top: 20px;
  }

  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    margin-left: 70px;
  }

  #container-leftright .mover {
    width: 110px !important;
    height: 110px !important;
  }
}

@media (max-width: 400px) and (orientation: landscape) {
  .fullscreen-mode .fullscreen-toggle-on,
  .fullscreen-mode .fullscreen-toggle-off{
    margin-left: 15px !important;
  }
  .fullscreen-mode .sound-toggle-on,
  .fullscreen-mode .sound-toggle-off {
    top: 4rem;
  }
}

@media (max-width: 400px) {
  .sound-toggle-on,
  .sound-toggle-off,
  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    width: 30px;
    margin-left: 15px;
    margin-top: 15px;
  }

  .fullscreen-toggle-on,
  .fullscreen-toggle-off {
    margin-left: 50px;
  }

  .container-leftright .mover {
    width: 100px !important;
    height: 100px !important;
  }
}

/* The Modal (background) */
.area-modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1000; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.area-modal .modal-content {
  position: sticky;
  background-color: #fefefe;
  margin: 10vh auto;
  padding: 80px;
  border: 1px solid #888;
  width: 70vw;
  height: 70vh;
  border-radius: unset;
  overflow: hidden;
}

@media (min-width: 1220px) {
  .area-modal .modal-content {
    margin: 9vh auto;
    height: 82vh;
    overflow: auto;
  }
}

.area-modal .scroll-buttons {
  position: fixed;
  right: 10px;
  top: 14.5rem;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 10;
}

@media (min-width: 1220px) {
  .area-modal .scroll-buttons {
    position: sticky;
    display: none !important;
  }
}

.area-modal .scroll-buttons button {
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  font-size: 20px;
  cursor: pointer;
  transition: background 0.2s;
  text-decoration: none;
}

.area-modal .scroll-buttons button:hover {
  background: rgba(0,0,0,0.8);
}

.area-modal .modal-content > .h2 {
  font-size: 3em;
}

@media (orientation: landscape) {
  .area-modal .modal-content > .h2 {
    padding-top: 2rem;
  }
}

.area-modal .modal-content > .h3 {
  font-style: italic;
}

.area-modal .modal-imagewrapper {
  width: 90%;
}

.area-modal .modal-imagewrapper .modal-image {
  width: fit-content;
}

.area-modal .modal-imagewrapper > figcaption {
  margin-top: 1rem;
  font-size: 0.8rem;
  color: #737577;
  line-height: 1.5;
}

.area-modal .modal-text-column {
  margin-bottom: 1rem;
}

.area-modal .modal-content .modal-text-column .row {
  padding-right: 3rem;
}

.area-modal .modal-content .modal-description {
  line-height: 1.75;
}

.area-modal .col-md-8 {
  padding-right: 8rem;
}

.area-modal .cricket {
  position: absolute;
  bottom: 0;
  right: 0;
  opacity: 0.8;
  height: 250px;
  max-width: 18vh;
  object-fit: contain;
  object-position: bottom;
}

.area-modal .close .icon-NLP_P_295_Menue_schliessen {
  font-size: 60px;
  cursor: pointer;
  -webkit-appearance: none;
}

.area-modal .close {
  margin-right: -40px;
  -webkit-appearance: none;
  z-index: 1;
}

.area-modal .modal-related-media-wrapper {
  display: flex;
  margin-top: 5rem;
}

.area-modal .modal-sound.audio-player {
  display: block;
  position: relative;
  left: unset;
  top: unset;
  margin-right: 2rem;
}

.area-modal .modal-sound.audio-player .mejs-container .mejs-controls div {
  width: 100px;
  height: 100px;
}

.area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-play button {
  background: url("/fileadmin/Mediendatenbank_Nationalpark/03_Erleben/Kinderseite/Icon-Lautsprecher.svg") no-repeat;
  display: blocK;
  width: 100px;
  height: 100px;
  margin-right: 2rem;
  transition: all .3s ease-in-out;
}

.area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-pause button {
  background: url("/fileadmin/Mediendatenbank_Nationalpark/03_Erleben/Kinderseite/Icon-Lautsprecher.svg") no-repeat;
  opacity: 0.5;
  width: 100px;
  height: 100px;
  transition: all .3s ease-in-out;
}

.area-modal .modal-video {
  background: url("/fileadmin/Mediendatenbank_Nationalpark/03_Erleben/Kinderseite/Icon-Kamera.svg") no-repeat;
  display: block;
  width: 100px;
  height: 100px;
}

.area-modal .modal-additional {
  margin-top: 2rem;
}

.video-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 940px;
  margin: 20px auto;
  padding-top: 7rem;
}

@media (max-width: 1219px) and (orientation: landscape) {
  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls div,
  .audio-player .mejs-container,
  .area-modal .modal-video,
  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-pause button,
  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-play button {
    width: 75px !important;
    height: 75px !important;
  }
}

@media (max-width: 1219px) {
  /* Modal Content/Box */
  .area-modal .modal-content {
    margin: 0 auto;
    width: 100%;
    height: 100%;
    padding: 40px;
    padding-right: 60px;
  }

  .area-modal .close {
    margin-right: -50px;
    position: fixed;
    right: 6rem;
  }

  .area-modal {
    height: calc(100% - 4rem);
    bottom: 0;
    width: calc(100% - 4rem);
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 4rem 0rem rgba(0,0,0,0.5);
  }

  .area-modal .col-md-4 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .area-modal .modal-imagewrapper {
    margin-bottom: 1rem;
    max-width: 100%;
    margin-right: 9vw;
  }

  .area-modal .modal-imagewrapper .modal-image {
    max-height: 40vh;
    object-fit: contain;
    margin-right: auto;
  }

  .area-modal .modal-related-media-wrapper {
    margin: 0;
    flex-direction: column;
    margin-left: 0.75rem;
  }

  .area-modal .modal-sound.audio-player {
    margin-right: 0;
    margin-bottom: 2rem;
  }

  .area-modal .cricket {
    max-height: 220px;
    width: auto;
  }

  .mfp-content .mfp-close.icon-NLP_P_295_Menue_schliessen {
    top: 20px;
  }

  .video-popup {
    width: 80vw;
    height: auto;
    padding-top: 7rem;
  }

  .video-popup > video {
    width: 100%;
    height: auto;
  }
}

@media (max-width: 1023px) {
  .mfp-content .mfp-close.icon-NLP_P_295_Menue_schliessen {
    line-height: 35px;
    font-size: 35px;
    right: 28px;
    top: 20px;
  }
}

@media (max-width: 800px) {
  .area-modal {
    bottom: 0;
  }

  .area-modal .modal-content {
    margin: 0;
    bottom: 0;
  }

  .area-modal .cricket {
    max-height: 180px;
    width: auto;
    bottom: -7px;
  }

  .mfp-container {
    padding: 0;
  }

  .video-popup {
    width: 80vw;
    padding-top: 7rem;
  }

  .mfp-content .mfp-close.icon-NLP_P_295_Menue_schliessen {
    line-height: 35px;
    font-size: 35px;
    right: 28px;
    top: 20px;
  }

  .area-modal {
    height: calc(100% - 12rem);
    width: calc(100% - 2rem);
    margin-top: 4rem;
  }

}


@media (max-width: 1000px) and (orientation: landscape) {
  .area-modal {
    width: calc(100% - 8rem);
  }
}

@media (max-width: 900px) {
  .area-modal .modal-content {
    padding: 20px;
    padding-right: 50px;
  }

  .area-modal .scroll-buttons {
    top: 10.125rem;
  }

  .area-modal .modal-content > .h2 {
    font-size: 2em;
  }

  .area-modal .close {
    margin-right: -40px;
  }

  .close .icon-NLP_P_295_Menue_schliessen,
  .area-modal .close .icon-NLP_P_295_Menue_schliessen {
    font-size: 40px;
  }

  .audio-player .mejs-container {
    width: 75px !important;
    height: 75px !important;
  }

  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls div,
  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-playpause-button button,
  .area-modal .modal-video {
    width: 75px;
    height: 75px;
  }

  .area-modal .modal-sound.audio-player {
    width: 75px;
    height: 75px;
    margin-bottom: 1rem;
  }
}

@media (max-width: 480px) {
  /*.area-modal .modal-sound.audio-player .mejs-container .mejs-controls div,*/
  .audio-player .mejs-container {
    width: 50px !important;
    height: 50px !important;
  }

  .area-modal .col-md-8 {
    padding-right: 1rem;
  }

  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls div,
  .area-modal .modal-sound.audio-player .mejs-container .mejs-controls .mejs-playpause-button button,
  .area-modal .modal-video {
    width: 50px;
    height: 50px;
  }

  .area-modal .modal-sound.audio-player {
    width: 50px;
    height: 50px;
    margin-bottom: 1rem;
  }

  .video-popup {
    padding: 20px;
    padding-top: 7rem;
  }

  .video-popup > video {
    height: auto;
  }

  .mfp-content .mfp-close.icon-NLP_P_295_Menue_schliessen {
    line-height: 35px;
    font-size: 35px;
    right: 28px;
    top: 20px;
  }

  .area-modal .cricket {
    max-height: 100px;
    width: auto;
    bottom: -4px;
  }
}

@media (max-width: 360px) {

  .area-modal .modal-content {
    padding: 10px;
    padding-right: 40px;
  }

  .area-modal .col-md-8 {
    padding-right: 3rem;
  }

  .area-modal .modal-content > .h2 {
    font-size: 1.5em;
  }

  .close .icon-NLP_P_295_Menue_schliessen,
  .area-modal .close .icon-NLP_P_295_Menue_schliessen {
    font-size: 25px;
  }

  .area-modal .modal-content .modal-text-column {
    line-height: 1.5;
    font-size: 15px;
  }
}

.frame-type-mqlayoutnationalpark_slidablehiddenobject .mfp-bg.mfp-ready{
  position: fixed !important;
}

.fullscreen-mode-active .fullscreen-mode .mfp-bg.mfp-ready{
  height: 100% !important;
}

.fullscreen-mode-active .fullscreen-mode .mfp-wrap.mfp-close-btn-in.mfp-auto-cursor.mfp-ready {
    top: 0px !important;
}

/* Video Render Fix */
.privacy_info_video,
.frame-type-mqlayoutnationalpark_video > div[style] {
  min-height: 21rem;
}

@media (max-width: 440px) {
  .privacy_info_video,
  .frame-type-mqlayoutnationalpark_video > div[style] {
    min-height: 17rem;
  }
}

/**
 * icon-related changes
 */
#top #search,
#top #nav-main {
  background: none;
  padding: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
}

#top #search:hover,
#top #nav-main:hover,
#top #search:focus,
#top #nav-main:focus {
  background: none;
  text-decoration: none;
}

#top #search .icon-NLP_P_297_Suche{
  font-size: 40px;
}

#top #nav-main .icon-NLP_P_293_Menue {
  font-size: 60px;
}

#top #search .nav-label,
#top #nav-main .nav-label {
  margin-left: 1rem;
  height: fit-content;
}

#top #search:hover .nav-label,
#top #nav-main:hover .nav-label,
#top #search:focus .nav-label,
#top #nav-main:focus .nav-label {
  text-decoration: underline;
}

#top .toggle-button .nav-label {
  float: none;
  margin-left: 0;
}
.mainnavigation > button.mfp-close {
  height: 50px;
  width: 50px;
  right: 30px;
  top: 40px;
  color: #585858;
  -webkit-appearance: none;
}

.mfp-content .mfp-close {
  background: none;
  color: revert;
  font-size: 50px;
  top: 20px;
}

.mainnavigation ul.nav.metanavigation > li {
  display: flex;
  flex-direction: row;
  padding-left: 0;
  font-size: 25px;
  align-items: center;
}

.mainnavigation ul.nav.metanavigation > li:hover,
.mainnavigation ul.nav.metanavigation > li:focus {
  color: #fff;
}

.mainnavigation ul.nav.metanavigation > li#uid_140,
.mainnavigation ul.nav.metanavigation > li#uid_140:hover,
.mainnavigation ul.nav.metanavigation > li#uid_140:focus,
.mainnavigation ul.nav.metanavigation > li#uid_564,
.mainnavigation ul.nav.metanavigation > li#uid_564:hover,
.mainnavigation ul.nav.metanavigation > li#uid_564:focus,
.mainnavigation ul.nav.metanavigation > li#uid_456,
.mainnavigation ul.nav.metanavigation > li#uid_456:hover,
.mainnavigation ul.nav.metanavigation > li#uid_456:focus,
.mainnavigation ul.nav.metanavigation > li#uid_131,
.mainnavigation ul.nav.metanavigation > li#uid_131:hover,
.mainnavigation ul.nav.metanavigation > li#uid_131:focus {
  background-image: none;
}

.mainnavigation ul.nav.metanavigation > li#uid_140::before {
  content: "\e9ff";
}

.mainnavigation ul.nav.metanavigation > li#uid_564::before {
  content: "\ea2d";
}

.mainnavigation ul.nav.metanavigation > li#uid_456::before {
  content: "\e9fd";
}
.mainnavigation ul.nav.metanavigation > li#uid_131::before {
  content: "\e9f9";
}

.mainnavigation ul.nav.metanavigation > li > a {
  font-family: InterstateGreekandCyrillic-Light, sans-serif;
  font-size: 19.125px;
  margin-left: 5px;
}

.btn.search {
  display: flex;
  background: none;
  padding: 6px 25px 6px 15px;
  text-decoration: none;
  line-height: 25px;
}

.btn.search::before {
  content: "\e9f5";
  font-family: 'NLP_P' !important;
  font-size: 25px;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  margin-right: 1rem;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.infonavigation ul li {
  font-family: 'NLP_P' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  font-size: 60px;
  text-transform: none;
  line-height: 1;
  text-align: center;
  padding-top: 25px;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.infonavigation ul li:hover,
.infonavigation ul li:focus {
  color: #ffffff;
  background-color: #756d6d;
}

.infonavigation ul li a {
  padding: 0;
  position: relative;
  bottom: -5px;
}

.infonavigation ul li.info-site-145,
.infonavigation ul li.info-site-145:hover,
.infonavigation ul li.info-site-145:focus,
.infonavigation ul li.info-site-146,
.infonavigation ul li.info-site-146:hover,
.infonavigation ul li.info-site-146:focus,
.infonavigation ul li.info-site-147,
.infonavigation ul li.info-site-147:hover,
.infonavigation ul li.info-site-147:focus {
  background-image: none;
}

.infonavigation ul li.info-site-145::before {
  content: "\ea0d";
}

.infonavigation ul li.info-site-146::before {
  content: "\ea0f";
}

.infonavigation ul li.info-site-147::before {
  content: "\ea11";
}

.mq-slider .mq-slider-item .mq-slider-slide-text-content #mq-slider-weather-header {
  margin-bottom: 30px;
}

#mq-slider-weather-wrapper {
  display: flex;
  align-items: start;
}

.mq-slider .mq-slider-item .mq-slider-slide-text-content #mq-slider-weather-wrapper .temperature {
  line-height: 50px;
}

.daytime span[class^="icon-"] {
  font-size: 50px;
  margin-top: 2px;
}

.precipitation span[class^="icon-"] {
  font-size: 45px;
  margin-top: 5px;
}

.precipitation .precipitation-data {
  margin-top: 9px;
}

.windspeed span[class^="icon-"] {
  font-size: 65px;
  margin-top: -5px;
}

.mq-slider .mq-slider-item .mq-slider-slide-text-content .precipitation,
.mq-slider .mq-slider-item .mq-slider-slide-text-content .windspeed {
  background: none;
}

.btn.calendar,
.btn.refresh {
  background: none;
  padding: 7px 20px 7px 15px;
  display: flex;
  flex-direction: row;
  width: fit-content;
  align-content: center;
}

.btn.calendar:hover,
.btn.calendar:focus,
.btn.refresh:hover,
.btn.refresh:focus {
  background-image: none;
}

.btn.calendar > .icon-NLP_P_571_Veranstaltungskalender,
.btn.refresh > .icon-NLP_P_343_Aktualisieren {
  font-size: 24px;
}

.container .related-files > .download-link.pdf,
.container .related-files > .download-link.pdf:hover,
.container .related-files > .download-link.pdf:focus {
  background-image: none;
  padding: 6px 20px 6px 15px;
  display: flex;
  flex-direction: row;
  width: fit-content;
  align-content: center;
}

.related-files > .download-link.pdf,
.related-files > .download-link.pdf:focus {
  text-decoration: none;
}

.download-link.pdf .icon-NLP_P_327_PDF-Symbol {
  font-size: 26px;
  margin-right: 5px;
}

.related-files > .download-link.pdf,
.related-files > .download-link.pdf:focus {
  text-decoration: none;
}

.related-files > .download-link.pdf .button-text,
.related-files > .download-link.pdf:focus .button-text {
  text-decoration: underline;
}

.frame-type-mqlayoutnationalpark_buttonlink .btn.maps,
.frame-type-mqlayoutnationalpark_buttonlink .btn.maps:hover,
.frame-type-mqlayoutnationalpark_buttonlink .btn.maps:focus,
footer .footer-inner .container .btn.maps,
footer .footer-inner .container .btn.maps:hover,
footer .footer-inner .container .btn.maps:focus {
  background-image: none;
  padding: 8px 20px 8px 15px;
  display: flex;
  flex-direction: row;
  width: fit-content;
  align-content: center;
}

.frame-type-mqlayoutnationalpark_buttonlink .btn.maps::after,
footer .footer-inner .container .btn.maps::before {
  font-family: 'NLP_P' !important;
  content: "\e98f";
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 26px;
  margin-right: 5px;
}

@media (min-width: 1620px) {
  #social-wrapper {
    min-width: 322px;
  }
}

#socialbookmarks .rss-icon {
  position: absolute;
  left: 15px;
  top: 22px;
}

.frame-type-mqlayoutnationalpark_buttonlink .btn.maps::after {
  order: 1;
}

.frame-type-mqlayoutnationalpark_buttonlink .btn.maps::before {
  order: 2;
  position: relative;
  bottom: -2px;
}

.frame-type-mqlayoutnationalpark_buttonlink .btn.maps .button-label {
  order: 3;
}

#tip-a-friend a,
#print a {
  background-image: none;
  padding: 4px 0;
  display: flex;
  flex-direction: row;
  width: fit-content;
  align-content: center;
  text-decoration: none;
}

#tip-a-friend .link-label:hover,
#tip-a-friend .link-label:focus,
#print .link-label:hover,
#print .link-label:focus {
  text-decoration: underline;
}

#tip-a-friend a::before {
  font-family: 'NLP_P' !important;
  content: "\e9ed";
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 28px;
  line-height: 1;
  position: relative;
  top: -2px;
  margin-right: 5px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#print a::before {
  font-family: 'NLP_P' !important;
  content: "\e9eb";
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 28px;
  line-height: 1;
  position: relative;
  top: -2px;
  margin-right: 5px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.input-daterange .icon-NLP_P_571_Veranstaltungskalender {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 32px;
}

.facet.solr-ajaxified:hover,
.facet.solr-ajaxified:focus {
  text-decoration: none;
}

.tx-solr .facet-option {
  text-transform: initial;
}

.tx-solr .facet-option i {
  opacity: 33%;
}

.tx-solr .facet-option:hover i {
  opacity: 66%;
}

.tx-solr .facet-option--selected i {
  opacity: 100%;
}

.facet.solr-ajaxified:hover .facet-label,
.facet.solr-ajaxified:focus .facet-label {
  text-decoration: underline;
}

.facet-option-list .facet.solr-ajaxified > i {
  font-size: 80px;
}

.facet-option-list .facet.solr-ajaxified > .icon-NLP_P_249_Filter_Barrierefrei_2 {
  font-size: 60px;
  margin: 10px 0;
}

#facet-accordion-eventKind .facet.solr-ajaxified > span[class^="icon-"],
#facet-accordion-eventTopic .facet.solr-ajaxified > span[class^="icon-"],
#facet-accordion-eventAccessibility .facet.solr-ajaxified > span[class^="icon-"] {
  font-size: 30px;
  margin-right: 5px;
}

#facet-accordion-eventLanguage .facet-option > a {
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/ico_checkbox.png) no-repeat scroll center left;
  padding-left: 3.5rem;
}

#facet-accordion-eventLanguage .facet-option.facet-option--selected > a {
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/icon/ico_checkbox_checked.png) no-repeat scroll center left;
}

#facet-accordion-eventLanguage .facet.solr-ajaxified > .fa-language {
  font-size: 30px;
  margin-right: 5px;
}

.events-theme > span {
  font-size: 20px;
  position: relative;
  bottom: -5px;
  margin-right: 5px;
}

.event-inner .topic .event-topic-row,
.events-detail-view .event-topic {
  display: flex;
  align-content: center;
}

.event-inner .topic .events-topic > span {
  font-size: 20px;
  margin-right: 5px;
  position: relative;
  bottom: -2px;
}

.event-list .event .event-inner .day {
  font-size: 1.24em;
}

.event-list .event .event-inner .h5,
.event-list .event .event-inner .teaser {
  hyphens: auto;
}

.events-detail-view .date-subline {
  display: flex;
  align-content: center;
}

.events-detail-view .date-subline > i {
  font-size: 24px;
  margin-right: 18px;
}

.events-detail-view .date-subline > i.fa-language {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  font-size: 28px;
}

.events-detail-view .event-topic > i {
  font-size: 24px;
  margin-right: 10px;
}

.events-detail-view .event-level-icon > span {
  font-size: 100px;
}

.events-detail-view .event-level-header {
  margin-bottom: 0;
}

ul.ce-uploads li a {
  padding-top: 0;
}

ul.ce-uploads li a span.ce-uploads-fileName {
  text-decoration: underline;
  margin-left: 15px;
}

ul.ce-uploads li a span.ce-uploads-fileName:focus,
ul.ce-uploads li a span.ce-uploads-fileName:hover {
  text-decoration: none;
}

ul.ce-uploads li a[href*=".jpg"] {
  background-image: none;
  display: flex;
  padding-left: 0;
  text-decoration: none;
}

ul.ce-uploads li a[href*=".jpg"]::before {
  font-family: 'NLP_P' !important;
  content: "\ea25";
  color: #f2f2f2;
  background: #505050;
  padding: 6px 1px;
  border-radius: 50%;
  font-size: 34px;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

ul.ce-uploads li a[href*=".mp3"] {
  background-image: none;
  display: flex;
  align-items: center;
  padding-left: 0;
  text-decoration: none;
}

ul.ce-uploads li a[href*=".mp3"]::before {
  font-family: 'NLP_P' !important;
  content: "\ea29";
  color: #f2f2f2;
  background: #505050;
  padding: 6px 1px;
  border-radius: 50%;
  font-size: 34px;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

ul.ce-uploads li a[href*=".pdf"] {
  background-image: none;
  display: flex;
  align-items: center;
  padding-left: 0;
  text-decoration: none;
}

ul.ce-uploads li a[href*=".pdf"]::before {
  font-family: 'NLP_P' !important;
  content: "\ea13";
  color: #f2f2f2;
  background: #505050;
  padding: 6px 1px;
  border-radius: 50%;
  font-size: 34px;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

ul.ce-uploads li a[href*=".mp4"] {
  background-image: none;
  display: flex;
  align-items: center;
  padding-left: 0;
  text-decoration: none;
}

ul.ce-uploads li a[href*=".mp4"]::before {
  font-family: 'NLP_P' !important;
  content: "\ea27";
  color: #f2f2f2;
  background: #505050;
  padding: 6px 1px;
  border-radius: 50%;
  font-size: 34px;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.modal-open {
  overflow: visible;
}

body.no-scroll {
  overflow: hidden;
}

.powermail_legend {
  padding-bottom: 1rem;
}

.powermail_fieldwrap .col-xs-12 {
  padding-left: 0;
}

.powermail_fieldset:not(:first-of-type) {
  margin-top: 5rem;
}

.tx-powermail label, .tx-powermail label.control-label {
  text-transform: unset;
  margin-bottom: 0.5rem;
}

@media (min-width: 0px) {
  .frame-type-mqlayoutnationalpark_servicebox .col-container .container {
    padding: 0;
  }
}

.frame-type-mqlayoutnationalpark_servicebox .col-container.egg .container,
.frame-type-mqlayoutnationalpark_servicebox .col-container.dark-red .container,
.frame-type-mqlayoutnationalpark_servicebox .col-container.dark-green .container,
.frame-type-mqlayoutnationalpark_servicebox .col-container.duck .container,
.frame-type-mqlayoutnationalpark_servicebox .col-container.gray .container,
.frame-type-mqlayoutnationalpark_servicebox .col-container.light-green .container {
  padding: 0 20px;
}

.news .news-list-view .gallery {
  padding: 0;
}

#container-leftright-simple .mover {
  line-height: 25px !important;
}

.tx-solr.tx-solr-juniorranger .filter.events {
  clear: none;
}

.tx-solr.tx-solr-juniorranger .search-input input.tx-solr-q {
  font-size: 1.25em;
}

.Tx-Formhandler #register_note {
  height: 150px;
}

@media (max-width: 1219px) {
  #top-navigation > .container a {
    padding-left: 7px;
    padding-right: 7px;
    line-height: 1.3;
  }
}

@media (max-width: 767px) {
  #top-navigation .col-12.text-right {
    padding-left: 7px;
    padding-right: 7px;
  }

  #top-navigation {
    font-size: 14px;
  }
}

@media (max-width: 400px) {
  #top-navigation > .container a {
    padding-left: 0;
    padding-right: 0;
  }

  #top-navigation {
    font-size: 13px;
  }

  #top-navigation .icon-NLP_P_299_Leichte_Sprache {
    display: none;
  }

}

#main-content-upper {
  overflow: hidden;
}

.powermail_fieldwrap_firstname-gd {
  display: none;
  visibility: hidden;
}

#tabletNavigation li a,
#subnavigation li a {
  text-transform: initial;
}

#global-popup {
  position: relative;
  width: 50vw;
  height: auto;
  max-height: 70vh;
  margin: 0 auto;
  padding: 2.5rem;
  overflow: scroll;
  background: #FFF;
}

#global-popup .mfp-close {
  top: 2.5rem;
  right: 2.5rem;
  width: 3rem;
  height: 3rem;
  font-size: 3rem;
}

#global-popup .col-container .container-fluid {
  padding-left: 0;
  padding-right: 0;
}

#global-popup ul li {
  list-style-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_list.png);
  margin-left: 15px;
  padding: 1px 0;
}

@media (max-width: 1220px) {
  #global-popup {
    width: 70vw;
  }
}

@media (max-width: 900px) {
  #global-popup {
    width: 80vw;
  }
}

@media (max-width: 767px) {
  #global-popup {
    width: 90vw;
  }
}

/* Leaflet map API - custom CSS */
.mqlayoutnationalpark-maps {
  height: 400px;
}

.frame-type-mqlayoutnationalpark_maps .privacy_info {
  position: relative;
  z-index: 1000;
}

.meeting-info-map {
  .mqlayoutnationalpark-maps {
    height: 300px;
  }

  .privacy_info {
    position: relative;
    z-index: 1000;
  }
}


/* Allgemein start*/
.news .article.publication .related-files.listed_downloads{
  padding: 0 10px 20px 10px;
}

.news-list-view .publication .related-files.listed_downloads{
  height: auto;
}

a.arrow-start-right{
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_list.png) no-repeat 0px;
  color: #4c563b;
  display: block;
  padding: 1px 15px 1px 15px;
  width: max-content;
  text-decoration: underline;
}

a.arrow-start-right:hover {
  text-decoration: none;
}

a.btn-arrow-right,
a.btn-with-popup,
button.btn-arrow-right,
button.btn-with-popup{
  display: inline-flex;
}

a.btn-arrow-right:first-child,
a.btn-with-popup:first-child{
  margin-bottom: 1.2rem;
}

@media (max-width: 1024px) {
  .frame-type-mqlayoutnationalpark_twocols .frame-type-image .ce-image.ce-center.ce-above img{
    width: 730px;
    height: 400px;
    object-fit: cover;
  }
}
/* Allgemein end*/


/* Navigation start*/

.mainnavigation #social-wrapper-nav,
.mainnavigation ul.nav#tabletNavigation  {
  display: none;
}

.mainnavigation ul.nav#defaultNavigation  {
  display: block;
}

.mainnavigation ul.nav.metanavigation > li#uid_1742,
.mainnavigation ul.nav.metanavigation > li#uid_1716{
  display: none;
}

.mainnavigation ul.nav.metanavigation > li#uid_1742::before,
.mainnavigation ul.nav.metanavigation > li#uid_1716::before{
  content: "\eb34";
}

@media (max-width: 1023px) {

  .mainnavigation #social-wrapper-nav,
  .mainnavigation ul.nav#tabletNavigation {
    display: block;
  }

  .mainnavigation #socialbookmarks-nav {
    display: flex;
    justify-content: center;
    margin: 0;
    margin-top: 0px;
    margin-top: 2.5rem;
    gap: 3rem;
  }

  .mainnavigation #social-wrapper-nav .icon-NLP_P_599_Instagram,
  .mainnavigation #social-wrapper-nav .icon-NLP_P_601_Mastodon,
  .mainnavigation #social-wrapper-nav .icon-NLP_P_597_YouTube{
    color: #2f2f2f;
  }

  .mainnavigation ul.nav#defaultNavigation {
    display: none;
  }

  .mainnavigation{
    background: #fff url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/logo_nationalpark.png) no-repeat 19px 20px;
    background-size: 140px !important;
    padding-top: 85px;
  }

  .mainnavigation ul.nav.metanavigation{
    margin-left: 0px;
  }

  .mainnavigation ul.nav.metanavigation > li#uid_1742,
  .mainnavigation ul.nav.metanavigation > li#uid_1716{
    display: flex;
  }
}

#tabletNavigation li a{
  padding: 15px 50px 15px 20px !important;
  z-index: 50;
}

#tabletNavigation li a:hover{
  background: none;
}

#tabletNavigation ul{
  list-style: none;
}


#tabletNavigation > li a {
  border-top: 1px solid #d5d6d1;
  color: #505050;
  display: block;
  font-size: 1.125em;
  font-family: InterstateGreekandCyrillic-Regular, sans-serif;
}

#tabletNavigation > li > a {
  border-top: 1px solid #d5d6d1;
  color: #2f2f2f;
  display: block;
  font-size: 1.267em;
  font-family: InterstateGreekandCyrillic-Light,sans-serif;
}

#tabletNavigation li.sub .sub_arrow.icon-arrow-right{
  display: block;
  width: 3rem;
  height: 3rem;
  background-size: auto;
  background-size: 10px;
  transform: rotate(90deg);
  position: absolute;
  right: 0;
  left: inherit !important;
  transition: 0.2s ease-in-out;
  cursor: pointer;
  height: 51px;
  width: 51px;
  top: 3px !important;
  transform: translateY(0) !important;
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_open.png)  no-repeat 50%;
  border: none;
  z-index: 60;
}

#tabletNavigation li.sub .sub_arrow.icon-arrow-right:after{
  block-size: 2.5rem;
  border-inline-start: 1px solid #d5d6d1;
  content: "";
  inset-block-start: 50%;
  inset-inline-start: 0;
  position: absolute;
  transform: translateY(-50%);
}

#tabletNavigation li.current.sub > .sub_arrow.icon-arrow-right:after{
  border-inline-start: 1px solid #fff;;
}

#tabletNavigation li.sub .sub_arrow.icon-arrow-right{
  height: 54px;
  width: 54px;
  top: 1px !important;
}

#tabletNavigation li.sub > .sub_arrow.icon-arrow-right[aria-expanded="true"]{
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_close.png) no-repeat 50%;
}

#tabletNavigation li.current.sub > .sub_arrow.icon-arrow-right[aria-expanded="true"]{
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_close_w.png) no-repeat 50%;
}

#tabletNavigation li.current.sub > .sub_arrow.icon-arrow-right{
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_open_w.png) no-repeat 50%;
}

#tabletNavigation li.current > a {
  background: #4c563b !important;
  color: #fff;
}

#tabletNavigation li.current.sub > a{
  background: #4c563b !important;
  color: #fff;
}

#tabletNavigation > li ul.level-2,
#tabletNavigation > li ul.level-1{
  padding: 0;
  /*background: #dbddd8;*/
}

/*#tabletNavigation > li ul.level-2 {
  background: #e9eee3;
}*/

#tabletNavigation > li ul.level-3 {
  /*background: #fafdf4;*/
  margin: 0;
}

#tabletNavigation > li ul.level-2 > li,
#tabletNavigation > li ul.level-1 > li{
  position: relative;
}

#tabletNavigation > li ul.level-1 > li > a{
  padding-left: 35px !important;
  font-size: 1.035em;
}

#tabletNavigation > li ul.level-2 > li > a{
  padding-left: 60px !important;
  font-size: 0.95em;
}

#tabletNavigation > li ul.level-3 > li:not(.first) a{
  border: 0;
}

#tabletNavigation > li ul.level-3 > li > a{
  font-size: 0.95em;
  padding: 10px 50px 10px 80px !important;
}

#tabletNavigation li.current.sub ul.level-3 li a,
#tabletNavigation li.current.sub ul.level-2 li a,
#tabletNavigation li.current.sub ul.level-1 li a{
  padding: 0;
  background: none;
}

/*#tabletNavigation li.current.sub ul.level-3 li a:hover,
#tabletNavigation li.current.sub ul.level-2 li a:hover,
#tabletNavigation li.current.sub ul.level-1 li a:hover{
  background: #4c563b;
  color: #fff;
}*/

#tabletNavigation li.sub ul.level-1 li:last-child a{
  border-bottom: 0;
}

/*#tabletNavigation li.current.sub ul.level-2{
  background: #e0e8d3;
}*/

#tabletNavigation li.current > a,
#tabletNavigation li.current.sub ul.level-1 li.current > a{
  color: #fff !important;
  background: #4c563b !important;
}

@media (max-width: 1023px) {
  .mainnavigation ul.nav.metanavigation li {
    padding: 10px 0px 10px 20px !important;
    border-top: 1px solid #d5d6d1;
    margin: 0;
  }

  .mainnavigation ul.nav.metanavigation li:last-child{
    border-bottom: 1px solid #d5d6d1;
  }

  .mainnavigation ul.nav.metanavigation > li.current .infotitle{
    font-weight: 600;
  }

  .mainnavigation ul.nav.metanavigation > li:focus,
  .mainnavigation ul.nav.metanavigation > li:hover {
    background-color: unset;
  }

  .mainnavigation ul.nav.metanavigation > li:hover,
  .mainnavigation ul.nav.metanavigation > li:focus,
  .mainnavigation ul.nav.metanavigation > li:focus > a,
  .mainnavigation ul.nav.metanavigation > li:hover > a {
    color: #2f2f2f;
  }

  .mainnavigation ul.nav.metanavigation{
    margin: 0;
    margin-left: -20px;
    margin-right: -20px;
  }

  .mainnavigation::after {
    background: #fff;
    bottom: -50px;
    -webkit-clip-path: polygon(0 0,100% 0,100% 50%,0 100%);
    clip-path: polygon(0 0,100% 0,100% 50%,0 100%);
    content: " ";
    display: block;
    height: 50px;
    left: 0;
    position: absolute;
    visibility: visible;
    width: 100%;
  }
}

/* Navigation end*/


/* Formular start*/
.selector span{
  white-space: wrap;
  padding-right: 40px;
}

.selector {
  overflow: hidden;
}

/* Formular end*/


/*Startseite Slider start*/
.mq-slider .slick-slide img{
  height: 1000px;
  object-fit: cover;
}

.mq-slider .trenner hr{
  display: none;
}

@media (min-width: 1024px) and (max-width: 1619px) {
  .mq-slider .mq-slider-item {
    height: 415px;
    width: 450px;
    top: 20%;
  }
  .mq-slider .slick-slide img{
    height: 730px;
    object-fit: cover;
  }
  .mq-slider .mq-slider-item .mq-slider-slide-text-content{
    position: relative;
  }
}

@media (min-width: 767px) and (max-width: 1023px) {
  .mq-slider .mq-slider-item {
    height: 390px;
    width: 450px;
    top: 15%;
  }
  .mq-slider .slick-slide img{
    height: 600px;
    max-width: 100%;
    object-fit: cover;
  }
}

@media (max-width: 767px) {
  .mq-slider .mq-slider-item {
    background: none;
    min-height: 310px;
    height: auto;
  }
  .mq-slider .trenner {
    padding: 0 20px;
  }
  .mq-slider .trenner hr{
    display: block;
    margin-top: 0;
    border-color: #dbddd8;
    border-width: 0.2rem;
  }
  .mq-slider .slick-slide img{
    height: 397px;
    max-width: 100%;
    object-fit: cover;
  }
  .mq-slider .mq-slider-item .mq-slider-slide-text-content .btn {
    margin-top: 10px;
    margin: 20px auto;
    display: block;
    width: fit-content;
  }
}

@media (max-width: 500px) {
  .mq-slider .mq-slider-item {
    min-height: 325px;
  }
}

@media (max-width: 450px) {
  .mq-slider .mq-slider-item {
    min-height: 350px;
  }
}

/*Startseite Slider end*/


/*News Publikationen Startseite start*/


.news-latest-view .article.publication .news-headline,
.news-list-view .article.publication .news-headline {
  height: 50px;
}

/*News Publikationen Startseite end*/


/*Face-box Start*/

.two-face-box-container-extended .two-face-box-extended .two-face-box-content h3,
.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box-headline h3,
.two-face-box-container-extended .two-face-box-extended .two-face-box-content .content {
  hyphens: auto;
}

.two-face-box-container-extended .two-face-box-extended .two-face-box-content .content{
  overflow-y: auto;
  scrollbar-color: white transparent;
  scrollbar-width: thin;
}


.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box .icon img,
.two-face-box-container-extended .two-face-box-extended.box-double-height .two-face-box-main .box.linked .icon img {
  height: 100%;
  object-fit: cover;
  object-position: right;
  width: 100%;
}

.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box.linked .icon img{
  height: 80%;
  object-fit: cover;
  object-position: right;
  width: 100%;
}

.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box.linked .icon,
.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box.linked,
.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box,
.two-face-box-container-extended .two-face-box-extended .two-face-box-main .box .icon,
.two-face-box-container-extended .two-face-box-extended .two-face-box-main{
  height: 100%;
}


@media (min-width: 1220px) and (max-width: 1619px) {
  .two-face-box-container-extended .two-face-box-extended .two-face-box-main .box-headline {
    height: 90px;
  }
  .two-face-box-container-extended .two-face-box-extended {
    height: 400px;
  }
  .two-face-box-container-extended .two-face-box-extended.box-double-height {
    height: 800px;
  }
}

@media (min-width: 1024px) and (max-width: 1219px) {
  .two-face-box-container-extended .two-face-box-extended .two-face-box-main .box-headline {
    height: 100px;
  }
  .two-face-box-container-extended .two-face-box-extended {
    height: 385px;
  }
  .two-face-box-container-extended .two-face-box-extended.box-double-height {
    height: 770px;
  }
}

@media (min-width: 767px) and (max-width: 1619px) {
  .two-face-box-container-extended .two-face-box-extended .two-face-box-main .box-headline h3 {
    height: auto;
  }
  .two-face-box-container-extended .two-face-box-extended .two-face-box-main .box-headline {
    display: flex;
    align-items: center;
  }
}

@media (max-width: 767px){
  .two-face-box-container-extended .two-face-box-extended .two-face-box-content .content h3,
  .two-face-box-container-extended .two-face-box-extended h3 {
    font-size: 1.3em;
    line-height: 1.2em;
  }
  .two-face-box-container-extended .two-face-box-extended.col-xs-12,
  .two-face-box-container-extended .two-face-box-extended {
    height: 500px;
  }
}

/*Face-box end*/

/*Veranstaltungen start*/

.frame-type-mqlayoutnationalpark_servicebox .col-container.egg .event-latest .event .event-inner.weekend,
.frame-type-mqlayoutnationalpark_servicebox .col-container.gray .event-latest .event .event-inner.weekend,
.frame-type-mqlayoutnationalpark_servicebox .col-container.light-green .event-latest .event .event-inner.weekend{
  background: #dbddd8;
}

.col-container.egg .row.fce .event-latest .btn.arrow-right,
.col-container.dark-green .row.fce .event-latest .btn.arrow-right,
.col-container.dark-red .row.fce .event-latest .btn.arrow-right,
.col-container.gray .row.fce .event-latest .btn.arrow-right,
.col-container.light-green .row.fce .event-latest .btn.arrow-right{
  background: transparent url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow.png) no-repeat 20px;
  border-color: #2f2f2f;
  color: #2f2f2f;
}

.col-container.egg .row.fce .event-latest .btn.arrow-right:hover,
.col-container.dark-green .row.fce .event-latest .btn.arrow-right:hover,
.col-container.dark-red .row.fce .event-latest .btn.arrow-right:hover,
.col-container.gray .row.fce .event-latest .btn.arrow-right:hover,
.col-container.light-green .row.fce .event-latest .btn.arrow-right:hover{
  background-color: #2f2f2f;
  background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow_hover.png);
  border-color: #2f2f2f;
  color: #fff;
}

.col-container.egg .row.fce .event-latest .btn.btn-event-canceled,
.col-container.dark-green .row.fce .event-latest .btn.btn-event-canceled,
.col-container.dark-red .row.fce .event-latest .btn.btn-event-canceled,
.col-container.gray .row.fce .event-latest .btn.btn-event-canceled,
.col-container.light-green .row.fce .event-latest .btn.btn-event-canceled {
  color: #FFF;
  background-color: #c83c3c;
  background-image: url("/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow_hover.png");
  border-color: #c83c3c;
}

.col-container.egg .row.fce .event-latest .slick-dots,
.col-container.dark-red .row.fce .event-latest .slick-dots,
.col-container.dark-green .row.fce .event-latest .slick-dots,
.col-container.gray .row.fce .event-latest .slick-dots,
.col-container.light-green .row.fce .event-latest .slick-dots{
  background: transparent;
}

.col-container.egg .event-latest .slick-dots li.slick-active button::before,
.col-container.egg .event-list .slick-dots li.slick-active button::before{
  color: #000;
}

.col-container.dark-red .event-latest .slick-dots li.slick-active button::before,
.col-container.dark-red .event-list .slick-dots li.slick-active button::before{
  color: #fff;
}

.col-container.dark-red .event-latest .slick-dots li:not(.slick-active) button::before,
.col-container.dark-red .event-list .slick-dots li:not(.slick-active) button::before{
  color: #8e8e8e;
}

.col-container.dark-green .event-latest .slick-dots li.slick-active button::before,
.col-container.dark-green .event-list .slick-dots li.slick-active button::before{
  color: #fff;
}

.col-container.dark-green .event-latest .slick-dots li:not(.slick-active) button::before,
.col-container.dark-green .event-list .slick-dots li:not(.slick-active) button::before{
  color: #8e8e8e;
}

.col-container.gray .event-latest .slick-dots li.slick-active button::before,
.col-container.gray .event-list .slick-dots li.slick-active button::before{
  color: #434343;
}

.col-container.gray .event-latest .slick-dots li:not(.slick-active) button::before,
.col-container.gray .event-list .slick-dots li:not(.slick-active) button::before{
  color: #8e8e8e;
}

.col-container.light-green .event-latest .slick-dots li.slick-active button::before,
.col-container.light-green .event-list .slick-dots li.slick-active button::before{
  color: #4c563b;
}

.col-container.light-green .event-latest .slick-dots li:not(.slick-active) button::before,
.col-container.light-green .event-list .slick-dots li:not(.slick-active) button::before{
  color: #9b9b5e;
}

@media (min-width: 1220px) and (max-width: 1619px) {
  .event-latest .event .event-inner, .event-list .event .event-inner{
    height: 650px;
  }
}
@media (min-width: 1024px) and (max-width: 1219px){
  .event-latest .event .event-inner, .event-list .event .event-inner{
    height: 767px;
  }
  .event-latest + .btn.calendar{
    background: #fff;
  }
}

@media (min-width: 767px) and (max-width: 1023px) {
  .event-latest .event .event-inner, .event-list .event .event-inner{
    height: 567px;
  }
  .event-latest + .btn.calendar{
    background: #fff;
  }
  .slickslider-events .slick-dots{
    padding: 15px 0 !important;
  }
}

@media (max-width: 767px) {
  .btn.calendar,
  .btn.refresh {
    background: none !important;
  }

  .event-latest .event .event-inner {
    height: 430px;
  }

  .slickslider-events .slick-dots{
    position: unset;
    padding: 15px 0 !important;
  }

  .event-latest + .btn.calendar {
    margin: 40px 0;
  }
}

@media (max-width: 500px) {
  .event-latest .event .event-inner {
    height: 465px;
  }
}

/*Veranstaltungen end*/


/*Accordeon*/
@media (max-width: 767px) {
  .frame-type-mqlayoutnationalpark_accordioncontainer {
    margin-left: 0px;
    margin-right: 0px;
  }
}

/*Footer Start*/


@media (min-width: 1220px) and (max-width: 1619px) {
  .footerimage .caption{
    top: 10%;
  }

  .footerimage img{
    height: 710px;
    object-fit: cover;
  }
}

@media (min-width: 767px) and (max-width: 1023px) {
  footer .footer-inner .container {
    margin-top: -15px;
    background-size: cover;
  }
}

@media (min-width: 767px) and (max-width: 1219px){
  .footerimage .caption{
    top: 10%;
  }

  .footerimage img{
    height: 710px;
    object-fit: cover;
  }
}

.footerimage .caption p {
  line-height: 1.4;
}

@media (max-width: 767px) {
  footer .footer-inner .container .col-xs-3 {
    margin: 2rem 0;
  }

  footer .footer-inner {
    margin-top: -70px;
  }
}

@media (max-width: 540px) {
  footer .footer-inner .container .col-xs-3 {
    width: 100% !important;
  }
}

/*Footer end*/


@media (max-width: 767px) {
  .big_text {
    font-size: 1em;
    letter-spacing: .035em;
    line-height: 1.33em;
  }
  .events-edit-view .edit_booking_searchForm label span {
    font-size: 1em;
  }
  .events-edit-view input {
    width: 100% !important;
    margin-bottom: 1rem;
  }
  .events-edit-view .form-group .col-xs-6 {
    width: 100% !important;
  }

  #teaser .image-caption {
    margin-left: 20px;
  }

  .col-container.duck,
  .col-container.duck .event .event-inner.weekend {
    background: #434343;
    padding-top: 3rem;
  }

  .col-container.light-green .event .event-inner.weekend{
    background: #b9b97c !important;
  }

  .col-container.duck .event .event-inner.weekend {
    background: #5b5b5b;
  }

  .col-container.gray .event .event-inner.weekend {
    background: #dbddd8;
  }


  .slickslider-events {
    margin-bottom: 0 !important;
  }


  .col-container.egg .event .event-inner,
  .col-container.dark-red .event .event-inner,
  .col-container.dark-green .event .event-inner,
  .col-container.gray .event .event-inner,
  .col-container.light-green .event .event-inner,
  .col-container.duck .event .event-inner {
    border: 0;
    height: 510px;
    padding: 0;
  }

  .col-container.egg .row.fce,
  .col-container.dark-red .row.fce,
  .col-container.dark-green .row.fce,
  .col-container.gray .row.fce,
  .col-container.light-green .row.fce {
    padding: 5rem 0;
  }

  .col-container.duck .row.fce {
    padding: 20px 0;
  }

  .col-container.egg .event .event-inner,
  .col-container.gray .event .event-inner,
  .col-container.light-green .event .event-inner{
    background: transparent;
    border: 3px solid #000;
    color: #000;
    padding: 0 2rem;
    padding-top: 3rem;
  }

  .col-container.dark-red .event .event-inner,
  .col-container.dark-green .event .event-inner,
  .col-container.duck .event .event-inner {
    background: transparent;
    border: 3px solid #fff;
    color: #fff;
    padding: 0 2rem;
    padding-top: 3rem;
  }

  .col-container.egg .event .event-inner .spacer,
  .col-container.gray .event .event-inner .spacer,
  .col-container.light-green .event .event-inner .spacer {
    border-color: #000 !important;
  }

  .col-container.dark-red .event .event-inner .spacer,
  .col-container.dark-green .event .event-inner .spacer,
  .col-container.duck .event .event-inner .spacer {
    border-color: #fff !important;
  }

  .col-container.dark-red .events-topic,
  .col-container.dark-green .events-topic,
  .col-container.duck .events-topic {
    filter: brightness(0) invert(1);
  }

  .col-container.egg .btn,
  .col-container.gray .btn,
  .col-container.light-green .btn {
    border: 1px solid #000;
    color: #000;
  }

  .col-container.dark-red .btn,
  .col-container.dark-green .btn,
  .col-container.duck .btn {
    border: 1px solid #fff;
    color: #fff;
  }

  .col-container.dark-egg .btn.arrow-right:hover,
  .col-container.dark-egg .btn.arrow-right:focus,
  .col-container.dark-red .btn.arrow-right:hover,
  .col-container.dark-red .btn.arrow-right:focus,
  .col-container.dark-green .btn.arrow-right:hover,
  .col-container.dark-green .btn.arrow-right:focus,
  .col-container.gray .btn.arrow-right:hover,
  .col-container.gray .btn.arrow-right:focus,
  .col-container.light-green .btn.arrow-right:hover,
  .col-container.light-green .btn.arrow-right:focus,
  .col-container.duck .btn.arrow-right:hover,
  .col-container.duck .btn.arrow-right:focus {
    background-color: rgba(0,0,0,0.1);
  }

  .col-container.gray .btn.arrow-right:hover,
  .col-container.gray .btn.arrow-right:focus {
    background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow.png);
  }

  .col-container.dark-red .btn.arrow-right:not(.btn-event-canceled),
  .col-container.dark-green .btn.arrow-right:not(.btn-event-canceled),
  .col-container.duck .btn.arrow-right:not(.btn-event-canceled) {
    filter: brightness(0) invert(1);
  }

  .col-container.egg .slickslider-events .slick-dots,
  .col-container.dark-red .slickslider-events .slick-dots,
  .col-container.dark-green .slickslider-events .slick-dots,
  .col-container.gray .slickslider-events .slick-dots,
  .col-container.light-green .slickslider-events .slick-dots,
  .col-container.duck .slickslider-events .slick-dots {
    margin-top: -4rem;
  }
}

@media (max-width: 1024px) {

  .col-container.duck .row.fce {
    background: #434343 !important;
  }

  .col-container.egg .row.fce .col-sm-10.col-sm-offset-1 > h2,
  .col-container.gray .row.fce .col-sm-10.col-sm-offset-1 > h2,
  .col-container.light-green .row.fce .col-sm-10.col-sm-offset-1 > h2,
  .col-container.duck .row.fce .col-sm-10.col-sm-offset-1 > h2{
    margin-bottom: 3rem;
  }

  .col-container.dark-red .row.fce .col-sm-10.col-sm-offset-1 > h2,
  .col-container.dark-green .row.fce .col-sm-10.col-sm-offset-1 > h2,
  .col-container.duck .row.fce .col-sm-10.col-sm-offset-1 > h2{
    color: #fff;
  }

  #main-content-upper .main-content .content-left-inner {
    padding-top: 2rem;
  }

  .frame-type-mqlayoutnationalpark_servicebox .frame-type-mqlayoutnationalpark_two-face-box-extended-3 {
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-right: -20px;
  }

  .frame-type-mqlayoutnationalpark_spacer + .frame-type-mqlayoutnationalpark_twocols > div > div > .row > div + div > div > header {
    border-top: 1px solid #d5d6d1;
    margin-top: 40px;
    padding-top: 40px;
  }

  .frame-type-mqlayoutnationalpark_twocols .col-left > .frame-type-mqlayoutnationalpark_spacer:last-child {
    display: none;
  }

  .frame-type-mqlayoutnationalpark_twocols {
    overflow: hidden;
  }

  .frame-type-mqlayoutnationalpark_twocols .spacer {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 40px);
  }
}

@media (max-width: 440px) {
  .privacy_info a {
    display: inline;
  }
  #main-content ul li {
    margin-left: 7px;
  }
}

@media (max-width: 800px) {
  #main-content-lower {
    overflow: hidden;
  }
}

.powermail_form_19 .powermail_fieldset {
  margin-top: 4rem;
}

.btn-group-powermail-pager .btn {
  text-decoration: none;
  padding-left: 25px;
}

.btn-group-powermail-pager .btn-primary {
  background: #9b9b5e;
  color: #FFF;
}

.powermail_tab_navigation .btn {
  margin-right: 20px;
}

.powermail_fieldwrap_date-buttons {
  margin-top: -2rem;
}

.powermail_fieldwrap_date-buttons .col-xs-12 {
  display: block !important;
}

.powermail_fieldwrap_date-buttons .btn {
  margin-right: 2rem;
}

.powermail_fieldwrap_date-buttons .btn {
  margin-right: 2rem;
}

.powermail_fieldwrap_type_textarea {
  position: relative;
}

.powermail_field_characterlimit {
  position: absolute;
  top: -2.5rem;
  right: 2rem;
}

.powermail_fieldwrap_showimageupload,
.powermail_fieldwrap_showmediarights {
  display: none;
}

#password-visibility-toggle {
    position: absolute;
    right: 3rem;
    bottom: 1.25rem;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

#password-visibility-toggle > svg {
  pointer-events: none;
}


/*Quiz survey*/

.tx-fp-masterquiz img{
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.tx-fp-masterquiz .btn.btn-info,
.tx-fp-masterquiz .btn.btn-primary{
  background: transparent url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow.png) no-repeat 20px;
  border: 2px solid #2f2f2f;
  border-radius: 25px;
  color: #2f2f2f;
  font-family: InterstateGreekandCyrillic-Light,sans-serif;
  font-size: 1em;
  padding: 10px 25px 11px 45px;
  text-transform: uppercase;
  text-decoration: underline;
}

.tx-fp-masterquiz .btn.btn-info:hover,
.tx-fp-masterquiz .btn.btn-primary:hover {
  text-decoration: none;
}

.tx-fp-masterquiz input{
  border: 3px solid #dbddd8;
  border-radius: 0;
  box-shadow: none;
  font-family: InterstateGreekandCyrillic-Light,sans-serif;
  height: auto;
  padding-bottom: 10px;
  padding-top: 10px;
}

.tx-fp-masterquiz #quiz-restart{
  margin-top: 2rem;
}

.tx-fp-masterquiz .quiz-radiobox:checked{
  background-color: #000000;
}


.tx-fp-masterquiz .quiz-radio label::after,
.tx-fp-masterquiz .quiz-radio label::before {
  border-radius: 50%;
  color: #fff;
  content: "";
  height: 30px;
  left: 0;
  position: absolute;
  text-align: center;
  top: 0;
  transition: all .3s ease 0s;
  vertical-align: middle;
  width: 30px;
}

.tx-fp-masterquiz .quiz-radio label {
  cursor: pointer;
  display: inline-block;
  line-height: 30px;
  margin-bottom: 5px;
  margin-right: 40px;
  margin-top: 5px;
  padding-left: 40px;
  position: relative;
  transition: all .3s ease-in-out 0s;
}

.tx-fp-masterquiz .quiz-radio label::before {
  border: 3px solid #dbddd8;
  box-shadow: inset 0 0 0 .8em #fff;
  transition: all .3s ease 0s;
}

.tx-fp-masterquiz .quiz-radio label:hover::before, .tx-fp-masterquiz .quiz-radio.quiz-answer-selected label::before {
  border: 3px solid #dbddd8;
  box-shadow: inset 0 0 0 .3em #fff,inset 0 0 0 1em #2f2f2f;
  transition: all .3s ease 0s;
}

.tx-fp-masterquiz .quiz-result .progress-bar{
  background-color: #00432D;
}

.tx-fp-masterquiz .quiz-result .progress{
  background-color: #dbddd8;
}

.tx-fp-masterquiz .card{
  margin-top: 4rem;
}

.tx-fp-masterquiz .done{
    margin-top: 4rem;
}

.translated-ltr .btn {
  text-decoration: none;
}

.translated-ltr .btn font {
  position: relative;
  top: -1px;
  white-space: wrap;
}

@media (min-width: 1620px) {
  .translated-ltr .infonavigation ul li {
    height: 130px;
    min-height: 120px;
  }
}

.translated-ltr .two-face-box-container-extended .two-face-box-extended h3 {
  padding-right: 10px;
}

.translated-ltr .mq-slider .mq-slider-item {
  min-height: 550px;
  top: 24%;
}

font[class]:not([class=""]) {
  background: transparent !important;
  box-shadow: none !important;
}

#goog-gt-tt {
  display: none !important;
}

body > .skiptranslate {
  display: none;
}

body {
  top: 0 !important;
}

#load-more {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-top: 2rem;
}

.fa-2x {
  font-size: 6rem;
}

.blog-box {
  transition: opacity 2s;
}

.blog-rows.loading .blog-rows .blog-box {
  opacity: 0;
}

.news-detail-view .related-files,
.news-latest-view .related-files,
.news-list-view .related-files {
  min-height: 42px;
  height: auto;
}

/* Leichte Sprache */

body.layout-1 {
  font-size: 21px;
  line-height: 33px;
}

.layout-1 #social-wrapper {
  font-size: 17px;
}

.layout-1 p {
  max-inline-size: 62ch;
  letter-spacing: 0.1px;
  margin: 0 0 1.125em;
}

.layout-1 .main-content ul {
  margin-bottom: 2.5rem;
}

.layout-1 .ce-bodytext{
  min-width: 10em;
}

.layout-1 .h1,
.layout-1 h1 {
  text-transform: none;
}

.layout-1 .h2,
.layout-1 h2 {
  margin-top: 1.5em;
  margin-bottom: 0.75em !important;
  font-weight: bold;
}

.layout-1 .h3,
.layout-1 h3 {
  margin-top: 1.5em;
  margin-bottom: 0.75em !important;
  font-weight: bold;
}

.layout-1 .panel-body > .frame:first-child header .h2,
.layout-1 .panel-body > .frame:first-child header h2,
.layout-1 .panel-body > .frame:first-child header .h3,
.layout-1 .panel-body > .frame:first-child header h3 {
  margin-top: 0.5rem;
}

.layout-1 .align-right {
  text-align: left;
}

.layout-1 .align-center {
  text-align: left;
}

.layout-1 .align-justify {
  text-align: left;
}

.layout-1 .col-container.light-green .row.fce {
  background: #F4F4EB;
  color: #2f2f2f;
}

.layout-1 #teaser .frame-type-image,
.layout-1 #teaser .mq-news-teaser-image,
.layout-1 #teaser .slick-container {
  -webkit-clip-path: none;
  clip-path: none;
}

.layout-1 #tip-a-friend a::before,
.layout-1 #print a::before {
  display: none;
}

.layout-1 #tip-a-friend a::after {
   font-family: 'NLP_P' !important;
   content: "\e9ed";
   speak: never;
   font-style: normal;
   font-weight: normal;
   font-variant: normal;
   text-transform: none;
   font-size: 28px;
   line-height: 1;
   position: relative;
   top: 4px;
   margin-left: 5px;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }

.layout-1 #print a::after {
  font-family: 'NLP_P' !important;
  content: "\e9eb";
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 28px;
  line-height: 1;
  position: relative;
  top: 4px;
  margin-left: 5px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.layout-1 #breadcrumbnavigation,
.layout-1 .breadcrumb-side-menu {
  display: none;
}

.layout-1 #print {
  margin-left: 15px;
}

.layout-1 .main-content inner > .container {
  padding-left: 0px;
  padding-right: 0px;
}

.layout-1 .col-container > .container-fluid > .row.fce > .col-md-9 {
  max-width: 1300px;
}

.layout-1 #content-left,
.layout-1 .main-content.inner > .container > .row > .col-sm-offset-1 {
  margin-left: 0;
}

@media (min-width: 1024px) {
  .layout-1 #content-left {
    width: 29%;
  }
}

.layout-1 #main-content {
  width: 75%;
}

.layout-1 #main-content-upper {
  margin-top: 7rem;
}

.layout-1 .col-md-4.breadcrumb-side-menu {
  width: 50%;
}

/*.layout-1 #subnavigation {
  display: none !important;
}*/

.layout-1 .footerimage {
  display: none !important;
}

.layout-1 footer .footer-inner .container {
  background-image: none;
  background: #4c5c3a;
  padding-top: 90px;
  padding-left: 4vw;
}

.layout-1 footer .footer-inner {
  margin-top: 2rem;
}

.layout-1 footer .col-md-3.col-md-offset-3:first-child {
  margin-left: 0;
}

.layout-1 footer .col-md-2:nth-child(2) .h5:after {
  content: "Diese Informationen sind nicht in Leichter Sprache:";
  max-width: 25rem;
  font-size: 1.7rem;
  display: block;
  line-height: 1.4;
  font-family: InterstateGreekandCyrillic-Light,sans-serif;
  text-transform: none;
  margin-top: 1rem;
  margin-bottom: -2rem;
}

@media (min-width: 1220px) {
  .layout-1 footer .col-md-2{
    width: 25%;
  }
}

.layout-1 footer .h5,
.layout-1 footer h5 {
  font-size: 3rem;
  margin: 0 0 1.125em;
  text-transform: none;
  font-size: 2.625rem !important;
}

.layout-1 footer li a {
  background: transparent;
  padding-left: 0;
}

.layout-1 footer li a:before {
  content: "–";
  color: #b7beb0;
  display: inline-block;
  padding-right: 0.5rem;
  font-weight: 700;
  font-size: 170%;
  position: relative;
  top: 0.5rem;
}

@media (min-width: 1024px) {
  .layout-1 #header__menu-wrap {
    display: none;
  }
  .layout-1 #header__search-menu-wrap {
    width: 100%;
    padding-left: 4vw;
    justify-content: flex-start;
    margin-top: 3.6rem;
  }
}

@media (min-width: 1024px) and (max-width: 1319px){
  .layout-1 header.navbar .header-top {
    flex-wrap: wrap;
  }
  .layout-1 #header__search-menu-wrap {
    padding-left: 0;
    margin-top: 2rem;
  }
  .layout-1 #header__search-wrap {
    right: -0.5rem !important;
    top: -6.5rem !important;
  }
  .layout-1 #top {
    margin-top: 1rem !important;
  }
  .layout-1  header.navbar .header-top #logo .navbar-brand img {
    max-height: 6rem;
    object-fit: contain;
    margin-left: 1rem;
  }
}

@media (min-width: 1320px) {
  .layout-1 header.navbar .header-top {
    padding-left: 0;
    display: flex;
    justify-content: space-between;
  }
}

.layout-1 .claim-welcome a {
  font-size: 17px;
  line-height: 24px;
  background: transparent url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/btn_arrow.png) no-repeat right 5px;
  background-size: 8px;
  padding-right: 18px !important;
  padding-left: 0 !important;
}

.layout-1 #top {
  margin-top: 35px;
  position: relative;
}

.layout-1 #top .nav > li > a {
  font-size: 23px;
  word-spacing: -1px;
  color: #2f2f2f;
  line-height: 1.3;
}

@media (max-width: 1440px) {
  .layout-1 #top .nav > li > a,
  .layout-1 #top .nav-label {
    font-size: 21px;
  }
}

.layout-1 .nav > li > a:hover {
  background-color: transparent;
}

.layout-1 #top .nav > li > a:hover,
.layout-1 #top .nav > li > a:focus {
  background: #4c563b;
  color: #fff;
}

.layout-1 #tip-a-friend a .link-label,
.layout-1 #print a .link-label {
  text-decoration: underline;
}

.layout-1 #tip-a-friend a:hover .link-label,
.layout-1 #tip-a-friend a:focus .link-label,
.layout-1 #print a:hover .link-label,
.layout-1 #print a:focus .link-label {
  text-decoration: none;
}

.layout-1 .nav > li {
  width: auto !important;
  padding: 0;
}

.layout-1 .nav > li:last-child {
  margin-right: 0;
}

.layout-1 .header-top > div:first-child {
  width: auto;
}

.layout-1 header.navbar .header-top #logo .navbar-brand {
  margin-left: 0 !important;
}

.layout-1 header.navbar {
  position: sticky;
  z-index: 99;
  background: #fff;
}

.layout-1 #top-navigation > .container .claim-welcome {
  display: block;
}

.layout-1 #socialbookmarks a[href*="rss"] {
  display: none !important;
}

/*@media (min-width: 1530px) {
  .layout-1 footer .footer-inner .container .col-md-offset-3 {
    margin-left: 22%;
  }
  .layout-1 #social-wrapper {
    min-width: 0;
    width: auto;
  }
  .layout-1 footer .footer-inner .container #socialbookmarks {
    float: none;
    display: flex;
    flex-direction: column;
  }
  .layout-1 footer .footer-inner .container .adress {
    width: 20%;
    white-space: nowrap;
  }
}

@media (min-width: 1219px) {
  .layout-1 footer .footer-inner .container .col-md-offset-3 {
    margin-left: 20% !important;
  }
  .layout-1 footer .footer-inner .container .adress {
    width: 20%;
    white-space: nowrap;
  }
  .layout-1 #social-wrapper {
    width: 13%;
  }
}

@media (min-width: 1024px) {
  .layout-1 footer .footer-inner .container .col-md-offset-3 {
    margin-left: 0;
  }
  .layout-1 footer .footer-inner .container .adress {
    width: 25%;
    white-space: nowrap;
  }
  .layout-1 footer .footer-inner .container #socialbookmarks {
    width: 10%;
  }
}

.layout-1 footer .footer-inner .container > * {
  box-shadow: 0 23rem 0rem #4c5c3a;
}

.layout-1 footer .footer-inner .container > :last-child {
  box-shadow: 0 -5rem 0rem #4c5c3a;
}*/

.layout-1 #top-navigation > .container a {
  width: max-content;
}

.layout-1 footer .row::after,
.layout-1 footer .row::before {
  display: none;
}

.layout-1 .mainnavigation ul.nav.metanavigation {
  display: none;
}

.layout-1 #tx-solr-faceting {
  display: none;
}

.layout-1 .main-content a:not(.btn) {
  text-decoration: underline;
}

.layout-1 .main-content a:hover,
.layout-1 .main-content a:focus {
  text-decoration: none;
}

@media (max-width: 1023px) {
  .layout-1 #teaser  .container {
    width: 100%;
  }

  .layout-1 .ce-right.ce-intext .ce-gallery {
    float: none;
    margin-left: 0;
  }
}

@media (min-width: 1024px) {
  .layout-1 #header__search-wrap {
    position: absolute;
    top: -5.5rem;
    right: 1.5rem;
  }
}

@media (max-width: 1600px) {
  .layout-1 #header__search-wrap {
    right: 0;
  }
}

@media (max-width: 1500px) {
  .layout-1 #header__search-wrap {
    right: -1rem;
  }
}

@media (min-width: 1220px) and (max-width: 1400px) {
  .layout-1 .col-left.col-md-3 {
    width: calc(25% - 12rem);
  }
}

@media (min-width: 1024px) and (max-width: 1219px) {
  .layout-1 .col-left.col-md-3 {
    width: 100%;
  }
  .layout-1 .col-right.col-sm-8 {
    width: 100%;
  }
}

.easylangNav-wrap  {
  width: 100%;
  padding-right: 1rem;
}

#easylangNavigation {
  display: flex;
  justify-content: space-between;
}

.layout-1 #header__search-menu-wrap > div:first-child {
  marign-right: 1rem;
}

@media (max-width: 1023px) {
  .layout-1 footer .footer-inner .container .col-xs-3 {
    width: 50% !important;
    margin-top: 2rem;
  }
  .easylangNav-wrap {
    display: none !important;
  }
  .layout-1 #header__search-menu-wrap {
    margin-left: auto;
    gap: 2rem;
  }
}

@media (max-width: 590px) {
  .layout-1 footer .footer-inner .container .col-xs-3 {
    width: 100% !important;
    margin-top: 1rem;
  }
  .layout-1 footer .footer-inner .container .col-xs-3:first-child {
    margin-top: 3rem;
  }
}

@media (max-width: 1619px) {
  .layout-1 footer .footer-inner .container .h5,
  .layout-1 footer .footer-inner .container h5 {
    font-size: 1.8rem;
    line-height: 1.4;
  }
  .layout-1 #subnavigation li a {
    font-size: 1em;
  }
}

@media (min-width: 1024px) and (max-width: 1619px) {
  .layout-1 .container {
    width: 100%;
  }
  .layout-1 header.navbar .header-top {
    padding-left: 1.5rem;
    padding-right: 1rem;
  }
  .layout-1 footer .footer-inner .container .logo {
    float: right;
    margin-right: 4rem;
  }
  .layout-1 footer .footer-inner .container {
    background-size: 100%;
  }
}

.to-top {
  background: transparent url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_close.png) no-repeat 20px;
  border: 1px solid #2f2f2f;
  color: #2f2f2f;
  border-radius: 25px;
  font-family: InterstateGreekandCyrillic-Light,sans-serif;
  font-size: 1em;
  padding: 10px 25px 11px 45px;
  text-transform: uppercase;
  text-decoration: none !important;
  margin-top: 2rem;
  display: inline-block;
}

.layout-1 .to-top,
.layout-1 .btn {
  padding: 8px 25px 11px 45px;
}

.to-top:hover,
.to-top:focus {
  background-color: #2f2f2f;
  background-image: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_navigation_close_w.png);
  border-color: #2f2f2f;
  color: #fff;
}



.Tx-Formhandler fieldset .form-horizontal.third {
  width: 30.66%;
}

.Tx-Formhandler fieldset .form-horizontal.third.first {
  margin-right: 4%;
}


#register_child_info_wrapper {
  float: left;
  width: 100%;
  margin-bottom: 1rem;
}

.register-child-info {
  float: left;
  width: 100%;
  padding: 3rem 3rem 2rem 3rem;
  background: #eee;
  margin: 1.5rem 0;
}

.useAdultInfoFromBefore {
  margin-top: 0.5rem;
  padding: 5px 10px;
  font-size: 0.75em;
  text-decoration: none;
}

.meeting-info-map-link {
  color: #fff;
  text-decoration: none;
  display: block;
}

.meeting-info-map-label {
  position: relative;
  display: inline-block;
  padding-left: 9px;
  border-bottom: 1px solid currentColor;
  line-height: 1.3;
}

.meeting-info-map-label:before {
  content: "";
  background: url(/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/arrow_more.png) no-repeat 0 50%;
  background-size: 5px;
  display: inline-block;
  width: 6px;
  height: 12px;
  position: absolute;
  left: 0;
  bottom: 5px;
}

.meeting-info-map-link:hover,
.meeting-info-map-link:focus {
  color: #fff;
}

.meeting-info-map-link:hover .meeting-info-map-label,
.meeting-info-map-link:focus .meeting-info-map-label {
  border-bottom-color: transparent;
}
.blog-pdf-download {
  margin-top: 5rem;
}

.blog-pdf-download > .btn.download {
  margin-top: 3rem;
}

#gd-booking-warning-text {
  margin-bottom: 2rem;
}

/* WCAG 4.1.1 parsing fixes: CSS support for markup changes (no SCSS/rebuild). */
#socialbookmarks-nav > a:before {
  content: "";
  display: none;
}

#gpx_map {
  width: 100%;
  height: 300px;
}

.blog-meta-wrap .shariff-mastodon-wrapper {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ==========================================================
   EXT:gd_instagram - Instagram-Slider und Social Wall (Task #5713)

   Quelle: packages/gd_instagram/Resources/Public/Scss/_gd-instagram.scss
   Nach Aenderungen dort nur dieses Partial uebersetzen und den Block hier
   ersetzen - das Gesamt-Bundle darf nicht gebaut werden.

   Das Partial nutzt Variablen aus src/styles/_global-variables.scss und laesst
   sich deshalb nicht allein uebersetzen. Beide Dateien aneinanderhaengen, das
   vermeidet jede Frage der Namensaufloesung:
     cat src/styles/_global-variables.scss \
         packages/gd_instagram/Resources/Public/Scss/_gd-instagram.scss > /tmp/c.scss
     node_modules/.bin/sass --style=expanded --no-source-map --no-error-css \
         --load-path=src/styles /tmp/c.scss /tmp/c.css
   Aus /tmp/c.css den Teil ab "INSTAGRAM (EXT:gd_instagram)" uebernehmen; davor
   stehen nur Kommentare aus der Variablendatei. --no-error-css ist wichtig,
   sonst schreibt sass Fehler als body::before-Regel ins CSS statt abzubrechen.
   ========================================================== */

/* Halber Abstand als fertiger Wert - vermeidet den "/"-Divisionsausdruck,
   der in Dart Sass 2 entfällt. */
/* Muss zu grid-auto-rows in .gd-instagram__wall passen - gd-instagram.js liest
   beide Werte zur Laufzeit aus, die Angabe hier ist die Quelle. */
/* Abstand der Kacheln im Karussell: halber Wert je Seite, zusammen also 40px -
   derselbe Abstand wie zwischen den Veranstaltungskacheln, deren Slides je
   20px Innenabstand tragen. Das Raster der Social Wall bleibt davon unberuehrt,
   es soll dicht bleiben. */
/* Die Hausschrift steht nur im handgepflegten main.css, nicht in
   _global-variables.scss - dort steht noch die abgelöste OpenSans-Familie.
   Deshalb hier die tatsächlich ausgelieferte Familie. */
.gd-instagram {
  /* ----- Kachel ----- */
  /* Der Öffnen-Button legt sich über die ganze Kachel. Er ist das einzige
     Bedienelement - Bild und Text darunter sind aria-hidden. */
  /* ----- Kopfzeile ----- */
}
.gd-instagram__headline {
  margin-bottom: 20px;
}
.gd-instagram__empty {
  margin: 0;
  color: #2f2f2f;
}
.gd-instagram__post {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #d5d6d1;
  border-radius: 4px;
  overflow: hidden;
}
.gd-instagram__preview {
  position: relative;
  background: #f2f2f2;
}
.gd-instagram__preview img,
.gd-instagram__preview video {
  display: block;
  width: 100%;
  height: auto;
}
.gd-instagram__play, .gd-instagram__dots {
  position: absolute;
  pointer-events: none;
}
.gd-instagram__play {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  padding-left: 4px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
}
.gd-instagram__dots {
  left: 0;
  right: 0;
  bottom: 10px;
  display: flex;
  justify-content: center;
}
.gd-instagram__dot {
  width: 6px;
  height: 6px;
  margin: 0 3px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.6);
}
.gd-instagram__dot.is-active {
  background: #fff;
}
.gd-instagram__excerpt {
  position: relative;
  padding: 12px 14px 16px;
  font-size: 18px;
  line-height: 1.45;
  color: #2f2f2f;
  /* Sehr lange Beitragstexte dürfen die Kachel nicht ins Endlose ziehen.
     Der Verlauf zeigt, dass der Text weitergeht - der vollständige Text steht
     im Dialog. */
  max-height: 15em;
  overflow: hidden;
}
.gd-instagram__excerpt::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3em;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);
  pointer-events: none;
}
.gd-instagram__opener {
  position: absolute;
  inset: 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.gd-instagram__opener:hover {
  background: rgba(0, 0, 0, 0.06);
}
.gd-instagram__opener:focus {
  outline: 2px solid #000;
  outline-offset: 3px;
  outline-offset: -4px;
}
.gd-instagram__head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #d5d6d1;
}
.gd-instagram__avatar {
  flex: 0 0 auto;
}
.gd-instagram__avatar img {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.gd-instagram__meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.gd-instagram__author {
  font-family: InterstateGreekandCyrillic-Bold, sans-serif;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gd-instagram__date {
  font-size: 12px;
  color: #2f2f2f;
}
.gd-instagram__channel {
  margin-left: auto;
  flex: 0 0 auto;
  color: #4c563b;
}

/* ==========================================================
   Slider
   ========================================================== */
.gd-instagram--slider {
  /* Nur im Slider: alle Kacheln einer Reihe gleich hoch. Im Raster muss die
     Kachel dagegen ihrer Höhe folgen - dort löst height:100% gegen die 8px
     hohe Rasterzeile auf und die Kachel klappt zusammen. */
  /* Slick setzt die Slides auf float; damit die Kacheln einer Reihe gleich
     hoch werden, muss der Track ein Flex-Container sein. */
  /* Dieselben Pfeile wie beim Veranstaltungskarussell: die beiden Grafiken des
     Sitepackages, 67x150, ausserhalb der Kacheln. Vorlage sind
     ".event-latest .slick-prev/.slick-next" im handgepflegten main.css. Nur die
     Optik wird uebernommen - die Klasse .slickslider-events bleibt bewusst
     aussen vor, siehe Kommentar in Slider.html. */
  /* Wie im Veranstaltungskarussell: auf breiten Schirmen fuehren die Pfeile,
     unterhalb von $screen-sm uebernehmen die Punkte. Beides schaltet
     gd-instagram.js ueber die Slick-Breakpoints (arrows/dots), die Vorlage
     loest es ueber display:none und Pfeile ausserhalb des Sichtbereichs.
     Die Punkte an der Bildstrecke eines Beitrags sind davon unberuehrt - das
     ist .gd-instagram__dots, nicht .slick-dots. */
  /* Rahmen wie bei den Veranstaltungen: weisse Flaeche mit dem Schattenbild
     darunter statt einer eigenen Linie - siehe ".event-latest .event". */
}
.gd-instagram--slider .gd-instagram__slider-wrap {
  position: relative;
}
.gd-instagram--slider .gd-instagram__slide {
  height: auto;
  padding: 0 20px;
}
.gd-instagram--slider .gd-instagram__post {
  height: 100%;
}
.gd-instagram--slider .slick-track {
  display: flex;
}
.gd-instagram--slider .slick-slide {
  height: auto;
}
.gd-instagram--slider .slick-slide > div {
  height: 100%;
}
.gd-instagram--slider .gd-instagram__arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 67px;
  height: 150px;
  margin-top: -75px;
  padding: 0;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: 0;
  cursor: pointer;
  /* Wie im Veranstaltungskarussell ruecken die Pfeile hier etwas naeher. */
}
.gd-instagram--slider .gd-instagram__arrow--prev {
  left: -85px;
  background-image: url("/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/slider_arrow_left.png");
}
.gd-instagram--slider .gd-instagram__arrow--next {
  right: -70px;
  background-image: url("/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/slider_arrow_right.png");
}
.gd-instagram--slider .gd-instagram__arrow.slick-disabled {
  opacity: 0.35;
  cursor: default;
}
.gd-instagram--slider .gd-instagram__arrow:focus {
  outline: 2px solid #000;
  outline-offset: 3px;
}
@media (min-width: 1024px) and (max-width: 1219px) {
  .gd-instagram--slider .gd-instagram__arrow--prev {
    left: -70px;
  }
  .gd-instagram--slider .gd-instagram__arrow--next {
    right: -70px;
  }
}
.gd-instagram--slider .slick-dots {
  display: none;
}
@media (max-width: 1023px) {
  .gd-instagram--slider {
    /* Fenster aus hoechstens fuenf Punkten. Die Breite setzt limitDots() in
       gd-instagram.js nach der gemessenen Punktbreite; overflow schneidet die
       uebrigen ab, waehrend die Reihe darunter weiterwandert. */
  }
  .gd-instagram--slider .slick-dots {
    display: block;
    position: static;
    overflow: hidden;
    margin: 14px auto 0;
    padding: 0;
    white-space: nowrap;
    text-align: left;
    /* Nimmt den Leerraum zwischen den inline-block-Punkten heraus, damit die
       Fensterbreite genau fuenf Schritten entspricht. */
    font-size: 0;
    /* Wie im Vorbild: Groesse und Deckkraft werden uebergeblendet.
       Weiss, weil die Punkte hier auf dem dunkelgrauen Hintergrund stehen -
       das Slick-Thema liefert sonst Schwarz auf #434343 und damit praktisch
       keinen Kontrast. */
    /* Nicht blasser: der Punkt bleibt bedienbar und soll die 3:1 fuer
       grafische Bedienelemente halten. */
  }
  .gd-instagram--slider .slick-dots li {
    float: none;
    display: inline-block;
    vertical-align: middle;
    /* Wandern der Reihe - der Versatz kommt aus limitDots(). */
    transition: transform 0.3s ease;
  }
  .gd-instagram--slider .slick-dots li button::before {
    color: #fff;
    opacity: 0.5;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  .gd-instagram--slider .slick-dots li.slick-active button::before {
    opacity: 1;
  }
  .gd-instagram--slider .slick-dots li.is-edge button::before {
    transform: scale(0.6);
    opacity: 0.45;
  }
  .gd-instagram--slider .slick-dots li.is-outside button::before {
    transform: scale(0.4);
    opacity: 0;
  }
}
.gd-instagram--slider .gd-instagram__slide {
  padding-bottom: 40px;
  background: url("/typo3conf/ext/mq_layout_nationalpark/Resources/Public/Images/main/layout/bg_eventbox.png") no-repeat bottom;
}
.gd-instagram--slider .gd-instagram__post {
  border: 0;
  border-radius: 0;
}
.gd-instagram--slider .gd-instagram__wall-link {
  margin-top: 24px;
}

/* ==========================================================
   Social Wall

   grid-auto-rows ist absichtlich klein: gd-instagram.js rechnet die Höhe jeder
   Kachel in eine Zeilenspanne um, dadurch entstehen keine Lücken. Ohne
   JavaScript bleibt die Fallback-Spanne aus &__wall-item stehen.
   ========================================================== */
.gd-instagram--wall .gd-instagram__wall {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  grid-auto-rows: 8px;
  /* Kacheln behalten ihre Inhaltshöhe, statt auf die Zeile gedehnt zu werden. */
  align-items: start;
  gap: 16px;
  margin: 0 !important;
  padding: 0;
  list-style: none !important;
}
.gd-instagram--wall .gd-instagram__wall-item {
  grid-row-end: span 40;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.gd-instagram--wall .gd-instagram__wall-item--hidden {
  display: none;
}
.gd-instagram--wall .gd-instagram__more {
  margin-top: 24px;
  /* Abstand zum folgenden Inhaltselement - der Button sass sonst direkt auf
     dessen Oberkante. */
  margin-bottom: 40px;
  text-align: center;
}

@media (max-width: 767px) {
  .gd-instagram--wall .gd-instagram__wall {
    grid-template-columns: 1fr;
  }
}
/* ==========================================================
   Dialog

   Magnific Popup liefert Fokusfalle, ESC und Schließen-Button. Hier nur Layout.
   ========================================================== */
.gd-instagram-overlay {
  /* Bei type:'inline' setzt Magnific den Schließen-Button in den Inhalt - auf
     dem weißen Dialog wäre die Standardfarbe Weiß unsichtbar. Er bekommt daher
     eine eigene Fläche und sitzt über dem Medienbereich. */
}
.gd-instagram-overlay .mfp-content {
  max-width: 1000px;
  margin: 0 auto;
}
.gd-instagram-overlay .mfp-close {
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  opacity: 1;
  text-align: center;
  font-size: 24px;
}
.gd-instagram-overlay .mfp-close:hover {
  background: rgba(0, 0, 0, 0.8);
}
.gd-instagram-overlay .mfp-close:focus {
  outline: 2px solid #000;
  outline-offset: 3px;
  outline-color: #fff;
}

.gd-instagram__dialog {
  display: flex;
  background: #fff;
  border-radius: 4px;
  overflow: hidden;
  /* Feste Hoehe statt Hoehe aus dem Inhalt: sonst bestimmt die laengere der
     beiden Spalten die Hoehe und in der Medienspalte bleibt unter dem Bild
     schwarze Flaeche stehen. max-height deckelt auf grossen Schirmen. */
  height: 80vh;
  max-height: 760px;
  /* Platz für den Schließen-Button, der sonst auf dem Kanal-Symbol liegt. */
  /* Unscharfe Kopie des Mediums fuellt den Rest der Flaeche, damit neben einem
     Hochformat kein leerer schwarzer Streifen steht. Bei einem Video ist es das
     Standbild. Fuer Videos innerhalb einer Bildstrecke liefert Instagram kein
     Standbild - dort bleibt es schwarz. */
}
.gd-instagram__dialog .gd-instagram__dialog-media {
  flex: 1 1 55%;
  min-width: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #000;
}
.gd-instagram__dialog .gd-instagram__head {
  padding-right: 56px;
}
.gd-instagram__dialog .gd-instagram__dialog-body {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  min-width: 0;
  /* Der Beitragstext scrollt, nicht der ganze Dialog. Die Hoehe kommt vom
     Dialog; min-height:0 ist noetig, sonst waechst ein Flex-Kind ueber seinen
     Container hinaus statt zu scrollen. */
  height: 100%;
  min-height: 0;
}
.gd-instagram__dialog .gd-instagram__text {
  flex: 1 1 auto;
  min-height: 0;
  padding: 14px;
  overflow-y: auto;
  line-height: 1.5;
  /* Instagram-Texte enthalten sehr lange URLs. */
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.gd-instagram__dialog .gd-instagram__dialog-actions {
  margin: 0;
  padding: 14px;
  border-top: 1px solid #d5d6d1;
}
.gd-instagram__dialog .gd-instagram__slide-media {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  overflow: hidden;
}
.gd-instagram__dialog .gd-instagram__slide-media img,
.gd-instagram__dialog .gd-instagram__slide-media video {
  position: relative;
  z-index: 1;
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  margin: 0 auto;
  object-fit: contain;
}
.gd-instagram__dialog .gd-instagram__slide-bg {
  position: absolute;
  /* Ueber den Rand hinaus, sonst wird der weiche Rand des Blurs als heller
     Saum sichtbar. */
  top: -8%;
  right: -8%;
  bottom: -8%;
  left: -8%;
  z-index: 0;
  background-position: center;
  background-size: cover;
  filter: blur(28px);
  opacity: 0.55;
  pointer-events: none;
}
.gd-instagram__dialog .gd-instagram__media-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 36px;
  height: 36px;
  margin-top: -18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
.gd-instagram__dialog .gd-instagram__media-arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 9px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.gd-instagram__dialog .gd-instagram__media-arrow--prev {
  left: 10px;
}
.gd-instagram__dialog .gd-instagram__media-arrow--prev::before {
  transform: translate(-30%, -50%) rotate(-135deg);
}
.gd-instagram__dialog .gd-instagram__media-arrow--next {
  right: 10px;
}
.gd-instagram__dialog .gd-instagram__media-arrow--next::before {
  transform: translate(-70%, -50%) rotate(45deg);
}
.gd-instagram__dialog .gd-instagram__media-arrow.slick-disabled {
  opacity: 0.3;
}
.gd-instagram__dialog .gd-instagram__media-arrow:focus {
  outline: 2px solid #000;
  outline-offset: 3px;
  outline-color: #fff;
}
.gd-instagram__dialog .gd-instagram__carousel {
  position: relative;
  margin-bottom: 0;
  width: 100%;
  height: 100%;
  /* Slick setzt keine Hoehe; ohne diese Kette kollabieren die Slides und das
     Medium liesse sich nicht mittig setzen. Das innere div stammt von Slick
     selbst (Option "rows" steht auf dem Standardwert 1). */
}
.gd-instagram__dialog .gd-instagram__carousel .slick-list,
.gd-instagram__dialog .gd-instagram__carousel .slick-track {
  height: 100%;
}
.gd-instagram__dialog .gd-instagram__carousel .slick-slide {
  height: 100%;
}
.gd-instagram__dialog .gd-instagram__carousel .slick-slide > div {
  height: 100%;
}

@media (max-width: 767px) {
  .gd-instagram__dialog {
    flex-direction: column;
    height: auto;
    max-height: 90vh;
    overflow-y: auto;
    /* Untereinander scrollt der ganze Dialog, nicht der Textbereich.

       Dazu duerfen die Kinder nicht schrumpfen: max-height am Dialog laesst
       Flex sonst jedes Kind bis zu seiner Mindesthoehe zusammendruecken - der
       Textbereich wurde auf unter 90px gequetscht, und weil er hier
       overflow:visible hat, lief sein Inhalt sichtbar ueber den Button
       darunter. Mit flex-shrink:0 wachsen sie stattdessen ueber die
       max-height hinaus, und der Dialog scrollt. */
  }
  .gd-instagram__dialog .gd-instagram__dialog-media {
    flex: 0 0 auto;
    height: 60vh;
  }
  .gd-instagram__dialog .gd-instagram__dialog-body {
    flex: 0 0 auto;
    height: auto;
    max-height: none;
  }
  .gd-instagram__dialog .gd-instagram__text {
    flex: 0 0 auto;
    /* Hebt das min-height:0 der Desktop-Regel auf. */
    min-height: auto;
    overflow-y: visible;
  }
  .gd-instagram__dialog .gd-instagram__head,
.gd-instagram__dialog .gd-instagram__dialog-actions {
    flex: 0 0 auto;
  }
}