/* body, html {
  background-color: #111111;
} */
.box {
  background-color: #111111;
  color: #ffffff;
}
div {
  min-height: unset;
}

.VoteImage {
  border: solid 3px #808080;
  cursor: pointer;
  width: 100%;
  margin-left:auto;
  margin-right: auto;
}

.VoteImage img:focus {
  border: solid 3px #FF0000;
}

.lSAction > .lSNext {
  background-position: 0 0;
  /* right: 36px; */
}

h4 {
  font-size: 1rem !important;
  font-weight: bold;
}

img {
  max-width: 100%;
  border-radius: 5px;
}

.einespalte {
  width: 194px;
  margin-right: 30px;
}

h2 {
  text-align: center;
  text-transform: uppercase;
  font-size: 3.5em;
  font-weight: bold !important;
  letter-spacing: -1px;
  margin-top:24px;
}

@media (max-width: 991px) {
  .einespalte {
      width: 161px;
  }
}

@media (max-width: 820px) {
  .einespalte {
      width: 46%;
      clear: unset;
      float: left;
      margin-right: 12px;
      margin-bottom: 12px;
  }

  .h1, h1 {
    font-size: 2.0rem !important;
  }

  .h2, h2 {
    font-size: 1.5rem !important;

  }

  h4 {
    font-size: 0.85rem !important;
  }
}

.CTAButton {
	font-weight: 0;
	font-size: 20px;
	color: #fff;
	background-color: #CC0000;
	padding: 10px 30px;
	border: solid #CC0000 2px;
	box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
	border-radius: 50px;
	transition : 1000ms;
	transform: translateY(0);
	align-items: center;
	cursor: pointer;
}

.CTAButton:hover {
	transition : 1000ms;
	padding: 10px 50px;
	transform : translateY(-0px);
	background-color: #CC0000;
	color: #ffffff;
	border: solid 2px #CC0000;
}

.InverseCTAButton {
	font-weight: 0;
	font-size: 14px;
	color: #CC0000;
	background-color: #FFFFFF;
	padding: 10px 30px;
	border: solid #FFFFFF 2px;
	box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
	border-radius: 50px;
	transition : 1000ms;
	transform: translateY(0);
	align-items: center;
	cursor: pointer;
}
.InverseCTAButton:hover {
	transition : 1000ms;
	padding: 10px 50px;
	transform : translateY(-0px);
	background-color: #FFFFFF;
	color: #CC0000;
	border: solid 2px #FFFFFF;
}

.IntroText {
	font-size: 2em;
	color: #cccaca;
	line-height: 1.2em;
	text-align: left;
  text-align: center;
  margin-top: 24px;
}
.SocialLink {
	color: white;
	font-size: 2em;
	text-decoration: none;
}
.SocialLink:hover {
	color: white;
	text-decoration: underline;
}

.IntroHeader {
	margin-block-start: 0px;
	padding-top: 1rem;
	font-size: 3.5em;
	font-weight: bold;
  letter-spacing: -1px;
  text-transform: uppercase;
	color: white;
	line-height: 1.2em;
	text-align: center;
}
.IntroMaxHeader {
	margin-block-start: 0px;
	padding-top: 1rem;
	font-size: 5.5em;
	font-weight: bold;
    letter-spacing: -1px;
    text-transform: uppercase;
	color: white;
	line-height: 1.2em;
	text-align: center;
}

label {
    color: white;
    text-transform: none;
    font-size: 1.2rem;
}

@media (max-width:600px) {
    .Slogan {
        bottom: 1rem;
    }
    .SloganTitle {
        font-size: 2.5em;
    }

    .IntroHeader {
        font-size: 2.5em;
    }
    .IntroMaxHeader {
        font-size: 3.5em;
    }

    .slick-prev {
        left: -15px;
    }
    .slick-next {
        right: -1px;
    }
}

.image-button {
    background: none; /* Entfernt den Standard-Hintergrund des Buttons */
    border: none; /* Entfernt den Rand */
    padding: 0; /* Entfernt das Padding */
    cursor: pointer; /* Zeigt den Zeiger, um das Klicken zu signalisieren */
    display: inline-block; /* Stellt sicher, dass es sich wie ein Bild verhält */
}

.image-button img {
    max-width: 100%; /* Bild passt sich an die Größe des Containers an */
    height: auto; /* Verhindert Verzerrung */
}

.lSAction > a:focus {
  border: solid 1px green;
}

.ThumbImage {
    display: inline-block; /* Macht das <a> zu einem Block-Level-Element */
    padding: 5px; /* Optional: Füge etwas Padding hinzu, um den Rahmen besser sichtbar zu machen */
    outline: 3px solid transparent; /* Beispiel für einen Fokusrahmen */
    box-sizing: border-box; /* Stellt sicher, dass Padding und Border innerhalb der Breite und Höhe des Elements berücksichtigt werden */
}
.ThumbImage:focus {
  border: solid 3px white;
}

.lSNext {
  border: solid 3px transparent;
}
.lSNext:focus {
  border: solid 3px yellow;
}

.lSPrev {
  border: solid 3px yellow;
}

a:focus {
  outline: auto;
}