BODY
{
    SCROLLBAR-FACE-COLOR: #ffffff;
    FONT-SIZE: 11px;
    MARGIN: 0px 4px 0px 0px;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
    SCROLLBAR-SHADOW-COLOR: #666666;
    COLOR: #000000;
    SCROLLBAR-3DLIGHT-COLOR: #666666;
    SCROLLBAR-ARROW-COLOR: #cc0000;
    SCROLLBAR-TRACK-COLOR: #d8d8d8;
    FONT-FAMILY: Verdana,Arial,sans-serif;
    SCROLLBAR-DARKSHADOW-COLOR: #ffffff;
    SCROLLBAR-BASE-COLOR: #ffffff;
    /*overflow: auto;*/
}
TD, TH, CAPTION {
    font-size: 12px;
    font-family: Arial;
	text-decoration: none;
}

A  {
	text-decoration: none;
	color: black;
}

TEXTAREA {
    FONT-SIZE: 11px;
    FONT-FAMILY: Helvetica, Tahoma;
    border: 1px solid #b0b0b0;
    BACKGROUND-COLOR: #ffffff;
}

INPUT {
    BORDER: #b0b0b0 1px solid;
    FONT-FAMILY: Helvetica, Tahoma;
    BACKGROUND-COLOR: #ffffff;
    PADDING: 1px;
    MARGIN: 0px;
}

INPUT[type="checkbox"]{
	
}

INPUT.button,
BUTTON {
    FONT-WEIGHT: bold;
    vertical-align: middle;
    white-space: nowrap;
}

INPUT[type="button"] {
    FONT-WEIGHT: bold;
    vertical-align: middle;
    white-space: nowrap;
}

BUTTON IMG {
    vertical-align: middle;
    /*margin-right: 4px;
    margin-left: 4px;*/
}
INPUT[type="button"] IMG {
    vertical-align: middle;
    /*margin-right: 4px;
    margin-left: 4px; */ 
}

SELECT {
	PADDING: 1px;
    MARGIN: 0px;
    FONT-SIZE: 11px;
    VERTICAL-ALIGN: top;
    FONT-FAMILY: Helvetica, Tahoma;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
    SCROLLBAR-SHADOW-COLOR: #666666;
    SCROLLBAR-3DLIGHT-COLOR: #666666;
    SCROLLBAR-ARROW-COLOR: #cc0000;
    SCROLLBAR-TRACK-COLOR: #d8d8d8;
    SCROLLBAR-DARKSHADOW-COLOR: #ffffff;
    SCROLLBAR-BASE-COLOR: #ffffff;
    BORDER: 1px solid #b0b0b0;
    BACKGROUND-COLOR: #ffffff;
}

/*Browsers Disabled*/
button[disabled]:active, 
button[disabled],
textarea[disabled]:active, 
textarea[disabled],
input[type="reset"][disabled]:active,
input[type="reset"][disabled],
input[type="button"][disabled]:active,
input[type="button"][disabled],
select[disabled] > input[type="button"],
select[disabled] > input[type="button"]:active,
input[type="submit"][disabled]:active,
input[type="submit"][disabled],
input[type="text"][disabled]:active,
input[type="text"][disabled],
input[type="password"][disabled]:active,
input[type="password"][disabled],
button[readonly]:active, 
button[readonly],
textarea[readonly]:active, 
textarea[readonly],
input[type="reset"][readonly]:active,
input[type="reset"][readonly],
input[type="button"][readonly]:active,
input[type="button"][readonly],
select[readonly] > input[type="button"],
select[readonly] > input[type="button"]:active,
input[type="submit"][readonly]:active,
input[type="submit"][readonly],
input[type="text"][readonly]:active,
input[type="text"][readonly],
input[type="password"][readonly]:active,
input[type="password"][readonly] {
  color: graytext;
  cursor: inherit;
}

select[disabled], select[disabled]:active,
textarea[disabled]:active, textarea[disabled],
input[type="text"][disabled]:active,
input[type="text"][disabled],
input[type="password"][disabled]:active,
input[type="password"][disabled],
select[readonly], select[readonly]:active,
textarea[readonly]:active, textarea[readonly],
input[type="text"][readonly]:active,
input[type="text"][readonly],
input[type="password"][readonly]:active,
input[type="password"][readonly]  {
  background-color: #EDEBEB;
  BORDER: 1px solid #b0b0b0;
}
BUTTON.disabled,
BUTTON.disabled:active,
BUTTON.readonly,
BUTTON.readonly:active,
TEXTAREA.disabled,
TEXTAREA.disabled:active,
TEXTAREA.readonly,
TEXTAREA.readonly:active,
INPUT.disabled,
INPUT.disabled:active,
INPUT.readonly,
INPUT.readonly:active,
SELECT.disabled,
SELECT.disabled:active,
SELECT.readonly,
SELECT.readonly:active {
  color: graytext;
  cursor: inherit;
  background-color: #EDEBEB;
  BORDER: 1px solid #b0b0b0;
}

