@charset "utf-8";

img, object, embed, video {
	max-width: 100%;
}
.ie6 img{width:100%;}
body{overflow:hidden}

/* Layout mobile: 480 px e inferiori. */
body { background: url(../img/bg-Body-Riscrivi.jpg) center center repeat; }

/* Layout mobile: 480 px e inferiori. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

#imgDesktop { visibility:hidden; }
.VideoSlide { display:none; visibility:hidden; }
#Conteiner-Slide-Box { position:absolute; top:0px; left:0px; width:0px; height:0px; display:none; }

/*MENU MOBILE OPEN*/
#barraNavigazione, #boxBtnMenuNav {display:none;}
.imgAstucciHeader { padding-top:25px; padding-bottom:25px; }

.BtnMobile{
	position:fixed;
	right:0px;
	top:0px;
	margin-top:3%;
	margin-right:3%;
	display:block;
	z-index:9999;
}
#tendina{
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:0px;
	background-image:url(../img/bg-tendina-Riscrivi.png);
	background-repeat:repeat;
	overflow:auto;
	display:block;
	z-index:999;
}
#tendinaLv2Studio, #tendinaLv2Stampa{
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	height:0px;
	background-color:#009ee2;
	overflow:auto;
	display:block;
}
.btnMenuMobile{
	position:relative;
	top:0px;
	left:0px;
	width:88%;
	padding:6%;
	border-bottom:solid 1px #ffffff;
}
.btnMenuMobileLv2{
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	padding:25px;
	width:88%;
	padding:6%;
}
/*MENU MOBILE CLOSED*/

#Conteiner1, #Conteiner2-Mob { position: relative; clear:both; width:98%; margin-left:1%; margin-right:1%; display:block; text-align:center; }
#Conteiner2-Slider-Mob { position: relative; clear:both; width:100%; margin:0px; display:block; text-align:center; }
/* CONTENITORI */
#ConteinerCredit { position: relative; clear:both; width: 100%; margin:0px auto; display:block; text-align:center; padding-bottom:100px; }
/* COOKIES */
#Conteiner-Cookie { position: relative; clear:both; width: 90%; margin-left:5%; margin-right:5%; display:block; text-align:center; }
#Box-Cookie { position:relative; text-align:left; display:inline-block; margin:0; }

#Conteiner-Header { position:absolute; top:62.5%; width:100%; height:227px; text-align:center; margin:0; }
#video-Header { width:56%; height:21%; display:inline-block; }

/* Layout tablet: da 481 px a 768 px. Eredita stili da: Layout mobile. */

@media only screen and (min-width: 481px) {
#Conteiner-Box {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#video-Header { width:56%; height:21%; display:inline-block; }
}
@media only screen and (min-width: 700px) {
#video-Header { width:50%; height:21%; display:inline-block; }
}
@media only screen and (min-width: 800px) {
#video-Header { width:45%; height:21%; display:inline-block; }
}
@media only screen and (min-width: 900px) {
#video-Header { width:40%; height:21%; display:inline-block; }
}
@media only screen and (min-width: 1000px) {
#video-Header { width:38%; height:21%; display:inline-block; }
}

