/* Stylsheet for www.bugworld.at */

/* Colours
background	#262626
text		#EEEEEE

bug-green	#77AA00

*/

/*Basic*/
html, body, div, p, h1, h2, h3, h4, ul, ol, span, a, table, td, form, img, li, label{
	margin:0;
	padding:0;
	border:0;
	font-family: Helvetica Neue, Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, p, ul, ol, dl,label { 
	margin: 0 0 21px 0; 
	font-weight:normal;
}
html, body {
	/* border: 2px solid red;
	*/
	min-height:100%;
	font-size:101%;
	line-height: 1.5em;
	text-align:center;
}
body {
	background:#262626 url(bg.gif) repeat-y;
	background-position:center;
	color:#EEEEEE;
}

/* Links */
a {
	text-decoration:none;
}
a:link {
	color:#EEEEEE;
	text-decoration:underline;
}
a:active {
	color:#EEEEEE;
}
a:visited {
	color:#BBBBBB;
	text-decoration:none;
}
a:hover {
	color:#EEEEEE;
	text-decoration:none;
}

/* Fonts */
h1 {
	font-size:3em;
	line-height: 0.5em;
}
h2{
	color: #77AA00;
	margin-bottom: 40px;
}
h2, h3 {
	font-size:1em;
	line-height: 0.1em;
	margin-left: 95px;
	clear: left;
}

p, label{
	font-size:0.76em;
	line-height:1.5em;
	margin-bottom:1em;
}

/* Basic */
img {
	padding: 8px 8px 0 0;
}
hr{
	height:2px;
	color:#EEEEEE;
	background-color:#EEEEEE;
	border:none;
	margin: -10px 0 20px 0;
	width: 550;
}

/* Owen */
.box {
	/*border: 2px solid red;
	*/
	min-height:100%;
	height: 100%;
    voice-family: "\"}\"";
    voice-family: inherit;
    height: auto;
	width: 550px;
	margin:0 auto;
	padding:0px;
	text-align:left;
}
.images {
	width: 557px;
}
.play{
	background:url(play.gif) no-repeat;
	position:absolute; 
	margin:0 auto;
	margin-left: 500px;
	margin-top: -20px;
	top:45px;
	width:120px; 
	height:120px;
}
.play a, .play_long a{
	width:100%;
	height:100%;
	display: block;
	text-decoration:none;
}
.play_long{
	background:url(play_long.png) no-repeat;
	margin-left: 80px;
	margin-top: 0px;
	width: 240px; 
	height: 90px;
}

.post, .post_date, .post_name, .post_text, .post_name a{
	font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
	color:#BBBBBB;
}

.post_form_lab{
	width:90px;
	float:left;
}
.post_form_in{
	float:right;
	width:455px;
	background:#EEEEEE;
	border:none; 
}
.post_form_clear{
	border:none;
	margin-left:95px;
}

.post{
	position:absolute; 
	margin:0 auto;
	margin-left: 585px;
	margin-top: 120px;
	top:45px;
	width:20%; 
	height:120px;
}
.post_text{
	font-size:2em;
	line-height:1.0em;
	margin-top: 30px;
}
.post_date, .post_name{
	font-size:0.7em;
	line-height:1.4em;
}

#copy{
	margin:0;
	float:left;
}
#copy img{
	margin:0;
	padding:3px 8px 0 0;
}
#header{
	background: #EEEEEE;
	margin-left:-25px;
	margin-bottom: 40px;
	width:552px;
	height:10px;
	padding:0 25px;
}
#footer{
	background: #77AA00;
	margin-left:-27px;
	width:552px;
	height:40px;
	padding:8px 27px 10px 27px;
}
#footer p{
	float:left;
	width:390px;;
}


.social{
	float:right;
}

.social ul{
	width:48px;
	list-style:none;
}

.del-icio-us a span,
.digg a span,
.stumbleupon a span, 
.reddit a span {
	float:right; 
	display: block; 
	border: 2px solid #77AA00; 
	text-decoration: none;
}

.del-icio-us a:hover span,
.digg a:hover span,
.stumbleupon a:hover span, 
.reddit a:hover span {
	border: 2px solid #262626; 

}

.social .del-icio-us span,
.social .digg span,
.social .stumbleupon span,
.social .reddit span {
	width: 16px;
	height: 15px;
	overflow: hidden;
	text-indent: -9999px;
	display: block;
	padding: 0 0 1px 0;
	cursor: pointer;
	position: relative;
	background-image: url(../src/icos.gif);
	background-repeat: no-repeat;
}

.social .del-icio-us,
.social .digg,
.social .stumbleupon,
.social .reddit {
	margin:-3px 0 0 0;
}
.social .del-icio-us span{background-position:0 0;}
.social .digg span{background-position:-16px 0;}
.social .stumbleupon span {background-position:-32px 0;}
.social .reddit span {background-position:-48px 0;}

/* ----------------------- */
/* ------ lightbox ------- */
/* ----------------------- */

#lightbox {
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#lightbox img {
	width: auto;
	height: auto;
}
#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-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
	display: block;
}
#prevLink {
	left: 0;
	float: left;
}
#nextLink {
	right: 0;
	float: right;
}
#prevLink:hover, #prevLink:visited:hover {
	background: url(prevlabel.gif) left 15% no-repeat;
}
#nextLink:hover, #nextLink:visited:hover {
	background: url(nextlabel.gif) right 15% 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;
	outline: none;
}
#overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
}