/* 
  Interactive.css - DT Interactive - Direct Talk
  Este arquivo contém toda formatação visual dos templates do DT Interactive.
*/

/* Regras Comuns
------------------------------------ */

* { margin: 0px; padding: 0px }

body {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	font-size: 62.5%;
	background: #FFF;
	color: #888;
	
	}

html {
	background: #FFF;
	}

	body a {
		text-decoration: none;
		color: #fff;
		}

		body a:hover { color: #ccc; }

	body, html {
		height: 100%;
		min-height: 100%;
		}

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

	.clearfix {display: inline-table;}
	/* IE-mac filter \*/* 
	html .clearfix {height: 1%;} .clearfix {display: block;}
	/* End IE-mac filter */
	
/* Layout e Posicionamento
------------------------------------ */

#container {
	position: relative;
	height: 100%;
	}

/* HEADER */
#header { 
	height: 87px;
	background: url("../images/top.jpg") no-repeat;
	}
	#header #siteLogo { 
		position: absolute;
		top: 0px;
		left: 0px;
		
		}
	#header #siteLogo img { border: none; }
			
	#header #siteName { 
		position: relative;
					width: 100%;
					bottom: 24px;
					text-align: center;
					text-transform:uppercase;
					letter-spacing: 0.1em;
					font-size: 1.3em;
				font-weight: bold;
				color: #888;
	}
	
/* CONTEUDO */	
#conteudo { 
	position: relative;
	}
	
	#conteudo .box { padding: 10px 10px 0px 10px; }
	#conteudo .destaque {
		background: #FFf;
		margin: 10px 10px 10px 10px;
		}
		
	#conteudo .gray { 
		background: transparent; 
		padding-top: 2px;
		}

		
	#conteudo .sucess {
		border: 1px solid #B1EDBA;
		margin: 10px;
		padding: 15px 0 5px 50px;
		color: #060;
		background: #E7FBE3 url("../images/icon_sucess.gif") no-repeat 10px 50%;
		}
		
	#conteudo .erro {
		border: 1px solid #FF9F9F;
		margin: 10px;
		padding: 15px 0 5px 50px;
		color: #900;
		background: #FFDFDF url("../images/icon_error.gif") no-repeat 10px 50%;
		}
		
	/* RETAILS > CONTEUDO */
	body#template-disconected #conteudo,
	body#template-kicked #conteudo,
	body#template-logoutop #conteudo { height: 80px; }
		

/* RODAPE */
#rodape {
	position: absolute;
			width:100%;
			bottom: 0px;
			border-top: 1px dashed #C4C4C4;
			background: #FBFBFB;
	}
	html>body #rodape {
		margin: 0px;
		}
	
	#rodape #copyright { 
		float: left; 
		color: #777;
		margin: 10px 8px;
		}
		
		#rodape #copyright a {
			color: #777;
			font-weight: bold;
			}
			
		#rodape #copyright a:hover { color: #900; }
			
	#rodape #directtalk { 
		float: right; 
		margin: 15px 8px 10px 8px;
		}
		
		#rodape #directtalk img { border: none; }
		
		#rodape #faq { 
		border: none;
		float: center; 
		margin: 0px 0px 0px 0px; 
		}

/* Fonts
------------------------------------ */

h1, h2, h3, h4, h5, h6 { 
	font-family: Arial, Tahoma, Arial, Verdana, sans-serif;
	font-weight: normal;
	}

	h1 { 
		font-size: 1.8em;
		letter-spacing: -1px;
		font-weight: 100;
		color: #fff;
		}
	h2 { }
	h3 { }
	h4 { }
	h5 { }
	h6 { }

