@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400|Open+Sans');

html, body {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	overflow: hidden;
	font-family: 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

a {
	color: inherit;
	text-decoration: none;
}

h1 {
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
}

h2 {
	font-family: Verdana, Arial, sans-serif;
	font-size: 16px;
	line-height: 18px;
	margin-bottom: 16px;
}

h5 {
	font-family: Verdana, Arial, sans-serif;
	font-size: 9.3px;
	font-weight: normal;
	margin-top: -15px;
}

h6 {
	margin: 0 0 10px;
	padding: 0;
	line-height: 1px;
}

.hide {
	display: none;
	visibility: hidden;
}

.padding-bottom-fix {
	display: block;
	clear: both;
	float: left;
	width: 100%;
	height: 60px;
	background-color: inherit;
}

.subtitulo {
	margin-top: 10px;
	margin-bottom: 4px;
	color: #2e6ea9;
	font-size: 0.8em;
	font-weight: bold;
	font-style: italic;
}

.subtitulo:before {
	content: url(../imgs/bullet_arrow_right.png);
	display: inline-block;
	vertical-align: middle;
	margin-bottom: 5px;
}

.subtitulo-caminho {
	margin-top: -18px; 
	font-weight: normal; 
	width: 700px;
}

.input-text,
.combo-box,
.text-area {
	float: left;
	background: #fff;
	margin-bottom: 10px;
	padding: 6px;
	border: 1px solid #ccc;
	width: 100%;
	max-width: 320px;
	font-size: 14px;
	font-size-adjust: none;
}

.combo-box { height: 30px; }
.text-area { height: 75px; }

.botao-azul, 
.botao-vermelho, 
.botao-cinza,
.botao-verde {
	border: 1px solid;
	color: white;
	cursor: pointer;
	float: left;
	padding: 8px 0 !important;
	font-size: 14px;
	min-width: 120px;
	margin-right: 10px;
	text-align: center;
	line-height: 1em;
}

.botao-azul span,
.botao-vermelho span,
.botao-cinza span,
.botao-verde span {
	font-size: 1.5em;
	line-height: 1.5em;
}

.botao-azul img,
.botao-vermelho img,
.botao-cinza img,
.botao-verde img {
	margin-top: 4px;
}

.botao-azul {
	background-color: #357ae8;
	border-color: #4079d5;
	color: white;
}

.botao-azul:hover {
	background-color: #1f56b0;
	border-color: #2f5bb7;
	color: #fcfcfc;
}

.botao-vermelho {
	background-color: #dd4b39;
	border-color: #d14836;
}

.botao-vermelho:hover {
	background-color: #c53727;
	border-color: #b0281a;
	color: #fcfcfc;
}

.botao-cinza {
	background-color: #f1f1f1;
	border-color: #d9d9d9;
	color: #505050;
}

.botao-cinza:hover {
	background-color: #d9d9d9;
	border-color: #c6c6c6;
}

.botao-verde {
	background-color: #00b050;
	border-color: #019a47;
}

.botao-verde:hover {
	background-color: #019a47;
}

.only-icon-button {
	min-width: 60px !important;
	width: 60px !important;
	padding: 2px 0 4px !important;
}

.lista-dispositivos {
	margin: 10px;
}

.tabela-parametros,
.tabela-alarmes {
	border: 1px solid #ccc;
	border-bottom-width: 0;
	font-size: 0.7em;
	font-family: Verdana, Arial, sans-serif;
	margin-bottom: 15px;
	border-spacing: 0;
	width: 100%;
	background-color: #fff;
}

.tabela-parametros-header {
	background-color: #e8e8e8;
	border-bottom: 1px solid #ccc;
	color: #000 !important; 
	padding-left: 5px;
}

.tabela-parametros-parametro, 
.tabela-alarmes-parametro {
	padding: 10px;
	background-image: url(../imgs/fundo-parametro.png);
	background-repeat: repeat-y;
	border-bottom: 1px solid #ccc;
	font-weight: bold;
}

.tabela-parametros-hidden { display: none; }

.tabela-alarmes-parametro { font-weight: normal; }

.tabela-parametros-valor, 
.tabela-alarmes-led, 
.tabela-parametros-valor-hex {
	padding: 10px;
	border-bottom: 1px solid #ccc;
	color: #002f47;
	font-size: 1.1em;
}

.tabela-parametros-valor-offline {
	color: #c8c8c8;
}

.tabela-parametros-valor-hex {
	color: gray;
	width: 120px;
}

.tabela-alarmes-parametro, 
.tabela-alarmes-led {
	padding: 2.5px;
}

.tabela-alarmes-led {
	padding-left: 10px;
	padding-right: 10px;
}

.tabela-header-historico {
	padding: 5px;
	border-bottom: 1px solid gray; 
	font-weight: bold;
	background-color: #f6f6f6;
	text-align: left;
	cursor: pointer;
	font-family: Tahoma, Arial, sans-serif;
	font-weight: bold;
	font-size: 11px;
	margin-right: 30px;
	width: 100%;
}

.tabela-header {
	padding: 5px;
	height: 30px;
	border-bottom: 1px solid gray; 
	font-weight: bold;
	background-color: #f6f6f6;
	text-align: left;
	cursor: pointer;
	font-family: Tahoma, Arial, sans-serif;
	font-weight: bold;
	font-size: 11px;
}

.tabela-header th {
	padding: 5px;
}

.tabela-rows, 
.tabela-rows-datalog, 
.tabela-rows-datalog-detalhe,
.tabela-rows td {
	padding: 5px;
	border-bottom: 1px dashed #c9c9c9; 
	font-family: Tahoma, Arial, sans-serif;
}

.tabela-rows-datalog {
	float: left;
	font-size: 0.8em;
	cursor: pointer;
	margin-right: 20px; 
	width: 100%;
}

.tabela-rows-datalog-detalhe {
	float: left;
	width: 100%;
}

.tabela-rows-datalog-sistema-ligado {
	background-color: #d8ffcd;
}

.tabela-rows-datalog-detalhe {
	float: left;
	border-top: 1px solid #d0d0d0; 
	padding: 2px; 
	overflow-x: auto;
	display: none;
}

.label-table {
	font-size: 0.9em;
	padding: 0;
}

.form-group {
	float: left;
	width: 100%;
	clear: both;
}

.form-group label {
	float: left;
	font-size: 0.9em;
	padding: 4px 0 3px;
	width: 100%;
	text-align: left;
}

.form-buttons {
	float: left;
	margin-top: 15px;
	width: 100%;
}

.campo-obrigatorio {
	float: left;
	color: white;
	margin: 2px 8px;
	padding: 0 10px 2px;
	font-weight: bold;
	background-color: #e74c3c;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-align: center;
}

.erro {
	color: #e74c3c;
	padding: 0 10px;
	font-size: 0.8em;
}

.coluna-erro {
	vertical-align: top;
	padding-top: 8px;
}

.panel-conteudo, 
.panel-conteudo-vertical, 
.panel-datalogger {
	position: fixed; 
	width: 940px; 
	margin-left: -470px; 
	left: 50%; 
	bottom: 110px; 
	top: 195px; 
	overflow: auto; 
	overflow-x: hidden; 
	border-bottom: 1px solid #f0f0f0;
}

.panel-conteudo-vertical {
	width: 730px;
	margin-left: -280px;
	top: 220px;
	bottom: 130px;
	display: block;
}

.panel-botoes, 
.panel-botoes-vertical {
	position: fixed;
	width: 940px;
	margin-left: -470px;
	left: 50%;
	bottom: 90px; 
	overflow: hidden;
	float: left;
}

.panel-botoes {
	bottom: 70px;
}

.panel-botoes-vertical {
	width: 735px;
	margin-left: -280px;
}

.icone-dispositivo {
	float: left; 
	width: 10px;
	margin-right: 10px;
}

#sdm-button:hover { border-color: #dd0903; }
#icone-sdm1 { background-color: #dd0903; height: 33px; width: 15px; }
#icone-sdm2 { background-color: #d95753; height: 33px; width: 15px; }
#icone-sdm3 { background-color: #db7e7c; height: 32px; width: 15px; }

#emap01-button:hover { border-color: #ff9c00; }
#icone-emapUm1 { background-color: #ff9c00; height: 33px; width: 15px; }
#icone-emapUm2 { background-color: #feb33e; height: 33px; width: 15px; }
#icone-emapUm3 { background-color: #fcce86; height: 32px; width: 15px; }

#emap-button:hover { border-color: #fdb900; }
#icone-emap1 { background-color: #fdb900; height: 33px; width: 15px; }
#icone-emap2 { background-color: #fdcd4a; height: 33px; width: 15px; }
#icone-emap3 { background-color: #fddb7f; height: 32px; width: 15px; }

#smv01-button:hover { border-color: #007eff; }
#icone-smvUm1 { background-color: #007eff; height: 33px; width: 15px; }
#icone-smvUm2 { background-color: #49a2fe; height: 33px; width: 15px; }
#icone-smvUm3 { background-color: #85c0fd; height: 32px; width: 15px; }

#smv-button:hover { border-color: #022bfd; }
#icone-smv1 { background-color: #022bfd; height: 33px; width: 15px; }
#icone-smv2 { background-color: #4b67fa; height: 33px; width: 15px; }
#icone-smv3 { background-color: #8c9ef9; height: 32px; width: 15px; }

#glp-button:hover { border-color: #008aff; }
#icone-glp1 { background-color: #008aff; height: 33px; width: 15px; }
#icone-glp2 { background-color: #61b3f9; height: 33px; width: 15px; }
#icone-glp3 { background-color: #8ec6f6; height: 32px; width: 15px; }

#mcc-button:hover { border-color: #4a05c9; }
#icone-mcc1 { background-color: #4a05c9; height: 33px; width: 15px; }
#icone-mcc2 { background-color: #7e54cd; height: 33px; width: 15px; }
#icone-mcc3 { background-color: #ad8fe6; height: 32px; width: 15px; }

#gwm-button:hover { border-color: #6f06a0; }
#icone-gwm1 { background-color: #6f06a0; height: 33px; width: 15px; }
#icone-gwm2 { background-color: #8744a6; height: 33px; width: 15px; }
#icone-gwm3 { background-color: #a66fc0; height: 32px; width: 15px; }

#smc-button:hover { border-color: #cc03ea; }
#icone-smc1 { background-color: #cc03ea; height: 33px; width: 15px; }
#icone-smc2 { background-color: #e048f6; height: 33px; width: 15px; }
#icone-smc3 { background-color: #ed97fa; height: 32px; width: 15px; }

#login-content {
	float: left;
	width: 100%;
	text-align: center;
	padding: 30px 0;
	background-color: #f1f1f1;
	border: 1px solid #ccc;
	margin-bottom: 10px;
}

.login-form {
	width: 300px;
	margin: 0 auto;
}

.login-label {
	text-transform: lowercase;
	font-variant: small-caps;
}

.esqueceu-senha-link {
	float: left;
	clear: both;
	font-size: 0.8em; 
	margin: 5px 0;
	cursor: pointer; 
}

.email-erro {
	font-family: Tahoma, Arial, sans-serif;
	font-size: 12px;
	font-variant: normal;
	color: red;
	margin-bottom:5px;
	float:left;
	width: 100%;
}

.login-erro {
	background-color: #c0392b;
	color: white;
	font-size: 0.9em;
	text-align: center;
	padding: 2px 0;
}

.botao {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-variant: small-caps;
	width: 150px;
	height: 35px;
	margin-top: 10px;
}

#login-rodape {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: gray;
	text-align: center;
	padding-top: 10px;
}

