.lightbox {width:100%; height:100%; display:none; position:fixed; left:0; top:0; z-index:1000; padding:0; font-family:arial, sans-serif;}
.lightbox .light {width:100%; height:100%; position:fixed; z-index:-1; top:0; left:0; background:#FFF; opacity:0.5; filter: alpha(opacity=70);
 text-align:center;}
/* this is for IE6 . If you want to have the lightbox scroll with the page in ALL browsers then remove the * html */
/* * html .lightbox {position:absolute;} */
/* * html .lightbox .light {position:absolute; height:5000px;} */
.lightbox {position:absolute;}
.lightbox .light {position:absolute;}

.lightbox .box {width:714px; background:#FFF; border:1px solid #aaa; border-top:solid 8px #F8C133; margin:40px auto 0; padding:12px 30px 30px 30px; position:relative;
-o-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
}
.lightbox .box {}

.lightbox .box .box_content {width:100%; margin-right:-400px; color:#333; text-align:left; font-size:14px; line-height:18px; min-height:240px;}
.lightbox .box .box_content img.magnify {margin-top:4px; position:absolute; top:260px;
-o-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.5);
}
.lightbox .box .box_content p {width:400px; float:right;}
.box_footer {  
height: 0;
  clear: both;
}
.box_content p + p {padding-top:8px;}

.lightbox .box a.closebox {display:block; width:25px; height:22px; text-decoration:none; text-align:center; position:absolute; right:34px; top:10px; background:url(../playbox/close.gif) no-repeat center center;}
 
.lightbox .box .box_title {margin:0; padding-bottom:32px;}
.lightbox .box .box_banner {margin:0; padding-bottom:15px;}

.lightbox .box2 {width:500px; background:#444; border:10px solid #fff; margin:0 auto; padding:10px; position:relative;
-o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
.lightbox .box2 h3 {color:#fff; font-size:22px; padding:10px 0; margin:0;}
.lightbox .box2 p {width:500px; padding:5px 0; margin:0; color:#fff; text-align:left; font-size:12px; line-height:18px;}
.lightbox .box2 a {color:#fc0;}
.lightbox .box2 a:hover {color:#ff0; text-decoration:none;}
.lightbox .box2 a.closebox {display:block; width:25px; height:30px; background:#444; color:#fff; font-weight:bold; font-size:26px; text-decoration:none; text-align:center; position:absolute; right:-1px; top:-1px; border:1px solid #fff;}
.lightbox .box2 a.closebox:hover {color:#f00;}


#p001:target {display:block;}
#p002:target {display:block;}
#p003:target {display:block;}
#p004:target {display:block;}
#p005:target {display:block;}
#p006:target {display:block;}
#p007:target {display:block;}

/* the maginying glass icon in lightbox images */
.enlarge {
	position: relative;
	top: 175px; 
	left: 265px; 
	}