p { 
	font-size: 1.2em;
	line-height: 1.5em;
	margin: 0 0 10px 0;
	}
	
	#rodape p { 
		font-size: 1em;  
		line-height: 1.7em;
		}
	
	p span { }
	p cite { }
	
	.c { text-align: center; }
	.l { text-align: left; }
	.r { text-align: right; }
	
	.alert {	color: red; }
	.information {	color: #999; }
	.normal { font-weight: normal; }
	.bold { font-weight: bold; }
	.small { font-size: .9em; }
	.big { font-size: 1.2em; }
	
	.ls_1 { letter-spacing: -1px; }
	
blockquote { }

/* Listas
------------------------------------ */

ul#browserList {
		list-style-type: none;
		list-style-position: inside;
		font-size: 1.4em;
		font-weight: bold;
		line-height: 1.5em;
		margin: 0 0 10px 5px;
		}
		
		ul#browserList li#firefox {
			background: url("../images/browser_firefox.gif") no-repeat 0% 50%;
			padding: 0 0 0 10px;
			}
			
		ul#browserList li#ie {
			background: url("../images/browser_internetexplorer.gif") no-repeat 0% 50%;
			padding: 0 0 0 10px;
			}

/* Tabelas
------------------------------------ */

Table { }
	Table caption { }
	Table thead { }
		Table thead tr { }
		Table thead th { }
		Table thead td { }

	Table tbody { }
		Table tbody tr { }
		Table tbody th { }
		Table tbody td { }

	Table tfoot { }
		Table tfoot tr { }
		Table tfoot th { }
		Table tfoot td { }
		
	/*  Mensagens */
	
	Table#display_mensagens { 
		width: 100%;
		font-size: 1.1em;
		border-collapse: collapse;
		margin: 0px auto;
		}

	Table#display_mensagens tbody { }
		Table#display_mensagens tbody tr { }
		Table#display_mensagens tbody th { }
		Table#display_mensagens tbody td { 
			border-bottom: 1px solid #ddd;
			}
		
			Table#display_mensagens tbody td span.iFontUser { 
				display: block;
				font-weight: bold;
				padding: 10px;
				}
			Table#display_mensagens tbody td span.iFontMensUser { 
				display: block;
				font-weight: bold;
				padding: 10px;
				line-height: 1.4em;
				text-align: justify;
				}
			Table#display_mensagens tbody td span.iFontOp {
				display: block;
				padding: 10px 10px 10px 10px;
				}
			Table#display_mensagens tbody td span.iFontMensOp { 
				display: block;
				padding: 10px;
				line-height: 1.4em;
				text-align: justify;
				}
				
	/* Horop */
	
	Table#display_horop { 
		width: 100%;
		font-size: 1.1em;
		border-collapse: collapse;
		margin: 0px auto;
		border: 1px solid #fff;
		border-top-color: #FF5700;
		}
		
		Table#display_horop thead th { 
			background: #fff;
			color: #FF5700;
			padding: 4px 4px;
			border-bottom: 1px solid #FF5700;
			border-left: 1px solid #FF5700;
			}

		Table#display_horop tbody td { 
			background: #FF5700;
			padding: 3px;
			border-left: 1px solid #fff;
			}

/* Formulários
------------------------------------ */

