body {
    background-color: rgb(255, 254, 254);
    cursor: crosshair;
    margin: 0;
    padding: 0;
     overflow-x: hidden;
}

h1 {
    color: #001DFF;
    text-align: center;
    font-size: 150px;
    font-family: Helvetica, sans-serif;
    height: 100%;
    width: 100%;
}

canvas{
    background-color: rgba(255, 141, 44)
}

h2,
h3,
h4,
h5,
h6,
p {

    font-family: Helvetica, sans-serif;
    color: #001DFF;

}

canvas {
    position: absolute;
    z-index: -1;
    height: 100%;
    top: 0;
    left: 0;


}

.landingpage {
    size: 100px;
    cursor: none;
    padding: 200px;
}

.header{
    position: sticky;
}




        .containerabout {
    
        display: flex;
        justify-content: center;
        margin-top: 200px;
        }
        
        .title {
          font-size: 80pt;
          font-weight: bold;
        }
        
        .text {
          width: 400px;
          margin-bottom: 250px;
        }
        
        .imgAbout {
          width: 300px;
          object-fit: cover;
          margin-right: 20px;
        }
  
      .abstand{
          height:300px;
      }

      .column{
        margin: 0,0,0,0;
        
      }


.ueberschriftabout {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;

}

.ueberschriftabout h2 {
    font-size: 10rem;
    margin-bottom: 10px;
}


.projekt1,
.projekt2,
.projekt3 {
    background-color: none;
    width: auto;
    height: auto;
    padding: 5%;
    margin-left: 5%;
    
    border-radius: 25px;
    border: 2px solid blue;
    flex: 1;
}


.projekt {
   
    display: flex;
    padding-right: 5%;
}




.projekt-button {
    border: 2px solid blue;
    background-color: white;
    font-family: Helvetica, sans-serif;
    text-decoration: underline;
    color: #001DFF;
    padding: 15px 32px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 2px;

}

.projekt-button:hover {

    border-radius: 10px;
}




.titlework {
    text-align: center;
    font-size: 80pt;
    font-weight: bold;
    padding-top: 10%;
    
  }

.footer{
    height: 300px;
   
}

.container {
    display: flex;
    justify-content: center;
    height: 1100px;
  }
  
  .project {
    flex: 1;
    margin: 0 20px; /* 40px Abstand mit je 20px auf beiden Seiten */
    transition: flex 0.5s ease;
  }
  
  
  .expanded {
    flex: 3;
  }
  
  .project h3,
  .project p {
    transition: font-size 0.5s ease;
  }
  
  .project.expanded h3,
  .project.expanded p {
    font-size: 1.1em; /* Beispielwert, anpassen nach Bedarf */
  }



  .footer {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #001DFF;
    padding: 20px;
    width: 100%;
    position: absolute;
    height: 80px;
  
  }
  
  .footer img {
    width: 40px;
    margin: 0 100px;
  }