SPAN {
	font-size: 12px;
    font-family: Arial;
}


P {
    TEXT-ALIGN: justify
}

OL {
    MARGIN: 2px 50px
}
UL {
    MARGIN: 2px 50px
}
LI {
    /* LIST-STYLE-IMAGE: url(../Imagens/img_seta.gif); */
    TEXT-ALIGN: justify
}
A {
    COLOR: #740101;
    TEXT-DECORATION: none
}
IMG {
    BORDER: 0px;
    MARGIN: 0px;
}
FORM {
    PADDING: 0px;
    MARGIN: 0px;
}
FIELDSET {
	border-width: 2px;
	padding: 2px;
	margin: 2px;
}

FIELDSET LEGEND {
	font-weight: bold;
	color: black;
}

.menu {
    PADDING-LEFT: 4px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 11px;
    COLOR: #000000;
    FONT-FAMILY: tahoma;
    BACKGROUND-COLOR: #D4D0C8
}


.titulo {
    FONT-WEIGHT: bold;
    FONT-SIZE: 12px;
    COLOR: #FFFFFF;
    BACKGROUND-COLOR: #395594
}

.sub_titulo {
    FONT-WEIGHT: bold;
    COLOR: #000000;
    MARGIN-RIGHT: 20px
}

.tela {
	BACKGROUND-COLOR: #D4D0C8;
	width: 1050px;
}

.telaChat {
	BACKGROUND-COLOR: #D4D0C8;
	width: 1000px;
}

.chatIntegrado {
	width: 780px;
}

.telaCustom {
	BACKGROUND-COLOR: #D4D0C8;
}
.telaLogin {
	BACKGROUND-COLOR: #D4D0C8;
}

.popupmouseout {
	BACKGROUND-COLOR: #D4D0C8;
	COLOR: #000000
}
.popupmouseover {
	BACKGROUND-COLOR: #0000FF;
	COLOR: #ffffff
}


/**
 * Tabela Dados Resumo Executivo
 * estrutura
 * <table class="tabelaDadosResumoExecutivo">
 *   <thead>
 *     <tr>
 *       <th class="cn"></th>
 *       <th class="cc"><input type="checkbox"/></th>
 *       <th class="c-0">Cab0</th>
 *     </tr>
 *   </thead>
 *   <tbody>
 *     <tr class="crit-0">
 *       <th class="ln">1</th>
 *       <th class="lc"><input type="checkbox"/></th>
 *       <td class="ld">Dado 0</td>
 *     </tr>
 *   </tbody>
 * </table>
 *
 * cn = cabecalho numero
 * cc = cabecalho checkbox
 * c-<num.coluna> = cabecalho
 * ln = linha numero
 * lc = linha checkbox
 * ld-<num.coluna> = linha dados
 * crit-<num.criticidade>= numero da criticidade
 *		0 - disconnected
 *		1 - inativo
 *		2 - ok
 *		3 - warn
 *		4 - nok
 *
 **/
TABLE.tabelaDadosResumoExecutivo {
	table-layout: fixed;
	color: black;
	cursor:pointer;
}

/*IE 6 a 8 nao aceita selectors :focus :active :hover em tags que nao sejam de link <a>*/
TABLE.tabelaDadosResumoExecutivo {

}

