
/* Bettin */


.bettin-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    width: 100%;
    margin: auto;
    background-color: #fff;
  }
  
  .bettin-box-1 {
    grid-column: 1 / span 1;
    grid-row: 1 / span 1;
    order: 0;
    background-image: url(/images/new-logo/bettin-neu.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-end;
  }
  
  .bettin-box-2 {
    grid-column: 1 / span 1;
    grid-row: 2 / span 1;
    order: 0;
  }
  
  .bettin-box-3 {
    grid-column: 2 / span 1;
    grid-row: 1 / span 1;
    order: 0;
  
  }
  
  .bettin-box-4 {
    grid-column: 2 / span 1;
    grid-row: 2 / span 1;
    order: 0;
    background-image: url(/images/IMG_1271.JPG);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-start;
  }
  
  .bettin-box-5 {
    grid-column: 3 / span 2;
    grid-row: 1 / span 2;
    order: 0;
    background-image: url(/images/Bettin_Showroom_50.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-end;
  }
  
  .bettin-box-6 {
    grid-column: 1 / span 1;
    grid-row: 3 / span 2;
    order: 0;
    background-image: url(/images/IMG_3910.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-start;
  }
  
  .bettin-box-7 {
    grid-column: 2 / span 1;
    grid-row: 3 / span 1;
    order: 0;
  
  }
  
  .bettin-box-8 {
    grid-column: 2 / span 1;
    grid-row: 4 / span 1;
    order: 0;
    background-image: url(/images/IMG_9053.JPG);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-start;
  
  }
  
  .bettin-box-9 {
    grid-column: 3 / span 1;
    grid-row: 3 / span 2;
    order: 0;
    background-image: url(/images/IMG_3934.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-start;
  
  }
  
  .bettin-box-10 {
    grid-column: 4 / span 1;
    grid-row: 3 / span 2;
    order: 0;
  
  }
  
  .bettin-box-11 {
  display:none;
  
  }
  
  
  
  
  
  
  @media screen and (max-width: 1300px) {
    .bettin-container {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
      width: 100%;
      margin: auto;
      background-color: #fff;
    }
    .bettin-box-1 {
      grid-column: 1 / span 1;
      grid-row: 1 / span 1;
      order: 0;
  
    }
    
    .bettin-box-2 {
      grid-column: 1 / span 1;
      grid-row: 2 / span 1;
      order: 0;
    }
    
    .bettin-box-3 {
      grid-column: 2 / span 1;
      grid-row: 1 / span 1;
      order: 0;
    
    }
    
    .bettin-box-4 {
      grid-column: 2 / span 1;
      grid-row: 2 / span 1;
      order: 0;
  
    }
    
    .bettin-box-5 {
      grid-column: 1 / span 2;
      grid-row: 3 / span 2;
      order: 0;
  
    }
    
    .bettin-box-6 {
      grid-column: 3 / span 1;
      grid-row: 1 / span 2;
      order: 0;
  
    }
    
    .bettin-box-7 {
      grid-column: 3 / span 1;
      grid-row: 3 / span 1;
      order: 0;
    
    }
    
    .bettin-box-8 {
      grid-column: 3 / span 1;
      grid-row: 4 / span 1;
      order: 0;
  
    
    }
    
    .bettin-box-9 {
      grid-column: 1 / span 1;
      grid-row: 5 / span 2;
      order: 0;
  
    
    }
    
    .bettin-box-10 {
      grid-column: 2 / span 1;
      grid-row: 5 / span 2;
      order: 0;
    
    }
  
    .bettin-box-11 {
      display: block;
      grid-column: 3 / span 1;
      grid-row: 5 / span 2;
      order: 0;
      background-image: url(/images/Coon/182237233_150063590407630_8640499078604546696_n.jpg);
      background-size: cover;
      background-position: center;
      display: flex;
      justify-content: flex-start;
    }
    
  }
  
  @media screen and (max-width: 991px) {
    .bettin-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
      width: 100%;
      margin: auto;
      background-color: #fff;
    }
  
    .bettin-box-1 {
      grid-column: 1 / span 1;
      grid-row: 1 / span 1;
      order: 0;
  
    }
    
    .bettin-box-2 {
      grid-column: 1 / span 1;
      grid-row: 2 / span 1;
      order: 0;
    }
    
    .bettin-box-3 {
      grid-column: 2 / span 1;
      grid-row: 1 / span 1;
      order: 0;
    
    }
    
    .bettin-box-4 {
      grid-column: 2 / span 1;
      grid-row: 2 / span 1;
      order: 0;
  
    }
    
    .bettin-box-5 {
      grid-column: 1 / span 2;
      grid-row: 3 / span 2;
      order: 0;
  
    }
    
    .bettin-box-6 {
      grid-column: 1 / span 1;
      grid-row: 5 / span 2;
      order: 0;
  
    }
    
    .bettin-box-7 {
      grid-column: 2 / span 1;
      grid-row: 5 / span 1;
      order: 0;
    
    }
    
    .bettin-box-8 {
      grid-column: 2 / span 1;
      grid-row: 6 / span 1;
      order: 0;
  
    
    }
    
    .bettin-box-9 {
      grid-column: 1 / span 1;
      grid-row: 7 / span 2;
      order: 0;
  
    
    }
    
    .bettin-box-10 {
      grid-column: 2 / span 1;
      grid-row: 7 / span 2;
      order: 0;
    
    }
    
    .bettin-box-11 {
    display:none;
    
    }
    
    
  }
  
  @media screen and (max-width: 650px) {
    .bettin-container {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
      width: 100%;
      margin: auto;
      background-color: #fff;
    }
  
    .bettin-box-1 {
      grid-column: 1 / span 1;
      grid-row: 1 / span 1;
      order: 0;
  
    }
    
    .bettin-box-2 {
      grid-column: 1 / span 1;
      grid-row: 3 / span 1;
      order: 0;
    }
    
    .bettin-box-3 {
      grid-column: 1 / span 1;
      grid-row: 2 / span 1;
      order: 0;
    
    }
    
    .bettin-box-4 {
      grid-column: 1 / span 1;
      grid-row: 4 / span 1;
      order: 0;
  
    }
    
    .bettin-box-5 {
      grid-column: 1 / span 2;
      grid-row: 5 / span 2;
      order: 0;
  
    }
    
    .bettin-box-6 {
      grid-column: 1 / span 1;
      grid-row: 7 / span 2;
      order: 0;
  
    }
    
    .bettin-box-7 {
      grid-column: 1 / span 1;
      grid-row: 9 / span 1;
      order: 0;
    
    }
    
    .bettin-box-8 {
      grid-column: 1 / span 1;
      grid-row: 10 / span 1;
      order: 0;
  
    
    }
    
    .bettin-box-9 {
      grid-column: 1 / span 1;
      grid-row: 11 / span 2;
      order: 0;
   
    
    }
    
    .bettin-box-10 {
      grid-column: 1 / span 1;
      grid-row: 13 / span 2;
      order: 0;
    
    }
    
    .bettin-box-11 {
    display:none;
    
    }
    
    
  }