/*============================================================================================*/
/* Your custom styles below */
/*============================================================================================*/

.slide-animated.two {
  font-family: "PARKANA_";
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal; 
}


@font-face {
    font-family: 'Swonderful-Bold';
    src: url('/fonts/Swonderful-Bold.woff2') format('woff2'),
         url('/fonts/Swonderful-Bold.woff') format('woff'),
         url('/fonts/Swonderful-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


 /* Stile für den Button im sticky Zustand */
.fixed_header.sticky .btn {
    color: #000; /* Textfarbe auf Schwarz setzen */
    border: none; /* Keine Umrandung */
}

.fixed_header.sticky .btn .icon-style {
    color: #000; /* Icon-Farbe auf Schwarz setzen */
}

.fixed_header.sticky .btn:hover .icon-style {
    color: #000; /* Icon-Farbe bei Hover auf Schwarz setzen */
}

.btn:hover .icon-style {
    color: #fff; /* Icon-Farbe bei Hover auf Weiss setzen */
    border: none; /* Keine Umrandung */

}





@keyframes changeColor {
  0% {
    color: #header.fixed_header nav ul li a;
  }
  25% {
    color: #1e9ddf;
  }
  50% {
    color: #header.fixed_header nav ul li a;
  }
  75% {
    color: #1e9ddf;
  }
  100% {
    color: #header.fixed_header nav ul li a;
  }
}



.crew-news-button {
  display: inline-block; /* Sicherstellen, dass das Element animiert werden kann */
  animation: changeColor 9s infinite; /* Die Farbwechselanimation anwenden */
  position: relative; /* Notwendig für die Positionierung der ::before und ::after Pseudoelemente */
  text-decoration: none; /* Standardunterstreichung entfernen */
  font-size: 16px; /* Standard Schriftgröße */
}

/*
.crew-news-button::before {
  top: -3px; /* Position für die obere Linie anpassen */
}

.crew-news-button::after {
  bottom: -2px; /* Position für die untere Linie anpassen */
}
*/

/* Media Query für Mobilgeräte */
@media (max-width: 600px) {
  .crew-news-button {
    font-size: 16px; /* Schriftgröße für kleinere Bildschirme anpassen */
  }

  .crew-news-button::before, .crew-news-button::after {
    height: 2px; /* Dicke des Unterstrichs für kleinere Bildschirme anpassen */
  }
}