@charset "UTF-8";

:root {

	--main-color:#124a66;
	--main-color2:#124a66;
	--main-color-light:#febb27;
  --main-color-extralight: #c9e6f8;
	--bg-color:#fff;
	--bg-color-light:rgba(255, 255, 255,.6);
	--bg-color-dark:rgba(0, 0, 0,.2);
  --bg-contrast:#f4f2ef;
  --bg-contrast2:#ffffffbb;
  --bg-contrast3:#f4f6fd;
  --bg-contrast-light:#F3F4F6;
  --bg-contrast-dark:#d5d9df;
	--hdbar-color:#ECECED;
	--header-bg:#fff;
  --footer-color:#123a4e;
  --gradient-loader:linear-gradient(130deg, #c9c9c9, #ffffff, #c9c9c9);

  --scrollbar1:#aeb2b8;
  --scrollbar2:#e1dcd9;
	--font-color:#2b2b2d;
	--titel-color:#111;
  --titel-bg:rgba(255, 255, 255, 1);
  --titel-box-hover:#fff;

	--png-invert:0;
	--png-invert-reverse:1;
  --color-opacity:1;
  --border-radius:14px;

  --toast-success:#00c520;
  --toast-error:#eb213c;
  --toast-note:#777979;

  --bg-community:#d6f4dc;
  --bg-wetter:#cde7ff;

  --social-fb:#599afd;
  --social-fb-light:#d6edff;
  --social-wa:#34dd80;
  --social-wa-light:#c5ffca;
  --social-pt:#ff7696;
  --social-pt-light:#ffe6ec;
  --social-em:#efc743;
  --social-em-light:#fff2c8;


}

[data-theme="dark"] {

	--main-color:#36a7ec;
	--main-color2:#36a7ec;
	--main-color-light:#256891;
  --main-color-extralight: #164460;
	--bg-color:#252f3d;
	--bg-color-light:rgba(22, 27, 34,.7);
	--bg-contrast:#1d2834;
	--bg-contrast2:#1d283499;
	--bg-contrast3:#1d2834;
  --bg-contrast-light:#393d4d;
  --bg-contrast-dark:#4b5064;
	--hdbar-color:#122232;
	--header-bg:#2e363f;
  --gradient-loader:linear-gradient(130deg, #161b22, #2a2e36, #161b22);

  --scrollbar1:#45474e;
  --scrollbar2:#1B2B3A;
	--font-color:#ccc;
	--titel-color:#ddd;
  --titel-bg:#122232;
  --titel-box-hover:#1B2B3A;

  --social-fb:#0e3e69;
  --social-wa:#0b421b;
  --social-pt:#5c1a2a;
  --social-em:#392307;
  
	--png-invert:1;
	--png-invert-reverse:0;
  --color-opacity:.75;

}









/* Layout Basics */

html, body, button, input, textarea {
	font-family:Inter, Arial, sans-serif;
  font-weight:400;
	font-size:10px;
}
html {
	box-sizing:border-box;
	min-height:101%;
	max-width:100%;
	-webkit-text-size-adjust:100%;
	text-size-adjust:100%;
  cursor:default;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:inherit; }
::selection { background:var(--main-color); color:#fff; }

*[contenteditable] { cursor:text; }
*[contenteditable]:focus { background:var(--main-color-extralight);outline:4px solid var(--main-color-extralight); }
*[contenteditable]:hover { outline:4px solid var(--main-color-extralight); }

body {
  text-rendering:optimizelegibility;
	letter-spacing:0.056rem;
	color:var(--font-color);
	margin:0;
	padding:0;
	background-color:var(--bg-color);
	max-width:100%;
	overflow-x:hidden;
}
@media all and (max-width:640px) {
	body {
		margin-top:60px;
	}
	html {
    font-size:9.5px;
	}
}
article, details, footer, header, main, menu, nav, section {
	display:block;
  max-width:100%;
}
audio, video {
	display:inline-block;
}
audio:not([controls]) {
	display:none;
	height:0;
}
button, input {
	overflow:visible;
}
button, select {
	text-transform:none;
}
textarea {
	overflow:auto;
}
[type="checkbox"],
[type="radio"] {
	box-sizing:border-box;
	padding:0;
}
hr {
	box-sizing:content-box;
	height:0;
	overflow:visible;
}
[disabled],
.disabled {
  cursor:default;
  opacity:.75;
  pointer-events:none;
}
a {
	outline:0;
	text-decoration:none;
	color:var(--font-color);
}
a:hover, a:focus, a:active {
	outline-width:0;
	text-decoration:underline;
  text-underline-position:under;
  text-decoration-thickness:1px;
}
.txtlink {
	text-decoration:underline;
  text-decoration-thickness:2px;
  text-decoration-color:var(--main-color-light);
}
.txtlink:hover, .txtlink:focus {
	text-decoration:none;
  background-color:var(--main-color-light);
  outline:2px solid var(--main-color-light);
  border-radius:6px;
}
b {
	font-weight:700 !important;
}
p {
  margin:0;
  font-size:1.5rem;
}
form {
	display:inline;
}
img, svg, picture, video {
	vertical-align:middle;
	border-style:none;
  border:0;
}
svg:not(:root) {
	overflow:hidden;
}






.dropdown {
  position: relative;
  display: inline-block;
  margin-top:-15px;
  margin-bottom:10px;
  width: 190px;
  font-size: 1.7rem;
  z-index: 3;
}

.selected {
  padding: 8px 20px;
  cursor: pointer;
  user-select: none;
}
.selected span {
  font-weight: 500;
  opacity: 0.5;
}

.arrow {
  width: 20px;
  height: 20px;
  padding: 2px;
  margin-left: 6px;
  margin-top: -2px;
  border-radius: 50%;
  background-color: #bbbbbbaa;
  opacity: 0.5;
  transition: transform 0.3s ease;
}

.dropdown:hover .arrow {
  transform: rotate(180deg);
}

.options {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  border-radius: 0px 0px 16px 16px;
  background-color: var(--bg-color);
  box-shadow:1px 6px 15px 1px rgba(0,0,0,0.15);
  transition: max-height 0.3s ease;
}

.dropdown:hover .options {
  max-height: 185px;
  overflow-y: auto;
  padding:5px 0 10px 0;
  border-top:3px solid var(--bg-contrast-dark);
}

.options li {
  text-align:left;
}
.options li.divider {
	margin-top:15px;padding:0 0 5px 31px;font-size:1.3rem;opacity:.4;background:#fff !important;border-bottom:1px solid var(--font-color);
}
.options li a {
  display: block;
  padding: 7px 10px;
  font-size: 1.4rem;
}
.options li a img {
  width:20px;
  height:20px;
  border-radius:50%;
  margin-right:5px;
  margin-top:-3px;
  transition: all 0.3s ease-out;
}

.options li:hover {
  background-color: var(--bg-contrast);
}
.options li:hover a img {
  scale:2.1;
  border-radius:0 6px 6px 0;
  margin-left:-3px;
  margin-right:16px;
  box-shadow:1px 4px 10px 1px rgba(0,0,0,0.15);
}

.options a {
  color: inherit;
  text-decoration: none;
  display: block;
}




.options::-webkit-scrollbar {
  width: 4px;
}
.options::-webkit-scrollbar-track {
  background-color: transparent;
}
.options::-webkit-scrollbar-thumb {
  background-color: #999;
  border-radius: 4px;
}
.options::-webkit-scrollbar-button {
  display: none;
}



.hdimg-container {
position: relative;
margin:-30px 0 0 0;
overflow:hidden;
}

.hdimg-container img {
height: 400px;
width: 100%;
object-fit: cover;
}

.hdimg-container::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 40%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .7));
z-index:0;
}

.hdimg-text {
position: absolute;
bottom: 30px;
left: 0;
right: 0;
color: white;
text-align: center;
font-size: 5rem;
font-weight:500;
text-shadow: 1px 1px 12px #000;
z-index:1;
}







.box-stadt {
display:block;
background:var(--bg-contrast);
outline:2px solid var(--bg-color);
border-radius:50px;
transition:all 200ms ease-out;
overflow:hidden;
position:relative;
cursor:pointer;
text-align:center;
}
.box-stadt img {
display:block;
width:100%;
height:240px;
overflow:hidden;
object-fit:cover;
border-radius:8px;
filter:brightness(105%) saturate(110%);
transition:all 300ms ease-out;
}
.box-stadt::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 40%;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .7));
border-radius:8px;
z-index:0;
}
.box-stadt span {
position:absolute;
bottom:15px;right:0;left:30px;
display:block;
text-align:center;
font-size:2.8rem;
color:#fff;
font-weight:500;
text-shadow:0px 0px 15px #000;
transition:all 200ms ease-out;
z-index:1;
}
.box-stadt span img {
display:inline-block;
opacity:0;
width:40px;
height:29px;
margin:20px 0 0 -10px;
rotate:-90deg;
border-radius:50%;
transition:all 300ms ease-out;
}

.box-stadt:hover span {
translate:0 -5px;
text-decoration:underline;
}
.box-stadt:hover img {
scale:1.15;
transform-origin:50% 5px;
filter:brightness(115%) saturate(110%);
}
.box-stadt:hover span img {
opacity:1;
filter:invert(1);
animation: pfeil 1s ease-in-out infinite;
}


@media all and (max-width:640px) {

  .box-stadt {
    margin-left:10px;
    margin-right:10px;
  }
  .box-stadt img {
    height:210px;
  }

}




  #play {
    background-image: url('images/ico_player_start.svg');
    }
    #pause {
    background-image: url('images/ico_player_pause.svg');
    }
    
    
    
    .btnlist {
      text-align:center;margin-bottom:40px;
    }
    .btnlist button {
      margin: 5px;border-radius:20px;
    }
    .btnlist img {
      width:18px;height:18px;margin:-3px 5px 0 0;opacity:.7;filter:invert(var(--png-invert));
    }



.box-sehenswertes {
display:block;
background:var(--bg-contrast);
outline:2px solid var(--bg-color);
border-radius:14px;
transition:all 200ms ease-out;
overflow:hidden;
position:relative;
cursor:pointer;
text-align:center;
}
.box-sehenswertes:focus {
  text-decoration: none;
}

.box-sehenswertes img {
display:block;
width:100%;
height:220px;
overflow:hidden;
object-fit:cover;
border-radius:8px 8px 0 0;
transition:all 300ms ease-out;
}

@media all and (max-width:640px) {
  .box-sehenswertes {
    margin-left:10px;
    margin-right:10px;
  }
  .box-sehenswertes img {
    height:200px;
  }
}

.box-sehenswertes .span1 {
display:inline-block;
padding:10px 8px 10px 19px;
margin-left:8px;
border-radius:18px;
text-align:center;
font-size:1.7rem;
font-weight:500;
transition:all 200ms ease-out;
}
.box-sehenswertes.sm .span1 {
  font-size:1.6rem;
}
.box-sehenswertes .span1 img {
display:inline-block;
margin:-3px 0 0 3px;
opacity:0;
padding:2px;
width:16px;
height:16px;
transition:all 800ms ease-out;
}
.box-sehenswertes .span2 {
display:block;
margin-top:-8px;
padding:0 3px 10px 3px;
text-align:center;
font-size:1.4rem;
font-weight:400;
opacity:.5;
transition:all 500ms ease-out;
}

.box-sehenswertes .mlicon {
  display:none;position:absolute;top:15px;right:15px;z-index:2;width:26px;height:26px;background:rgba(255,255,255,.6);border-radius:50%;padding:6px;
  transition:all 200ms ease-in-out;
}
.box-sehenswertes .mlicon.aufmerkliste {
  display:block;
  background:rgba(35, 255, 6, 0.7);
}
.box-sehenswertes:hover .mlicon {
  display:block;
}
.box-sehenswertes .mlicon:hover {
  background:rgba(255,255,255,1);
  scale:1.5;
}
.box-sehenswertes .mlicon.aufmerkliste:hover {
  background:rgba(250, 75, 75, 0.7);
  scale:1.5;
}

.box-sehenswertes .in-preislevel {
  position:absolute;background:var(--bg-contrast);padding:2px 4px 2px 6px;border-radius:10px 0 0 10px;font-size:1.3rem;height:19px;bottom:90px;right:0px;
  transition:all 500ms ease-in-out;
}
.box-sehenswertes .in-preislevel span {
  opacity:.4;
}
.box-sehenswertes:hover .in-preislevel {
  right:-80px;
}

.in-distanz {
  position:absolute;background:var(--bg-contrast);padding:2px 8px;border-radius:10px 10px;font-size:1.2rem;height:19px;bottom:67px;right:50%;transform: translateX(50%);vertical-align:middle;
  transition:all 500ms ease-out;
}
.box-sehenswertes:hover .in-distanz {
  translate:0 -5px;
}

.in-top {
  position:absolute;max-width:140px;padding:10px 20px 7px 20px;border-radius:0 0 20px 20px;font-size:1.4rem;color:#fff;font-weight:400;top:0px;right:50%;transform: translateX(50%);vertical-align:middle;background-size: 300% 100%;background-image: linear-gradient(to right, #25aae1dd, #4481ebdd, #04befe, #3f86edee);backdrop-filter:blur(3px);outline:2px solid var(--bg-color);
  transition:all 300ms ease-out;
}
.in-top img {
  display:inline-block;width:18px;height:18px;filter:invert(1);margin:-2px 8px 3px 8px;
}
.box-sehenswertes:hover .in-top {
  background-position: 100% 0;
  top:10px;border-radius:20px;
  padding-top:20px;
  padding-bottom:10px;box-shadow: #33333333 2px 2px 30px;
}
.box-sehenswertes:hover .in-top img {
  filter:invert(1);margin:-3px 8px 8px 8px;
  animation: pfeilud 800ms ease-in-out;
}

.in-offen {
  position:absolute;background:var(--bg-contrast);padding:2px 6px 2px 4px;border-radius:10px 0 0 10px;font-size:1.3rem;height:19px;bottom:67px;right:0px;vertical-align:middle;
  transition:all 500ms ease-out;
}
.in-offen div {
  display:inline-block;height:10px;width:10px;margin:0 3px 0 1px;border-radius:50%;
  animation: dotbounce 2s ease-in-out infinite;
}
.box-sehenswertes:hover .in-offen {
  border-radius:10px;right:50%;transform:translateX(calc(50% + 5px));
}

.in-preiswert {
  position:absolute;background:var(--bg-contrast);padding:3px 6px 4px 6px;border-radius:10px 0 0 10px;font-size:1.2rem;height:22px;bottom:67px;right:0px;vertical-align:middle;
  transition:all 400ms ease-out;
}
.in-preiswert img {
  display:inline-block;height:24px;width:24px;margin:-4px 1px 0 -2px;opacity:.8;
  animation: dotrotate 2s ease-in-out infinite;
  transition:all 500ms ease-out;
}
.box-sehenswertes:hover .in-preiswert {
  background:transparent;
  border-radius:10px;right:50%;transform:translateX(calc(50% + 5px));
}
.box-sehenswertes:hover .in-preiswert  img {
  opacity:1;
  scale:1.3;
  translate: 0 7px;
  animation: none;
}
.box-sehenswertes:hover .in-preiswert  span {
  display:none;
}

.box-sehenswertes:hover {
text-decoration:none;
background:var(--bg-color);
}
.box-sehenswertes:hover img {
scale:1.28;
transform-origin:50% 5px;
filter:brightness(110%) saturate(110%);
}
.box-sehenswertes:hover .span1 {
scale:1;
translate:0 0;
background:var(--bg-contrast);
}
.box-sehenswertes:hover .span1 img {
opacity:1;
animation: pfeil 1s ease-in-out infinite;
}
.box-sehenswertes:hover .span2 {
translate:0 20px;
opacity:0;
}
@keyframes dotbounce {
0% { scale:1; }
50% { scale:1.33; }
100% { scale:1; }
}
@keyframes dotrotate {
  0% { scale:1; }
  50% { scale:.7; }
  100% { scale:1; }
}
@keyframes pfeil {
0% { translate:0 0; }
50% { translate:5px 0; }
100% { translate:0 0; }
}
@keyframes pfeilud {
0% { translate:0 0; }
20% { translate:0 9px; }
45% { translate:0 -4px; }
65% { translate:0 4px; }
100% { translate:0 0; }
}

.rubtitel {
display:block;
font-size:2.3rem;
font-weight:500;
margin:70px 0 30px 0;
text-align:center;
}

.subtitel {
  display:block;
  opacity:.7;
  font-size:3.5rem;
  font-weight:500;
  padding:0 40px;
  margin:70px 0 30px 0;
  text-align:center;
}
.subtitel.start {
  font-size:2.8rem;
}
@media all and (max-width:640px) {
  .subtitel.start {
    font-size:2.4rem;
  }
}

#filterForm {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
  gap: 10px;
}
#filterForm select {
font-size: 1.6rem;
padding: 5px 15px;
border-radius: 8px;
border: 1px solid var(--bg-contrast-dark);
background-color: rgba(255, 255, 255,.7);
appearance: none;
background-image: url('../../images/ico_down.svg');
background-repeat: no-repeat;
background-position: right 10px center;
padding-right: 40px;
outline:0;
}
#filterForm select:hover {
  background-color: rgba(222, 222, 222,.7);
}
@media all and (max-width:640px) {

  #filterForm {
    display:block;
    text-align:center;
    margin-right:10px !important;
    margin-left:10px !important;
  }
  #filterForm select {
    scale:.85;
  }
}

.seheninfobox {
  padding:10px 0;
}
.seheninfobox span {
  display:block;margin:15px 0 10px 0;padding-bottom:5px;opacity:.5;font-size:1.7rem; font-weight:500;
  border-bottom:1px solid #77777799;
}
.seheninfobox a {
  margin:10px 0 20px 0;
}


.copyright-container {
  position: relative;
  height: auto;
  border-radius: 8px;
  -webkit-user-select:none;
  user-select:none;
}

.copyright-container.sm {
  height: 229px;
}
.copyright-symbol {
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  padding: 0px;
  font-size: 1.3rem;
  text-align:center;
  height:26px;
  width:26px;
  cursor: pointer;
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index:1;
}
.copyright-symbol.b2, .copyright-symbol.b3 {
  scale:.85;
  bottom: 8px;
  right: 8px;
}
.copyright-symbol:hover {
  background-color: rgba(255, 255, 255, 0.8);
}

.copyright-hint {
  display: none;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 16px;
  padding: 0px 10px;
  font-size: 1.1rem;
  height:26px;
  position: absolute;
  bottom: 10px;
  right: 40px;
  white-space: nowrap;
  z-index:1;
}
.copyright-hint.b2, .copyright-hint.b3 {
  scale:.85;
  bottom: 8px;
  right: 20px;
}

.sehenswert-img {
  width: 100%;
  height: 550px;
  object-fit: cover;
  overflow: hidden;
  border-radius: 8px;
}

