/* GERAL
---------------------------------------------------------------------------- */

html, body, h1, h2, h3, h4, h5, h6, p, ul, dl, dt, dd, form, fieldset {
	padding: 0;
	margin: 0;
}

html, body {
	height: 100%;
}

body {
	font-family: Arial, sans-serif;
	font-size: small;
}

* html body {
	font-size: x-small;
	f\ont-size: small;
}

acronym {
	border-bottom: 1px dotted #333;
}

h1 { font-size: 120%; }
h2 { font-size: 110%; }
h3 { font-size: 100%; }
h4 { font-size: 100%; }

/* WRAPPER
---------------------------------------------------------------------------- */

#wrapper {
	position: relative;
	min-height: 100%;
	margin: 0 0 70px 0;
}

* html #wrapper {
	height: 100%;
}

/* TOPO
---------------------------------------------------------------------------- */

#topo {
	min-width: 770px;
	margin: 0 auto;
	background: url(images/topo-bg.gif) top left repeat-x;
	text-align: left;
}

#topo h1 {
	margin: 0 auto;
	height: 79px;
	width: 762px;
	background: url(images/logo.gif) top center no-repeat;
	overflow: hidden;
	text-indent: -9999em;
}

/* NAV
---------------------------------------------------------------------------- */

#nav {
	background: #bd2400 url(images/nav-bg.gif) top left repeat-x;
}

* html #nav {
	height: 30px;
}

#nav ul {
	font-size: 85%;
	list-style: none;
	width: 742px;
	margin: 0 auto;
	padding: 10px;
	background: #c93000 url(images/nav-menu-bg.gif) top left repeat-x;
}

#nav li {
	display: inline;
}

#nav li a {
	padding: 10px 16px;
	color: #fff;
	text-decoration: none;
	text-transform: lowercase;
	border: none;
}

#nav li a:hover {
	background: #ac1700 url(images/nav-over.gif) top left repeat-x;
}

.home #nav li#nav-01 a,
.sobre #nav li#nav-02 a,
.servicos #nav li#nav-03 a,
.artigos #nav li#nav-04 a,
.laboratorio #nav li#nav-05 a,
.parceiros #nav li#nav-06 a,
.contato #nav li#nav-07 a {
	background: #ac1700 url(images/nav-over.gif) top left repeat-x;
	font-weight: bold;
}

/* CONTENT
---------------------------------------------------------------------------- */

#cwrapper {
	width: 100%;
	background: url(images/nav-bottom-bg.gif) top center repeat-x;
}

#content {
	width: 752px;
	padding: 35px 5px 10px 5px;
	margin: 0 auto;
	font-size: 90%;
	text-align: left;
	color: #333;
	background: url(images/nav-menu-bottom-bg.gif) top center no-repeat;
}

#content a {
	color: #39c;
	border-bottom: 1px dotted #39c;
	text-decoration: none;
}

#content h4 a:hover,
#content p a:hover,
#content li a:hover {
	color: #666;
	border-color: #666;
	background-color: #eceff0;
}

#content p,
#content ul,
#content dl {
	line-height: 135%;
}

/* FOOTER
---------------------------------------------------------------------------- */

#footer {
	clear: both;
	width: 100%;
	background: url(images/footer-bg.gif) repeat-x;
	position: relative;
	margin: -70px 0 0 0;
}

#footer p {
	height: 70px;
	width: 770px;
	margin: 0 auto;
	background: url(images/footer.gif) top center no-repeat;
	overflow: hidden;
	text-indent: -9999em;
}

/* HIGHLIGHT
---------------------------------------------------------------------------- */

#highlight {
	float: left;
	width: 500px;
	min-height: 150px;
	margin: 0 0 15px 5px;
	color: #333;
	background: #fff url(images/highlight.jpg) top left no-repeat;
}

* html #highlight {
	height: 150px;
	margin-left: 3px;
}

#highlight h2 {
	overflow: hidden;
	text-indent: -9999em;
	height: 85px;
}

#highlight p {
	padding: 0 100px 10px 15px;
}

#highlight a {
	padding-right: 12px;
	background: url(images/icone-arrow.gif) right center no-repeat;
	font-weight: bold;
}

/* O QUE FAZEMOS
---------------------------------------------------------------------------- */

#box1 {
	float: right;
	width: 280px;
	height: 14.5em;
	padding: 0 0 10px 0;
	background: url(images/box1-bg-bottom.gif) bottom left no-repeat;
}

