/* Galleries Styles */


.motioncontainer a img {
border: 1px solid #cccccc; /* Set image border color */
}

.motioncontainer a:hover img {
border: 1px solid navy; /* Set image border hover color */
}

.statusdiv {
background-color: lightyellow;
border: 1px solid gray;
padding: 2px;
position: absolute; /* Stop Editing Gallery Styles */
left: -300px;
visibility: hidden;
}

.motioncontainer a:hover {
color: red; /* Dummy definition to overcome IE bug */
}

/*Note: To style an individual gallery, you can use these same above class
selectors as id selectors, appending the number of the gallery, ex:*/

#motioncontainer0 a img {
/*border: 5px solid #ee0000;  /*Set image border for 1st gallery (uncomment to use this style)*/
}

/*The galleries are numbered 0 to however many you have minus 1*/

/* End Galleries Styles */
#thumbBox{ /*Outermost DIV for thumbnail viewer*/
position: absolute;
left: 0;
top: 0;
width: auto;
padding: 10px;
padding-bottom: 0;
background: #313131;
visibility: hidden;
z-index: 10;
cursor: hand;
cursor: pointer;
}

#thumbBox .footerbar{ /*Footer DIV of thumbbox that contains "close" link */
font: bold 16px Tahoma;
letter-spacing: 5px;
line-height: 1.1em;
color: white;
padding: 5px 0;
text-align: right;
}


#thumbBox #thumbImage{ /*DIV within thumbbox that holds the enlarged image */

background-color: white;

}

#thumbLoading{ /*DIV for showing "loading" status while thumbbox is being generated*/
position: absolute;
visibility: hidden;
border: 1px solid black;
background-color: #EFEFEF;
padding: 5px;
z-index: 5;

body {
	text-align: center;
	background-color: #e3e3e3;
}

#wrapper {
	width: 720px;
	margin: 0px auto;
	text-align: left;
	background-color: #ffffff;
	padding: 20px;
}

#viewer {
	text-align: center;
	
	border: 2px solid #e3e3e3;
	margin-top: 20px;
	clear: both;

}

#viewer img {
	margin: 10px;

}

#navigation {
	width: 100%;
	background-color: #e3e3e3;
	margin-bottom: 50px;
}

li {
	list-style: none;
	padding-right: 30px;
	float: left;
}