TABLE.tabelaDadosResumoExecutivo THEAD {
	background:#D4D0C8;
}
TABLE.tabelaDadosResumoExecutivo TBODY {
	background:#CCCCCC;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.crit-0 {
	background:#CCCCCC;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.crit-1 {
	background:#CCBBFF;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.crit-2 {
	background:#00FF00;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.crit-3 {
	background:#FFFF00;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.crit-4 {
	background:#FF0000;
	color: white;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR.selected {
	background: #316AC5;
	color: white;
}

TABLE.tabelaDadosResumoExecutivo TBODY TR:hover {
	background: #ACA899;
}
/*TABLE.tabelaDadosResumoExecutivo TBODY TR.selected:hover {
	background: #8ca1c3;
}*/
TABLE.tabelaDadosResumoExecutivo TBODY TR TD, 
TABLE.tabelaDadosResumoExecutivo TBODY TR TH,
TABLE.tabelaDadosResumoExecutivo THEAD TR TD, 
TABLE.tabelaDadosResumoExecutivo THEAD TR TH {
	text-align:center;
	border-style: outset; 
	border-width:1px; 
	white-space: nowrap;
	font-weight: normal;
	overflow: hidden;
}
TABLE.tabelaDadosResumoExecutivo THEAD TR TH,
TABLE.tabelaDadosResumoExecutivo TBODY TR TH {
	font-weight: bold;
	color: black;
}
TABLE.tabelaDadosResumoExecutivo TBODY TR *.lc INPUT, 
TABLE.tabelaDadosResumoExecutivo THEAD TR *.cc INPUT { 
	margin: 0px; 
	padding: 0px; 
	width: 15px; 
	height: 15px; 
}
TABLE.tabelaDadosResumoExecutivo TBODY TR TH {
	background:#D4D0C8;
}


/**
 * Progress bar
 *
 */

.prog-border {
	  height: 15px;
	  width: 100%;
	  background: #fff;
	  border: 1px solid #000;
	  margin: 0;
	  padding: 0;
  }

.prog-bar {
	  height: 11px;
	  margin: 2px;
	  padding: 0px;
	  background: #00ff00;
}
/**
 * Tabela Versoes de arquivo
 * estrutura
 * <table class="versoesArquivo">
 *   <thead>
 *     <tr>
 *       <th>-</th>
 *       <th>Versao</th>
 *       <th>Data</th>
 *     </tr>
 *   </thead>
 *   <tbody>
 *     <tr>
 *       <td style="border-left: none;"><input type="radio"/></td>
 *       <td>23</th>
 *       <td>14/02/2009 10:00:23</td>
 *     </tr>
 *   </tbody>
 * </table>
 */
TABLE.versoesArquivo {
	border-collapse: collapse;
	color: black;
	cursor:pointer;
	font-size: 0.8em;
	margin: 0px;
	padding: 0px;
	border: solid 1px black; 
}
/*IE 6 a 8 nao aceita selectors :focus :active :hover em tags que nao sejam de link <a>*/
TABLE.versoesArquivo {
	behavior:url("styles/csshover3.htc");
	/*border-left: solid 1px black;*/
} 

TABLE.versoesArquivo THEAD TD,
TABLE.versoesArquivo THEAD TH {
	border-bottom: solid 1px black;
}

TABLE.versoesArquivo TFOOT TD,
TABLE.versoesArquivo TFOOT TH {
	border-top: solid 1px black;
}


TABLE.versoesArquivo TD, TABLE.versoesArquivo TH {
	font-size: 10px;
	margin: 0px;
	padding: 2px;
	border-left: solid 1px black; 
}
TABLE.versoesArquivo A {
	font-size: 10px;
}
TABLE.versoesArquivo TBODY TR:hover {
	background: #ACA899;
}
TABLE.versoesArquivo TBODY TR INPUT, 
TABLE.versoesArquivo THEAD TR INPUT { 
	margin: 0px; 
	padding: 0px; 
	width: 15px; 
	height: 15px; 
}

/* CSS do div que representa o Frame */
	.frame {
		position: relative;
		left: 50%;
	
		border-top: 2px outset #ffffff; 
		border-left: 2px outset #ffffff; 
		border-right: 2px ridge #ffffff; 
		border-bottom: 2px ridge #ffffff;
		
		background-color: #D4D0C8;
	}
	
	.framebody {
		margin: 4px;
	}
	
	/* CSS da barra de título */
	.titulo {
		height: 20px;
    	border: 1px solid black;
	}
	
	.titulo .logoTitulo {
		float: left;
	}
	
	.titulo .labelTitulo {
		margin-top: 2px;
		margin-left: 10px;
		float: left;
	}
	
	.titulo .usuarioTitulo {
		margin-top: 2px;
		margin-right: 10px;
		float: right;
	}
	
	/* CSS do conteúdo do frame */
	.conteudoFrame {
		*width: 100%;
   		margin: 8px;
   		border: 1px solid black;
	}
	
	.end {
		clear: both;
	}
	
	/* CSS da área de visualização de itens cadastrados */
	.visualizacaoItens {
		border: 1px solid black;
		margin: 8px;
		padding: 4px;
		width: 240px;
		float: left;
	}
	
	.visualizacaoItens .combo {
		width: 100%;
	}
	.visualizacaoItens .btNovo {
		padding: 1%;
		padding-top: 8px;
		width: 48%;
		text-align: right;
		float: left;
	}
	.visualizacaoItens .btEditar {
		padding: 1%;
		padding-top: 8px;
		width: 48%;
		text-align: left;
		float: left;
	}
	.visualizacaoItens .btExcluir {
		text-align: center;
		clear: both;
	}
	
	/* CSS da área de CRUD */
	.propriedades {
		*width: 100%;
		margin: 8px;
	}
	.propriedades fieldset {
		border: 1px solid black;
	}
	
	/* CSS de layout */
	.box10 {
		width: 10%;
	}
	.box20 {
		width: 20%;
	}
	.box30 {
		width: 30%;
	}
	.box40 {
		width: 40%;
	}
	.box50 {
		width: 50%;
	}
	.box60 {
		width: 60%;
	}
	.box70 {
		width: 70%;
	}
	.box80 {
		width: 80%;
	}
	.box90 {
		width: 90%;
	}
	.box100 {
		width: 100%;
	}
	
	.centralizado {
		text-align: center;
	}
	
	.espacamentoVerticalDuplo {
		margin-top: 16px;
	}
	
	
	input.help_erro,
	select.help_erro,
	div.help_erro,
	label.help_erro {
		border: 1px solid red;
	}
	
	input.help_warning,
	select.help_warning,
	div.help_warning,
	label.help_warning {
		border: 1px solid yellow;
	}
	
	/* css dos hints do sistema */
	.hint_help {
		position: absolute;
		background-color: ffffdd;
		color: black;
		border: 1px solid black;
		padding: 5px;
		visibility: show;
		z-index: 10000;
	}
	
	.addRow , .delRow {
		height: 22px;
    	padding: 0;
    	width: 25px;
	}
	
	.pointer { cursor: pointer; }
	.add-btn {
		background: url("../Imagens/plus-4-16.png") no-repeat;		
		padding-left: 20px;	
	}
	.ok-btn {
		background: url("../Imagens/ok-16.png") no-repeat;		
		padding-left: 20px;
		height: 20px;	
	}
	table.gridtable {
		font-size:11px;
		color:#333333;
		border-width: 1px;
		border-color: #666666;
		border-collapse: collapse;
		width: 100%;
	}
	table.gridtable th {
		border-width: 1px;
		padding: 4px;
		border-style: solid;
		border-color: #666666;
		background-color: #dedede;
	}
	table.gridtable td {
		border-width: 1px;
		padding: 4px;
		border-style: solid;
		border-color: #666666;
		background-color: #ffffff;
		text-align: center;
	}
	
	ul.grid-crud {
	  cursor: default;
	  list-style-type: none;
	  width: 100%;
	  text-align: left;
	  padding: 0;	  
	  margin: 0 1px;
	}	

	ul.grid-crud li {
		font-family: Helvetica,Tahoma;
    	font-size: 11px;    	
	}
	
	li.selected {
  		background-color: #3399FF;
  		color: white;
	}
	
	div.crud-container {
		height:350px;
		border: 1px solid #B0B0B0;
		margin: 1px 3px 1px 3px;
	}
	
	div.disabled {
		background-color: #EDEBEB;
		color: #6D6D6D;
	}
	
	div.enable {
		background-color: white;
	}
	
	.label {
		text-align: right;
	}
	
	.table-legenda {
		color: #585858;
		margin: 10px;
		text-align: left;
	}
	
	.table-legenda .label {
		font-style: italic;
	}
	
	
	/* Tooltip container */
	.tooltip {
	  position: relative;
	  display: inline-block;
	  margin-left: 5px;
	  /*margin-top: 2px;*/
	  vertical-align: top;
	 /* border-bottom: 1px dotted black;  If you want dots under the hoverable text */
	}
	
	/* Tooltip text */
	.tooltip .tooltiptext {
	  visibility: hidden;
	  width: 200px;
	  background-color: #555;
	  color: #fff;
	  text-align: center;
	  padding: 5px 0;
	  border-radius: 4px;
	
	  /* Position the tooltip text */
	  position: absolute;
	  z-index: 1;
	 /* bottom: 125%; */
	  left: calc(50% + 75px);
	  margin-left: -60px;
	  
	
	  /* Fade in tooltip */
	  opacity: 0;
	  transition: opacity 0.3s;
	}
	
	/* Tooltip arrow 
	.tooltip .tooltiptext::after {
	  content: "";
	  position: absolute;
	  top: 100%;
	  left: 50%;
	  margin-left: -5px;
	  border-width: 5px;
	  border-style: solid;
	  border-color: #555 transparent transparent transparent;
	}
	*/
	
	/* Show the tooltip text when you mouse over the tooltip container */
	.tooltip:hover .tooltiptext {
	  visibility: visible;
	  opacity: 1;
	}
	
	.ckboxAlign {
	  vertical-align: middle;
	}
	
	.ckboxAlignBottom {
	  vertical-align: bottom;
	}
	
	.centeredPopUp {
	  position: absolute;
	  top: 12%;
	  left: 55%;
	  transform: translate(-50%);
	}
	
	.centeredPopUpResumoExecutivo {
	  position: absolute;
	  top: 12%;
	  left: 50%;
	  transform: translate(-50%);
	}
	
	.centeredPopUpConfigInicialiacao {
	  position: absolute;
	  top: 29%;
	  left: 52%;
	  transform: translate(-50%);
	}