@charset "UTF-8";

:root {

	--main-color:#00c878;
	--main-color-light:#6dddff;
  --main-color-extralight: #c2f1ff;
	--bg-color:#fff;
	--bg-color-light:rgba(255, 255, 255,.4);
	--bg-color-dark:rgba(0, 0, 0,.2);
  --bg-contrast:#f4f2ef;
  --bg-contrast-light:#F3F4F6;
  --bg-contrast-dark:#dde1e7;
	--hdbar-color:#ECECED;
	--header-bg:#fff;
  --footer-color:#4c515a;
  --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:0;

  --toast-success:#00c520;
  --toast-error:#eb213c;
  --toast-note:#777979;

  --bg-community:#d6f4dc;
  --bg-wetter:#58aeff;

  --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:#ff863a;
	--main-color-light:#b16332;
  --main-color-extralight: #f7edda;
	--bg-color:#122232;
	--bg-color-light:rgba(22, 27, 34,.7);
	--bg-contrast:#0E1B28;
  --bg-contrast-light:#393d4d;
  --bg-contrast-dark:#4b5064;
	--hdbar-color:#122232;
	--header-bg:#1B2B3A;
  --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-light); }

*[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;
}







/* Grid */

/* Artikel Frontseite */

.f1-grid { display:grid; gap:10px; grid-template-areas: "a1" "a2" "a3" "w" "k"; }
.f1 { grid-row: span 3; }

.f2-grid { display:grid; gap:10px; }
.f3-grid { display:grid; gap:10px; }

@media (min-width:640px) {
  .f1-grid { grid-template-columns: repeat(2,1fr); gap:20px; grid-template-areas: "a1 a1" "a2 a3" "w k"; }
  .f2-grid { grid-template-columns: repeat(2,1fr); gap:20px; }
  .f3-grid { grid-template-columns: repeat(2,1fr); gap:20px; }
}
@media (min-width:1000px) {
  .f1-grid { grid-template-columns: repeat(3,1fr); grid-template-areas: "a1 a1 k" "a1 a1 k" "a1 a1 k" "a1 a1 k" "a1 a1 k" "a1 a1 k" "a2 a3 w" "a2 a3 w" "a2 a3 w"; }
  .f2-grid { grid-template-columns: repeat(4,1fr); }
  .f3-grid { grid-template-columns: repeat(3,1fr); margin-top:-10px; }
  .span-sm { grid-row: span 2; }
  .span-lg { grid-row: span 4; }
  .span-xl { grid-row: span 5; }
}



/* Unterseiten */

.s2-grid { display:grid; }
@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:10px; margin-bottom:10px; }
  @media (min-width:1000px) {
    .s3-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:20px; margin-bottom:20px; }
    .s3-grid.fp { gap:40px; }
    .s3-lg { grid-column: span 2; }
}

.s4-grid { display:grid; grid-template-columns: repeat(1,1fr); gap:20px; margin-bottom:20px; }
  @media (min-width:1000px) {
    .s4-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:20px; margin-bottom:20px; }
    .s4-lg { grid-column: span 2; }
    .s4-xl { grid-column: span 3; }
}

.s7-grid { display:grid; grid-template-columns: repeat(7,1fr); gap:0; margin-bottom:10px; }
.s7-lg { grid-column: span 4; }
.s7-xl { grid-column: span 6; }


.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;
    }
}




