* {
   --font-color: #ffffff;
   --font-color-accent: #DEBB6B;
   --font-color-accent-light: #F2E4C4;
   --font-color-accent-grey: #D3D6D9;

   --font-color-header: #F3F4F5;

   --header-bg: #425464;
   --header-border: #DEBB6B;
   --header-bg-dark: #2A3E50;


   --body-bg: #425464;
   --content-bg: #13293D;

   --border-radius: 8px;
   --border-radius-badge: 19px;
   --border-radius-button: 2px;

   --font-family-headline: "Bebas Neue";
   --font-family-text: "PT Sans";
   --font-family-text-bold: "PT Sans2";

   --miniPlayer-bg: #000000;

   --miniPlayer-radius: 8px;
   --miniPlayer-cover-radius: 1px;
   --miniPlayer-slider-color: #13293D;
   --miniPlayer-slider-background: #A1A9B1;

   --audioItem-badge-bg: #DEBB6B;
   --audioItem-text: black;

   margin: 0;
   padding: 0;
   font-feature-settings: 'liga' off, 'clig' off;

   font-family: var(--font-family-text);
}

body {
   min-height: 100vh;
   min-width: 100%;
   background: white;
   display: flex;
   flex-direction: column;
   align-items: center;

   color: var(--font-color-accent);
}
.bottomContainer
{
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   flex: 1;
   font-family: var(--font-family-headline);
   border-left: 2px solid var(--font-color-accent-light);
   /* die lange Linie an der linken Seite */
   width: 80%;
   margin-top: 64px;
   overflow-x: hidden;
}
audio {
   display: hidden;
}
.headline{
   font-family: var(--font-family-headline);
}
input::placeholder{
   color: var(--font-color-accent);
}
@media screen and (max-width: 700px) {
   
}

@font-face {
   src: url("../fonts/Bebas_Neue/BebasNeue-Regular.ttf");
   font-family: "Bebas Neue";
   font-weight: bold;
}

@font-face {
   font-family: "PT Sans2";
   src: url("../fonts/PT_Sans/PTSans-Bold.ttf") format('truetype');
   font-weight: 700;
   font-style: normal;
}
@font-face {
   font-family: "PT Sans";
   src: url("../fonts/PT_Sans/PTSans-Regular.ttf") format('truetype');
   font-weight: 400;
   font-style: normal;
}