/*Rote Brandfarben*/
.brand 
{
color: hsl(326, 100%, 45%)!important;
/*color: rgb(230, 0, 129)!important;*/
}
.lightbrand 
{
color: hsl(343, 100%, 67%)!important;
/*color: rgb(255, 87, 135)!important;*/
}
.transparentbrand 
{
color: hsla(343, 100%, 67%, 0.8)!important;
/*color: rgba(255, 87, 135, 0.8)!important;*/
}

.bgbrand
{
background-color: hsl(326, 100%, 45%)!important;
}
.bglightbrand
{
background-color: hsl(343, 100%, 67%)!important;
}
.bgtransparentbrand
{
background-color: hsla(343, 100%, 67%, 0.8)!important;
}


/*Schwarze Farben*/
.schwarz 
{
color: hsl(0, 0%, 0%)!important;
/*color: rgb(0, 0, 0)!important;*/
}
.lightschwarz 
{
color: hsl(0, 0%, 70%)!important;
/*color: rgb(25, 25, 25)!important;*/
}
.transparentschwarz 
{
color: hsla(0, 0%, 70%, 0.8)!important;
/*color: rgba(25, 25, 25, 0.8)!important;*/
}
.bgschwarz
{
background-color: hsl(0, 0%, 0%)!important;
}
.bglightschwarz
{
background-color: hsl(0, 0%, 70%)!important;
}
.bgtransparentschwarz
{
background-color: hsla(0, 0%, 70%, 0.8)!important;
}

/*Weise Farben*/
.weis 
{
color: hsl(0, 0%, 100%)!important;
/*color: rgb(255, 255, 255)!important;*/
}
.lightweis 
{
color: hsl(0, 0%, 80%)!important;
/*color: rgb(204, 204, 204)!important;*/
}
.transparentweis 
{
color: hsla(0, 0%, 80%, 0.8)!important;
/*color: rgba(204, 204, 204, 0.8)!important;*/
}
.bgweis
{
background-color: hsl(0, 0%, 100%)!important;
}
.bglightweis
{
background-color: hsl(0, 0%, 80%)!important;
}
.bgtransparentweis
{
background-color: hsla(0, 0%, 80%, 0.8)!important;
}

/*Grüne Brandfarben*/
.gruen 
{
color: hsl(97, 81%, 48%)!important;
/*color: rgb(100, 221, 23)!important;*/
}
.lightgruen
{
color: hsl(79, 100%, 60%)!important;
/*color: rgb(190, 255, 51)!important;*/
}
.transparentgruen 
{
color: hsla(79, 100%, 60%, 0.8)!important;
/*color: rgba(190, 255, 51, 0.8)!important;*/
}
.bggruen
{
background-color: hsl(97, 81%, 48%)!important;
}
.bglightgruen
{
background-color: hsl(79, 100%, 60%)!important;
}
.bgtransparentgruen
{
background-color: hsla(79, 100%, 60%, 0.8)!important;
}

.boba
{
  font-weight: bold !important;
}
.bobafett
{
  font-weight: bolder !important;
}
.chacha
{
font-style: italic !important;
}

.grenzevoll
{
border: solid 1px;
}


.t1
{
  font-size: clamp(2.5rem, 3vw, 4rem)!important;
}
.t2
{
  font-size: clamp(2rem, 2.5vw, 3rem)!important;
}
.t3
{
  font-size: clamp(1.5rem, 2vw, 2.5rem)!important;
}
.t4
{

  font-size: clamp(1.3rem, 1.8vw, 2.3rem)!important;
}
.t5
{
  font-size: clamp(1.1rem, 3vw, 2.1rem)!important;
}
.t6
{

  font-size: clamp(1rem, 1.3vw, 1.8rem)!important;
}
.t7
{
  font-size: clamp(0.8rem, 1.1vw, 1.5rem)!important;
}
.t8
{
  font-size: clamp(0.6rem, 0.8vw, 1.3rem)!important;
}
.t9
{
  font-size: clamp(0.5rem, 0.5vw, 1rem)!important;
}


.tm1
{
  font-size: clamp(2rem, 2vw, 2.5rem)!important;
}
.tm2
{
  font-size: clamp(1.8rem, 1.8vw, 2.3rem)!important;
}
.tm3
{
  font-size: clamp(1.6rem, 1.6vw, 2.1rem)!important;
}
.tm4
{
  font-size: clamp(1.5rem, 1.7vw, 2.2rem)!important;
}
.tm5
{
  font-size: clamp(1.3rem, 1.5vw, 2rem)!important;
}
.tm6
{
  font-size: clamp(1.2rem, 1.4vw, 1.9rem)!important;
}
.tm7
{
  font-size: clamp(1.1rem, 1.3vw, 1.8rem)!important;
}
.tm8
{
  font-size: clamp(1rem, 1.2vw, 1.6rem)!important;
}
.tm9
{
  font-size: clamp(0.8rem, 1vw, 1.4rem)!important;
}

