/* MOBILE MEDIA QUERIES iPad portrait */
    
    @media screen and (max-width: 1024px) {
    
        .grid-container {
            display: grid;
            grid-template-columns: 1fr repeat(8);
            grid-template-rows: auto;
            grid-template-areas:
            "menu menu menu menu menu menu menu menu"
            "logo logo logo logo logo logo logo logo"
            "slider slider slider slider slider slider slider slider"
            "contact contact contact contact contact contact contact  contact" 
            "social social social social social social social social"
            "intro intro intro intro intro intro intro intro" 
            "images images images images images images images images"
            "services services services services services services services services"
            "airport airport airport airport seaport seaport seaport seaport" 
            "corporate corporate corporate corporate wedding wedding wedding wedding"  
            "sport sport sport sport concert concert concert concert" 
            "party party party party group group group group" 
            "who who who who what what what what"
            "quote quote quote quote quote quote quote quote"
            "contact-l contact-l contact-l contact-l contact-l contact-l contact-l contact-l" 
            "contact-r contact-r contact-r contact-r contact-r contact-r contact-r contact-r"
            "footer footer footer footer footer footer footer footer "
            ;
            }
            .pullquote {
                padding: 20px;
                grid-area: quote;
                height: 700px;
                padding-top: 300px;
                text-align: center;
                background: url(../images/BG1.jpg) no-repeat center center scroll; 
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
            }

            .menuwrapper {
                width: 100%;
                max-width: 880px;
                margin-left: auto;
                margin-left: auto;
              }
    }

    /*todo slide show config */
    /* Slideshow container */
.slideshow-container {
    position: relative;
    display: grid;
    background: #f1f1f1f1;
  }
  
  /* Slides */
  .mySlides {
    display: none;
    padding: 80px;
    text-align: center;
  }
  
  /* Next & previous buttons */
  .prev, .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -30px;
    padding: 16px;
    color: #1C3A68;
    font-weight: bold;
    font-size: 20px;
    border-radius: 0 3px 3px 0;
    user-select: none;
  }
  
  /* Position the "next button" to the right */
  .next {
    position: absolute;
    right: 0;
  
    border-radius: 3px 0 0 3px;
  }
  
  /* On hover, add a black background color with a little bit see-through */
  .prev:hover, .next:hover {
    background-color: #1C3A68;
    color: white;
  }
  
  /* The dot/bullet/indicator container */
  .dot-container {
      text-align: center;
      padding: 20px;
      background: white;
  }
  
  /* The dots/bullets/indicators */
  .dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
  }
  
  /* Add a background color to the active dot/circle */
  .active, .dot:hover {
    background-color: #1C3A68;
  }
  
  /* Add an italic font style to all quotes */
  q {font-style: italic;}
  
  /* Add a blue color to the author */
  .author {color: #1C3A68;}


  /*todo MEDIA Queries */
    
    /* MOBILE MEDIA QUERIES Nexus 7 Android portrait / Galaxy Tab */
    
    @media screen and (max-width: 604px) {
        .pullquotetext {
            color: white;
            font-size: 2rem;
            font-family: 'Mochiy Pop P One', sans-serif;
        }
    }
    
    /* MOBILE MEDIA QUERIES Mobile iPhone 6plus */
    
    @media screen and (max-width: 428px) {
    
        .grid-container {
            display: grid;
            grid-template-columns: 1fr;
            grid-template-rows: auto;
            grid-template-areas:
            "menu"
            "logo" 
            "slider"
            "contact" 
            "social"
            "intro" 
            "images"
            "services"
            "airport"
            "seaport"
            "corporate" 
            "wedding"
            "sport" 
            "concert"
            "party"
            "group"
            "who" 
            "what"
            "quote"
            "contact-l"
            "contact-r"
            "footer"
            ;
            }
            .pullquotetext {
                color: white;
                font-size: 1.5rem;
                font-family: 'Mochiy Pop P One', sans-serif;
            }
    }
    /* Mobile 320 iphone 4 */

    @media screen and (max-width: 320px) {
    .button {
        background-color: #1C3A68;  /* Green */
        border: none;
        color: white;
        font-family: 'Raleway', sans-serif;
        padding: 16px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 14px;
        margin: 14px 2px;
        transition-duration: 0.4s;
        cursor: pointer;
        }
    }