#box1 h2 {
	width: 280px;
	height: 40px;
	margin: 0 0 5px 0;
	overflow: hidden;
	text-indent: -9999em;
	background: #fff url(images/oquefazemos.gif) top left no-repeat;
}

#box1 ul {
	margin: 15px 0 0 15px;
}

#box1 ul li,
ul.arrowsbox li {
	list-style: none;
	background: url(images/icone-bullet-arrow.gif) center left no-repeat;
	padding: 0 0 0 18px;
	margin: 0 0 5px 0;
}

/* NEWSLETTER
---------------------------------------------------------------------------- */

#box2 {
	float: left;
	width: 210px;
	height: 14.5em;
	padding: 0 0 10px 0;
	background: url(images/box2-bg-bottom.gif) bottom left no-repeat;
}

#box2 h2 {
	width: 210px;
	height: 40px;
	margin: 0;
	overflow: hidden;
	text-indent: -9999em;
	background: #fff url(images/newsletter.gif) top left no-repeat;
}

#box2 h4,
#box2 p {
	padding: 0 15px;
	margin: 1em 0 0 0;
}

/* NOVIDADES
---------------------------------------------------------------------------- */

#novidades {
	width: 230px;
	float: right;
	margin: 0 0 0 10px;
}

#novidades h2 {
	background: url(images/blog.gif) top left no-repeat;
	overflow: hidden;
	text-indent: -9999em;
	height: 40px;
}

#novidades h3 {
	font-size: 90%;
	color: #c00;
	text-transform: uppercase;
	font-weight: normal;
	padding: 0 10px;
	margin-top: 5px;
}

#novidades h4 {
	background: url(images/novidade-item-top.gif) top center no-repeat;
	text-transform: uppercase;
	font-size: 95%;
	padding: 5px 10px;
	margin-top: 5px;
}

#novidades div {
	background: url(images/novidade-item-bottom.gif) bottom center no-repeat;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

#novidades div.ultimo {
	background: none;
	padding-bottom: 0;
}

#novidades div p {
	margin: 0 10px;
}

#novidades p.link-icon {
	padding-left: 22px;
	background: url(images/icone-artigos.gif) left center no-repeat;
	font-weight: bold;
}

p#feed {
	font-size: 95%;
	background: url(images/novidades-bottom.gif) top left no-repeat;
	padding: 10px 0 0 10px;
}

p#feed a {
	font-weight: bold;
	background: url(images/feed-icon.gif) center left no-repeat;
	border: none;
	padding: 0 0 0 15px;
}

p#feed a span {
	border-bottom: 1px dotted #39c;
}

p#feed a:hover span {
	border-bottom: 1px dotted #666;
}

/* CONTATO
---------------------------------------------------------------------------- */

.contato h2 {
	overflow: hidden;
	text-indent: -9999em;
	height: 50px;
	margin-bottom: 25px;
	background: #fff url(images/contato-h2.gif) 10px 13px no-repeat;
}

#contato {
	float: left;
	width: 425px;
	padding: 0 25px 0 0;
	border-right: 1px solid #d0d6d9;
}

#contato h3,
#endereco h3 {
	overflow: hidden;
	text-indent: -9999em;
	height: 20px;
	margin-bottom: 5px;
}

#contato h3 {
	background: url(images/contato-imgs.gif) 11px 0px no-repeat;
}

#contato h4 {
	margin: 25px 0 15px 15px;
}

#contato p {
	padding-left: 15px;
}

/* ENDERECO
---------------------------------------------------------------------------- */

#endereco {
	width: 285px;
	float: right;
}

#endereco h3 {
	background: url(images/contato-imgs.gif) 0 -20px no-repeat;
}

#endereco h3#fone {
	background: url(images/contato-imgs.gif) 0 -40px no-repeat;
	margin-top: 20px;
}

/* FORMULARIO
---------------------------------------------------------------------------- */

.contato form {
	margin-top: 20px;
	background: url(images/contato-form-bottom.gif) bottom left no-repeat;
	font-size: 95%;
	float: left;
}

.contato form em {
	color: #c00;
}

fieldset {
	border: none;
}

#contato form p {
	float: left;
	padding: 15px 25px 5px 25px;
	background: url(images/contato-form-top.gif) top left no-repeat;
}

.contato form span.legenda {
	clear: both;
	display: block;
	float: right;
	text-align: right;
	width: 100%;
	text-transform: lowercase;
	border-bottom: 1px solid #ccc;
	padding-bottom: 5px;
	margin-bottom: 25px;
}

* html .contato form span.legenda {
	float: none;
}

br {
	clear: left;
}

