/* - - - - - - - - - - - - - - - - - - - - -

Title : Lightbox CSS
Author : Kevin Hale
URL : http://particletree.com/features/lightbox-gone-wild/

Created : January 13, 2006
Modified : February 1, 2006

- - - - - - - - - - - - - - - - - - - - - */

#lightbox-background {
  background-color: #e0e0e0;
}

.admin {
  position: fixed;
  top: 50px;
  width: 620px;
  background-color: #e0e0e0;
}

div.portrait, div.note {
  width: 457px;
  height: 618px;
  padding: 0px 10px 30px 15px;
}

div.landscape {
  width: 610px;
  height: 475px;
  padding: 0px 5px 20px 15px;
}

#lightbox-content {
  overflow: auto;
}

.admin #lightbox-content {
  overflow: auto;
  width: 620px;
  height: 500px;
}

.portrait #lightbox-content, .note #lightbox-content {
  width: 457px;
  height: 610px;
}

.landscape #lightbox-content {
  width: 610px;
  height: 460px;
}

#lightbox-navigation {
  height: 15px;
  padding-top: 7px;
	margin-bottom: 11px;
}

#lightbox-navigation .close-button {
  display: block;
  float: right;
  padding: 1px 26px 2px 0px;
	margin-right: 0px;
	font-weight: bold;
	background: url(../images/icons/turing/icon-livesearch-close.gif) no-repeat;
	background-position: right;
	text-decoration: none;
	font: bold 12px "Trebuchet MS", Arial, sans-serif;
}

div.admin #lightbox-navigation a {
	margin-right: 8px;
}

div.landscape #lightbox-navigation .close-button {
	margin-right: 8px;
}

/* The main lightbox div. It is positioned as follows: First, it is positioned
 * at the center of the screen (50%/50%) and then it is pulled to the top left
 * corner of the screen by negative margins.
 */
#lightbox{
	display: none;
	z-index:9999;

	position: absolute;
	top:30px;
	left:50%;

	width:520px;
	height:420px;
	margin: 0 0 0 -260px;

	text-align:left;
}
#lightbox[id]{
}

#overlay{
	display:none;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:5000;
	background-color:#000;
	-moz-opacity: 0.7;
	opacity:.70;
	filter: alpha(opacity=70);
}
#overlay[id]{
	position:fixed;
}

#lightbox.done #lbLoadMessage{
	display:none;
}
#lightbox.done #lbContent{
	display:block;
}
#lightbox.loading #lbContent{
	display:none;
}
#lightbox.loading #lbLoadMessage{
	display:block;
}