
body {
    background-image: url('pictures/verlauf_oben.jpg');  

   /* background-image: url('pictures/projektehintergrundrechtsoben.png');
    background-image: url('pictures/Zeichenfläche\ 2.jpg');*/
    background-size: cover;                           
    background-position: center center;                
    background-attachment: fixed;                      
    margin: 0;                                         
    padding: 0;                                        
    height: 100vh;                                     
    display: flex;
    flex-direction: column;
}



.contactcontainer {
    display: flex;              
    flex-direction: column;   
    justify-content: center;   
    align-items: center;        
    height: 100vh;             
    margin: 1rem;
    text-align: center;
    margin-top: -20px;    
    
      
}

.contactcontainer img {
    width: 300px;         
    height: auto;         
    margin-bottom: 40px;  
    transition: transform 0.3s ease-in-out;
}


.contactcontainer img:hover {
   
    transform: scale(1.05);
}
.contactcontainer h2 {
    font-size: 2rem;         
    margin-bottom: 20px;      
}

.contactcontainer p {
    font-size: 1rem;       
    margin: 10px 0;             
    text-align: left;          
    width: 100%;               
    max-width: 300px;           
}





p {
    display: flex;
    justify-content: space-between; 
    align-items: center; 
    width: 100%; 
    max-width: 400px; 
}

p a {
    color: black;
    text-align: right; 
    flex-shrink: 0; 
    position: relative;
    text-decoration: none; 
}

p a::before {
    content: "";
    position: absolute;
    bottom: -3px; /* Positioniert die Linie direkt unter dem Link */
    left: 0;
    width: 0%; /* Linie beginnt bei 0% */
    height: 2px; /* Höhe der Linie */
    background-color: #fe82f0; /* Farbe der Linie */
    transition: width 0.4s ease;
}

/* Wenn die Maus über den Link fährt */
p a:hover::before {
    width: 100%; /* Linie wächst auf 100% Breite */
}


/*zentriert footer inhalt*/
footer p {
    margin: 0 auto; 
    display: block; 
}
