h1 {
    color:#F3F3F3;
    font-size: 20px;
    font-family: verdana;
    font-weight: bold;
    text-align: left;
    padding:.5rem ;
    line-height: 140%;
    background-color:#003058; 
    border: 3px  #003058 solid;
    padding-left:1em;
    background-origin: content-box;
    margin:0;
    
    
    }


a {
     
     
     font-weight: bold;
     outline:none;
     
     
     
   }   

h2 {
    text-indent: 1px;
    text-align:left;
    color:#424242;
    font-weight: bold;
    font-size:medium;
    }

nav {
    top:0;
    position:sticky;
    background-color:#424242;
    grid-row: 2 / 3;
    grid-column: 2 / -2;
    list-style: none;

    }

nav ul{
    margin:0px;
    padding:0px;
    display:flex;
    flex-flow:row, nowrap;
    list-style-type:none;
}

nav ul li{
    width:100%;
   
   }
nav a{
    text-decoration-line:none;
    color:#ffffff;
    padding:1rem 0;
    display:block;
    text-align:center;
    margin:0px;
   }
nav a:hover{
    background-color:#BA1C21;
}
.text-#38184 {
    color:#666666;
}
p {
  color:#666666;
  
  
  
} 



 #wrapper {
    display:grid;
    grid-auto-rows:minmax( 0px, auto);
    grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 175px)) minmax(0px, 1fr);


    
}
li {
    color:#666666;
    font-size:small

}

footer{
 color:#666666;   
 text-align: center;
 font-size: .70rem; 
 grid-row:5 / 6;
 grid-column:2 / -2;
}
body{
    Font-family: verdana, ariel, sans-serif;
    background: linear-gradient(to bottom, #eeeeee #ffffff);
   
    
    
}
.special{
    
    color:#BA1C21;
    font-family: verdana;
    font-weight: bold;
    
    

}

dt{
    color:#003058;
    font-weight: bold;
    
   
    

}

div{
    color:#666666;
    font-size: small;
    

}
dd{
 color:#666666;
 


}

main{
    grid-row: 4 / 5;
    grid-column: 2 / -2;
    background: #ffffff;
    
}


main img{
width:300px;
float: right;
padding-left:2rem;


}
#homehero{
background-image: url('images/homehero.jpg');
height:300px;
background-size:cover;
background-repeat:no-repeat;
background-position: 20% 50%;
grid-row: 3 / 4;
grid-column: 2 / -2;

}

#studenthero{
background-image: url('images/studenthero.jpg');
background-size:cover;
height:300px;
background-repeat:no-repeat;
background-position: 20% 50%;
grid-row: 3 / 4;
grid-column: 2 / -2;
}


h3 {
    color:#003058;
    font-weight: bold;
    

}

#facultyhero{
background-image: url('images/facultyhero.jpg');
background-size:cover;
height:300px;
background-repeat:no-repeat;
background-position: 20% 50%;
grid-row: 3 / 4;
grid-column: 2 / -2;
}
   
#alumnihero{
background-image: url('images/alumnihero.jpg');
background-size:cover;
height:300px;
background-repeat:no-repeat;
background-position: 20% 50%;
grid-row: 3 / 4;
grid-column: 2 / -2;
}







header h1 {
    background-image: url('images/utahtechlogo.svg');

        background-repeat:no-repeat;
        padding-left: 1em;
        background-origin:content-box;
        Margin-bottom:0;
        background-position: right;
        
        
}

*{
box-sizing:border-box;


}
header{
    grid-row: 1 / 2;
grid-column: 2 / -2;
}




nav{
    grid-row: 2 / 3;
    grid-column: 2 / -2;
}





#body{
    margin:0px;
    
}

header a{
text-decoration: none;
color: #ffffff;
}



#bluebar {
    background-color: #003058; 
    grid-row: 1 / 2;
    grid-column: 1 / -1;
}

#greybar {

  background-color: #424242;
  grid-row: 2 / 3;
  grid-column: 1 / -1;  
}

form{

    display:grid;
    grid-auto-rows: minmax(0, auto);
    grid-template-columns: 200px 1fr;
    grid-gap:.75rem;
    margin-top:50px;
    width:100%;
}
input, textarea{
    font-size:1rem;
    padding:10px;
    color:#666666;
    background-color:#fafafa;
    border:0px;

}

input:focus, textarea:focus{
    outline:none;
    background-color:#f0f0f0f0;
}

label{
    padding:10px;
    text-align:right;
}

#mySubmit{
    width:10rem;
    grid-column: 2 / 3;
}
table{
    margin:0auto;
    border:1px solid #424242 ;
    width:100%;
    border-collapse:collapse;
}
td, th {
    padding:5px;
    border: 1px solid #424242;    
    text-align: center;
     

}
.text{
    text-align:left;
}
tr:nth-of-type(even){
    background-color: #F3F3F3;
}
@media screen and (max-width:1100px){
    #wrapper{
        grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 150px)) minmax(0px, 1fr); 
    }
}

@media screen and (max-width:900px){
    nav{
        grid-row: 2 / 3;
        grid-column: 1 / 5;
        
        position:static;
}
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;
}
#alumnihero{
    grid-row: 2 / 3;
    grid-column: 5 / 8;
    height: auto;

}
section{
    float:none;
    width:100%;
    padding-right:0px;
}

}

@media 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;
}

