body{
    width:700px;
    height:400px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;

}

.relative{
    width:700px;
    height:400px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;

    position:relative;
}

.console{
    width:380px;
    height:320px;
    margin: 0 auto;
    margin-top:60px;
    background-image:url('img/console.png');
    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;
}

.buttons{
    padding-left: 50px;
    padding-top:25px;
    width:279px;
    height:48px;
}

.button{
    width:92.7px;
    height:48px;
    margin:0px;
    padding:0px;
    /*background-image:url('img/button_void.png');*/
    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;
    float:left;
}

.menu{
    width:210px;
    height:93px;
    padding:0px;
    margin:0px auto;
    left:calc((700px - 210px)/2);
    position:absolute;
    background-image:url('img/barra.png');
    background-size:197px 60px;
    background-position:center bottom;
    background-repeat:no-repeat;
    float:left;
    z-index:50;
}




.menu-button{
    width:70px;
    height:70px;
    margin:0px;
    padding:0px;
    margin-top:20px;

    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;
    float:left;
}


.scritta-button{
    width:100px;
    height:70px;
    margin:0px;
    padding:0px;
    margin-top:20px;
    font-size: 30px;
    line-height: 100px;
    font-weight: 700;
    font-family: sans-serif;
    color:#fff;
    text-align: right;
    float:left;
}




.icon{
    width:35px;
    height:35px;
    margin:0px;
    padding:0px;
    margin:0 auto;
    margin-top:6px;

    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;

}




.video1{
    width:345px;
    height:214px;

    padding:0px;
    margin:0 17px;
    margin-top:24px;


}



.video2{
    width:345px;
    height:214px;
    padding:0px;
    left:177px;
    top:84px;
    position:absolute;
    z-index:49;
    background-color:#000;


}


.loading{
    width:50px;
    height:50px;
    background-image:url('img/loading.gif');
    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;
    position:absolute;
    top:175px;
    left:325px;

}



.loading2{
    width:50px;
    height:50px;
    background-image:url('img/loading.gif');
    background-size:100% 100%;
    background-position:center;
    background-repeat:no-repeat;
    position:absolute;
    top:175px;
    left:325px;

}



.loading-bar{
    width:0px;
    height:15px;
    left:186px;
    background-color:#00cfff;
    position:absolute;
    top:303px;


}



.loading-container{
    width:327px;
    height:15px;
    color:#000;
    font-size:12px;
    line-height:15px;
    position:absolute;
    top:0px;
    left:0px;
}


.loading-text-bar{
    width:327px;
    height:15px;
    color:#000;
    font-size:12px;
    line-height:15px;
    float:left;
}



.back{
    width:345px;
    height:164px;
    padding:0px;
    left:177px;
    top:84px;
    position:absolute;
    z-index:3;
    /*background-color:#d8d8d8;*/
    background-image:url('img/back.png');
    background-position:center bottom;
    background-size: 100% 100%;
    background-repeat:no-repeat;

}



.base{
    width:345px;
    height:214px;
    padding:0px;
    left:177px;
    top:84px;
    position:absolute;
    z-index:5;
    background-image:url('img/base.png');
    background-position:center bottom;
    background-size: 100% 52px;
    background-repeat:no-repeat;

}



.columns{
    width:345px;
    height:214px;
    padding:0px;
    left:177px;
    top:84px;
    position:absolute;
    z-index:15;
    background-image:url('img/columns.png');
    background-position:center top;
    background-size: 100% auto;
    background-repeat:no-repeat;
}


.arrow-container{
    width:280px;
    height:73px;
    padding:0px;
    left:209.5px;
    top:134px;
    position:absolute;
    z-index:20;
    background-position:center top;
    background-size: 100% auto;
    background-repeat:no-repeat;
}

.arrow-left{
    width:40px;
    height:73px;
    padding:0px;
    float:left;

    background-position:center top;
    background-size: 100% auto;
    background-repeat:no-repeat;

}



.arrow-right{
    width:40px;
    height:73px;
    padding:0px;
    float:right;
    background-position:center top;
    background-size: 100% auto;
    background-repeat:no-repeat;

}


.pantalla{
    width:327px;
    height:214px;
    padding:0px;
    left:186px;
    top:84px;
    position:absolute;
    z-index:14;

    /*background-color:#d8d8d8;*/
    /*background-image:url('img/back.png');
    background-position:center bottom;
    background-size: 100% 100%;
    background-repeat:no-repeat;*/

}



.foto-container{
    width:327px;
    height:184px;
    padding:0px;
    margin-top:30px;
    /*background-color:#d8d8d8;*/
    /*background-image:url('img/back.png');
    background-position:center bottom;
    background-size: 100% 100%;
    background-repeat:no-repeat;*/

left:0px;
    top:0px;
    position:absolute;
    z-index:13;
}


.dritto-container{
    width:327px;
    height:117px;
    padding:0px;
    /*margin-top:30px;*/
    /*background-color:#d8d8d8;*/
    /*background-image:url('img/back.png');
    background-position:center bottom;
    background-size: 100% 100%;
    background-repeat:no-repeat;*/

/*left:0px;
    top:0px;
    position:absolute;
    z-index:13;*/
}



.specchio-container{
    width:327px;
    height:117px;
    padding:0px;
    margin-top:5px;
    -moz-transform: scale(1, -1);
    -webkit-transform: scale(1, -1);
    -o-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1);

}


.riquadro{
    width:327px;
    height:117px;
    background-image:url('img/windows.png');
    background-position:center center;
    background-size: 100% 100%;
    background-repeat:no-repeat;
    padding:0;
    margin:0;
    float:left;
}



.riquadro-rev{
    width:327px;
    height:117px;
    background-image:url('img/windows.png');
    background-position:center center;
    background-size: 100% 100%;
    background-repeat:no-repeat;
    padding:0;
    margin:0;
    float:left;

    -webkit-transform: perspective(100px) rotateX(-20deg) scale(1.2,1);
    -o-transform: perspective(100px) rotateX(-20deg)  scale(1.2 , 1);
    -ms-transform: perspective(100px) rotateX(-20deg)  scale(1.2 , 1);
    transform:  perspective(100px) rotateX(-20deg)  scale(1.2 , 1);
    -webkit-transform: perspective(100px) rotateX(-20deg)  scale(1.2 , 1);
    filter:blur(1px);
    -webkit-filter:blur(1px);
}





.foto{
    width:155px;
    height:96px;
    background-position:center center;
    background-size: cover;
    background-repeat:no-repeat;
    padding:0;
    margin:11px 85px 10px 85px;



}








.nero{
    width:700px;
    height:400px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;
    position:absolute;
    background-color:rgba(0, 0, 0, 0.85);
    z-index:70;
    top:0;
    left:0;
}



.light{
    width:700px;
    height:400px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;
    position:absolute;
    background-position:center center;
    background-size: auto;
    background-repeat:no-repeat;

    z-index:71;
}




.x{
    width:700px;
    height:400px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;
    position:absolute;
    background-image:url('img/x.png');
    background-position:top right;
    background-size: auto;
    background-repeat:no-repeat;

    z-index:72;
}



.x2{
    width:345px;
    height:214px;
    margin:0px !important;
    padding: 0px !important;
    overflow:hidden;
    position:absolute;
    background-image:url('img/x.png');
    background-position:top right;
    background-size: auto;
    background-repeat:no-repeat;
    top:0;
    left:0;
    z-index:72;
}