#mensagem {
	position: absolute;
	width: 800px;
	left:50%;
	margin-left: -400px;
	top: 500px;
	background-color: #ff4242;
	height: 120px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 16px;
}

#cab {
	font-family: "Open Sans", sans-serif;
	padding: 10px;
	border-bottom: 1px solid #ccc;
	background-color: #f1f1f1;
	height: 75px;
}

#cab-msg {
	float: left;
	padding: 10px 0 0 20px;
	line-height: 1.2em;
}

#cab-msg font {
	font-size: 0.9em;
	color: #0082ca;
}

.cab-img {
	width: 265px;
	height: 60px; 
	float: left; 
	margin-top: -4px;
}

#cab-msg a {
	color: inherit;
	text-decoration: none;
	font-variant: normal;
}

#cab-msg a:before {
	content: '/ ';
}

#cab-msg a:first-child:before {
	content: '';
}

#cab-msg a:hover {
	font-weight: normal;
	text-decoration: none;
}
 
#cab-titulo {
	float: right;
	font-size: 1.6em;
	padding-top: 9px;
	padding-right: 15px;
}

#cab-titulo a {
	border: none; 
	text-decoration: none; 
	outline: none;
}

#cab-titulo a:hover {
	border-bottom: 2px dotted #e3e3e3;
	border: none; 
	text-decoration: none; 
	outline: none;
}

.notification-counter {
	background-color: red;
	font-size: 0.5em;
	padding: 0 5px 1px;
	margin-left: -15px;
	margin-top: 10px;
	color: white;
	border-radius: 5px;
	display: none;
}

#notification-list {
	position: fixed;
	top: 75px;
	right: 10px;
	background-color: white;
	font-family: 'Open Sans', sans-serif; 
	width: 320px;
	height: 320px;
	z-index: 10;
	border: 1px solid #efefef;
	border-top: 0;
	overflow: auto;
	display: none;
}

.notification-item-list {
	display: inline-flex;
	border-bottom: 1px dashed #efefef;
	flex-wrap: wrap;
	padding-bottom: 5px;
	width: 100%;
}

.add-hover:hover {
	cursor: pointer;
	background-color: rgba(249, 245, 213, 0.4); 
}

.notification-item-list-header {
	display: inline-flex;
	justify-content: flex-end;
	align-items: center;
	padding: 5px 10px;
	width: 100%;
	text-transform: lowercase;
	font-variant: small-caps;
}

.notification-item-list-header span {
	padding: 0 7px 4px;
}

.notification-item-list-content {
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.9em;
	width: 100%;
}

.notification-item-list:last-child {
	border-bottom: 0;
	margin-bottom: 25px;
}

.notification-item-list-icon {
	padding: 0 8px;
	text-align: center;
}

.notification-item-list-description {
	flex-grow: 2;
}

.notification-item-list-device {
	padding: 0 10px;
	text-align: center;
}

.notification-item-list-device span {
	font-size: 0.8em;
	color: #ccc;
	line-height: 2em;
	white-space: nowrap;
}

.notification-list-all {
	position: fixed;
	top: 366px;
	background-color: white;
	width: 318px;
	text-align: center;
	font-size: 0.8em;
	padding: 5px 0;
}

.notification-unseen {
	font-weight: bold;
}

#no-notifications-found {
	justify-content: center;
	color: #cfcfcf;
	padding-top: 70px;
	text-align: center;
}

#no-notifications-found span {
	font-size: 5em;
}

#rodape {
	font-family: "Open Sans", sans-serif;
	padding: 10px;
	background-color: #f1f1f1;
	border-top: 1px solid #ccc;
	position: fixed;
	width: 100%;
	bottom: 0;
}

#rodape-msg {
	float: left;
	padding-left: 10px;
	font-size: 0.8em;
	color: gray;
	padding-top: 2px;
}

#loading-status {
	position: fixed;
	background-color: #34495e;
	color: white;
	top: 75px;
	left: 280px;
	padding: 5px 15px;
	text-transform: uppercase;
	font-variant: small-caps;
	font-size: 0.8em;
	display: none;
}

.loading-status-error {
	background-color: #e74c3c !important;
}

#loading-status-icon {
	float: left;
}

#loading-status-msg {
	float: left;
	padding-left: 5px;
}

#main {
	width: 100%;
	top: 74px;
	bottom: 40px;
	position: absolute;
	overflow: auto;
	overflow-x: hidden;
}

#main-janela {
	position: relative;
	width: 980px;
	left: 50%;
	margin-left: -490px;
	margin-top: -15px;
}

.tabela-dispositivos {
	border: 1px solid #ccc;
	border-bottom-width: 0;
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

.subtabela-dispositivos {
	border: 0;
}

.tabela-dispositivos thead th {
	padding: 5px;
	height: 30px;
	border: 1px solid #4679bd; 
	font-weight: bold;
	background-color: #4679bd;
	color: white;
	text-align: left;
	cursor: pointer;
	font-size: 0.9em;
	font-weight: normal;
}

.tabela-dispositivos tbody tr {
	text-align: center;
	font-size: 0.9em;
}

.tabela-dispositivos tbody td {
	border-bottom: 1px solid #ccc;
	background-color: #fff;
	cursor: default;
	padding: 10px 5px;
	text-align: left;
}

.tabela-dispositivos tbody td img {
	vertical-align: middle;
}

.tabela-dispositivos tbody tr:hover td {
	cursor: pointer;
	background-color: rgba(249, 245, 213, 0.4);
}

.tabela-dispositivos tbody tr:last-child td {
	border-bottom: 1px solid #ccc;
}

.subtabela-dispositivos tbody tr:last-child td {
	border-bottom: 0 !important;
}

.disable-hover-tabela-dispositivos tbody tr:hover td {
	background-color: #fff;
}

.linha-desativada {
	color: #ccc;
}

.linha-desativada:hover td {
	background-color: #fff !important;
}

.offline {
	color: #c8c8c8;
}

.checker-column {
	width: 60px;
	font-size: 2em;
}

.bt-on-table-line {
	padding: 2px 10px !important;
	text-align: right !important;
	font-size: 0.9em;
	text-decoration: underline;
}

.main-dispositivos-lista {
	width: 30%;
	max-width: 320px;
	float: left;
	height: 100%;
	border-top: 1px solid #ccc;
	border-right: 1px dashed #ccc; 
	overflow: auto;
}

.device-map {
	border-top: 1px solid #ccc;
	height: 100%; 
}

#mapa-percurso-ida,
#mapa-percurso-volta { 
	height: 300px;
	border: 1px solid gray;
	margin-bottom: 20px;
}

.infowin {
	font-size: 0.8em;
}

.clear {
	clear: both;
}

#page-wrap {
	width: 980px;
	background: white;
	margin: 20px auto;
}

.button {
	float: left;
	margin: 10px;
	cursor: pointer;
}

.tabela-cor-verde {
	border-color: #bedfc4;
	border-width:0;
}

.tabela-cor-verde-bg {
	background-color: #dfffe5; 
	border-bottom-color: #bedfc4;
	border-bottom-width: 0; 
	color: #368745;
	font-weight: bold;
}

.painel-icones-status {
	position: fixed;
	top: 90px;
	height: 40px;
	width: 300px;
	left: 50%;
	margin-left: 180px;
	padding-top: 10px;
	text-align: right;
}

.unidade-datalog {
	font-size: 0.8em;
	vertical-align: top;
}

#memoria-massa-diag-header {
	height: 18px; 
	position: fixed; 
	top: 220px; 
	left: 50%; 
	width: 700px; 
	margin-left: -280px;
}

#memoria-massa-diag {
	position: fixed; 
	top: 250px; 
	bottom: 132px; 
	overflow-x: auto; 
	width: 728px; 
	left: 50%; 
	margin-left: -280px;
}

.diag-datalog-verde, 
.diag-datalog-vermelho {
	width: 15px; 
	height: 15px;
	margin: 0 1px 1px 0; 
	float: left; 
	background-color: lime;
}

.diag-datalog-vermelho {
	background-color: red;
}

.diag-datalog-rel {
	width: 100%; 
	height: 35px;
	margin: 10px 0 0;
	padding-top: 15px; 
	float: left; 
	text-align: center;
	background-color: #f6f6f6;
	border-width: 1px 0px;
	border-style: dashed;
	border-color: black;
}

#msg-dialog-bitarray p {
	display: block; 
	float: left; 
	margin: 2px;
	width: 300px;
}

#msg-dialog-bitarray p input {
	float: left;
}

#msg-dialog-bitarray p label {
	display: block;
	float: left;
	padding-left: 5px; 
	padding-top: 3px;
}

.identificacao-dispositivo-painel-controle {
	bottom: 75px; 
	height: 50px;
	left: 50%;
	margin-left: -480px;
	overflow: hidden;
	padding-bottom: 2px;
	position: fixed;
	width: 170px;
}

.escopo-data-datalog {
	float: left;
	padding-right: 10px; 
}

.escopo-data-datalog p {
	float: left; 
	font-size: 0.8em;
	margin-top: 7px !important;
	padding-right: 10px !important;
}

.escopo-data-datalog-p2 {
	margin-top: 0 !important; 
	font-variant: small-caps; 
	font-size: 1.2em;
	text-transform: lowercase; 
	line-height: 15px; 
	text-align: right;
}

.escopo-data-datalog > .input-text {
	margin-top: 1px;
	margin-bottom: 0;
	width: 90px;
}

#datalog-historico,
#datalog-historico-hpi,
#datalog-historico-hcd,
#datalog-historico-hpe,
#datalog-historico-hpl {
	position: absolute; 
	width: 711px; 
}

#datalog,
#datalog-hpi,
#datalog-hcd,
#datalog-hpe,
#datalog-hpl {
	bottom: 132px; 
	left: 50%; 
	margin-left: -280px;
	overflow-x: auto;
	position: fixed; 
	top: 250px; 
	width: 728px;
}

.header-datalog-historico {
	-webkit-transition: all 200ms;
	-moz-transition: all 200ms;
	-ms-transition: all 200ms;
	-o-transition: all 200ms;
	transition: all 200ms;
	position: absolute;
}

.header-datalog {
	left: 50%;
	margin-left: -280px;
	position: fixed;
	top: 220px; 
	width: 730px;
}

.text-center { text-align: center !important; justify-content: center; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }

.scroll-overflow {
	overflow: hidden;
	white-space: nowrap;
}

#posto-home {
	font-family: 'Open Sans', sans-serif;
}
#posto-home h1 {
	font-size: 2.5em;
	margin: 0;
}

#posto-avancado-bombas,
#bico_conteudo {
	bottom: 80px;
	display: block;
	float: left;
	left: 50%;
	margin-left: -465px;
	margin-right: -465px;
	position: fixed;
	overflow-y: scroll;
	right: 50%;
	top: 195px;
	width: 930px;
}

.card-bomba {
	border: 1px solid #ccc;
	float: left;
	margin: 0 10px 10px 0;
	width: 290px;
	min-height: 380px;
}

.card-bomba-header {
	text-align: center;
}

.card-bomba-header img {
	height: 150px;
	padding: 10px;
}

.card-bomba-header h1 {
	font-size: 1.3em;
	padding: 0;
}

.card-bomba-header small {
	font-variant: small-caps;
	font-size: 1.2em;
	text-transform: lowercase;
}

.card-bomba-twm {
	border-bottom: 1px dashed #efefef;
	cursor: pointer;
	float: left;
	font-family: 'Open Sans', sans-serif;
	margin-left: 10px;
	padding: 8px 0;
	width: 270px;
}

.card-bomba-twm .card-bomba-twm-values {
	float: left;
	text-align: left;
}

.card-bomba-twm span {
	float: left;
}

.card-bomba-twm small { 
	float: left;
}

