#wrapper{
max-width:960px;
margin:0 auto;
height:100%; 
overflow:auto;
    
}

body{
font-family: 'Ubuntu', sans-serif;
}



header{
width:100%;
height:110px;
background-color:steelblue;
position:fixed;    
top:0;
z-index:30;
left:0;    
}

nav{
width:500px;
height:40px;    
margin:0 auto;
margin-top:50px;
    
}
ul{
list-style:none;
    
}

.name{
text-align:center; 
}

.info{
font-weight: normal;
    
}
.bio{
font-size: 20px;
}


li{
color:white;
display:inline;
font-size:25px;
width:30px;
height:30px;
/*background-color:teal;*/
border-radius: 75px;    
}


.space{
margin-left:60px;    
}

.logo{
float:left;
margin-left: 20px;
margin-top: 5px;
}

.mugshot{
margin:0 auto;
display:block;
    
}

#landingpage{
margin-top: 175px;   
width:960px; 
   
    
}


#portfolio{
width:100%;
height:auto;    
margin-top:150px;
   
}


.posterpara{
text-align:center;
margin-top:50px;    
}

.postertitle{
text-align:center;    
margin-top:150px;    
}


footer{
width:100%;
height:50px;
background-color:steelblue;
position:fixed;
clear:both;
bottom:0;
left:0;
color:white;    
}

.contact{
font-size: 50px;
}

.name{
font-size: 38px;
}
.details{
font-size: 30px;
}
#contactpage{
width:100%;
height:500px;
background-color:lightblue;    
clear:both;
display:inline-block;
padding-top: 100px;
}


a.view{
color:white;    
}

a.view:link{
text-decoration:none;    
}

a.view:visited{
color:white;    
}

a.view:hover{
    color:darkgray;
}





@media screen and (max-width:983px){
    
    #wrapper{
    width:100%;    
    }    
    
    #landingpage{
    width:100%;    
    }
    
    
    
}