label {
	display: block;
	float: left;
	clear: left;
	width: 60px;
	padding-top: 3px;
	text-align: right;
	text-transform: lowercase;
}

label.ramal {
	width: auto;
	clear: none;
	margin-left: 15px;
}

/* CAMPOS
---------------------------------------------------------------------------- */

.entrada {
	font-family: Arial, sans-serif;
	font-size: 100%;
}

input, textarea {
	float: left;
	margin: 0 0 10px 5px;
	border: 1px solid #d0d9d9;
	background: #f1f3f4;
}

input[type=text]:focus, textarea:focus {
	border: 1px solid #f90;
}

input#prefixo, input#ramal {
	width: 30px;
}

input#telefone {
	width: 100px;
}

input#remetente, input#email, textarea {
	width: 305px !important;
	width /**/:300px;
}

textarea {
	height: 150px;
}

input#enviar {
	clear: left;
	float: right;
	background: none;
	border: none;
}

/* CADASTRO NEWSLETTER
---------------------------------------------------------------------------- */

.home form {
	width: 210px;
	margin: 8px 0 0 0;
	padding: 0;
}

.home label {
	width: 40px;
	text-align: left;
	padding-left: 15px;
}

.home input#nome, .home input#email {
	width: 135px !important;
}

.home input#enviar {
	margin: 0 10px 0 0;
	padding: 0;
}

/* SERVICOS
---------------------------------------------------------------------------- */

.servicos h2 {
	float: left;
	width: 87px;
	height: 82px;
	overflow: hidden;
	text-indent: -9999em;
	background: #fff url(images/servicos-h2.gif) 10px 13px no-repeat;
}

.servicos h3 {
	clear: both;
	height: 35px;
	margin: 0 0 30px 0;
	padding: 25px 0 0 15px;
	background: url(images/servicos-h3-bg.gif) 0 0 no-repeat;
}

.servicos h3 span {
	display: block;
	overflow: hidden;
	text-indent: -9999em;
	height: 20px;
}

.plan h3 span { background: url(images/servicos-h3.gif) 0 0 no-repeat; }
.usab h3 span { background: url(images/servicos-h3.gif) 0 -20px no-repeat; }
.arqi h3 span { background: url(images/servicos-h3.gif) 0 -40px no-repeat; }
.desi h3 span { background: url(images/servicos-h3.gif) 0 -60px no-repeat; }
.aplw h3 span { background: url(images/servicos-h3.gif) 0 -80px no-repeat; }

#servicos-txt {
	float: left;
	width: 400px;
	border-right: 1px solid #d0d6d9;
	padding-right: 25px;
}

#servicos-txt.serv-home {
	border: none;
	margin-top: 90px;
}

#servicos-txt ul {
	list-style: none;
}

#servicos-txt p {
	padding-left: 10px;
	margin-bottom: 1em;
}

#servicos-extras {
	width: 310px;
	float: right;
	font-size: 95%;
}

#servicos-extras div#etapas h4 {
	overflow: hidden;
	text-indent: -9999em;
	height: 50px;
	background: url(images/servicos-etapas.gif) top left no-repeat;
}

/* NAVEGACAO SERVICOS
---------------------------------------------------------------------------- */

#nav-serv {
	float: left;
	width: 100%;
	padding-bottom: 2px;
	background: #fff;
}

#nav-serv ul {
	float: right;
	list-style: none;
}

#nav-serv li {
	float: left;
}

#nav-serv li a,
#nav-serv li a:visited {
	display: block;
	border: none;
	overflow: hidden;
	text-indent: -9999em;
	height: 82px;
	width: 95px;
}

#nav-serv a:active {
	background-color: #fff;
}

#serv-plan a { background: #eceff0 url(images/servicos-icones.gif) 0 0 no-repeat; }
#serv-usab a { background: #eceff0 url(images/servicos-icones.gif) -95px 0 no-repeat; }
#serv-arqi a { background: #eceff0 url(images/servicos-icones.gif) -190px 0 no-repeat; }
#serv-desi a { background: #eceff0 url(images/servicos-icones.gif) -285px 0 no-repeat; }
#serv-aplw a { background: #eceff0 url(images/servicos-icones.gif) -380px 0 no-repeat; }

body.plan #serv-plan a, #serv-plan a:hover { background-position: 0 -82px; }
body.usab #serv-usab a, #serv-usab a:hover { background-position: -95px -82px; }
body.arqi #serv-arqi a, #serv-arqi a:hover { background-position: -190px -82px; }
body.desi #serv-desi a, #serv-desi a:hover { background-position: -285px -82px; }
body.aplw #serv-aplw a, #serv-aplw a:hover { background-position: -380px -82px; }

/* ETAPAS
---------------------------------------------------------------------------- */

div#etapas {
	clear: both;
	background: #e3e6e8 url(images/servicos-box-middle.gif) bottom left repeat-y;
}

div#etapas div {
	padding: 0 0 20px 0;
	background: url(images/servicos-box-bottom.gif) bottom left no-repeat;
}

div#etapas dl {
	padding: 8px 0 0px 67px;
	margin: 0;
}

body.plan div#etapas dl { background: url(images/servicos-box-top-plan.gif) top left no-repeat; }
body.usab div#etapas dl { background: url(images/servicos-box-top-usab.gif) top left no-repeat; }
body.arqi div#etapas dl { background: url(images/servicos-box-top-arqi.gif) top left no-repeat; }
body.desi div#etapas dl { background: url(images/servicos-box-top-desi.gif) top left no-repeat; }
body.aplw div#etapas dl { background: url(images/servicos-box-top-aplw.gif) top left no-repeat; }

div#etapas dt {
	background: url(images/servicos-button-top.gif) top left no-repeat;
}

div#etapas dt a {
	display: block;
	background: url(images/servicos-button-noarrow-bottom.gif) bottom left no-repeat;
	padding: 5px 10px;
	border: none;
}

div#etapas dd {
	margin: 0 15px 0 0;
	padding-bottom: 10px;
	background: #fff url(images/servicos-sub-bottom.gif) bottom left no-repeat;
}

div#etapas dd span {
	display: block;
	padding: 5px 10px 0 10px;
	background: #fff url(images/servicos-sub-top.gif) top left no-repeat;
}

/* ETAPAS TOGGLER
---------------------------------------------------------------------------- */

div#etapas dt.mostra a,
div#etapas dt.xmostra a {
	background: url(images/servicos-button-noarrow-bottom.gif) bottom left no-repeat;
}

div#etapas dt.esconde a,
div#etapas dt.xesconde a {
	background: url(images/servicos-button-bottom.gif) bottom left no-repeat;
}

dd.mostra,
dd.xmostra {
	display: block;
}

dd.esconde,
dd.xesconde {
	display: none;
}

/* ETAPAS EXCECOES
---------------------------------------------------------------------------- */

div#etapas dt#etapa1 {
	background: url(images/servicos-button-noarrow-top.gif) top left no-repeat;
}

#servicos-extras div#etapas dt a.xtoggler {
	background: url(images/servicos-button-noarrow-bottom.gif) bottom left no-repeat;
}

div#etapas dd.xmostra {
	background: #fff url(images/servicos-sub-noarrow-bottom.gif) bottom left no-repeat;
}

/* SOBRE
---------------------------------------------------------------------------- */

.sobre h2 {
	overflow: hidden;
	text-indent: -9999em;
	height: 50px;
	margin-bottom: 25px;
	background: #fff url(images/sobre-h2.gif) 10px 13px no-repeat;
}

.sobre #servicos-txt h3 {
	clear: both;
	overflow: hidden;
	text-indent: -9999em;
	height: 20px;
	margin: 40px 0 10px 10px;
}

.sobre h3#quem { background: url(images/sobre-h3.gif) 0 0 no-repeat; margin-top: 0; }
.sobre h3#interface { background: url(images/sobre-h3.gif) 0 -20px no-repeat; }
.sobre h3#usuario { background: url(images/sobre-h3.gif) 0 -40px no-repeat; }

.sobre #servicos-extras h3 {
	clear: both;
	overflow: hidden;
	text-indent: -9999em;
	height: 65px;
	background: url(images/sobre-tipos.gif) 0 0 no-repeat;
}

.sobre #servicos-extras p {
	font-size: 105%;
	padding: 0 10px;
}

.sobre #servicos-extras ul {
	list-style: none;
	font-size: 105%;
	margin: 0 0 20px 0;
	padding: 0 0 10px 10px;
	background: url(images/sobre-tipos-bottom.gif) left bottom no-repeat;
}

.sobre #servicos-extras ul li {
	margin: 0 0 5px 0;
}

.sobre #servicos-txt ul.arrows li {
	list-style: none;
	background: url(images/icone-arrow.gif) center left no-repeat;
	margin: 0 0 0 10px;
	padding: 0 0 0 15px;
	font-weight: bold;
}

.sobre #servicos-txt dt {
	margin-left: 10px;
	font-weight: bold;
	color: #333;
}

.sobre #servicos-txt dd {
	margin: 0 0 1em 10px;
}
