#slider {
  position: fixed;
  overflow: hidden;
  margin: 0px auto 0 auto;
  top:0px;
  left:0px;
 /* z-index:-1; */
  visibility: hidden;
}


#slider div.film {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100%;
 }


#slider div.frame {
  position: relative;
  display: block; 
  float: left;
  margin: 0;
  padding: 0;
  width: 500px;
  height: 300px;
  text-align: center;
  line-height: 300px;
  background-size:cover; 
  background-position: center center;

}


.nextImageBtn, 
.prevImageBtn{display:block; position:fixed; width:50px; height:50px; top:50%; margin:-10px 10px 0 10px; z-index:3; filter:alpha(opacity=30); -moz-opacity:0.4; -khtml-opacity:0.4; opacity:0.4;}

.nextImageBtn:hover,
.prevImageBtn:hover{filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0;}

.nextImageBtn{right:5px; background:url(../resource/img/next.png) center center no-repeat;}

.prevImageBtn{left:5px; background: url(../resource/img/prev.png) center center no-repeat;}



#entryPanel {
	width:400px;
	height:120px;
	background-color:rgba(0, 0, 0, 0.75);
	position:absolute;
	top:50px;
	left:200px;
}
#bulletinPanel {
    position:absolute;
    top:200px;
    left:300px;
    width:300px;
}
#startPanel {
	width:300px;
	height:100px;
	background-color:rgba(0, 0, 0, 0.75);
	position:absolute;
	top:400px;
	left:200px;
}



.f-content {
  width:100%;
  background-color:rgba(0, 0, 0, 0.75); 
  opacity: 0.0;
  -webkit-transform: translateX(1%);
  -ms-transform: translateX(1%);
  transform: translateX(1%);
  
  -webkit-transition: 1s ease-in-out;
    -moz-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
  /*
  -webkit-transition: -webkit-transform .5s .5s, opacity .5s;
  transition: transform .5s .5s, opacity .5s;  
 */
}

.activate {
  opacity: 1;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  
  -webkit-transition: 1s ease-in-out;
    -moz-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
  /*
  -webkit-transition: all .5s .5s;
  transition: all .5s .5s;
  */
}

/* **************** background fader ********************** */
#bg_fader{padding:0;
           margin:0;
           width:100%;
           height:100%;
           position:fixed;
           top:0;
           left:0;
           z-index:-1;
}
#bg_fader div{position:absolute;
               left:0;
               top:0;
               width:100%;
               height:100%;
               z-index:1;
               background-size:cover; 
               background-position: center center;
}
 
.grow{ 
    transition: all 1.0s ease-in-out; 
    -moz-opacity: 0.0;
    opacity: 0.0;
    -moz-transform:  scale(1.1);
    -webkit-transform:  scale(1.1);
    -o-transform:  scale(1.1);
    -ms-transform:  scale(1.1);
    transform:  scale(1.1);
}
 
/* ***** alternativee fader (less javasript code) ***/

div.imgList{
	display:none
}
#bgPanel {
  position:fixed;
  height:281px;
  width:450px;
  margin:0 auto;
  top:0px;
  left:0px;
}

#bgPanel div {
  position:absolute;
  top:0px;
  left:0px;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  
               width:100%;
               height:100%;
               z-index:1;
               background-size:cover; 
               background-position: center center;
 
}

#bgPanel div.transparent {
transition: all 1.0s ease-in-out; 
-moz-opacity: 0.0;
    opacity: 0.0;
    -moz-transform:  scale(1.1);
    -webkit-transform:  scale(1.1);
    -o-transform:  scale(1.1);
    -ms-transform:  scale(1.1);
    transform:  scale(1.1);
}