input[type=number] {
  -moz-appearance: textfield;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}


@supports (aspect-ratio: 4/3) {
	.i43 {
		-webkit-aspect-ratio: 4/3;
		aspect-ratio: 4/3;
	}
}

@supports not (aspect-ratio: 4/3) {
	.i43 {
		width:300px;
		height: calc(300px * 300/400);
	}
}

@supports (aspect-ratio: 3/4) {
	.i34 {
		-webkit-aspect-ratio: 3/4;
		aspect-ratio: 3/4;
	}
}

@supports not (aspect-ratio: 3/4) {
	.i34 {
		width:400px;
		height: calc(300px * 400/300);
	}
}


@supports (aspect-ratio: 1/1) {
	.i11 {
		-webkit-aspect-ratio: 1/1;
		aspect-ratio: 1/1;
	}
}

@supports not (aspect-ratio: 1/1) {
	.i11 {
		width:100px;
		height: calc(100px * 100/100);
	}
}


.navschriftschwarz
{
color:black!important;
font-size:6vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftweis
{
color:white!important;
font-size:7vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftbrendmobil
{
color:#D60B52!important;
font-size:6vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftgruen
{
color:#64DD17!important;
font-size:6vw!important;
font-family: 'all-round-gothic'!important;
}



.navschriftschwarzdesktop
{
color:black!important;
font-size:1.6vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftweisdesktop
{
color:white!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftbrenddesktop
{
color:#D60B52!important;
font-size:1.6vw!important;
font-family: 'all-round-gothic'!important;
}
.navschriftgruendesktop
{
color:#64DD17!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}

.navtopschriftschwarzdesktop
{
color:black!important;
font-size:1.3vw!important;
font-family: 'all-round-gothic'!important;
}
.navopschriftweisdesktop
{
color:white!important;
font-size:1.3vw!important;
font-family: 'all-round-gothic'!important;
}
.navopschriftbrenddesktop
{
color:#D60B52!important;
font-size:1.3vw!important;
font-family: 'all-round-gothic'!important;
}
.navopschriftgruendesktop
{
color:#64DD17!important;
font-size:1.3vw!important;
font-family: 'all-round-gothic'!important;
}



.h1schriftschwarzmobil
{
color:black!important;
font-size:7vw!important;
font-family: 'all-round-gothic'!important;
font-weight: bold!important;
}
.h1schriftweismobil
{
color:white!important;
font-size:7vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h1schriftbrendmobil
{
color:#D60B52!important;
font-size:7vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h1schriftgruenmobil
{
color:#64DD17!important;
font-size:7vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftschwarzmobil
{
color:black!important;
font-size:6vw!important;
font-family: 'all-round-gothic'!important;
font-weight: bold!important;
}
.h2schriftweismobil
{
color:white!important;
font-size:6vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftbrendmobil
{
color:#D60B52!important;
font-size:6vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftgruenmobil
{
color:#64DD17!important;
font-size:6vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}





.h1schriftschwarzdesktop
{
color:black!important;
font-size:3vw!important;
font-family: 'all-round-gothic'!important;
font-weight: bold!important;
}
.h1schriftweisdesktop
{
color:white!important;
font-size:3vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h1schriftbrenddesktop
{
color:#D60B52!important;
font-size:3vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h1schriftgruendesktop
{
color:#64DD17!important;
font-size:3vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftschwarzdesktop
{
color:black!important;
font-size:1.5rem!important;
font-family: 'all-round-gothic'!important;
font-weight: bold!important;
}
.h2schriftweisdesktop
{
color:white!important;
font-size:1.5!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftbrenddesktop
{
color:#D60B52!important;
font-size:1.5!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}
.h2schriftgruendesktop
{
color:#64DD17!important;
font-size:1.5vw!important;
font-weight: bold!important;
font-family: 'all-round-gothic'!important;
}





.textschriftschwarzmobil
{
color:black!important;
font-size:5vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftweismobil
{
color:white!important;
font-size:5vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftbrendmobil
{
color:#D60B52!important;
font-size:5vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftgruenmobil
{
color:#64DD17!important;
font-size:5vw!important;
font-family: 'all-round-gothic'!important;
}


.textschriftschwarzdesktop
{
color:black!important;
font-size:0.7vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftweisdesktop
{
color:white!important;
font-size:0.7vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftbrenddesktop
{
color:#D60B52!important;
font-size:0.7vw!important;
font-family: 'all-round-gothic'!important;
}
.textschriftgruendesktop
{
color:#64DD17!important;
font-size:0.7vw!important;
font-family: 'all-round-gothic'!important;
}






.brandbg
{
background-color:#D60B52!important;
font-size-adjust: 0.33!important;
}



.footerschriftschwarzdesktop
{
color:black!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
text-decoration: none!important;
}
.footerschriftweisdesktop
{
color:white!important;
font-size:0.8vw!important;
font-family: 'all-round-gothic'!important;
text-decoration: none!important;
}
.footerschriftbrenddesktop
{
color:#D60B52!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
text-decoration: none!important;
}



.suchdialogdesktop
{
color:black!important;
font-size:0.8vw!important;
font-family: 'all-round-gothic'!important;
}


.cardstopschriftschwarzdesktop
{
color:black!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftweisdesktop
{
color:white!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftbrenddesktop
{
color:#D60B52!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftgruendesktop
{
color:#64DD17!important;
font-size:1vw!important;
font-family: 'all-round-gothic'!important;
}

.cardsschriftschwarzdesktop
{
color:black!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftweisdesktop
{
color:white!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftbrenddesktop
{
color:#D60B52!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftgruendesktop
{
color:#64DD17!important;
font-size:0.6vw!important;
font-family: 'all-round-gothic'!important;
}







.cardstopschriftschwarzmobil
{
color:black!important;
font-size:5.5vw!important;
font-weight: bold;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftweismobil
{
color:white!important;
font-size:5.5vw!important;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftbrendmobil
{
color:#D60B52!important;
font-size:5.5vw!important;
font-family: 'all-round-gothic'!important;
}
.cardstopschriftgruenmobil
{
color:#64DD17!important;
font-size:5.5vw!important;
font-family: 'all-round-gothic'!important;
}

.cardsschriftschwarzmobil
{
color:black!important;
font-size:4.5vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftweismobil
{
color:white!important;
font-size:4.5vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftbrendmobil
{
color:#D60B52!important;
font-size:4.5vw!important;
font-family: 'all-round-gothic'!important;
}
.cardschriftgruenmobil
{
color:#64DD17!important;
font-size:4.5vw!important;
font-family: 'all-round-gothic'!important;
}













.buttonbg
{
background-color:#000000!important;
color:#64DD17!important;
font-family: 'all-round-gothic'!important;
}


.bgtrapezrechts {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" fill="gray" viewBox="0 0 4000"><path d="M-150 0 L-75 200 L2250 100 Z" /></svg>'); 
}




/*#############Range SLider Mobil##############*/
input[type="range"] {
  -webkit-appearance: none;
  width: 100%;
}

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

input[type="range"]:focus {
  outline: none;
}

input[type="range"]::-ms-track {
  width: 100%;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
/*#############Thumb##############*/

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 36px;
  width: 36px;
  background: #D60B52;
  cursor: pointer;
  margin-top: -12px;
}

input[type="range"]::-moz-range-thumb {
  height: 36px;
  width: 36px;
  background: #D60B52;
  cursor: pointer;
}

input[type="range"]::-ms-thumb {
  height: 36px;
  width: 36px;
  background: #D60B52;
  cursor: pointer;
}
/*#############Track##############*/

input[type="range"]::-webkit-slider-runnable-track {
  width: 100%;
  height: 12px;
  cursor: pointer;
  background: #D60B52;
}

input[type="range"]:active::-webkit-slider-runnable-track {
  background: #d6d6d6;
}

input[type="range"]::-moz-range-track {
  width: 100%;
  height: 12px;
  cursor: pointer;
  background: #D60B52;
}

input[type="range"]::-ms-track {
  width: 100%;
  height: 12px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}

input[type="range"]::-ms-fill-lower {
  background: #D60B52;
}

input[type="range"]:focus::-ms-fill-lower {
  background: #D60B52;
}

input[type="range"]::-ms-fill-upper {
  background: #D60B52;
}

input[type="range"]:focus::-ms-fill-upper {
  background: #D60B52;
}



 /* The sidebar menu */
 .sidebar {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 9000; /* Stay on top */
  top: 0;
  left: 0;
  background-color: #111; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
}

/* The sidebar links */
.sidebar a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidebar a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidebar .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* The button used to open the sidebar */
.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #111;
  color: white;
  padding: 10px 15px;
  border: none;
}

.openbtn:hover {
  background-color: #444;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
  transition: margin-left .5s; /* If you want a transition effect */
  padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
}