html, body { background:transparent; margin:0; padding:0;
 }
.foto{width:1000px; height:562px; text-align:center; margin-left:-500px; padding:0; position:absolute; margin-top:0; top:0;
left:50%; right:50%;
}
h1{
	width:100%; font-family:"Arial Rounded MT Bold"; color:white; text-shadow:1px  1px 1px black, 1px -1px 1px black, -1px  1px 1px black, -1px -1px 1px black;
	position:absolute; top:0; z-index:1; overflow:hidden; 
	padding:20px; margin:0; font-size:medium; font-weight:normal;
}
ul, li { display: block; }
#body {position:relative;

background:transparent;
    width: 1000px;
    height: 562px;
    display: block;
    margin:0;
   top:0; 
   padding:0;
}
#body input { display: none; }
#img-inner {
text-align:center;
margin:0; padding:0;
    opacity:0;
    width: 1000px;
    height: 562px;
    display:block;
   position:absolute; 
    transform: fade(0);
    -moz-transform: fade(0);
    -webkit-transform: fade(0); 
    transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
}
#img-inner img {
    width:auto;
    height: 100%;
}

#img-inner:hover ~ label.sb-bignav { opacity: 0.5; }
label.sb-bignav:hover { opacity: 1; }
.sb-bignav {
    width: 50%;
    height: 100%;
   display:none;
    position: absolute;  
  opacity:0;
    z-index: 9;
    cursor:pointer;   
    transition: opacity .1s;
    -moz-transition: opacity .1s;
    -webkit-transition: opacity .1s;
}
p{
	color:white; width:100%; bottom:0; padding-bottom:5px; margin:0; 
	position:absolute; z-index:1; font-family:"Arial Rounded MT Bold"; font-size:medium; text-shadow:1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
}
label[title=weiter] {
right: 0; 
background:transparent; opacity:0;
}
.weiter{
text-align:right; width:100%; height:auto; background-color:transparent; display:block; 
position:absolute; top:40%; font-size:100px; color:white;font-weight:bold;
}
label[title=zurück] {
left:0; 
background:transparent; opacity:0;
}
.vor{
text-align:left; width:100%; height:auto; background-color:transparent; display:block; position:absolute; 
top:40%; font-size:100px; color:white;font-weight:bold;
}
input:checked + li > #img-inner {
    opacity: 1;       
    transform: fade(1);
    -moz-transform: fade(1);
    -webkit-transform: fade(1);   
    transition: opacity 2s ease-in-out;
    -moz-transition: opacity 2s ease-in-out;
    -webkit-transition: opacity 2s ease-in-out;
}
input:checked + li > label { display: block; }