/* 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;opacity:.7;
}
.breadcrumbs div {
  align-items:center;
  border-radius:6px;
  display:inline-block;
  font-size:1.4rem;
  max-width:100%;
  padding:5px 8px 3px 8px;
  height:26px;
  margin-bottom:6px;
  text-decoration:none;
  vertical-align:baseline;
  cursor:pointer;
  white-space: nowrap;
}
.breadcrumbs div a {
  text-decoration:none;
}
.breadcrumbs div:hover {
  background:rgba(200,200,200,.4);
}
.breadcrumbs div img {
  width:15px;height:15px;margin-top:-3px;filter:invert(var(--png-invert));opacity:.6;
}
.breadcrumbs span {
  opacity:.4;
}

.breadcrumbs.invert, .breadcrumbs.invert div a {
  color:#fff !important;
}
.breadcrumbs.invert div img {
  filter:invert(1);opacity:.8;
}










.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-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;
  }
}






.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-light);
  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;
}







/* 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 {
    padding: 5% 0 70px 0;
  }
	#footer_inner {
		text-align:center;
    grid-template-columns: 1fr 1fr;
	}
}
@media all and (max-width:640px) {
	#footer_inner {
		text-align:center;
    grid-template-columns: 1fr;
	}
}
.footer_title {
	margin:40px 0px 20px 0px;
	color:#fff;
	font-size:1.5rem;
	font-weight:400;
	text-transform:uppercase;
  opacity:.65;
}
.footer_copy {
  margin:5px 0;
  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:60px 0 10px 0;
  text-align:center;
}
.footer_logo a img {
  filter:brightness(8) grayscale(1) contrast(200%);
  height:38px;
  opacity:.2;
  transition: all 0.3s ease-in-out;
}
.footer_logo a img:hover {
  filter:brightness(1) grayscale(0) contrast(100%);
  scale:1.05;
  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 {
  width:20px;
  height:20px;
	margin:-1px 5px 0 0;
  transition: all 0.2s ease-in-out;
}
.rub-footer img.social-link {
  filter:none;
	width:28px;
	height:28px;
	margin:0 5px 0 0;
}
.rub-footer:hover, .rub-footer:hover img.social-link {
  opacity:1;
}
.rub-footer:hover img, .rub-footer:hover img.social-link {
  scale:1.1;
}
.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:0;
  margin-top:-8px;
}
@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:33%;
    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.4rem;
  max-width:100%;
  padding:5px 8px 3px 8px;
  height:26px;
  margin-bottom:5px;
  text-decoration:none;
  vertical-align:baseline;
  transition: all 100ms ease-in-out;
  cursor:pointer;
  white-space: nowrap;
  opacity:.8;
}
.chip.footer {
  opacity:.7;
  border-radius: 3px;
  background:var(--bg-contrast-dark);
}
.chip span {
  font-weight:500;
  color:var(--main-color);
}
.chip img {
  width:18px;
  height:18px;
  margin:-2px 2px 0 0;
  opacity:.8;
  filter:invert(var(--png-invert));
}
.chip:hover,
.chip:focus {
  opacity:1;
  scale:1.05;
  text-decoration:none;
  background:var(--bg-contrast);
}
.chip.nolink:hover,
.chip.nolink:focus {
  opacity:.8;
  cursor:auto;
  background:transparent;
}














/* 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%;
  height:45px;
	top:0;
  padding-top:2px;
  border-radius: 0 0 var(--border-radius) var(--border-radius);
  font-size:1.2rem !important;
}
.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:25px;
  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 10px 6px 10px;
	margin:2px 3px 0 3px;
	font-size:1.6rem;
  font-weight:500;
	border-top:4px solid transparent;
	border-bottom:3px solid transparent;
  white-space:nowrap;
  position:relative;
  border-radius: var(--border-radius) var(--border-radius) 0 0;
}
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 {
  background-color:var(--bg-contrast);
}

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:left;
	color:var(--font-color);
	display:block;
	font-size:1.3rem;
	font-weight:500;
  text-align:center;
  height:60px;
}
@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;
   }
}






/* Header */

.header {
	padding-top:5px;
	padding-bottom:5px;
}
.headergrid {
  max-width:1200px;
  margin:0px auto;
  padding:25px 15px 15px 15px;
	display:grid;
  grid-template-columns: 250px 1fr 250px;
  gap:0px;
  -webkit-user-select: none;
  user-select: none;
}
.logo {
	max-width:100%;
	height:90px;
  transition: all 0.3s ease-in-out;
}
.logo-mobile {
	text-align:center;
	height:35px;
	margin-top:-7px;
}
.headerleft {
	text-align:left;
	padding-top:20px;
}
.headerleft div {
  font-size:1.2rem;
}
.headerlogo {
	text-align:center;
	padding-top:3px;
}
.headerright {
	text-align:right;
	padding-top:11px;
}

.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);
  }
}











/* 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;
}













/* 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 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.btn-del {
	background-color:#f5310f;
}
.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-light {
  background-color:var(--bg-contrast-dark);
  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-light);
  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(--bg-contrast);
}
.btn-link-hd:hover img {
  opacity:1;
}
.btn-link-hd-color:hover {
  border:2px solid var(--main-color-light);
}
.btn.btn-sm {
  border-radius:1.5rem;
  font-size:1.4rem;
  height:2.7rem;
  line-height:1.6rem;
  padding:.6rem 1rem;
}
.btn.btn-xs {
  border-radius:1.5rem;
  font-size:1.2rem;
  height:2.6rem;
  line-height:1.6rem;
  padding:.5rem 1rem;
  background:var(--bg-contrast);
}
.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;
  margin-bottom:10px;
}
.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-input {
  background:var(--bg-contrast);
  color:var(--font-color);
  background-image:none;
  border:0 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.noborder {
  border:0;
}
.form-input:focus, .form-select:focus {
  background:var(--bg-color);
  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-contrast);
  color:var(--font-color);
  border:0 solid var(--bg-contrast-dark);
  font-size:1.4rem;
  height:3.2rem;
  max-width:100%;
  outline:0;
  width:100%;

}
.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 input,
.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;
  }
}









/* 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:0;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;
}





h1 {
  text-align:center;
  margin:100px 0 40px 0;
  font-weight:400;
  opacity:.5;
}











.pricing-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.plan {
  display:block;
  background-color: #fff;
  border: 2px solid #ddd;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
  max-width: 400px;
  text-align: center;
  transition: transform 0.3s ease, border-color 0.3s ease;
}

.plan.aktiv {
  border-color: #ff7f50;
}

.plan:not(.aktiv):hover {
  transform: scale(1.05);
  border-color: #ff7f50;
}

.plan-title {
  font-size: 24px;
  font-weight: bold;
  padding: 10px 0;
}

.plan-price {
  font-size: 2.2rem;
  font-weight: bold;
  margin: 15px 0;
}

.ratings {
  margin: 10px 0 20px 0;
}

.ratings span {
  font-size: 24px;
  color: #ffd700;
}

.description {
  font-size: 14px;
  line-height:2.6rem;
  color: #666;
  margin-bottom: 25px;
}
.description img {
  width:18px;height:18px;
  margin:-1px 1px 0 0;
}

@media (max-width: 768px) {
  .pricing-container {
      flex-direction: column;
      align-items: center;
  }
}