     
      
      
      /* Gallery */
      
      .gallery-wrapper{
  
      
        display:grid;
      
        grid-template-columns: 2fr 1fr 1fr; 
        grid-template-rows: auto auto auto 20%;
        grid-template-areas: 
        "gastek telephone email"
        "menu menu menu"
        "slideshow-container slideshow-container slideshow-container"
        "thumbnail-container thumbnail-container thumbnail-container"
        ;
      
      
      }
      
      
      .slideshow-container {
      
      
        width:100%;
        display:grid;
      
      
        grid-template-columns: 1fr 18fr 1fr ;
        grid-template-areas: 
        "sNavLeft slide-container sNavRight "
      
        ;
      
        grid-area:slideshow-container;
      
      }
      
      
      
      /* Slideshow container */
      .slide-container {
      
      overflow: hidden;
      
      
      grid-area: slide-container;
      display:grid;
      
      align-items: center;
        justify-items: center;
      
      }
      
      
      
      .slide-container img {
        width:100%;
        height:100%;
        
        object-fit: cover;
      }
      
      
      
      .sNavLeft{
      
      font-size:30px;
      
      
      align-items: center;
        justify-items: center;
        vertical-align: middle;
        display:grid;
      
      grid-area: sNavLeft;
      }
      
      
      .sNavRight{
      
      
      font-size:30px;
      align-items: center;
        justify-items: center;
        vertical-align: middle;
        display:grid;
      grid-area: sNavRight;
      }
      
      
      .thumbnail-container{
      
      margin-top:20px;
       
        display:grid;
        grid-template-columns: 1fr 18fr 1fr ;
        grid-template-areas: 
        "tNavLeft thumbnail-slides tNavRight"
        ;
        grid-area:thumbnail-container;
      }
      
        
      
      
      .thumbnail-slides {
      width:100%;
      height: 100%;
      
      color:white;
      
      
      
      justify-content: center;
        align-items: center;
        
        display:grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr ;
        grid-template-rows: auto;
        grid-template-areas: 
        " thumbnail-slide thumbnail-slide thumbnail-slide thumbnail-slide thumbnail-slide thumbnail-slide"
        ;
        grid-area: thumbnail-slides;
        grid-gap:20px;
      }
      
      
      
      .thumbnail-slide{
      
      height:auto;
      overflow: hidden;
      
      }
      
      .thumbnail-slide img{
      width:100%;
      height:100%;
      
      object-fit: contain;
      
      }
      
      
      .cursor {
      cursor: pointer;
      }
      
      
      .tNavLeft{
      
      
        font-size:30px;
      
      cursor: pointer;
      align-items: center;
        justify-items: center;
        vertical-align: middle;
        display:grid;
      grid-area: tNavLeft;
      }
      
      
      .tNavRight{
       
       
        font-size:30px;
      
        cursor: pointer;
        align-items: center;
        justify-items: center;
        vertical-align: middle;
        display:grid;
        grid-area: tNavRight;
      }
      
      .prevThumbSlide,.nextThumbSlide
      {
      cursor: pointer;
      
      
      width: auto;
      padding: 16px;
      
      color: white;
      font-weight: bold;
      font-size: 20px;
      border-radius: 0 3px 3px 0;
      user-select: none;
      -webkit-user-select: none;
      }
      
      
      
      
      .prevThumbSlide:hover,.nextThumbSlide:hover 
      {
      background-color: rgba(0, 0, 0, 0.6);
      }
      
      
       
      .gallery-title{
      
        font-size: 14px;
        color: white;
        font-weight: 300;
      
      grid-area:gallery-title;
        }
      
        .gallery-t0 {
      margin-left:20px;
      font-weight: 300;
      
        color:white;
        }
      
      
         
        @media only screen and (max-width: 860px) {
         
          
      .gallery-wrapper{
      
      
        display:grid;
      
        grid-template-columns: 1fr; 

        grid-template-areas: 
        "gastek"
        "telephone"
        "email"
        "menu"
        "slideshow-container"
        "thumbnail-container"
        ;
      
      
      }
    }