.card-bomba-twm-values span,
.card-bomba-twm-values small {
	width: 100%;
}

.card-bomba-twm span {
	line-height: 15px;
}

.icone-bico {
	border-radius: 15px;
	float: left;
	padding: 5px;
	margin: 10px 8px;
	width: 30px;
}

.icone-mais {
	float: right;
	padding: 0 5px;
	margin-top: 7px;
}

.card-bomba-twm-more-values {
	display: none;
	float: left;
}

.table-card-bomba-twm-more {
	background-color: #f9f9f9;
	border: 1px solid #f0f0f0;
	border-spacing: 0;
	border-collapse: separate;
	font-size: 0.8em;
	margin-top: 5px;
	padding: 5px 0;
	text-align: center;
	width: 270px;
}

.table-card-bomba-twm-more td {
	padding: 0;
}

.rel-linha {
	float: left;
	font-family: 'Open Sans', sans-serif; 
	text-align: center;
	width: 25%;
}

.rel-linha-descricao {
	text-transform: lowercase;
	font-variant: small-caps;
}

.rel-linha-valor {
	font-size: 2.1em;
	padding: 10px;
}

#rel_movimentacao_cab {
	float: left;
	margin: 20px 0;
	padding: 0;
	width: 100%;
}

#rel_movimentacao_cab h2 {
	font-variant: small-caps;
	margin: 5px 0 0;
	text-transform: lowercase;
}

#rel_movimentacao_cab p {
	font-family: 'Open Sans', sans-serif;
	font-size: 1em;
	margin: 0;
}

#dados-home-rodape {
	position: fixed;
	bottom: 60px;
	color: gray;
	font-size: 0.8em;
	font-style: italic;
	height: 12px;
}

.graficos-diagnostico {
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	line-height: 0;
	float: left;
	clear: right;
	width: 50%;
	text-align: center;
	margin: 10px 0;
}

.graficos-diagnostico h1 {
	text-align: left;
}

.graficos-diagnostico div {
	float: left;
}

.grafico_box_options {
	float: right !important;
	padding: 10px;
	margin-right: 50px;
}

.grafico_box_options img {
	padding: 0 5px;
}

#menu-bico {
	background-color:#f6f6f6;
	height: 530px; 
	padding-top: 10px; 
	margin-right:10px; 
	display:none;
}

.titulo-menu-bico {
	font-variant:small-caps; 
	font-size:16px; 
	width:100%; 
	float: right; 
	text-align: right; 
	padding-right: 10px; 
	margin-bottom: 20px;
}

#mais-opcoes-bico {
	float:left;
	border-bottom: 1px solid #ccc;
	width :92%;
	margin-left: 35px; 
	margin-right: 35px; 
	display: none;
}

.bico {
	margin-left: 35px; 
	margin-top:10px; 
	width: 170px; 
	float:left;
}

#menu-grafico-historico {
	color:#5f6364;
	height: 220px;
	width:710px;
	margin-left:-365px;
	left: 50%;
	padding-top: 60px;
	background-color: #f6f6f6;
	position: absolute;
}

.conteudo-menu-historico {
	width: 560px;
	height:120px;
	left: 50%;
	margin-left: -230px;
	position: absolute;
}

.titulos-menu-historico {
	margin-bottom: 10px;
	font-size: 18px;
}

#variaveis-menu-historico {
	float:left;
	width:220px;
}

#escala-menu-historico {
	float: left;
	margin-left: 70px;
}

.botao-aplicar-menu-historico {
	width:200px; 
	margin-top: 40px; 
	top:195px; 
	left:50%; 
	margin-left:-100px; 
	position: absolute;
}

#legenda-grafico {
	width:700px; 
	height: 15px;
}

#legenda-grafico div {
	float:left; 
	margin-left: 5px;
}

.icone-legenda-grafico {
	width:15px; 
	height: 15px; 
	background-color: rgba(151,187,205,1);
	float: left; 
	margin-left: 40px;
}

#grafico {
	width: 100%; 
	text-align: center;
}

.grafico-historico {	
	height: 200px;
	margin-bottom: 10px;
}

#seleciona-graficos-diagnostico {
	margin-left: 35px; 
	float: left;
}

#seleciona-graficos-diagnostico div {
	float: left; 
	width:170px; 
	margin-right: 35px; 
	margin-bottom:10px;
}

#seleciona-graficos-diagnostico input {
	margin-right: 5px;
}

.icone-mais-opcoes-diagnostico {
	margin-left:35px;
	float: left;
	width: 92%;
}

.botao-salvar-diagnostico {
	width: 200px;
	margin-top: 460px;
	left: 50%;
	margin-left: -100px;
	position: absolute;
	transition:200ms;
}

.flags-twm-diagnostico {
	width: 90%;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 5%;
	float: left;
}

.flags-twm {
	width: 12.5%;
	float: left;
	text-align: center;
	background-color: #efefef;
	display: block;
	padding: 8px 0;
}

.gauge-grafico-diagnostico {
	display: none;
	padding-left: 90px;
}

.valor-grafico-diagnostico {
	margin: 30px 0; 
	text-align: center; 
	background-color: #ccc; 
	width: 100%; 
	font-size: 2em;
}

.menu-lateral {
	font-family: 'Open Sans', sans-serif;
	float: left; 
	width: 280px; 
	background-color: #fff;
	border-top: 1px solid #ccc;
	border-right: 1px solid #f0f0f0;
	text-align: center; 
	height: 100%;
	padding: 20px;
	overflow: auto;
}

.menu-lateral::-webkit-scrollbar {
	width: 5px;
}

.menu-lateral::-webkit-scrollbar-track {
	background: #f1f1f1;
}

.menu-lateral::-webkit-scrollbar-thumb {
	background: #888;
}

.menu-lateral::-webkit-scrollbar-thumb:hover {
	background: #555;
}

.menu-lateral h1 {
	font-family: 'Roboto', sans-serif; 
	font-size: 1.5em;
	font-weight: 300;
	margin: 5px; 
}

.menu-lateral p {
	margin: 0;
}

.menu-lateral nav {
	float: left;
	width: 100%;
}

.menu-lateral ul {
	list-style: none;
	text-align: left;
	padding: 0;
	float: left;
	width: 100%;
}

.menu-lateral ul li {
	padding: 0;
	border-bottom: 1px solid #f0f0f0;
}

.menu-lateral ul li:first-child {
	border-top: 1px solid #f0f0f0;
}

.menu-lateral ul li span {
	padding: 0 10px;
	font-size: 1.4em;
	color: #505050;
}

.menu-lateral ul li a {
	text-decoration: none;
	color: inherit;
	display: block;
	width: 100%;
	height: 100%;
	padding: 5px 0;
	line-height: 1em;
}

.menu-lateral ul li:hover {
	background-color: #f0f0f0;
}

.menu-lateral-conexao {
	color: gray;
	padding: 0 5px 1px;
	text-transform: uppercase;
	cursor: pointer;
}

.menu-lateral-conexao-on {
	color: white;
	background-color: #27ae60;
}

.selected-menu {
	background-color: rgba(52, 152, 219, 0.1);
	color: rgba(41, 128, 185,1.0) !important;
}

.selected-menu span {
	color: rgba(41, 128, 185,1.0) !important;
}

.fast-diag {
	color: gray;
	font-size: 0.8em;
	width: 100%;
	float: left;
	padding: 5px 8px 8px;
	margin-top: 5px;
	background-color: #f0f0f0;
	border-radius: 5px;
}

.fast-diag b {
	float: left;
}

.fast-diag span {
	float: right;
}

.fast-diag a {
	text-decoration: underline;
}

.container {
	float: left;
	position: absolute;
	left: 280px;
	right: 0;
	bottom: 0;
	top: 0;
	padding: 0 20px 30px;
	background-color: #f9f9f9;
	border-top: 1px solid #ccc;
	font-family: 'Open Sans', sans-serif;
	overflow: auto;
}

.container h1 span:first-child {
	padding: 0 10px;
	color: #a0a0a0;
}

.container h1 a {
	color: inherit;
	text-decoration: none;
}

.container h2 {
	font-family: 'Roboto', sans-serif;
	padding: 0 5px;
	font-weight: normal;
}

.container h3 {
	margin: 10px 0;
	color: #2e6ea9;
	font-size: 0.9em;
	font-weight: bold;
}

.full-container {
	left: 0;
}

.container-box {
	position: relative;
	float: left;
	width: 100%;
	background-color: white;
	padding: 5px 10px 20px;
}

.container-box > h2 {
	float: left;
}

.container-box h2 span {
	font-size: 1em;
	float: left;
}

.container-box h2 span:first-child {
	font-size: 2.5em;
	float: left;
}

.container-box-part {
	float: left;
	width: 50%;
	padding-right: 10px;
}

.container-box-part:nth-child(even) {
	padding-left: 10px;
}

.part-full { width: 100%; padding: 0; }
.part-25 { width: 25%; }
.part-75 { width: 75%; }

@media(max-width: 1280px) {
	.container-box-part {
		width: 100%;
	}
}

.box-border {
	border: 1px solid #ccc;
	border-radius: 2px;
	box-shadow: 2px 2px rgba(204, 204, 204, 0.2);
}

.chart_dashboard, 
.chart_data_dashboard {	
	background-color: #fff;
	float: left;
	height: 350px;
}

.chart_dashboard {
	margin-right: 0.5%;
	width: 69.5%;
	padding: 20px;
}

.chart_data_dashboard {	
	margin-left: 0.5%;
	overflow: hidden;
	width: 29.5%;
}

.chart_data_dashboard_expanded {
	background-color: #fff;
	float: left;
	margin-top: 10px;
	width: 100%;
}

