* {margin: 0px; font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;}


#wrapper {display: grid; grid-auto-rows: minmax(0px, auto); 
    grid-template-columns: minmax(0px,1fr) repeat(6, minmax(0,175px)) minmax(0px,1fr);}
 
#redbarnav {background-color: #d32027; grid-row-start: 1; grid-row-end: 2;
            grid-column-start: 1; grid-column-end: -1;}

#homehero {height: 400px; background-image: url(images/homehero.jpg);
            background-size: cover; background-repeat: no-repeat; 
            background-position: 0% 20%;
            grid-row-start: 2; grid-row-end: 3; 
            grid-column-start: 1; grid-column-end: -1;}

#grey {background-color: #a3a3a3; grid-column-start: 1;grid-column-end: -1;grid-row-start: 3; grid-row-end: 5;}

#redbarfooter {background-color: #d32027; grid-row-start: 5; grid-row-end: 6;
             grid-column-start: 1; grid-column-end: -1; }

nav {grid-row-start: 1; grid-row-end: 2; grid-column-start: 4; grid-column-end: -2;
        background-color: #d32027; position: sticky;}

nav a   {text-decoration: none; font-weight: bold; color: #ffffff;
        padding: 1rem 0rem; display:block; text-align: center; height: 100%; font-size: 2vw;}

nav ul { marker: none; margin: auto; padding: 0px; list-style-type: none;
        display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; height: 100%;}  

nav ul li {width: 100%;}

header {grid-column-start: 1; grid-column-end: 4;grid-row-start: 1; grid-row-end: 2;}

header h1 {line-height: 100%; font-size: 2vw;
                text-align: center; font-weight: bold;}


header a {text-decoration: none; color: #ffffff;}

main {grid-row-start: 3; grid-row-end: 5; grid-column-start: 3; grid-column-end: -3; text-align: center;}

main h2 {font-size: 3.5vw;}

footer {text-align: center; grid-row-start: 5; grid-row-end: 6; grid-column-start: 2;grid-column-end: -2;
; justify-content: center; align-items: center;}

#summerschedule {height: auto; width: 80%; 
                        }
.container {vertical-align: top; 
                display: inline-block; text-align: center; width: 200px;}

#rmxlogo {width: 95%; margin-top: 10px;}

#icons img {max-width: 25%; max-height: 120px;}

footer {font-weight: bold;}

@media screen and (max-width: 992px) {
        #wrapper {grid-template-columns: minmax(0px,1fr) repeat(6, minmax(0,128px)) minmax(0px,1fr);}
        header h1 {display: none;}
}    

@media screen and (max-width: 768px) {

        #wrapper {grid-template-columns: repeat(6, minmax(0,128px));}
        #homehero {display:none;}
        #redbarav {grid-row-start: 1; grid-row-end: 3;}
        nav {grid-row-start: 2; grid-row-end: 3; grid-column-start: 1;
                grid-column-end: -1;}
        header {grid-column-start: 2; grid-column-end: -2;}
        main {grid-column-start: 2; grid-column-end: -2;}
        nav a {font-size: 3vw;}
}