.bg-primary /* Header Hintergrundfarbe*/
{
background-color: #77b2c2 !important; 
font-weight: 200;
}


/* Hintergrundfarbe */
body {
background-color: #FBE2D0 !important;
justify-content: center; 
}

.container.my-5
{
background-color: #FBE2D0!important;
justify-content: center; 
}


/* Navigation anpassen */
.navbar {
background-color: #77b2c2 !important; 
font-weight: 200px;

}

.nav-link {
color: white !important;
font-weight: 80px;
}


.navbar .nav-link:hover {
color: #ffffff  !important; /* gelb beim Hover */

}
.nav-item
{
margin-right: 70px;
padding: 2px;
}

/* dropdown Menü */
.dropdown-menu{
width: 10%;
margin-right:20px;

}
.show{
margin-right:30px;
font-size: medium;
}

 .dropdown-item{
width: 10%;

}



.card-body{
text-align :center ; 
background-color: #ffffff;
}



.text-beschreibung
{
text-align: center; 
background-color: #ffffff;
width: 100%; 
height: 150px;
}


 /* Boxen die an der Kurse & startseite*/
.col-md-4 { 
  width: 90%;   /* maximale Breite */
  justify-content: center;   /* zentieret den Boxen am Mitte*/
  padding: 15px;
  margin: 15px;
  border-radius: 20%;
  margin-left: 5%;
  margin-right: 5%;
}



/*Startseite */

.slider {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  border: none;
}

.slider-track {
  display: inline-flex;
  animation: scroll 20s linear infinite; /* Geschwindigkeit anpassen */
}

.slider .card {
  width: 25%;
  margin: 10px;
  padding: 20px;
  background: #eaf7ff;
  border-radius: 10px;
  text-align: center;
  font-size: small;
  
}

/*  Nutzt man es für laufende Slider   */
@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%); /* läuft endlos */
  }
}





/* Für das Bild */
.card-img-top-custom {
  width: "220px";   /* feste Breite */
}


.kontakt-beschreibung {
    text-align: center; 
    background-color: #ffffff;
    width: 100%; 
    height: 150px;
}



/* Kontaktformular */
.kontakt-form {
  font-size: medium;
  border-radius: 20px;   /* wirkt rund */
  width: 80%;
  padding: 20px;
  margin: 30px auto;     /* zentriert das Formular */
  display: flex;
  flex-direction: column;
  align-items: center; 
} 



/* Formular  der Profilseite*/

.profilFormular  {
  font-size: large;
  border-radius: 20px;   
  width: 80%;
  padding: 20px;
  margin-right: 10%;
  margin-left: 10%;
  display: flex;
  align-items: center; 
} 





/* Buttons */
.btn-pink {
  background-color: #e75480;
  color: white;
  border: none;
}

.btn-pink:hover {
  background-color: #c7436d;
}




.m-0 { 
  margin-left: 20%;
    margin-right: 20%;;
 padding: 10px;}


.btn-hellblau
{
  color: #000000;
  background-color: #ffffff;
}
.btn-blau
{
  background-color: #ffffff;
color: #000000;
}


.card{
font-size: large;
background-color: #ffffff;
margin-left: 20%;
margin-right: 20%;
 width: 60%;
}



/* Footer */
footer {
    background-color: #ecf0f4;
    color: white;
    padding: 20px 0;
    text-align: center;
}