@media all and (max-width:640px) {
  .copyright-container {
    margin-left:10px;
    margin-right:10px;
    margin-bottom:10px;
    height: 260px;
  }
  .sehenswert-img {
    height: 260px;
  }
  .gridr {
    margin-left:10px;
  }
  .janeinliste {
    grid-template-columns: 1fr 1fr !important;
    margin-top:10px;
    margin-bottom:30px;
    margin-left:20px;
    margin-right:20px;
  }
  .janeinliste div {
    margin-bottom:-10px !important;
  }
  .opening-hours {
    width:calc(100% - 10px);
    margin-right:10px;
    margin-left:10px;
  }
  .seheninfobox {
    margin-bottom:10px;
  }
}

.copyright-container.sm .sehenswert-img {
  height: 229px;
}


.artikel {
  max-width:750px;
  margin:50px auto 30px auto;
  font-size:2rem;
  line-height:2.9rem;
}
.artikel p {
  font-size:2rem;
  line-height:2.9rem;
  margin:20px 0;
}
@media all and (max-width:640px) {

  .artikel {
    padding:0 10px;
    font-size:1.8rem;
    line-height:2.7rem;
  }
  .artikel ol {
    font-size:1.8rem;
    line-height:2.7rem;
    margin-left:20px;
  }
  .artikel p {
    font-size:1.8rem;
    line-height:2.7rem;
    margin:20px 0;
  }
}


.janeinliste div {
  text-align:center;
  font-size:1.4rem;
  color:#00c520;
  background:var(--bg-contrast);
  padding:10px 0;
  border-radius:8px;
}
.janeinliste div.nein {
  text-align:center;
  color:#eb213c;
  opacity:.8;
  scale:.9;
}
.janeinliste div.nein span, .janeinliste div.nein img:last-of-type {
  opacity:.5;
}
.janeinliste div img:first-of-type {
  width:50px;height:50px;margin-bottom:6px;
  background:var(--bg-color);padding:10px;border-radius:20px;
}
.janeinliste div img {
  width:16px;height:16px;margin:-2px 3px 0 0;
}


.opening-hours {
  padding:12px 7px;height:205px;
  display: flex;
  flex-direction: column;
}

.day {
  display: flex;
  justify-content: left;
  padding:3px 8px;
  border-radius:12px;
}
.day:nth-child(even) {
  background-color: var(--bg-color);
}
.day.current-day {
  background-color: rgb(103, 221, 103);
  color:#fff;
  scale:1.07;
}
.day.current-day.closed-day {
  background-color: rgb(249, 133, 133);
}
.day-name {
  width: 110px;
  font-size:1.5rem;
  text-align:left;
  padding:1px 3px;
  opacity:.5;
}
.day-times {
  font-size:1.5rem;
  text-align:left;
}


.day.current-day .day-name, .day.closed-day .day-name {
  opacity:.8;
}







.btn-hover {
  display:inline-block;text-align:center;font-size:1.6rem;color:#fff;padding:10px 20px;border-radius:30px;background-size: 300% 100%;cursor: pointer;border:0;
  transition: all 400ms ease-in-out;
}
.btn-hover.c1 {
  background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
  background-image: linear-gradient(to right, var(--main-color), var(--main-color), #30dd8a, var(--main-color));
}
.btn-hover.c2 {
  background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
}
.btn-hover.c3 {
  background-image: linear-gradient(to right, var(--main-color), var(--main-color), var(--main-color), var(--main-color-light), var(--main-color), var(--main-color), var(--main-color));
}
.btn-hover img {
  width:22px;height:22px;margin:-3px 8px 0 0;filter:invert(1);transition: all 400ms ease-in-out;
}
.btn-hover.c3 img {
  width:30px;height:18px;margin:-2px -10px 0 0px;filter:invert(1);transition: all 400ms ease-in-out;
  animation: pfeil 1300ms ease-in-out infinite;
}

.btn-hover:hover {
  background-position: 100% 0;
  scale:.97;
  text-decoration: none;
  transition: all 400ms ease-in-out;
}
.btn-hover:hover img {
  translate:0 0;
  rotate:360deg;
  animation: pfeil 1300ms ease-in-out infinite;
}
.btn-hover.c2:hover img {
  translate:0 0;
  rotate:none;
}










.wintro {
	display:flex;
	flex-direction:row;
	width:calc(100% - 90px);
}
.wintro span{
	display:block;
	background-color:var(--bg-color-light);
	border-radius:var(--border-radius);
	text-align:center;
	padding:20px 60px;
	margin-bottom:30px;
	max-height:230px;
	overflow-y:auto;
	position: relative;
}
.wintro img {
	width:140px;
	margin-right:-50px;
	z-index:1;
}
.w-hero {
	background-color:rgba(0, 106, 255, 0.4);
	border-radius:var(--border-radius);
	min-height:300px;
	display:flex;
	flex-direction:column;
	justify-content: center;
	align-items:center;
	position: relative;
	overflow:hidden;
	filter:saturate(1.4);
	margin:0 0 20px 0;
	pointer-events:none;
}
.w-hero.wasser {
	margin-top:-5px;
	padding-top:10px;
	--mask:
	radial-gradient(20.59px at 50% 28.00px,#000 99%,#0000 101%) calc(50% - 20px) 0/40px 100%,
	radial-gradient(20.59px at 50% -18px,#0000 99%,#000 101%) 50% 10px/40px 100% repeat-x;
	-webkit-mask: var(--mask);
	mask: var(--mask);
}
.w-hero .span1 {
	font-weight:500;
	font-size:9rem;
	letter-spacing:-2px;
	color:#fff;
	margin-top:10px;
}
.w-hero .span2 {
	background-color:hsla(0, 0%, 0%, 0.1);
	padding:2px 5px;
	font-weight:500;
	font-size:1.8rem;
	color:#fff;
	margin-bottom:50px;
}
.w-hero .span4 {
	font-weight:500;
	font-size:1.6rem;
	color:#fff;
	text-align:center;
	margin:20px 0;
}
.grid-w {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:5px 0;
	align-items: center;
	margin:0 0 20px 0;
}
.grid-r {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:5px;
	width:100%;
	padding:0 5px;
}
.grid-p {
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:5px 0;
}
.grid-r-c {
	background-color:rgba(0,70,140,.15);
	border-radius:var(--border-radius);
	padding:10px 0;
}
.grid-r-0 {
	color:#fff;
	font-weight:500;
	font-size:2.5rem;
	text-align:center;
	padding:10px 0 5px 0;
	filter:brightness(1.1) drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.2));
}
.grid-r-1 {
	color:#fff;
	text-align:center;
	padding-top:5px;
}
.grid-r-2 {
	color:#fff;
	font-weight:500;
	font-size:1.1rem;
	text-align:center;
	padding-bottom:5px;
}
.grid-r-2 img {
	filter:invert(1);
	width:18px;
	height:18px;
	margin-bottom:-10px;
}
.grid-w-1 {
	height:30px;
	grid-column:span 2;
	padding:4px 3px 2px 3px;
	font-size:1.5rem;
	background-color:var(--bg-contrast);
	vertical-align:middle;
  border-radius:16px;
}
.grid-w-2 {
	height:30px;
	background-color:var(--bg-contrast);
	padding:4px 3px 2px 3px;
	margin:0 0 0 10px;
	text-align:center;
	vertical-align:middle;
	font-size:1.7rem;
  border-radius:16px;
}
.grid-w-1 img {
	width:24px;
	height:24px;
	vertical-align:middle;
	margin:-1px 4px 0 18px;
	filter:invert(var(--png-invert));
}
.p-tag {
	text-align:center;
	font-size:2.2rem;
	font-weight:500;
	padding-top:15px;
	border-top:1px solid rgba(255,255,255,.4);
}
.p-tag div {
	font-size:1.3rem;
	font-weight:400;
	margin-top:3px;
	opacity:.6;
}
.p-zeit {
	background-color:var(--bg-contrast);
	padding:5px 0 3px 0;
	font-size:1.3rem;
	text-align:center;
	border-top-left-radius:var(--border-radius);
	border-top-right-radius:var(--border-radius);
}
.p-prognose {
	color:#fff;
	padding:10px;
	border-bottom-left-radius:var(--border-radius);
	border-bottom-right-radius:var(--border-radius);
	text-align:center;
}
.p-prognose span {
	padding:2px 5px;margin-top:6px;border-radius:8px;font-size:1.2rem;opacity:.8;
}
.p-prognose span img {
	width:14px;height:14px;margin:-2px 1px 0 0;padding:0;
}
.p-prognose img {
	width:44px;
	height:44px;
	filter:invert(1) contrast(150);
}

@media all and (max-width:640px) {
	.wintro {
		width:100%;
		padding-right:10px;
	}
	.wintro span {
		border-radius:var(--border-radius) 0 0 0;
		margin-bottom:20px;
		padding:10px 15px 10px 30px;
		text-align:left;
		max-height:120px;
		-webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
		mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
	}
	.wintro img {
		width:90px;
		margin-right:-30px;
	}
	.w-hero {
		margin:0 10px 20px 10px;
	}
	.w-hero.wasser {
		margin:0 0 50px 0;
		border-radius:0;
	}
	.grid-w-1 {
		border-radius:0 var(--border-radius) var(--border-radius) 0;
	}
	.grid-w-2 {
		margin:0 10px 0 5px;
	}
}


.wetter-carousel {
	margin:5px 0 15px 0;
	padding:6px 0 10px 0;
	cursor:grab;
}
.wetterbox {
	margin:0 5px;
}
@media all and (max-width:640px) {
.wetter-carousel {
	-webkit-mask: linear-gradient(90deg, transparent, white 5%, white 95%, transparent);
	mask: linear-gradient(90deg, transparent, white 5%, white 95%, transparent);
}
  .wetter-cell {
    width:44%;
    counter-increment:wetter-cell;
  }
  .hoislider-prev-next-button.previous {
    display:none;
  }
  .hoislider-prev-next-button.next {
    display:none;
  }
  .p-tag {
	border-radius:0;
  }
}
@media all and (min-width:640px) {
  .wetter-cell {
    width:36%;
    counter-increment:wetter-cell;
  }
}
@media all and (min-width:1100px) {
  .wetter-cell {
    width:15%;
    counter-increment:wetter-cell;
  }
}

.prog-box {
	display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:10px;
	border-top:1px solid rgba(255,255,255,.4);padding-top:25px;
}
.prog-tag {
	display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;background-color:hsla(0, 0%, 0%, 0.09);border-radius:var(--border-radius);
}
.prog-tag .pt1 {
	background-color:rgba(50, 50, 50, 0.05);border-radius:var(--border-radius) 0 0 var(--border-radius);color:#fff;font-size:1.9rem;font-weight:500;padding:38px 15px 0 0;height:120px;text-align:right;
}
.prog-tag .pt1 div {
	font-size:1.3rem;font-weight:400;margin-top:3px;opacity:.6;
}
.prog-tag .pt3 {
	color:#fff;font-size:1.3rem;background-color:rgba(50, 50, 50, 0.05);border-radius:0 var(--border-radius) var(--border-radius) 0;padding:22px 0 0 15px;
}
.prog-tag .pt3 div {
	margin-top:3px;
}

@media all and (max-width:900px) {
	.prog-box {
		grid-template-columns:1fr;margin:10px;
	}
	.prog-tag .pt1 {
		font-size:1.5rem;padding:43px 15px 0 0;
	}
	.prog-tag .pt1 div {
		font-size:1.2rem;
	}
	.prog-tag .pt3 {
		font-size:1.1rem;padding:25px 0 0 10px;
	}
}










/* Grid */

.s2-grid { display:grid; }
.s2-grid.am { display:grid; grid-template-columns: repeat(2,1fr); gap:20px; margin-bottom:20px; }
@media (min-width:1000px) {
  .s2-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:20px; margin-bottom:20px; }
  .s2-lg { grid-column: span 2; }
}
.s2-grid.tbl { display:grid; grid-template-columns: repeat(2,1fr); gap:0px; }
.s2-grid.tbl div { padding:4px 6px; background:var(--bg-color); margin-top:10px; }
.s2-grid.tbl div:nth-child(odd) p { opacity:.7; }

.s3-grid { display:grid; grid-template-columns: repeat(1,1fr); gap:0px; margin:0 10px; }
  @media (min-width:1000px) {
    .s3-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:30px; margin:0; }
    .s3-grid.fp { gap:40px; }
    .s3-lg { grid-column: span 2; }
}

.s4-grid { display:grid; grid-template-columns: repeat(1,1fr); gap:0px; margin:0 20px; }
.s4-grid.mzwei { display:grid; grid-template-columns: repeat(2,1fr); gap:10px; margin:0px; }
  @media (min-width:1000px) {
    .s4-grid, .s4-grid.mzwei { display:grid; grid-template-columns: repeat(4,1fr); gap:20px; margin:0; }
    .s4-lg { grid-column: span 2; }
    .s4-xl { grid-column: span 3; }
}

.s5-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:0 10px; margin:0 20px; }
  @media (min-width:1000px) {
    .s5-grid, .s5-grid.mzwei { display:grid; grid-template-columns: repeat(7,1fr); gap:30px 0; margin:0 auto; max-width:1250px; }
    .s5-lg { grid-column: span 2; }
    .s5-xl { grid-column: span 3; }
}



.mgrid {
  display: grid;
  grid-gap: 30px;
  grid-template-columns: repeat(auto-fill, minmax(30%,1fr));
  grid-auto-rows: 30px;
  margin-bottom:30px;
}
.mgrid.fp {
  display: grid;
  grid-template-columns:1fr;
  grid-gap: 20px;
  margin-bottom:20px;
}
@media all and (max-width:640px) {
    .mgrid {
        grid-template-columns:1fr;
        grid-gap: 20px;
        margin-bottom:20px;
    }
}



.netzwerk-grid-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  max-width: 800px;
  margin: 30px auto;
}

.netzwerk-grid-item {
  display: flex;
}

.netzwerk-grid-item img {
  height: 40px;
  width: auto;
  display: block;
}

@media (min-width: 768px) {
  .netzwerk-grid-item a {
    opacity:.85;
    filter:saturate(90%);
    transition: all 400ms ease-in-out;
  }
  .netzwerk-grid-item a:hover {
    opacity:1;
    scale:1.2;
    filter:saturate(120%) brightness(110%);
  }
}

@media (max-width: 768px) {
  .netzwerk-grid-container {
      grid-template-columns: repeat(2, 1fr);
  }
  .netzwerk-grid-item {
      justify-content: center;
  }
}




/* Layout Allgemein */



.ccbx {
  background:var(--bg-color);
  padding:12px;
  transition:all 0.4s;
}
.ccbx div .btoe,
.ccbx .gradient-load,
.ccbx .gradient-load img,
.ccbx center .flogo {
  transition:all 0.4s;
}
.ccbx div .btoe {
  transform-origin: bottom right;
}
.ccbx:hover {
  box-shadow:1px 6px 15px 1px rgba(0,0,0,0.15);
}
.ccbx:hover .gradient-load {
  scale:1.02;
  translate:0 -1px;
}
.ccbx:hover center .flogo {
  scale:1.4;
}
.ccbx:hover div .btoe {
  background:var(--bg-color) !important;
  color:var(--font-color);
  scale:1.06;
}
.ccbx:hover .gradient-load img {
  filter:brightness(110%);
}
.ccbx.nopd {
  margin:10px 0 !important;
}
@media all and (max-width:640px) {
  .ccbx {
    margin:0 10px;
  }
}


.nfbx {
  background:var(--bg-contrast);padding:25px 20px 30px 20px;margin-bottom:10px;font-size:1.7rem;transition:all 0.3s;
}
.nfbx.link:hover {
  text-decoration:none;background:var(--bg-contrast-dark);scale:1.04;
}
.nfbx span {
  display:block;font-size:2.2rem;font-weight:400;opacity:.5;margin-bottom:20px;
}
.nfbx span img {
  width:28px;height:28px;margin:-5px 5px 0 0;opacity:.9;filter:invert(var(--png-invert));
}

@media all and (min-width:640px) {
.addbtn {
  float:right;
}
}
@media all and (max-width:640px) {
.addbtn {
  display:block;
  width:100%;
  text-align: center;
  padding-top:10px;
  margin-bottom:-50px;
}
}

.cont {
  position:relative;
	margin:30px auto;
  padding:0 15px;
	min-width:300px;
	max-width:1200px;
  font-size:1.6rem;
	text-align:left;
}
.maincont {
  margin-top:65px;
}
.innercont {
  padding-top:10px;
}
.innercont.zt {
  margin-top:40px;
}
.innercont h1 {
  padding-bottom:20px;
  font-size:3rem;
  font-weight:500;
  text-align:center;
}
.innercont h1.inverse {
  color:#fff;
  opacity:0.9;
}
@media all and (max-width:640px) {
	.cont {
    margin:10px auto;
		padding:0 !important;
	}
  .innercont {
    margin-top:70px;
  }
  .innercont.zt {
    margin-top:40px;
  }
  .innercont.lmg {
    margin-top:20px;
  }
	#slider-mobile {
		margin:0 15px 0 15px !important;
	}
}

.innercont-menu a {
  padding:8px 9px 8px 5px;
  border-radius:6px;
}
.innercont-menu img {
  width:24px;
  height:24px;
  margin:-2px 5px 0 0;
  filter:invert(var(--png-invert));
}
.innercont-menu a:hover {
  background:rgba(125,125,125,.08);
}
.innercont-menu a.active {
  font-weight:700;
  background:rgba(125,125,125,.08);
}
.innermenu {
  display:grid;
}
@media all and (max-width:640px) {
  .innermenu {
    grid-template-columns: repeat(2,1fr);
  }
  .innercont-menu a {
    padding:6px 6px 6px 4px;
    font-size:1.2rem;
  }
  .innercont-menu img {
    width:20px;
    height:20px;
  }
}

.breadcrumbs {
  margin:0 0 20px 0;font-size:1.4rem;
}
.breadcrumbs div {
  align-items:center;
  border-radius:12px;
  display:inline-block;
  font-size:1.4rem;
  max-width:100%;
  padding:5px 7px 3px 7px;
  height:26px;
  margin-bottom:6px;
  text-decoration:none;
  vertical-align:baseline;
  cursor:pointer;
  white-space: nowrap;
  transition: all 200ms ease-out;
}
.breadcrumbs a {
  text-decoration:none;
  opacity:.6;
}
.breadcrumbs div.last {
  background:var(--bg-contrast);
  margin:0 6px;
}
.breadcrumbs div.last.iv {
  background:var(--bg-color);
}
.breadcrumbs div:hover {
  background:var(--bg-contrast) !important;
  translate:2px 0;
}
.breadcrumbs div.iv:hover {
  background:var(--bg-color) !important;
  translate:2px 0;
}
.breadcrumbs img {
  height:22px;margin:-2px 7px 0 0;opacity:1;
  transition: all 300ms ease-out;
}
.breadcrumbs a:hover img {
  scale:1.2;opacity:1;
}
.breadcrumbs span {
  opacity:.4;
}

.breadcrumbs.invert, .breadcrumbs.invert div a {
  color:#fff !important;
}
.breadcrumbs.invert div img {
  filter:invert(1);opacity:.8;
}









