/**
* Folha de estilos do hotsite Porta Pronta da Maderoa
*/

@import url('yui/reset.css');
@import url('yui/fonts.css');
@import url('yui/base.css');

@import url('util.css');
@import url('niftycorners.css');
@import url('nav.css');
@import url('botoes.css');
@import url('conteudos.css');

/*-----------------------------------------------------------------------------*/

#container {
	background-color: #FFF;
	
	position: relative;
	width: 780px;
	height: auto;
	
	padding: 0;
	margin: 0 auto;
}

/*-----------------------------------------------------------------------------*/

.top-nav {
	text-align: right;
	background-color: #FFF;
	
	position: relative;
	width: auto;
	height: auto;
	
	padding: 6px 0 12px 0;
}

.top-nav ul,
.top-nav li {
	list-style-type: none !important;
	
	position: relative;
	width: auto;
	height: auto;
	
	padding: 0;
	margin: 0;
}

.top-nav ul {
	position: relative;
	top: 0;
	right: 5px;
}

.top-nav li {
	display: inline;
	margin: 0 8px;
}

.top-nav a {
	font: bold 11px 'Trebuchet MS', Arial, Verdana, serif;
	color: #F8B966;
	text-decoration: none;
	background: transparent url('../images/bl/arrow.jpg') no-repeat center left;
	
	padding-left: 12px;
}

.top-nav a:hover {
	color: #F9DDB3;
}

.face {
	background: #FFF url('../images/bg/ilustracao.jpg') no-repeat 0 0;
	
	position: relative;
	width: auto;
	height: 164px;
}

.face .logo {
	background: transparent url('../images/logo.jpg') no-repeat top left;
	
	position: absolute;
	width: 350px;
	height: 168px;
	
	top: -9px;
	right: 2px;
}

.punchline {
	font: bold 13px 'Trebuchet MS', Arial, Verdana, serif;
	color: #8AB3D0;
	background-color: #FFF;
	text-align: center;
	text-transform: uppercase;
	
	position: relative;
	width: auto;
	height: auto;
	
	padding: 12px 0 14px 0;
}

/*-----------------------------------------------------------------------------*/

.main {
	background-color: #C8DDF2;
	
	position: relative;
	clear: both;
	width: auto;
	height: auto;
	
	padding: 10px 0 0 0;
	margin: 0;
}

.content {
	clear: both;
	width: auto;
	height: auto;
	
	margin: 0 20px;
}

.content .sidebar {
	position: relative;
	float: left;
	width: 140px;
	height: auto;
	
	margin-right: 10px;
}

.content .page {
	background-color: #FFF;
	
	position: relative;
	float: left;
	width: 590px;
	height: auto;
}

.page .sub-content {
	padding: 14px;
}

.main .clear {
	position: relative;
	overflow: hidden;
	clear: both;
	width: auto;
	height: 1px;
}

/*-----------------------------------------------------------------------------*/

.apoio {
	background-color: #C8DDF2;
	
	position: relative;
	width: auto;
	height: auto;
	
	padding-top: 12px;
}

.apoio div {
	background-color: #F2F8FF;
	
	position: relative;
	width: 716px;
	height: auto;
	
	padding: 12px;
	margin: 0 auto;
}

.apoio table {
	padding: 0;
	margin: 0 auto;
}

.apoio td {
	text-align: center;
	vertical-align: middle;
	border-style: none;
	
	padding: 0 6px 0 12px;
}

.apoio .title {
	font: bold 9px Verdana, Arial, serif;
	color: #999;
	border-right: 1px solid #DDD;
	
	padding: 0 6px 0 28px;
}

.apoio .title:first-child {
	padding-left: 0;
}

/*-----------------------------------------------------------------------------*/

.footer {
	font: bold 11px Arial, Verdana, serif;
	color: #98B9DF;
	text-align: center;
	background-color: #C8DDF2;
	
	position: relative;
	width: auto;
	height: auto;
	
	padding: 12px 0;
	margin: 0;
}

.footer a {
	font: bold 11px Arial, Verdana, serif;
	color: #98B9DF;
}

.footer a:hover {
	color: #069;
}

/*-----------------------------------------------------------------------------*/