.table_dashboard,
.table_dashboard_expanded {	
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

.table_dashboard thead,
.table_dashboard tbody,
.table_dashboard tr,
.table_dashboard td,
.table_dashboard th {
	display: block;
}

.table_dashboard tbody td,
.table_dashboard thead > tr > th {
	float: left;
}

.table_dashboard thead,
.table_dashboard_expanded thead {
	color: white;
	font-family: Tahoma, Arial, sans-serif;
	font-size: 11px;
}

.table_dashboard thead tr {
	width: 100%;
}

.table_dashboard thead th,
.table_dashboard_expanded thead th {
	background-color: #4679bd;
	border: 1px solid #4679bd;
	text-align: left;
	padding-left: 5px;
	height: 36px;
}

.table_dashboard tbody,
.table_dashboard_expanded {
	border: 1px solid #ccc;
	border-top: 0;
}

.table_dashboard tbody {
	height: 314px;
	overflow-y: auto;
	overflow-x: hidden;
	width: 100%;
}

.table_dashboard tbody tr:hover td,
.table_dashboard_expanded tbody tr:hover td {
	background-color: #f1f1f1;
	cursor: pointer;
}

.table_dashboard td,
.table_dashboard_expanded td {
	padding: 2px 5px;
}

.table_dashboard_row_footer {
	background-color: #ececec;
	font-weight: bold;
}

@media(max-width: 1280px) {
	.chart_dashboard, 
	.chart_data_dashboard {
		width: 100%;
		margin: 0 0 20px;
	}
}

.dashboard-sessao {
	float: left;
	width: 100%;
	margin-top: 15px;
}

.dashboard-sessao-box,
.dashboard-sessao-box-5,
.dashboard-sessao-box-50,
.dashboard-sessao-box-100 {
	float: left;
	background-color: white;
	width: 31.83333%;
	margin: 0 0.75%;
	text-align: center;
}

.dashboard-sessao-box-5 {
	width: 19.33%;
	margin: 0 0.33%;
	padding: 0;
}

.dashboard-sessao-box-50:nth-child(odd) {
	width: 49.5%;
	margin: 0 0 0 0.5%;
}

.dashboard-sessao-box-50:nth-child(even) {
	width: 49.5%;
	margin: 0 0.5% 0 0;
}

.dashboard-sessao-box-100 {
	width: 100%;
	margin: 0;
}

.dashboard-sessao-box h2,
.dashboard-sessao-box-5 h2,
.dashboard-sessao-box-50 h2,
.dashboard-sessao-box-100 h2 {
	font-size: 1.4em;
	font-variant: small-caps;
	text-transform: lowercase;
}

.dashboard-sessao-box-5 h2,
.dashboard-sessao-box-50 h2,
.dashboard-sessao-box-100 h2 {
	font-size: 1.2em;
	margin: 2px 0 10px;
}

.dashboard-sessao-box p,
.dashboard-sessao-box-5 p,
.dashboard-sessao-box-50 p,
.dashboard-sessao-box-100 p {
	font-size: 5em;
	line-height: 1em;
	margin: 0;
	padding: 0 0 20px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

.dashboard-sessao-box-5 p,
.dashboard-sessao-box-50 p,
.dashboard-sessao-box-100 p {
	font-size: 3em;
	line-height: 0.5em;
	padding: 0 0 5px;
	margin-bottom: 8px;
}

.dashboard-sessao-box small,
.dashboard-sessao-box-5 small,
.dashboard-sessao-box-50 small,
.dashboard-sessao-box-100 small {
	margin-left: 3px;
	font-size: 0.4em;
	line-height: 0;
}

.gateway-twm-box {
	float: left;
	background-color: white;
	border: 1px solid #ccc;
	margin: 0 20px 20px 0;
	text-align: center;
	width: 300px;
}

.gateway-twm-box h2 {
	font-size: 1em;
	margin: 10px 0 0;
}
.gateway-twm-box span {
	font-size: 5em;
	line-height: 1em;
}

.gateway-twm-box p {
	font-size: 2em;
	line-height: 0.6em;
	padding: 0 0 5px;
	margin: 10px 10px 5px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

.gateway-twm-box small {
	font-size: 0.8em;
}

.graph-box-45 {
	border: 1px solid #e0e0e0;
	padding-top: 10px;
	margin-left: 3%;
	float: left; 
	width: 45%; 
	text-align: center;
	background-color: #fafafa;
}

.graph-box-45 h2 {
	margin: 0;
}

.graph-box-25,
.graph-box-50 {
	float: left; 
	width: 50%; 
	text-align: center;
}

.graph-box-25 {
	width: 25%;
}

.graph-box-50 h2 {
	margin: 0;
}

.bomba-combustivel {
	border: 1px solid #ccc;
	float: left;
	margin: 0 4px 8px;
	width: 245px;
	height: 385px;
	background-color: white;
	text-align: center;
	padding: 10px;
	overflow: auto;
}

@media(max-width: 1080px) {
	.bomba-combustivel {
		width: 48%;
		margin-left: 1%;
		margin-right: 1%;
	}
}

.bomba-combustivel > h1 {
	font-family: 'Open Sans', sans-serif;
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1em;
	margin: 0;
}

.bomba-combustivel ul {
	list-style: none;
	text-align: left;
	padding: 0;
}

.bomba-combustivel ul li {
	padding: 0;
	border-bottom: 1px solid #ccc;
}

.bomba-combustivel ul li a {
	text-decoration: none;
	color: inherit;
	display: block;
	width: 100%;
	height: 100%;
	padding: 4px;
}

.bomba-combustivel ul li a span {
	font-size: 1em;
	padding: 0 2px 0;
}

.bomba-combustivel ul li:hover {
	background-color: #dcdcdc;
}

.bomba-combustivel ul li a b {
	float: right;
}

.icon-bomba-combustivel {
	color: orange;
	font-size: 5em;
}

.icon-gateway,
.icon-gateway-menu-lateral {
	color: #1e55a0;
}

.icon-gateway-menu-lateral {
	font-size: 6em;
}

.identificacao-bomba {
	float: left;
	width: 100%;
	margin: 0 0 10px;
}

.identificacao-bomba span {
	float: left;
	width: 100%;
}

.realupload {
	position: relative;
	float: left;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity : 0);
	width: 400px;
	margin-left: -400px;
}

.fakeupload {
	float: left;
	background: #fff;
	margin-right: 10px;
	padding: 4px 4px 6px 6px;
	border: 1px solid #ccc;
	background: url("../imgs/botao-selecione.png") no-repeat 99% 51%;
	cursor: default;
	width: 400px;
}

.styled-dropdown-bomba {
	float: left;
	width: 242px;
	border: 1px solid #efefef;
}

.styled-dropdown-bomba:hover {
	cursor: pointer;
}

.styled-dropdown-bomba > ul.opt {
	list-style: none;
	display: none;
	z-index: 999;
	width: 240px;
	background-color: white;
	position: fixed;
	top: 235px;
	top: 125px;
	border: 1px solid #ccc;
	max-height: 380px; 
	overflow:auto;
}

.styled-dropdown-bomba > ul.opt::-webkit-scrollbar {
	width: 5px;
}

.styled-dropdown-bomba > ul.opt::-webkit-scrollbar-track-piece {
	background-color: #eee;
	border-left: 1px solid #ccc;
}

.styled-dropdown-bomba > ul.opt::-webkit-scrollbar-thumb:vertical,
.styled-dropdown-bomba > ul.opt::-webkit-scrollbar-thumb:horizontal {
	background-color: #bac0c4;
}

.styled-dropdown-bomba > ul.opt::-webkit-scrollbar-thumb:vertical:hover,
.styled-dropdown-bomba > ul.opt::-webkit-scrollbar-thumb:horizontal:hover {
	background-color: #717171;
}

.styled-dropdown-bomba > ul.opt > li:first-child {
	border-top:0 !important;
}

.styled-dropdown-bomba > ul.opt > li:last-child {
	border-bottom: 0 !important;
}

.styled-dropdown-bomba > ul.opt > li a {
	padding: 10px;
}

#bico-tag {
	text-align: center;
}

#bico-tag-circle {
	width: 10px;
	float: left;
	margin: 12px 0 0;
}

#titulo-bomba {
	width: 200px;
	margin-left: 10px;
	float: left;
}

#titulo-bomba-opt {
	float:right;
	width: 10px;
	margin: 10px 10px 0 0;
	color: #555;
}

#bomba-tag { font-weight: bold; }

.card-sistema small {	
	width: 50% !important;
	margin-top: 5px;
}

.menu-lateral-box {
	width: 100%; 
	float: left; 
	background-color: #f0f0f0;
	margin-bottom: 10px;
	border: 1px solid #e0e0e0;
	cursor: pointer;
	padding: 5px 10px 10px;
}

.mais-opcoes-historico {
	color: gray;
}

.menu-lateral-box-secundario {
	margin-top: -11px;
	background-color: #f9f9f9;
	border-top-style: dashed;
}

.menu-lateral-box h2 {
	font-family: sans-serif;
	font-weight: normal;
	font-variant: small-caps;
	text-transform: lowercase;
	font-size: 1em;
	margin: 5px 0 0;
	padding: 0;
}

.menu-lateral-box p {
	float: left;
	margin: 0 0 5px;
	width: 100%;
}

.escopo-data {
	background-color: #fff; 
	border: 1px solid #ccc;
	cursor: pointer;
	margin: 2px auto;
	width: 100%;
	font-family: inherit;
	text-align: center;
}

.var-graphs {
	float: left; 
	margin: 5px 10px;
}

.seta-gauges-hover:hover {
	background-color: #f3f3f3;
}

#seta {
	height:47px; 
	width:259px; 
	margin-left:-10px; 
	border-top: 1px solid #ccc; 
	cursor: pointer; 
	transition:300ms;
}

.gauges_row {
	float: left;
	width: 100%;
}

.gauges_dashboard {
	width: 650px;
	float: right;
}

.gauge_dashboard {
	float: left;
	text-align:center;
	width: 130px;
	height: 80px;
	background-color: #f5f5f5;
	margin: 15px 0 10px 0;
}

.valor-gauge {
	margin-top:-22px;
	width: 100%;
	height: 20px;
	color:#000;
}

.gauges_dashboard_img {
	height: 50px;
	width: 70px;
	position:absolute;
	margin-left: -67px;
	margin-top: -6px;
}

.gauges_dashboard h2 {
	margin-bottom: 1px;
}

#div-graphs-diag {
	float: left;
	width: 100%;
}

#tabela-eventos {
	border:1px solid #ccc;
	border-spacing:0;
	background-color: #fff;
	text-align: left;
	width: 100%;
	padding-top: 3px;
}

#tabela-eventos div {
	margin-left:15px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	text-align: center;
	color:#fff;
	cursor: default;
	padding-top: 4px;
}

#tabela-eventos td {
	border-bottom: 1px solid #f3f3f3;
}

#tabela-eventos tr {
	height: 65px;
}

.div-eventos-alerta {
	background-color: red;
}

.div-eventos-critico {
	background-color: red;
}

.div-eventos-erro {
	background-color: orange;
}

.div-eventos-info {
	background-color: #ccc;
}

.div-eventos-warning {
	background-color: #a509a7;
}

.div-eventos-alteracao {
	background-color: #6ba3ff;
}

.descricao-eventos {
	text-align: left;
}

.data-eventos {
	text-align:center;
	font-size: 14px;
	color: gray;
	width: 90px;
}

.div-bandeira-info {
	float: left;
	margin-top: 20px;
	margin-right: 10px;
}

.bandeira-info {
	height: 110px;
	width: 110px;
}

.info-posto {
	float: left;
	margin: 20px 5px;
}

.contador-info {
	margin-top: 20px;
	margin-right: 10px;
	width: 100%;
	float: left;
}

#foto-posto {
	border: 1px solid #ccc;
	height: 200px;
	width: 358px;
	float: left;
	overflow: hidden;
	cursor: pointer;
	text-align: center;
}

.div-info-posto {
	width: 100%;
	float: left;
}

.div-aux-info {
	width: 680px;
	float: left;
}

.div-tabela-gateway {
	float: left; 
	width: 100%;
	background-color: red;
}

.table_dashboard-info {
	float: left;
	border: 1px solid #ccc;
	background-color: #fff;
	width: 100%;
	margin-left: 0.5%;
	border-spacing: 0; 
}

.table_dashboard_header-info {
	background-color: #4679bd;
	color: white;
	width: 100%;
	height: 8.5%;
	font-size: 0.8em;
	line-height: 1.2em;
}

.table_dashboard_body-info {
	width: 100%;
	height: 91.5%;
	overflow: auto;
}

.table_dashboard_header-info div {
	padding: 7px 10px;
}

.table_dashboard-info th {
	font-weight: normal;
	text-align: left;
	background-color: #4679bd;
	color: white;
	padding: 10px 5px;
}

.table_dashboard-info td {
	padding-left: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.tabela-info:hover {
	background-color: #f3f3f3;
	transition: 150ms;
	cursor: pointer;
}

.div-tabela-info {
	position: absolute; 
	right: 35px; 
	left: 160px; 
	margin-bottom: 30px;
	float: left;
	width: 100%;
}

#dispositivos-associados-info {
	width: 100%;
}

.td-icon-dispositivos-associados {
	width: 125px; 
	text-align: center; 
	vertical-align: top; 
	padding-bottom: 30px;
}

.td-table-dispositivos-associados {
	vertical-align: top; 
	padding-bottom: 30px;
}
.div-gateway-info {
	width: 150px; 
	float: left;
	text-align: center;
	cursor: pointer;
}

.erro-conteudo {
	width: 300px;
	margin: 0 auto;
}