.pagination-container {
  display: flex;
  justify-content: center;
  margin: 4rem 0;
  width: 100%;
}

.pagination {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 0.5rem;
}

.pagination-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  height: 4rem;
  padding: 0.5rem;
  border-radius: 20px;
  background-color: var(--bg-contrast);
  text-decoration: none;
  transition: all 0.2s ease;
  font-size: 1.3rem;
}

.pagination-button.ctr {
  padding: 0.5rem 1.5rem;
  background-color: transparent;
}

.pagination-button:hover {
  text-decoration: none;
  background-color: var(--bg-contrast3);
}

.pagination-button.active {
  background-color: var(--main-color);
  color: white;
}

.pagination-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  color: #495057;
  font-weight: bold;
}

@media (max-width: 768px) {
  .pagination-button, .pagination-dots {
      display:none;
  }
  .pagination-button.ctr {
    display:flex;
    background-color: var(--bg-contrast-light);
  }
}






.box_magazin {
  position: relative;
  display: flex;
  display:block;
  align-items: center;
  text-decoration:none !important;
}
.box_magazin .imgmain {
  width:100%;height:220px;border-radius:30px;transition:all 0.3s;object-fit:cover;object-position:center;
  border:4px solid transparent;transform-origin: top;
}
.box_magazin .imgmain.round {
  border-radius:80px;
}
.box_magazin .icomain {
  width: 80px;
  height: 80px;
  background-color: #f8efce;
  border-radius: 44%;
  display: block;
  margin: 0 auto 4px auto;
  padding: 10px;
  border: 4px solid transparent;
  object-fit: cover;
  object-position: center;
  transition: all 0.3s;
}
.box_magazin .imgmain.katland {
  height:280px;
  border-radius:30px 30px 90px 30px;
  border-radius:90px;
}
.box_magazin.klein .imgmain {
  height:170px;
  margin-top:15px;
}
.box_magazin.klein.rr .imgmain {
  height:100px;
  margin:15px 5px 0 5px;
}
.box_magazin .imgflag, .box_magazin .imgflag2 {
  position: absolute;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  bottom: 80px;
  right: 1px;
  background: white;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
  transition:all 0.5s;
}
.box_magazin .imgflag2 {
  width: 34px;
  height: 34px;
  top:172px;
  right:14px;
}
.box_magazin .mpretitel {
  font-size:1.4rem;font-weight:500;margin-top:-12px;margin-bottom:12px;opacity:.5;transition:all 0.4s;
}
.box_magazin.box_sehen.klein .mpretitel {
  font-size:1.3rem;margin-top:-10px;
}
.box_magazin .mtitel {
  font-size:1.9rem;line-height:2.6rem;font-weight:500;padding:5px 25px 5px 25px;border-radius:44px;transition:all 0.4s;
  border:4px solid transparent;
  background:transparent;
  outline:3px solid transparent;
}
.box_magazin .mtitel.inv {
  text-align:center;
}
.box_magazin .mstitel {
  padding:4px 20px 4px 30px;margin-bottom:10px;opacity:.6;line-height:2.3rem;transition:all 0.8s;
}
.box_magazin .mtitel.mkat {
  text-align:center;font-size:1.5rem;line-height:2.1rem;
}
.box_magazin.klein .mtitel {
  font-size:1.6rem;line-height:1.9rem;padding:5px 12px 5px 13px;text-align: center;border-radius:14px;
}
.box_magazin.klein.rr .mtitel {
  font-size:1.3rem;line-height:1.7rem;padding:5px 12px 5px 13px;text-align: center;
}
.box_magazin .mtitel.kleiner {
  hyphens: auto;
  padding:2px 5px 2px 5px !important;
}
.box_sehen .mtitel {
  text-align: center;
  padding:5px 0 5px 0;
}
.box_sehen .mpretitel {
  text-align: center;
}

@media (max-width:640px) {
.box_magazin .icomain {
  width:60px;
  height:60px;
}
.box_magazin .mtitel.mkat {
  font-size:1.4rem;line-height:1.9rem;padding:5px 0 5px 0;
}
.box_magazin.klein {
  margin:10px;
}
.box_magazin {
  margin-bottom:20px;
}
.box_sehen {
  margin-bottom:15px;
}
.box_magazin .mtitel {
  font-size:1.8rem;
}
.box_magazin .mtitel.inv {
  padding: 5px 0;
}
.box_magazin .imgmain.round {
  border-radius:50px;
}

.mzwei .imgmain {
  height:160px;
}
}


.mtitel-kat {
  position: absolute;
  bottom: 15px;
  left: 50%;
  text-align:center;
  transform: translate(-50%, 0);
  background: var(--bg-color);
  backdrop-filter: blur(5px);
  padding: 5px 15px;
  min-width:140px;
  border:1px solid white;
  border-radius: 44px;
  font-size: 1.4rem;
  font-weight: 500;
  line-height:1.8rem;
  z-index: 1;
  transition:all 0.4s;
}

@media (min-width:640px) {


.mtitel-kat {
  min-width:180px;
  font-size: 1.6rem;
  line-height:2.1rem;
}

.box_magazin {
  transition:all 0.2s;
}
.box_magazin:hover .mpretitel {
  opacity:0;
}
.box_magazin:hover .mtitel {
  translate: 0 -20px;scale:.9;
  border:4px solid var(--main-color);
  background: var(--main-color);
  box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.2);
  outline:3px solid var(--bg-color);
  color:#fff;
  padding:5px 25px 5px 25px;
}
.box_magazin:hover .mtitel-kat {
  translate: 0 -10px;
}
.box_magazin:hover .mstitel {
  translate: 0 -18px;scale:.95;
}
.box_magazin:hover .mtitel.mkat {
  border:4px solid #e5d59d;
  background: #e5d59d;
  color:#000;
}
.box_magazin.box_sehen:hover .mtitel {
  padding:5px 0 5px 0px;
  rotate:-2deg;
}
.box_magazin.klein:hover .mtitel {
  padding:5px 0 5px 0px;
}
.box_magazin:hover .mtitel:not(.kleiner)::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background-color: #fff;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 12H19M19 12L13 6M19 12L13 18' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  animation: shake 2s infinite ease-in-out;
  padding-left: 5px;
}
.box_magazin:hover .mtitel.mkat::after {
  background-color: #000;
}
.box_magazin:hover .imgmain {
  scale:1.05;
  border-radius:30px;
  filter:brightness(110%);
}
.box_magazin:hover .imgmain.katland {
  border-radius:70px;
  filter:brightness(100%);
}
.box_magazin:hover .icomain {
  scale:1.15;
  border-radius:30%;
}
.box_magazin:hover .imgflag, .box_magazin:hover .imgflag2 {
  bottom:77px;
  right:28px;
  scale:0.9;
  rotate:-200deg;
  opacity:0;
  filter:brightness(110%);
}
.box_magazin:hover .imgflag2 {
  top:210px;
  right:50px;
}
}


@keyframes shake {
  20%, 80% {
    translate: -5px;
  }
  50% {
    translate: 5px;
  }
}











.form-steps {
  display: block;
  width: 100%;
  position: relative;
  margin: 40px 0;
}
.form-steps:after {
  content: "";
  display: table;
  clear: both;
}
.form-steps__item {
  padding: 0;
  position: relative;
  display: block;
  float: left;
  width: 25%;
  text-align: center;
}
.form-steps__item-content {
  display: inline-block;
}
.form-steps__item-icon {
  background: var(--bg-contrast-dark);
  color: #fff;
  display: block;
  border-radius: 100%;
  text-align: center;
  width: 25px;
  height: 25px;
  line-height: 25px;
  margin: 0 auto 5px auto;
  position: relative;
  font-size: 13px;
  font-weight: 700;
  z-index: 2;
}
.form-steps__item-text {
  font-size: 11px;
  color: var(--bg-contrast-dark);
  font-weight: 500;
}
.form-steps__item-line {
  display: inline-block;
  height: 3px;
  width: 100%;
  background: var(--bg-contrast-dark);
  position: absolute;
  left: -50%;
  top: 12px;
  z-index: 1;
}
.form-steps__item--active .form-steps__item-icon {
  background: var(--main-color);
  color: #fff;
}
.form-steps__item--active .form-steps__item-text {
  color: var(--main-color);
}
.form-steps__item--active .form-steps__item-line {
  background: linear-gradient(to left, var(--main-color) 30%, var(--toast-success) 70%);
}
.form-steps__item--completed .form-steps__item-text {
  color: var(--toast-success);
}
.form-steps__item--completed .form-steps__item-icon {
  background: var(--toast-success);
  background-image: url(data:image/svg+xml;base64,PHN2ZyBkYXRhLW5hbWU9IkxheWVyIDEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDkuMTIgNyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTkuMTIgMS4wNkw4LjA2IDAgMy4xOCA0Ljg4IDEuMDYgMi43NiAwIDMuODIgMy4xOCA3bDUuOTQtNS45NHoiLz48L3N2Zz4=);
  color: transparent;
  background-size: 10px;
  background-repeat: no-repeat;
  background-position: center center;
  width: 25px;
  height: 25px;
  line-height: 25px;
}
.form-steps__item--completed .form-steps__item-line {
  background: var(--toast-success);
}






.subtxt {
  font-size:2.2rem !important;text-align:center;
}
@media all and (max-width:640px) {
  .subtxt {
    font-size:1.8rem !important;
    padding:20px;
  }
  .hrubrik {
    margin-top:-30px !important;
    margin-bottom:-30px !important;
  }
  .hresti {
    margin-top:-30px !important;
    margin-bottom:5px !important;
  }
  .hpreis {
    margin-bottom:-30px !important;
  }
  .ftxt {
    margin: 0 30px;
  }
}






.hr-text {
  line-height: 1em;
  position: relative;
  margin:25px 0 10px 0;
  outline: 0;
  border: 0;
  color: var(--font-color);
  font-size:1.3rem;
  font-weight:700;
  text-align: center;
  height: 1.5em;
  opacity:.8;
}
.hr-text:before {
  content: "";
  background: var(--font-color);
  position: absolute;
  opacity:.1;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
}
.hr-text:after {
  content: attr(data-content);
  position: relative;
  display: inline-block;
  color:var(--font-color);
  padding: 0 0.5em;
  line-height: 1.5em;
  background-color:var(--bg-contrast);
}

.box-header {
  font-size:1.8rem;
  padding:5px 0 12px 20px;
}
.box-cont {
  background:var(--bg-color);
  padding:20px;
  margin-bottom:30px;
  border-radius:var(--border-radius);
}
.box-cont.invert {
  background:var(--bg-contrast);
}
.box-cont p, .box-cont ul {
  font-size:1.65rem;
	line-height:2.5rem;
  margin-bottom:15px;
}
.box-cont ul {
  margin-left:20px;
}
.box-cont p:last-child {
  margin-bottom:0;
}
@media all and (max-width:640px) {
  .box-header {
    font-size:1.7rem;
    text-align:center;
    padding:5px 0 10px 0;
  }
  .box-cont {
    margin:0 10px 30px 10px;
    padding:15px;
  }
  .box-cont p, .box-cont ul {
    font-size:1.5rem;
    line-height:2.4rem;
  }
}


.autor-pic {
  width:35px;
  height:35px;
  margin-right:10px;
  border-radius:50%;
  border:2px solid var(--bg-color);
  outline:3px solid var(--main-color);
}
.emailbtn {
  width:26px;
  height:26px;
  margin:-1px 0 0 5px;
  filter:invert(var(--png-invert));
  opacity:.8;
  background:#eee;
  border-radius:50%;
  padding:5px;
}

#snackbar {
  visibility: hidden;
  min-width: 400px;
  margin-left: -200px;
  font-size:1.7rem;
  font-weight:700;
  color: #fff;
  text-align: center;
  border-radius: var(--border-radius);
  padding: 16px;
  position: fixed;
  z-index:999;
  left: 50%;
  bottom: 150px;
}
#snackbar svg {
  margin:-2px 4px 0 0;
}
#snackbar.show {
  visibility: visible;
  animation: fadein 0.5s, fadeout 0.5s 3.7s;
}
@media all and (max-width:640px) {
  #snackbar {
    border-radius:0;
    padding:30px 16px;
    font-size:1.5rem;
  }
}

@keyframes fadein {
  from {bottom: 0; opacity: 0; scale:.1;}
  to {bottom: 150px; opacity: 1; scale:1;}
}
@keyframes fadeout {
  from {bottom: 150px; opacity: 1; scale:1;}
  to {bottom: 0; opacity: 0; scale:.1;}
}

.toast-box-success {
  padding:20px;
  color:#fff;
  border-radius:4px;
  margin-bottom:40px;
  background: var(--toast-success);
}
.toast-box-error {
  padding:20px;
  color:#fff;
  border-radius:4px;
  margin-bottom:40px;
  background: var(--toast-error);
}
.toast-box-success b, .toast-box-error b {
  font-size:2rem;
}


/* Benachrichtigungsmenü */

.nmenu {
  position:fixed;
  display:none;
  z-index:5;
  transform:translate(-220px,40px);
  width:300px;
  max-height:50%;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-color:var(--scrollbar1) var(--scrollbar2);
  scrollbar-width:thin;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scroll:touch;
  text-align:left;
  font-size:1.3rem;
  border-radius:var(--border-radius);
  background-color:var(--bg-color);
  border:1px solid rgba(0,0,0,.07);
  box-shadow:2px 8px 10px 1px rgba(0,0,0,0.2);
}
.nmenu.nbottom {
  bottom:0;
  right:30px;
  height:500px;
  width:500px;
  max-width:50%;
  transform:translate(0,0);
  border-radius:var(--border-radius) var(--border-radius) 0 0;
}
.nmenu::-webkit-scrollbar {
	width:8px;
	background-color:var(--scrollbar2);
}
.nmenu::-webkit-scrollbar-button {
	height:0px;
}
.nmenu::-webkit-scrollbar-thumb {
	background-color:var(--scrollbar1);
}
.nmenu span {
  display:block;
  padding:15px 15px 10px 15px;
  font-size:1.5rem;
  font-weight:500;
}
.nmenu span.non {
  display:block;
  padding:15px 15px 25px 15px;
  border-top:1px solid rgba(100,100,100,.2);
  font-size:1.2rem;
  font-weight:normal;
  font-style:italic;
}
.nmenu a {
  display:block;
  min-height:60px;
  padding:10px 20px 10px 15px;
  border-top:1px solid rgba(100,100,100,.2);
  cursor:pointer;
  text-decoration:none;
}
.ntxt {
  margin-top:3px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.nmenu a:last-child {
  border-bottom:1px solid rgba(100,100,100,.2);
}
.nmenu a.neu {
  background-color:rgba(255, 0, 25, 0.08);
}
.nmenu a img {
  float:left;
  width:40px;
  height:40px;
  object-fit:cover;
  border-radius:50%;
  margin-right:8px;
  margin-bottom:8px;
}
.userico-nmenu-txt {
  display:inline;
  float:left;
  width:41px;
  height:41px;
  border-radius:50%;
  margin-right:8px;
  text-align:center;
  padding-top:10px;
  font-size:1.8rem;
  font-weight:500;
  background-color:var(--main-color);
  color:#fff;
}
.nmenu a img.nmm {
  border-radius:var(--border-radius);
}
.nmenu p {
  display:block;
  text-align:center;
}
.nmenu a span {
  display:block;
  opacity:.3;
  padding:4px 0 2px 0;
  font-size:1.1rem;
}
@media all and (min-width:640px) {
  .nmenu a:hover {
    background-color:var(--bg-contrast);
  }
}
@media all and (max-width:640px) {
  .nmenu {
    max-height:100%;
    width:100%;
    height:100%;
    transform:none;
    padding-top:70px;
    bottom:0;
    background-color:var(--main-color-extralight);
    border-radius:0;
    box-shadow:none;
  }
  .nmenu a {
    padding-right:50px;
  }
}




/* Quiz */

.quiz_antwort_btn {
  cursor:pointer;
  background:var(--main-color);
  border-radius:var(--border-radius);
  padding:15px;
  font-size:1.8rem;
  color:#fff;
  margin-bottom:10px;
  line-height:1.05;
  transition:all 500ms;
}
.quiz_antwort_btn span {
  display:inline-block;
  text-align:center;
  border-radius:50%;
  height:22px;
  width:22px;
  margin-right:10px;
  border:2px solid #fff;
  opacity:.5;
  transition:all 1s;
}
.quiz_antwort_btn div {
  float:right;
  padding:5px 8px;
  border-radius:20px;
  color:#222222;
  font-size:1.2rem;
  font-weight:700;
  background: var(--bg-color);
  opacity:0;
  display:none;
}
@media all and (min-width:640px) {
  .quiz_antwort_btn:hover {
    background:var(--main-color-light);
  }
  .quiz_antwort_btn:hover span {
    background:#fff;
    transform:scale(1.3);
    opacity:.7;
  }
}


/* Layout Events */

.event-details {
  display: flex;
  flex-wrap: wrap;
  padding:28px 10px 10px 15px;
  border-radius:var(--border-radius);
  background-color:var(--bg-color);
}
.event-details img {
  width:36px;
  height:36px;
  margin:-6px 0 6px 0;
}
.event-details div {
  font-size:2.2rem;
  margin-bottom:10px;
}
.event-details div:nth-child(even) {
  width:85%;
}
.event-details div:nth-child(odd) {
  width:15%;
}

.kalbtns {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr 1fr;
  gap:20px 0;
  grid-template-areas:
    ". ."
    ". ."
    ". .";
}
.kalbtns div a {
cursor:pointer;background-color:var(--bg-color);padding:6px;font-size:1.3rem;
}
.kalbtns div a img {
width:28px;height:28px;margin:-1px 4px 0 0;
}

#artikelAsight {
  align-self:start;
  position:-webkit-sticky;
  position:sticky;
  top:40px;
  padding:35px 0;
  border-radius:var(--border-radius);
}

.eventcont p {
	font-size:1.9rem;
	line-height:3.1rem;
  margin-bottom:20px;
}
.eventcont h3 {
  display:block;
  font-size:2.3rem;
  font-weight:700;
	line-height:3rem;
  margin:45px 10px 25px 0;
}
.event .pretitel {
  opacity:.6;
}
.event h1 {
	font-size:4.3rem;
	line-height:5.3rem;
	font-weight:700;
	margin:10px 60px 20px 0;
  color:var(--titel-color);
}
#map {
  margin:30px 0;
  height:300px;
  border-radius:var(--border-radius);
  -webkit-user-select: none;
  user-select:none;
}
@media all and (min-width:640px) {
  .eventbild {
    margin-top:14px !important;
  }
  .eventcont {
    margin:0 0 20px 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
}
@media all and (max-width:640px) {
  .event-details, .kalbtns {
    border-radius:0;
  }
  #artikelAsight {
    padding-top:0;
  }
  .event .pretitel {
    margin-left:0;
  }
  .event h1 {
    font-size:2.9rem;
    line-height:3.6rem;
    font-weight:700;
    margin:10px 20px 20px 0px;
  }
  #map {
    margin:20px 10px;
  }
}



