/*

  CSS definition for Website Baker module: Picturebox (Lightbox Mod)



  Copyright (C) 2007, Christian Thamer, Kim Kahns

  Contact me: christian(at)thamer.net, http://www.thamer.net or Tom Schiemer tom(at)switchnap.com



  This CSS file is free software. You can redistribute it and/or modify it 

  under the terms of the GNU General Public License  - version 2 or later, 

  as published by the Free Software Foundation: http://www.gnu.org/licenses/gpl.html.



  This CSS file is distributed in the hope that it will be useful, 

  but WITHOUT ANY WARRANTY; without even the implied warranty of 

  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the 

  GNU General Public License for more details.

*/



#lightbox{

	position: absolute;

	top: 20px;

	left: 0;

	width: 100%;

	z-index: 60;

	text-align: center;

	line-height: 0;

	color:#151410;

	}

#lightbox a {

    border-bottom:none;

    color:#000000;

    text-decoration:none;

  }

#lightbox a:hover {

    border-bottom:none;

    color:#ea2224;

    text-decoration:underline;

  }

#lightbox a img{ 

  border: none; 

  }

#outerImageContainer{

	position: relative;

	z-index: 89;

	width: 250px;

	height: 250px;

	margin: 0 auto;

	}

#uber {

	z-index: 90;

	width: 100%;

	height: 100%;

	margin: 0 auto;

	}

#eins {

	position: relative;

  background-image: url('images/shadow.png');

  background-position: top left;

	top: 0px;

	left: 0px;

	width: 50%;

	height: 50%;

	margin: 0 auto;

	margin-left: 0px;

	float: left;

	}

#zwei {

	position: relative;

  background-image: url('images/shadow.png');

  background-position: top right;

	top: 0px;

	right: 0px;

	width: 50%;

	height: 50%;

	margin: 0 auto;

	margin-right: 0px;

	float: right;

	}

#drei {

	position: relative;

  background-image: url('images/shadow.png');

  background-position: bottom left;

	bottom: 0px;

	left: 0px;

	width: 50%;

	height: 50%;

	margin: 0 auto;

	margin-left: 0px;

	float: left;

	}

#vier {

	position: relative;

  background-image: url('images/shadow.png');

  background-position: bottom right;

	bottom: 0px;

	right: 0px;

	width: 50%;

	height: 50%;

	margin: 0 auto;

	margin-right: 0px;

	float: right;

	}

#lightboxImage {

	margin: 10px;

	}

.popuptable, .popuptr, .popuptr3, .popuptr2 {

	padding: 0px;

	border: 0px;

	margin: 0px;

	border-spacing: 0px

	}

.popuptd1 {

	position: relative;

	background-image: url('images/topleft.png');

	width: 10px;

	height: 10px;

	padding: 0px;

	margin: 0px;

	}

.popuptd2 {

	position: relative;

	background-image: url('images/top.png');

	padding: 0px;

	margin: 0px;

	}

.popuptd3 {

	position: relative;

	background-image: url('images/topright.png');

	background-position: right;

	width: 10px;

	height: 10px;

	padding: 0px;

	margin: 0px;

	}

.popuptd1b {

	position: relative;

	background-image: url('images/left.png');

	width: 10px;

	padding: 0px;

	margin: 0px;

	}

.popuptd2b {

	position: relative;

	margin: 0px;

	padding: 0px;

	border: 0px solid black;

	}

.popuptd3b {

	position: relative;

	background-image: url('images/right.png');

	background-position: right;

	width: 10px;

	padding: 0px;

	margin: 0px;

	}

.popuptd1c {

	position: relative;

	background-image: url('images/bottomleft.png');

	width: 10px;

	height: 10px;

	padding: 0px;

	margin: 0px;

	}

.popuptd2c {

	position: relative;

	background-image: url('images/bottom.png');

	padding: 0px;

	margin: 0px;

	}

.popuptd3c {

	position: relative;

	background-image: url('images/bottomright.png');

	background-position: right;

	width: 10px;

	height: 10px;

	padding: 0px;

	margin: 0px;

	}

.lbcol {

	display: block;

	padding: 0px;

	margin: 0px;

	}

.lb {

  text-align: center;

	display: block;

	padding: 0px;

	margin: 0px;

	}

.pic {

	width: 130px;

	height: 120px;

	float: left;

	}

.popuptable {

	border: 0px;

	}

.pic-inner {

	vertical-align: bottom;

	height: 120px;

	width: 130px;

	text-align: center;

	}

#imageContainer {

	position: absolute;

	z-index: 90;

	top: 0;

	left: 0;

	}

#loading {

	position: absolute;

	top: 40%;

	left: 0%;

	height: 25%;

	width: 100%;

	text-align: center;

	line-height: 0;

	}

#loadingLink {

	display:block;

	margin:0 auto;

	padding:0;

	width:32px;

	height:32px;

	background:url("images/loading.gif") center center no-repeat;

	text-indent:-9999px;

}

#hoverNav {

	position: absolute;

	top: 0;

	left: 0;

	height: 100%;

	width: 100%;

	z-index: 100;

	}

#imageContainer>#hoverNav { 

  left: 0;

  }

#hoverNav a { 

  outline: none;

  }

#prevLinkImg, #nextLinkImg {

	width: 49%;

	height: 100%;

	background: transparent url("images/blank.gif") no-repeat; /* Trick IE into showing hover */

	display: block;

	text-indent:-9999px;

	}

#prevLinkImg { 

  left: 0; 

  float: left;

  }

#nextLinkImg { 

  right: 0; 

  float: right;

  }

#prevLinkImg:hover, #prevLinkImg:visited:hover { 

  background: url("images/prevlabel.png") left 50% no-repeat; 

}

#nextLinkImg:hover, #nextLinkImg:visited:hover { 

  background: url("images/nextlabel.png") right 50% no-repeat; 

}

#imageDataContainer {

	font: 10px Verdana, Helvetica, sans-serif;

	margin: 0 auto;

	line-height: 1.4em;

	}

#imageData {

	padding:0 10px;

	}

#imageDetails { 

  width: 70%; 

  float: left; 

  text-align: left; 

  display: none;

  }	

#caption { 

  font-weight: bold;

  }

#numberDisplay { 

  display: block; 

  clear: left; 

  }			

#detailsNav { 

  display: block; 

  clear: left; 

  padding:0 0 10px 0;	

  }	

#prevLinkDetails { 

  margin:0 8px 0 0; 

  }		

#nextLinkDetails { 

  margin:0 8px 0 0; 

  }		

#closeLink {

	display:block;

	margin:0;

	padding: 0px;

	text-decoration:none;

	float:right;

	position: relative;

	right: -10px;

	z-index: 92;

	width: 24px;

	height: 24px;

	background:url("images/closelabel.png") no-repeat;

	text-indent:-9999px;

	overflow:hidden;

}	

#close {

	display:block;

	margin:0;

	padding: 0px;

	z-index: 100;

	width: 24px;

	height: 24px;

	float: right;

}

#overlay {

	position: absolute;

	top: 0;

	left: 0;

	z-index: 50;

	width: 0%;

	height: 0%;

	}

.clearfix:after {

	content: "."; 

	display: block; 

	height: 0; 

	clear: both; 

	visibility: hidden;

	}

* html>body .clearfix {

	display: inline-block; 

	width: 100%;

	}

* html .clearfix {

	/* Hides from IE-mac \*/

	height: 1%;

	/* End hide from IE-mac */

	}