/* Structual Elements Go Here */
#wrapper{
    display: grid;
    grid-template-columns: 0 0fr 175px repeat(3, 1fr) 175px 0fr;
    grid-template-rows: 1fr repeat(2, 175px) 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    }
body{
    background-color:#edeeef;
    color:#554;
    margin: 0; 
    font:lato;
}

nav{
    grid-column: 2 / 3;
    background-color:#edeeef;
}
main{
    grid-column: 3 /-2;
    background-color: #fff;
    padding:20px;
    }
footer{
    grid-column: 3 / -2;
    background-color: #2d5ba6;
    color:#fff;
    font-size: 0.5rem;
    padding:20px;
    position: center;
    }

/* Navigation Elements Go Here */
nav ul{
    display: flexbox;
    padding:0;
    margin: 0; 
}
nav ul li{
    width:100%
}
nav ul li a{
    width:100%;
    color: #555;
    style:block; 
    padding: 10px;
}
nav a:hover{
    background-color:#fff;
    color:#d53631;
}


/* Styling Elements Go Here */
#solar{
    background-image: url(images/solarsystem.jpg);
}
img{
    background-size: cover; 
    background-repeat: no-repeat;
    width:300px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right:0px;
    padding-bottom: 0px;
    float:right;
}
caption{
    font-style: italic;
    font-size:0.75rem;
    position: center;
}
p{
    line-height: 1.25rem;
}
link{
    color:#d53631;
}

/* Media Query of 960 and less goes here */
@media screen and (max-width:960px){
    img, caption{
        width:100%;
        padding: 0px;
        float: none; 
    }
    nav ul{
        flex-box:
    }
    main{
    grid-column: 3 /-2;
    background-color: #fff;
    padding:20px;
    }
    footer{
    grid-column: 3 / -2;
    background-color: #2d5ba6;
    color:#fff;
    font-size: 0.5rem;
    padding:20px;
    }
    nav{
        grid-column: 2 / 3;
        background-color:#edeeef;
    }
}