html, body {
margin: 0;
padding: 0;	
}

body {
background: #222;
}

ul {
margin: -7px 0 24px 0;
}

#content {
	width: 350px;
	margin: 30px auto;
	padding: 20px 60px;
	border: 1px solid #D2D2D2;
	-moz-box-shadow: 0 0 30px #CCC;
	-webkit-box-shadow: 0 0 30px #CCC;
	box-shadow: 0 0 30px #CCC;
	background: #FFF;
	background: -webkit-gradient(linear, left top, left 15, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 15px);
}

#middle
{
background: #222;
position: relative;
height: 100%;
width: 100%;
bottom: 0;
right: 0;
left: 0;
padding: 10px 0px;
text-align: center;
}

#middle a
{
color:#888;
text-decoration:none;
font-family:verdana;
font-size:16px;
}
.clear
{
clear: both;
}
#middle a:hover {
color:#f80;
text-decoration:none;
font-family:verdana;
font-size:16px;
}
#middle a:active {
color:#f80;
text-decoration:none;
font-family:verdana;
font-size:16px;
}
#middle a:selected {
color:#888;
text-decoration:none;
font-family:verdana;
font-size:16px;
}



/*** set the width and height to match your images **/

#slideshow {
background: #222;
position: fixed;
height: 70%;
right: 0;
left: 0;
padding: 10px 0px;
text-align: center;
}

#slideshow IMG {
    position:absolute;
	height: 80%;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}


#footer
{
background: #222;
position: fixed;
height: 50px;
width: 100%;
bottom: 0;
right: 0;
left: 0;
padding: 50px 0px;
text-align: center;
z-index: 10;
}
#footer p
{
margin: 5px 0;
padding: 0;
color: #888;
font-size: .9em;
font-family: tahoma, arial, sans-serif;
}
#footer a
{
margin: 0;
padding: 0;
color: #f80;
text-decoration: none;
}
.clear
{
clear: both;
}