body {
font-family: Georgia, Georgia, serif; /*Use a common set for the body*/
font-size: large;
background: #ededed url('../img/wallpaper5b_01.png') repeat top left;
}

.container {
background: #ffffff repeat-y top left;
padding-right: 5px;
padding-left: 5px;
padding-bottom: 40px;
}

#header{
background: #ffffff url('../img/adrisite_header.png') no-repeat top left;
width: 950px;
height: 200px;
}

#header span {
display: none;
}

#sp-welcome {
background: #ffffff url('../img/adrisite_main.png') no-repeat top left;
width: 900px;
height: 735px;
}

#sp-welcome a {
display: none;
}

#sp-nav {
	height: 228px;
	position: absolute;
	left: 730px;
	top: 510px;
	width: 313px;
}

#sp-nav ul{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

#sp-nav ul li {
	float: left;
	text-align: center;
	}

#sp-nav a
	{
	display: block;
	text-decoration: none;
	}
/*Assign the image as the a's background element. Use a nested span element to hide the text. Set element to image size.
Images (both rollovers and backgrounds should all be same height!) Use padding in the sp-nav ul li to space the images.*/
	
#sp-nav #home a {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/home.png') no-repeat top left;
	width: 127px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
}

#sp-nav #work a {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/work.png') no-repeat top left;
	width: 126px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
}

#sp-nav #about a {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/about.png') no-repeat top left;
	width: 148px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
	}
	
	/*Add the Hover!*/
	
	#sp-nav #home a:hover {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/homeroll.png') no-repeat top left;
	width: 127px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
}

#sp-nav #work a:hover {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/workroll.png') no-repeat top left;
	width: 126px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
}

#sp-nav #about a:hover {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/aboutroll.png') no-repeat top left;
	width: 148px;
	height: 80px;
	padding-right: 20px;
	padding-left: 20px;
	}
	
	#sp-nav #enter a {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/enter.png') no-repeat top left;
	width: 272px;
	height: 227px;
	padding-right: 20px;
	padding-left: 20px;
	}
	
	/*Add the Hover!*/
	
	#sp-nav #enter a:hover {
	display: block;
	text-decoration: none;
	background: #ffffff url('../img/enter_roll.png') no-repeat top left;
	width: 272px;
	height: 227px;
	padding-right: 20px;
	padding-left: 20px;
}
#sp-nav span {
display: none;
}

/*Adjust Header Height*/
#head {
background-color: #ffffff;
}

/*Begin the Navigation Code*/
#nav {
position: relative;
margin-left: auto;
margin-right: auto;
width: 400px;
top: -78px;
}

li#crumb {
font-size: 1.2em;
margin-right: 20px;
}

#nav ul{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	display: inline;
}

#nav ul li {
display: inline;
list-style: none;
padding-left: 10px;
padding-right: 10px;
	}

#nav a
	{
	text-decoration: none;
	color: #000000;
	text-transform: lowercase;
	font-size: 1.2em;
	}
	
#nav a:hover {
border-bottom: 4px solid #ff99cc;
}

#here a {
border-bottom: 4px solid #ff99cc;
}

#home a {
	text-decoration: none;
	color: #000000;
	text-transform: lowercase;
	font-size: 1.2em;
	position: relative;
	left: 400px;
	top: 20px;
}

#home a:hover {
border-bottom: 4px solid #ff99cc;
}


/*Bio's home page link*/
#home2 a {
	text-decoration: none;
	color: #000000;
	text-transform: lowercase;
	font-size: 1.2em;
	position: relative;
	left: 415px;
	top: 20px;
}

#home2 a:hover {
border-bottom: 4px solid #ff99cc;
}

.bio p {
text-align: right;
padding-right: 25px;
}

.bio li {
text-align: right;
padding-bottom: 10px;
list-style-type: none;
}

.bio li a {
	text-decoration: none;
	color: #000000;
	font-size: 1.2em;
}

.bio li a:hover {
border-bottom: 4px solid #ff99cc;
}
/*Assign the image as the a's background element. Use a nested span element to hide the text. Set element to image size.
Images (both rollovers and backgrounds should all be same height!) Use padding in the nav ul li to space the images.*/

/*Copyright date is something that will change. It's probably better to use text for this instead of an image.*/
#footer {
padding-top: 15px;
padding-bottom: 0;
}

#footer p {
margin-left: auto;
margin-right: auto;
width: 330px;
font-size: .7em;
}

a.back {
position: relative;
top: 175px;
}

a.forward {
position: relative;
top: 175px;
}

.panel-overlay h4 {
font-size: 1.1em;
padding-top: 3px;
color: #ffffff;
line-height: 1;
margin: 0;
padding-bottom: 0;
}

.panel-overlay p {
font-size: .9em;
margin-top: 8px;
padding: 0;
line-height: 1;
margin-bottom: 0;
}

ul.filmstrip {
display: inline;
}

ul.filmstrip li {
display: inline;
list-style: none;
}