@media (min-width: 768px) and (max-width: 1024px) { 
    body {
        margin: 0px;
        padding: 5px 0px 0px 0px;
    }

    header img {
        width: 96px;
        height: auto;
    }

    header img {
        width: 96px;
        height: auto;
    }
    
    nav {
        display: flex;
        flex-direction: unset;
        border-radius: 0px;
    }

    nav button {display: none;}
        
    nav ul.hide {display: block;}
        
    nav ul li {
        float: left;
    }
        
    nav ul li a {
        border: none;
        padding: .6rem 1rem;
    }

    main {
        max-width: 560px;
        margin: 20px auto;
    } 

    .banner {
        position: relative;
    }
    
    .weather-summary {
    position: absolute;
    top: 15px;
	left: 18px;
    opacity: .8;
    }

    .contact-info {
        display: grid;
        grid-template-columns: 36px auto;
        border-radius: 0px;
        padding: 18px 249px 15px 249px;
    }

    .contact-info-heading {
        grid-column: 1/3;
        grid-row: 1/2;
    }

    .idahosphere-heading {
        grid-column: 1/3;
        grid-row: 2/3;
    }

    .address-icon {
        grid-column: 1/2;
        grid-row: 3/4;
    }

    .address {
        grid-column: 2/3;
        grid-row: 3/4;
    }

    .email-icon {
        grid-column: 1/2;
        grid-row: 4/5;
    }

    .email {
        grid-column: 2/3;
        grid-row: 4/5;
    }

    .phone-icon {
        grid-column: 1/2;
        grid-row: 5/6;
    }

    .phone {
        grid-column: 2/3;
        grid-row: 5/6;
    }

    .facebook-icon {
        grid-column: 1/2;
        grid-row: 6/7;
    }

    .instagram-icon {
        grid-column: 2/3;
        grid-row: 6/7;
    }

    .location-idahosphere {
        grid-column: 1/3;
	    grid-row: 7/8;
        padding: 0px;
    }

    .website-info {
        text-align: center;
    }

    footer {
        border-radius: 0px;
    }

    footer p {
        border-radius: 0px;
    }

    .main-gallery-page {
        max-width: 764px;
        margin: 20px auto;
        position: relative;
    }

    .weather-gallery {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr;
        border-radius: 5px;
    }

    .figcaption3 {
        color: #fefefe;
        padding: 5px 10px 25px 10px;
    }

    .figcaption6 {
        padding: 5px 10px 25px 10px;
    }

    .weather-gallery figure:nth-child(3) {
        background-color: #003959;
    }

    .image-1 {
        grid-column: 1/2;
        grid-row: 1/2;
        padding: 0px 4px 0px 0px;
        border-radius: 5px 0px 0px 0px;
    }
    
    .image-2 {
        grid-column: 2/3;
        grid-row: 1/2;
        padding: 0px 0px 0px 4px;
        border-radius: 0px 5px 0px 0px;
    }
    
    .image-3 {
        grid-column: 1/2;
        grid-row: 2/3;
        padding: 15px 4px 0px 0px;
    }
    
    .image-4 {
        grid-column: 2/3;
        grid-row: 2/3;
        padding: 15px 0px 0px 4px;
    }
    
    .image-5 {
        grid-column: 1/2;
        grid-row: 3/4;
        padding: 15px 4px 0px 0px;
    }
    
    .image-6 {
        grid-column: 2/3;
        grid-row: 3/4;
        padding: 15px 0px 0px 4px;
    }
    
    .image-7 {
        grid-column: 1/2;
        grid-row: 4/5;
        padding: 15px 4px 0px 0px;
    }
    
    .image-8 {
        grid-column: 2/3;
        grid-row: 5/6;
        padding: 15px 0px 0px 4px;
    }
    
    .image-9 {
        grid-column: 1/3;
        grid-row: 9/10;
        padding: 15px 4px 0px 0px;
    }
}