* { box-sizing:border-box; } body {background-color:#FFFFFF; color:#666666; font-family: Verdana, Arial, sans-serif; background-image:linear-gradient(#eeeeee, #ffffff); background-attachment:fixed; margin:0px; } header {background-color:#BA1C21; color:#FFFFFF; font-family:Georgia, serif; grid-row:1 / 2; grid-column:2 / -2; } header h1 {line-height:240%; background-image:url("images/dsu.jpg"); height:72px; background-repeat:no-repeat; background-position:right; padding-left:0.5rem; margin:0; } header a {text-decoration:none; color:#FFFFFF; } #redbar {background-color:#BA1C21; grid-row:1 / 2; grid-column:1 / -1; } #greybar {background-color:#424242; grid-row:2 / 3; grid-column:1 / -1; } nav {font-weight:bold; background-color:#424242; position:sticky; top:0; grid-row: 2 / 3; grid-column: 2 / 8; } nav ul {list-style-type:none; margin:0; padding:0; display:flex; flex-flow: row nowrap; } nav ul li {width:100% } nav a {text-decoration:none; text-align:center; color:#FFFFFF; padding:1rem 0rem; display:block; } nav a:hover { background-color:#BA1C21 } #homehero {background-image:url("images/homehero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column: 1 / -1; } #studenthero {background-image:url("images/studenthero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column: 1 / -1; } #facultyhero {background-image:url("images/facultyhero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column:1 / -1; } main {background-color:#FFFFFF; padding: 1px 2em 1px 2em; display:block; grid-row: 4 / 5; grid-column: 2 / 8; } section {float:left; width:33%; } .clear {clear:both; } h2 {color:#424242; font-family: Georgia, serif; } dt {color:#BA1C21; font-weight:bold; } h3 {color:#BA1C21; } .dsu {color:#BA1C21; font-size:1.2em; } footer {background-color:#FFFFFF; font-size:0.7em; font-style:italic; text-align:center; padding:1em; grid-row: 5 / 6; grid-column: 2 / 8; } #wrapper {display:grid; grid-auto-rows:minmax(0px, auto); grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 175px)) minmax(0px, 1fr); } table {margin: 0 auto; border: 1px solid #424242; width: 100%; border-collapse:collapse; } td, th {padding:5px; border: 1px solid #424242; } td {text-align:center; } .text {text-align:left;} tr:nth-of-type(even) {background-color: #F3F3F3; } @media only screen and (max-width:1000px) { #wrapper {display:grid; grid-auto-rows:minmax(0px, auto); grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 150px)) minmax(0px, 1fr); } } @media only screen and (max-width:900px) { nav {font-weight:bold; background-color:#424242; position:sticky; top:0; grid-row: 2 / 3; grid-column: 1 / 5; } nav ul {list-style-type:none; margin:0; padding:0; display:flex; flex-flow: column nowrap; } #homehero {background-image:url("images/homehero.jpg"); background-size:cover; height:auto; background-position:center; background-repeat:no-repeat; grid-row: 2 / 3; grid-column: 5 / 8; } #studenthero {background-image:url("images/studenthero.jpg"); background-size:cover; height:auto; background-position:center; background-repeat:no-repeat; grid-row: 2 / 3; grid-column: 5 / 8; } #facultyhero {background-image:url("images/facultyhero.jpg"); background-size:cover; height:auto; background-position:center; background-repeat:no-repeat; 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 {line-height:240%; background-image:none; height:72px; background-repeat:no-repeat; background-position:right; padding-left:0.5rem; margin:0; text-align:center; } nav {font-weight:bold; background-color:#424242; position:sticky; top:0; grid-row: 2 / 3; grid-column: 1 / 9; } #homehero {background-image:url("images/homehero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column: 1 / -1; display:none; } #studenthero {background-image:url("images/studenthero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column: 1 / -1; display:none; } #facultyhero {background-image:url("images/facultyhero.jpg"); background-size:cover; height:300px; background-position:center; background-repeat:no-repeat; grid-row: 3 / 4; grid-column:1 / -1; display:none; } }