.erro-botao {
	width: 70px; 
	margin-top: 5px; 
	left:50%; 
	margin-left: -35px; 
	position: absolute;
}

.container-box-gateway b {
	float: left;
	width: 160px;
	text-align: right;
	margin-right: 10px; 
	text-transform: lowercase;
	font-variant: small-caps;
}

.icon-diag-seg {
	font-size:0.8em; 
	margin-right:5px;
}

.color-green { color: #0d903b; }
.color-red { color: #cc3a3a; }

.painel-lateral-direito {
	position: fixed;
	right: 0;
	width: 220px;
	top: 75px; 
	bottom: 0;
	background-color: #fdfdfd;
	border-left: 1px dashed #ccc;
}

.painel-lateral-direito h2 {
	margin: 10px 10px 0;
}

#legenda-marca-combustivel {
	float: right;
	width: 200px;
	border: 1px solid #ccc;
	background-color: #fff;
	font-size: 0.85em;
	margin: 10px;
}

.ultima-atualizacao {
	text-align: center;
	float:right;
	color: gray;
	margin-top: 55px;
}

.ultima-atualizacao-2 {
	text-align: center;
	float: right;
	color: gray;
	margin-top: -15px;
}

#diag-medidor {
	width: 400px;
	background-color: white;
	height: 435px;
	padding: 0;
	margin-bottom: 20px;
}

#diag-medidor-options > ul.opt {
	list-style: none;
	display: none;
	z-index: 999;
	background-color: white;
	position: fixed;
	margin: 45px 5px 0 220px;
	padding: 0;
	border-top: 1px solid #ccc;
}

@media(max-width: 1080px) {
	#diag-medidor-options > ul.opt {
		right: 50px;
	}
}

#diag-medidor-options ul.opt li a {
	float:left;
	text-decoration: none;
	color: inherit;
	padding: 10px;
	border: 1px solid #ccc;
	border-top: 0;
	background-color: white;
	width: 250px;
	text-align: center;
}

#diag-bottons { width: 500px; }

@media(max-width: 1280px) {
	#diag-medidor { width: 100%; }
	#diag-bottons { width: 100%; }
}

#medidor {
	margin: 20px auto 0; 
	background-color: #ffd966; 
	border-radius: 50%; 
	width: 360px; 
	height: 360px;
	border: 1px solid #808080;
}

#medidor-logo {
	margin: 70px 0 0 50px;
	width: 145px;
}

#art-medidor-1 {
	margin-top: -100px;
	width: 110px;
	transform: rotate(7deg);
}

#art-medidor-2 {
	margin: -10px 10px 0 130px;
	width: 105px;
	transform: rotate(18deg);
}

#medidor-display {
	float: left; 
	margin: 5px 0 0 50px;
	background-color: white;
	width: 250px;
	height: 150px;
	border: 1px solid #000;
}

#medidor-display-linha1 {
	border-bottom: 1px solid #ccc;
	text-align: center;
	font-size: 3em; 
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
	line-height: 1em;
	padding: 10px 0;
	margin: 0;
	height: 70px;
}

#medidor-display-linha1 small {
	margin-left: 3px;
	font-size: 0.4em;
	line-height: 0;
}

#medidor-display-linha2 {
	height: 60px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

#medidor-display-linha2-esq {
	float: left;
	width: 40%;
	height: 100%;
	font-size: 1.4em;
	padding: 18px 0;
}

#medidor-display-linha2-dir {
	float: right;
	width: 60%;
	height: 100%;
	font-size: 2em;
	text-align: right;
	padding: 13px;
}

#medidor-display-linha2 small {
	margin-left: 3px;
	font-size: 0.5em;
}

#medidor-display-rodape {
	background-color: gray;
	color: white;
	text-align: center;
	font-size: 0.7em;
	height: 18px;
}

#medidor-info {
	float: left;
	width: 100%;
	text-align: center;
	margin-top: 10px;
}

#medidor-info span {
	color: gray;
	font-size: 1.5em;
	line-height: 0.5em;
}

#communication_state_box {
	width:50%;
	font-size: 1.4em;
	padding: 20px 0 0 5px;
}

#communication_rate_box {
	width:50%;
	text-align: right;
	font-size: 1.1em;
	padding: 0 10px 0 0;
	color: gray;
}

#communication_rate_box span:first-child {
	font-size: 1.7em;
	line-height: 1em;
}

#communication_rate_box small {
	font-size: 0.5em;
	padding-right: 5px;
}

#opcoes-medidor {
	float: right;
	font-size: 1.5em;
	margin-top: 5px;
	color: gray;
}

#alert-dialog {
	display: none;
	width: 500px;
	padding: 10px;
	color: white;
	background: rgba(15, 132, 18, 0.5);
	text-align: center;
	position: fixed;
	margin: 20px 0 0 300px;
}

.select-menu-lateral {
	font-size: 1em;
	padding: 5px 5px 3px;
	border-color: #ccc;
	margin: 2px auto;
	width: 100%;
}

.select-menu-lateral-with-close {
	font-size: 1em;
	padding: 5px 5px 3px;
	border-color: #ccc;
	margin: 2px auto;
	width: 85%;
}

#botoes-grandezas {
	float: right; 
	height: 30px; 
	margin-top: 21px; 
	text-align: center; 
	font-size: 14px;
}

#botoes-grandezas div,
#botoes-grandezas a {
	cursor: pointer;
	min-width: 100px;
	height: 30px;
	float: left;
	padding: 5px 10px 0;
	background-color: #6ba3ff;
	transition: 200ms;
	color: #fff;
}

.botao-grandeza-ativo {
	background-color: #4285f4 !important;
}

#consumo-geral {
	width: 69.5%;
	height:170px;
	margin-left: 0;
	margin-right: 0.5%;
}

.consumo-geral-menor {
	width: 29.5%;
	height: 80px;
	margin-left: 0.5%;
	float: left;
	background-color: white;
	text-align: center;
	margin-bottom: 10px;
	font-size: 2em;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

.consumo-geral-menor h2 {
	text-transform: lowercase;
	font-variant: small-caps;
	margin: 12px 0 10px;
}

.botao-filtro-datalog {
	float:left;
	color:#fff;
	background-color:#4285f4;
	margin-left: 10px;
	padding-top:2px;
	height: 28px;
	width: 70px;
	text-align: center;
	transition: 300ms;
	cursor:pointer;
}

.botao-salvar-datalog {
	float:left;
	color:#fff;
	background-color:#03c731;
	margin-left: 10px;
	padding-top:2px;
	height: 28px;
	width: 70px;
	text-align: center;
	transition: 300ms;
	cursor:pointer;
}

.filtro-datalog-sincrono {
	float: left;
	width: 100%;
	padding: 0 10px;
}

#lista-postos td:hover {
	cursor: pointer;
}

.infowin-mapa div {
	float: left;
}

.infowin-mapa a {
	color: #4272db;
	text-decoration: none;
}

.infowin-mapa a:hover {
	text-decoration: underline;
}

.check-datalog {
	float: left; 
	text-align: center;
	padding: 10px;
	margin: 2px; 
	color: white;
}

#historico {
	background-color: #fff;
	float: left;
	width: 100%;
}

.historico-cabecalho {
	text-align: center;
	width:100%;
	float:left;
	background-color: #4679bd;
	color:#fff;
	display: inline-flex;
}

.historico-cabecalho div {
	float: left;
	padding: 10px 0;
	line-height: 1em;
}

.historico-cabecalho div small {
	font-size: 0.7em;
}

.expandir-historico {
	float: right !important;
	cursor: pointer;
	width: 5%;
	max-width: 30px;
	font-size: 20px;
	text-align: center;
	margin: auto 0;
	margin-left: auto;
	color: #555;
}

.linha-historico {
	width: 100%;
	cursor: pointer;
	float: left;
	border: 1px solid #cfcfcf;
	border-top: 0;
	border-bottom-color: #f0f0f0;
}

.linha-historico:first-child {
	border-top: 1px solid #cfcfcf;
}
.linha-historico:last-child {
	border-bottom: 1px solid #cfcfcf;
}

.linha-historico-selecionada {
	background-color: rgba(245, 245, 245, 0.5) !important;
	border-bottom: 1px solid #f0f0f0;
}

.linha-historico-principal,
.linha-historico-detalhe-principal {
	background-color: white;
	display: inline-flex;
	justify-content: flex-start;
	float: left;
	padding: 0;
	width: 100%;
}

.linha-historico-identificacao {
	width:100%;
	padding: 3px;
	font-size: 0.7em;
	text-transform: uppercase;
	background-color: rgba(245, 245, 245, 0.7);
	text-align: center;
	float: left;
}

.col-historico {
	float: left;
	text-align: center;
	margin: auto 0;
	padding: 5px 0;
}

.col-historico-detalhe-label {
	text-align: left;
	width: 250px;
}

.col-historico-tipo-medidor {
	width: 8%;
	padding: 0 5px;
}

.col-historico-subtitle {
	font-size: 0.6em;
	font-variant: small-caps;
	float: left;
	width: 100%;
	color: gray;
	text-transform: lowercase;
}

.col-historico-75 { width: 75%; }
.col-historico-70 { width: 70%; }
.col-historico-65 { width: 65%; }
.col-historico-60 { width: 60%; }
.col-historico-55 { width: 55%; }
.col-historico-50 { width: 50%; }
.col-historico-45 { width: 45%; }
.col-historico-40 { width: 40%; }
.col-historico-35 { width: 35%; }
.col-historico-30 { width: 30%; }
.col-historico-25 { width: 25%; }
.col-historico-20 { width: 20%; }
.col-historico-15 {	width: 15%; }
.col-historico-10 { width: 10%; }
.col-historico-7  { width: 7%; }
.col-historico-5  { width: 5%; }

.col-historico-grupo {
	width: 100%;
	float: left;
}

.col-historico-grupo-div {
	width: 50%;
	float: left;
	text-align: center;
	margin-bottom: 5px;
}

.borda-inferior {
	border-bottom: 1px dashed #ececec;
}

.col-historico-grupo-div small:first-child {
	color: #ccc;
	font-variant: small-caps;
	padding: 0;
}

.subtitulo-grupo-div {
	font-size: 0.7em;
}

.col-historico-consumo {
	text-align: center;
	font-size: 1.5em;
}

.consumo-label {
	color: #ccc;
	font-variant: small-caps; 
	font-size: 0.6em;
	line-height: 1.2em;
	width: 100%;
	float: left;
}

.historico-nenhum-registro {
	border: 1px solid #dfdfdf;
	float: left;
	padding: 10px;
	width: 100%;
	background-color: white;
	text-align: center;
}

.linha-historico-detalhe {
	width: 100%;
	float: left;
	display: none;
}

.linha-historico-detalhe2 {
	width: 100%;
	float: left;
}

.linha-historico-detalhe2 .linha-historico-detalhe-principal {
	border-bottom: 1px dashed #ececec;
}

.linha-historico-detalhe2 .linha-historico-detalhe-principal:last-child {
	border-bottom: 0;
}

.linha-historico-detalhe2 .col-historico {
	padding: 0;
}

.linha-historico-detalhe-alarmes {
	font-size: 0.8em;
	padding: 5px 10px;
	border-top: 1px dashed #dfdfdf;
	background: #fcfcfc;
}

.linha-historico-detalhe-alarmes > div {
	display: flex;
}

