/* Stylesheet by Werbeagentur Onelio / www.onelio.de */

* { margin: 0 ; padding: 0 ; border: 0 ; }
body { background: url(../_img/bg_body.jpg) repeat #fff ; }



/* Allgemeines */

#main { background: #fff ;
position: absolute ;
left: 50% ;
margin: 20px 0px 0px -450px ;
width: 900px ;
}

#top { background: url(../_img/bg_head.jpg) no-repeat #fff ; width: 900px ; height: 20px ; }

#nav {
padding: 0px 0px 0px 10px ;
width: 880px ;
height: 50px ;
line-height: 15px ;
}

.content { margin: 10px 10px 10px 10px ; }

.list { height: 70px ; border-bottom: 1px solid #ddd ; }

/* Content 2-Spaltig */

.two600_left {
width: 600px ;
float: left ;
}

.two300_right {
width: 300px ;
float: right ;
}


/* Content 2-Spaltig */

.two450_left {
width: 450px ;
float: left ;
}

.two450_right {
width: 450px ;
float: right ;
}


/* Content 3-Spaltig */

.three300_left {
width: 300px ;
float: left ;
}

.three300_center {
width: 300px ;
float: left ;
}

.three300_right {
width: 300px ;
float: right ;
}

/* Content 3-Spaltig */

.three200_left {
width: 200px ;
float: left ;
}

.three350_center {
width: 350px ;
float: left ;
}

.three350_right {
width: 350px ;
float: right ;
}


/* Content 3-Spaltig */

.three350_left {
width: 350px ;
float: left ;
}

.three350_center {
width: 350px ;
float: left ;
}

.three200_right {
width: 200px ;
float: right ;
}


/* Content 5-Spaltig */

.five180_allround {
width: 180px ;
float: left ;
}



.three300_left, .three300_center, .three300_right, .three200_left, .three350_center, .three350_right, .two450_left, .two450_right, .two600_left, .two300_right, .five180_allround, .three350_left, .three200_right { line-height: 20px ; }


/* Footer */

#footer {
margin: 20px 0px 0px 0px ;
height: 40px ;
}

#footer_left {
width: 650px ;
float: left ;
}

#footer_right {
width: 200px ;
float: right ;
text-align: right ;
}


/* Referenzen */

#referenzen_view {
width: 900px ;
height: 400px ;
}

#referenzen_txt {
width: 300px ;
position: absolute ;
top: 175px ;
left: 50px ;
}

#referenz01 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 390px ; }
#referenz02 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 470px ; }
#referenz03 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 550px ; }
#referenz04 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 630px ; }
#referenz05 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 710px ; }
#referenz06 { width: 70px ; height: 70px ; position: absolute ; top: 120px ; left: 790px ; }
#referenz07 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 390px ; }
#referenz08 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 470px ; }
#referenz09 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 550px ; }
#referenz10 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 630px ; }
#referenz11 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 710px ; }
#referenz12 { width: 70px ; height: 70px ; position: absolute ; top: 200px ; left: 790px ; }
#referenz13 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 390px ; }
#referenz14 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 470px ; }
#referenz15 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 550px ; }
#referenz16 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 630px ; }
#referenz17 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 710px ; }
#referenz18 { width: 70px ; height: 70px ; position: absolute ; top: 280px ; left: 790px ; }


/* 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(../_img/arrow-left.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../_img/arrow-right.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; }