@charset "UTF-8";
/* CSS Document */

body{
color:#fff;
}
h1 {font-family: "Times New Roman", Times, serif;text-align:right;
font-weight:lighter;
 font-size:25px;
 letter-spacing:.2em;
 margin-bottom:10px;
}

#container {
	overflow:hidden;width:1150px;
	width: 800px;
	background-color:rgba(51/51/51/0.9);
	
           
	}
#index_header{width:250px;
padding-right:25px;
padding-top:300px;
background-color:rgba(0,0,0,1);
position:absolute;
top:0;
bottom:0;
Left:0;}
#header {margin-top:250px;width:250px;float:left;}

#mainnav {font-family:Helvetica,Geneva, san-serif;
 text-align:left;line-height:35px;
 font-weight:100;
 font-size:16px;letter-spacing: .2em;
 list-style:none;padding-left:30px;}
 #copyright {padding-left:30px;
 margin-top:400px;
 font-family:Helvetica,Geneva, san-serif;
 font-size:12px;letter-spacing: .2em;}
 
 
 #bio {width:800px;
 background-color:rgba(75,75,75,.7);
 float:left;
 margin-top:100px;
 margin-left:75px;
 font-family:Helvetica,Geneva, san-serif;
 line-height:33px;
 font-size:20px;
 font-weight:lighter;
 padding:25px;
  
 }
 p {margin-bottom:33px;}
 
 p.article {margin-bottom:16px;}
 #contact {font-size:15px;
 font-weight:lighter;letter-spacing: .2em;
 }
 
 
 #photos {width:650px;
 float:left;
 margin-top:250px;
 margin-left:50px;
 
 
  }

 
 
 

 
 .current {color:#FF9;}
 
 a:link {
	 text-decoration:none;
	 color:white;}
	 a:visited {color:white;}
	 a:hover {color:#999;}
	 a:active {color:#C03;}
	 
	 #bio a:link{color:#abcc45;}
	 #bio  a:visited{color:#abcc45;}
	 #bio  a:hover{color:#999;}
	 #bio  a:active{color:#C03;}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) {
body, html {
	padding: 0!important;
	margin: 0!important;
}
#index_header, #header {
position: static;
width: 35%!important;	
padding-bottom: 30px;
margin-left: 0!important;}

#header h1, #index_header h1 {font-size:400%;
	text-align: left;
	text-indent: 0;
	margin-left: 20px;}

#mainnav li
      {font-size:200%;
	  line-height: 200%;
	  }
  }