* { box-sizing: border-box; }
    
    body { 
        font-family: arial, verdana;
        background-attachment: fixed;
        background:linear-gradient(to bottom,#eeeeee, #ffffff);
        margin:0px;

    }
     header { background-color:#003058; color: #FFFFFF;
        font-family: georgia;
        grid-column:2/8;
        grid-row:1/2;
    }
    header a {
        text-decoration:none;
        color:#fff;
    }
     header h1 {
        
        line-height:140%;
        padding: .5rem;
        background-image:url("utahtechimages/utahtechlogo.svg");
        background-repeat:no-repeat;
        background-position:right;
        padding-left:1em;
        background-origin: content-box;
        margin:0;
    }
     nav {background-color:#424242;
        font-weight:bold;
        position:sticky;
        top:0;
        grid-column:2/-2;
        grid-row:2/3;
    }
    nav ul{
        list-style-type:none;
        margin:0;
        padding:0;
        display:flex;
        flex-flow: row;
        flex-flow: nowrap;
    }
    nav ul li{
        width:100%;
    }
    nav a { text-decoration: none; 
    color:#fff;
    padding:1rem 0rem;
    display:block;
    text-align: center;
    }
    nav a:hover {
        background-color:#BA1C21;
    }
     h2 {color:#424242;
        font-family: georgia;
     }

    dt {color:#003058;
        font-weight: bold;
    }
    .ut {color:#BA1C21; 
        font-weight: bold;
    }
    h3 {color:#003058;
    }
    footer {font-size:.70rem;
        font-style:italic;
        text-align:center;
        padding:1rem;
        grid-column:2/-2;
        grid-row:5/6;
    }
    #wrapper {
        display:grid;
        grid-auto-rows:minmax(0px,auto);
        grid-template-columns:minmax(0px,1fr) repeat(6, minmax(0,175px)) minmax(0px,1fr);
    }
    main { padding-left:2rem;
        padding-right:2rem;
        background-color:#fff;
        grid-column:2/-2;
        grid-row:4/5;
    }
    main img {
        float:right;
        padding-left:2rem; 
    }
    form{
        display:grid; 
        grid-template-rows: auto;
        grid-template-columns: 200px 1fr;
        grid-gap: 0.75rem;
        width: 100%;
    }
    input, textarea {
        font-size: 1rem;
        padding:10px;
        color:#666666;
        background-color:#fafafa;
        border:none;
    }
    input:focus, textarea:focus {
        outline:none;
        background-color:#f0f0f0
    } 
    label{
        padding:10px;
        text-align:right;
    }

    #mySubmit {
        width:10rem;
        grid-column:2/3;
    }
    
#homehero { 
        background-image: url("utahtechimages/homehero.jpg");
        height:300px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        grid-column:2/-2;
        grid-row:3/4;
    }
    #studenthero { 
        background-image: url("utahtechimages/studenthero.jpg");
        height:300px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        grid-column:2/-2;
        grid-row:3/4;
    }
    #facultyhero { 
        background-image: url("utahtechimages/facultyhero.jpg");
        height:300px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        grid-column:2/-2;
        grid-row:3/4;
    }
    #alumnihero { 
        background-image: url("utahtechimages/alumnihero.jpg");
        height:300px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        grid-column:2/-2;
        grid-row:3/4;
    }
    #bluebar {
        background-color:#003058;
        grid-row:1/2;
        grid-column:1/-1;
    }
    #greybar {
        background-color:#424242;
        grid-row:2/3;
        grid-column:1/-1;
    }

    @media only screen and (max-width: 1100px){
        #wrapper {
            grid-template-columns:minmax(0px,1fr) repeat(6, minmax(0,150px)) minmax(0px,1fr);
        }
    }

    @media only screen and (max-width: 900px){
       nav {
            position:static;
           grid-row:2/3; 
           grid-column:1/5;
        }
        nav ul{
            flex-flow: column nowrap; 
        }
         #homehero { 
            height:auto;
            grid-row:2/3;
            grid-column:5/8;
        }
        #studenthero { 
            height:auto;
            grid-row:2/3;
            grid-column:5/8;
        }
        #facultyhero { 
            height:auto;
            grid-row:2/3;
            grid-column:5/8;
             }
        #alumnihero { 
            height:auto;
            grid-row:2/3;
            grid-column:5/8;
             }     

        section {
            float:none;
            width:100%;
            padding-right:0px;
        }
    }
    @media only screen and (max-width: 600px){
        header h1 {
            background-image:none;
            text-align:center;
        }
        nav {
            grid-row:2/3;
            grid-column:1/-1;
        }
        #homehero { 
            display:none;
        }
        #studenthero { 
            display:none;
        }
        #facultyhero { 
            display:none; }
        #alumnihero { 
            display:none; }
    }
    main p, label {
        color:#666666
    }