@media screen and (min-width: 1101px) {
  
header {
  background-image: url(VoorOuders-Foto.jpg);
}

.scholen {
  display: flex;
  height: 186px;
}

.commanderij {
  background-color: white;
  width: 290px;
  margin-left: 15px;
  margin-right: 120px;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 0 40px 0 0;
}

.commanderij img {
   width: 254px;
   height: 50px;
}

.reeshof {
  background-color: white;
  width: 290px;
  margin-left: 15px;
  align-items: center;
  display: flex;
  justify-content: center;

}

.reeshof img {
  width: 252px;
  height: 95px;
}

.varendonck {
  background-color: white;
  margin-left: 120px;
  width: 290px;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 0 0 0 40px;
}

.varendonck img {
  width: 130px;
  height: 150px;
}


.sondervick {
  background-color: white;
  width: 290px;
  margin-left: 15px;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 0 0 0 0;
}

.sondervick img {
  width: 260px;
  height: 180px;
  border-radius: 0 40px 0 0;
}

.alinea1 {
  padding-left: 80px;
  padding-right:  80px;
  text-align: left;
  margin-bottom: 100px;
  }

  .alinea2 {
    padding-left: 80px;
    padding-right: 80px;
    text-align: left;
    margin-right: 0;
    position: relative;
    margin-bottom: 120px;
    display: flex;
    align-items: center;
    
  }
  
  .alinea2_tekst {
    padding-left: 10px;
  }
  
  .frambozen {
    flex: 1;
    height: 330px;
      width: 450px;
      margin-left: 0px;
      margin-right: 75px;
      border-radius: 0 40px 0 40px;
  }

  .alinea3 {
    padding-left: 80px;
    padding-right:  80px;
    text-align: left;
    margin-bottom: 100px;
    }

    .cor-uitspraak {
      flex: 1;
      height: 200px;
      width: 200px;
      margin-left: 0px;
      margin-right: 75px;
      border-radius: 0px 40px 0px 40px;
    }
  
    .tussenkopje {
      padding: 0 80px;
      text-align: left;
      font-size: 23px;
      margin-bottom: 20px;
      position: relative;
      display: flex;
      align-items: center;
    }
  
    .tussenkopje-tekst {
      padding-left: 10px;
    }
  
    .uitspraak h3 {
      color: rgb(118, 118, 118);
      margin-bottom: 135px;
      padding-left: 100px;
    }

    .alinea4 {
      padding-left: 80px;
      padding-right: 80px;
      text-align: left;
      margin-right: 0;
      position: relative;
      margin-bottom: 120px;
      display: flex;
      align-items: center;
      
    }
    
    .alinea4_tekst {
      padding-left: 10px;
    }
    
    .fruitschaal {
      flex: 1;
      height: 330px;
        width: 450px;
        margin-left: 75px;
        margin-right: 0px;
        border-radius: 0 40px 0 40px;
    }

    .alinea5 {
      padding-left: 80px;
      padding-right: 80px;
      text-align: left;
      margin-right: 0;
      position: relative;
      margin-bottom: 120px;
      display: flex;
      align-items: center;
      
    }
    
    .alinea5_tekst {
      padding-left: 10px;
    }
    
    .smileys {
      flex: 1;
      height: 330px;
        width: 450px;
        margin-left: 0px;
        margin-right: 75px;
        border-radius: 0 40px 0 40px;
    }

    .alinea6 {
      padding-left: 80px;
      padding-right:  80px;
      text-align: left;
      margin-bottom: 100px;
      }

      .alinea6 button a {
        color: white;
        padding: 15px 23px;
        text-decoration: none;
      }
    
      .alinea6 button {
        background-color: #80ba27;
        color: white;
        border: none;
        padding: 15px 0px;
        transition: background-color 0.3s;
        border-radius: 0 20px 0 20px;
        font-family: 'Lato', sans-serif;
        font-size: 17px;
      }
      
      .alinea6 button:hover {
        background-color: #4f721a;
        animation: shake 0.5s;
      }
      
      @keyframes shake {
        0% { transform: translateX(0); }
        25% { transform: translateX(-5px); }
        50% { transform: translateX(5px); }
        75% { transform: translateX(-5px); }
        100% { transform: translateX(0); }
      }
    }

      @media screen and (min-width: 601px) and (max-width: 1100px) {

        header {
          background-image: url(VoorOuders-Foto.jpg);
        }

      .scholen {
        display: flex;
        height: 186px;
      }
      
      .commanderij {
        background-color: white;
        width: 290px;
        margin-left: 15px;
        margin-right: 0px;
        align-items: center;
        display: flex;
        justify-content: center;
        border-radius: 0 0px 0 0;
      }
      
      .commanderij img {
         width: 180px;
         height: 40px;
      }
      
      .reeshof {
        background-color: white;
        width: 240px;
        margin-left: 15px;
        align-items: center;
        display: flex;
        justify-content: center;
      
      }
      
      .reeshof img {
        width: 200px;
        height: 60px;
      }
      
      .varendonck {
        background-color: white;
        margin-left: 0;
        width: 240px;
        align-items: center;
        display: flex;
        justify-content: center;
        border-radius: 0 0 0 0px;
      }
      
      .varendonck img {
        width: 90px;
        height: 110px;
      }
      
      
      .sondervick {
        background-color: white;
        width: 240px;
        margin-left: 15px;
        align-items: center;
        display: flex;
        justify-content: center;
        border-radius: 0 0 0 0;
      }
      
      .sondervick img {
        width: 200px;
        height: 140px;
        border-radius: 0 40px 0 0;
      }
      


      .alinea1 {
        padding-left: 50px;
        padding-right:  50px;
        text-align: left;
        margin-bottom: 100px;
        }
      
        .alinea2 {
          padding-left: 50px;
          padding-right: 50px;
          text-align: left;
          margin-right: 0;
          position: relative;
          margin-bottom: 120px;
          display: flex;
          align-items: center;
          
        }
        
        .alinea2_tekst {
          padding-left: 10px;
        }
        
        .frambozen {
          flex: 1;
          height: 240px;
            width: 360px;
            margin-left: 0px;
            margin-right: 20px;
            border-radius: 0 40px 0 40px;
        }
      
        .alinea3 {
          padding-left: 50px;
          padding-right:  50px;
          text-align: left;
          margin-bottom: 100px;
          }
      
          .cor-uitspraak {
            flex: 1;
            height: 180px;
            width: 180px;
            margin-left: 0px;
            margin-right: 20px;
            border-radius: 0px 40px 0px 40px;
          }
        
          .tussenkopje {
            padding: 0 50px;
            text-align: left;
            font-size: 23px;
            margin-bottom: 20px;
            position: relative;
            display: flex;
            align-items: center;
          }
        
          .tussenkopje-tekst {
            padding-left: 10px;
          }
        
          .uitspraak h3 {
            color: rgb(118, 118, 118);
            margin-bottom: 135px;
            padding-left: 100px;
          }
      
          .alinea4 {
            padding-left: 50px;
            padding-right: 50px;
            text-align: left;
            margin-right: 0;
            position: relative;
            margin-bottom: 120px;
            display: flex;
            align-items: center;
            
          }
          
          .alinea4_tekst {
            padding-left: 10px;
          }
          
          .fruitschaal {
            flex: 1;
            height: 240px;
              width: 360px;
              margin-left: 20px;
              margin-right: 0px;
              border-radius: 0 40px 0 40px;
          }
      
          .alinea5 {
            padding-left: 50px;
            padding-right: 50px;
            text-align: left;
            margin-right: 0;
            position: relative;
            margin-bottom: 120px;
            display: flex;
            align-items: center;
            
          }
          
          .alinea5_tekst {
            padding-left: 10px;
          }
          
          .smileys {
            flex: 1;
            height: 240px;
              width: 360px;
              margin-left: 0px;
              margin-right: 20px;
              border-radius: 0 40px 0 40px;
          }
      
          .alinea6 {
            padding-left: 80px;
            padding-right:  80px;
            text-align: left;
            margin-bottom: 100px;
            }
      
            .alinea6 button a {
              color: white;
              padding: 15px 23px;
              text-decoration: none;
            }
          
            .alinea6 button {
              background-color: #80ba27;
              color: white;
              border: none;
              padding: 15px 0px;
              transition: background-color 0.3s;
              border-radius: 0 20px 0 20px;
              font-family: 'Lato', sans-serif;
              font-size: 17px;
            }
            
            .alinea6 button:hover {
              background-color: #4f721a;
              animation: shake 0.5s;
            }
            
            @keyframes shake {
              0% { transform: translateX(0); }
              25% { transform: translateX(-5px); }
              50% { transform: translateX(5px); }
              75% { transform: translateX(-5px); }
              100% { transform: translateX(0); }
            }
    }

    @media screen and (max-width: 600px) {

      header {
        background-image: url(VoorOuders-Foto.jpg);
      }


    .commanderij {
      background-color: white;
      width: 100%;
      height: 140px;
      margin-bottom: 15px;
      align-items: center;
      display: flex;
      justify-content: center;
  
    }
  
    .commanderij img {
       width: 230px;
       height: 50px;
    }
    
    .reeshof {
      background-color: white;
      width: 100%;
      height: 140px;
      margin-bottom: 15px;
      align-items: center;
      display: flex;
      justify-content: center;
  
    }
    
    .reeshof img {
      width: 210px;
      height: 65px;
    }
    
    .varendonck {
      background-color: white;
      margin-bottom: 15px;
      width: 100%;
      height: 140px;
      align-items: center;
      display: flex;
      justify-content: center;
      border-radius: 0 0 0 0px;
    }
    
    .varendonck img {
      width: 90px;
      height: 110px;
    }
    
    
    .sondervick {
      background-color: white;
      width: 100%;
      height: 140px;
      margin-bottom: 15px;
      align-items: center;
      display: flex;
      justify-content: center;
      border-radius: 0 0 0 0;
    }
    
    .sondervick img {
      width: 170px;
      height: 140px;
      border-radius: 0 40px 0 0;
    }
    



    .alinea1 {
      padding-left: 30px;
      padding-right: 30px;
      text-align: left;
      margin-bottom: 40px;
      }
    
      .alinea2 {
        padding-left: 30px;
        padding-right: 30px;
        text-align: left;
        margin-right: 0;
        position: relative;
        margin-bottom: 50px;
        align-items: center;
        
      }
      
      .frambozen {
        flex: 1;
        height: 66%;
          width: 100%;
          border-radius: 0 40px 0 40px;
      }
    
      .alinea3 {
        padding-left: 30px;
        padding-right: 30px;
        text-align: left;
        margin-bottom: 100px;
        }
    
        .cor-uitspraak {
          flex: 1;
          height: 180px;
          width: 180px;
          border-radius: 0px 40px 0px 40px;
        }
      
        .tussenkopje {
          padding: 0 30px;
          text-align: left;
          font-size: 17px;
          margin-bottom: 20px;
          position: relative;
          align-items: center;
        }
      
        .tussenkopje-tekst {
          padding-left: 10px;
        }
      
        .uitspraak h3 {
          color: rgb(118, 118, 118);
          margin-bottom: 50px;
          padding: 0 30px;
        }
    
        .alinea4 {
          padding-left: 30px;
          padding-right: 30px;
          text-align: left;
          margin-right: 0;
          position: relative;
          margin-bottom: 50px;
          align-items: center;
          
        }
        
        .alinea4_tekst {
          margin-bottom: 20px;        
        }
        
        .fruitschaal {
          flex: 1;
          height: 66%;
            width: 100%;
            border-radius: 0 40px 0 40px;
        }
    
        .alinea5 {
          padding-left: 50px;
          padding-right: 50px;
          text-align: left;
          margin-right: 0;
          position: relative;
          margin-bottom: 50px;
          display: flex;
          flex-direction: column;
          align-items: center;
          
        }
        
        
        .smileys {
          flex: 1;
          height: 66%;
            width: 100%;
            border-radius: 0 40px 0 40px;
            order: 2;
        }
    
        .alinea6 {
          padding-left: 30px;
          padding-right:  30px;
          text-align: left;
          margin-bottom: 60px;
          }
    
          .alinea6 button a {
            color: white;
            padding: 15px 23px;
            text-decoration: none;
          }
        
          .alinea6 button {
            background-color: #80ba27;
            color: white;
            border: none;
            padding: 15px 0px;
            transition: background-color 0.3s;
            border-radius: 0 20px 0 20px;
            font-family: 'Lato', sans-serif;
            font-size: 17px;
          }
          
          .alinea6 button:hover {
            background-color: #4f721a;
            animation: shake 0.5s;
          }
          
          @keyframes shake {
            0% { transform: translateX(0); }
            25% { transform: translateX(-5px); }
            50% { transform: translateX(5px); }
            75% { transform: translateX(-5px); }
            100% { transform: translateX(0); }
          }
      
    }