﻿/*
CSS com validado nivel 2.1 - Utilizando ImageSprite.

    Conecte
	Autor:Recigio Poffo
	
	CORES
	
	
	SIZES
	Page - 970px;
*/

/* --- zera configuraes e nivela navegadores --- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{ margin:0;padding:0; }
table { border-collapse:collapse;border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,th,var { font-style:normal;font-weight:normal; }
caption,th {text-align:left; }
li { list-style: none; }
h1,h2,h3,h4,h5,h6 { font-size:100%;font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0;font-variant:normal; }
/* to preserve line-height and selector appearance */
sup { vertical-align:text-top; }
sub { vertical-align:text-bottom; }
input,textarea,select{ font-family:inherit;font-size:inherit;font-weight:inherit; }
/*because legend doesn't inherit in IE */
legend { color:#000; }

table { font-size:inherit; }
a { text-decoration: none; outline:none; }
a:hover { text-decoration: underline; }

/* ##### Configuraes Gerais ####### */

body {
  margin: 0 auto;
  background-image: url('../images/bg.jpg');
  background-repeat: repeat-x;
  font-size: 12px;
  font-family:Arial,Verdana, Clean, sans-serif;
  color: #555; 
  min-height: 604px;
}

html{ 
	background-image: url('../images/linha.jpg');
	background-position: 0px -1px;
	background-repeat: repeat-y;
}

p,span, label,a { font-family:Arial,Verdana, Clean, sans-serif; }
h1,h2,h3,h4 { font-family:Arial,Verdana,Clean, sans-serif; }
ul { font-family:Arial,Verdana,Clean, sans-serif;  }
input { font-family:Arial,Verdana,Clean, sans-serif; font-size: 11px; }
a { color: #fff; }

.clear{clear:both; height: 0;}
.borda{border-bottom:1px solid #ccc; width: 100%; padding:10px 0 0 0; }

/* ##### Uso do Image Sprite - itens que possuem background ###### */
#header .menu li a, #footer #footer-content ul li a, .botao, .botao span, #content .menu-textual .sub-menu, #content .menu-textual .sub-menu li, #content .menu-textual .sub-menu li.last,
.chamada-contato,.lista-servico li h1,form dd input,form dd textarea,.menu-textual .chamada-suporte, #header .bandeirabr,#header .bandeiraen,#content .article .sub-fotos .titles span
{ 

background: transparent url(../images/sprite.png) no-repeat;

}

/*##### Grids da pagina ########## */
#header { margin:auto; width:940px; padding:40px 0; }

	#header img { float:left; }
	#header .menu { color:#ffffff; float:right; padding:30px 0 0 0 ;}
	#header .menu li { float:left; }
	#header .menu li a { font-size: 15px; padding:0 30px 0 30px ; background-position: right -115px; }
	
	#header .bandeiras { width: 690px; display:block; overflow: auto; }
	#header .bandeiraen { display:block; width: 25px; height: 22px; float:right; background-position: -747px -187px; }
	#header .bandeirabr { display:block; width: 25px; height: 22px; float:right; background-position: -716px -187px; margin:0 5px 0 0; }
	
	#header .bandeiraenborda { background-position: -687px -187px !important; }
	#header .bandeirabrborda { background-position: -774px -187px !important; }
	
#banner { width: 1058px; margin:auto; z-index: 1; position: relative; height: 336px; }
	
	#banner .ant { height: 226px; width: 381px; position: absolute; z-index: 1; top: 30px; left:0px; cursor:pointer; }
	#banner .meio { height: 334px; width: 506px;  position: absolute; z-index: 3; top: 10px; left:270px ;cursor:pointer;}
	#banner .pro { height: 226px; width: 381px; position: absolute; z-index: 2; top: 30px; left:675px;cursor:pointer; }
	
	#banner #orealhae { height: 40px; width: 76px;  position: absolute; z-index: 4; top: 120px; left:230px ; cursor:pointer;}
	#banner #orealhad { height: 40px; width: 76px; position: absolute; z-index: 4; top: 120px; left:776px; cursor:pointer; }
	
#bannermenor { margin:auto; width:940px; }

#content { margin:auto; width:940px; }

	.botao { background-position: right -56px ; padding:10px 43px 10px 0; display: block; float:left; }
	.botao:hover { text-decoration: none; }
	.botao span { font-size: 15px; padding:10px 0 10px 15px; text-decoration: none; background-position: -1px -1px; }

	#content .coluna-chamada { width:300px; float:left; color:#fff; padding:0 20px 0 0; margin:40px 0; }
		#content .coluna-chamada h1 { font-size: 40px; }
		#content .coluna-chamada h2 { color:#79d4ff; font-size: 15px; margin:0 0 20px 0; }
		#content .coluna-chamada h2 a { color:#79d4ff; }
		#content .coluna-chamada p { font-size: 14px; line-height: 25px; padding:30px 0; }
		#content .coluna-chamada span.data { margin:5px 0; display: block; }
		#content .coluna-chamada span.primeiro { margin:30px 0 5px 0;}
		#content .coluna-chamada .space-after-noticias { margin:35px 0 0 0; }
	
	#content .menu-textual { width: 220px; color: #fff; float:left; margin:0 20px 0 0; }
	
		#content .menu-textual .sub-menu { background-position: left bottom; padding:0 0 20px 0; margin:0 0 20px 0; }
		#content .menu-textual .sub-menu li { background-position: -1px -268px; padding:4px 0 9px 20px; color:#67b9e3;}
		#content .menu-textual .sub-menu li a { color:#67b9e3; }
		#content .menu-textual .sub-menu li.flecha { background-position: -1px -238px; padding:4px 0 9px 20px; color:#fff;  }
		#content .menu-textual .sub-menu li.first { background-position: -245px -220px; padding:24px 0 9px 20px; }
		#content .menu-textual .sub-menu li.flecha a { color: #fff; }
		#content .menu-textual .sub-menu li.first-flecha { background-position: -1px -220px; padding:24px 0 9px 20px;  color:#fff; }
		#content .menu-textual .sub-menu li.first-flecha a { color: #fff;  }
		
		#content .menu-textual .chamada-contato { background-position: -579px -224px; height: 306px; margin:0 0 20px 0; width: 220px;}
		#content .menu-textual .chamada-contato h2 { padding:130px 0 15px 0px; text-align: center; font-size: 17px; }
		#content .menu-textual .chamada-contato p { width: 180px; padding:0 20px; color: #67b9e3; font-size: 11px; line-height: 20px; }
		#content .menu-textual .chamada-contato a { padding:31px 0 0 63px; display:block; font-size: 15px; }
			
		#content .menu-textual .chamada-suporte { background-position: -312px -412px; height: 226px; margin:0 0 20px 0; width: 220px;}
		#content .menu-textual .chamada-suporte h2 { font-size: 21px; padding:10px 15px;  }
		#content .menu-textual .chamada-suporte h2.center { text-align: center; margin:0 0 30px 0; padding:20px 15px; }
		#content .menu-textual .chamada-suporte h3 { font-size: 20px; text-align: center; margin:0 0 10px 0; }
		#content .menu-textual .chamada-suporte h4 { font-size: 14px; text-align: center; color:#67b9e3; }
		#content .menu-textual .chamada-suporte p.azul { color:#67b9e3; padding:20px 15px 20px 15px; }
		#content .menu-textual .chamada-suporte p { font-size: 11px; padding:0 15px; line-height: 15px; }
		
	#content .article { float:left; width: 690px; margin: 0 0 40px 0; }
		
		#content .article h1 { color: #fff; font-size: 30px; margin:0 0 20px 0; }
		#content .article h3 { color: #f8e891; font-size: 16px; margin:10px 0 0px 0; font-weight: bold; }
		#content .article p { color: #fff; font-size: 15px; line-height: 25px; width: 650px; margin-bottom: 15px; }
		#content .article ul { color: #fff; margin:0 0 20px 0; }
		#content .article ul li { list-style: disc; margin:10px 0 0 20px; font-size: 14px; }
	
			#content .article .lista-noticia li a { color:#79d4ff;  font-size: 15px; margin:0 0 20px 0; cursor: pointer; }
			#content .article .lista-noticia li span.data { margin:5px 0; display: block; color:#fff; }
	
			#content .article .lista-servico {  }
			#content .article .lista-servico li { float:left; margin:10px ; height: 210px; width: 210px; list-style: none; }
			#content .article .lista-servico li h1 { height: 58px; background-position: -589px -625px; width: 210px; margin:0 0 5px 0; color: #42a7eb; font-size: 17px; padding:15px 5px 0 15px; }
			#content .article .lista-servico li h1 a { color: #42a7eb; text-decoration: none; }
			#content .article .lista-servico li h1 span { color: #f8e891; clear:both; display: block; }
			
			#content .article .lista-perguntas {  }
			#content .article .lista-perguntas li { margin: 5px 0; list-style: none; }
			#content .article .lista-perguntas li.borda { margin: 10px 0; padding:0px 0 10px 0; border-bottom: 1px solid #67B9E3; font-size: 12px;  }
			#content .article .lista-perguntas li dt { float:left; color: #fff; padding:0 5px 0 0; text-align: right;  }
			#content .article .lista-perguntas li dd a { color: #67B9E3; }
			#content .article .lista-perguntas li.borda a { padding:5px 0; display: block; font-size: 13px; text-decoration: none;  }
			#content .article .lista-perguntas li.borda p { font-size: 12px; line-height: 19px; }
			#content .article .lista-perguntas li.borda dt { float:none; text-align: left; margin:20px 0 5px 0; }
			#content .article .lista-perguntas li.borda dd { padding:0 0 20px 15px; }
	
			
		#content .article .sub-fotos .titles {  background-color: #214D75; list-style: none; overflow: auto; margin:0 ;  padding-top:10px;  }
		#content .article .sub-fotos .titles li span {  background-position: -783px -574px; padding:0 0 0 20px  }
		#content .article .sub-fotos .titles li { display: block; float:left; margin:0; padding: 0px 20px 10px 20px; width: 179px; color: #67B9E3; cursor: pointer; font-size: 11px;  }
		#content .article .sub-fotos .titles li:hover { color:#8ccaea}
		#content .article .sub-fotos .titles li:hover span { background-position: -783px -596px; }
		
		#content .article .sub-fotos .images { list-style: none; }
		#content .article .sub-fotos .images li { margin:0; display: none; list-style: none; }
				
	form { margin:20px 0 50px 0; width: 520px; }
	form dt { color: #fff; margin:5px 0 0 0; }
	form dd input { width: 359px; background-position: left -56px; border:0; background-repeat: repeat-x; padding:17px 10px 17px 10px; color: #fff; font-size: 15px; }
	form dd select { background-position: left -56px; border:0; }
	form dd textarea { width: 500px; height: 214px; border:0; background-position: -429px -699px ; width: 360px; color: #fff; padding:10px 10px 0 10px; overflow: hidden;}
	form dd .custonselect { background-color: #091C31; color: #fff; width: 225px; margin:0 0 0 2px; display:none; }
	form dd .custonselect li { border-bottom: 1px solid #0c3d71; padding:5px 5px !important; margin:0!important; cursor:pointer; list-style: none !important;  }
	form dd .custonselect li:hover { background-color: #0c3d71; padding:5px 5px !important; }
	form label.error { color: #F1D376; padding:0 0 0 20px; clear:both; display:block; }

	
#footer { background-color: #0a253d; padding:10px 0;  }
	
	#footer #footer-content { margin:auto; width:940px; }

		#footer #footer-content img { float:left; }
		#footer #footer-content ul { float:left; padding:10px 40px }
		#footer #footer-content ul li	{ list-style: none; }
		#footer #footer-content ul li a { font-size: 12px; color: #85929e; background-position: -793px -152px; padding:0 0 0 10px }
		#footer #footer-content ul li a.titulo { color: #fff; background-image: none; padding:0; line-height: 25px; font-size: 14px;  } 

