.button {
    background-color: #CCC !important;
    border: 1px solid #000;
    color: #000 !important;
    font-size: 18px;
    cursor: pointer;
    line-height: 54px;
    min-height: 54px;
    width: 120px;
    padding: 0 12px;
    text-align: center;
    vertical-align: top;
    display: inline-block;
    border-radius: 5px;
    vertical-align: middle;
}
.button:hover {
    background-color: #000 !important;
    border: 1px solid #CCC;
    color: #fff !important;	
}
/* Universal mobile media queries */
@media	only screen and (max-width: 1050px),
		only screen and (-webkit-min-device-pixel-ratio: 2),
		only screen and (-o-min-device-pixel-ratio: 20/10),
		only screen	and (min-device-pixel-ratio: 2){
	#sfondo01{
		width: 100% !important;
	}	
	#impianto1,
	#impianto2,
	#impianto3,
	#impianto4,
	#impianto5,
	#impianto6{
		width: 100% !important;
		position: relative !important;
		left: 0 !important;
		top: auto !important;
		height: auto !important;
	}	
.botright {
	text-align: center !important;
}	
#logo {
	position: relative;
	left: 0px !important;
	top: 0px !important;
}	
#login	{
	text-align: center !important;
	top: 10px !important;
	left: 0 !important;
}
	#logo,
	#indirizzo,
	#login{
		position: relative !important;
	}
	#logo {
		width: 100% !important;
		height: auto !important;
		text-align: center;
	}
	#logo img{
		width: 75% !important;
		height: auto !important;
		margin: 0 auto !important;
	}
	#indirizzo{
		top: 0 !important;
		margin: 0 auto;
	}
	#indirizzo{
		/*width: 100% !important;*/
		height: auto !important;
	}	
	#login{
		width: auto !important;
	}
	#webcamimg{
		display: none;
	}
	#webcamimg1{
		display: block !important;
	}
#indirizzo {
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    left: 0px !important;
    padding: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 30px;
    padding-left: 0px;
    margin: 0px !important;
}
.indinterno {
    width: 90% !important;	
    margin: 0px 5% !important;
    font-size: 18px;
    line-height: 26px;
}

	.testopic,
	.linkdatiallevamento{
		line-height: normal !important;
	}
	
	
	.webcamimg{
		width: 100% !important;
		height: auto !important;
	}
}

/*  Retina media query.
    Overrides styles for devices with a 
    device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */
@media	only screen and (-webkit-min-device-pixel-ratio: 2),
		only screen and (-o-min-device-pixel-ratio: 20/10),
		only screen	and (min-device-pixel-ratio: 2){
	#testoimpianto1,
	#testoimpianto2,
	#testoimpianto3,
	#testoimpianto4,
	#linkimpianto1 a,
	#linkimpianto2 a,
	#linkimpianto3 a,
	#linkimpianto4 a,
	.testocol,
	.testobia,
	.testo,
	.testo span,
	.testo a,
	.login_box,
	.login_box a,
	.login_input,
	.testopic,
	.linkdatiallevamento{
		font-size: 17px;
		line-height: 36px;
	}
}

/* phone portrait (real resolution / device-pixel-ratio is considered) (used by IPhone (???)) */
@media (max-width: 319px) {
	#testoimpianto1,
	#testoimpianto2,
	#testoimpianto3,
	#testoimpianto4,
	#linkimpianto1 a,
	#linkimpianto2 a,
	#linkimpianto3 a,
	#linkimpianto4 a,
	.testocol,
	.testobia,
	.testo,
	.testo span,
	.testo a,
	.login_box,
	.login_box a,
	.login_input,
	.testopic,
	.linkdatiallevamento{
		font-size: 14px;
		line-height: 20px;
	}
	
	/* LAYOUT 1 COLONNA */
	#webcam_01,
	#webcam_02,
	#webcam_03,
	#webcam_04,
	#webcam_05,
	#webcam_06,
	#webcam_07,
	#webcam_08,
	#webcam_09,
	#webcam_10,
	#webcam_11,
	#webcam_12{
	width: 90% !important;
	padding-right: 0px;
	float: none !important;
	height: auto !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 5% !important;
	}
#impianto1, #impianto2, #impianto3, #impianto4, #impianto5, #impianto6 {
	background-image: none !important;
	width: 100% !important;
	margin: 0 auto !important;
}
.infocontainer {
    width: 90%;
    background-color:#ffffff;
    margin: 0 auto;
    padding: 0px;
}
.imgsfondoombra {
	display: none;
}
.webcamimg {
	border: 0px !important;
}
.infocontainer{
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 30px;
}
#login {
	height: 60px !important;
}
#indirizzo {
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    left: 0px !important;
    padding: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 30px;
    padding-left: 0px;
    margin: 0px !important;
}
.indinterno {
    width: 90% !important;	
    margin: 0px 5% !important;
    font-size: 12px;
    line-height: 18px;
}
.testo a:hover {
    font-size: 14px;
}
.indinterno a, .indinterno a:hover {
    font-size: 12px;
    line-height: 18px;
}
 .login_box, .login_box a,  .login_box a:hover {
    font-size: 12px;
    line-height: 18px;
    text-align: center;
}
.login_box{
		width: 90% !important;
		margin-top: 100px !important;
	}
.login_input{
		width: 90% !important;
		margin: 0 !important;
		padding: 0 !important;
}
}

