/* Custom page CSS
-------------------------------------------------- */


/* Beispiel: Ändere die primäre Farbe zu Rot */
:root {
  --primary-color: #ff007b; /* Setze die gewünschte Farbe hier ein */
}

/* Aktualisiere die Bootstrap primary Klasse mit der benutzerdefinierten Farbe */
.btn-primary {
  background-color: var(--primary-color) !important;;
  border-color: var(--primary-color) !important;;
}

.btn-sprache {
  background-color: white !important;;
  border-color: white !important;;
  color: var(--primary-color) !important;;
}

.btn-menu {
  background-color: white !important;;
  border-color: white !important;;
  color: var(--primary-color) !important;;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: white !important;;
  color: var(--primary-color) !important;;
  border-color: var(--primary-color) !important;;
}




body {
  font-family: 'Helvetica Neue', sans-serif;
    font-weight: 300; /* Light-Gewicht */
}

h1, h2, h3, h4, h5 {
  font-family: 'Helvetica Neue', sans-serif;
    font-weight: 700; /* Light-Gewicht */
}

h1{font-size:calc(1.7rem + 1.4vw);
color: #ff007b;}

h2{font-size:calc(1.2rem + .1vw);}

h3{font-size:1.1rem}

h4{font-size:1rem}
h5{font-size:0.9rem}
h6{font-size:0.8rem}


a {
  color: #ff007b;
}

header {
  margin-top: '0'px; /* Verändern Sie den Wert nach Bedarf */

}

main {
  margin-top: '0'px; /* Verändern Sie den Wert nach Bedarf */
}

main > .container {
  padding: 60px 15px 0;
}

.socialmediamenu {
  text-decoration: none;
}

.footer {
  /*background: linear-gradient(to bottom left, white 50%, #FF007B 50%);*/
  background-image: url('../img/fuss.png');
  background-size: cover;
  background-color: white; /* Hintergrundfarbe auf Weiß setzen */

  height: 130px; /* Anpassen Sie die Höhe nach Bedarf */
  text-align: left; /* Rechtsbündig ausrichten */
  color: white; /* Textfarbe auf Weiß setzen */
  display: flex;
      align-items: flex-end;
}

.primary-custom {
  background-color: #ff007b; /* Deine gewünschte Farbe im Hex-Format */
  border-color: #ff0000; /* Falls notwendig, ändere auch die Border-Farbe */
  color: #ff007b; /* Falls notwendig, ändere auch die Text-Farbe */
}

.navbar-toggler {
    border: none;
    /* Oder eine andere Stildefinition für den Fokus-Zustand */
}

.border-white {
  border: 2px solid white;
}

#kopfimg {
  width: 100vw;
  height: 50px; /* Fixe Höhe nach Bedarf anpassen */
  object-fit: fill;
  display: block;
  margin: 0 auto;
}

#adressemenu {
  position: absolute;
  bottom: 0;
  width: 100%
}

.img-cover {
  object-fit: cover;
  /* Optional: Setze die Höhe, um das gewünschte Seitenverhältnis beizubehalten */
  height: 250px;
  width: 100%;
}

.border-black {
  border: 1px solid black;
}

.btn-sothi {
  background-color: white; /* Deine gewünschte Farbe im Hex-Format */
  border-color: #ff007b; /* Falls notwendig, ändere auch die Border-Farbe */
  color: #ff007b; /* Falls notwendig, ändere auch die Text-Farbe */
}

.btn-sothi:hover {
  background-color: #ff007b; /* Deine gewünschte Farbe im Hex-Format */
  border-color: #ff007b; /* Falls notwendig, ändere auch die Border-Farbe */
  color: white; /* Falls notwendig, ändere auch die Text-Farbe */
}