@media only screen and (min-width: 1100px) {
.BtnMobile, #tendina, .btnMenuMobile, #imgMobile, #Conteiner2-Mob, #Conteiner2-Slider-Mob, .imgMobile {display:none !important;}
#imgDesktop { visibility:visible; }
.VideoSlide { display:block; visibility:visible; }

#Conteiner-Box { position:; width:90%; margin-left:5%; margin-right:5%; text-align:center; clear:both; display:block; }

/* CONTENITORI */
#Conteiner1 { position: relative; clear:both; width: 96%; margin-left:2%; margin-right:2%; display:block; text-align:center; }
  #Conteiner-Header { position:relative; width:100%; max-width:910px; height:810px; text-align:center; display:inline-block; margin:0; background: url(../img/Bg-Slide-Header.png) center center no-repeat; background-size:cover;  }
  #Conteiner-123 { position:relative; width:100%; max-width:1010px; height:89px; text-align:center; display:inline-block; margin:0 }

  
#Conteiner2 { position: relative; clear:both; width: 96%; margin-left:2%; margin-right:2%; display:block; text-align:center; }
  #Conteiner2-inBox { position:relative; width:100%; max-width:1010px; height:655px; text-align:center; display:inline-block; margin:0 }
  #Conteiner-Duo { position:relative; width:100%; max-width:1010px; height:670px; text-align:center; display:inline-block; margin:0; background: url(../img/Bg-Duo-Riscrivi.png) center center no-repeat; background-size:cover; }
  #Conteiner-Touch { position:relative; width:100%; max-width:1010px; height:670px; text-align:center; display:inline-block; margin:0; background: url(../img/Bg-Touch-Riscrivi.png) center center no-repeat; background-size:cover; }
  
  #Conteiner-Slide { position:relative; width:100%; max-width:1010px; height:670px; text-align:center; display:inline-block; margin:0; background: url(../img/Bg-Slide-Riscrivi.png) center center no-repeat; background-size:cover; }
    #Conteiner-Slide-Box { position:absolute; top:45px; left:-473px; margin-left:50%; width:946px; height:591px; display:inline-block; }
  
#ConteinerCredit { position: relative; clear:both; width: 90%; margin-left:5%; margin-right:5%; display:block; text-align:center; padding-bottom:100px; }

.GommeDesk {padding-right:15px;}
.RefillDesk {padding-left:15px;}

#video-Header { position:absolute; top:400px; left:-196.5px; margin-left:50%; width:393px; height:227px; }
#img-Razzo { position:absolute; top:410px; left:20px; width:146px; height:138px; background:url(../img/img-Razzo.png) top left no-repeat;}
.animate-Razzo {animation:Razzo 3s ease-in-out infinite; animation-delay:0s; }
@keyframes Razzo{0%{transform:translateY(0px)}50%{transform:translateY(-30px) rotate(-15deg)}100%{transform:translateY(0px)}}
#img-Lampadina { position:absolute; top:430px; right:40px; width:120px; height:124px; background:url(../img/img-Lampadina.png) top left no-repeat; background-size:cover }
.animate-Lampadina {animation:Lampadina 5s ease-in-out infinite; animation-delay:0s; }
@keyframes Lampadina{0%{transform:translateY(0px)}50%{transform:translateY(30px) rotate(20deg)}100%{transform:translateY(0px)}}
#img-Baloon { position:absolute; top:260px; right:120px; width:100px; height:108px; background:url(../img/img-Baloon.png) top left no-repeat;}
.animate-Baloon {animation:Baloon 3s ease-in-out infinite; animation-delay:0s; }
@keyframes Baloon{0%{transform:scale(1,1)}50%{transform:scale(1.2,1.2)}100%{transform:scale(1,1)}}
/*PULSANTI DI NAVIGAZIONE*/
/*#ConteinerArrowLeft, #ConteinerArrowLeft:hover { position:absolute; top:300px; left:-200px; width:149px; height:77px; background:url(../img/btn-Prev.png) top left no-repeat; cursor:pointer; -webkit-transition: width 0.3s, height 0.3s, -webkit-transform 0.3s; transition: width 0.3s, height 0.3s, transform 0.3s; }*/
#ConteinerArrowRight { position:absolute; top:490px; left:600px; width:86px; height:100px; background:url(../img/btn-Next-Slide-White.png) top left no-repeat; cursor:pointer }
#ConteinerArrowRight:hover {left:620px; background:url(../img/btn-Next-Slide-Black.png) top left no-repeat }
/* ANIMAZIONE FRECCIA SLIDE */
.animate-Freccia-Slide {animation:freccia-slide 1s linear infinite; animation-delay:0s; }
.animate-Freccia-Slide:hover {animation:freccia-slide-hover 1s linear infinite; animation-delay:0s; }
@keyframes freccia-slide{0%{transform:translateX(0px);opacity:0}20%{transform:translateX(10px);opacity:1}75%{transform:translateX(30px);opacity:1}100%{transform:translateX(40px);opacity:0}}
@keyframes freccia-slide-hover{0%{transform:scale(1.2,1.2)}}
/*PULSANTI DI SELEZIONE*/
#ConteinerBtnNavVideo { position:absolute; top:233px; margin-left:50%; left:-26px; }
#BtnNavVideo { width:21px; height:21px; margin:5px; display:inline-block; cursor:pointer; background: url(../img/ico-Nav-Slide.png) bottom left no-repeat; }
#BtnNavVideo:hover { background:url(../img/ico-Nav-Slide.png) top left no-repeat; }
.BtnNavVideoSelect { width:21px; height:21px; margin:10px; display:inline-block; cursor:pointer; background:url(../img/ico-Nav-Slide.png) top left no-repeat !important}
#img-Stellina { position:absolute; top:20px; left:310px; width:54px; height:54px; background:url(../img/img-Stellina.png) top left no-repeat }
.animate-Stellina { animation:rotete-Stellina 1.5s linear infinite; animation-delay:0s }
@keyframes rotete-Stellina{0%{transform:rotate(-360deg)}}

/* ANIMAZIONE 123 */
#img-1Scrivi { position:absolute; top:0px; left:0px; width:185px; height:89px; background:url(../img/img-1Scrivi.png) top left no-repeat }
.animate-1Scrivi {animation:animazione-1Scrivi 10s linear infinite; animation-delay:0s; }
@keyframes animazione-1Scrivi{0%{transform:translateX(0px);opacity:0}5%{transform:translateX(413px) scale(1,1);opacity:1}7.5%{transform:translateX(413px) scale(1.5,1.5);opacity:1}10%{transform:translateX(413px) scale(1,1);opacity:1}15%{transform:translateX(1010px);opacity:0}100%{transform:translateX(0px);opacity:0}}
#img-2Cancella { position:absolute; top:0px; left:0px; width:291px; height:89px; background:url(../img/img-2Cancella.png) top left no-repeat }
.animate-2Cancella {animation:animazione-2Cancella 10s linear infinite; animation-delay:0s; }
@keyframes animazione-2Cancella{0%{transform:translateX(0px);opacity:0}15%{transform:translateX(0px);opacity:0}20%{transform:translateX(360px) scale(1,1);opacity:1}22.5%{transform:translateX(360px) scale(1.5,1.5);opacity:1}25%{transform:translateX(360px) scale(1,1);opacity:1}30%{transform:translateX(1010px);opacity:0}100%{transform:translateX(0px);opacity:0}}
#img-3Riscrivi { position:absolute; top:0px; left:0px; width:275px; height:89px; background:url(../img/img-3Riscrivi.png) top left no-repeat }
.animate-3Riscrivi {animation:animazione-3Riscrivi 10s linear infinite; animation-delay:0s; }
@keyframes animazione-3Riscrivi{0%{transform:translateX(0px);opacity:0}30%{transform:translateX(0px);opacity:0}35%{transform:translateX(368px) scale(1,1);opacity:1}37.5%{transform:translateX(368px) scale(1.5,1.5);opacity:1}40%{transform:translateX(368px) scale(1,1);opacity:1}45%{transform:translateX(1010px);opacity:0}100%{transform:translateX(0px);opacity:0}}
#img-123 { position:absolute; top:0px; left:105px; width:800px; height:89px; background:url(../img/img-123.png) top left no-repeat }
.animate-123 {animation:animazione-123 10s linear infinite; animation-delay:0s; }
@keyframes animazione-123{0%{transform:scale(0,0);opacity:0}45%{transform:scale(0,0);opacity:0}50%{transform:scale(1,1);opacity:1}90%{transform:scale(1,1);opacity:1}100%{transform:scale(0,0);opacity:0}}

#img-Log-Touch { position:absolute; top:50px; left:50px; width:616px; height:458px; background:url(../img/img-Log-Touch.png) top left no-repeat;}
#img-Emoticon-Log { position:absolute; top:50px; left:130px; width:98px; height:114px; background:url(../img/img-Emoticon-Log1.png) top left no-repeat;}
.animate-Emoticon-Log {animation:Emoticon-Log 5s linear infinite; animation-delay:0s; }
@keyframes Emoticon-Log{0%{background:url(../img/img-Emoticon-Log1.png) top left no-repeat;}90%{background:url(../img/img-Emoticon-Log1.png) top left no-repeat;}100%{background:url(../img/img-Emoticon-Log2.png) top left no-repeat;}}
#img-Touch-Plus { position:absolute; bottom:30px; right:30px; width:588px; height:601px; background:url(../img/img-Touch-Plus.png) top left no-repeat;}
#img-Touch-App { position:absolute; bottom:240px; right:315px; width:95px; height:95px; background:url(../img/img-Touch-App.png) top left no-repeat; background-size:cover; }
/* ANIMAZIONE APP */
.animate-Scale-App {animation:scale-App 1.5s linear infinite; animation-delay:0s; }
@keyframes scale-App{0%{transform:scale(1,1)}50%{transform:scale(1.5,1.5)}100%{transform:scale(1,1)}}
#img-Touch-Penna { position:absolute; top:30px; right:30px; width:334px; height:356px; background:url(../img/img-Touch-Penna.png) top left no-repeat; }
#img-Touch-Emoticon1 { position:absolute; bottom:90px; right:30px; width:250px; height:250px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
#img-Touch-Emoticon2 { position:absolute; bottom:40px; right:180px; width:150px; height:150px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
#img-Touch-Emoticon3 { position:absolute; bottom:80px; right:320px; width:90px; height:90px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
#img-Touch-Emoticon4 { position:absolute; bottom:320px; right:170px; width:100px; height:100px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
#img-Touch-Emoticon5 { position:absolute; bottom:370px; right:25px; width:180px; height:180px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
#img-Touch-Emoticon6 { position:absolute; bottom:480px; right:220px; width:130px; height:130px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover; }
/* ANIMAZIONE EMOTICON */
.animate-1-Rotation-Emoticon {animation:rotation-Emoji-1 9s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-1{0%{transform:rotate(0deg) translateY(0px); width:250px; height:250px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(45deg) translateY(-10px); width:250px; height:250px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:250px; height:250px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(0deg)translateY(0px); width:250px; height:250px; background:url(../img/emoticon-3.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-45deg) translateY(10px); width:250px; height:250px; background:url(../img/emoticon-3.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:250px; height:250px; background:url(../img/emoticon-3.png) top left no-repeat; background-size:cover;}}
.animate-2-Rotation-Emoticon {animation:rotation-Emoji-2 4s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-2{0%{transform:rotate(0deg) translateY(0px); width:150px; height:150px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(45deg) translateY(-10px); width:150px; height:150px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:150px; height:150px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(0deg)translateY(0px); width:150px; height:150px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-45deg) translateY(10px); width:150px; height:150px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:150px; height:150px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}}
.animate-3-Rotation-Emoticon {animation:rotation-Emoji-3 6s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-3{0%{transform:rotate(0deg) translateY(0px); width:90px; height:90px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(30deg) translateY(-10px); width:90px; height:90px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:90px; height:90px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(0deg)translateY(0px); width:90px; height:90px; background:url(../img/emoticon-4.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-30deg) translateY(10px); width:90px; height:90px; background:url(../img/emoticon-4.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:90px; height:90px; background:url(../img/emoticon-4.png) top left no-repeat; background-size:cover;}}
.animate-4-Rotation-Emoticon {animation:rotation-Emoji-4 5s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-4{0%{transform:rotate(0deg) translateY(0px); width:100px; height:100px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(45deg) translateY(-10px); width:100px; height:100px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:100px; height:100px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(180px)translateY(180px); width:100px; height:100px; background:url(../img/emoticon-5.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-45deg) translateY(10px); width:100px; height:100px; background:url(../img/emoticon-5.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:100px; height:100px; background:url(../img/emoticon-5.png) top left no-repeat; background-size:cover;}}
.animate-5-Rotation-Emoticon {animation:rotation-Emoji-5 7s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-5{0%{transform:rotate(0deg) translateY(0px); width:180px; height:180px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(50deg) translateY(-10px); width:180px; height:180px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:180px; height:180px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(180px)translateY(180px); width:180px; height:180px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-50deg) translateY(10px); width:180px; height:180px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:180px; height:180px; background:url(../img/emoticon-2.png) top left no-repeat; background-size:cover;}}
.animate-6-Rotation-Emoticon {animation:rotation-Emoji-6 8s linear infinite; animation-delay:0s; }
@keyframes rotation-Emoji-6{0%{transform:rotate(0deg) translateY(0px); width:130px; height:130px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}25%{transform:rotate(20deg) translateY(-10px); width:130px; height:130px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}49%{width:130px; height:130px; background:url(../img/emoticon-1.png) top left no-repeat; background-size:cover;}50%{transform:rotate(180px)translateY(180px); width:130px; height:130px; background:url(../img/emoticon-6.png) top left no-repeat; background-size:cover;}75%{transform:rotate(-20deg) translateY(10px); width:130px; height:130px; background:url(../img/emoticon-6.png) top left no-repeat; background-size:cover;}100%{transform:rotate(0deg) translateY(0px); width:130px; height:130px; background:url(../img/emoticon-6.png) top left no-repeat; background-size:cover;}}
#img-Touch-Emoticon1:hover, #img-Touch-Emoticon2:hover, #img-Touch-Emoticon3:hover, #img-Touch-Emoticon4:hover, #img-Touch-Emoticon5:hover, #img-Touch-Emoticon6:hover {animation:scale-Emoticon 0.5s linear infinite; animation-delay:0s; }
@keyframes scale-Emoticon{0%{transform:scale(1,1)}50%{transform:scale(1.3,1.3)}100%{transform:scale(1,1)}}

#img-Log-Duo { position:absolute; top:40px; left:50px; width:528px; height:469px; background:url(../img/img-Log-Duo.png) top left no-repeat;}
#img-Bagliore-Duo { position:absolute; top:35px; left:45px; width:528px; height:97px; background:url(../img/img-Bagliore-Duo.png) top left no-repeat;}
.animate-Bagliore-Duo {animation:Bagliore-Duo 0.5s linear infinite; animation-delay:0s; }
@keyframes Bagliore-Duo{0%{opacity:1}50%{opacity:0}100%{opacity:1}}
#img-BolloNovita-Duo { position:absolute; bottom:40px; left:300px; width:238px; height:208px; background:url(../img/img-Bollo-Novita.png) top left no-repeat;}
.animate-BolloNovita-Duo { animation:BolloNovita-Duo 1s ease-in infinite; animation-delay:0s; }
@keyframes BolloNovita-Duo{0%{transform:scale(0.5,0.5)}50%{transform:scale(0.9,0.9)}100%{transform:scale(0.5,0.5)}}
#img-Plus-Duo { position:absolute; bottom:40px; right:30px; width:265px; height:191px; background:url(../img/img-Un-Twist.png) top left no-repeat;}
#img-ArrowGreen-Duo { position:absolute; bottom:270px; right:70px; width:357px; height:306px; background:url(../img/img-ArrowGreen-Duo.png) top left no-repeat;}
/*ANIMAZIONE ROTATE DUO */
.animate-Rotation {animation:rotation 15s linear infinite; animation-delay:0s; }
@keyframes rotation{0%{transform:rotate(0deg); background:url(../img/img-ArrowGreen-Duo.png) top left no-repeat;}40%{transform:rotate(0deg); background:url(../img/img-ArrowGreen-Duo.png) top left no-repeat;}50%{transform:rotate(-360deg); background:url(../img/img-ArrowRed-Duo.png) top left no-repeat;}90%{transform:rotate(-360deg); background:url(../img/img-ArrowRed-Duo.png) top left no-repeat;}100%{transform:rotate(-720deg)}}
#img-Duo { position:absolute; bottom:120px; right:40px; width:448px; height:506px;}
/* ANIMAZIONE FADING DUO */
.animate-Fading-Duo { animation:fading-Duo 15s ease-in infinite; -moz-animation:fading-Duo 15s ease-in infinite; -webkit-animation:fading-Duo 15s ease-in infinite; }
@keyframes fading-Duo{
0%{opacity:1; -moz-opacity:1; -webkit-opacity:1; background:url(../img/img-Duo-NV.png) top left no-repeat}
46%{opacity:1; -moz-opacity:1; -webkit-opacity:1; background:url(../img/img-Duo-NV.png) top left no-repeat}
47%{opacity:0; -moz-opacity:0; -webkit-opacity:0; background:url(../img/img-Duo-NV.png) top left no-repeat}
48%{opacity:1; -moz-opacity:1; -webkit-opacity:1; background:url(../img/img-Duo-BR.png) top left no-repeat}
98%{opacity:1; -moz-opacity:1; -webkit-opacity:1; background:url(../img/img-Duo-BR.png) top left no-repeat}
99%{opacity:0; -moz-opacity:0; -webkit-opacity:0; background:url(../img/img-Duo-BR.png) top left no-repeat}
100%{opacity:1; -moz-opacity:1; -webkit-opacity:1; background:url(../img/img-Duo-NV.png) top left no-repeat}
}
#img-Tappo-Duo { position:absolute; top:505px; left:30px; width:157px; height:134px; background:url(../img/img-Tappo-Duo.png) top left no-repeat;}
/* ANIMAZIONE TAPPO DUO */
.animate-Tappo-Duo { animation:Tappo-Duo 8s ease-in-out infinite; animation-delay:0s; }
@keyframes Tappo-Duo{0%{transform:translateX(0px)}20%{transform:translateX(140px)}40%{transform:translateX(0px)}100%{transform:translateX(0px)}}
#img-Operazione { position:absolute; top:515px; left:190px; width:76px; height:44px; background:url(../img/img-Operazione.png) top left no-repeat;}
#img-Risultato { position:absolute; top:510px; left:260px; width:38px; height:44px; background:url(../img/Risultato-Errato.png) top left no-repeat;}
/* ANIMAZIONE OPERAZIONE DUO */
.animate-Operazione-Duo { animation:Operazione-Duo 8s ease-in-out infinite; animation-delay:0s; }
@keyframes Operazione-Duo{0%{background:url(../img/Risultato-Errato.png) top left no-repeat; opacity:1}19%{background:url(../img/Risultato-Errato.png) top left no-repeat; opacity:1}20%{background:url(../img/Risultato-Errato.png) top left no-repeat; opacity:0}100%{background:url(../img/Risultato-Errato.png) top left no-repeat; opacity:0}}
#img-Risultato-Corretto { position:absolute; top:510px; left:260px; width:38px; height:44px; background:url(../img/Risultato-Corretto.png) top left no-repeat;}
.animate-Operazione2-Duo { animation:Operazione2-Duo 8s ease-in-out infinite; animation-delay:0s; }
@keyframes Operazione2-Duo{0%{background:url(../img/Risultato-Corretto.png) top left no-repeat; opacity:0; transform:scale(0.2,0.2)}30%{background:url(../img/Risultato-Corretto.png) top left no-repeat; opacity:0; transform:scale(0.2,0.2)}40%{background:url(../img/Risultato-Corretto.png) top left no-repeat; opacity:1; transform:scale(1,1)}100%{background:url(../img/Risultato-Corretto.png) top left no-repeat; opacity:1; transform:scale(1,1)}}

#img-Log-Gomma { position:absolute; top:0px; left:0px; width:490px; height:655px; background:url(../img/img-Gomma.png) top left no-repeat; background-size:cover }
#img-Gomma-Fluo { position:absolute; top:300px; left:100px; width:350px; height:350px; background:url(../img/img-Gomma-Fluo.png) top left no-repeat; background-size:cover }
.animate-Gomma-Fluo { animation:Gomma-Fluo 8s linear infinite; animation-delay:0s; }
@keyframes Gomma-Fluo{0%{transform:rotate(0deg)}2%{transform:rotate(15deg)}4%{transform:rotate(-15deg)}6%{transform:rotate(15deg)}8%{transform:rotate(-15deg)}10%{transform:rotate(15deg)}12%{transform:rotate(-15deg)}14%{transform:rotate(15deg)}16%{transform:rotate(-15deg)}18%{transform:rotate(15deg)}20%{transform:rotate(-15deg)}22%{transform:rotate(15deg)}24%{transform:rotate(-15deg)}26%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
#img-Gomma-Scarabocchio { position:absolute; top:270px; left:30px; width:145px; height:189px; background:url(../img/img-Scarabocchio.png) top left no-repeat; background-size:cover }
.animate-Gomma-Scarabocchio { animation:Gomma-Scarabocchio 8s ease-in-out infinite; animation-delay:0s; }
@keyframes Gomma-Scarabocchio{0%{opacity:1}6%{opacity:1}22%{opacity:0}98%{opacity:0}100%{opacity:1}}
#img-Scuola { position:absolute; top:290px; left:55px; width:247px; height:122px; background:url(../img/img-Scuola.png) top left no-repeat; background-size:cover }
#img-Squola { position:absolute; top:290px; left:55px; width:247px; height:122px; background:url(../img/img-Squola.png) top left no-repeat; background-size:cover }

#img-Refill { position:absolute; top:0px; left:520px; width:490px; height:655px; background:url(../img/img-Refill.png) top left no-repeat; background-size:cover }
#img-Refill-Rosso {position:absolute; top:280px; left:40px; width:420px; height:366px; background:url(../img/img-Refill-Rosso.png) top left no-repeat; background-size:cover}
.animate-Refill {animation:Refill 10s infinite; animation-delay:0s;}
@keyframes Refill{
0%{opacity:0; background:url(../img/img-Refill-Rosso.png) top left no-repeat}3.5%{opacity:1; background:url(../img/img-Refill-Rosso.png) top left no-repeat}18%{opacity:1; background:url(../img/img-Refill-Rosso.png) top left no-repeat}21.5%{opacity:0; background:url(../img/img-Refill-Rosso.png) top left no-repeat}
22%{opacity:0; background:url(../img/img-Refill-Blu.png) top left no-repeat}25.5%{opacity:1; background:url(../img/img-Refill-Blu.png) top left no-repeat}43.5%{opacity:1; background:url(../img/img-Refill-Blu.png) top left no-repeat}47%{opacity:0; background:url(../img/img-Refill-Blu.png) top left no-repeat}
47.5%{opacity:0; background:url(../img/img-Refill-Nero.png) top left no-repeat}51%{opacity:1; background:url(../img/img-Refill-Nero.png) top left no-repeat}69%{opacity:1; background:url(../img/img-Refill-Nero.png) top left no-repeat}72.5%{opacity:0; background:url(../img/img-Refill-Nero.png) top left no-repeat}
73%{opacity:0; background:url(../img/img-Refill-Verde.png) top left no-repeat}76.5%{opacity:1; background:url(../img/img-Refill-Verde.png) top left no-repeat}94.5%{opacity:1; background:url(../img/img-Refill-Verde.png) top left no-repeat}100%{opacity:0; background:url(../img/img-Refill-Verde.png) top left no-repeat}}

#img-Log-Slide { position:absolute; top:40px; left:100px; width:634px; height:166px; background:url(../img/img-Log-Slide.png) top left no-repeat;}
/*ANIMAZIONE FADING*/
.animate-Fading {animation:fading 13s linear}@keyframes fading{0%{opacity:0}10%{opacity:1}90%{opacity:1}100%{opacity:0}}
/*PULSANTI DI SELEZIONE*/
#ConteinerBtnNavSlide { position:absolute; top:560px; left:297px; }
#BtnNavSlide { width:21px; height:21px; margin:10px; display:inline-block; cursor:pointer; background: url(../img/ico-Nav-Slide.png) bottom left no-repeat; }
#BtnNavSlide:hover { background:url(../img/ico-Nav-Slide.png) top left no-repeat; }
.BtnNavSlideSelect { width:21px; height:21px; margin:10px; display:inline-block; cursor:pointer; background:url(../img/ico-Nav-Slide.png) top left no-repeat !important}

#btnScrollUp { display: none; position: fixed; width:55px; height:58px; background: url(../img/btn-ScrollUp.png) center center no-repeat; bottom: 30px; right: 30px; background-size:cover; border: none; outline: none; z-index: 9999; }
#btnScrollUp:hover { animation-name: transcaling; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite; cursor: pointer; -moz-transform:scale(1.5,1.5); }
/*ANIMAZIONE TRASCALING*/
@keyframes transcaling{0%{-moz-transform:scale(1,1);}50%{-moz-transform:scale(1.5,1.5);}100%{-moz-transform:scale(1,1);}}

}