body {
      background-color:#FFFFFF;
      color:#666666;
      font-family: Verdana, Arial;
      background: linear-gradient(#eeeeee, #ffffff);
        background-attachment: fixed;
        margin:0px;
    }
   header {
     background-color:#BA1C21;
      color:#FFFFFF;
     font-family:Georgia;
     grid-row:1/2;
        grid-column:2/-2;

   }

   h1{  background-image: url(dsu.jpg);
    background-repeat: no-repeat;
    background-position: right;
    padding-left: .5em;
     height: 72px;
    line-height:240%;
    margin:0;
}

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

    h3{color: #BA1C21;}

    nav{
      background-color: #424242;
      margin-bottom: 0px;
      margin-top:0px;
      font-weight: bold;
     position: sticky;
      top:0px;
      list-style: none;
      grid-row:2/3;
        grid-column:2/-2;
        text-align:center;
      display:inline-block;
    }
   nav a{ color:#FFFFFF;
        text-decoration: none;
       padding: 1em 0;
        display: block;
    }

  nav ul{ list-style-type: none;
    flex-flow:row nowrap; display:flex;
    padding:0px; margin: 0px;
  }

  nav ul li {width: 100%;}

  nav a:hover {background-color:#BA1C21;}

  .homehero header,main,footer{
    margin-left: 150px;
  }

    h2{color:#424242;
    font-family:Georgia;}

    dt{color:#BA1C21;
    font-weight:bold;}

      .dsu {color:#BA1C21;
      font-size: 1.2em;
      padding:1em;
    }
     main{ padding-left:0em;
        padding-right:0em;
        display:block;
        background-color: #FFFFFF;
        padding-top: 2px;
        padding-bottom: 1px;
        grid-row:5/6;
        grid-column:2/-2;
}

* { box-sizing: border-box; }

     #wrapper {
      display:grid;
      grid-auto-rows:minmax(0px,auto);
      grid-template-columns:minmax(0px,1fr)minmax(0, 175px)
      minmax(0, 175px)minmax(0, 175px)minmax(0, 175px)
      minmax(0, 175px)minmax(0, 175px)minmax(0px, 1fr);

      }

      #redbar{background-color: #BA1C21;
        grid-row:1/2;
        grid-column:1/-1; }

      #greybar{background-color: #424242;

        grid-row:2/3;
        grid-column:1/-1;}

      footer{font-size: .70em;
      text-align: center;
      font-style: italic;
      background-color: #FFFFFF;
      ;}

    .homehero { height: 300px;
      background-image:url("homehero.jpg");
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      grid-row:3/4;
        grid-column:1/-1;
    }
      
      .studenthero { 
      background-image:url("studenthero.jpg");
        height: 300px;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      grid-row:3/4;
        grid-column:1/-1;
      }

      .facultyhero { 
        background-image:url("facultyhero.jpg");
        height: 300px;
        background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      grid-row:3/4;
        grid-column:1/-1;
    }

      @media{
      section { float:left;
      width:33%;
      padding-right: 1rem; }}

      .clear{ clear:both; }

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

.wrapper{grid-template-columns:minmax(0, 150px)minmax(0, 150px)
  minmax(0, 150px)minmax(0, 150px)minmax(0, 150px)minmax(0, 150px);}
}

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

nav{grid-row:2/3;
        grid-column:1/5;}

nav ul{flex-flow:column nowrap;}

  .homehero{grid-row:2/3;
        grid-column:5/8;
        height:auto;
  }
  .studenthero{grid-row:2/3;
        grid-column:5/8;
      height:auto;
    }
  .facultyhero{grid-row:2/3;
        grid-column:5/8;
      height:auto;
    }
    section{ float:none;
    width:100%;
    padding-right: 0px}
}
@media only screen and (max-width: 600px){
  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}
}