#paragrafoColunas{}
.duasColunas{
	width: 262px;
	float: left;
	border: 1px solid #000000;
}

#paragrafo{
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 10px;
	position: relative;
}

#paragrafo a:link { 
	text-decoration: underline;
	font-weight: bold; 
	/*color: #62A7DD;*/
}
#paragrafo a:visited { 
	font-weight: normal; 
	text-decoration: underline;
	/*color: #001681; */
}
#paragrafo a:hover, a:active { 
	text-decoration: underline;
}

#paragrafo a img{ 
	text-decoration: none;
	border: none;
}

html>body #paragrafo ol, ul{
	margin-top: 0px;
	padding-top: 0px;
}
#paragrafo ol, ul{
	margin-top: -10px;
	padding-top: 0px;
}

html>body #paragrafo li{
	line-height: 2em;
}

#paragrafo li{
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 12px;
	line-height: 1.7em;
}

.posicionaDireita{
	float: right;
	width: 50%;
	clear: right;
}

.posicionaEsquerda{
	float: left;
	width: 50%;
	clear: left;
}

.unica{
	width: auto;
	clear: both;
}

html>body .posicionaDireitaEspacamento{
	padding: 5px 5px 5px 5px;
	width: 47%;
	/*margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 5px;
	*/
}

.posicionaDireitaEspacamento{
	float: right;
	clear: right;
	padding: 5px 5px 10px 0px;
	margin: 0px 0px 10px 5px;
	overflow: hidden;
	width: 48%;
	/*
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 5px;
	
	border: 1px solid #000000;
	*/
}

html>body .posicionaEsquerdaEspacamento{
	clear:left;
	padding: 5px 5px 5px 5px;
	width: 47%;
	/*
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	*/
}
/*.posicionaEsquerdaEspacamento{
	float: left;
	width: 50%;
	clear: left;
}
*/
.posicionaEsquerdaEspacamento{
	clear: left;
	float: left;
	padding: 5px 5px 10px 0px;
	margin: 0px 5px 10px 0px;
	overflow: hidden;
	width: 48%;
	/*
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	border: 1px solid #000000;
	*/
}

#paragrafo .unicaEspacamento{
	width: auto;
	margin: 10px;
}
/*
html>body #paragrafo :after {
    content: "."; 
    display: block; 
    height: 0; 
    visibility: hidden;
	clear: right;
}
*/
html>body #paragrafo hr{
	clear: both;
}

/* TÍTULO DA SEÇÃO */
html>body #paragrafo p.titulo{ /* HACK */
	width: 531px;
}
#paragrafo p.titulo{
	font-style:italic;
	font-weight:bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FF8708;
	font-size: 13px;
	width: 531px;
	text-align: left;
	/*position: relative;*/
	clear: both;
}


/* LIVRE */
#paragrafo p.livre{
	/*position: relative;*/
}
#paragrafo p.livreEsquerda{
	clear: left;
	/*position: relative;*/
}

#paragrafo p.livreDireita{
	clear: right;
	/*position: relative;*/
}

/* PARÁGRAFO IDENTADO */
html>body #paragrafo p.endentado{ /* HACK */
	width: 531px;
	height: 1%;
	display: block;
}
#paragrafo p.endentado{
	text-indent: 2em;
	width: 527px;
	margin: 0px 0px 10px;
	/*position: relative;*/
	clear: both;
}

/* 
	Adiciona um conteúdo no final do elemento para forçar o "fechamento"
	do float. Sem isso, a imagem (ou qualquer elemento com a propriedade float)
	vai ultrapassar os limites do parágrafo (container) por não encontrar
	o fechamento clear do float - definição da W3C que só o IE não segue.
	Fiz modificações. Caso algo dê errado para o IE, consultar:
	http://www.positioniseverything.net/easyclearing.html
	este evento :after foi adicionado em todos os parágrafos que suportam
	imagens com float;
 */

#paragrafo p.endentado:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
#paragrafo p.endentado img.esquerda{
	float: left;
}

#paragrafo p.endentado img.direita{
	float: right;
}

/* TEXTO SEM IMAGEM */
html>body #paragrafo p.textoSemImagem{ /* HACK */
	width: 531px;
}
#paragrafo p.textoSemImagem{
	width: 527px;
	padding-bottom: 0px;
	padding-top: 0px;
	margin: 0px 0px;
	clear: both;
}

/* TEXTO COM IMAGEM */
/* A verificar posicionamento da imagem */
html>body #paragrafo p.textoComImagem{
	width: 531px;
}
#paragrafo p.textoComImagem{
	width: 527px;
	margin: 0px 0px;
	clear: both;
}
#paragrafo p.textoComImagem:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#paragrafo p.textoComImagem img.centro{
	padding: 0% 50% 0%;
}
#paragrafo p.textoComImagem img.direita{
	float: right;
	/*position: relative;*/
}
#paragrafo p.textoComImagem img.esquerda{
	float: left;
	/*position: relative;*/
}

