/* Reset
------------------------------------------------------------ */
* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { background:#ffffff; font-size: 13px; color: #666666; font-family: Arial, helvetica, sans-serif;}
ol, ul { list-style: none; margin: 0;}
ul li { margin: 0; padding: 0;}
h1 { margin-bottom: 0px; color: #111111;}
h2 {color: #121212;}
h3 {color: #121212;}	
a, img { outline: none; border:none; color:  #404040; font-weight: bold; text-transform: none;}
p { margin: 0 0 10px; line-height: 1.4em; font-size: 1.2em;}
img { display: block; margin-bottom: 0px;}
aside { font-style: italic; font-size: 0.9em;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display: block;
	}





/* center align image */
img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }

/* photo credit line */
	div.figure {
  float: left;
  width: 55%;
  border:  0px silver solid; 
  margin: .5em .5em .5em -0.5em;
  padding: 0.5em;
}
div.figure p {
  text-align: left;
  font-style: italic;
  font-size: 0.9em;
  text-indent: 0;
}

div .figure2  {
  text-align: right;
  font-style: italic;
  font-size: 0.85em;
  text-indent: 0;	
}

	
/* Structure */
#wrapper {
	width: 96%;	
	max-width: 920px;
	margin: auto;
	padding: 2%;
	} 

	#main {
		width: 60%;
		margin-right: 5%;
		float: left;
		}		
		
	aside {
		width: 35%;
		float: right;
		}

#footer { 
		margin-bottom: 15%;
		}
		
#footer img { 
		display:inline;
		padding:5% 0% 10%;
		 } 


		
/* Logo H1 */
header h1 {
    
}
	
/* increase span in H3 */
span {
  display: block;
  font-size : 1.3em;
}
		
/* Nav */
header nav {
	float: right;
	margin-top: 40px; 
	}
	
	header nav li {
		display: inline;
		margin-left: 15px;
		}

#skipTo {
	display: none;
	}
	#skipTo li {
		background: #efefef;             /* #b1fffc; */
		}

/* Menu on hover for ?php $page='' tag     note: effects all a:hover */
 a:hover,   .active  {
	color: #808080;
}



/* Banner */			
#banner {
	float: left;
	margin-bottom: 15px;
	width: 100%;
	}

	#banner img {
		width: 100%;
		}

/* Content */			
#content {
	float: left;
	margin-bottom: 15px;
	width: 100%;
	}

	#content img {
		width: 100%;
		}


/* Media Queries */
@media screen and (max-width: 480px) {

	#skipTo {
		display: block;
		}
	
	header nav, #main, aside {
		float: left;
		clear: left;
		margin: 0 0 10px; 
		width: 100%;
		}	
		header nav li {
			margin: 0;
			background: #efefef;
			display: block;
			margin-bottom: 3px;
			}
			header nav a {
				display: block;
				padding: 10px;
				text-align: center;
				}			
}