/*
My informations for the body..
*/
body {
background-image:url(../pictures/style/head/head.jpg);
background-repeat: no-repeat;
background-position: bottom left;
background-attachment:fixed;
background-color: black;
}


/*
The Navigation-Block.
*/
div.navblock {
float: left;
height:70%;
width: 19%;
color: white;
background-color: #336666;
}

span.nav a {
font-weight:bold;
width: 100%;
color: #4C334C;
position: relative;
margin-top: 10px;
float: left;
clear: left;
margin: 2px;
margin-left: 0px;
font-size: 17px;
text-decoration:none;
background-color: #CC0000;
}

span.nav a:hover {
font-weight:bold;
font-size: 17px;
color: white;
background-color: #4C664C;
}

/*
This is for the Sub-Navigation
*/
div.nav2{
position: relative; right: 1px; top: 10px;
color: #EFEA27;
float: right;
clear: right;
width: 22%;
-moz-border-radius:5px;
background-color: #009A00;
}

div.nav2 a {
color: #EFEA27;
text-decoration: none;
}

div.nav2 input {
width: 100%;
}

a.info{
     position:relative; /* this is the key*/
    z-index:24; 
	}

a.info:hover{z-index:25; }

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; right:1em; width:11em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
	font-size: 10px;
    text-align: center;
	-moz-border-radius:5px;
	-moz-opacity:0.8;
}


/*
This one defines my Block on the right site - with some news.
*/
div.news{
/*
position: relative; right: 3px; top: 5px; 
*/
color: #FFFFFF;
padding: 1%;
float: right;
width: 20%;
font-size: 17px;
max-height: 375px;
overflow:auto;
-moz-opacity:0.8;
background-color: #006600;
}

div.news img {
height: 80%;
width: 80%;
}

/*
This is the block with the zitat's
*/
div.zitat{
position: relative; top: 10px;
color: #FFFFFF;
float: left;
clear: left;
width: 17%;
max-height: 80%;
overflow:auto;
padding: 1%;
font-size: 80%;
-moz-opacity:0.8;
background-color: #006600;
}

/*
That's a standart for my formulares.. they have to be in a table
*/
table.form td {
width: 10%;
}

/*
Everything for the text-Block :)
*/
div.text{
color:   white;
position: absolute; right: 20%; left: 21%;
margin-top: 1%;
width: 54%;
max-height: 80%;
overflow:auto;

background-color: #330033;
text-align:left;
padding: 0.5%;
}

div.text h1 {
font-family: cursive;
}
div.text a {
color: #99FF99;
}
div.text img {
height: 65%;
width: 65%;
}
/*
table.projects td {
border: groove 1px;
margin-left: 3px;
}
*/
/*
This one is for my OSlibary..
*/
div.infolib {
width: 60%;
max-width: 80%;
color: #D0FA9F;
}
/**
div.libcontent {
width: 95%;
border-color: blue;
border: groove 5px;
}

div.libcontent td {
width: 75%;
}
div.libcontent img {
width: 80%;
float: right;
position: relative; right: 0px;
}
**/
/*
Because IE sucks!
*/
div.ielibcontent {
width: 90%;
color: #D0FA9F;
}

div.ielibcontent td {
width:75%;
}
div.ielibcontent img {
width: 30%;
position: relative; right: 4%;
float: right;
}

span.new {
font-weight: bold;
float: right;
}

div.inline {
color: #DFEA97;
position: absolute; right: 22%; left: 17%;
margin-top: 30px;
width: 56%;
height: 80%;
padding: 1%;
font-family: "Comic Sans MS";
-moz-opacity:0.875;
background-color: green;
}



ul#Navigation {
font-weight:bold;
color: #09FB1B;
position: relative;
font-size: 15px;
text-decoration:none;
background-image:url(../pictures/nav.jpg);
}

ul#Navigation li {
list-style: none;
float: left;  /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0.4em; padding: 0;
}

ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.6em; left: -0.4em;
display: none;  /* Unternavigation ausblenden */
}

ul#Navigation li:hover ul {
display: block;  /* Unternavigation in modernen Browsern einblenden */ }
ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 0.2em; }

ul#Navigation a, ul#Navigation span {
display: block;
width: 4.0em;  /* Breite den in li enthaltenen Elementen zuweisen */
padding: 0.2em 1em;
font-weight:bold;
color: #09FB1B;
position: relative;
font-size: 15px;
text-decoration:none;
background-image:url(../pictures/nav.jpg);
  }

body div#toolTip {
position:absolute;
z-index:1000;
width:220px;
background:#000;
text-align:left;
padding:5px;
min-height:1em;
-moz-border-radius:5px; }

body div#toolTip p {
margin:0;
padding:0;
color:#fff;
font:11px/12px verdana,arial,sans-serif; }

body div#toolTip p em {
display:block;
margin-top:3px;
color:#f60;
font-style:normal;
font-weight:bold; }

body div#toolTip p em span {
font-weight:bold;
color:#fff; }

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#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(../pictures/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../pictures/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../pictures/lightbox/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;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
