/*
Based on:
CSS playBOX v2 - The Ultimate CSS Lightbox - with additional previous/next function by Stu Nicholls
http://www.cssplay.co.uk/menu/playboxv2.html
*/

.lightbox {position:fixed; left:0; top:0; width:100%; height:100%; display:none; z-index:1000; padding:10px 0 0 0;}
.lightbox .light {position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; background:#1A3300; opacity:0.4; filter: alpha(opacity=40); 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 .box {position:relative; width:980px; height:548px; overflow:hidden; background-color:#303030; margin:0 auto; padding:5px 10px 5px 10px;
  -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 .box .box_nav,
.lightbox .box .box_img,
.lightbox .box .box_kepfelirat {position:absolute;}


.lightbox .box .box_nav {left:20px; top:490px; width:250px; height:30px; background-color:#fff; text-align:center; margin:0; padding:4px 0;}
.lightbox .box .box_img {left:300px; top:10px; width:560px; height:540px; background-color:#101010; display:block; margin:0 auto;}
.lightbox .box .box_kepfelirat {left:20px; top:10px; width:250px; height:450px; background-color:#101010;}

.lightbox .box .box_img img {background-color:#000; padding:5px;}

.lightbox .box .box_kepfelirat h1 {margin:10px 10px 20px; border-bottom:thin dotted #fff; color:#fff; text-align:left; font-size:20px;}
.lightbox .box .box_kepfelirat p {margin:0 10px; border:none; color:#fff; text-align:left; font-size:14px;}

.lightbox .box a {color:#000; font-weight:bold; font-size:28px; text-decoration:none; text-align:center; font-family:"times new roman", serif; margin:0; padding:0 20px; border:none;}
.lightbox .closebox:hover {color:#f00;}
.lightbox .previous:hover, .lightbox .next:hover {color:#080;}

@-webkit-keyframes fadeIn {0% {opacity:0;} 100% {opacity:100;}}

.lightbox:target {display:block;}
.lightbox:target .box img {-webkit-animation-name: fadeIn; -webkit-animation-duration: 1.5s;}