.linha-historico-detalhe-alarmes-lista {
	width: 25%;
	white-space: nowrap;
	padding: 0 7px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.linha-historico-detalhe-alarmes-lista > span:first-child {
	margin: 0;
	color: gray;
}

.fuel-label {
	padding: 2px 5px;
	color: white;
	white-space: nowrap;
	background-color: #2980b9;
}

.record-counter {
	float: right;
	font-size: 0.8em;
}

.historico-conteudo {
	float: left;
	width: 100%;
}

.linha-eventos {
	float: left;
	width: 100%;
	border: 1px solid #ccc;
	border-bottom: 0;
	background-color: white;
	padding: 10px;
}

.linha-eventos:last-child {
	border-bottom: 1px solid #ccc;
}

.linha-eventos div {
	float: left;
	padding: 0 10px;
}

.botao-salvar-historico {
	float:right;
	color:#fff;
	background-color:#03c731;
	margin-top: 25px;
	padding-top:3px;
	height: 30px;
	width: 100px;
	text-align: center;
	transition: 300ms;
	cursor:pointer;
}

.input-readonly {
	background-color:#f3f3f3;
	color:#777
}

.retangulos-info {
	background-color:#fff;
	height: 60px;
	min-width: 125px;
	float: left;
	margin-bottom: 10px;
	margin-left: 20px;
}

.retangulos-info h2 {
	margin-left:5px;
	float:left;
	font-size: 1.4em;
	font-variant: small-caps;
	text-transform: lowercase;
}

.retangulos-info p {
	font-size: 2em;
	line-height: 1em;
	margin-top: 13px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
	float: right;
	margin-right: 10px;
}

.div-posto-arquivo-form {
	width: 60%;
	float: left;
}
.div-posto-arquivo-form div {
	margin-bottom: 5px;
}
.erro-foto-posto {
	display: none;
	color:red;
	float: left;
	text-align: left;
	font-size: 12px;
	margin-top: 5px;
}

.div-lista-fotos {
	border: 1px solid #f0f0f0;
	height: 220px;
	width: 220px;
	margin: 10px;
	margin-right: 0;
	float:left;
	overflow: hidden;
	cursor: pointer;
}

#relatorio {
	background-color: white;
	border: 1px solid #ccc;
	float: left;
	margin: 20px 10px 20px 0;
	padding: 20px;
	width: 100%;
}

@media print {
	body * {
		visibility: hidden;
		overflow: visible !important;
	}

	.container, .container * {
		visibility: visible;
		overflow: visible;
	}

	.container {
		position: absolute;
		left: 0;
		right: inherit;
		bottom: inherit;
		top: 0;
		padding: 0;
		border: 0;
		height: 100%;
		display: block !important;
		margin: 0;
		width: auto;
		overflow: visible !important;
		float: none !important;
	}

	div#relatorio {
		border: 0;
		margin: 0;
		padding: 0;
		position: absolute;
		width: 650px;
	}

	#imprimir-relatorio {
		display:none;
	}
}

.linha-relatorio {
	float: left;
	border-bottom: 1px dashed #ccc;
	padding: 10px 5px;
	width: 100%;
}

.linha-relatorio:hover {
	cursor: pointer;
	background-color: #f9f9f9;
}

.sublinha-relatorio {
	float: left;
	width: 100%;
}

.sublinha-relatorio > h1 {
	font-size: 1em;
}

.sublinha-relatorio > table {
	border: 0;
	border-spacing: 0;
	border-collapse: separate;
	width: 640px;
}

.sublinha-relatorio > table th {
	background-color: #c9c9c9;
	padding: 5px 10px;
}

.sublinha-relatorio > table td {
	padding: 3px 10px;
	text-align: center;
}

.sublinha-relatorio > table tr:nth-child(even) {
	background-color: #f7f7f7;
}

.sublinha-relatorio > table tfoot td {
	border-top: 1px solid #ccc;
	background-color: #e9e9e9;
}

.linha-relatorio-box {
	float: left;
	padding: 5px;
}

.linha-relatorio-box-contador {
	float: left;
	width: 100px;
	text-align: center;
	font-size: 1.5em;
	border: 1px solid #cfcfcf;
	margin-right: 10px;
	padding-bottom: 5px;
}

.linha-relatorio-box-contador small {
	text-transform: lowercase;
	font-variant: small-caps;
}

.linha-relatorio-box-contador p {
	padding: 0;
	margin: 0;
}

#menu-pagina-principal {
	float: right;
	padding: 10px;
	width: 100%;
	height: 40px;
	text-align: center;
}

#menu-pagina-principal img {
	margin-right : 10px;
	cursor: pointer;
}

#logo-pagina-principal {
	width: 100%;
	text-align: center; 
	margin-top: 5%;
}

#rodape-pagina-principal {
	width: 100%;
	float: left;
	text-align: center;
	margin-top: 20px;
}

#menu-principal {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0 auto 10px;
	max-width: 1000px;
	
}

.mosaico-principal {
	height: 100px;
	width: 250px;
	margin: 5px;
	background-color: #f9f9f9;
	cursor: pointer;
	transition: 100ms;
	border-bottom: 5px solid;
	padding: 15px;
}

#menu-principal h2 {
	font-family: 'Roboto';
	font-size: 1.35em;
	margin: 0 0 5px;
}

#menu-principal span {
	font-family: 'Open Sans';
	font-size: 0.8em;
}

.label-pagina-principal {
	float:left;
	margin-left: 8px;
	margin-top: -5px;
}

.botao-config {
	float: left;
	width: 150px;
	height: 35px;
	border: 1px solid #ccc;
	margin-top: 10px;
	margin-right: 10px;
	cursor:pointer;
	font-size: 15px;
	background-color: #f5f5f5;
}

.botao-config-atualizar {
	background-color: #03c731;
}

.botao-config-salvar {
	background-color: #6ba3ff;
}

.bot-config-hover:hover {
	background-color: #e0e0e0;
}

.tabela-config-gateway {
	border: 1px solid #ccc;
	border-bottom-width: 0;
	border-spacing: 0;
	border-collapse: collapse;
	width: 700px;
}

.tabela-config-gateway tr {
	font-size: 0.9em;
}

.tabela-config-gateway td {
	padding: 8px;
	border-bottom: 1px solid #ccc;
}

.tabela-config-gateway td:last-child {
	text-align: center;
	width: 50px;
}

.tabela-config-gateway tr:last-child td {
	border-bottom: 1px solid #ccc;
}

.tabela-config-gateway input {
	text-align: right;
}

.ultima-atualizacao-config-gateway {
	color: gray; 
}

.tabela-config-gateway img {
	cursor: pointer;
}

#dialog-edit div {
	float: left; 
	width: 100%;
}

#dialog-edit small {
	color:red; 
	display: none;
}

#div-aviso {
	color: #aaa; 
	margin-top: 15px; 
	display: none;
}

.rel-consumo-posto-nome {
	padding-top: 12px;
	width: 225px; 
	overflow: hidden;
} 

.rel-consumo-posto-dados {
	text-align: center;
	padding: 0 10px;
	width: 160px;
	overflow: hidden;
}

.rel-consumo-posto-dados h2 {
	font-size: 1.2em;
	margin: 15px 0 5px;
	font-variant: small-caps;
	text-transform: lowercase;
}

.rel-consumo-posto-dados p {
	font-size: 2.2em;
	line-height: 1em;
	margin: 0;
	padding: 0 0 20px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

#config-permissoes table {
	border-spacing: 0;
	border-collapse: separate;
	width: 940px;
}

#config-permissoes table th {
	padding: 5px;
	height: 30px;
	border-bottom: 1px solid gray; 
	font-weight: bold;
	background-color: #f6f6f6;
	text-align: left;
	cursor: pointer;
	font-family: Tahoma, Arial, sans-serif;
	font-weight: bold;
	font-size: 11px;
	width: 90px;
	text-align:center;
	clear:left;
}

.opacity:hover {
	opacity: 0.5;
}

.filtro-datalog-assincrono {
	float: right;
	width: 100px;
	height: 30px;
	cursor: pointer;
	color: #fff;
	text-align: center;
	font-size: 18px;
	margin-bottom: 5px;
	margin-top: 25px;
	border-right: 1px solid #ccc;
	color: #555;
}

.filtro-datalog-assincrono div {
	border-radius: 50%; 
	width: 10px;
	height: 10px; 
	margin-left: 45px;
	background-color: #555;
	opacity: 0;
} 

.tarefas-pendentes-icon {
	background-color: #03c731; 
	width: 50px; 
	height: 50px; 
	position: absolute;
	bottom: 40px; 
	right: 40px; 
	border-radius: 50%; 
	text-align: center; 
	color: #fff;
	font-size: 22px; 
	padding-top: 12px; 
	cursor: pointer;
	box-shadow: 0px 3px 10px #888;
	transition: 200ms;
}

.lista-tarefas-pendentes {
	height: 320px;
	width: 650px;
	border: 1px solid #ccc;
	position: absolute;
	bottom: 10px;
	right: 120px;
	background-color: #fff;
	box-shadow: 0px 0px 10px #ccc;
	font-family: "Roboto", sans-serif;
	overflow: auto;
	display: none;
}

.fechar-tarefas-pendentes {
	float:right; 
	width: 50px; 
	height: 25px; 
	background-color: red;
	opacity: 0.7;
	margin-top: -8px;
	text-align: center;
	padding-bottom: 4px;
	cursor: default;
}

.fechar-tarefas-hover:hover {
	transition:200ms;
	opacity: 0.9;
}

.cabecalho-tarefas {
	font-size: 20px;
	background-color: #555;
	color: #fff;
	padding: 8px;
}

.tabela-tarefas {
	font-size: 14px;
	border-bottom-width: 0;
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

.tabela-tarefas thead {
	color: #505050;
	font-family: "Roboto", sans-serif;
	font-weight: bold;
	font-size: 14px;
}

.tabela-tarefas thead th {
	border-bottom: 1px solid #ccc;
	background-color: #f6f6f6;
	cursor: pointer;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: left;
	padding: 5px;
	padding-left: 8px;
}

.tabela-tarefas tbody tr {
	height: 32px;
	font-size: 12px;
}

.tabela-tarefas tbody td {
	border-bottom: 1px solid #ccc;
	background-color: #fff;
	cursor: default;
	padding-left: 8px;
}

#tabela-info-medidores {
	border: 0;
	background-color: #4679bd;
	border-spacing: 1px;
}

#tabela-info-medidores th {
	color: white;
	font-weight: normal;
}

#tabela-info-medidores td {
	text-align: center;
	background-color: white;
	padding: 5px;
}

#tabela-info-medidores tr:nth-child(even) td {
	background-color: #cedef3;
}

#tabela-info-medidores tr td:first-child {
	text-align: right;
}

.funcao-medidor {
	width: 35px; 
	height: 35px; 
	border-radius: 50%; 
	text-align: center; 
	font-size: 22px; 
	margin-left: 17px;
	opacity:0.6;
	transition: 200ms; 
	color:#fff;
	padding-top: 1px;
}

.medidor-admissao {
	background-color: #03c731;
}

.medidor-retorno {
	background-color: #f92424;
}

.funcao-medidor-sistema {
	float:left;
	color:#fff;
	border-radius: 50%; 
	width: 25px; 
	height: 25px;
	font-size:18px;
	opacity:0.6;
	transition: 200ms;
}


.funcao-medidor-consumo {
	float:left;
	color:#fff; 
	border-radius: 100px; 
	width: 25px; 
	height:25px;
	font-size:18px;
	opacity:0.6;
	transition: 200ms;
}

.combustivel-secundario {
	float:left; 
	width:300px; 
	text-align:center; 
	border-left:1px solid #f0f0f0;
	margin-top:10px;
	margin-bottom:10px;
}

.left-combust-second {
	float:left; 
	width:149px; 
	text-align: center;
}

.right-combust-second {
	float:right; 
	width:150px; 
	text-align: center;
}

