/* Big tablet to 1200px (widths smaller taht the 1140px row) */
@media only screen and (max-width: 1200px) {
    .grid {
        display: grid;
        margin: 0 100px 0;
        padding: 0;
        grid-template-columns: 80%;
    
    }
    
    h2:after {
        display: block;
        height: 2px;
        background: #ff8000;
        content: "";
        width: 80%;
        margin: 0 auto;
        margin-top: 20px;
    }
    
    .grid-attraction1 {
    
        display: grid;
        margin: 0 20px 0;
        padding: 0px;
        grid-template-columns: 30% 40% 30%;
        font-size: 15px;
    }
    .grid-1a,
    .grid
    {
        font-size: 15px;
        word-spacing: 0;
        text-align: justify;
        letter-spacing: 0;

    }
    
    .icon-info  {
        display: block;
        float: left;
        width: 380px;
    
    }
     
  
    .gallery img {
        width: 243px;
        height: 100%;
        padding: 5px;
    }
    .gallery {
    margin-left: 150px;
    margin-bottom: 250px;
    }
    }

/* Small tablet to big tablet: from 768px to 1023px */
@media only screen and (max-width: 1023px) {
    
    .gallery img {
        width: 300px;
        height: 50%;
        padding: 5px;
        display: block;
        float: left;
        
    }
    .gallery {
        margin: 10px 83px;
        height: 400px
                
        
    }
    .sticky .main-nav {
        margin-top: -35px;
    }
    
    .icon-info  {
        display: block;
        float: left;
        width: 280px;
    
    }
    
    
}

/* Small phone to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
    
    .grid {
        display: flex;
        margin-left: 10px;
        margin-right: 10px;
        padding: 0;
        font-size: 14px;
    
    }
    
    .grid-attraction1 {
        display: inline-block;
    }
     
    .gallery {
        max-height: 700px;
    }
    
    .footer{
        margin-bottom: 0px;
    }
    
    
}