/* Layout Artikel */

.pretitel {
	font-size:2rem;
  font-weight:500;
  margin-top:25px;
  text-transform:uppercase;
  color:var(--main-color)
}
.pretitel span {
  padding-right:15px;
}
.pretitel img {
	opacity:.5;
  width:20px;
  height:20px;
  margin:-5px 1px 0 0;
  filter:invert(var(--png-invert));
}
.artikel h1 {
	font-size:4.2rem;
	line-height:5.3rem;
	opacity:.9;
	font-weight:500;
	margin:10px 60px 0px 0;
  color:var(--titel-color);
}
.artikel h2 {
	font-size:2.4rem;
	line-height:3.4rem;
	font-weight:700;
	margin:40px 60px 20px 0;
}
.artikel h2.teaser {
	font-weight:400;
}
.artikelinfo img {
  display:inline-block;
  width:24px;
  height:24px;
  margin-right:3px;
  margin-top:-2px;
  filter:none;
}
.artikeltags {
  margin-top:40px;
  line-height:normal;
}

#afbdiv {
  margin-top:40px;
  height:60px;
  text-align:center;
  font-size:1.3rem;
}
.artikelfeedback {
  text-align:center;
  font-size:1.3rem;
  line-height:1.5rem;
}
.artikelfeedback div {
  margin-top:10px;
}
.artikelfeedback div button span img {
  width:26px;height:26px;margin:-2px 5px 0 0;opacity:var(--color-opacity);
}

.artikelcont {
	margin:40px 80px 20px 0;
	font-size:1.9rem;
	line-height:3.1rem;
  margin-bottom:20px;
}
.artikelcont h3 {
  display:block;
  font-size:2.3rem;
  font-weight:700;
	line-height:3rem;
  margin:45px 10px 25px 0;
}
.artikelcont p {
	font-size:1.9rem;
	line-height:3.1rem;
  margin-bottom:20px;
}
.artikelcont ul {
  margin-left:25px;
}
.artikelcont li {
  margin-bottom:10px;
}
.artikelcont li b {
  display:inline-block;
	font-size:1.9rem;
	font-weight:700 !important;
  margin:0;
}
.bild {
	margin:0;
  border-radius:var(--border-radius);
  overflow:hidden;
}
.bild img {
  pointer-events:none;
	width:100%;
  aspect-ratio: 13/8;
  object-fit:cover;
  border-radius:var(--border-radius);
}
.bildinfo {
  display:none;position:absolute;bottom:0;right:0;padding:4px 35px 8px 12px;background:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(4px);border-top-left-radius:var(--border-radius);cursor:pointer;z-index:1;
}
.bildinfo_link {
  position:absolute;
  cursor:pointer;
  border-radius:50%;
  background:rgba(255,255,255,.5);
  width:20px;
  height:20px;
  bottom:5px;
  right:5px;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
  outline:0 solid rgba(255,255,255,.5);
  transition: all 0.2s ease-out;
  z-index:2;
}
.bildinfo_link img {
  width:20px;
  height:20px;
  padding:2px;
  opacity:.6;
}

.kipowered {
  margin-top:20px;font-size:1rem;text-align:left;background:var(--main-color-extralight);padding:5px;border-radius:var(--border-radius);
}
.kipowered img {
  margin-top:2px;width:44px;height:44px;float:left;margin:-1px 3px 0 0;
}
.kipowered a {
  display:inline-block;font-weight:700;text-decoration:underline;margin-bottom:3px;opacity:.8;font-size:1.1rem;
}

.bildsub {
	font-size:1.4rem;
	line-height:2.1rem;
	margin:9px 0 0 0;
  opacity:.5;
}
.bildcopyr {
	font-size:1rem;
  margin-top:5px;
	opacity:.4;
}
.bildsub a {
	text-decoration:none;
	color:#9e8569;
}

.artikelcontainer {
  display: grid;
  grid-gap: 0;
  grid-template-columns: 80px minmax(10px, 1fr);
}

.buttonbar {
  margin:-20px 0 40px 0;
  -webkit-user-select:none;
  user-select:none;
}
.buttonbar div {
  display:inline-block;
  cursor:pointer;
  background-color:var(--bg-contrast);
  border-radius:50%;
  width:38px;
  height:38px;
  padding: 5px 8px;
  transition: all 0.3s ease-in-out;
	z-index:1;
  filter:brightness(99%);
}
.buttonbar .fb:hover { background-color:var(--social-fb); filter:brightness(1); }
.buttonbar .fb:hover img { filter:invert(1); }
.buttonbar .pt:hover { background-color:var(--social-pt); filter:brightness(1); }
.buttonbar .pt:hover img { filter:invert(1); }
.buttonbar .wa:hover { background-color:var(--social-wa); filter:brightness(1); }
.buttonbar .wa:hover img { filter:invert(1); }
.buttonbar img {
  width:22px;
  height:22px;
  opacity:.3;
  filter:invert(var(--png-invert));
  transition: all 0.2s ease-in-out;
}
@media all and (min-width:640px) {
  .buttonbar div:hover {
    scale:1.1;
  }
  .buttonbar div:hover img {
    opacity:1;
  }
}
#anzkom {
  position:absolute;
  opacity:.9;
  margin:20px 0 0 20px;
  font-size:1rem;
  padding:0 3px;
  line-height:16px;
  height:16px;
  aspect-ratio:1;
  width:auto;
  border-radius:8px;
  text-align:center;
  color:#fff;
  background:var(--main-color);
}
.buttonbar-mobile {
	position:fixed;
  display:none;
	border:0;
	padding:0;
	height:44px;
  right:63px;
	bottom:10px;
	filter:drop-shadow(2px 2px 3px rgba(10, 10, 10, 0.2));
	z-index:1;
}
.buttonbar-mobile-flex {
  display:flex;
}
.buttonbar-mobile div div {
  cursor:pointer;
  background-color:var(--main-color-light);
  width:44px;
  height:44px;
  padding: 8px 12px;
  border-radius:50%;
  margin:0 4px;
}

.buttonbar-mobile .fb { background-color:var(--social-fb); }
.buttonbar-mobile .pt { background-color:var(--social-pt); }
.buttonbar-mobile .wa { background-color:var(--social-wa); }
.buttonbar-mobile .em { background-color:var(--social-em); }

.buttonbar-mobile img {
  width:20px;
  height:20px;
  opacity:.6;
  margin-top:0;
  filter:invert(var(--png-invert));
}
#anzkom-mobile {
  position:absolute;
  height:17px;
  width:auto;
  margin:18px 0 0 15px;
  text-align:center;
  font-size:1.1rem;
  font-weight:500;
  color:var(--font-color);
  color:#fff;
  opacity:.9;
  padding:2px 3px;
  border-radius:8px;
  background:var(--main-color);
}

.kommentarcontainer {
  margin-bottom:50px;
}
.kommentare-anz {
  font-size:1.7rem;
  font-weight:500;
  margin:45px 0 15px 0;
}
.kommentare-anz select {
  float:right;
  margin-top:-6px;
}
.kommentare-anz select option {
  font-size: 1.2em;
}
.kommentarbox {
  margin-top:80px;
  padding:25px 30px;
  background-color:var(--bg-contrast);
  border-radius:var(--border-radius);
}
.antwortbox {
  display:none;
  background-color:var(--toast-success);
  margin-top:10px;
  padding:25px 30px;
  border-radius:6px;
}
.kommentar-element {
  margin-top:20px;
  padding-top:30px;
  border-top:2px solid var(--bg-contrast);
}
.kommentar-cont {
  margin-left:45px;
}
.kommentar-cont p {
  display:inline-block;
  margin:4px 0;
  font-size:1.7rem;
  line-height:2.2rem;
  padding:10px 25px 10px 10px;
  max-height:250px;
  overflow-y:auto;
  word-wrap: break-word;
}

.antwpfeil {
  position:absolute;rotate:180deg;translate:-24px -6px;height:28px;width:28px;opacity:.1;filter:invert(var(--png-invert));display:none;
}
.neuer-kommentar {
  display:none;
}
.kommentar-textarea {
  margin-top:15px;font-size:1.5rem;min-width:100%;width:100%;min-height:100px;max-height:300px;margin-bottom:10px;
}
.reactbox {
  margin-left:6px;
  font-size:1.25rem;
}
.reactbox button {
  all:unset;
  width:45px;
  cursor:pointer;
  text-decoration:none;
  color:var(--font-color);
}
.reactbox button:last-child {
  width:120px;
  margin-left:10px;
}
.reactbox span {
  opacity:.6;
  transition: all 0.3s ease-in-out;
}
@media all and (min-width:640px) {
.reactbox button:hover img {
  opacity:.5 !important;
  scale:1.1;
}
}
.reactbox img {
  opacity:0.15;
  filter:invert(var(--png-invert));
  margin-right:2px;
  width:24px;
  height:24px;
  transition: all 0.3s ease-in-out;
}
.reactbox img.color {
  filter:invert(0);
  transition: all 0.5s ease-in-out;
}
.reactbox button:nth-child(2) img {
  margin-right:4px;
}











.schrieb {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

.flag-container {
  display: inline-flex;
  align-items: center;
}

.uname-container, .flag-container {
  padding-bottom:6px;
}

@media screen and (max-width: 768px) {
  .schrieb {
    flex-wrap: wrap;
  }
  
  .flag-container {
    width: 100%;
    margin-left: 34px;
  }
}



.box_pinnwand {
  display:block;
  cursor:pointer;
  background:var(--bg-contrast);
  border-radius:var(--border-radius);
  padding: 20px 25px 15px 15px;
  transition: all 0.3s ease;
}
.box_pinnwand .schrieb, .box_pinnwand .antw {
  font-size:1.4rem;
  opacity:.7;
  padding:0 6px;
}
.box_pinnwand .antw img {
  width:14px;height:14px;
  margin:-3px 6px 0 0;
  opacity:.6;
  filter:invert(var(--png-invert));
}
.box_pinnwand .imgflag {
  width: 16px;
  height: 16px;
  margin:0 4px 0 7px;
  border-radius: 50%;
  object-fit: cover;
}
.box_pinnwand .mland {
  font-size:1.4rem;
  margin:30px 0 0 0;
  padding:0 6px;
}
.box_pinnwand .titel {
  font-size:1.8rem;
  font-weight:500;
  margin:15px 0 0 0;
  padding:3px 6px;
}
.box_pinnwand .txt {
  font-size:1.7rem;
  margin:15px 0 25px 0;
  background:var(--bg-contrast2);
  border-radius:10px;
  padding:3px 6px;
}

.box_pinnwand:hover {
  text-decoration:none;
  scale:1.03;
}

.box_antwort {
  cursor:inherit;
}
.box_antwort:hover {
  text-decoration:none;
  scale:1;
}
.box_antwort .txt {
  font-size:1.7rem;
  margin:20px 0 10px 0;
}

.box_neu {
  background:var(--main-color-extralight);
}


@media all and (max-width:640px) {
  .box_pinnwand {
    margin:10px 20px;
  }
}








.userbox {
  padding:0 10px;
  font-size:1.5rem;
  border-radius:6px;
}
.userbox span {
  display:inline-block;
  margin-left:11px;
  opacity:.8;
  font-weight:700;
}
.userbox span:last-child {
  opacity:.4;
  font-size:1.2rem;
  font-weight:400;
}
.useravatar-txt {
  float:left;
  display:block;
  width:32px;
  height:32px;
  background-color:var(--main-color);
  border-radius:50%;
  text-align:center;
  color:#fff;
  font-size:1.3rem;
  font-weight:500;
  padding:8px 0 0 1px;
  margin-top:-8px;
}
.useravatar {
  float:left;
  border-radius:50%;
  width:32px;
  height:32px;
  margin-top:-8px;
}


.userbox.big {
  padding:0;
  font-size:1.6rem;
}
.userbox.big .useravatar {
  width:80px;
  height:80px;
}
.userbox.big .useravatar-txt {
  width:80px;
  height:80px;
  font-size:3rem;
  padding:22px 0 0 1px;
}




.artikel-mehr {
  text-align: center;
  font-size:1.8rem;
  font-weight:500;
  opacity:.5;
  margin:80px 0 5px 0;
}

blockquote {
  color: var(--main-color);
  width: 70%;
  margin: 50px 20% 45px 15%;
}
blockquote p {
  font-weight:700;
  font-size:2.1rem !important;
}
blockquote p::before {
  content: "“";
  font-size: 7rem;
  margin: 1rem 0 0 -5rem;
  position: absolute;
  opacity: 0.5;
}
blockquote cite {
  font-size: 1.6rem;
  font-style:normal;
}

@media all and (min-width:640px) {
  .kommentar-cont p {
    max-width:90%;
  }
}
@media all and (max-width:900px) {
  blockquote {
    width:90%;
    margin:50px 30px 50px 40px;
  }
  .artikelcontainer {
      grid-template-columns: 1fr;
  }
  .buttonbar {
    background-color:var(--bg-color);
    opacity:1;
    padding:20px 0 10px 0;
    transform:translate(0,-5px);
  }
	.bild img {
    border-radius:0 0 var(--border-radius) var(--border-radius);
	}
	.bild {
    margin-top:-50px !important;
    scale:1.2;
    border-radius:0 0 var(--border-radius) var(--border-radius);
	}
	.bildsub {
    font-size:1.3rem;
    line-height:1.6rem;
    margin:5px 20px 0 20px;
	}
	.bildcopyr {
    margin:5px 20px 0 20px;
	}
	.pretitel {
    font-size:1.5rem;
		margin:25px 20px 0 20px;
	}
  .artikelinfo {
    padding:10px 30px 20px 30px;
    text-align:center;
  }
  .artikeltags {
    text-align:center;
  }
	.artikel h1 {
		font-size:3rem;
    line-height:3.6rem;
    opacity:.8;
    font-weight:500;
		margin:-10px 0 40px 0;
	}
	.artikel h2 {
    font-size:2.2rem;
    line-height:3rem;
    font-weight:700;
    margin:45px 0 25px 0;
	}
	.artikelcont {
		font-size:1.7rem;
    line-height:2.3rem;
		margin:0px !important;
	}
  .kommentare-anz {
    margin-left:20px;
    margin-right:20px;
  }
  .kommentarbox {
    margin-top: 50px;
    padding:25px 20px;
    background-color:var(--bg-contrast);
    border-radius:var(--border-radius);
  }
  .kommentar-element {
    padding-right:20px;
  }
  .userbox span:last-child {
    float:right;
  }
}





/* Reading Progress */

.progress {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 0;
  width: 100%;
  height: 6px;
  transition: bottom .2s;
  color: white;
  background-color: transparent;
  z-index:1;
}

.progress-bar {
  width:0;
  height:6px;
  transition:width .2s;
  background-color:var(--main-color);
}






/* Footer */

#footer {
  padding: 3% 0 70px 0;
  margin-top:60px;
	background:var(--footer-color);
  -webkit-user-select:none;
  user-select:none;
}
#footer_inner {
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:15px;
	margin:0px auto;
	max-width:1200px;
	font-size:1.4rem;
	padding:0px 15px 0px 15px !important;
}
@media all and (max-width:900px) {
	#footer_inner {
		text-align:center;
    grid-template-columns: 1fr;
	}
	#footer_inner div {
    grid-column: inherit !important;
    padding-right:0 !important;
	}
}
@media all and (max-width:640px) {
	#footer_inner {
		text-align:center;
    grid-template-columns: 1fr;
	}
	#footer_inner div {
    grid-column: inherit !important;
    padding-right:0 !important;
	}
}
.footer_title {
	margin:40px 0px 20px 0px;
	color:#fff;
	font-size:1.5rem;
	font-weight:400;
	text-transform:uppercase;
  opacity:.65;
}
.footer_copy {
  text-align:center;
  color:#fff;
  font-size:1.3rem;
  opacity:.2;
}
.footer_copy .heart {
  width:15px;
  height:15px;
  filter:invert(1);
  margin:-1px 3px 0 3px;
  opacity:.7;
  animation: heartbeat 2s linear infinite;
}
@keyframes heartbeat {
	0% { scale:1; }
	5% { scale:1.35; rotate:-6deg; opacity:.9; }
	20% { scale:.8; }
	25% { scale:1.35; rotate:6deg; opacity:.9; }
	40% { scale:1; }
}

.footer_logo {
  margin-top:40px;
  text-align:center;
}
.footer_logo a img {
  filter:brightness(140%) grayscale(1);
  height:55px;
  padding:10px;
  opacity:.8;
  transition: all 0.3s ease-in-out;
}
.footer_logo a img:hover {
  filter:brightness(100%) grayscale(0);
  scale:1.4;
  opacity:1;
}
.rub-footer {
  display:block;
  width:-moz-fit-content;
  width:fit-content;
	font-weight:500;
  padding: 6px 9px 6px 6px;
	color:#fff;
  opacity:.8;
}
.rub-footer img {
  filter:invert(1);
  width:24px;
  height:24px;
	margin:-1px 5px 0 0;
  transition: all 0.3s ease-in-out;
}
.rub-footer.ccl img {
  filter:invert(0);
  border-radius:50%;
  object-fit: cover;
  width:30px;
  height:30px;
	margin:-1px 5px 0 0;
  transition: all 0.3s ease-in-out;
}
.rub-footer.ccl {
  text-align:left !important;
  padding-left:10px;
}
.rub-footer img.social-link {
  filter:none;
	width:28px;
	height:28px;
	margin:0 5px 0 0;
  filter:saturate(0) invert(1) brightness(150%);
}
.rub-footer:hover, .rub-footer:hover img.social-link {
  opacity:1;
  filter:inherit;
}
.rub-footer:hover img, .rub-footer:hover img.social-link {
  scale:1.15;
}
.social-counter {
  font-size:1.3rem;
  margin-top:3px;
  color:#fff;
  opacity:.5;
  padding-top:9px;
  font-weight:400;
}
.rub-social-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 0;
  margin-top:20px;
}
@media all and (max-width:900px) {
	.rub-footer {
    display:block;
    width:100%;
		text-align:center;
	}
  .rub-footer img.social-link {
    filter:none;
    width:50px;
    height:50px;
    margin:0 0 8px 0;
  }
  .social-counter {
    font-size:1.4rem;
    padding-top:2px;
  }
  .social-counter div {
    font-size:1.1rem;
    padding-top:2px;
  }
  .rub-social-m {
    width:25%;
    float:left;
    font-size:1.4rem;
    margin-top:-10px;
    margin-bottom:30px;
    padding:0 !important;
    text-align:center;
  }
}