@media (min-width: 320px) and (max-width: 479px)  {
	#testoimpianto1,
	#testoimpianto2,
	#testoimpianto3,
	#testoimpianto4,
	#linkimpianto1 a,
	#linkimpianto2 a,
	#linkimpianto3 a,
	#linkimpianto4 a,
	.testocol,
	.testobia,
	.testo,
	.testo span,
	.testo a,
	.login_box,
	.login_box a,
	.login_input,
	.testopic,
	.linkdatiallevamento{
		font-size: 14px;
		line-height: 20px;
	}
	
	/* LAYOUT 1 COLONNA */
	#webcam_01,
	#webcam_02,
	#webcam_03,
	#webcam_04,
	#webcam_05,
	#webcam_06,
	#webcam_07,
	#webcam_08,
	#webcam_09,
	#webcam_10,
	#webcam_11,
	#webcam_12{
	width: 90% !important;
	padding-right: 0px;
	float: none !important;
	height: auto !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 5% !important;
	}
#impianto1, #impianto2, #impianto3, #impianto4, #impianto5, #impianto6  {
	background-image: none !important;
	width: 100% !important;
	margin: 0 auto !important;
}
.infocontainer {
    width: 90%;
    background-color:#ffffff;
    margin: 0 auto;
    padding: 0px;
}
.imgsfondoombra {
	display: none;
}
.webcamimg {
	border: 0px !important;
}
.infocontainer{
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 60px;
}
#login {
	height: 60px !important;
}
#indirizzo {
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    left: 0px !important;
    padding: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 60px;
    padding-left: 0px;
    margin: 0px !important;
}
.indinterno {
    width: 90% !important;	
    margin: 0px 5% !important;
    font-size: 14px;
    line-height: 20px;
}
.testo a:hover {
    font-size: 14px;
}
.indinterno a {
    font-size: 14px;
    line-height: 20px;	
}
 .login_box, .login_box a {
    font-size: 14px;
    line-height: 20px;
    text-align: center;
}
.login_box{
		width: 90% !important;
		margin-top: 100px !important;
	}
.login_input{
		width: 90% !important;
		margin: 0 !important;
		padding: 0 !important;
}
}





/* phone landscape (real resolution / device-pixel-ratio is considered) */
@media (min-width: 480px) and (max-width: 767px) {
	#testoimpianto1,
	#testoimpianto2,
	#testoimpianto3,
	#testoimpianto4,
	#linkimpianto1 a,
	#linkimpianto2 a,
	#linkimpianto3 a,
	#linkimpianto4 a,
	.testocol,
	.testobia,
	.testo,
	.testo span,
	.testo a,
	.login_box,
	.login_box a,
	.login_input,
	.testopic,
	.linkdatiallevamento{
		font-size: 18px;
		line-height: 26px;
	}
.testo a:hover {
    font-size: 18px;
}	
	/* LAYOUT 1 COLONNA */
	#webcam_01,
	#webcam_02,
	#webcam_03,
	#webcam_04,
	#webcam_05,
	#webcam_06,
	#webcam_07,
	#webcam_08,
	#webcam_09,
	#webcam_10,
	#webcam_11,
	#webcam_12{
	width: 90% !important;
	padding-right: 0px;
	float: none !important;
	height: auto !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 5% !important;
	}
#impianto1, #impianto2, #impianto3, #impianto4, #impianto5, #impianto6 {
	background-image: none !important;
	width: 100% !important;
	margin: 0 auto !important;
}
.infocontainer {
    width: 90%;
    background-color:#ffffff;
    margin: 0 auto;
    padding: 0px;
}
.imgsfondoombra {
	display: none;
}
.webcamimg {
	border: 0px !important;
}
.infocontainer{
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 90px;
}
#login {
	height: 60px !important;
}
#indirizzo {
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    left: 0px !important;
    padding: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 90px;
    padding-left: 0px;
    margin: 0px !important;
}
.indinterno {
    width: 90% !important;	
    margin: 0px 5% !important;
}
.login_box{
		width: 70% !important;
		margin-top: 100px !important;
	}
.login_input{
		width: 90% !important;
		margin: 0 !important;
		padding: 0 !important;
}
#loginbutton,
.login_input{
		font-size: 16px;
}
 .login_box, .login_box a {
    font-size: 14px;
    line-height: 20px;
    text-align: center;
}
}





/* tablet portrait + landscape (real resolution / device-pixel-ratio is considered) (used by IPad both portrait and landscape) */
@media (min-width: 768px) and (max-width: 1050px) {
	#testoimpianto1,
	#testoimpianto2,
	#testoimpianto3,
	#testoimpianto4,
	#linkimpianto1 a,
	#linkimpianto2 a,
	#linkimpianto3 a,
	#linkimpianto4 a,
	.testocol,
	.testobia,
	.testo,
	.testo span,
	.testo a,
	.login_box,
	.login_box a,
	.login_box a:hover,
	.testopic,
	.linkdatiallevamento{
		font-size: 18px;
		line-height: 26px;
		text-align: center;
	}
.testo a:hover {
    font-size: 18px;
}
#indirizzo {
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    left: 0px !important;
    padding: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 30px;
    padding-left: 0px;
    margin: 0px !important;
}
.indinterno {
    width: 90% !important;	
    margin: 0px 5% !important;
    font-size: 18px;
    line-height: 26px;
}
.botright {
	text-align: center !important;
}
}