* {
   box-sizing: border-box;
}
body {
      background-color: #FFFFFF; 
	  color: #666666;
	  font-family: Verdana, "Times New Roman", sans-serif;
	  background-image: linear-gradient(to bottom,#EEEEEE,#FFFFFF);
	  background-attachment: fixed;
}

header {
	    background-color: #BA1C21;
	    color: #FFFFFF;
	    font-family: Georgia, serif;
	    display: block;
}

h1 {
	line-height: 240%;
	background-image: url(dsu.jpg);
	background-repeat: no-repeat;
	background-position: right;
	padding-left: 1em;
	line-height: 72px;
	margin-bottom: 0;
}

nav {
	font-weight: bold;
	padding-top: 20px;
	padding-right: 5px;
    padding-left: 20px;
    margin-top: 0;
    float: left;
    width:160px;
    display: block;
}

main {
	  padding-left: 2em;
	  padding-right: 2em;
	  display: block;
	  background-color: #FFFFFF;
	  margin-left: 170px;
	  padding-top: 1px;
	  padding-bottom: 1px;
	  display: block;
}


h2 {
	color: #424242;
	font-family: Georgia, serif;
}

h3 {
	color:#BA1C21;
}

dt {
	color: #BA1C21;
	font-weight: bold;
}

.dsu {
	  color: #BA1C21;
	  font-size: 1.2rem;
}

footer {
	    font-size: 0.70rem;
	    font-style: italic;
	    text-align: center;
	    padding: 1em;
	    background-color: #FFFFFF;
	    margin-left: 170px;
	    display: block;
}

#wrapper {
	      background-color: #424242;
	      width: 80%;
	      margin-left: auto;
	      margin-right: auto;
          min-width: 700px;
          max-width: 1024px;
          box-shadow: 0px 3px 3px rgba(66,66,66,0.3);
}

#homehero{
	       background-image: url(stadiumhero.jpg);
	       height: 300px;
	       background-size: cover; 
	       background-repeat: no-repeat;
	       margin-left: 170px;
}

#studenthero{
	         background-image: url(studenthero.jpg);
	         height: 300px;
	         background-size: cover;
	         background-repeat: no-repeat;
	         margin-left: 170px;
}

#facultyhero{  
	         background-image: url(facultyhero.jpg);
	         height: 300px;
             background-size: cover;
	         background-repeat: no-repeat;
	         margin-left: 170px;
}

label {
       float: left;
       display: block;
       width: 10em;
       padding-right: 1em;
}

input, textarea {
                 display: block;
                 margin-bottom: 1em;
}

#mySubmit {
           margin-left: 10em; 
}

nav a {
	   text-decoration: none;
       transition-timing-function: ease-out;
       transition-duration: 0.5s;
}

a:link {
	    color:#000033;
}

a:visited {
	       color: #CCCCCC;
}

a:hover {
	     color: #CCCCCC;
}

nav ul li {
	    list-style-type: none;
	    margin: 0;
	    padding-left: 0; 
}

#mobile {
         display: none;
}

#desktop {
          display: inline;
}

table {
       border: 1px solid #424242;
       width: 90%;
       border-collapse: collapse;
}

td, th {
        padding: 5px;
        border: 1px solid #424242;
}

td {
    text-align: center;
}

.text {
       text-align: left;
}

video{
      float: right;
      margin-left: 2em;
}

tr:nth-of-type(even){
                     background-color: #F3F3F3;
}

@media only screen and (max-width:1024px){
    body {
          margin: 0;
          padding: 0;
          background-image: none; 
    }
    
    #wrapper {
             width:auto;
             min-width: 0;
             margin: 0;
             box-shadow: none;
    }
    
    h1 {
        margin:0;
    }
    
    nav{
        float: none; 
        width: auto;
        padding: 1em 1em;
    }
    
    nav li{
           display: inline-block;
    }
    
    nav a{
          padding-right: 2em;
    }
    
    main{
         padding: 1em;
         margin-left: 0;
         font-size: 90%;
    }
    
    footer{
           margin: 0;
    }
    
    #homehero{
              margin-left: 0;
    }
    
    #studenthero{
                 margin-left: 0;
    }
    
    #facultyhero{
                 margin-left: 0;
    }
}

@media only all and (max-width: 768px){
    h1{
       height: 100%;
       font-size: 1.3em;
       padding-left: 0.3em;
    }
    
    nav{
        padding: 0;
    }
    
    nav a{
          display:block;
          padding:0.2em;
          font-size: 1.1em;
          border-bottom-style: solid;
          border-bottom-width: 1px;
          border-bottom-color: #FFFFFF;
    }
    
    
    nav ul{
           padding:0;
           margin:0;
    }
    
    nav li{
           display:block;
           padding:0;
           margin:0;
    }
    
    main{
         padding-top: 0.1em;
         padding-right: 0.6em;
         padding-bottom: 0.1em;
         padding-left: 0.4em;
    }
    
    #homehero{
              display: none;
    }
    
    #studenthero{
                 display: none;
    }
    
    #facultyhero{
                 display: none; 
    }
    
    footer{
           padding: 0;
    }
    
    #mobile{
            display: inline;
    }
     #desktop{
             display:none; 
    }
    video{
          float: none;
          margin: 0em;
    }
    
}