.chip {
  align-items:center;
  color:var(--font-color);
  display:inline-block;
  font-size:1.2rem;
  max-width:100%;
  margin-bottom:6px;
  text-decoration:none;
  transition: all 300ms ease;
  cursor:pointer;
  white-space: nowrap;
  opacity:.6;
}
.chip.footer {
  padding:5px 18px 5px 18px;
  opacity:.7;
  border-radius: 3px;
  background:var(--bg-contrast);
  margin-right:6px;
}
.chip span {
  display:inline-block;
  font-weight:500;
  padding:0 8px;
  color:var(--main-color);
  border:1px solid var(--main-color);
  border-radius: 8px;
  transition: all 300ms ease;
}
.chip img {
  width:12px;
  height:12px;
  margin:-2px 3px 0 0;
  opacity:.8;
  filter:invert(var(--png-invert));
}
.chip:hover,
.chip:focus {
  opacity:1;
  text-decoration:none;
  background:var(--bg-contrast);
}
.chip:hover span,
.chip:focus span{
  background:var(--bg-contrast);
  border-radius: 0px;
}
.chip.nolink:hover,
.chip.nolink:focus {
  opacity:.8;
  cursor:auto;
  background:transparent;
}








/* Theme Switcher */

.theme-switch-wrapper {
	margin-top:15px;
}
.theme-switch-wrapper img {
	opacity:.5;
  margin:-5px 1px 5px 1px;
  width:14px;
  height:14px;
  filter:invert(var(--png-invert));
}
.theme-switch, .theme-switch2 {
	display:inline-block;
	height:18px;
	position:relative;
	width:35px;
}
.theme-switch input, .theme-switch2 input {
	display:none;
}
.slider, .slider-mobile {
	background-color:var(--bg-contrast-dark);
	bottom:0;
	cursor:pointer;
	left:0;
	position:absolute;
	right:0;
	top:0;
	transition:.4s;
}
.slider:hover, .slider-mobile:hover {
	background-color:#8c9599;
}
.slider:before, .slider-mobile:before {
	background-color:#fff;
	bottom:4px;
	content:"";
	height:10px;
	left:4px;
	position:absolute;
	transition:.4s;
	width:10px;
}
input:checked + .slider { background-color:#69757a; }
input:checked + .slider:hover { background-color:#8e8e8e; }
input:checked + .slider:before { transform:translateX(16px); }
input:checked + .slider-mobile { background-color:#69757a; }
input:checked + .slider-mobile:hover { background-color:#8e8e8e; }
input:checked + .slider-mobile:before { transform:translateX(16px); }
.slider.round, .slider-mobile.round { border-radius:18px; }
.slider.round:before, .slider-mobile.round:before {border-radius:50%; }









/* Mobile: User Button */

#modLoginFloat {
	position:fixed;
	border:0;
	padding:0;
	cursor:pointer;
	width:44px;
	height:44px;
	bottom:10px;
	left:15px;
	background-color:var(--main-color);
	border-radius:50px;
	text-align:center;
	filter:drop-shadow(2px 2px 3px rgba(10, 10, 10, 0.2));
	z-index:1;
}

.modLoginFloatTop {
	position:fixed;
  display:none;
	padding:0;
	width:100%;
	bottom:55px;
	left:15px;
	filter:drop-shadow(2px 2px 3px rgba(10, 10, 10, 0.2));
	z-index:1;
}
.modLoginFloatTop button {
	border:0;
  display:block;
  cursor:pointer;
	background-color:var(--main-color-light);
  width:44px;
  height:44px;
  padding:12px;
  border-radius:50%;
  margin:6px 0;
}
.modLoginFloatTop img {
  width:20px;
  height:20px;
  opacity:.6;
}

#modShare {
  position:absolute;
  display:none;
  bottom:50px;
  right:0px;
}
#modShare div {
  margin-top:6px;
}
#modShare div img {
  opacity:.9;
  filter:invert(1);
  margin-top:0;
}


/* Scroll-to-Top Button */

#scroll {
  position:fixed;
  right:15px;
  bottom:10px;
  cursor:pointer;
  width:44px;
  height:44px;
  display:none;
  border-radius:50%;
  z-index:1;
  background-color:var(--main-color);
  filter:drop-shadow(2px 2px 3px rgba(10, 10, 10, 0.2));
  transition: bottom 0.3s;
}
#scroll img {
  width:22px;
  height:22px;
  margin:11px;
  filter:invert(1);
}









/* Benachrichtigungen + Nachrichten */

.bnms {
  position:absolute;
  font-size:1rem;
  padding:2px;
  width:16px;height:16px;
  border-radius:50%;
  color:var(--font-color);
  background:var(--bg-contrast);
  background:var(--main-color-light);
  text-align:center;
  font-weight:bold;
  z-index:1;
  margin:15px 0 0 25px;
  opacity:.9;
}
.bnms-pulse {
  color:#fff !important;
  background:rgb(255,55,0) !important;
  animation: pulse_counter 2s infinite;
}
@keyframes pulse_counter {
  0% {
    box-shadow: 0 0 0 0 rgba(239,0,0,0);
  }
  25% {
    box-shadow: 0 0 0 4px rgba(255,55,0,.2); opacity:1;
  }
  100% {
    box-shadow: 0 0 0 0 rgba(239,0,0,0);
  }
}







/* Navigation */

.sticky {
  position: fixed;
  width: 100%;
  max-width: 1400px;
  height: 45px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  padding-top: 2px;
  border-radius: 0 0 var(--border-radius) var(--border-radius);
  font-size: 1.2rem !important;
  background: var(--bg-color-light) !important;
  backdrop-filter: blur(20px);
  z-index: 1000;
}
.sticky li a, .sticky-sub a {
  font-size:1.2rem !important;
  margin:0 !important;
}
.sticky li a {
  padding-top:7px !important;
  padding-bottom:7px !important;
	transition:all 0.2s ease-in-out;
}
.sticky .navicon {
	height:20px;
	width:20px;
	margin:-5px 2px 0px 0px;
}
@keyframes animation_navlogo {
	0% { transform: rotateX(80deg) translateX(-150px); }
	100% { transform: rotateX(0deg); }
}
@media all and (min-width:1000px) {
  .navlogo {
    display:inline-block !important;
  }
  .sticky .navlogo a {
    visibility:visible;
  }
  .sticky .navlogo img {
    display:inline;
    animation: 400ms ease-in-out animation_navlogo;
  }
}
@media all and (min-width:640px) {
  .sticky-sub {
    position:fixed;
    transform:translateY(0px) !important;
    top:44px;
  }
  .sticky-suchbox {
    scale:0.7;
    position:fixed;
    transform:translateY(0px) !important;
    margin:0 5vw !important;
  }
  .sticky-suchbox-sub {
    top:80px;
  }
}
#suchbox_below {
  margin-top:-30px;
}

.navlogo {
  display:none;
  transition: all 0.3s ease-in-out;
}
.navlogo a {
  visibility:hidden;
}
.navlogo img {
  height:20px;
  margin-top:-6px;
  display:none;
}
.navburger {
	float:right;
  font-size:.8rem;
  width:48px;height:48px;
  padding-top:9px;
  margin-top:-10px;
  border-radius:50%;
	transition:all 0.2s ease-in-out;
}
.navburger::after {
  content:'Menü';
}
.navburger .line {
	padding:0 !important;
	width:20px;
	height:3px !important;
	background-color:var(--font-color) !important;
	margin:3px auto;
  opacity:.7;
	transition:all 0.8s ease-in-out;
}
.navburger.is-active { height:42px;width:42px;padding-top:10px;margin:-5px 3px 0 3px; }
.navburger.is-active::after { content:''; }
.navburger.is-active .line:nth-child(2){ opacity:0; }
.navburger.is-active .line:nth-child(1){ transform:translateY(6px) rotate(225deg); }
.navburger.is-active .line:nth-child(3){ transform:translateY(-6px) rotate(-225deg); }
.navigator {
	background-color:var(--header-bg);
	filter:drop-shadow(0px 8px 4px rgba(0, 0, 0, 0.1));
	z-index:2;
}

.navicon {
	height:24px;
	width:24px;
	margin:-4px 3px 0px 0px;
  filter:invert(var(--png-invert));
}
.navicon.mehr {
  margin-top:-2px;
  transition: all 0.2s ease-in-out;
}
.rotico {
  rotate:-180deg;
}
@media all and (max-width:900px) {
.navicon {
	margin-left:20px !important;
	margin-right:10px !important;
}}
#nav-top {
	position:fixed;
	top:0px;
	width:100%;
	margin:0px !important;
	padding:0px !important;
	z-index:999;
}
#nav-trigger {
	display:none;
	filter:drop-shadow(0px 6px 2px hsla(0, 0%, 0%, 0.1));
}
#nav-trigger span {
	display:block;
	height:48px;
	padding:10px;
	background-color:var(--header-bg);
	cursor:pointer;
	text-transform:uppercase;
	text-align:center;
}
nav {
	text-align:center;
  -webkit-user-select: none;
  user-select: none;
  position:absolute;
  width:100%;
}
nav#nav-main ul {
	list-style-type:none;
	margin:0;
	padding:5px 0 0 0;
}
nav#nav-main li {
	display:inline-block;
	margin:0;
	padding:0;
}
nav#nav-main a, nav#nav-sub a {
	text-decoration:none;
	color:var(--font-color);
	display:block;
	padding:6px 12px 6px 12px;
	margin:5px 3px 0px 3px;
	font-size:1.5rem;
  font-weight:500;
	text-transform:uppercase;
	border-top:4px solid transparent;
	border-bottom:4px solid transparent;
  border-radius:14px 14px 0 0;
  white-space:nowrap;
  position:relative;
  transition: all 200ms ease-out;
}
nav#nav-main a.starter, nav#nav-sub a.starter {
  background-color:var(--main-color-light);
}
nav#nav-sub a {
	font-size:1.4rem;
  border-radius: var(--border-radius);
}
nav#nav-sub .navicon {
	height:20px;
	width:20px;
	margin:-3px 2px 0px 0px;
}
nav#nav-main a:hover {
  border-bottom:4px solid var(--main-color);
  background-color:var(--bg-contrast);
	scale:1.15;
  transform-origin: center;
}
nav#nav-main a:hover img {
  scale:1.3;
  rotate:-10deg;
  translate:-1px -2px;
}

nav#nav-mobile {
	display:none;
  position:absolute;
  min-width:350px;
  width:90%;
  right:0;
}
nav#nav-mobile ul {
	filter:drop-shadow(-4px 6px 2px hsla(0, 0%, 0%, 0.1));
	display:none;
	list-style-type:none;
  margin-top:0;
}
nav#nav-mobile li {
	display:block;
	width:100%;
  padding:15px 5px 0 5px;
  grid-column:span 2;
}
nav#nav-mobile span {
	display:block;
	width:100%;
  text-align:center;
}
nav#nav-mobile .navicon {
	height:28px;
	width:28px;
  margin:10px 0 2px 0 !important;
  padding:0;
}
nav#nav-mobile .navpoint a {
	text-decoration:none;
	text-align:center;
  background:var(--bg-contrast);
  padding:15px 5px;
  border-radius:10px;
	display:block;
	font-size:1.3rem;
	font-weight:500;
  text-align:center;
  height:100px;
}
.navpoint a img {
  width:20px;
  height:20px;
  margin:-2px 3px 0 0;
  filter:invert(var(--png-invert));
  transition: all 200ms ease-out;
}
nav#nav-mobile .navpoint a img {
  display:block;
  text-align:center;
  margin:0 auto 5px auto;
  width:44px;
  height:44px;
  filter:invert(var(--png-invert));
}
@media all and (max-width:900px) {
  .navmg {
    display:grid;
    grid-template-columns: repeat(6,1fr);
    gap:0;
    background-color:var(--header-bg);
    border-bottom-left-radius:var(--border-radius);
    padding:0 5px 5px 5px;
   }
   nav#nav-mobile li {
     grid-column:span 2;
   }
   .menu-link {
    grid-column:span 3 !important;
   }
   .menu-link a {
     display:block;
     text-align:left;
     font-size:1.4rem;
     padding:3px 0;
     margin-left:5px;
   }
   .menu-link a img {
     width:16px;
     height:16px;
     margin:0 5px;
     filter:invert(var(--png-invert));
     opacity:.8;
   }
   #nav-trigger {
    display:block;
   }
   nav#nav-main {
    display:none;
   }
   nav#nav-mobile {
    display:block;
   }
}










/* Sub Navigation */

.subrub {
  margin-bottom:20px;
  display:flex;
  flex-direction:row;
}
.subrub_text {
  margin-bottom:25px;
  font-size:1.8rem;
}
.subrub a, .subrub span {
  display:block;
  font-size:2.5rem;
  font-weight:700;
}
.subrub .nxtico {
  width:22px;
  height:22px;
  margin:-3px 15px 0 5px;
  filter:invert(var(--png-invert));
  opacity:.6;
  scale:.9;
  transition: all 0.4s ease-in-out;
}

.submenu {
  margin:0;
}
.submenu a {
  display:inline-block;
	border-radius:14px;
	background-color:var(--bg-contrast);
	margin:1px 3px;
	padding:6px 10px;
	color:var(--font-color);
	font-size:1.3rem;
  opacity:.7;
  font-weight:400;
	text-decoration:none;
}
.sminvert a {
	background-color:var(--bg-color);
}
@media all and (min-width:640px) {
  .submenu a:hover {
    opacity:1;
    outline:3px solid var(--bg-contrast);
  }
  .subrub a:hover .nxtico {
    margin:-3px 10px 0 10px;
    opacity:.9;
    scale:1;
  }
  .sminvert a:hover {
    outline:3px solid var(--bg-color);
  }
}
.submenu-aktiv {
	outline:3px solid var(--bg-contrast) !important;
	border-radius:24px !important;
  opacity:1 !important;
	font-weight:500;
  margin-right:6px !important;
}
.sminvert .submenu-aktiv {
	outline:3px solid var(--bg-color) !important;
}
@media all and (max-width:640px) {
  .subrub {
    flex-direction:column;
    margin:30px 10px 20px 10px;
  }
  .subrub_text {
    margin:0 10px 25px 10px;
  }
  .submenu {
    width:107%;
    height:42px;
    overflow:hidden;
    margin-left:-4%;
    -webkit-mask-image: linear-gradient(to right, transparent 2%, black 5%, black 95%, transparent 99%);
    mask-image: linear-gradient(to right, transparent 2%, black 5%, black 95%, transparent 99%);
  }
  .submenu a:first-child {
    margin-left:5%;
  }
  .submenu2 {
    height:70px;
    padding:4px 20px 0 0;
    white-space:nowrap;
    overflow-x:scroll;
    overflow-y:hide;
    -webkit-overflow-scrolling:touch;
  }
}
.dropbtn-subnav {
	cursor:pointer;
}
.dropbtn-subnav img {
  height:14px;
  width:14px;
  opacity:.7;
  filter:invert(var(--png-invert));
}
.dropdown-subnav {
	position:relative;
	display:inline-block;
}
.dropdown-subnav-content {
	display:none;
	position:absolute;
  z-index:1;
  text-align:center;
  border-radius:0 0 var(--border-radius) var(--border-radius);
  margin:5px 3px;
  width:205px;
  translate:-70px 0;
  padding:5px 5px 15px 5px;
	background-color:var(--bg-color-light);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter: blur(6px);
	filter:drop-shadow(-4px 4px 2px hsla(0, 0%, 0%, 0.1));
}
.dropdown-subnav-content a {
	display:inline-block;
	padding:8px;
  margin-top:5px;
	border:0;
  border-radius:24px;
}
.dropdown-subnav-content a:hover {
	border:0;
}
.show {display:block;}





/* Header */

.header {
	padding-top:5px;
	padding-bottom:5px;
}
.headergrid {
  max-width:1200px;
  margin:0px auto;
  padding:25px 15px 0px 15px;
	display:grid;
  grid-template-columns: 250px 1fr 250px;
  gap:0px;
  -webkit-user-select: none;
  user-select: none;
}
.logo {
	max-width:100%;
	height:80px;
  transition: all 0.3s ease-in-out;
}
.logo-mobile {
	text-align:center;
	height:35px;
	margin-top:-7px;
}
.headerleft {
	text-align:left;
	padding-top:11px;
}
.headerleft div {
  font-size:1.2rem;
}
.headerlogo-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-bottom:20px;
}
.headerlogo img {
  display: block;
}
.headerright {
	text-align:right;
	padding-top:11px;
}


.headerlogo a {
  display: flex;
  align-items: flex-start;
}

.logo-stack {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.lg0 {
  margin-right: 7px;
  height: 90px;
  width: auto;
  transition: all 500ms ease-in-out;
}

.lg1, .lg2 {
  width: 160px;
  height: auto;
  z-index: 99;
  transition: all 300ms ease-in-out;
}

.lg1 {
  filter:invert(var(--png-invert));
}

@keyframes rotate1 {
  0%, 100% {
      scale:1;
  }
  50% {
      scale:0.9;
  }
}

@keyframes rotate2 {
  0%, 100% {
      transform: rotate(4deg);
      filter: hue-rotate(30deg) saturate(1) brightness(1);
  }
  50% {
      transform: rotate(-4deg);
      filter: hue-rotate(-150deg) saturate(0.7) brightness(1.5);
  }
}

.headerlogo:hover .lg1 {
  scale:1.15;
  animation: rotate1 3.5s infinite linear;
}
.headerlogo:hover .lg2 {
  animation: rotate2 1.5s infinite linear;
}
.headerlogo:hover .lg0 {
  scale:1.15;
}



.userico-hd {
  border-radius:50%;
  padding:5px;
  width:35px;
  height:35px;
}
.userico-hd-lgdin {
  border-radius:50%;
  width:35px;
  height:35px;
}
.userico-hd-txt {
  font-size:1.8rem;
  font-weight:500;
  color:#fff;
}






/* Footerbar */

@media all and (max-width:900px) {
  #footerbar {
    position:fixed;
    display:none;
    bottom:-60px;
    z-index:1;
    height:55px;
    width:100%;
    transition: all 400ms ease-out;
  }
  #footerbar span {
    display:flex;
    justify-content: center;
  }
  #footerbar a {
    font-size:.9rem;
    color:#fff;
    display:block;
    text-decoration:none;
    text-align:center;
    width:15%;
    height:65px;
    margin:0 2px;
    padding-top:8px;
    border-radius: 28px 28px 0 0;
    rotate:-4deg;
  }
  #footerbar b {
    display:block;
    font-weight:500 !important;
  }
  #footerbar a img {
    width:28px;
    height:28px;
    margin-bottom:2px;
    filter:invert(1);
  }
}











/* Full-Width Boxen */

.box-newsletter {
	padding:20px;
  margin-top:40px;
	color:#fff;
  background:var(--main-color);
}
.box-grau {
	padding:5px 0 20px 0;
	background:var(--bg-contrast);
}
.box-blau {
  padding: 5px 0 20px 0;
  background: linear-gradient(to bottom, var(--bg-contrast3), var(--bg-color) 50%, var(--bg-contrast3));
}
.box-weiss {
	padding:5px 0 10px 0;
  margin-top:40px;
	background:var(--bg-color);
}

@media all and (max-width:900px) {
  .box-grau {
    padding:5px 0 1px 0;
    margin-bottom:50px;
  }
}














