body {
	background-color: #FFFFFF;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 76%;
}


  /*Gallery Items */
  
    /* The containing box for the gallery. */
#container {
	position:relative;
	height:485px;
	margin:5px auto 0 auto;
	text-align: center;
    }

/* Removing the list bullets and indentation */
#container ul {
	list-style-type:none;
    }

/* Remove the images and text from sight */
#container a.gallery span {
	position:absolute;
	width:0px;
	height:0px;
	top:112px;
	overflow:hidden;
	left: 52px;
    }
	

	/* Thumbnail area */
	
#container a.gallery, #container a.gallery:visited {
    display:block; 
    color:#FFFFFF; 
    text-decoration:none; 
    border:1px solid #737E81; 
    margin:1px; 
    text-align:left; 
    cursor:default;
    }

/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
	width:100%;
	height:88px;
	/* move the thumbnails into the correct position */	    
	margin:525px 0 0 0;
	float:left;
	padding: 10px 45px 10px 77px;
	background-color: #737E81;
	text-align: center;
    }
	
#container li {
	float:left;
    }
	

	
	/* change the thumbnail border color */
#container a.gallery:hover {
    border:1px solid #D8B7F9; 
    }
	
	/* styling the :hover span */
#container a.gallery:hover span {
	position:absolute;
	width:700px;
	height:477px;
	top:10px;
	left:75px;
	background:#fff;
    }




	/* Gallery Page Footer elements  */

#links {
	margin: 1em 0 0 0;
	font-size: 92%;
	font-weight: bold;
}
#footer #copyright {
	text-align: center;
	margin: 1em 0 0 0;
}

#footer {
	width: 625px;
	text-align: center;
}


#currentpage {
	font-size: 130%;
	font-weight: bold;
}
	/* END Gallery Page Footer elements  */



/* Arrows  */
#arrowright a  {
	display:inline;
	width: 18px;
	height: 15px;
	background-repeat: no-repeat;
	position: absolute;
	margin: 3.5em 0 0 .5em;
	background-image: url(images/arrow-r3.gif);}

#arrowright a:hover, #arrowright a:active { 
background-position: 0 -15px;
}

#arrowleft a  {
	display:inline;
	width: 18px;
	height: 15px;
	background-repeat: no-repeat;
	position: absolute;
	margin: 3.5em .7em 0 0;
	left: 51px;	
	background-image: url(images/arrow-l3.gif);
}

#arrowleft a:hover, #arroweft a:active { 
background-position: 0 -15px;
}
/* END Arrows  */

#frame {
	width:720px;
	margin-right:auto;
	margin-left:auto;
	margin-top:10px;
	padding:0px;
	text-align:left;
	margin-bottom: 2em;
		}
		

#contentheader {
	margin-bottom: 2.5em;
	margin-top: 2em;
		}
		

	/* STRIPPING */
			
/* link underlines tend to make hypertext less readable, 
   because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none }

/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none }

/* avoid browser default inconsistent heading font-sizes */
/* and pre/code too */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

/* remove the inconsistent (among browsers) default ul,ol padding or margin  */
/* the default spacing on headings does not match nor align with 
   normal interline spacing at all, so let's get rid of it. */
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
/* form elements are oddly inconsistent, and not quite CSS emulatable. */
/*  nonetheless strip their margin and padding as well */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }