﻿/*
Projeto: Site Obras Online
Description: Desenvolvimento de corte html/css e interações jquery
Version: 1.0
HTML/CSS: Aliás Digital
*/




/*----------------------------------
	Geral
----------------------------------*/
*{	outline:none }
html {	background: #ffffff url("../imagens/bgs/conteudo.gif") repeat-x 0 436px;}
body
{
	font: 12px/14px Arial;
}
.left{ float:left; }
.right{ float:right; }
.limpa{ clear: both }

div.center{	margin:0 auto; width:970px; }
.linha-cinza-branco  
{
	background: url("../imagens/linhas/cinza-branco.gif") repeat-x; 
	height: 2px; 
	width: auto; 
	margin: 9px 8px; 
}

/* Bordas Arredondadas */
span.canto-ce { left:0;	top:0; margin: -1px 0 0 -1px; display: block;	background: url("../imagens/bordas/be.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-cd {	right:0; top:0; margin: -1px -1px 0 0; display: block;	background: url("../imagens/bordas/bd.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-re {	left:0;	bottom:0; margin: 0 0 -1px -1px; display: block; background: url("../imagens/bordas/re.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-rd {	right:0; bottom:0; margin: 0 -1px -1px 0; display: block; background: url("../imagens/bordas/rd.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }

/* Usar com fundo branco */
span.canto-ce2 { left:0; top:0; margin: -1px 0 0 -1px; display: block;	background: url("../imagens/bordas/be2.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-cd2 { right:0; top:0; margin: -1px -1px 0 0; display: block;	background: url("../imagens/bordas/bd2.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-re2 { left:0; bottom:0; margin: 0 0 -1px -1px; display: block; background: url("../imagens/bordas/re2.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }
span.canto-rd2 {right:0; bottom:0; margin: 0 -1px -1px 0; display: block; background: url("../imagens/bordas/rd2.jpg") no-repeat; width: 6px; height: 6px; position: absolute; }



/*----------------------------------
	Links
----------------------------------*/

a{ text-decoration:none }
.esqueci { font-size: 10px; margin-right: 34px }


/*----------------------------------
	Formatação
----------------------------------*/

.negrito{ font-weight: bold }
.texto-m { margin: 12px 7px }  
.tamanho-minimo { min-height: 1047px }
.t14 { font-size: 14px }
.traco2{ background: url("../imagens/linhas/traco2.gif") repeat-x left center; padding: 17px 0; height: 3px; width: 100%; }

/*----------------------------------
	Cores
----------------------------------*/

.branco { color:#ffffff }
.laranja{ color:#ffc220 }
.azul{ color:#008acd }
.cinza{ color:#303030 }


/*----------------------------------
	Topo
----------------------------------*/

div#topo
{
	width:100%;
	height:105px;
	background:url("../imagens/bgs/topo.gif") repeat-x;
}

div#topo h1#logo
{
	float:left;
	width:241px;
	height:65px;
	margin:20px 0px 0px 0px;
	padding:0px;
	background: url("../imagens/marcas/obras-online.gif") no-repeat;
}
div#topo h1#logo a{ display: block; text-indent:-9999px; width: 100%; height: 100% }


div#area-restrita
{
	background: url("../imagens/bgs/area-restrita.png") no-repeat;
	width: 359px;
	height: 90px;
	float: right;
}

div#area-restrita h2
{
	background: url("../imagens/titulos/area-restrita-nova.jpg") no-repeat; 
	text-indent: -99999px;
	width: 196px;
	height: 18px;
	margin: 10px 0 0 22px;
}

div#area-restrita div#form-area{ margin: 0 8px; }
div#area-restrita div#form-area div.item{ float: left; margin-left: 7px }
div#area-restrita div#form-area div.item div.txt{ float: left; margin-right: 5px; line-height: 20px; font-size: 11px; }
div#area-restrita div#form-area div.item .seta{ margin-left: 6px }

/*----------------------------------
	Menu
----------------------------------*/

div#menu
{
	width:100%;
	height:48px;
	background:url("../imagens/bgs/menu.gif") repeat-x;
}

/* Home */
ul#menu-principal li.first{ background: none; padding-left:0; } 
ul#menu-principal li.first a{ padding-left:0; } 
ul#menu-principal li.first a:hover, ul#menu-principal li.first a.ativo{ background: none }
/* Demais Itens */
ul#menu-principal li{ float: left; background: url("../imagens/menu/divisor.gif") no-repeat left center; margin: 1px 0; padding-left:2px; }
ul#menu-principal li a{ display:block; padding: 0 8px; height:43px; line-height: 43px; font-size: 13px; color: #303030 }
ul#menu-principal li a:hover, ul#menu-principal li a.ativo{ background: url("../imagens/menu/bg-hover.jpg") repeat-x }

/* Drop Down */
ul#menu-principal li ul.sub-menu
{
	position: absolute;
	z-index: 50;
	background: #e6e5e5;
	display: none;
}
ul#menu-principal li ul.sub-menu li
{
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;	
	background: #e6e5e5 none !important;
}
ul#menu-principal li ul.sub-menu li a
{
	padding: 0 16px !important;
	height: 27px !important;
	line-height: 27px !important;
	color: #555555 !important;
	font-size: 12px !important;
	width: 100%;
	display: block;
	width: 135px;
}
ul#menu-principal li ul.sub-menu li a:hover, ul#menu-principal li ul.sub-menu li a.ativo
{
	background: #ffc220 none !important;
}

/*----------------------------------
	Destaque
----------------------------------*/
div#destaqueFull
{
	width:100%;
	height:283px;
	background:url("../imagens/bgs/destaque-full.gif") repeat-x;
}

div#destaque
{
	width:100%;
	height:283px;
	background:url("../imagens/bgs/destaque.jpg") no-repeat center top;
}

div#destaque-align
{
	margin: 0 auto;
	padding-top: 10px;
	width:970px;
	height: 263px;
}
.mascara 
{
	position: absolute; 
	z-index: 5; 
	background: url("../imagens/mascara/topo.png") no-repeat; 
	width: 970px; 
	height: 263px;
}


/*----------------------------------
	Destaque Interna
----------------------------------*/

div#destaqueInternaFull
{
	width:100%;
	height:204px;
	background:url("../imagens/bgs/destaque-interna-full.gif") repeat-x;
}

div#destaqueInterna
{
	width:100%;
	height:204px;
	background:url("../imagens/bgs/destaqueInterna.jpg") no-repeat center top;
}

div.alinhamento-destaque
{
	margin: 0 auto;
	padding-top: 11px;
	width:970px;
	position: relative;
}
div.alinhamento-destaque div.banner
{
	position: absolute;
	right:0;
	margin: 20px 20px 0 0;
}

/* Slider Destaques */
ul#sliderDestaques li div.legenda
{
	background: url("../imagens/bgs/cinza-95.png") repeat;
	width: 970px;
	height: 76px;
	position: absolute;
	z-index: 4;
	margin-top: 187px
}
ul#sliderDestaques li div.legenda div.titulo
{
	font-size: 18px;
	color: #ffc220;
	margin: 10px 0 0 11px;
	word-spacing: -2px;
}

ul#sliderDestaques li div.legenda div.sinopse
{
	font-size: 13px;
	color: #ffffff;
	margin: 8px 24px 0 11px;
}


div#pagina-destaques { position: absolute; z-index: 10; margin: 26px 0 0 830px; } /* Voltar o margin: 26px 0 0 840px; quando tiver somente 4 destaques */
div#pagina-destaques a { margin-left: 3px; color: #ffffff; background: url("../imagens/destaque/bg-numerador.png") no-repeat; display: block; float:left; width: 23px; height: 22px; text-align: center; line-height: 22px }
div#pagina-destaques a:hover, div#pagina-destaques a.activeSlide { color: #ffc220; }


/*----------------------------------
	Forms
----------------------------------*/

.TextBox
{
	margin:0px;
	padding:0px;
	border:Solid 1px #c7d8e3;
	background:#ffffff;	
	font-family:Arial;
	font-size:12px;
	color:#303030;
}
.DropDownList
{
	margin:0px;
	padding:0px;
	border:Solid 1px #abadb3;
	background:#ffffff;	
	font-family:Arial;
	font-size:12px;
	color:#303030;
}


/*----------------------------------
	Conteúdo - Capa
----------------------------------*/

div#conteudo
{ 
	margin:14px 0 14px 0;
}


/* Coluna 1*/
div#c1
{
	width: 231px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	float: left; 
	height: 377px;
}

/* Coluna 2*/
div#c2
{
	width: 476px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	float: left; 
	margin-left: 12px;
	height: 377px;
}

/* Coluna 3*/
div#c3
{
	width: 232px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	float: right; 
	height: 377px;
}

/* Coluna 2*/
div#c4
{
	width: 476px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	margin-left: 12px;
	height: 377px;
}


div.bg-titulo{ 	background: url("../imagens/bgs/titulo.jpg") repeat-x left top; }
div.alinhamento-box { margin: 19px 15px }
div.alinhamento-box2 { margin: 16px 14px }

div.alinhamento-box h2 
{ 
	color: #008acd; 
	font-size: 18px; 
	background: url("../imagens/linhas/traco.gif") repeat-x left bottom; 
	padding-bottom: 20px;
	padding-left: 6px;
}

div.alinhamento-box span.texto
{
	margin: 10px 5px;
	display: block;
	font-size: 12px;
}

div.bloco-form{ text-align: center; margin-bottom: 20px }
div.titulo-form
{
	color: #008acd;
	font-weight: bold;
	font-size: 12px;
	padding: 14px 10px;
	text-align: left;
}
div.titulo-form2
{
	color: #008acd;
	font-weight: bold;
	font-size: 12px;
	padding: 13px 0 10px 0;
	text-align: left;
}

div.titulacao
{
	width: 100%;
	background: url("../imagens/bgs/titulacao.gif") repeat-x;
	margin-top: 10px;
	padding-top: 20px;
}


.btnSeta
{
	display: block;
	background: url("../imagens/botoes/imgSetaMais.gif") no-repeat right top;
	line-height: 22px;
	padding-right: 23px;
	float: right;
	margin: 10px 3px 0 0;
}
.btnSeta2
{
	display: block;
	background: url("../imagens/botoes/imgSetaMenos.gif") no-repeat right top;
	height: 22px;
	line-height: 22px;
	padding-right: 23px;
	float: right;
	margin: 10px 3px 0 0;
}

/* Conteudo */

.cont{ margin-top: 13px}

.box
{
	width: 218px;
	margin-top: 13px;
}

.box div.titulo{ font-size:14px; margin-top: 10px }
.box div.sinopse{ margin-bottom: 16px }

.bg-foto{ background: url("../imagens/bgs/foto.gif") no-repeat; width: 203px; height: 139px }
.bg-foto img{ margin: 2px 0 0 2px }

.form-item { width: 203px; margin: 0 auto 10px auto; }
.form-item .txt { float: left; line-height: 22px; margin-right: 6px; width: 30px; font-size: 11px }

.form-itm { width: 100%; margin: 0 auto 10px auto; }
.form-itm .txt { float: left; line-height: 22px; margin-right: 6px; width: 30px; font-size: 11px }

/* Clientes */
div#slider-clientes{ margin-top: 13px; }
div#slider-clientes div.item a{ display:block; margin-bottom: 3px; }
div#pager-clientes{ background: url("../imagens/linhas/cinza-branco.gif") repeat-x left center; margin-top: 15px }
div#pager-clientes a.depoimentos{ margin-left: 8px }




/*----------------------------------
	Conteúdo - Interna
----------------------------------*/

/* Coluna 1*/
div#c1-i
{
	width: 722px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	float: left; 
}

/* Coluna 2*/
div#c2-i
{
	width: 232px;
	float: right; 
}

/* Coluna 2 - Box Individual */
div.c-box
{
	width: 230px;
	border: 1px solid #e1e1e1;
	position: relative;
	background-color: #FFF;
	float: left; 
	margin-bottom: 11px;
}

.bg-foto2{ background: url("../imagens/bgs/foto2.gif") no-repeat; width: 203px; height: 116px; margin: 10px 0 }
.bg-foto2 img{ margin: 2px 0 0 2px }




/*----------------------------------
	Listas
----------------------------------*/

ul.lista-resultados { margin-top: 18px }
ul.lista-resultados li
{
	position: relative;	
	border: 1px solid #e1e1e1;
	margin-bottom: 3px;
}
.logo
{
	float:left;
	position: relative;	
	border: 1px solid #e1e1e1;
	width: 196px;
	height: 112px	
}

.textos
{
	float:right;
	width: 440px;
	height: 112px;
}
.textos .titulo { margin: 5px 0 18px 0 }


/* Paginação */

div.paginacao { float: right; margin: 58px 0 16px 0 }
.anterior-proxima { float: left; display: block; margin-left: 3px }
.numeros { float: left; display: block; background: url("../imagens/bgs/paginacao.gif") no-repeat; width: 23px; height: 22px; color:#fff; text-align: center; line-height: 22px; margin-left: 3px }
a.numeros:hover, a.pagina-atual { color: #ffc220;  }


ul.lista-seta li
{
	background: url("../imagens/icones/seta.gif") no-repeat left 3px;
	padding-left: 15px;
	margin-left: 7px;
}
ul.margem li { margin-bottom: 10px }


ul.revistas { margin-left: 7px }
ul.revistas li 
{
	float: left;
	margin-right: 56px
}
ul.revistas li div.foto
{
	background: url("../imagens/bgs/revista.gif") no-repeat;
	width: 129px;
	margin-bottom: 7px;
}
ul.revistas li div.foto img { margin: 2px 0 0 2px }


ul.lista-noticias{ margin-top: 13px }
ul.lista-noticias li{ margin-bottom: 13px }
ul.lista-noticias li div.texto-n{ float: left; margin-left: 29px; margin-top: 36px; }



/*----------------------------------
	Tabelas
----------------------------------*/

table.tb1{ width: 685px; font-size: 14px; vertical-align: middle; margin-bottom: 20px; margin-left: 6px; }
td { border: 1px solid #d9d9d9;}

table.tb1 tr td.titulo{color: #ffffff; background-color: #337899; height: 30px; padding-left: 6px; }
table.tb1 tr td.estado{ background-color: #ffc220; width:110px; height: 61px; vertical-align: middle; text-align: center }
table.tb1 tr td.tipo{ background-color: #658696; color: #fff; height: 30px; text-align: left; vertical-align: middle; text-align: center }
table.tb1 tr td.tipo2{ background-color: #658696; color: #fff; height: 30px; text-align: left; vertical-align: middle; padding-left: 6px; }

table.tb1 tr td.residencial{ background: #4c6e7f; color: #FFF; padding-left: 6px; }
table.tb1 tr td.comercial{ background: #5a7988; color: #FFF; padding-left: 6px; }
table.tb1 tr td.industrial{ background: #688391; color: #FFF; padding-left: 6px; }
table.tb1 tr td.infraestrutura{ background: #778f9b; color: #FFF; padding-left: 6px; }


table.tb1 tr td.c1{  padding-left: 6px; color: #303030;  height: 30px }
table.tb1 tr td.c2{  padding-left: 6px; color: #303030; background-color: #edecec;  height: 30px }

table.tb1 tr td.totalG{ background-color: #ffc220; color: #303030; height: 30px; vertical-align: middle; text-align: center }
table.tb1 tr td.total{ background-color: #405c6a; color: #ffffff; height: 30px; vertical-align: middle; padding-left: 6px; }
table.tb1 tr td.total1{ background-color: #2b6480; color: #ffffff; height: 30px; vertical-align: middle; padding-left: 6px; }

table.tb1 tr td.res{ background: #4c6e7f; color: #FFF; text-align: center }
table.tb1 tr td.com{ background: #5a7988; color: #FFF; text-align: center }
table.tb1 tr td.ind{ background: #688391; color: #FFF;text-align: center }
table.tb1 tr td.infr{ background: #778f9b; color: #FFF; text-align: center }

table.tb1 tr td.e1{ color: #303030;  height: 30px; padding-left: 6px; }
table.tb1 tr td.e2{ color: #303030; background-color: #edecec;  height: 30px;  }
table.tb1 tr td.totalG2{ background-color: #ffc220; color: #303030; height: 30px; vertical-align: middle; padding-left: 6px; }


table.tb1 tr td.invisivel { border: 0; background-color: #fff; }


/*----------------------------------
	Rodapé
----------------------------------*/

div#rodape
{
	width: 970px;
	margin: 0 auto;
	font-size: 13px;
	line-height: 16px;
}
div#rodape div.end{	margin-bottom: 14px; }

div#parceiros-e-redes
{
	border-top: 1px dashed #dbdbdb;
	border-bottom: 1px dashed #dbdbdb;
	padding: 14px 0;
}

div#parceiros-e-redes div#parceiros{ float: left; }
div#parceiros-e-redes div#redes{ float: right; width: 130px }

div#parceiros-e-redes div div.titulo{ font-size:11px; text-transform: uppercase; margin-bottom: 12px }
div#parceiros-e-redes div#parceiros div#slider-parceiros{ width: 340px }
div#parceiros-e-redes div#parceiros div#slider-parceiros div.item div{ float: left; margin-right: 6px; }


div#copyright
{
	background: url("../imagens/linhas/traco.gif") repeat-x left bottom; 
	margin: 14px 0 12px 0;
	padding-bottom: 20px
}
