
#wrapper{
    display: grid;
    grid-auto-rows: minmax(0px, auto);
    grid-template-columns: minmax(0px, 1fr) repeat(6, minmax(0, 250px)) minmax(0px, 1fr);
}

nav{
    background-color: purple;
    opacity: 0.5;
    height: 70px;
    grid-row: 1 / 2;
    grid-column: 2 / -2;
    
}
header{
    background-color: darkorchid;
    opacity: 0.5;
    height:70px;
    grid-row: 1 / 2;
    grid-column: 1 / -1;
    
}

#image{
    background-color: pink;
    opacity: 0.5;
    grid-row: 1 / 3;
    grid-column: 1 / -1;
    height: 460px;
}

main{
    height: 950px;
    opacity: 0.5;
    grid-column: 2 / -2;
    grid-row: 4 / 5;
    background-color: green;
}

footer{
    height: 188px;
    opacity: 0.5;
    grid-column: 1 / -1;
    grid-row: 5 / 6;
    background-color: yellow;
}


body{
    background-color: #FFFFFF;
    color: #666666;
    margin: 0px;
    
    background-attachment: fixed;
    background-image: linear-gradient(to bottom,#eeeeee ,#ffffff);
}





@media only screen and (max-width: 1100px){
    #wrapper {
        display: grid;
        grid-template-columns: 1fr repeat(6, minmax(0, 250px)) 1fr;
        
    }
}