/* TEXTO COM VÁRIAS IMAGENS */
html>body #paragrafo p.textoVariasImagens{
	width: 531px;
}
#paragrafo p.textoVariasImagens{
	width: 527px;
	clear: both;
	padding: 0px 0px;
	margin: 0px 0px;
}
#paragrafo p.textoVariasImagens:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#paragrafo p.textoVariasImagens img.esquerda{
	float: left;
}
#paragrafo p.textoVariasImagens img.direita{
	float: right;
}

/* ÍCONE COM LEGENDA */
html>body #paragrafo p.iconeComLegenda{
	width: 260px;
	padding: 0px 10px;
}
#paragrafo p.iconeComLegenda{
	width: 230px;
	/*position: relative;*/
	margin-left: 0px;
	/*text-align: middle;*/
	padding:0px;
	margin: 0px;
}
#paragrafo p.iconeLegenda:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#paragrafo p.iconeComLegenda img{
	vertical-align: middle;
	margin: 0px 5px;
}


/* ÍCONE COM LEGENDA GRANDE */
html>body #paragrafo p.iconeLegendaGrande{
	width: 260px;
	padding: 10px 10px;
}
#paragrafo p.iconeLegendaGrande{
	width: 250px;
	vertical-align: text-top;
	padding:0px;
	margin: 0px;
}
#paragrafo p.iconeLegendaGrande:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
#paragrafo p.iconeLegendaGrande img{
	float: left;
	margin: 0px 5px;
}

/* IMAGEM COM TEXTO EXPLICATIVO */

html>body #paragrafo p.imagemTextoExplicativo{
	width: 511px;
	padding: 10px 10px;
	/*margin: 0px 0px 10px 0px;*/
}
#paragrafo p.imagemTextoExplicativo{
	width: 507px;
	clear: both;
	height: auto;
	/*position: relative;*/
	/*display: table-row; /* Problema de float no FireFox: o float quebra o posicionamento.*/
	padding: 10px;
	margin: 0px 0px 10px 0px;
	/*margin: 10px 0px;*/
	display: block;
}

#paragrafo p.imagemTextoExplicativo:after {
    content: "."; 
    display: block; 
    height: 0;
	width: 0; 
    clear: both; 
    visibility: hidden;
}

#paragrafo p.imagemTextoExplicativo img.esquerda{
	float: left;
	padding-right: 10px;
}

#paragrafo p.imagemTextoExplicativo img.direita{
	float: right;
	padding-left: 10px;
}

/* ÍCONE GRANDE COM ESPAÇAMENTO */
html>body #paragrafo p.iconeEspacamento{
	width: 220px;
	/*margin: 5px;*/
	/*padding: 10px 10px;*/
}
#paragrafo p.iconeEspacamento{
	width: 240px;
	vertical-align: text-top;
	padding: 5px;
}
#paragrafo p.iconeEspacamento:after {
    content: "."; 
    display: block; 
    height: 0px; 
    clear: both; 
    visibility: hidden;
}
#paragrafo p.iconeEspacamento img{
	float: left;
	margin: 0px 5px;
}

#destaques {
	position: relative;
}

#destaques form {
	position: relative;
}


#destaques form div {
	display: block;
	padding: 10px auto; 
	margin: 10px auto;
	height: auto; 
	vertical-align: bottom; 
	clear:both; 
	position: relative;
}

#destaques form div:after {
    content: "."; 
    display: block; 
    height: 0;
	width: 0; 
    clear: both; 
    visibility: hidden;
}
/* Hides from IE-mac \*/
* html #destaques form div{height: 1%;}
/* End hide from IE-mac */

#destaques form div label{
	text-align: right;
	display:block;
	width: 120px;
	clear: left;
	float: left;
	margin-bottom: 5px;
	margin-top: 5px;
}

#destaques form div.option{
	clear: both;
	position:relative;
}

#destaques form div input.text, #destaques form div select.select{
	/*float:left;*/
	margin-left: 25px;
	margin-bottom: 5px;
	margin-top: 5px;
}
/*
html>body #destaques form div input.radio, html>body #destaques form div input.checkbox{
	margin-left: 25px;
	clear: both;
	position: relative;
}
*/
#destaques form div input.radio, #destaques form div input.checkbox{
	margin-left: 145px;
	/*margin-bottom: 5px;
	margin-top: 5px;*/
	clear: left;
}

#destaques form div textarea{
	/*clear: both;*/
	/*float: left;*/
	margin-bottom: 5px;
	margin-left: 10px;
}
