.textueberuns {
    display: flex;
    flex: 100%;
    max-width: 100%;
    text-align: justify;
    margin-left: 30px;
    margin-right: 60px;
    line-height: 28px
}

.TextEndeChor {
  font-size: 50px;
  color: red;
}

.wir {
    margin-top: 30px;
    margin-left: 30px;
    margin-bottom: 10px;
}

/*die zeilen mit bild*/
.block {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
    margin-left: 20px;
    margin-top: 20px;
}

 .column1 {
    display: flex;
    flex: 11%;
    max-width: 11%;
    margin-top: 30px;
    
 }

 .column2 {
    display: flex;
    flex: 89%;
    max-width: 89%;
    margin-top: 30px;
    
    padding-left: 10px;
 }

 /*text von nadiia*/
 .textkontakt {
    margin-left: 25px;
    margin-right: 60px;
    text-align: justify;
    line-height: 28px;
    margin-bottom: 30px;
 }
/*überschrift nadiia*/
 h2 {
    margin-bottom: -15px;
 }

 .bildkontakt {
    margin-top: 13px;
    margin-left: 15px;
 }

 .gruppenbild {
    background-image: url('IMG-20240428-WA0086.jpg');
    background-size: cover;
    background-position: center;
    height: 400px;
    width: 94%;
    position: relative;
    margin-left: 30px;
    margin-top: 20px;
    border-radius: 25px;
   
 }

 .gruppenbildGenChor {
    background-image: url('Halloweenparty\ 1.jpg');
    background-size: cover;
    background-position: center;
    height: 400px;
    width: 94%;
    position: relative;
    margin-left: 30px;
    margin-top: 20px;
    border-radius: 25px;
 }

 .gruppenbildOrchester {
    background-image: url('GruppenbildOrchester.jpg');
    background-size: cover;
    background-position: center;
    height: 400px;
    width: 94%;
    position: relative;
    margin-left: 30px;
    margin-top: 20px;
    border-radius: 25px;
 }

 @media (max-width: 767px) {
    .gruppenbild,
    .gruppenbildGenChor,
   .gruppenbildOrchester{
        height: 200px;
    }
    .gruppenbildGenChor {
        width: 90%;
        margin-left: 20px;
    }
   .gruppenbild {
   	background-image: url('2024_04 Gruppenfoto.jpg');
   }
 }

 

@media (max-width: 1800px) {
    
    .column1{
        flex: 12%;
        max-width: 12%;
    }
    .column2 {
        flex: 88%;
        max-width: 88%;
       
    }
}

@media (max-width: 1650px) {
    
    .column1 {
        flex: 13%;
        max-width: 13%;
    }
    .column2{
        flex: 87%;
        max-width: 87%;
      
    }
}

@media (max-width: 1500px) {
    
    .column1 {
        flex: 14%;
        max-width: 14%;
    }
    .column2 {
        flex: 86%;
        max-width: 86%;
      
    }
}

@media (max-width: 1400px) {
    
    .column1 {
        flex: 15%;
        max-width: 15%;
    }
    .column2 {
        flex: 85%;
        max-width: 85%;
      
    }
}

@media (max-width: 1300px) {
    
    .column1,
    .column2 {
        flex: 100%;
        max-width: 100%;
        
    }
    .column2 {
        margin-top: 0;
    }
}

body {
    background-color: rgb(226, 226, 226);

    
   
}

 

  @media (max-width: 767px) {
    
   
    .gruppenbild,
    .gruppenbildOrchester{
        margin-left: 10px;
    }

    .rounded-circle {
        margin-left: 45px;
        margin-bottom: 15px;
      width: 225px;
      height: 225px;
    }
    
    .column2 {
      padding: 0px;
      margin: 0px;
    }
    .textkontakt {
      padding: 0px;
      margin-right: 30px;
      margin-left: 10px; /*20 sind schon beim block*/
    }
    .textueberuns {
      margin-right: 30px;
    }
  }
  
  /*.container {
    max-width: 1200px; /* Maximalbreite des Inhalts im Balken */
   /* margin: 0 auto; /* Zentriere den Container im Balken */
  /*}*/


.modal-body {
    text-align: center;
    
}

@media (max-width: 1200px) {
    .popup {
        width: 100%;
    }
}
@media (max-width: 992px) {
    
    .modal-body {
        height: 600px;
    }
    .popup {
        height: 560px;
    }
}
@media (max-width: 767px) {
    .popup{
        width: 320px;
        height: 427px;
    }
  .modal-body {
    height: 500px;
  }
  
}

