/*------------------------------------------------------------------
[Master Stylesheet]

Project:		overtime.be
Version:		1.0
Last change:	2008/06/15
Primary use:	Website (screen)
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
[Color codes]

Background:		#000000 (black)
Text:			#ffffff (white)
Header h1:		#cccc99 (foul green)
Header h2:		#00ccff (light blue)

a (standard):	#cccc99 (foul green)
a (visited):	#cccc99 (foul green)
a (active):		#cccc99 (foul green)
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
[Typography]

0.95em				14px
0.9em				13px
0.82em				11px

1.25em				20px
1.12em				16px

Body text:			0.95em/0.82em Verdana, Arial, Helvetica, Geneva, sans-serif;
Headers:			1.25em/1.12em Helvetica, Arial, "Lucida Sans Unicode", Verdana, sans-serif;
-------------------------------------------------------------------*/

* {
	outline: none;
}

body, html {
	background: #000000 url("/img/body.gif") repeat center 124px;
	color: #dfdfdf;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	/*font-family: "Lucida Console", Courier, monospace;*/
	font-size: 11px;
	height: 100%;
	letter-spacing: 1px;
	margin: 0px;
	padding: 0px;
	text-align:center;
}

#container {
	height:auto;
	margin: 0px auto;
	min-height:100%;
	position: relative;
	text-align: left;
	width: 600px;
}

#header {
	height: 305px;
	left: 0px;
	position: absolute;
	top: 0px;
	width: 100%;
}
	#header-background {
		background: url("/img/header4.gif") no-repeat center top;
		left: -150px;
		height: 124px;
		position: absolute;
		top: 0px;
		width: 900px;
	}
	#musicplayer {
		height: 15px;
		left: 430px;
		position: absolute;
		width: 170px;
		top: 322px;
	}
	#navigation {
		background: url("/img/navigation-bg.gif") no-repeat center center;
		height: 26px;
		left: -50px;
		line-height: 26px;
		padding: 0 50px;
		position: absolute;
		top: 96px;
		width: 600px;
	}
		#navigation a {
			color: #ffffff;
			font-family: Lucida Console, "Courier New", Courier, monospace;
			font-size: 10px;
			font-weight: normal;
			letter-spacing:normal;
			margin: 0 13.5px;
			position: relative;
			text-decoration: none;
			text-transform: uppercase;
		}
	#last-album {
		border: 1px solid #1d3e52;
		height: 180px;
		position: absolute;
		top: 124px;
		width: 600px;
	}

#wrapper {
	padding: 310px 0 130px;
	position: relative;
}
	#content {
		width: 600px;
	}
		#content .indent {
			/*margin-left: 120px;*/
		}
		#content .separator {
			color: #bfbfbf;
			margin: 0 0 15px;
		}

#footer {
	height: 144px;
	margin: -144px auto 0;
	position: relative;
	text-align: center;
	width: 100%;
}
#footer #join_facebook {
	margin: 0 auto 5px;
	text-align: right;
	width: 600px;
}
#footer #footercontent {
	background: #000000 url("/img/footer-bg.gif") no-repeat center top;
	height: 72px;
	overflow: hidden;
	position: relative;
	text-align: center;
}
#footer #footercontent a img {
	margin: 1px 2px 0;
}

#footer #scroll-left,
#footer #scroll-right {
	background: #000000;
	color: #0face6;
	display: none;
	left: 0px;
	line-height: 72px;
	height: 72px;
	position: absolute;
	text-decoration: none;
	top: 0px;
	width: 45px;
}
#footer #scroll-right {
	left: 100%;
	margin: 0 0 0 -45px;
}




a, a:link, a:visited {
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}
a:hover, a:focus, a:active {
	text-decoration: underline;
}
a.link {
	color: #cccc99;
	text-transform: uppercase;
}



h1 {
	background: url("/img/heading-bg.gif") no-repeat center center;
	color: #cccc99;
	font-family: Lucida Console, sans-serif;
	font-size: 35px;
	font-weight: normal;
	line-height: 39px;
	margin: 0 0 15px 0;
	padding: 0;
	text-transform: uppercase;
}
h2 {
	color: #00ccff;
	font-size: 11px;
	margin: 0 0 10px;
	padding: 0;
}
h3 {
	background: url("/img/heading3-bg.gif") no-repeat center center;
	color: #ffffff;
	font-family: Lucida Console, sans-serif;
	font-size: 17px;
	font-weight: bold;
	line-height: 21px;
	margin: 0 0 15px 0;
	padding: 4px 0 0;
	text-transform: uppercase;
}
p {
	margin: 0 0 15px;
	padding: 0;
}

.normal, .normal * {
	line-height: normal;
}


a.picture {
	font-size: 12px;
	font-weight: normal;
}
a.picture:hover {
	text-decoration: none;
	font-weight: normal;
}

#content a.thumbnail {
	border: none;
	float: left;
	display: block;
	height: 83px;
	overflow: hidden;
	text-decoration: none;
	width: 125px;
}
#content a.thumbnail:hover {
	border: 1px solid #FFFFFF;
	height: 81px;
	overflow: hidden;
	text-decoration: none;
	width: 123px;
}
#content a.thumbnail img {
	margin: 0;
}
#content a.thumbnail:hover img {
	margin:-1px 0 0 -1px;
}




.fl-left {
	float: left;
}
.fl-right {
	float: right;
}
.clear {
	float: none;
	clear: both;
}
.fullwidth {
	width: 98%;
}
select.fullwidth {
	width: 99%;
}
.note {
	color: #999999;
	font-size: 9px;
	margin: 0 0 15px;
	padding: 0;
}
.no-margin {
	margin: 0;
}







/* LIGHTBOX */
#lightbox {
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	margin-top: -50px;
}
#lightbox a img {
	border: none;
}
#outerImageContainer {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#imageContainer {
	padding: 10px;
}
#loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#hoverNav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#imageContainer>#hoverNav {
	left: 0;
}
#hoverNav a {
	outline: none;
}
#prevLink, #nextLink {
	width: 49%;
	height: 100%;
	background: transparent url('/img/blank.gif') no-repeat; /* Trick IE into showing hover */
	display: block;
}
#prevLink {
	left: 0;
	float: left;
	background: url('/img/prevlabel.gif') left 100% no-repeat;
}
#nextLink {
	right: 0;
	float: right;
	background: url('/img/nextlabel.gif') right 100% no-repeat;
}
#imageDataContainer {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%
}
#imageData {
	padding:0 10px;
	color: #666;
}
#imageData #imageDetails {
	width: 70%;
	float: left;
	text-align: left;
}
#imageData #caption {
	font-weight: bold;
}
#imageData #numberDisplay {
	display: block;
	clear: left;
	padding-bottom: 1.0em;
}
#imageData #bottomNavClose {
	width: 66px;
	float: right;
	padding-bottom: 0.7em;
}
#overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000000;
}

#logo-holder {
	text-align: center;
}
#logo-holder a {
	margin:0 10px;
}

#content img {
	margin: 5px;
}