/*style sheet for photo_example.html */

html, body { min-height:101%; margin-bottom:1px; }/*sets a min height so ghost scrollbar appears when needed */

body {
	margin:25px 0; /*sets the body margins to zero */
	padding:0;/*zero off any padding */
	color:#666;/*sets the font colour */
	font: normal 100%/135% Verdana, Sans-serif; /*sets the font style size line height and family */
	background: #666;/*sets the body background colour */
	}
  
#page {
	padding: 0;
	margin: 0 auto;/* this centers the overall design, page div is the container div */
	width: 616px; /*sets the width of our page container div which holds the photograph */
}

#photo {
} /*leave this */
	
	
#textdiv {
	padding: 0; /*zero padding */
	margin: 0;/*zero margin */
	clear: both; /*clear div */
	background:#000;}/*sets the bg colour to black */

#bottomnav  p {/*set the styles etc for <p> element within #bottomnav div */
	padding:0 8px; 
	margin: 0;
	font-size: 65%;
	color: #F5AC08;
	}
	
	
#navigation {
	background: #000; /*sets the background colour to black */
}

#navigation a:hover{
	color:#CCC; /*font colour display on hover state */
	border: thin solid #FFF; /*border display on hover state */
	background: #8F7C6B; /*background colour display on hover state */
}

#navigation a, a:visited{
	color: #000000;/*font colour */
	text-decoration: none; /*removes default underline */
	font-weight: bold; /*sets the font weight to bold */
	font-size: 80%; /*sets the font size*/
	padding: 3px; /*a little padding*/
	margin: 5px 6px 5px 0px; /*margin top right bottom left */
	border: thin solid white; /*border display */
	background: #F5AC08; /*background colour */
}
#textdiv p{/*set the styles etc for <p> element within #textdiv div */
	color: #FFF;
	padding: 10px;
	font-size: 70%;
	margin: 3px;
}
	
img {
	border: 8px solid #ccc; /*sets the border around the photographs to be displayed */
}