body{ 
height: 100%; 
} 

body { 
margin: 0; 
padding: 0; 
background-color : #000; 
text-align :left; 
font-family : arial; 
font-size : 0.7em; 
color : #fff; 
} 

/* SITE
************************************/ 

#site { 
position:absolute; 
left: 50%; 
top: 50%; 
width: 810px; 
height: 490px; 
margin-top: -245px; 
margin-left: -405px; 
background :#000  ; 
text-align : left; 
border : 1px solid black ;
background :#000 ; 

}

h1  {
font-size : 2.5em ;
position : absolute ;
top : -90px ;
left : 0 ; 
text-transform : uppercase ; 
color:#3295d5; ; 
}

p.description   {
position : absolute ;
top : -50px ;
left : 165px ; 
}

ul.menu {
position : absolute ;
top : -50px ;
right : 10px ; 
list-style : none
}

ul.menu li {
float : left ;
padding : 0 5px 
}

ul.menu li a {
color : #fff ; 
text-decoration : none ; 
}

ul.menu li a:hover {
border-top : 4px solid #3295d5;
}


ul.menu li a.active {
border-top : 4px solid #3295d5
}


/* CONTENT
************************************/ 

div.content {
/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
display: none;
width: 810px; 
float : left ; 
}

div.content a, div.navigation a {
text-decoration: none;
color: #777;
}


div.content a:focus, div.content a:hover, div.content a:active {
text-decoration: underline;
}


/* CONTROLS : pause - previous - next
************************************************************************/ 

#cache div.controls a {
position : absolute ;
left : -999999px ; 
top : -999999px ; 
}


/* CONTROLS : pause - previous - next
************************************************************************/ 

div.controls {
position : absolute ;
bottom : 15px; 
right : 10px ; 
z-index : 1
}

div.controls a {
padding: 5px;
color : #ccc ; 
}

div.ss-controls {
float: left;
}

div.nav-controls {
float: right;
}


/* SITE
************************************/ 

div.slideshow-container {
position: relative;
clear: both;
height: 490px; /* This should be set to be at least the height of the largest image in the slideshow */
}


div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 810px;
	height: 490px; /* This should be set to be at least the height of the largest image in the slideshow */
}


/* SLIDESHOW
************************************/ 


div.slideshow {}

div.slideshow img {
margin : -14px 0 0 0
}

div.slideshow span.image-wrapper {
position: absolute;
top: 0;
right: 0;
}

div.slideshow a.advance-link {
display: block;
width: 810px;
}


div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
text-decoration: none;
}

div.slideshow img {
border: 0;
}


/* DOWNLOAD
************************************/ 


div.download {
position : absolute  ; 
bottom : -40px ; 
right : 0 ; 
}

 /* CAPTION
************************************/ 

div.caption-container {
position: absolute;
width : 100% ;
left : 0 ; 
bottom : 0 ; 
height: 45px;
background : #000 ; 
-moz-opacity:0.5;
opacity: 0.5;
filter:alpha(opacity=50);
}

span.image-caption {}

div.caption {
position : absolute ; 
top : -999999px;
left : -999999px ; 
}

/* THUMBS
************************************/ 

ul.thumbs {
margin : 0 ;
padding : 0 0 0 0 ;
list-style : none ; 
position : absolute ; 
bottom : -100px ; 
left : 0 ;
width : 810px ; 
}


ul.thumbs li {
float: left;
padding: 0;
margin: 5px 4px 5px 0;
list-style: none;
}

a.thumb {
padding: 0;
display: block;
border: 1px solid #ccc;
}

ul.thumbs li.selected a.thumb {
background: #000;
}

a.thumb:focus {
outline: none;
}

ul.thumbs img {
border: none;
display: block;
}


/* THUMBS CACHE
************************************/ 


#cache ul.thumbs {
margin : 0 ;
padding : 0 0 0 11px ;
list-style : none ; 
position : absolute ; 
top : -999999px ; 
left : -999999px ; 
width : 800px ; 
}

#cache ul.thumbs li {
float: left;
padding: 0;
margin: 5px 11px 5px 0;
list-style: none;
}

#cache a.thumb {
padding: 0;
display: block;
border: 1px solid #ccc;
}

#cache ul.thumbs li.selected a.thumb {
background: #000;
}

#cache a.thumb:focus {
outline: none;
}

#cache ul.thumbs img {
border: none;
display: block;
}


/* PAGINATIN
************************************/ 

div.pagination {}

div.navigation div.top {
position : absolute ; 
top : -999999px ; 
left : -999999px  ; 
}

#site div.navigation div.bottom {
position : absolute ; 
bottom : -150px ; 
left : 360px  ; 
}

#cache div.navigation div.bottom {
position : absolute ; 
top : -999999px ; 
left :  -999999px ; 
}

div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
display: block;
float: left;
margin-right: 2px;
padding: 4px 7px 2px 7px;
font-size : 140% ;
font-family : times ;
font-style : italic
}


div.pagination a:hover {
color: #c41695;
text-decoration: none;
}

div.pagination span.current {
font-weight: bold;
background-color: #000;
border-color: #000;
color: #fff;
}



div.pagination span.ellipsis {
border: none;
padding: 5px 0 3px 2px;
}



/* CONTAINER
************************************/ 

#container h2 {
margin : 20px 20px 0 20px ;
padding : 0 ;
color : #ccc ; 
}


#container p{
margin : 20px 20px 0 20px ;
padding : 0 ;
color : #ccc ; 
}


/* FOOTER
************************************/ 


#footer {
position : absolute ;
bottom : -70px ; 
left : 0 ; 
width : 100% ; 
text-align : center ;
width : 100% ;
height : 40px ; 
} 

#footer a {
color : #444; 
text-decoration : none ;
} 

 p#footer {
margin : 0 ;
padding : 10px 0 0 0 ;
color :#444; 
} 

#footer a:hover {
color : #444 ; 
border-bottom : 4px solid #c41695
}