/*---------------------------------------------------------------------
Folha de estilos básica

versão:		1.0
autor:		brainfonet, Fábio R. Brandão
email:		contato@brainfonet.com
website:	www.brainfonet.com

:-) Copie a vontade pois tudo que é bom deve mesmo ser copiado!
---------------------------------------------------------------------*/

/* =Tipografia (tipografia, titulos e links)
---------------------------------------------------------------------*/
/* Padrão Links */
a{
	color:#0066CC;
	text-decoration:none;
}

/* Padrão Links Sobrepostos */
a:hover{
	color:#0066CC;
	text-decoration:underline;
}

/* Título 1 */
h1{
	font-size:18px;
	font-family:trebuchet ms,tahoma,verdana,arial,helvetica;
	color:#0066CC;
}

/* Título 2 */
h2{
	font-size:13px;
	font-family:trebuchet ms,tahoma,verdana,arial,helvetica;
	color:#FF0000;
}

/* Parágrafos */
p{
	font-size:12px;
	font-family:trebuchet ms,tahoma,verdana,arial,helvetica;
	color:#666;
	margin:2px;
}

/* Textos Atendente */
.atendente{
	color:#FF0000;
}

/* Textos Contato */
.contato{
	color:#0066CC;
}

/* Texto Protocolo */
.protocolo{
	color:#009933;
}

/* Mensagens de Erro */
.erro{
	color:#FF0000;
}

/* título de células*/
.tc{
	text-align:left;
	font-weight:bold;
}

/* =Fluxo (caixas, seções)
---------------------------------------------------------------------*/
/* Corpo */

/* Global */
*{
	margin:0px;
	padding:0px;
}

/* Corpo */
body{
	background-color:#fff;
}

/* Todos Elementos */
#geral{

}

/* Toda Interface */
#interface{

}

/* Topo para tela de Atendente */
#topo{
	width:100%;
	height:20px;
	float:none;
	background-color:#fff;
	padding:2px;
}

/* Topo para tela de Contato */
#topo2{
	width:100%;
	height:65px;
	float:none;
	background-color:#fff;
	padding:2px;
}

/* Todo Miolo */
#miolo{
	width:100%;
	height:300px;
	float:none;
	background-color:#fff;
	padding:2px;
}

/* Todo Rodape */
#rodape{	
	width:100;
	height:25px;
	float:none;
	background-color:#fff;
	padding:2px;
}

/* Área de Mensagens (Frames) */
.mensagem{
	border:1px solid #ccc;
	width:444px;
	height:120px;
}

/* Área de Recados (Frame) */
.framerecados{
	border:1px solid #ccc;
	width:400px;
	height:300px;
}

/* Área de Fila (Frame) 
.framefila{
	border:1px solid #ccc;
	width:350px;
	height:220px;
}*/

/* Caixa da lista de recados */
#recado{
	display:none;
	background-color:#F8F8FF;
	width:400px; 
	height:320px; 
	position:absolute; 
	top: 10px; 
	left: 10px; 
	z-index:1; 
	border: 1px solid #000; 
	padding:5px;	
}

/* Caixa da fila de contatos*/
#fila{
	display:none;
	background-color:#F8F8FF;
	width:400px; 
	height:300px; 
	position:absolute; 
	top: 10px; 
	left: 10px; 
	z-index:1; 
	border: 1px solid #000; 
	padding:5px;	
}

/* Padrão Links */
#recados{
	width:auto;
	height:120px;
	float:none;
	background-color:#fff;
}

/* Foto do Atendente */
#foto{
	position:absolute;
	top:300px;
	left:550px;
}

/* Div Mensagens (AJAX) */
#divMensagem{
	overflow: auto;
	border:1px solid #ccc;
	width:auto;
	height:190px;
	background-color:#F8F8FF;
}

#divMensagemCon{
	overflow: auto;
	border:1px solid #ccc;
	width:auto;
	height:150px;
	background-color:#F8F8FF;
}

#divMensagemAt{
	overflow: auto;
	border:1px solid #ccc;
	width:auto;
	height:200px;
	background-color:#F8F8FF;
}

.digitando{
	position:absolute; 
	top: 2px; 
	left: 2px; 
	width:300px;
	height:22px;
}

.digitando2{
	position:absolute; 
	top: 2px; 
	left: 300px; 
	width:300px;
	height:22px;
}

/* =Geral (listas, formulário e botões)
---------------------------------------------------------------------*/
.form{
	font-size:12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	border:1px solid #ccc;
	color:333;
}

.form2{
	font-size:12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	border:1px solid #666;
	color:333;
	background-color:#F8F8FF;
}

.botao{
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#333;
	width:65px;
	border:1px solid #666;
	background-color:#F8F8FF;
}

.botao2{
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#333;
	width:50px;
	border:1px solid #666;
	background-color:#ccc;
}

/* botão azul */
.botao3{
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#fff;
	padding:2px;
	border:1px solid #666;
	background-color:#6666aa;
}

img{
	border:0px;
}

th, td{
	font-size:12px;
	font-family:trebuchet ms,tahoma,verdana,arial,helvetica;
	color:#666;
	margin:2px;
}