.titulo-tabela-detalhe-sistema {
	float:left; 
	width:100px; 
	padding-left:10px;
}

.valor-tabela-detalhe-sistema {
	float:left; 
	width:100px; 
	text-align:center;
}

.legenda-historico-smc {
	float:left; padding-bottom: 10px;
}

.legenda-historico-smc div {
	width: 150px; 
	float: left; 
	height: 20px; 
	margin-left: 30px;
}

.legenda-historico-smc div div {
	width: 15px; 
	height: 15px; 
	background-color: #6ba3ff; 
	float:left;
	margin-left: 20px; 
	margin-top: 4px;
}

.triangulo {
	z-index:1;
	position:absolute !important; 
	left:-20px;
	top:315px;
	width:0;
	height:0;
	border:1em solid;
	font-size: 15px;
}

.direita { border-color: transparent transparent transparent #e0e0e0; }
.prabaixo { border-color: #e0e0e0 transparent transparent transparent; }
.esquerda { border-color: transparent #e0e0e0 transparent transparent; }
.pracima  { border-color: transparent transparent #e0e0e0 transparent; }

.info-hist-individual-icon {
	float: left; 
	color:#ccc; 
	font-size: 21px; 
	cursor: pointer;
}

.info-hist-individual-icon:hover {
	color: #888;
}

.info-hist-individual {
	z-index:0;
	position: absolute;
	left:10px;
	top:315px;
	font-size: 11.5px;
	text-align: center;
	padding-top: 7px;
	background-color: #e0e0e0;
	height: 30px;
	width: 330px;
}

@media(max-width: 1217px){
	.triangulo,
	.info-hist-individual {
		top:256px;
	}
}

.column-options a {
	padding: 0 3px;
}

.admissao-detalhes {
	width: 100px; 
	margin-left:165px; 
	margin-right:5px; 
	float:left;
}

.botao-exportar-datalog-smc {
	float:left; 
	color:#fff;
	background-color:#03c731;
	width: 100%;
	padding-top:6px; 
	height: 35px;
	text-align: center;
	cursor:pointer;
}

.botao-exportar-datalog-smc:hover {
	opacity:0.6;
}

.div-card-sistema {
	float:left; 
	width:50%; 
	height: 50px; 
	padding-top: 10px;
}

.div-ns-card-sistema {
	margin-top: 2px;
	text-align:center; 
	width:100%; 
	float:left;
	font-size: 12px;
}

.cards-info-gateway {
	float:left; 
	background-color: #fff; 
	border: 1px solid #ccc; 
	width:195px; 
	height: 75px; 
	margin-right: 20px; 
	margin-bottom: 20px;
}

.div-cards-info-gateway {
	flaot:left; 
	height: 210px; 
	padding:20px; 
	padding-right:0; 
	width:460px;
}

.alarms-info-gateway-titulo {
	width: 100%;
	float: left; 
	background-color: #4679bd; 
	color:#fff;
	height: 37.5px; 
	text-align: center; 
	padding-top: 6px;
}

.alarms-info-gateway {
	width: 100%;
	float: left; 
	height: 37.5px; 
	text-align: center; 
	padding-top: 6px;
}

.dashboard-submenu-button {	
	font-size: 1.1em;
	float: left;
	margin: 0 10px 20px;
	width: 220px;
	background-color: white;
	text-align: center;
	padding: 5px 15px 15px;
	overflow: auto;
	color: black;
	text-decoration: none;
	cursor: pointer;
}

.dashboard-submenu-button:hover {
	border-color: gray;
}

.dashboard-submenu-button span:first-child {
	float: left;
	font-size: 6em;
	color: gray;
	width: 100%;
}

.dashboard-submenu-button h2 {
	font-size: 1em;
	line-height: 1em;
	margin: 0;
}

.dashboard-submenu-button small {
	font-size: 0.8em;
	float: left;
	width: 100%;
	padding: 3px 0;
}

.diag-desativado {
	position: fixed;
	bottom: 40px;
	left: 0;
	right: 0;
	background-color: rgba(192, 57, 43, 0.8);
	padding: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
}

.diag-desativado span {
	display: block;
	float: left;
}

/* paginador */

.paginador-conteudo {
	float: left;
	width: 50%;
}

.paginador-paginas {
	height: 50px; 
	width: 490px;
}

.paginador-paginas div {
	width: 30px; 
	height: 30px; 
	padding-top: 3px;
	background-color: #fff; 
	float: left; 
	margin: 10px 10px 5px 0; 
	text-align: center;
	cursor: pointer;
	border: 1px solid #ccc
}

.page-active {
	color: orange;
	border-color: orange !important;
}

/* --- */

.div-slider-lateral-medidor {
	float: left; 
	height: 20px;
	width: 100%; 
	margin-bottom: 5px; 
}

.div-slider-lateral-medidor div {
	float:left;
	background-color: #d6aa23;
	height: 20px; 
	width:60px;
	cursor: pointer;
	transition: 200ms;
	font-size: 14px;
}

.slider-medidor-ativo {
	background-color: #fce6a5 !important;
}

/* dialogs */

.dialog {
	display: none;
}

.dialog-input {
	font-size: 3em; 
	text-align: center;
	width: 100%;
}

.dialog-buttons {
	margin-top: 10px;
	display: flex;
	justify-content: center;
}

.dialog-buttons a {
	padding: 20px;
	color: white !important;
}

.dialog-bt-confirm {
	background-color: #27ae60;
	margin-right: 15px;
}

.dialog-bt-cancel {
	background-color: #7f8c8d;
}

.dialog-conteudo {
	font-family: "Open Sans", sans-serif; 
}

.dialog-conteudo p {
	text-align: justify; 
	text-indent: 1em;
}

.dialog-conteudo h1 {
	font-family: Roboto, sans-serif; 
	font-weight: 100;
	color: #da0000;
}

.dialog-button {
	border: 1px solid #ccc;
	float: left;
	width: 48%;
	margin: 0 1%;
	background-color: white;
	text-align: center;
	padding: 15px;
	cursor: pointer;
}

.dialog-button span {
	font-size: 5em;
}

.dialog-button-ok {
	color: #27ae60;
}

.dialog-button-ok:hover {
	border-color: #27ae60;
}

.dialog-button-cancel {
	color: #e74c3c;
}

.dialog-button-cancel:hover {
	border-color: #e74c3c;
}

.nenhuma-foto {
	border: 2px dashed #ccc;
	width:220px;
	margin:10px;
	height: 220px;
	color: #ccc;
	text-align: center;
	padding-top: 100px;
}
.nao-encontrado {
	background-color: #fff;
	border: 1px solid #ccc;
	float: left;
	padding: 10px;
	width:100%;
}

/* sites */

#sites {
	background-color: #fff;
	float: left;
	width: 100%;
}

.expandir-site {
	float: right !important;
	cursor: pointer;
	width: 5%;
	max-width: 30px;
	font-size: 20px;
	text-align: center;
	margin: auto 0;
	margin-left: auto;
}

.linha-site {
	width: 100%;
	cursor: pointer;
	float: left; 
	border: 1px solid #cfcfcf;
	margin: 0 0 10px;
}

.linha-site:first-child {
	border-top: 1px solid #cfcfcf;
}

.linha-site:last-child {
	border-bottom: 1px solid #cfcfcf;
}

.linha-site-principal,
.linha-site-detalhe-principal {
	display: inline-flex;
	float: left;
	padding: 0;
	width: 100%;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.linha-site-principal:hover {
	background-color: #f9f5d5;
}

.linha-site-detalhe-principal {
	 border-bottom: 1px dashed #f0f0f0;
}

.linha-site-detalhe-principal:last-child {
	border-bottom: 0;
}

.linha-site-detalhe-principal span {
	padding: 5px 10px;
}

.linha-site-detalhe-principal small {
	text-align: center;
	padding-bottom: 5px;
}

.col-site {
	float: left;
	margin: auto 0;
	padding: 10px;
}

.linha-site-detalhe {
	width: 100%;
	float: left;
}

.linha-site-selecionada {
	background-color: rgba(245, 245, 245, 0.5);
	border-bottom: 1px solid #f0f0f0;
}

/* tabela de variaveis */

.tabela-vars,
.tabela-vars-alarmes,
.tabela-config-alarmes {
	background-color: #fff;
	border: 1px solid #ccc;
	border-bottom: 0;
	border-spacing: 0;
	width: 100%;
}

.tabela-vars td,
.tabela-vars-alarmes td,
.tabela-config-alarmes td {
	padding: 10px;
	border-bottom: 1px solid #ccc;
}

.tabela-vars td {
	font-size: 1.2em;
}

.tabela-config-alarmes tr td,
.tabela-vars tr td:first-child {
	font-family: Roboto, sans-serif;
	font-size: 1em;
	font-weight: 300;
	width: 30%;
}

.tabela-vars-alarmes tr td:nth-child(odd) {
	color: #cfcfcf;
	font-size: 1.2em;
	width: 20px;
}

.tabela-var-hex {
	color: #ccc !important;
	font-size: 0.8em !important;
	width: 120px;
}

.tabela-var-edit {
	width: 20px;
}

.div-bandeira {
	width: 100px; 
	height: 100px; 
	cursor: pointer; 
	margin-bottom:15px; 
	padding-top: 30px;
	border: 2px dashed #ccc; 
	border-radius:10px; 
	text-align: center; 
	font-size:30px; 
	color: #ccc;
}

.img-bandeira {
	width: 100px; 
	height: 100px; 
	margin-bottom:11px;
	cursor: pointer;
}

.div-marca {
	width: 280px;
	height: 100px;
	margin-left: 180px;
	cursor: pointer;
	margin-bottom:15px;
	padding-top: 30px;
	border: 2px dashed #ccc;
	text-align: center;
	font-size:30px;
	color: #ccc;
}

.img-marca {
	margin-bottom:10px;
	width: 280px;
	height: 100px;
	margin-left: 180px;
	cursor: pointer;
}

.dialogs {
	display: none;
}

.botao-voltar-dashboard-menu {
	background-color: #e74c3c;
	color: white;
	padding: 2px 10px;
	font-size: .8em;
}

.botao-voltar-dashboard-menu:hover {
	border-color: #505050;
}

.gateway-diag-dust {
	float: left;
	background-color: white;
	border: 1px solid #ccc;
	width: 242px;
	margin: 10px;
	text-align: center;
}

.gateway-diag-dust h2 {
	font-size: 1.4em;
	font-variant: small-caps;
	text-transform: lowercase;
}

.gateway-diag-dust p {
	font-size: 3em;
	line-height: 1em;
	margin: 0;
	padding: 0 0 20px;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
}

.gateway-diag-dust small {
	margin-left: 3px;
	font-size: 0.4em;
	line-height: 0;
}

.botao-mesclar {
	float: right;
	height: 30px;
	margin-top: 21px;
	text-align: center;
	font-size: 14px;
	color: #4285f4;
	border: 1px solid #4285f4;
	padding-top: 4px;
	width: 200px;
	cursor: pointer;
}

.mesclar-icon {
	color:#6ba3ff;
	font-size: 25px;
	display: none;
}

.mesclar-icon-bloqueado {
	color: #ccc;
	font-size: 25px;
}

#opcoes-mesclar {
	display: none;
	float: right;
	height: 30px;
	margin-top: 21px;
	text-align: center;
	font-size: 14px;
}

#opcoes-mesclar div {
	cursor: pointer;
	min-width: 100px;
	height: 30px;
	float: left;
	color: #4285f4;
	border: 1px solid #4285f4;
	padding: 5px 10px 0;
	transition: 200ms;
}

#opcoes-mesclar div:hover {
	font-weight: bold;
}

.opcao-cancelar {
	margin-left: 20px;
	color: red !important;
	border: 1px solid red !important;
}

.bloco-cards {
	float: left;
	width: 100%;
}

.coluna-cards {
	float: left;
	text-align: center;
	padding: 0 10px;
	width: 50%;
}

@media(max-width: 1080px) {
	.coluna-cards {
		min-width: 50% !important;
	}
}

.card {
	width: 100%;
	max-width: 700px;
	margin: 0 auto 20px;
	border: 1px solid #2980b9;
	background-color: white;
}

.card small {
	font-size: 0.7em;
	font-weight: 100;
	color: gray;
	padding: 0 7px;
}

.card-titulo {
	width: 100%;
	background-color: #2980b9;
	color: white;
	text-transform: uppercase;
	font-size: 0.8em;
	padding: 2px 0;
}

.card-valor-principal {
	width:100%;
	font-size: 2em;
	padding: 5px 0;
}

.card-valor-secundario {
	width:100%;
	border-top: 1px dashed #3498db;
	display: inline-flex;
}

.card-enabled-status small {
	width: 100%;
	color: white;
	padding: 2px 0;
}

.status-activated {
	background-color: #2ecc71;
}

.status-deactivated {
	background-color: #e74c3c;
}

.card-valor-secundario-coluna {
	width: 50%;
	font-size: 1.2em;
	padding-bottom: 5px;
}

.card-valor-secundario-coluna h1 {
	color: gray;
	font-size: 0.8em;
	font-variant: small-caps;
	text-transform: lowercase;
	line-height: 0.8em;
	margin: 10px 0 0;
	padding: 0;
}

.card-valor-secundario-coluna span {
	font-size: 1.4em;
	line-height: 1.1em;
}

.card-flex {
	display: flex; 
	justify-content: center;
}

.card-rodape {
	border-top: 1px solid #3498db;
	background-color: rgba(52,152,219, 0.6);
	font-size: 0.6em;
	color: white;
}

.opacity-03 {
	opacity: 0.3;
}

.icone-alarme {
	font-size: 1.4em;
	opacity: 0.7;
	padding: 0 auto;
}

.icone-alarme-critico { color: red; }
.icone-alarme-erro { color: red; }
.icone-alarme-aviso { color: orange; }
.icone-alarme-info { color: gray; }

.ultima-atualizacao-seguranca {
	float: right;
	width: 250px;
	height: 30px;
	margin-top: 20px;
	margin-right: 2%;
	padding-top: 5px;
	text-align: center;
	border: 1px solid #ccc;
	background-color: #f5f5f5;
	color: #aaa;
	font-size: 0.8em;
}

.grupo-tanques {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.grupo-tanques .data-atualizacao {
	width: 100%;
	text-align: center;
	color: #ccc;
	margin-bottom: 20px;
}

.tanque-container {
	float: left;
	margin: 0 25px 10px 0;
	text-align: center;
}

.tanque-container h3 {
	margin: 0;
	font-size: 1em;
}

.tanque-container h4 {
	margin: 3px 0 10px;
	font-size: 0.9em;
	line-height: 1em;
	color: gray;
}

.tanque-container span {
	font-size: 1.1em; 
}

.tanque-container small {
	color: gray;
	font-size: 0.8em;
}

.tanque-outdated-msg {
	font-size: 0.8em !important;
	color: rgba(231, 76, 60, 0.8) !important;
	width: 100%;
	clear: both;
	float: left;
}

.tanque {
	height: 350px;
	width: 200px;
	position: relative;
	background: #ECF0F1;
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-end;
	border-radius: 25px;
	border: 1px solid #BDC3C7;
	margin: 0 auto;
}

.tanque > span {
	display: block;
	width: 100%;
	background: #2980B9;
	position: relative;
	overflow: hidden;
	border-radius: 0 0 25px 25px;
}

.tanque > small {
	padding-right: 10px;
	font-size: 1.2em;
}

.diesel-bgcolor {
	background-color: #ff9933 !important;
}

.marine-fuel-bgcolor {
	background-color: #6699cc !important;
}

.card-valor-edit {
	background-image: url(../imgs/edit2.png);
	background-repeat: no-repeat;
	background-position: right;
}

.tabela-config {
	border: 1px solid #ccc;
	border-spacing: 0;
	border-collapse: collapse;
	background-color: white;
	width: 100%;
	max-width: 600px;
}

.tabela-config tr {
	height: 32px;
	font-size: 0.9em;
}

.tabela-config tr td:first-child {
	text-align: right;
	font-weight: bold;
	color: #2980b9;
}

.tabela-config tr td:last-child {
	text-align: center;
}

.tabela-config td {
	border-bottom: 1px solid #ccc;
	background-color: #fff;
	cursor: default;
	padding: 10px;
}

.tabela-config tr:last-child td {
	border-bottom: 0;
}

.contador-mesclados {
	float:right; 
	color: #777; 
	margin-right: 5px;
	margin-left: -100px;
	color: #6ba3ff;
}

.contador-mesclados:hover {
	text-decoration: underline;
}

.tabela-desmesclar {
	float: left;
	width: 100%;
	border: solid 1px #ccc;
}

.tabela-desmesclar-cabecalho {
	float:left;
	width:100%;
	text-align: center;
	background-color: #4679bd;
	color:#fff;
}

.tabela-desmesclar-cabecalho div {
	float: left;
	padding: 10px 0;
} 

.tabela-desmesclar-linha {
	float: left; 
	width: 100%; 
	border-bottom: solid 1px #f0f0f0;
	text-align: center;
	height: 40px;
	padding-top: 10px;
}

.tabela-desmesclar-linha div {
	float: left;
}

.td-is-master {
	width: 30px;
	text-align: center;
	padding-left: 25px;
	padding-bottom: 45px;
}

.botao-exportar-historico {
	border: 1px solid #ccc; 
	margin-top: 10px;
	float: left; 
	width: 100%; 
	height: 30px; 
	padding-top: 3px; 
	background-color: #fff;
}

.botao-exportar-historico:hover {
	border-color: #808080;
} 

.hover-t:hover {
	background-color: #f9f5d5;
}

.importar-encerrantes:hover {
	background-color: #4285f4 !important;
}

.icone-grafico-enc {
	float: right; 
	height: 30px; 
	margin-top: 21px; 
	text-align: center; 
	font-size: 18px;
	color: #888;
	padding-top: 4px;
	cursor: pointer;
}

.mensagem-encerrantes {
	width: 25px; 
	height: 25px; 
	border-radius: 50%; 
	text-align: center; 
	color:#fff; 
	cursor: default;
	padding-top: 4px;
	background-color: red;
}

.corrigir-msg-erro {
	float: left;
	margin-right: 100px;
}

.legenda-mapa {
	float: left; 
	width: 100px; 
	height: 25px; 
	border: 1px solid #ccc;
	border-right:0px; 
	padding-top: 2px; 
	background-color: #fff; 
	margin-left: 10px;
}

.legenda-mapa small {
	float: left; 
	width: 100%; 
	text-align: center;
}

.escala-legenda-consumo {
	width: 300px; 
	height: 25px; 
	float: left; 
	border: 1px solid #ccc; 
	padding-top: 2px; 
	background-color: #fff; 
}

.div-cor-legenda-consumo {
	float: left; 
	width: 200px; 
	margin-left: 5px; 
	padding-top: 5px;
}
.cor-legenda-consumo {
	width:40px; 
	height: 10px; 
	float: left;
	margin-left: 10px;
}

.pontos-grafico-linha {
	float:right; 
	width:120px; 
	height:30px; 
	text-align: right; 
	color: #999; 
	cursor: pointer;
}

.div-legenda-grafico-bateria {
	float: left; 
	width: 450px; 
	height: 90px; 
	border: 1px solid #ccc; 
	margin-left: 30px; 
	background-color: #fff;
}

.div-legenda-grafico-bateria-cores {
	float: left; 
	height: 100%; 
	width: 60px; 
	border-right: 1px solid #ccc;
}

.div-legenda-grafico-bateria-texto {
	float: left; 
	height: 100%; 
	width: 388px;
}

.div-legenda-grafico-bateria-texto small {
	float: left; 
	height: 20px; 
	width: 100%; 
	padding-top: 5px; 
	padding-left: 5px;
}

.cores-legenda-bateria {
	float:left; 
	height: 10px; 
	width:40px; 
	margin-top: 10px; 
	margin-left: 9px;
}

.botao-dados-fornecedor {
	float: right; 
	width: 200px; 
	height: 30px;
	background-color: #f3f3f3; 
	margin-top: 150px;
	margin-right: 20px;
	padding-top: 4px;
	padding-left: 8px;
	border: 1px solid #ccc;
	cursor: pointer;
}

.campo-fornecedor {
	float: left; 
	margin-bottom: 10px; 
	width: 100%;
}

.campo-fornecedor span {
	float:left;
	width: 100%; 
	margin-bottom: 5px;
}

.botao-remover-reg-smc {
	width: 150px;
	height: 40px;
	border: 1px solid #ccc;
	background-color: red;
	float: left;
}

.excluir-reg-hist {
	margin-bottom: 10px; 
	float:left; 
	width: 100%;
}

.linha-excluir-reg-smc {
	float: left;
	height: 30px; 
	text-align: right;
	width: 100%;
	padding: 5px;
	font-size: 0.8em;
	color: gray;
	text-decoration: underline;
}

.linha-excluir-reg-smc:hover {
	opacity: 0.7;
}

.floating-button {
	position: fixed;
	right: 20px;
	bottom: 60px;
	background-color: #2980b9;
	color: white; 
	border-radius: 40px;
	padding: 8px 16px;
	font-size: 1.2em;
}

.audit-link {
	float: right;
	color: #aaa;
	font-size: 0.8em;
	text-decoration: underline;
	margin-top: 10px;
}

.advanced-link {
	color: #aaa;
	font-size: 0.8em;
	text-decoration: underline;
	margin-top: 10px;
}

.history-table {
	border: 1px solid #efefef;
	border-spacing: 0;
	background-color: #fff;
	text-align: left;
	width: 100%;
}

.history-table div {
	margin-left: 15px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	text-align: center;
	color: #fff;
	cursor: default;
	padding-top: 4px;
}

.history-table td {
	border-bottom: 1px solid #f3f3f3;
	padding: 10px 0;
}

.history-table tr:last-child td {
	border:0;
}

.history-table td table td {
	border: 0;
	padding: 0;
}

/* FLASH MSG */

.flash-msg {
	font-size: 2em;
	text-align: center;
	position: fixed;
	width: 100%;
	margin-left: 0;
	bottom: 40px;
	left: 0;
	padding: 10px;
	color: white;
	transition: width 2s, height 4s;
	display: none;
	line-height: 1em;
}

.flash-msg-success {
	background-color: rgba(46, 204, 113, 0.9);
}

.flash-msg-failed {
	background-color: rgba(231, 76, 60, 0.9);
}

.alarm-msg {
	float: left;
	clear: left;
}

.falling-edge-alarm-msg {
	color: green;
}

.falling-edge-alarm-msg:after {
	content: '\e810';
	font-family: "gemap-font"; 
	padding-left: 8px;
}

.results-filter-selector {
	list-style: none; 
	display: flex;
	margin: 0 0 10px;
	padding: 0;
	color: gray;
}

.results-filter-selector li {
	padding: 5px 10px;
	border-left: 1px solid gray;
}

.results-filter-selector li:first-child {
	border-left: 0;
}

.results-filter-selector li.selected {
	color: #2c3e50;
	font-weight: bold;
	background-color: rgba(189, 195, 199,0.5);
}

#permissions-table th small {
	color: #bdc3c7;
}