/* CSS Document */
body {background-color:#000234;}
	#wrapper { width:100%; color:#33CCFF; font-family: Arial, Helvetica, sans-serif; }
	
		#header { width:90%; margin: 0 auto;  height:6em; background-image: url(../images/sherry_camhy_artist36pts.jpg); 
		background-repeat:no-repeat; background-position:center; }
	
			#branding { margin-left:auto; margin-right:auto; background-color:#FFFFFF; visibility:hidden;
			width:6em;
			height:2em;
			padding:0.15em;
	/*position:absolute; top:10px; left:10px;*/
			text-shadow: 2px 2px 2px #000;
			-moz-2px 2px 2px #000;
			-webkit-2px 2px 2px #000;
			-moz-border-radius: 10px;
			border-radius: 10px;
			box-shadow: 10px 10px 5px #888;
			-moz-box-shadow: 10px 10px 5px #888;
			-webkit-box-shadow: 10px 10px 5px #888;  }
			#branding { font-size:250%; margin-top:.2em; }
			#branding div h3 { font-size: 75%; color:green; position:relative; top:1.2em; left:.6em;}
				#sherry { float:left; z-index:3; position:absolute; }	
				#camhy { float:right; color:red; position:relative; top:.7em; left:-.3em; z-index:2;}
	
	
	/* previous and next navigation buttons */
			ul#section_navigation { list-style-type:none; visibility:hidden;  }
			ul#section_navigation { position: relative; top:-2em; }


			ul#section_navigation li a { display: block; width: 5em; border-radius: 6px; 
			-moz-border-radius: 6px; 
			-webkit-border-radius: 6px; 
			font-size:100%; 
			color:#000;
			text-shadow: 1px 1px 1px white;  
			background: -moz-linear-gradient(top,  #ccc,  #000);
			background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000));
							/*	background-color:#000234;*/
			padding: .2em .5em .5em .2em; text-align:center; text-decoration:none; }
			ul#section_navigation li a:hover { color:#000;
			border-radius: 6px; 
			-moz-border-radius: 6px; 
			-webkit-border-radius: 6px; 
			background: -moz-linear-gradient(top,  #000,  #ccc);
			background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#ccc));
	 		background-color:#fff; }
			ul#section_navigation .left { float:left; width:5em;  top:2em; }
			ul#section_navigation .right { float:right; width:5em;  top:2em; }	
	
			ul#section_navigation li a { background-color:#666666; color:#000; } 
			ul#section_navigation li a:hover { background-color:#999999; color:#000; } 
	
			ul#temp { list-style-type:none;  }
			ul#temp { position: relative; top:1em; }
			ul#temp li a { display: block; width: 5em; font-size:75%; 
			color:#33CCFF; text-decoration:none; } 
			ul#temp .left { float:left; width:5em;  top:1em; text-align:center; }
			ul#temp .right { float:right; width:5em;  top:1em; text-align:center; }	
			ul#temp li a:hover { color:#000234; background-color:#33ccff; }

	
	
	#header { border-bottom:#33CCFF solid 1px; }
	
	/* give content text some space with padding 
	use auto margin to center in wrapper
	*/
	#content { width:80%; margin:auto; padding:.5em; height: auto; }
	/**/
		#page_titles { font-size:75%; text-align:center; }
		.thumbnail { width:auto; height:auto;  padding:1em 1em 1em 1em; 
		margin-right:1em; margin-left:auto;}
	#left { float:left; }
	#right { float:right; }
	#single { float:none; }

	
	/* increase text size for each list title */
	div h4 { font-size:110%; }
	
		#content div ul { padding-top:.5em; table-layout:auto; }
	#center { margin-left:10%; margin-right:10%;  }
			/*#center { clear:both; width:100%; margin:auto;  margin-left:1em; } /* give explict width = width collections + w reviews + w awards + margins + padding*/
		/*	#center {  } /* give explict width = width collections + w reviews + w awards + margins + padding*/

		/* clear floats to allow footer to position in page flow below floated div content,
	 give width and margins to center in wrapper
	 move text away from content div with padding */
	#footer { clear:both; width:90%; border-top:#33ccff solid 1px; margin:auto; margin-top:1em;  }

	/* reduce size of text in footer */
		#copyright { font-size:60%; padding:5em; }
		#contact { font-size:60%; padding:5em; position:relative; top:auto; text-align:center; }

	
@media screen and (max-width: 600px) {
	#content, #center { width:100%; margin:auto; padding:1em; margin-top:1em; height:auto; }
	#wrapper, ul#section_navigation .left, ul#section_navigation .right, .thumbnail { 
		float:none;		
	}
	ul#section_navigation .left, ul#section_navigation .right { margin-top:1em; margin-bottom:1em; }

	.thumbnail { width:50%; margin-top: 3em; margin-right:386px; }
 
	
}