form { }
	
	form fieldset { 
		clear: both;
		border: 0px;
		}
		
		html>body form.dtform fieldset { padding: 0px 10px 10px 10px; }
		
		form#digita fieldset { border: none; }
		
		form.dtform fieldset legend { 
			font-size: 1.2em;
			padding: 0px 10px 0 10px;
			font-weight: bold;
			vertical-align: center;
			}
			html>body form.dtform fieldset legend { padding: 0px 10px; } /* Firefox */
			
		form.dtform fieldset label {
			display: block;
			padding: 0 0 10px 0;
			font-size: 1.2em;
			font-weight: bold;
			color: #333;
			}
			
			.labelGroup label {
				float: left;
				margin-right: 5px;
				}
		
	form.dtform input.text { 
		display: block;
		font-family: Arial, Tahoma, Verdana, sans-serif;
		font-size: 1em;
		font-weight: normal;
		color: #444;
		
		
		border-top: 1px solid #999;
		border-bottom: 1px solid #D1D1D1;
		border-left: 1px solid #999;
		border-right: 1px solid #D1D1D1;
		
		padding: 2px 2px;
		margin: 2px 0 0 0;
		
		background: #fff url("../images/bk_form.gif") repeat-x top;
		}
		
	form.dtform input.textErro	{ 
		display: block;
		font-family: Arial, Tahoma, Verdana, sans-serif;
		font-size: 1em;
		color: red;
		
		padding: 2px 3px 2px 7px;
		margin: 2px 0 0 0;
		
		background: #fff url("../images/bk_form_erro.gif") no-repeat 0% 50%;
		border: 1px solid red;
		}
		
		form select.textErro {
			color: red;
			background: #ffc;
			}
		
	 form.dtform textarea { 
		display: block;
		font-family: Arial, Tahoma, Verdana, sans-serif;
		font-size: 12px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #eee;
		border-left: 1px solid #ccc;
		border-right: 1px solid #eee;
		background: #fff url("../images/bk_form.gif") repeat-x top;
		overflow: auto;
		padding: 3px 3px;
		}
		
		form.dtform #mensagem {
			width: 320px;
			height: 50px;
			}
			html>body form.dtform textarea#mensagem { margin: 10px 0 0 0; }
		
	form.dtform input.submit {
		clear: both;
		margin: 10px 0px 5px;
		outline: none;
		}

	/* ----------------------------------------
	CMXFORM
	---------------------------------------- */
	
	form.cmxform fieldset { margin-bottom: 10px; }
	
	form.cmxform legend {
		padding: 0 2px;
		font-weight: bold;
		_margin: 0 -7px; /* IE Win */
		}
		
	form.cmxform label {
		display: inline-block;
		line-height: 1.8;
		vertical-align: top;
		}
		
	form.cmxform fieldset ol {
		margin: 0;
		padding: 0;
		}
		
	form.cmxform fieldset li {
		list-style: none;
		padding: 5px;
		margin: 0;
		}
		
	form.cmxform fieldset fieldset {
		border: none;
		margin: 3px 0 0;
		}
		
	form.cmxform fieldset fieldset legend {
		padding: 0 0 5px;
		font-weight: normal;
		}
		
	form.cmxform fieldset fieldset label {
		display: block;
		width: auto;
		}

	form.cmxform em {
		font-size: 1em;
		font-weight: bold;
		font-style: normal;
		color: #f30;
		}
		
	form.cmxform span {
		display: inline-block;
		font-size: 1.2em;
		font-weight: bold;
		font-style: normal;
		line-height: 1.8em;
		}

	form.cmxform label { width: 132px; } /* Width of labels */
	form.cmxform fieldset fieldset label { margin-left: 123px; } /* Width plus 3 (html space) */

	/*\*//*/ form.cmxform legend { display: inline-block; } /* IE Mac legend fix */
	
	/* ----------------------------------------
	CMXFORM FORMATAÇÃO
	---------------------------------------- */

	form.cmxform {
	width: auto;
	margin: 5px 10px;
	}
	
	form.cmxform legend { padding-left: 0; }
	form.cmxform fieldset fieldset legend { font-weight: bold; }
	
	form.cmxform legend,
	form.cmxform label { color: #333; }	

	form.cmxform label,
	form.cmxform legend { font-size: 1.1em; font-weight: bold; }
	form.cmxform input { font-size: 1.1em; padding: 1px; }
	
	form.cmxform input.textErro {
		background: #ffc;
		color: red;
		}
		
	form.cmxform fieldset {
		border: none;
		margin-top: 10px;
		}
		
	form.cmxform fieldset fieldset { background: none; }
		
	form.cmxform fieldset li {
		padding: 5px 10px 7px;
		background: url("../images/bk_linhaform.gif") repeat-x bottom;
		}
	
/* Iframe */

#iframe-acima {
	margin-top: 10px;



/* Outras Regras
------------------------------------ */
br.cleaner { clear: both; }
.btn { cursor: pointer; border: none; }
