#background {
    background-color: rgb(211, 211, 211);
    width: 70%;
    height: 94%;
    position: absolute;
    left:15%;
    right:15%;
    top:60px;
    z-index: -1;
    box-shadow: -5px 0 5px rgba(105, 105, 105, 0.5), 5px 0 5px rgba(105, 105, 105, 0.5);
    
}

#headline-text {
    color:rgb(255, 255, 255);
    font-size: 100px;
    text-align: center;
    background-color: rgb(196, 196, 196);
    padding: 10px 30px;
    border-radius: 20px;
    
    
}

#content {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.navigation-item {
    background-color: white;
    padding: 10px 30px;
    border-radius: 30px;
    flex-grow: 1;
    margin: 10px;
    text-align: center;
    z-index: 1;
}

#navigation {
    display: flex;
    justify-content: space-between;
    position:absolute;
    top: 22px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;

    

}

#text1 {
    top: 25px;
    left: 50%;
    transform: translate(-50%, -50%);
}

a {
    color: black;
    text-decoration: none;
    transition: all 0.2s ease;
}

a:visited {
    color: black;
}

a:hover {
    background-color: rgb(221, 221, 221);
    transform: scale(1.1);
}



#headlineu {
    display: flex;
    justify-content: space-between;
    position:absolute;
    top: 100px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 100px;
    color:rgb(255, 255, 255);
    font-size: 100px;
    text-align: center;
    background-color: rgba(225, 225, 225, 0.721);
    padding: 10px 30px;
    border-radius: 20px;
}

.textbetrieb {
    position:absolute;
    top: 350px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    text-align: center;
    background-color: rgba(225, 225, 225, 0.721);
    color:rgb(83, 83, 83);
    padding: 10px 30px;
    border-radius: 20px;
    animation: fade-in 1s ease;
  
}

#homebutton {
    display: flex;
    justify-content: space-between;
    position:absolute;
    top: 32px;
    left: 50%;
    transform: translate(-50%, -50%);

}



@keyframes fade-in-down {
    from {
        transform: translateY(-20px) scale(0.3);
        opacity: 0;
    }
    50% {
        transform: translateY(20px) scale(1.1);

    }
    to {
        opacity: 1;
    }
}

.fade-in-down {
    animation: fade-in-down 1s ease;
}

#brett {
    pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -2;
  top:0;
  left:0;
  right:0;
}

#balken {
    background-color: rgb(255, 255, 255);
    width: 70%;
    height: 57px;
    position: absolute;
    left:15%;
    right:15%;
    top:0px;
    z-index: 0;
    box-shadow: 0px 4px #878787b0;

}


#spargel1 {
    display: flex;
    justify-content: space-between;
    position:absolute;
    top: 350px;
    right: 30%;
    left: 55%; 
    border-radius: 20%;
    transition: all 0.2s ease;
    

}

#spargel1:hover {
    transform: scale(1.07);
    box-shadow: 5px 5px 5px 5px rgba(175, 175, 175, 0.573)   ;
}

#erdbeeren1:hover {
    transform: scale(1.07);
    box-shadow: 5px 5px 5px 5px rgba(175, 175, 175, 0.573)   ;
}

#erdbeeren1 {
    display: flex;
    justify-content: space-between;
    position:absolute;
    top: 350px;
    right: 50%;
    left: 24%; 
    border-radius: 20%;
    transition: all 0.2s ease;

}


@keyframes fade-in {
    from {
        opacity: 0;
    } 
    to {
        opacity: 1;
    }
}

.textbetrieb2 {
    position:absolute;
    top: 583px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    text-align: center;
    background-color: rgba(225, 225, 225, 0.721);
    color:rgb(83, 83, 83);
    padding: 10px 30px;
    border-radius: 20px;
    animation: fade-in 2s ease;
  
}

.textbetrieb0 {
    position:absolute;
    top: 450px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    text-align: center;
    background-color: rgba(225, 225, 225, 0.721);
    color:rgb(83, 83, 83);
    padding: 10px 30px;
    border-radius: 20px;
    animation: fade-in 2s ease;
  
}

.textbetrieb4 {
    position:absolute;
    top: 820px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    text-align: center;
    background-color: rgba(225, 225, 225, 0.721);
    color:rgb(83, 83, 83);
    padding: 10px 30px;
    border-radius: 20px;
    animation: fade-in 3s ease;
}