.profile-image-marker{width: 35px;height: 35px;margin: 0 auto 5px auto; border-radius:50%; display:block;}
.profile-image-perfil{width: 100px;height: 100px;margin: 0 auto 5px auto; border-radius:50%;}
#toTop{border-radius: 50%; width: 30px; height: 30px; background-color: rgb(242, 22, 40);-webkit-box-shadow: 0px 0px 12px -2px rgba(0,0,0,0.44);-moz-box-shadow: 0px 0px 12px -2px rgba(0,0,0,0.44);box-shadow: 0px 0px 12px -2px rgba(0,0,0,0.44); cursor:pointer;	position: fixed;right: 10px;bottom: 10px;display: none;}
.border-default{border: 2px solid #3f51b5; border-radius: 5px; cursor: pointer; color: #3f51b5 !important}
.border-selecionado{border: 2px solid #4caf50; border-radius: 5px; cursor: pointer; color: #4caf50 !important}

#header-m-a{width: 50px; text-align: left !important;}
#header-m-a-d{padding-top: 8px; width: 150px; text-align: left !important}

@media (max-width: 399px) {
	#header-m-a{padding-top: 0px; width: 100%; text-align: center !important;}
	#header-m-a-d{width: 100%; text-align: center !important;}
}

/**Colors*/
.red{color: #DA0A0A;}
.green{color: green; }
.blue{color: blue !important; }
.white{color: white !important; }
.black{color: black !important; }
.gray{color: #949494 !important; }
.gray-light{color: #e2e1e1 !important};
.gray-dark{color: #757575 !important};
.yellow{color: #F7DE08 !important;}
.c-padrao{color: #222222 !important; }
.light-green{color: #aeffae !important; }
.u-red{color: #F44336 !important; }
.u-green{color: #4CAF50 !important; }
.u-orange{color: #FF9800 !important; }
.u-blue{color: #03A9F4 !important; }
.u-pink{color: #E91E63 !important; }

/* Backgounds colors */
.BackBlack{background-color: black;}
.BackWhite{background-color: white; color: black !important}
.BackGreen {background-color : green;}
.BackCinza{background-color:gray;}
.BackAzul{background-color: #0b66b1;}
.BackDourado{background-color: #F7DE08;}
.BackOrange{background-color:#FF7800;}
.BackRed{background-color: #ea0c0c;}
.BackPurple {background-color: #F66006;}
.BackYellow {background-color: yellow;}
.BackAzulPadrao{background-color: #353e50;}

.TituloSelect{margin-left:5px; font-size: 12px; color: #3F51B5; display: block;}
.TextUpper{text-transform: uppercase;}
.TextLower{text-transform: lowercase;}


@-moz-keyframes pulsate {
	from {
		-moz-transform: scale(0.25);
		opacity: 1.0;
	}
	95% {
		-moz-transform: scale(1.3);
		opacity: 0;
	}
	to {
		-moz-transform: scale(0.3);
		opacity: 0;
	}
}
@-webkit-keyframes pulsate {
	from {
		-webkit-transform: scale(0.25);
		opacity: 1.0;
	}
	95% {
		-webkit-transform: scale(1.3);
		opacity: 0;
	}
	to {
		-webkit-transform: scale(0.3);
		opacity: 0;
	}
}

/* get the container that's just outside the marker image, which just happens to have our Marker title in it */
#map div.gmnoprint[title^="TORRE UP"] {
	-moz-animation: pulsate 2.0s ease-in-out infinite;
	-webkit-animation: pulsate 2.0s ease-in-out infinite;
	border:1pt solid #fff;
	/* make a circle */
	-moz-border-radius:85px;
	-webkit-border-radius:85px;
	border-radius:85px;
	/* multiply the shadows, inside and outside the circle */
	-moz-box-shadow:inset 0 0 5px #00A800, inset 0 0 5px #00A800, inset 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800;
	-webkit-box-shadow:inset 0 0 5px #00A800, inset 0 0 5px #00A800, inset 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800;
	box-shadow:inset 0 0 5px #00A800, inset 0 0 5px #00A800, inset 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800, 0 0 5px #00A800;
	/* set the ring's new dimension and re-center it */
	height:85px!important;
	width:85px!important;
    margin: -10px 0px 0px -25px;
}

/* hide the superfluous marker image since it would expand and shrink with its containing element */
/*	#map div[style*="987654"][title] img {*/

#map div.gmnoprint[title^="TORRE UP"] img {
	display:none;
}

/* compensate for iPhone and Android devices with high DPI, add iPad media query */
	
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (device-width: 768px) {
	#map div.gmnoprint[title^="TORRE UP"] {
		margin: -10px 0px 0px -18px;
	}
}


/* -------------------------------------------------------------------------------------------------------------------------- */
/* get the container that's just outside the marker image, which just happens to have our Marker title in it */
#map div.gmnoprint[title^="TORRE OFF"] {
	-moz-animation: pulsate 2.0s ease-in-out infinite;
	-webkit-animation: pulsate 2.0s ease-in-out infinite;
	border:1pt solid #fff;
	/* make a circle */
	-moz-border-radius:85px;
	-webkit-border-radius:85px;
	border-radius:85px;
	/* multiply the shadows, inside and outside the circle */
	-moz-box-shadow:inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, 0 0 5px #CC0000, 0 0 5px #CC0000, 0 0 5px #CC0000;
	-webkit-box-shadow:inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, 0 0 5px #CC0000, 0 0 5px #CC0000 , 0 0 5px #CC0000;
	box-shadow:inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, inset 0 0 5px #CC0000, 0 0 5px #CC0000 , 0 0 5px #CC0000, 0 0 5px #CC0000;
	/* set the ring's new dimension and re-center it */
	height:85px!important;
	width:85px!important;
	margin: -10px 0px 0px -25px;
}

/* hide the superfluous marker image since it would expand and shrink with its containing element */
/*	#map div[style*="987654"][title] img {*/

#map div.gmnoprint[title^="TORRE OFF"] img {
	display:none;
}

/* compensate for iPhone and Android devices with high DPI, add iPad media query */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (device-width: 768px) {
	#map div.gmnoprint[title^="TORRE OFF"] {
		margin: -10px 0px 0px -25px;
	}
}

.dashboard .colorbox.colorbox-5 div:first-child {background-color: #DA0A0A; color: white !important; }
.dashboard .colorbox.colorbox-5 div:last-child {background-color: #DA0A0A; color: white !important;}

.dashboard .colorbox.colorbox-6 div:first-child {background-color: #3f51b5; color: white !important; }
.dashboard .colorbox.colorbox-6 div:last-child {background-color: #3f51b5; color: white !important;}

.dashboard .colorbox.colorbox-7 div:first-child {background-color: #4CAF50; color: white !important;}
.dashboard .colorbox.colorbox-7 div:last-child {background-color: #4CAF50; color: white !important;}

.dashboard .colorbox.colorbox-10 div:first-child {background-color: white; color: black !important;}
.dashboard .colorbox.colorbox-10 div:last-child {background-color: white; color: black !important;}

.dashboard .colorbox.colorbox-10 div:first-child .material-icons {color: black !important;}
.dashboard .colorbox.colorbox-10 div:last-child span {color: black !important;}


.TituloCPadrao{margin-left:5px; font-size: 12px; color: #222222; display: block;}

.separator{border-bottom: 1px solid #ddd; width:100%; height:2px; margin: 5px auto 20px auto; float:left;}


.layout-wrapper .layout-menu .profile .profile-image-lci{width: 70px;height: 70px;margin: 0 auto 5px auto; border-radius:50%; display:block;}

.on{background-color: #4CAF50 !important; color: white !important; background-image:none!important;}

.off{background-color: #DA0A0A !important; color: white !important; background-image:none!important;}
.offSelect{color: #DA0A0A !important; font-weight: bold;}

body .bt-red .ui-widget-header { background-color: red; color: #ffffff; font-size: 16px;  border: 1px solid #e40202;}
body .bt-green .ui-widget-header { background-color: #4CAF50; color: #ffffff; font-size: 16px;  border: 1px solid #2E7D32;}

.quadro-base{width: 190px; min-height: 90px; margin: 5px; display: inline-block; color: white; text-align: center;} 

.quadro-base div:first-child{height: 60px; width: 100%; line-height: 60px; font-size: 45px;}
.quadro-base div:last-child{height: 30px; width: 100%; font-size: 15px;}
.logoOperadora{width: 85px !important; height: 50px; margin-top: 5px; display: inline-block !important;}

#map{position: absolute !important;}
.mp{overflow: auto; position: absolute; width:100%; height: calc(100% - 75px); margin-left: -15px; margin-top: -20px; transition: 0.3s;}
.itens{margin: 10px 0px 20px 10px; text-align: center;}


#center-bottom{text-align: center; width: 100%;}
#barra-texto{text-align: center; width: 100%; min-height: 1px; font-size: 20px; color:white}
.host-off{background-color: #ea0c0c;}
.host-on{display: none !important;}
.direita{width: 220px; height: 98%; position: absolute; right: 0px; overflow: auto; overflow-x: hidden; margin-right: 35px;}


.icon-olt{position: absolute;}
.descricao-olt{margin: 2px 0px 0px 5px; position: absolute;}
.descricao-olt2{margin: 3px 0px 0px 5px; position: absolute;}

.online-power{position: absolute; margin-left: -15px; display: inline !important;}
.offline-power{position: absolute; margin-left: -15px;}

body .dlg-off .ui-dialog-titlebar{
	background-color: #ea0c0c !important;
	color: white !important;
}

body .dlg-on .ui-dialog-titlebar{
	background-color: #4CAF50 !important;
	color: white !important;
}

body .dlg-padrao .ui-dialog-titlebar{
	background-color: #2f4050 !important;
	color: white !important;
}



.BackWhite .info-porta{color: black !important;}

.badge-porta{
	position: absolute;
    right: 6px;
    top: 6px;
    background-color: orange;
    color: #ffffff;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    padding: 2px 3px;
    display: block;
    font-size: 12px;
    line-height: 12px;
    width: 10px;
}

.info-porta{
	position: absolute;
    right: 2px;
    top: 2px;
    color: #ffffff;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    padding: 2px 4px;
    display: block;
    font-size: 12px;
    line-height: 12px;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 320px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.ui-datatable.customHover .ui-datatable-data > tr.ui-datatable-even:hover,
.ui-datatable.customHover .ui-datatable-data > tr.ui-datatable-odd:hover {
	background-color: #e3e3e3;
}



@media (max-width: 645px) {
	#barra-texto{font-size: 12px;}
}

@media (max-width: 1025px) {
	.direita{display: none !important;}
}

@media (min-width: 1025px) {
	.right-panel{display: none !important;}
	.mp{width: calc(100% - 75px);}
	.layout-wrapper.layout-menu-slim .layout-menu .profile .profile-image-lci{width: 40px;height: 40px;margin: 0 auto 5px auto; border-radius:50%; display:block;}
}

.login-body-lci {
	background-image: url("/monitoramento/javax.faces.resource/images/7961.jpg.xhtml?ln=lci-layout");
	background-repeat: no-repeat;
	background-size: cover;
}

.login-body-lci .login-panel {
	width: 400px;
	margin: 0 auto;
	background-color: #ffffff;
	margin-top: 125px;
	padding: 30px 50px 50px 50px;
}

.mp {
	overflow: auto;
	position: fixed;
	width: 100%;
	height: calc(100% - 65px);
	transition: 0.3s;
    margin-left: -7px;
    margin-top: 60px;
}

/**MAPA DADOS DA FIBRA*/
.df-raiz{display: inline-block; min-width: 150px; width: 100%; height: 35px; margin-right: 10px; border-radius: 2px;text-align: left}
.df-title{padding: 9px; float: left; font-weight: bold;}

.df-green{color:white}
.df-raiz.df-green div:first-child{height: 100%; float: left; background-color: #15861b; border-radius: 2px; width: 100px; border: 1px solid #15861b;}
.df-raiz.df-green div:last-child{float: left; height: 100%; background-color: #4CAF50; border-radius: 2px; min-width:150px; width: calc(100% - 100px); margin-left: -5px; border: 1px solid #15861b;}

.df-red{color:white}
.df-raiz.df-red div:first-child{height: 100%; float: left; background-color: #d00505; border-radius: 2px; width: 100px; border: 1px solid #d00505;}
.df-raiz.df-red div:last-child{float: left; height: 100%; background-color: #ea0c0c; border-radius: 2px; min-width:150px; width: calc(100% - 100px); margin-left: -5px; border: 1px solid #d00505;}

.df-orange{color:white}
.df-raiz.df-orange div:first-child{height: 100%; float: left; background-color: #f47b03; border-radius: 2px; width: 100px; border: 1px solid #f47b03;}
.df-raiz.df-orange div:last-child{float: left; height: 100%; background-color: #f49103; border-radius: 2px; min-width:150px; width: calc(100% - 100px); margin-left: -5px; border: 1px solid #f47b03;}

.df-gray{color:#757575}
.df-raiz.df-gray div:first-child{height: 100%; float: left; background-color: white; border-radius: 2px; width: 100px; border: 1px solid #c1bfbf;}
.df-raiz.df-gray div:last-child{float: left; height: 100%; background-color: white; border-radius: 2px; min-width:150px; width: calc(100% - 100px); margin-left: -5px; border: 1px solid #c1bfbf;}


/**Push*/
#push{position: fixed; z-index: 999999 !important; text-decoration: none; background-color: white; bottom: 5px; list-style-type: none; left: -15px;}

.user-push{border-radius: 50%;	width: 40px; height: 40px; -moz-border-radius: 200px 200px 200px 200px; -webkit-border-radius: 200px 200px 200px 200px; border: 6px solid #e0e0e0;}
.info-geral{-webkit-box-shadow: 0px 0px 16px -2px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 16px -2px rgba(0,0,0,0.75); box-shadow: 0px 0px 16px -2px rgba(0,0,0,0.75);	border-radius: 5px 5px 5px 5px;	-moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border: 0px solid #000000; margin-top: 10px; float:left; width: 300px; padding: 5px 5px;}
.info-usuario{padding-top:5px; float: left; width: 60px;}
.info-descricao{float: left; width: -webkit-calc(100% - 60px); width: -moz-calc(100% - 60px); width: calc(100% - 60px); text-align: left; padding-top: 5px;}
.cursor-p{cursor: pointer;}


/* Layout, mapa, radar */
.ajStatus{width:32px;height:32px;position:fixed;right:7px;bottom:7px; z-index:1080;}
.zindex1081{z-index: 1081 !important;}
.zindex1082{z-index: 1082 !important;}


/* Geral */
.semBorda,
.semBorda > .ui-widget-content {border: none !important;}
.noDisplay{display: none;}
.preWrap{white-space: pre-wrap;}
.overflowScroll{overflow: scroll;}
.btnInputgroup{border: 1px solid #bdc3c9 !important;}
.redondo{border-radius:50%}
.lineh30 {line-height: 30px !important;}
.lineh12 {line-height: 12px !important;}


/* Inicio */
.cardOlts{border: 1px solid lightgrey; padding: 10px; box-shadow: 1px 1px 5px lightgrey;}
.highZindex{z-index: 2147483647;}


/* OLT */
.porta{
	width: 80px; 
	min-height: 40px; 
	padding: 10px; 
	margin: 10px 10px 0px 0px; 
	position: relative;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.portaAtiva {
	background-color: #9bd89b;
	color: black;
}
.portaInativa {
	background-color: white;
}
.portaSelecionada {
	border: 2px solid transparent;
	background-color: #008a20;
	color: white;
}
.portaNaoSelecionada {
	border: 2px solid transparent;
}


/* Mapa */
#topmenuform\:localBtn > .ui-icon {font-size: 18px !important; margin-top: -8px; margin-left: 5px;}
#topmenuform\:pnLocalBtn > .ui-overlaypanel-content,#menuform\:pnLocalMobile.ui-accordion.ui-accordion-content {padding: 0px;}