/* Preispläne */

#price {
  text-align: center;
  margin-top:-20px;
}

.plan {
  display: inline-block;
  margin: 10px 1% 30px 1%;
}

.plan-inner {
  margin: 0 auto;
  min-width: 280px;
  max-width: 100%;
  position:relative;
}

.entry-title {
  background: #53CFE9;
  height: 90px;
  position: relative;
  text-align: center;
  color: #fff;
  margin-bottom: 30px;
}

.entry-title>h3 {
  background: #20BADA;
  font-size: 16px;
  padding: 8px 0;
  text-transform: uppercase;
  font-weight: 700;
  margin: 0;
}

.entry-title .price {
  position: absolute;
  bottom: -25px;
  background: #20BADA;
  height: 70px;
  width: 170px;
  margin: 0 auto;
  left: 0;
  right: 0;
  overflow: hidden;
  border-radius: 50px;
  border: 5px solid var(--bg-color);
  line-height: 60px;
  font-size: 20px;
  rotate:-3deg;
}
.entry-title .price span {
  font-size: 14px;
  rotate:-3deg;
}

.entry-content ul {
  margin: 0 0 10px 0;
  padding: 0;
  list-style: none;
  text-align: center;
}

.entry-content li {
  border-bottom: 1px solid var(--bg-contrast-dark);
  background: var(--bg-color);
  font-size: 1.3rem;
  padding: 10px 0;
}

.entry-content li img {
  width:12px;height:12px;
  margin:-2px 3px 0 0;
}

.entry-content li:first-child {
  padding-top:40px;
  margin-top:-30px;
}

.entry-content li:last-child {
  border: none;
  padding-bottom:20px;
}

.basic .entry-title {
  background: #43c69899;
}

.basic .entry-title > h3 {
  background: #43c698;
}

.basic .price {
  background: #43c698;
}

.plus .entry-title {
  background: #3772aa99;
}

.plus .entry-title > h3 {
  background: #3772aa;
}

.plus .price {
  background: #3772aa;
}

.premium .entry-title > h3 {
  background: #DD4B5E;
}

.premium .entry-title {
  background: #DD4B5E99;
}

.premium .price {
  background: #DD4B5E;
}







.max-lines-1 {
  display: -webkit-box;
  line-clamp: 1;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.max-lines-2 {
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.max-lines-3 {
  display: -webkit-box;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.max-lines-4 {
  display: -webkit-box;
 line-clamp: 4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.max-lines-5 {
  display: -webkit-box;
  line-clamp: 5;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}






/* Suchbox */

.suchfeld {
  text-align:center;
}
.suchinput {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  width: 300px;
  height: 44px;
  padding-left: 25px;
  background: url('../../images/ico_down.svg') no-repeat right 14px center/1.4em, linear-gradient(to left, rgba(255, 255, 255, .55) 50px, var(--bg-color) 50px);
  color: var(--font-color);
  font-size:1.8rem;
  border-radius: 20px;
  cursor: pointer;
}
.suchinput.wbg {
  background: url('../../images/ico_down.svg') no-repeat right 14px center/1.4em, linear-gradient(to left, rgba(100, 100, 100, .15) 50px, var(--bg-contrast) 50px);
}
.suchinput option {
  background-color: var(--bg-color);
}
.suchdata {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  width: 350px;
  height: 44px;
  padding-left: 25px;
  background: url('../../images/ico_nav_events.svg') no-repeat right 64px center/1.4em, linear-gradient(to left, rgba(255, 255, 255, 0.55) 100px, var(--bg-color) 50px);
  color: var(--font-color);
  font-size:1.8rem;
  cursor: pointer;
}
#suchbox {
  padding:50px 30px 15px 30px;
  margin:-25px 0 25px 0;
  border-radius:0 0 var(--border-radius) var(--border-radius);
  border-top:1px solid var(--bg-contrast);
	filter:drop-shadow(0px 7px 3px rgba(0, 0, 0, 0.07));
	z-index:1;
  transform-origin: center center;
  translate:0 -30px;
	transition:all 0.6s ease-out;
}
#suchbox div div div label {
  position:absolute;font-size:1.2rem;font-weight:700;margin:4px 0 0 25px;
}
#suchbox div div .suchfeld {
  display:inline-block;width:300px;
}
#suchbox div div {
  text-align:center;
}
@media all and (max-width:640px) {
  #suchform select {
    scale:0.9;
    margin:-5px 0 -5px 0;
  }
  #suchbox {
    padding:35px 0 13px 0;
    margin:10px;
    border-radius:0 0 var(--border-radius) var(--border-radius);
  }
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-vlear-button,
input[type="date"]::calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}





/* Front Layout */

.box-wetter {
  background:#9fd2f3;
  min-height:250px;
  padding:0 7px;
  margin-bottom:10px;
  cursor:pointer;
  position: relative;
  overflow:hidden;
}
.box-wetter .bw1 {
  float:left;width:38%;text-align:center;margin:10px 6px 0 5px;
}
.box-wetter .bw1 img {
  width:50px;height:50px;margin:-35px 5px 0 -10px;filter:invert(1) brightness(200);
}
.bwx img {
  width:150px;height:150px;margin:50px 0 0 0;filter:invert(1) brightness(200);
}
.box-wetter .bw1 span {
  font-weight:400;font-size:5.8rem;letter-spacing:-3px;color:#fff;
}
.box-wetter .bw1 span span {
  font-weight:400;font-size:4rem;vertical-align:0.35em;
}
.box-wetter .bw2 {
  padding-top:12px;
}
.box-wetter .bw2 span {
  font-size:1.5rem;font-weight:700;color:#222;background-color: hsla(0, 0%, 100%, 0.8);padding: 2px 4px 2px 4px;
}
.box-wetter .bw3 {
  margin-top:7px;
}
.box-wetter .bw3 span {
  font-size:1.1rem;font-weight:500;color:#222;background-color: hsla(0, 0%, 100%, 0.8);padding: 2px 4px 2px 4px;margin-right:3px;
}
.box-wetter .bw3 span img {
  margin:-2px 0 0 -2px;width:16px;height:16px;opacity:.9;
}
.box-wetter .bw4 {
  margin-top:2px;margin-bottom:19px;
}
.box-wetter .bw4 span {
  font-size:1.1rem;font-weight:500;color:#222;background-color: hsla(0, 0%, 100%, 0.8);padding: 2px 4px 2px 4px;
}
.box-wetter .bw4 span img {
  margin-top:-2px;width:16px;height:16px;opacity:.9;
}
.box-wetter img {
  pointer-events:none;
}
.box-wetter a {
	display:block;
	text-decoration:none;
}
@media all and (min-width:640px) {
	.box-wetter {
    margin-bottom:0;
	}
}
.wetter-tabs {
  display:flex;
  flex-direction:row;
  padding:0px 2px 0px 2px;
}
.wetter-tab {
  width:16.666%;
  text-align:center;
  z-index:0;
  transition: all 300ms ease-in-out;
}
.wetter-tab .wt {
  margin:-8px 2px 4px 2px;
}
.wetter-tab .wt1 {
  padding:2px 0 3px 0;font-weight:700;font-size:1rem;color:#444;
}
.wetter-tab .wt2 {
  font-weight:500;color:#fff;font-size:1.8rem;margin:-5px 0 3px 0;
}
.wetter-tab .wt3 {
  font-weight:400;color:#fff;font-size:1.1rem;padding:2px 0 5px 0;
  
}
.wetter-tab .wt3 img {
  width:18px;height:18px;margin:-3px 0px 0 0;padding:0;
}
.wetter-tab img {
  width:100%;
  padding:4px 12px;
  filter:invert(1) brightness(200);
}
#fctt {
  position:absolute;display:none;top:80px;width:100%;z-index:1;text-align:center;
}
#fctt span {
  display:inline-block;padding:5px 10px;background:rgba(50, 50, 50, 0.9);color:#fff;font-size:1.3rem;
}


@media all and (min-width:640px) {

  .artikelblock-klein:hover {
    background-color:var(--bg-contrast);
    outline:8px solid var(--bg-contrast);
  }
  .artikelblock-klein:hover .box-img-klein {
    scale:1.06;
  }
}
.artikel-a {
	text-decoration:none;
	display:block;
	overflow:hidden;
  border-radius: var(--border-radius);
}
@media all and (max-width:640px) {
  .artikel-a { margin:0 10px; }
}

.titel-cont {
  max-width:700px;
  margin:10px 30px 8px 0;
	transition:all 0.3s;
}

.fronttop, .subfronttop { height:300px !important; }
@media all and (min-width:1000px) {
  .fronttop { height:460px !important; }
  .subfronttop { height:380px !important; }
  .fronttoptitel { font-size: 2.8rem !important; }
}

.card .wrapper {
	cursor:pointer;
	position:relative;
	overflow:hidden;
  margin:0 !important;
}
@media all and (min-width:640px) {
  .card .wrapper:hover .titel-cont {
    translate: 0 -5px;
  }
}
.card .data {
	background:linear-gradient(to top, rgba(35, 35, 35, .9) 0%, rgba(35, 35, 35, 0) 95%);
	position:absolute;
	bottom:0;
	width:100%;
	transition:all 0.6s;
}
.card .data .content {
	position:relative;
	z-index:1;
}
.rubrik-medium {
	text-transform:uppercase;
	margin:10px 0px 0px 0px;
	padding:4px 5px 3px 15px;
	color:#fff;
	font-size:1.2rem;
	font-weight:400;
}
.rubrik {
	text-transform:uppercase;
	margin:10px 0px 0px 10px;
	padding:4px 10px 3px 10px;
	font-size:1.3rem;
	font-weight:700;
	background-color:var(--main-color);
	color:#fff;
}
.rubrik-add {
	text-transform:uppercase;
	margin:10px 0px 0px 5px;
	padding:4px 7px 3px 7px;
	font-size:1.2rem;
	font-weight:400;
	background-color:rgba(50, 50, 50, 0.7);
	color:#fff;
}
.rubrik-add img, .rubrik-klein-add img {
  width:12px;height:12px;margin:-2px 3px 0 0;filter:invert(1);
}
.datum-add, .corner-add {
  position:absolute;
  display:inline-flex;
  text-align:center;
	margin:10px 0 0 20px;
	color:#222;
	font-size:2.8rem;
	font-weight:400;
  animation: floating 4s ease infinite;
}
@keyframes floating {
  0% { scale:1; }
  50% { scale:.9;  }
  100% { scale:1;  }
}

.corner-add.live div {
  border-radius:6px;
  font-size:1.4rem
}

.corner-add.quiz img {
  width:34px;height:34px;
  filter:drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.2));
}
.corner-add.quiz span {
  display:block;
  background:var(--bg-color-light);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:9px;border-radius:var(--border-radius);font-size:1.3rem;font-weight:500;
  filter:drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.2));
}
.datum-add div {
  width:60px;
	background-color:rgba(255, 255, 255, 0.85);
  padding-bottom:2px;
  border-radius:var(--border-radius);
}
.datum-add div.bis {
  width:inherit;
  background-color:transparent;
  color:#fff;
  margin:15px 10px 0 10px;
}
.datum-add div span {
  display:block;
	padding:3px 0 2px 0;
  margin-bottom:2px;
  color:#fff;
	background-color:#f23d5b;
  font-size:1.2rem;
  font-weight:700;
  border-radius:var(--border-radius) var(--border-radius) 0 0;
}
.datum-add-small {
  display:inline-block;
  color:#fff;
	font-size:1.8rem;
	background-color:var(--rubrik-events);
  padding:1px 4px;
  margin:4px 0 10px 0;
  border-radius:var(--border-radius);
  opacity:.9;
}
.add2 {
	padding-left:0 !important;
}
.rubrik-live {
	animation-name:animation_blink;
	animation-timing-function:linear;
	animation-duration:2s; 
	animation-iteration-count:infinite;
	text-transform:uppercase;
	margin:10px 0px 0px 0px;
	padding:4px 7px 3px 7px;
	color:#fff;
	font-size:1.2rem;
	font-weight:500;
	background-color:hsla(0, 100%, 48%, 0.9);
}
.live-pulse {
  display:inline-block;width:8px;height:8px;margin:-2px 4px 0 0;border-radius:50%;background:#fff;vertical-align:middle;
}

@media all and (max-width:640px) {
  .rubrik, .rubrik-medium, .rubrik-add, .rubrik-live { font-size:1.1rem; }
}

.card .titel {
	margin:0 10px 10px 10px;
}
.card .text {
	height:59px;
  text-align:center;
	font-size:1.4rem;
  scale:.5;
	transition:all 0.4s;
}
.box-artikel .wrapper:hover .menu-content span {
	transform:translate(-50%, -10px);
	opacity:1;
}
.box-artikel .wrapper:hover .titel {
  line-height:165%;
}
.box-artikel .data {
	transform:translateY(59px);
}
.box-artikel .titel {
  color:var(--titel-color);
  font-size:2rem;
  text-decoration:none;
  font-weight:500;
  line-height:150%;
  word-break:break-word;
  margin-left:10px;
  padding:1px 9px;
  background:var(--titel-bg);
  border-radius:12px;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
	transition:all 0.3s ease-in-out;
}

.box-img {
  pointer-events:none;position:absolute;width:100%;height:280px;object-fit:cover;object-position:center;
}
.box-img-klein {
  pointer-events:none;width:106px;height:106px;object-fit:cover;object-position:center;
}

.pretitel-line {
  padding-top:6px;white-space:nowrap;overflow:hidden;
}

.wrapper-klein {
  width:106px;height:106px;overflow:hidden;float:left;margin:0 10px 0 0;
}
.artikelblock-klein {
	padding-right:15px;
	display:block;
	cursor:pointer;
	height:106px;
	overflow:hidden;
	border-radius:var(--border-radius);
	transition:all 0.2s ease-in-out;
  background:var(--titel-box-hover);
  text-decoration:none !important;
  filter:drop-shadow(0px 0px 0px rgba(22, 27, 34, 0.15));
  outline:0 solid transparent;
}
.artikelblock-klein .box-img-klein {
	transition:all 0.2s ease-in-out;
}

.artikelblock-medium {
	display:block;
	cursor:pointer;
	overflow:hidden;
  border-radius:var(--border-radius);
}
.artikelblock-medium-content {
	padding:5px 15px 10px 15px !important;
}

.artikelblock-klein img {
  pointer-events:none;
}

.artikelblock-titel {
	margin-top:10px;
	font-weight:500;
	color:var(--titel-color);
	text-decoration:none;
  line-height:130%;
}
.artikelblock-titel.klein {
	font-size:1.6rem;
  overflow:hidden;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  line-clamp: 3;
  -webkit-line-clamp: 3;
}
.artikelblock-titel.medium {
	font-size:1.7rem;
}
@media all and (max-width:640px) {
  .artikelblock-titel.medium, .artikelblock-titel.klein {
    font-size:1.7rem;
  }
  .artikelblock-medium {
    margin:0 10px;
    border-top-right-radius:var(--border-radius);
    border-top-left-radius:var(--border-radius);
  }
	.artikelblock-klein {
		margin:0 10px;
	}
  .artikelblock-klein div:first-of-type {
    border-radius:var(--border-radius);
  }
	.artikelblock-klein:first-child {
		margin-top:-20px;
	}
	.artikelblock-klein {
    border-radius:var(--border-radius);
	}
}

.rubrik-klein-live {
	animation-name:animation_blink;
	animation-timing-function:ease-in;
	animation-duration:2s; 
	animation-iteration-count:infinite;
	text-transform:uppercase;
	margin-right:10px;
	color:#fff;
	font-size:1.1rem;
	font-weight:500;
  background-color:#eee;
  padding:2px 4px 2px 4px;
  border-radius:3px;
}
.rubrik-klein-add img {
  float:inherit;
	filter:invert(var(--png-invert));
	opacity:.3;
}

@keyframes animation_blink {
	0% { background-color:hsla(0, 100%, 48%, 1); }
	20% { background-color:hsla(0, 100%, 48%, .7); }
	50% { background-color:hsla(0, 100%, 48%, 0.4); }
	80% { background-color:hsla(0, 100%, 48%, .7); }
	100% { background-color:hsla(0, 100%, 48%, 1); }
}

.rubrik-klein-add {
	text-transform:uppercase;
	margin-right:10px;
	color:#999;
	font-size:1.1rem;
	font-weight:500;
}
.rubrik-klein {
	margin-right:10px;
	color:var(--main-color);
	text-transform:uppercase;
	font-size:1.3rem;
	font-weight:500;
}




/* Tab Boxen */

.box-tab-container {
  margin-bottom:10px;margin-top:-48px;border-bottom:2px solid var(--bg-contrast);
}
.box-tab {
  display:inline-block;background:var(--bg-contrast);padding:10px;margin-bottom:0px;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius);font-size:1.4rem;font-weight:500;translate:0 0;transition:all 0.2s ease-in-out;
}
.box-tab img {
  width:16px;height:16px;margin:-3px 3px 0 0;filter:invert(var(--png-invert));
}
.box-tab.inaktiv {
  opacity:.7;padding:8px 10px 8px 10px;cursor:pointer;
}
.box-tab.inaktiv:hover {
  opacity:1;padding:10px;
}
.mgmknr {
  position:relative;margin-bottom:-28px;outline:2px solid var(--bg-color);background:var(--main-color);color:#eee;text-align:center;padding-top:5px;width:28px;height:28px;border-bottom-right-radius:var(--border-radius);border-top-left-radius:var(--border-radius);
}
@media screen and (max-width:640px) {
  .box-tab-container {
    margin:15px 10px 10px 10px;
  }
}

.box::-webkit-scrollbar {
	width:8px;
	background-color:var(--scrollbar2);
}
.box::-webkit-scrollbar-button {
	height:0px;
}
.box::-webkit-scrollbar-thumb {
	background-color:var(--scrollbar1);
}
.box {
	margin:0 0 20px 0;
}
.box.mgmk {
  height:545px;
}
@media all and (min-width:640px) {
.box {
  padding:10px 0;
  margin:-10px 0 0 0;
	overflow-y:auto;
	scrollbar-color:var(--scrollbar1) var(--scrollbar2);
  scrollbar-width:thin;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scroll:touch;
}
.box.km {
	height:474px;
}
.box.mgmk {
  height:389px;
}
}









/* Lazy Loading */

.gradient-load {
    background: var(--gradient-loader);
    background-size: 200% 200%;
    animation: gradientload 1s ease infinite;
}
@keyframes gradientload { 
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}




/* Buttons */

.btn-bg-main span,
.btn-bg-main:before {
  background: var(--main-color2);
}

.btn-bg-blau span,
.btn-bg-blau:before {
  background: #58aeff;
}


.btn-bg-white span,
.btn-bg-white:before {
  font-size:1.3rem !important;
  padding: 5px 10px 4px 10px !important;
  background: var(--bg-contrast);
  vertical-align: middle;
  color:var(--font-color);
}
.btn-bg-white2 span,
.btn-bg-white2:before {
  font-size:1.3rem !important;
  padding: 5px 10px 4px 10px !important;
  background: var(--bg-color);
  vertical-align: middle;
  color:var(--font-color);
}



