@charset "utf-8";
	/* CSS Document */
	
	@media screen and (max-width: 400px){
			div.CaixaAzul {
				width: 280px;
				height: 190px;
				display: block;
				padding: 5px;
				color:#000;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#29a1ed;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAzul.jpg);
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaVerde {
				width: 280px;
				height: 190px;
				display: block;
				padding: 5px;
				color:#000;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#3C0;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVerde.jpg);
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaCinza {
				width: 280px;
				height: 190px
				display: block;
				padding: 5px;
				color:#000;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#CCC;
				background-position: center; 
				background-image:url(../imagens/elements/fundoCinza.jpg);
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
	
			div.CaixaVermelha {
				width: 280px;
				height: 190px
				display: block;
				padding: 5px;
				color:#000;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVermelho.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#F00;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}

			div.CaixaAmarelo {
				width: 280px;
				height: 190px
				display: block;
				padding: 5px;
				color:#000;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAmarelo.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#FF0;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
		
			div.deviceOff {
				width: 80px;
				height: 80px;
				position: absolute;
				padding: 2px;
				margin-left: 0px;
				margin-top:-2px;
				margin-botton: 0px;
				border: 0px solid gray;
			}
			div.deviceVe {
				width: 80px;
				height: 50px;
				position: absolute;
				padding: 2px;
				margin-left: 45px;
				margin-top: -17px;
				margin-botton: 0px;
				border: 0px solid gray;
				-ms-transform: scale(0.5, 0.5); /* IE 9 */
				-webkit-transform: scale(0.5, 0.5); /* Safari */
				transform: scale(0.5, 0.5);
			}
			
			div.deviceLogo {
				width: 80px;
				height: 80px;
				position: absolute;
				margin-left: -5px;
				margin-top: -10px;
				border: 0px solid gray;
				-ms-transform: scale(0.8, 0.8); /* IE 9 */
				-webkit-transform: scale(0.8, 0.8); /* Safari */
				transform: scale(0.8, 0.8);
				border: 0px solid;
			}
	
			div.tituloNum {
				display: block;
				width: 90%;
				margin-top: 5px;
				margin-left: 10px;
				text-align: right;
				font-size: 13px;
				border: 0px solid black;
			}
			div.tituloNome {
				width: 90%;
				display: block;
				padding: 8px;
				right: 200px;
				top: 0px;
				margin-bottom: 10px;
				text-align: right;
				font-size: 15px;
				border: 0px solid gray;
				color: #000;
			}
			div.staticVermelho {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#FF4040;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticVerde {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#28DE1F;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticCinza {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#666;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
			}
	
			/************************************************************** CAIXA CONTATO ******/
		
			button.contatto {
				width:130px;  
				height:130px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact.png); /* imagem máscara */
			}
			button.contatto:hover { 
				width:150px;  
				height:150px;
				margin-left: -10px;
				margin-top: -10px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact2.png); /* imagem máscara */
				background-size: 101% 101%;
			}
			/*--------------------------------------------------- Botão Histórico ---------*/
			buttonn.Histbuttonn {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				width: 180px;
				height: 50px;
				display: block;
				text-decoration: none;
				border: none;
				width:130px;  
				height:130px;
				background:url(../imagens/log.png) 0 0 no-repeat;	 /* imagem máscara */
			}
			buttonn.Histbuttonn:hover { 
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				display: inline-block;
				text-decoration: none;
				border: none;
				width:130px;  
				cursor:pointer;
				height:130px;
				text-decoration: none;
				background:url(../imagens/log2.png) 0 0 no-repeat;	; /* imagem máscara */
			}
	}
	@media screen and (min-width: 501px) and (max-width: 900px){
		div.CaixaAzul {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#3C0;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAzul400.jpg);
				
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaVerde {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#3C0;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVerde400.jpg);
				
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaCinza {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px 5px 5px 5px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#CCC;
				background-position: center; 
				background-image:url(../imagens/elements/fundoCinza400.jpg);
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
	
			div.CaixaVermelha {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVermelho400.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#F00;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			div.CaixaAmarelo {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAmarelo400.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#FF0;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
		
			div.deviceOff {
				width: 80px;
				height: 80px;
				position: absolute;
				padding: 2px;
				margin-left: 0px;
				margin-top:-2px;
				margin-botton: 0px;
				border: 0px solid gray;
			}
			div.deviceVe {
				width: 80px;
				height: 50px;
				position: absolute;
				padding: 2px;
				margin-left: 45px;
				margin-top: -17px;
				margin-botton: 0px;
				border: 0px solid gray;
				-ms-transform: scale(0.5, 0.5); /* IE 9 */
				-webkit-transform: scale(0.5, 0.5); /* Safari */
				transform: scale(0.5, 0.5);
			}
			div.deviceLogo {
				width: 80px;
				height: 80px;
				position: absolute;
				margin-left: -5px;
				margin-top: -10px;
				border: 0px solid gray;
				-ms-transform: scale(0.8, 0.8); /* IE 9 */
				-webkit-transform: scale(0.8, 0.8); /* Safari */
				transform: scale(0.8, 0.8);
				border: 0px solid;
			}
	
			div.tituloNum {
				display: block;
				width: 90%;
				margin-top: 5px;
				margin-left: 10px;
				text-align: right;
				font-size: 13px;
				border: 0px solid black;
				color: #000;
			}
			div.tituloNome {
				width: 90%;
				display: block;
				padding: 8px;
				right: 200px;
				top: 0px;
				margin-bottom: 10px;
				text-align: right;
				font-size: 15px;
				border: 0px solid gray;
				color: #000;
			}
			div.staticVermelho {
				width: 390px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#F00;
				margin: 3px;
				text-align: center;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticVerde {
				width: 390px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#090;
				margin: 3px;
				text-align: center;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticCinza {
				width: 390px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#999;
				margin: 3px;
				text-align: center;
				font-size:13px;
				border-radius: 6px;
				color:#000;
			}
	
			/************************************************************** CAIXA CONTATO ******/
		
			button.contatto {
				width:130px;  
				height:130px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact.png); /* imagem máscara */
			}
			button.contatto:hover { 
				width:150px;  
				height:150px;
				margin-left: -10px;
				margin-top: -10px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact2.png); /* imagem máscara */
				background-size: 101% 101%;
			}
			/*--------------------------------------------------- Botão Histórico ---------*/
			buttonn.Histbuttonn {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				width: 180px;
				height: 50px;
				display: block;
				text-decoration: none;
				border: none;
				width:130px;  
				height:130px;
				background:url(../imagens/log.png) 0 0 no-repeat;	 /* imagem máscara */
			}
			buttonn.Histbuttonn:hover { 
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				display: inline-block;
				text-decoration: none;
				border: none;
				width:130px;  
				cursor:pointer;
				height:130px;
				text-decoration: none;
				background:url(../imagens/log2.png) 0 0 no-repeat;	; /* imagem máscara */
			}
	}
	@media screen and (min-width: 901px){
		 div.CaixaAzul {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#29a1ed;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAzul400.jpg);
				
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaVerde {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#3C0;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVerde400.jpg);
				
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
			div.CaixaCinza {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px 5px 5px 5px;
				margin: 0px 0px 0px 10px;
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#CCC;
				background-position: center; 
				background-image:url(../imagens/elements/fundoCinza400.jpg);
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
	
			div.CaixaVermelha {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoVermelho400.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#F00;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			div.CaixaAmarelo {
				width: 400px;
				height: 190px
				display: block;
				padding: 5px;
				padding-bottom:0px;
				margin: 0px;
				margin-left:0;
				margin-top:0px;
				background-position: center; 
				background-image:url(../imagens/elements/fundoAmarelo400.jpg);
				border-radius: 2em 0em 1em 0em;
				border: 2px solid;
				border-color:#FF0;
				-moz-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				-webkit-box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
				box-shadow:
					0px 0px 10px rgba(000,000,000,0.5),
					inset 0px 0px 3px rgba(0,0,0,0.5);
			}
			
		
			div.deviceOff {
				width: 80px;
				height: 80px;
				position: absolute;
				padding: 2px;
				margin-left: 0px;
				margin-top:-2px;
				margin-botton: 0px;
				border: 0px solid gray;
			}
			div.deviceVe {
				width: 80px;
				height: 50px;
				position: absolute;
				padding: 2px;
				margin-left: 45px;
				margin-top: -17px;
				margin-botton: 0px;
				border: 0px solid gray;
				-ms-transform: scale(0.5, 0.5); /* IE 9 */
				-webkit-transform: scale(0.5, 0.5); /* Safari */
				transform: scale(0.5, 0.5);
			}
			div.deviceLogo {
				width: 80px;
				height: 80px;
				position: absolute;
				margin-left: -5px;
				margin-top: -10px;
				border: 0px solid gray;
				-ms-transform: scale(0.8, 0.8); /* IE 9 */
				-webkit-transform: scale(0.8, 0.8); /* Safari */
				transform: scale(0.8, 0.8);
				border: 0px solid;
			}
	
			div.tituloNum {
				display: block;
				width: 90%;
				margin-top: 5px;
				margin-left: 10px;
				text-align: right;
				font-size: 13px;
				border: 0px solid black;
				color: #000;
			}
			div.tituloNome {
				width: 90%;
				display: block;
				padding: 8px;
				right: 200px;
				top: 0px;
				margin-bottom: 10px;
				text-align: right;
				font-size: 15px;
				border: 0px solid gray;
				color: #000;
			}
			div.staticVermelho {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#FF4040;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticVerde {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#28DE1F;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
			}
			
			div.staticCinza {
				width: 255px;
				display: block;
				padding: 2px;
				border: 1px solid;
				border-color:#666;
				margin: 3px;
				text-align: left;
				font-size:13px;
				border-radius: 6px;
				color:#000;
			}
	
			/************************************************************** CAIXA CONTATO ******/
		
			button.contatto {
				width:130px;  
				height:130px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact.png); /* imagem máscara */
			}
			button.contatto:hover { 
				width:150px;  
				height:150px;
				margin-left: -10px;
				margin-top: -10px;
				display: block;
				cursor:pointer;
				border: none;
				background-repeat: no-repeat;
				background:url(../imagens/LocalContact2.png); /* imagem máscara */
				background-size: 101% 101%;
			}
			/*--------------------------------------------------- Botão Histórico ---------*/
			buttonn.Histbuttonn {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				width: 180px;
				height: 50px;
				display: block;
				text-decoration: none;
				border: none;
				width:130px;  
				height:130px;
				background:url(../imagens/log.png) 0 0 no-repeat;	 /* imagem máscara */
			}
			buttonn.Histbuttonn:hover { 
				font-family: Arial, Helvetica, sans-serif;
				font-size: 18px;
				display: inline-block;
				text-decoration: none;
				border: none;
				width:130px;  
				cursor:pointer;
				height:130px;
				text-decoration: none;
				background:url(../imagens/log2.png) 0 0 no-repeat;	; /* imagem máscara */
			}
	}