html { height:100%; }
		body { height:100%;width: 100%; overflow:hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }

		#villyInfoBackground, #comuneInfoBackground{
			z-index:1;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			display:flex;
			justify-content: center;
			align-items: center;
			background-color:rgba(0, 0, 0, 0.85);
		}

		#InfoBackgroundImage{
			height: 80%; 
			max-height: 80vw;
		}

		#villyInfoButton, #comuneInfoButton{
			z-index:1;
			position: absolute;
			top: 5px;
			right: 5px;
			width: 30px;
			height: 30px;
			background-image: url(../CARATTERI_LOGHI/infoIcon.png);
			background-size: contain;
			background-position: center;
			background-repeat: no-repeat;
		}

		#openingOverlay, #endingOverlay{
			z-index:9997;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			/* height: auto; */
			background-image: url(../IMAGES/Apertura_1920_oriz/sfondo_1920.png);
			background-size: cover;
			background-position: center;
		}

		#endingOverlay{
			background-image: url(../IMAGES/Chiusura_1920_oriz/sfondo_1920_oriz.png);
			display:none;
		}

		#videoBackground{
			z-index:9999;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color:rgba(0,0,0,0.85);
			display:none;
		}

		#openingImageContainer, #endingImageContainer{
			position: absolute;
			height: 90%;
			max-width: 95%;
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			margin: auto;
			background-position: center;
		 	background-repeat: no-repeat;
		 	background-size: contain;
		 	background-image: url(../IMAGES/Apertura_1920_oriz/scritta_loghi_1920_oriz.png);
		}

		#openingValleLogo,#endingValleLogo{
			position: absolute;
			bottom: 10px;
			right: 0;
			width: 125px;
			height: 125px;
			margin: auto;
			background-position: center;
		 	background-repeat: no-repeat;
		 	background-size: contain;
		 	background-image: url(../CARATTERI_LOGHI/logo_valle.png);
		}

		#openingGreenBand, #endingGreenBand{
		 z-index:9998;
		 position: absolute;
		 top: 31%;
		 left: 0;
		 right: 0;
		 /*bottom: 0;*/
		 margin: auto;
		 width: 100%;
		 height: 28%;
		 background-color: rgba(121,147,59,0.7)
		}

		#endingGreenBand{
		 height: 50%;
		}


		#openingBottomText, #endingBottomText{
		 z-index: 9998;
		 position: absolute;
		 /*top: 20%;*/
		 left: 0;
		 right: 0;
		 bottom: 0;
		 margin: auto;
		 width: 70%;
		 height: 15%;
		 background-position: center;
		 background-repeat: no-repeat;
		 background-size: contain;
		 background-image: url(../IMAGES/Apertura_1920_oriz/scrittabasso_1920.png);
		}

		#endingBottomText{
		 background-image: url(../IMAGES/Chiusura_1920_oriz/scritta_1920_oriz.png);
		}

		#enterSabot, #skipSabot{
			z-index: 9998;
			position: absolute;
			bottom: 20%;
			left: 0%;
			right: 0;
			margin: auto;
			width: 60%;
			height: 10%;
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			background-image: url(../IMAGES/Apertura_1920_oriz/entra_1920_oriz.png);
		}

		#skipSabot{
		 bottom: 5%;
		 left: 60%;
		 background-image: url(../IMAGES/Apertura_1920_oriz/skip_video.png);
		 z-index:99999;
         display:none;
		}


		#endingComuneLogo{
		 z-index:9998;
		 top: 10%;
		 right: 0;
		 left: 0;
		 width: 25%;
		 height: 70%;
		 margin : auto;
		 position: absolute;
		 background-position: center;
		 background-repeat: no-repeat;
		 background-size: contain;
		 background-image: url(../IMAGES/Chiusura/logo_comune.png);
		}

		#endingGreenBoxText{
			z-index:9998;
			bottom: 2%;
			right: 0;
			left: 0;
			width: 60%;
			height: 10%;
			margin : auto;
			position: absolute;
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			background-image: url(../IMAGES/Chiusura/progetto_finanziato.png);
		}

		#restartSabot{
			z-index:9999;
			position: absolute;
			top: 37%;
			left: 20%;
			margin: auto;
			width: 24%;
			height: 12%;
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			background-image: url(../IMAGES/Chiusura/rivivi.png);	
		}

		#endSabot{
			z-index:9999;
			position: absolute;
			top: 37%;
			right: 20%;
			margin: auto;
			width: 24%;
			height: 12%;
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			background-image: url(../IMAGES/Chiusura/fine.png);	
		}


	@media only screen and (max-width: 1500px){
		#restartSabot{
			left: 15%;
		}	
		#endSabot{
			right: 15%;
		}
	}

	@media only screen and (max-width: 1200px){
		#restartSabot{
			left: 10%;
		}	
		#endSabot{
			right: 10%;
		}
	}

    
    @media only screen and (max-width: 1050px) {
		#skipSabot{
 			left: 0%;
		 }
		#infoBackground{
			background-size: 50%;
		}
	}

	@media only screen and (max-width: 800px) {
		#openingOverlay {
			background-image: url(../IMAGES/Apertura_2160_vert/sfondo_2160_vert.png);
			background-position:center bottom;
		}
		#endingOverlay{
			background-image: url(../IMAGES/Chiusura_2160_vert/sfonto_2160_vert.png);
			display:none;
		}
		#openingImageContainer{
			background-image: url(../IMAGES/Apertura_2160_vert/scritta_loghi_2160_vert.png);
		}
		#endingImageContainer{
			background-image: url(../IMAGES/Chiusura_2160_vert/loghi_2160_vert.png);
		}
		#openingBottomText{
			background-image: url(../IMAGES/Apertura_2160_vert/scritta_2160_vert.png);
		}
		#endingBottomText{
			background-image: url(../IMAGES/Chiusura_2160_vert/scritta_2160_vert.png);
		}
		#skipSabot{
			width: 50%;
		}
		#openingValleLogo{
			bottom: 20%;
			width: 100px;
			height: 100px;
		}
		#infoBackground{
			background-size: 60%;
		}
	}

		@media only screen and (max-width: 600px) {
			#openingOverlay {
				background-image: url(../IMAGES/Apertura_1920_vert/sfonto_1920_vert.png);
				background-position:center bottom;
			}
			#endingOverlay{
				background-image: url(../IMAGES/Chiusura_1920_vert/sfonto_1920_vert.png);
				display:none;
			}
			#openingImageContainer{
				background-image: url(../IMAGES/Apertura_1920_vert/scritta_loghi_1920_vert.png);
			}
			#endingImageContainer{
				background-image: url(../IMAGES/Chiusura_1920_vert/loghi_1920_vert.png);
			}
			#openingBottomText{
				background-image: url(../IMAGES/Apertura_1920_vert/scritta_1920_vert.png);
	 		}
			#endingBottomText{
				background-image: url(../IMAGES/Chiusura_1920_vert/scritta_1920_vert.png);
			}
			#skipSabot{
				width: 40%;
			}
			#endingComuneLogo{
				top: 0%;
			}
			#restartSabot{
				left: 20%;
				top: 53%;
	    	}	
			#endSabot{
				right: 20%;
				top: 53%;
			}
			#endingGreenBoxText{
				bottom: 1%;
				width: 80%;
				height: 15%;
			}		
			#openingValleLogo{
				width: 75px;
				height: 75px;
			}
			#endingValleLogo{
				width: 75px;
				height: 75px;
			 } 
			 #infoBackground{
				background-size: 75%;
			}
		}

		@media only screen and (max-width: 450px){
		  #endingComuneLogo{
			width: 30%;
			height: 85%;
		  }	
		  #openingValleLogo{
			width: 75px;
			height: 75px;
			bottom: 20%;
		  }
		  #endingValleLogo{
			width: 50px;
			height: 50px;
		  }
		}

		#video{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index:10000;
			display:none;
			padding:50px;
			box-sizing: border-box;
		}