.hoi-button {
  display: inline-block;
  all:unset;
  cursor:pointer;
  color: #fff;
  position: relative;
}
.hoi-button i {
  margin-top: -1px;
  margin-right: 20px;
  font-size: 1.265em;
  vertical-align: middle;
}
.hoi-button span {
  display: inline-block;
  padding: 10px 30px;
  border-radius: 6px;
  font-size: 1.4rem;
  position: relative;
  will-change: transform, filter;
  transform-style: preserve-3d;
  transition: all 0.3s ease-out;
}
.hoi-button span img {
  width:14px;height:14px;
  transition: all 0.3s ease-out;
}
.hoi-button:focus, .hoi-button:active {
  color: #fff;
}
.hoi-button:hover {
  color: #fff;
}
.hoi-button:hover span {
  filter: brightness(1.05) contrast(1.05);
  transform: scale(0.95);
}
.btn-bg-white2.hoi-button:hover span {
  filter: inherit;
  background: var(--bg-contrast);
  transform: scale(0.95);
}
.hoi-button:hover span img {
  rotate:-35deg !important;
  scale:1.4;
}

.file-upload, .file-upload-logo {
	position: relative;
	display: block;
  margin-top:20px;
}
.file-upload__input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  font-size: 1;
  width: 0;
  height: 100%;
  opacity: 0;
}


/* Buttons Alt */

.btn {
  display:inline-block;
  border:0;
  border-radius:6px;
  white-space:nowrap;
  margin-top:.5rem;
  cursor:pointer;
  padding:.6rem 2.5rem;
  font-size:1.4rem;
  color:#fff;
  transition: all 0.2s ease-in-out;
	background-color:var(--main-color);
}
.btn:hover,
.btn:focus {
	transform:scale(1.05);
  text-decoration:none;
}
.btn-nh:hover,
.btn-nh:focus {
	transform:none;
  box-shadow:none;
}
.btn:active {
	transform:scale(0.95);
}
.btn.btn-newsletter {
	background-color:var(--main-color);
}
.btn.btn-aktuell {
	background-color:var(--rubrik-aktuell);
}
.btn.btn-magazin {
	background-color:var(--rubrik-magazin);
}
.btn.btn-events {
	background-color:var(--rubrik-events);
}
.btn.btn-quiz {
	background-color:var(--rubrik-quiz);
}
.btn.btn-monstory {
	background-color:var(--rubrik-monstory);
}
.btn.btn-wetter {
	background-color:#4285c9;
}
.btn.btn-light {
  background-color:var(--bg-contrast);
  color:var(--font-color);
}
.btn.btn-white {
  padding:.4rem 1.5rem .3rem 1.5rem;
  background-color:var(--bg-color);
  color:var(--font-color);
}
.btn.btn-link {
  background:transparent;
  border-color:transparent;
  color:#333;
}
.btn.btn-link:focus,
.btn.btn-link:hover,
.btn.btn-link:active {
  background:#f4f4f4;
  color:#333;
}
.btn-link-hd {
  display:flex;
  background:var(--bg-contrast);
  border:7px solid transparent;
  color:#fff;
  font-size:1.2rem;
  font-weight:500;
  padding:2px;
  border-radius:50% !important;
  width:38px;height:38px;
  cursor:pointer;
  justify-content:center;
  padding-top:2px;
  margin-top:6px;
  margin-left:6px;
}
.btn-link-hd img {
  filter:invert(var(--png-invert));width:20px;height:20px;opacity:.6;
}
.btn-link-hd-color {
  background:var(--main-color-light);
  border:5px solid var(--header-bg);
  padding:2px;
  border-radius:50% !important;
  width:48px;height:48px;
  margin-left:7px;
  cursor:pointer;
  transition: all 0.2s ease-out;
}
.btn-link-hd-color img {
  filter:invert(var(--png-invert));width:32px;height:32px;
}
.btn-link-hd:hover {
  background:var(--main-color-light);
}
.btn-link-hd:hover img {
  opacity:1;
}
.btn-link-hd-color:hover {
  border:2px solid var(--main-color);
  background:var(--main-color);
}
.btn-link-hd-color:hover img {
  filter:invert(1);
}
.btn.btn-sm {
  border-radius:1.5rem;
  font-size:1.3rem;
  height:2.4rem;
  line-height:1.4rem;
  padding:.6rem 1rem;
}
.btn.btn-lg {
  font-size:1.6rem;
  height:3rem;
  padding:.6rem 1rem;
}
.btn-link {
  all:unset;
  background:transparent;
  border-bottom:2px solid transparent;
  cursor:pointer;
}
.btn-link:hover {
  border-bottom:2px solid var(--font-color);
}

@media screen and (max-width:640px) {
  .hoi-button span {
    padding: 7px 30px;
  }
}








/* Formulare */





.input-wrapper {
  position: relative;
}
.input-wrapper .form-input::placeholder {
  color: transparent;
}
.input-wrapper .form-input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
}

.input-wrapper .label {
  position: absolute;
  display:block;
  font-size:1.5rem;
  top: 7px;
  left: 9px;
  color:#777;
  padding:3px 6px;
  border-radius:.5rem;
  background:var(--bg-color);
  pointer-events: none;
  transform-origin: left center;
  transition: transform 250ms;
}

.input-wrapper .form-input:focus + .label,
.input-wrapper .form-input:not(:placeholder-shown) + .label {
  transform: translateY(-19px) scale(0.6);
  padding:4px 8px;
  border:0px solid var(--bg-contrast-dark);
  background:var(--main-color-extralight);
}


@media screen and (max-width:640px) {
.cism {
  display:block;text-align:center;
}
}

.form-group:not(:last-child) {
  margin-top:1rem;
  margin-bottom:1rem;
}
.form-input {
  background:var(--bg-color);
  color:var(--font-color);
  background-image:none;
  border:1px solid var(--bg-contrast-dark);
  border-radius:var(--border-radius);
  display:block;
  font-size:1.4rem;
  height:3.2rem;
  line-height:1.6rem;
  max-width:100%;
  outline:0;
  padding:19px 10px 16px 10px;
  position:relative;
  width:100%;
}
.form-input.mail-input {
  background:var(--bg-color) url(data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%203334%203334%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3B%22%3E%3Cpath%20d%3D%22M2916.67%2C1111.11l-494.556%2C274.753c-275.722%2C153.178%20-413.583%2C229.775%20-559.583%2C259.803c-129.222%2C26.569%20-262.5%2C26.569%20-391.722%2C-0c-145.995%2C-30.028%20-283.857%2C-106.625%20-559.584%2C-259.803l-494.555%2C-274.753m444.444%2C1527.78l1611.11%2C-0c155.57%2C-0%20233.361%2C-0%20292.778%2C-30.278c52.264%2C-26.625%2094.764%2C-69.125%20121.389%2C-121.389c30.278%2C-59.416%2030.278%2C-137.208%2030.278%2C-292.778l-0%2C-1055.56c-0%2C-155.57%20-0%2C-233.356%20-30.278%2C-292.775c-26.625%2C-52.268%20-69.125%2C-94.763%20-121.389%2C-121.393c-59.417%2C-30.277%20-137.208%2C-30.277%20-292.778%2C-30.277l-1611.11%2C0c-155.569%2C0%20-233.355%2C0%20-292.775%2C30.277c-52.268%2C26.63%20-94.762%2C69.125%20-121.393%2C121.393c-30.276%2C59.419%20-30.276%2C137.204%20-30.276%2C292.775l-0%2C1055.56c-0%2C155.57%20-0%2C233.362%2030.276%2C292.778c26.631%2C52.264%2069.125%2C94.764%20121.393%2C121.389c59.42%2C30.278%20137.204%2C30.278%20292.775%2C30.278Z%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A208.33px%3B%22%2F%3E%3C%2Fsvg%3E) no-repeat left 1rem center / 2rem 2rem;
  padding-left:3.5rem;
}
.form-input.user-input {
  background:var(--bg-color) url(data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%203334%203334%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3B%22%3E%3Cpath%20d%3D%22M1690.21%2C1666.67c326.355%2C-0%20590.924%2C-264.566%20590.924%2C-590.924c-0%2C-326.358%20-264.569%2C-590.924%20-590.924%2C-590.924c-326.356%2C0%20-590.921%2C264.566%20-590.921%2C590.924c-0%2C326.358%20264.565%2C590.924%20590.921%2C590.924Z%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A220.83px%3B%22%2F%3E%3Cpath%20d%3D%22M603.004%2C2848.51c67.41%2C-232.446%20206.582%2C-437.626%20397.621%2C-586.208c191.037%2C-148.582%20424.159%2C-232.966%20666.042%2C-241.085c486.921%2C-0%20901.749%2C343.918%201063.66%2C827.293%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A220.83px%3B%22%2F%3E%3C%2Fsvg%3E) no-repeat left 1rem center / 2rem 2rem;
  padding-left:3.5rem;
}
.form-input.pass-input {
  background:var(--bg-color) url(data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%203334%203334%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3B%22%3E%3Cpath%20d%3D%22M442.333%2C2156.4c-0%2C-346.29%20-0%2C-519.436%20107.58%2C-627.018c107.579%2C-107.582%20280.726%2C-107.582%20627.02%2C-107.582l979.467%2C-0c346.291%2C-0%20519.436%2C-0%20627.018%2C107.582c107.582%2C107.582%20107.582%2C280.728%20107.582%2C627.018c0%2C346.291%200%2C519.436%20-107.582%2C627.018c-107.582%2C107.582%20-280.727%2C107.582%20-627.018%2C107.582l-979.467%2C0c-346.294%2C0%20-519.441%2C0%20-627.02%2C-107.582c-107.58%2C-107.582%20-107.58%2C-280.727%20-107.58%2C-627.018Z%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A208.33px%3B%22%2F%3E%3Cpath%20d%3D%22M932.066%2C1421.8l0%2C-244.867c0%2C-405.708%20328.892%2C-734.6%20734.601%2C-734.6c405.707%2C-0%20734.6%2C328.892%20734.6%2C734.6l-0%2C244.867%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A208.33px%3Bstroke-linecap%3Around%3B%22%2F%3E%3Cpath%20d%3D%22M1176.93%2C2156.4l1.102%2C0m487.53%2C0l1.102%2C0m488.631%2C0l1.102%2C0%22%20style%3D%22fill%3Anone%3Bfill-rule%3Anonzero%3Bstroke%3A%23777%3Bstroke-width%3A291.67px%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3B%22%2F%3E%3C%2Fsvg%3E) no-repeat left 1rem center / 2rem 2rem;
  padding-left:3.5rem;
}
.form-input.euro-input {
  background:var(--bg-color) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xOSA3LjExMTExQzE3Ljc3NSA1LjIxODY0IDE1Ljg1NTYgNCAxMy42OTc5IDRDOS45OTg3NSA0IDcgNy41ODE3MiA3IDEyQzcgMTYuNDE4MyA5Ljk5ODc1IDIwIDEzLjY5NzkgMjBDMTUuODU1NiAyMCAxNy43NzUgMTguNzgxNCAxOSAxNi44ODg5TTUgMTBIMTRNNSAxNEgxNCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPg0KPC9zdmc+) no-repeat left 1rem center / 2rem 2rem;
  padding-left:3.5rem;
}
.form-input.suche-input {
  background:var(--bg-color) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAzMzM0IDMzMzQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDsiPjxwYXRoIGQ9Ik0yMDYzLjk5LDIwNjIuOTRsODEzLjM2Myw4MTQuNDEybS01MzguMDgsLTE0NzkuNzJjLTAsNTIwLjA1NSAtNDIxLjU4Nyw5NDEuNjQyIC05NDEuNjQyLDk0MS42NDJjLTUyMC4wNTMsLTAgLTk0MS42NDEsLTQyMS41ODcgLTk0MS42NDEsLTk0MS42NDJjMCwtNTIwLjA1MyA0MjEuNTg4LC05NDEuNjQxIDk0MS42NDEsLTk0MS42NDFjNTIwLjA1NSwwIDk0MS42NDIsNDIxLjU4OCA5NDEuNjQyLDk0MS42NDFaIiBzdHlsZT0iZmlsbDpub25lO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTojMDAwO3N0cm9rZS13aWR0aDoyNjIuNXB4OyIvPjwvc3ZnPg==) no-repeat left 1rem center / 2rem 2rem;
  padding-left:3.5rem;
}
.form-input.suche-input2 {
  background:#ffffff33 url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAzMzM0IDMzMzQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDsiPjxwYXRoIGQ9Ik0yMDYzLjk5LDIwNjIuOTRsODEzLjM2Myw4MTQuNDEybS01MzguMDgsLTE0NzkuNzJjLTAsNTIwLjA1NSAtNDIxLjU4Nyw5NDEuNjQyIC05NDEuNjQyLDk0MS42NDJjLTUyMC4wNTMsLTAgLTk0MS42NDEsLTQyMS41ODcgLTk0MS42NDEsLTk0MS42NDJjMCwtNTIwLjA1MyA0MjEuNTg4LC05NDEuNjQxIDk0MS42NDEsLTk0MS42NDFjNTIwLjA1NSwwIDk0MS42NDIsNDIxLjU4OCA5NDEuNjQyLDk0MS42NDFaIiBzdHlsZT0iZmlsbDpub25lO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTojZmZmO3N0cm9rZS13aWR0aDoyNjIuNXB4OyIvPjwvc3ZnPg==) no-repeat left 1rem center / 2.2rem 2.2rem;
  padding-left:4rem;backdrop-filter:blur(6px);color:#fff;border:0 !important;outline:0 !important;padding-top:2.4rem;padding-bottom:2.4rem;border-radius:30px;
}
.form-input.suche-input2::placeholder {
  color: #fff;
  opacity: 1;
}
.form-input.suche-input2:focus::placeholder {
  opacity: .3;
}

.form-input.noborder {
  border:0;
}
.form-input:focus, .form-select:focus {
  outline: 3px solid var(--main-color-extralight);
}
.form-input[disabled] {
  opacity:.6;
}
.form-input.input-sm {
  border-radius:.2rem;
  font-size:1.2rem;
  height:2.4rem;
  padding:.3rem .6rem;
}
.form-input.input-lg {
  border-radius:.4rem;
  font-size:1.6rem;
  height:4.2rem;
  line-height:2rem;
  padding:1rem .8rem;
}
.form-input.input-inline {
  display:inline-block;
  vertical-align:middle;
  width:auto;
}
.form-label {
  display:block;
  line-height:1.6rem;
  margin-bottom:.5rem;
}
.form-select {
  background:var(--bg-color);
  color:var(--font-color);
  border:1px solid var(--bg-contrast-dark);
  border-radius:var(--border-radius);
  font-size:1.4rem;
  line-height:1.6rem;
  outline:0;
  padding:10px 6px;
  vertical-align:middle;

}
.form-select.select-sm {
  border-radius:.2rem;
  font-size:1.2rem;
  height:2.4rem;
  padding:.4rem 2rem .4rem .6rem;
}
.form-select.select-lg {
  font-size:1.6rem;
  height:4.2rem;
  line-height:2rem;
  padding:1rem 2.4rem 1rem .8rem;
}
.form-checkbox inut,
.form-radio input,
.form-switch input {
  clip:rect(0, 0, 0, 0);
  height:.1rem;
  margin:-.1rem;
  overflow:hidden;
  position:absolute;
  width:.1rem;
}
.form-checkbox,
.form-radio {
  cursor:pointer;
  display:inline-block;
  line-height:1.8rem;
  padding:.3rem 2rem;
  position:relative;
}
.form-checkbox .form-icon,
.form-radio .form-icon {
  border:.1rem solid #c5c5c5;
  display:inline-block;
  font-size:1.4rem;
  height:1.4rem;
  left:0;
  line-height:2.4rem;
  outline:none;
  padding:0;
  position:absolute;
  top:.5rem;
  transition:all .15s ease;
  vertical-align:top;
  width:1.4rem;
}
.form-checkbox:hover .form-icon,
.form-radio:hover .form-icon {
  border-color:#929292;
}
.form-checkbox input:focus + .form-icon,
.form-radio input:focus + .form-icon {
  border-color:var(--main-color);
}
.form-checkbox input:checked + .form-icon,
.form-radio input:checked + .form-icon {
  background:var(--main-color);
  border-color:var(--main-color);
}
.form-checkbox input:active + .form-icon,
.form-radio input:active + .form-icon {
  background:#efefef;
}
.form-checkbox .form-icon {
  border-radius:.2rem;
}
.form-checkbox input:checked + .form-icon::after {
  background-clip:padding-box;
  border:.2rem solid #fff;
  border-left-width:0;
  border-top-width:0;
  content:"";
  height:1rem;
  left:50%;
  margin-left:-.3rem;
  margin-top:-.6rem;
  position:absolute;
  top:50%;
  transform:rotate(45deg);
  width:.6rem;
}
.form-checkbox input:indeterminate + .form-icon {
  background:var(--main-color);
  border-color:var(--main-color);
}
.form-checkbox input:indeterminate + .form-icon::after {
  background:#fff;
  content:"";
  height:.2rem;
  left:50%;
  margin-left:-.4rem;
  margin-top:-.1rem;
  position:absolute;
  top:50%;
  width:.8rem;
}
.form-radio .form-icon {
  border-radius:.7rem;
}
.form-radio input:checked + .form-icon::after {
  background:#fff;
  border-radius:.2rem;
  content:"";
  height:.4rem;
  left:50%;
  margin-left:-.2rem;
  margin-top:-.2rem;
  position:absolute;
  top:50%;
  width:.4rem;
}
.form-switch {
  cursor:pointer;
  display:inline-block;
  line-height:2rem;
  margin-top:2px;
  padding:.3rem 2rem .3rem 3.6rem;
  position:relative;
}
.form-switch .form-icon {
  background:#c5c5c5;
  background-clip:padding-box;
  border:.1rem solid #c5c5c5;
  border-radius:.9rem;
  display:inline-block;
  height:1.8rem;
  left:0;
  line-height:2.6rem;
  outline:none;
  padding:0;
  position:absolute;
  top:.4rem;
  vertical-align:top;
  width:3rem;
}
.form-switch .form-icon::after {
  background:#fff;
  border-radius:50%;
  content:"";
  display:block;
  height:1.2rem;
  margin:2px;
  left:0;
  position:absolute;
  top:0;
  transition:left .15s ease;
  width:1.2rem;
}
.form-switch input:checked + .form-icon {
  background:var(--main-color);
  border-color:var(--main-color);
}
.form-switch input:checked + .form-icon::after {
  left:1.2rem;
}
.form-switch input:active + .form-icon::after {
  background:#efefef;
}
.input-group {
  display:flex;
}
.input-group .input-group-addon {
  background:#f9f9f9;
  border:.1rem solid #c5c5c5;
  border-radius:.3rem;
  line-height:1.6rem;
  padding:.7rem .8rem;
}
.input-group .input-group-addon.addon-sm {
  font-size:1.2rem;
  padding:.3rem .6rem;
}
.input-group .input-group-addon.addon-lg {
  font-size:1.6rem;
  line-height:2rem;
  padding:1rem .8rem;
}
.input-group .input-group-addon,
.input-group .input-group-btn {
  flex:1 0 auto;
}
.input-group .form-input:focus,
.input-group .input-group-addon:focus,
.input-group .input-group-btn:focus {
  z-index:99;
}










