section{
    background-image:url("bg.jpg");
    width:1280px;
    height:856px;
    border:0px red solid;
}

span,aside,iframe,b,img,body{-webkit-user-select:none}
span,aside,iframe,b,img,body{pointer-events:none}
body {
    opacity:0;
    -webkit-transition:all 1s ease-out;
    transition:all 1s ease-out;
   
}

aside{
    position:absolute;
    left:1060px;
    top:50px;
    width:200px;
    height:780px;
    background-color: #ccc;
    padding:10px;
    border:0px red dashed;
}


iframe {
    overflow:hidden;
    position:absolute;
    top:84px;
    left:55px;
    width:869px;
    height:652px;
    pointer-events: none;
    overflow-y: hidden;
}

#control{
    width:auto;
    height:50px;    
    background-color:#222;
    border-radius: 5px;
    position:absolute;
    top:769px;
    left:55px;
    border:1px #ccc solid;
    padding:10px;
    
}
#control>div{border-radius:5px;}
#title{
    width:750px;
    height:43px;
    background-color:#333;
    font-family:'Roboto Slab', sans-serif;
    font-size:30px;
    color:#ffffff;
    vertical-align:middle;
    padding-top:5px;
    padding-left:10px;
    border:1px #ccc solid;
    float:left;
}

#pages{
    width:auto;
    height:43px;
    background-color:#333;
    border:1px #ccc solid;
    font-family:'Roboto Slab', sans-serif;
    font-size:30px;
    color:#ffffff;
    padding-top:5px;
    padding-left:8px;
    padding-right:8px;
    margin-left:10px;
    align:center;
    float:left;
}

.btnAudio{
    background-color: #333;
    background-position: 0px 0px;
    background-size:80%;
    background-repeat: no-repeat;
    background-position: center center;
    border:1px #ccc solid;
    margin-left:10px;
    float:left;
    width:50px;
    height:48px;
    
}
.muted{background-image: url("images/buttons/audio_muted_small.png")}
.unmuted{background-image: url("images/buttons/audio_unmute_small.png")}


.mainButton{
    position:absolute;
    width:95px;
    height:60px;
    background-color:black;
    color:#ccc;
    font-family:"Arial";
    font-size:16pt  ;
    text-align: center;
    pointer-events: auto;
}

.mainPrev {
    left:20px; 
    top:650px;
    -webkit-user-select:none;
}
.mainNext {
    left:870px;
    top:650px;
   -webkit-user-select:none;
}

.guy{
    width:auto;
    height:auto;
    position:absolute;
    top:313px;
    left:875px;
    
}

.menuItem{
    border:1px black solid;
    user-select:none;
    pointer-events: auto;
}

.hotspot{
    width:100%;
    height:100%;
    background-color:#red;
}