#myBtn {
    display: none;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #5a90cc;
    color: white;
    cursor: pointer;
    padding: 10px;
    border-radius: 10px;
line-height:1;
font-size:2rem;
opacity:.8;
}
@media (min-width:571px){
#myBtn {
font-size:2.8rem;
    bottom: 20px;
    right: 30px;
    padding: 10px;opacity:1;
   
}
}
#myBtn:hover {
  background-color: #aabfe4; /* Add a dark-grey background on hover */
}

/*.btn {
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    padding: 1rem 2em 1.5rem 2rem;
}*/

/* Weiß */
.weiss {
  background-color: #FFFFFF;
}

/* Grün */
.gruen {
  background-color: #75a658;
}

.gruen-50 {
  background-color: #97b87c;
}

.gruen-30 {
  background-color: #b7cca1;
}

.gruen-10 {
  background-color: #e4eadb;
}

/* Blau */
.blau {
  background-color: #5a90cc;
}

.blau-50 {
  background-color: #85a7d8;
}

.blau-30 {
  background-color: #aabfe4;
}

.blau-10 {
  background-color: #eff2fa;
}

/* Türkis */
.tuerkis {
  background-color: #93cfca;
}

.tuerkis-50 {
  background-color: #afdad7;
}

.tuerkis-30 {
  background-color: #c8e5e3;
}

.tuerkis-10 {
  background-color: #dff0ef;
}
.weiss {
  fill: #FFFFFF;
}

/* Grün */
.gruen {
  fill: #75a658;
}

.gruen-50 {
  fill: #97b87c;
}

.gruen-30 {
  fill: #b7cca1;
}

.gruen-10 {
  fill: #e4eadb;
}

/* Blau */
.blau {
  fill: #5a90cc;
}

.blau-50 {
  fill: #85a7d8;
}

.blau-30 {
  fill: #aabfe4;
}

.blau-10 {
  fill: #eff2fa;
}

/* Türkis */
.tuerkis {
  fill: #93cfca;
}

.tuerkis-50 {
  fill: #afdad7;
}

.tuerkis-30 {
  fill: #c8e5e3;
}

.tuerkis-10 {
  fill: #dff0ef;
}

.bg-asym{
border-radius: 2rem;
}
@supports not (-webkit-touch-callout: none) {
  /* CSS for other than iOS devices */ 
.bg-asym{

transform: perspective(511px) rotateY(2deg) rotateX(-9deg);

}
}

.card-container {
perspective: 1000px; /* Gibt Tiefe für die 3D-Drehung */
}

				.card-container {
					perspective: 1000px;
					/* Gibt Tiefe für die 3D-Drehung */
				}

				.flipcard {
					/* width: 200px; Breite der Karte */
					height: 300px;
					/* Höhe der Karte */
					position: relative;
					transition: transform 0.6s;
					/* Dauer der Drehung */
					transform-style: preserve-3d;
					/* Bewahrt 3D-Raum für Kinder */
				}

				.flipcard h4 {
					font-size: 1.25rem;
				}

				.flipcard img {
					padding: 0 2rem;
					max-width: 300px;
					max-width: 190px;
				}

				.card-container:hover .flipcard {
					transform: rotateY(180deg);
					/* Dreht die Karte bei Hover */
				}

				.card-front,
				.card-back {
					width: 100%;
					height: 100%;
					position: absolute;
					backface-visibility: hidden;
					display: flex;
					align-items: center;
					justify-content: center;
					border: 1px solid #ccc;
					border-radius: 2rem;
				}

				.card-front{
					padding:0 .5rem;
				}

				.card-back {
					transform: rotateY(180deg);

				}

.hover-scale{
transition:all .3s ease;
}
.hover-scale:hover{
transition:all .3s ease;
transform:scale(1.16);
z-index:1099;
}

.text-justify{text-align:justify!important;}

.btn-skg {
    background-color: #87a3cf;
    color: #FFF;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #99b1d6;
    --bs-btn-hover-border-color: #93acd4;
}
.bue-only{dispaly:none;}