/* Responsive Hide + Show */

@media screen and (min-width:900px) {
  .hide-lg {
	display:none !important;
  }
}
@media screen and (max-width:900px) {
  .show-lg {
	display:none !important;
  }
  .newline-sm {
	display:block !important;
  }
}





/* Tooltips */

.tooltip {
  position:relative;
  z-index:3;
}
.tooltip::after {
  border-radius:1em;
  background:var(--main-color);
  bottom:100%;
  color:#fff;
  content:attr(data-tooltip);
  display:block;
  font-size:1.2rem;
  left:50%;
  max-width:100rem;
  opacity:0;
  overflow:hidden;
  margin-top:4px;
  padding:3px 13px;
  pointer-events:none;
  position:absolute;
  text-overflow:ellipsis;
  transform:translate(-50%, 0);
  transition:all 200ms ease;
  z-index:1;
}
.tooltip:hover::after {
  opacity:1;
  transform:translate(-50%, -5px);
}
.tooltip.tooltip-right::after {
  background:rgba(85, 85, 85, .95);
  font-size:1rem;
  bottom:50%;
  left:100%;
  transform:translate(-20%, 50%);
}
.tooltip.tooltip-right:hover::after {
  transform:translate(3px, 50%);
}
.tooltip.tooltip-bottom::after {
  bottom:auto;
  color:var(--font-color);
  top:100%;
  background:transparent;
  transform:translate(-50%, -50%);
}
.tooltip.tooltip-bottom:hover::after {
  transform:translate(-50%, 5px);
  opacity:.8;
}
.tooltip.tooltip-bottom.sm:hover::after {
  transform:translate(-50%, -10px);
  opacity:.8;
  font-size:1.1rem;
}
.tooltip.tooltip-left::after {
  bottom:50%;
  left:auto;
  right:100%;
  transform:translate(0, 50%);
}
.tooltip.tooltip-left:hover::after {
  transform:translate(-.5rem, 50%);
}









/* Nice Modal */

.hoimodal-overlay{display:none;z-index:99;position:fixed;left:0;top:0;overflow-y:auto;background-color:rgba(0,0,0,0.7);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);}
.hoimodal-wrap-modal-content{display:none;}
.hoimodal-window{position:relative;max-height:70vh;overflow-y:auto;display:none;-webkit-user-select:none;user-select:none;background:var(--bg-contrast);z-index:99;background-position:center center;background-repeat:no-repeat;background-image:url(../../images/ico_loading.svg);background-size:40px;border-radius:14px;box-shadow:0 0 20px 0 rgba(0,0,0,0.5)}
.hoimodal-close-button{cursor:pointer;background-image:url(../../images/ico_close.svg);background-color:var(--bg-contrast);background-size:70% 70%;background-repeat:no-repeat;background-position:center center;border:0;margin:8px 8px 0 0;width:24px;height:24px;border-radius:50%;padding:4px;position:absolute;right:10px;top:10px;z-index:9;}
.hoimodal-close-button:hover{scale:1.1;}

.closebtn {
  float:right;width:24px;height:24px;margin:10px 12px 0 0;background:var(--bg-contrast);border-radius:50%;padding:4px;cursor:pointer;filter:invert(var(--png-invert));
}
.closebtn:hover {
  scale:1.1;
}








/* Event Slider */

.sliderbox {
	margin:-20px 10px 0 10px;
  border-radius:var(--border-radius);
}
@media (max-width:740px) {
  .sliderbox {
    margin:-25px 0 0 0;
  }
  .sliderbox a div {
    margin:0 5px;
  }
}
.hoislider-enabled {
  position:relative;
}
.hoislider-enabled:focus { outline: none; }
.hoislider-viewport {
  overflow:hidden;
  position:relative;
  height:100%;
}
.hoislider-slider {
  position:absolute;
  width:100%;
  height:100%;
}
.hoislider-button {
  position:absolute;
  background:hsla(0, 0%, 100%, 0.75);
  border:none;
  color:#333;
}
.hoislider-button:hover {
  background:white;
  cursor:pointer;
}
.hoislider-button:focus {
  outline:none;
  box-shadow:0 0 0 5px #19F;
}
.hoislider-button:active {
  opacity:.6;
}
.hoislider-button:disabled {
  opacity:.3;
  cursor:auto;
  pointer-events:none;
}
.hoislider-button-icon {
  fill:currentColor;
}
.hoislider-prev-next-button {
  top:50%;
  padding:20px;
  width:40px;
  height:40px;
  border-radius:50%;
  transform:translateY(-50%);
}
.hoislider-prev-next-button.previous { left: -35px; }
.hoislider-prev-next-button.next { right: -35px; }
.hoislider-prev-next-button .hoislider-button-icon {
  position: absolute;
  left:30%;
  top:30%;
  width:40%;
  height:40%;
}
.hoislider-page-dots {
  display:none;
}

@media all and (max-width:640px) {
  .carousel {
    -webkit-mask-image: linear-gradient(to right, transparent -10%, black 5%, black 95%, transparent 110%);
    mask-image: linear-gradient(to right, transparent -10%, black 5%, black 95%, transparent 110%);
  }
  .carousel-cell {
    width:80%;
    counter-increment:carousel-cell;
    padding:20px 0;
  }
  .hoislider-prev-next-button.previous {
    display:none;
  }
  .hoislider-prev-next-button.next {
    display:none;
  }
}
@media all and (min-width:640px) {
  .carousel-cell {
    width:50%;
    counter-increment:carousel-cell;
    padding:20px 0;
  }
}
@media all and (min-width:1100px) {
  .carousel-cell {
    width:25%;
    counter-increment:carousel-cell;
    padding:20px 0;
  }
}










/* hoimap Map */

.hoimap-control-attribution,
.hoimap-bar,
.hoimap-pane {
  z-index: 0 !important;
}

.hoimap-pane,
.hoimap-tile,
.hoimap-marker-icon,
.hoimap-marker-shadow,
.hoimap-tile-container,
.hoimap-pane > svg,
.hoimap-pane > canvas,
.hoimap-zoom-box,
.hoimap-image-layer,
.hoimap-layer {
	position: absolute;
	left: 0;
	top: 0;
}
.hoimap-container {
	overflow: hidden;
}
.hoimap-tile,
.hoimap-marker-icon {
	-webkit-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
}
.hoimap-tile::selection {
	background: transparent;
}
.hoimap-safari .hoimap-tile {
	image-rendering: -webkit-optimize-contrast;
}
.hoimap-safari .hoimap-tile-container {
	width: 1600px;
	height: 1600px;
  transform-origin: 0 0;
}
.hoimap-marker-icon {
	display: block;
}
.hoimap-container .hoimap-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
}
.hoimap-container .hoimap-marker-pane img,
.hoimap-container .hoimap-shadow-pane img,
.hoimap-container .hoimap-tile-pane img,
.hoimap-container img.hoimap-image-layer,
.hoimap-container .hoimap-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
}

.hoimap-container img.hoimap-tile {
	mix-blend-mode: plus-lighter;
}

.hoimap-container.hoimap-touch-zoom {
	touch-action: pan-x pan-y;
}
.hoimap-container.hoimap-touch-drag {
	touch-action: none;
	touch-action: pinch-zoom;
}
.hoimap-container.hoimap-touch-drag.hoimap-touch-zoom {
	touch-action: none;
}
.hoimap-container {
	-webkit-tap-highlight-color: transparent;
}
.hoimap-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.hoimap-tile {
	filter: inherit;
	visibility: hidden;
}
.hoimap-tile-loaded {
	visibility: inherit;
}
.hoimap-zoom-box {
	width: 0;
	height: 0;
	box-sizing: border-box;
}
.hoimap-overlay-pane svg {
  -webkit-user-select: none;
  user-select: none;
}

.hoimap-pane         { z-index: 400; }
.hoimap-tile-pane    { z-index: 200; }
.hoimap-overlay-pane { z-index: 400; }
.hoimap-shadow-pane  { z-index: 500; }
.hoimap-marker-pane  { z-index: 600; }
.hoimap-tooltip-pane   { z-index: 650; }
.hoimap-popup-pane   { z-index: 700; }
.hoimap-map-pane canvas { z-index: 100; }
.hoimap-map-pane svg    { z-index: 200; }
.hoimap-vml-shape {
	width: 1px;
	height: 1px;
}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
}

.hoimap-control {
	position: relative;
	pointer-events: visiblePainted;
	pointer-events: auto;
}
.hoimap-top,
.hoimap-bottom {
	position: absolute;
	pointer-events: none;
}
.hoimap-top {
	top: 0;
}
.hoimap-right {
	right: 0;
}
.hoimap-bottom {
	bottom: 0;
}
.hoimap-left {
	left: 0;
}
.hoimap-control {
	float: left;
	clear: both;
}
.hoimap-right .hoimap-control {
	float: right;
}
.hoimap-top .hoimap-control {
	margin-top: 10px;
}
.hoimap-bottom .hoimap-control {
	margin-bottom: 0;
}
.hoimap-left .hoimap-control {
	margin-left: 10px;
}
.hoimap-right .hoimap-control {
	margin-right: 0;
}

.hoimap-fade-anim .hoimap-popup {
	opacity: 0;
	transition: opacity 0.2s linear;
}
.hoimap-fade-anim .hoimap-map-pane .hoimap-popup {
	opacity: 1;
}
.hoimap-zoom-animated {
	transform-origin: 0 0;
}
svg.hoimap-zoom-animated {
	will-change: transform;
}

.hoimap-zoom-anim .hoimap-zoom-animated {
	transition:transform 0.25s cubic-bezier(0,0,0.25,1);
}
.hoimap-zoom-anim .hoimap-tile,
.hoimap-pan-anim .hoimap-tile {
	transition: none;
}

.hoimap-zoom-anim .hoimap-zoom-hide {
	visibility: hidden;
}

.hoimap-interactive {
	cursor: pointer;
}
.hoimap-grab {
	cursor: -webkit-grab;
	cursor:         grab;
}
.hoimap-crosshair,
.hoimap-crosshair .hoimap-interactive {
	cursor: crosshair;
}
.hoimap-popup-pane,
.hoimap-control {
	cursor: auto;
}
.hoimap-dragging .hoimap-grab,
.hoimap-dragging .hoimap-grab .hoimap-interactive,
.hoimap-dragging .hoimap-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:         grabbing;
}

.hoimap-marker-icon,
.hoimap-image-layer,
.hoimap-pane > svg path,
.hoimap-tile-container {
	pointer-events: none;
}

.hoimap-marker-icon.hoimap-interactive,
.hoimap-image-layer.hoimap-interactive,
.hoimap-pane > svg path.hoimap-interactive,
svg.hoimap-image-layer.hoimap-interactive path {
	pointer-events: visiblePainted;
	pointer-events: auto;
}

  
.hoimap-container {
  font-family:Inter, sans-serif;
  font-size: 0.8rem;
  line-height: 1.5;
}
  

.hoimap-bar a {
	background-color: var(--main-color);
  margin-bottom:7px;
	width: 32px;
	height: 32px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: #fff;
  border-radius:50%;
  border:2px solid #fff;
}
.hoimap-bar a,
.hoimap-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
}
.hoimap-bar a:hover,
.hoimap-bar a:focus {
	background-color: var(--main-color-light);
}
.hoimap-bar a.hoimap-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
}

.hoimap-control-zoom-in,
.hoimap-control-zoom-out {
  text-indent: 1px;
}
  
.hoimap-touch .hoimap-control-zoom-in, .hoimap-touch .hoimap-control-zoom-out  {
  font-size: 22px;
}
  
    
.hoimap-control-attribution {
  text-align:right;
}
.hoimap-control-attribution span {
	background: rgba(255, 255, 255, 0.85);
	margin: 0;
  display:block;
}
.hoimap-control-attribution span {
  display:inline-block;
	padding: 6px 5px 2px 6px;
	color: #666;
  font-size: 0.8rem;
	line-height: 1.4;
  border-radius: 10px 0 0 0;
  white-space:nowrap;
}
.hoimap-control-attribution a {
	text-decoration: none;
  color: #666;
}
.hoimap-control-attribution a:hover,
.hoimap-control-attribution a:focus {
	text-decoration: underline;
}

.mapbutton-sm {
position:absolute;
margin:12px 0 0 60px;
z-index:1;
padding: 6px 10px;
border-radius:16px;
font-size:1.2rem;
outline:2px solid #fff;
color:#fff;
border: none;
cursor:pointer;
background-color: var(--main-color);
transition: scale 300ms ease;
}
.mapbutton-sm img {
height:15px;margin:-2px 4px 0 0;filter:invert(1);
}
.mapbutton-sm:hover {
background-color: var(--main-color-light);
}



.button-container {
text-align:center;
margin-bottom: 20px;
}
.mapbutton {
display:inline-block;
padding: 11px 20px;
border-radius:22px;
font-size:1.3rem;
color: var(--font-color);
background-color: var(--main-color-light);
border: none;
scale:.95;
translate:0 -3px;
transition: scale 300ms ease;
}
@media all and (max-width:640px) {
.mapbutton {
  margin-bottom:5px;
}
}
.mapbutton img {
height:15px;margin:-2px 8px 0 0;filter:invert(var(--png-invert));
transition: all 300ms ease;
}
.mapbutton:hover {
scale:1;
opacity:.8;
cursor: pointer;
}
.mapbutton:hover img {
scale:1.5;
}
.mapbutton.active:hover {
scale:1;
opacity:1;
cursor: default;
}
.mapbutton.layer {
background-color: var(--bg-contrast);
opacity:1;
}
.mapbutton.active {
background-color: var(--main-color);
color: white;
opacity:1;
scale:1;
}
.mapbutton.active2 {
background-color: var(--main-color);
color: white;
opacity:1;
}
.mapbutton.active img, .mapbutton.active2 img {
filter:invert(1);
}
.sehenIco, .gastroIco, .hotelIco, .cityIco {
transition: all 300ms ease-out;
}
.cityIco {
  border-radius:50%;
  border:2px solid #fff;
}
.cityIco:hover {
  width:50px !important;height:50px !important;z-index:999 !important;
  filter:saturate(200%) drop-shadow(0px 5px 5px #000000bb);
  translate:-10px -10px !important;
}
.sehenIco:hover, .gastroIco:hover, .hotelIco:hover {
  z-index:999 !important;
  filter:drop-shadow(0px 5px 5px #000000bb);
  translate:0 -4px;
}


.hoimap-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 10px;
}
.hoimap-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 10px;
}
.hoimap-popup-content {
	margin: 10px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
}
.hoimap-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
}
.hoimap-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
}
.hoimap-popup-content-wrapper {
	background: var(--main-color2);
	color: #fff;
  font-size:1.3rem;
	box-shadow: 0 3px 14px rgba(22, 27, 34, 0.5);
}
.hoimap-popup-content-wrapper a {
  display:block;
	color: #fff;
	text-decoration:none;
}
.hoimap-popup-content-wrapper a span {
  display:block;
  margin-top:-3px;
  margin-left:34px;
  font-size:1.1rem;
  opacity:.7;
}
.hoimap-popup-content-wrapper a b {
	font-weight:400 !important;
}
.hoimap-popup-content-wrapper a:hover b {
	text-decoration:underline;
}
.hoimap-popup-content-wrapper a:hover img {
	scale:1.12;
}
.hoimap-popup-content-wrapper img {
  width:28px;height:28px;border-radius:50%;object-fit:cover;margin:-1px 6px 0 0;border:2px solid #fff;
  transition: all 300ms ease-out;
}
.hoimap-container a.hoimap-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
  display:none;
}
.hoimap-container a.hoimap-popup-close-button:hover,
.hoimap-container a.hoimap-popup-close-button:focus {
	color: #585858;
}
.hoimap-popup-scrolled {
	overflow: auto;
}



@media print {
	.hoimap-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
}






.spielelist {
  max-width:900px;
  margin:0 auto;
}

.spielelist a {
  display:block;text-align:center;text-decoration:none;padding:20px;border-radius:var(--border-radius);font-size:1.4rem;
  transition: all 0.2s ease-in-out;
}

.spielelist a img {
  display:block;border:2px solid var(--main-color);border-radius:60%;width:50%;margin:10px auto;
  transition: all 0.4s ease-in-out;
}

.spielelist a span {
  display:block;font-weight:500;font-size:2rem;margin-bottom:10px;
}

@media (min-width:640px) {
  .spielelist a {
    background:var(--bg-contrast);
  }
  .spielelist a:hover {
    scale:1.05;
  }
  .spielelist a:hover img {
      scale:1.1;
      rotate:-6deg;
  }
}












.header-container {
  width: 100%;
  max-height: 77vh;
  margin-top: -50px;
  overflow: hidden;
  position: relative;
}

.header-image {
  width: 100%;
  height: 100%;
  max-height: 77vh;
  object-fit: cover;
  display: block;
}

.header-container::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 60%;
  background: linear-gradient(to top, rgba(0,0,0,0.66), rgba(0,0,0,0));
  pointer-events: none;
}

.header-text {
  position: absolute;
  width:80%;
  max-width:550px;
  bottom: 80px;
  left: 50%;
  transform: translate(-50%, 0);
  color: white;
  text-align: center;
  z-index: 1;
}

.header-text h1 {
  font-size: 4em;
  font-weight: 500;
  text-shadow: 2px 2px 14px rgb(0,0,0);
  margin-bottom:20px;
}

@media all and (max-width: 640px) {
  .header-text h1 {
      font-size: 2.5em;
  }
  .header-container {
      height: 45vh;
  }
}












@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#28aaed}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}










.shopgrid {
  display:block;
  text-align:center;
  padding: 20px;
  background-color: var(--bg-color);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  border-radius: 20px;
}
@media (max-width: 767px) {
.shopgrid.nos {
  box-shadow: none !important;
}
}
.shopgrid img {
  width: 90%;
  height: auto;
  margin-bottom: 10px;
  transition: all 0.3s ease;
}
.shopgrid span {
  display:inline-block;
  background-color: transparent;
  padding: 8px 20px;
  border-radius: 10px;
  border: 2px solid var(--bg-color);
  text-decoration: none;
  transition: all 0.3s ease;
}
.shopgrid:hover img {
  transform: scale(1.1) rotate(-2deg);
  translate:3px 10px;
}
.shopgrid:hover span {
  transform: scale(1.1);
  translate:0 -25px;
  background-color: var(--main-color);
  color:#fff;
  text-decoration: none;
}








.bvideo {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.6s;
}
.box_land:hover .bvideo {
  filter:brightness(100%);
  opacity: 1;
}
