@charset "utf-8";
/* --------------------------------------------------------------

   estilos.css
   * estilo geral para p�ginas.
	 
	 @autor:Stevan Cavalcante
	 @modifica��o:2011

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

/* --------------------------------------------------------------
					FORMATA��O GERAL
-------------------------------------------------------------- */
body{
}
/* --------------------------------------------------------------
					FORMATA��O DO TOPO
-------------------------------------------------------------- */
.topoGeral{
	width:auto;
	height:auto;
	background:url(../img/bgTopo.png) repeat-x;
	background-position:top;
}
.topo{
	width:950px;
	height:115px;
	margin:auto;
	background:url(../img/bgTopoDois.png) no-repeat;
	background-position:bottom;				
}
.banner{
	width:auto;
	height:300px;
	background:url(../img/bgBanner.png) repeat-x;
}
.boxBanner{
	width:950px;
	height:300px;
	margin:auto;
	background:url(../img/banner.png) no-repeat;
	background-position:center;
}
.btnBanner{
	width:240px;
	height:45px;
	float:right;
	margin-right:20px;
	margin-top:225px;
}
.logoSombraFixa{
	width:380px;
	height:115px;
	background:url(../img/bgLogohover.png) no-repeat;
	float:left;
}
.logo{
	width:250px;
	height:50px;
	float:left;
}
.logo a:hover{
	width:250px;
	height:115px;
	float:left;
	background:url(../img/bgLogohoverDois.png) no-repeat;
}
.menuTopo{
	width:auto;
	height:30px;
	float:right;
	margin-top:47px;
}
.linkMenuTopo{
	width:auto;
	height:30px;
	margin:0 10px;
}
.linkMenuTopo a{
	font-family:arial;
	font-size:15px;
	color:#eee;
	font-weight:bold;
}
.linkMenuTopo a:hover{
	color:#81CE2F;
}
.facebookButton {
  float: right;
  height: 25px;
  position: relative;
  right: 75px;
  top: 47px;
  width: 45px;
}
/* --------------------------------------------------------------
					FORMATA��O DO TOPO INTERNA - SERVI�OS & EMPRESA
-------------------------------------------------------------- */
.topoGeralInterna{
	width:auto;
	height:150px;
	background:url(../img/bgTopo.png) repeat-x;
	background-position:top;
}
.breadcrumbGeral{
	width:auto;
	height:35px;
	background:url(../img/bgBreadcrumb.png) repeat-x;
}
.breadcrumb{
	width:950px;
	height:35px;
	margin:auto; 	
}
.breadcrumb h1{
	padding-top:9px;
	font-family:arial;
	font-size:13px;
	color:#333;
}
.breadcrumb h1 a{
	padding:5px 20px 0 20px;
}
.breadcrumb h1 a:hover{
	color:#81CE2F;
}
.breadcrumb h2{
	padding:9px 20px 0 20px;
	font-family:arial;
	font-size:13px;
	color:#fff;
}
.boxB{
	width:auto;
	height:34px;
	float:left;
	padding-right:10px;
	background:url(../img/breadcrumbSeta.png) no-repeat;
	background-position:right;
}
.boxBUltimo{
	width:auto;
	height:34px;
	float:left;	
	padding-right:10px;
}
.boxBAtivo{
	width:auto;
	height:35px;
	float:left;
}
.boxBAtivoEsquerda{
	width:20px;
	height:35px;
	float:left;
}
.boxBAtivoDireita{
	width:auto;
	height:35px;
	float:left;
	background:url(../img/btnBAtivoDireita.png) repeat-x;
	border-right:1px solid #999;
}
.boxBAtivoDireita h1{
	padding:9px 20px;
}
/* --------------------------------------------------------------
					FORMATA��O DO MENU
-------------------------------------------------------------- */
.menuGeral{
	width:auto;
	height:165px;
	margin:auto;
	background:url(../img/bgMenuGeral.png) repeat-x;
}
.menu{
	margin:auto;
	width: 950px;
	height: 160px;	
}
.boxPortfolio{
	width:200px;
	height:120px;
	background-color:#fff;
	border:1px solid #999;
	margin-top:10px;
}
.boxPortfolioImagem{
	width:192px;
	height:112px;
	background-color:#999;
	margin:4px 4px;
}
.boxZoom{
	width:192px;
	height:112px;
	position:relative;
	background:url(../img/boxZoom.png) no-repeat;
	background-position:center;
	display:none;
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTEUDO
-------------------------------------------------------------- */
.corpoGeral{
	width:auto;
	height:auto;
	background:#eee;
	border-top:1px solid #999;
	border-bottom:1px solid #999;
	padding-bottom:10px;
}
.corpo{
	width:950px;
	height:auto;
	margin:auto;
}
.corpoBoxEsquerda{
	width:680px;
	height:auto;
	float:left;
}
.corpoBoxDireita{
	width:205px;
	height:auto;
	float:right;
	background:url(../img/bgBoxEsquerda.png) no-repeat;
	padding-left:40px;
}
.tituloCapa{
	margin-top:30px;
}
.tituloNewsletter{
	margin-top:35px;
}
.titulogoClient{
  width:auto;
  height:auto;
  margin-top:20px;
}
.boxFace{
  width:200px;
  height:270px;
  float:left;
  margin-top:20px;
  padding-top:40px;
  background:url(../img/topoFacebook.png) no-repeat;

}
.boxLinkedin {
  width: 160px;
  height: 30px;
  margin: auto;
}
.titulogoClient{
	margin-bottom:15px;
}
.boxConteudo{
	height:300px;
	margin-top:30px;
}
.boxConteudoEsquerda{
	width:300px;
	height:130px;
	float:left;
}
.boxConteudoDireita{
	width:300px;
	height:130px;
	float:right;
	margin-right:30px;
}
.boxCapa{
	width:300px;
	height:130px;
	float:left;
	margin-top:20px;
	margin-bottom:20px;
	background:url(../img/boxCapa.png) no-repeat;
}
.chamadaCases{
	width:300px;
	height:63px;
}
.btnChamadaCases{
	width:300px;
	height:46px;
	float:left;
}
.chamadaComunidade{
	width:300px;
	height:46px;
	float:left;
}
.btnChamadaComunidade{
	width:300px;
	height:46px;
	float:right;
}
.input{
	width:200px;
	height:36px;
	background:url(../img/inputNewsletter.png);
	margin-top:10px;
}
.inputNewsletter{
	width:200px;
	background:none;
	padding-top:7px;
	padding-left:7px;
}
.btnCadastrar{
	float:right;
	margin-bottom:18px;
	margin-right:5px;
	margin-top:5px;
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTE�DO INTERNA - SERVI�OS
-------------------------------------------------------------- */
.corpoGeralInterna{
	width:auto;
	height:auto;
	background:#eee;
	border-bottom:1px solid #999;
	padding-bottom:30px;
}
.boxConteudoInterna{
	height:440px;
	margin-top:20px;
}
.boxConteudoInovacao{
	height:auto;
	margin-top:20px;  
}
.tituloInterna{
	margin-top:30px;
}
.imgWebDesign{
	width:65px;
	height:40px;
	float:left;
	margin-top:5px;
}
.imgServicos{
	width:55px;
	height:40px;
	float:left;
	margin-top:5px;
}
.boxConteudoEsquerdaServiços{
	width:300px;
	height:auto;
	float:left;
}
.boxConteudoDireitaServiços{
	width:300px;
	height:auto;
	float:right;
	margin-right:30px;	
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTE�DO INTERNA - EMPRESA
-------------------------------------------------------------- */
.corpoGeralInternaEmpresa{
	width:auto;
	height:auto;
	background:#eee;
	border-bottom:1px solid #999;
	padding-bottom:30px;
}
.boxConteudoInternaEmpresa{
	height:auto;
	margin-top:20px;
	margin-bottom:40px;
}
.tituloInterna{
	margin-top:30px;
}
.boxConteudoEsquerdaEmpresa{
	width:300px;
	height:auto;
	float:left;
}
.boxConteudoDireitaEmpresa{
	width:300px;
	height:auto;
	float:right;
	margin-right:30px;	
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTE�DO INTERNA - SUPORTE
-------------------------------------------------------------- */
.boxConteudoInternaSuporteGeral{
	height:200px;
	margin-top:20px;
}
.boxConteudoInternaSuporte{
	height:auto;
	margin-bottom:10px;
}
.btnAcesseUm{
	float:left;
}
.btnAcesseDois{
	float:left;
}
.btnEntreemContato{
	float:left;
}
.boxConteudoEsquerdaSuporte{
	width:300px;
	height:auto;
	float:left;
}
.boxConteudoDireitaSuporte{
	width:300px;
	height:auto;
	float:right;
	margin-right:40px;
}
.tituloNossoSuporte{
	height:35px;
	margin-top:40px;
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTE�DO INTERNA - CONTATO
-------------------------------------------------------------- */
#tabnav{
	width:670px;
	height:399px;	
	margin-top:15px;
}
#tabs{
	width:670px;
	height:39px;
	position:relative;
}
#content{
	width:630px;
	height:auto;
	position:relative;
	padding:30px;
	padding-bottom:0px;
	background:url(../img/bgContato.png) no-repeat;
	font-family:arial;
	font-size:15px;
	color:#fff;
}
.contentRodape{
	width:670px;
	height:4px;
}
#content div p{
	font-family: Trebuchet MS, Arial, Verdana;
	font-size: 12px;
}
#tabs a{
	background:url(../img/btnContatoUm.png) no-repeat;
	font-family: Arial;
	text-decoration: none;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	display: block;
	width: 160px;
	height: 28px;
	margin: 0 10px 0 0;
	text-align: center;
	float: left;
	padding-top: 13px;
}
#tabs a:visited{
	background:url(../img/btnContatoDois.png) no-repeat;
	font-family: Arial;
	text-decoration: none;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	display: block;
	width: 160px;
	height: 28px;
	margin: 0 10px 0 0;
	text-align: center;
	float: left;
	padding-top: 13px;
}
.boxForm{
	width:262px;
	height:32px;
	background:url(../img/boxForm.png) no-repeat;
	margin-top:10px;
	margin-bottom:20px;
}
.boxUpload{
	margin-top:10px;
	margin-bottom:20px;
}
.boxFormMensagem{
	width:610px;
	height:90px;
	background:url(../img/boxFormMensagem.png) no-repeat;
	margin-top:10px;
	margin-bottom:10px;
}
.inputBoxFormMensagem{
	width:600px;
	height:90px;
	background:none;
	padding-top:5px;
	padding-left:7px;
	scroll:no;
}
.inputBoxForm{
	width:250px;
	background:none;
	padding-top:5px;
	padding-left:7px;
}
.formUm{
	float:left;
}
.formDois{
	float:right;
	margin-right:20px;
}
.formTres{
	float:left;
}
.formUpload{
	float:left;
}
.btnEnviar{
	width:100px;
	height:30px;
	float:right;
	margin-right:20px;
	margin-bottom:5px;
}
.contatoMapa{
	width:290px;
	height:290px;
	float:left;
	margin-bottom:25px;
	border:1px solid #fff;
}
/* --------------------------------------------------------------
					FORMATA��O DO CONTE�DO INTERNA - PORTFOLIO
-------------------------------------------------------------- */
.linePortfolio{
	width:650px;
	height:2px;
	background:url(../img/linePortfolio.png) no-repeat;
	margin-top:25px;
}
.boxConteudoPortfolio{
	width:213px;
	height:200px;
	float:left;
	margin-right:15px;
}
.boxPortfolio{
	width:200px;
	height:120px;
	background-color:#fff;
	border:1px solid #999;
	margin-top:10px;
}
.boxPortfolioImagem{
	width:192px;
	height:112px;
	background-color:#999;
	margin:4px 4px;
}
.boxPortfolioSombra{
	width:190px;
	height:13px;
	background:url(../img/boxPortfolioSombra.png) no-repeat;
}
.btnVerCase{
	margin-top:5px;
	float:left;
}
.btnAcesseSite{
	margin-top:5px;
	margin-right:10px;
	float:right;
}
.boxConteudoInternaPortfolio{
	height:700px;
  width:670px;
	margin:20px 0px;
}
.boxLinePortfolio{
	height:220px;
	width:670px;  
}
.boxImagePortfolio{
	height:220px;
	width:220px;
  float:left;
	background-color:#fff;    
  box-shadow: 0 0 2px #999;
  -webkit-box-shadow: 0 0 2px #999;
  -moz-box-shadow: 0 0 2px #999;
}
.boxImagePortfolio:hover{
  opacity:0.5; 
  box-shadow: 0 0 0 #999;
  -webkit-box-shadow: 0 0 0 #999;
  -moz-box-shadow: 0 0 0 #999;
}
.boxZoom{
	width:192px;
	height:112px;
	position:relative;
	background:url(../img/boxZoom.png) no-repeat;
	background-position:center;
	display:none;
}
.btnCadastrarPortfolio{
	float:right;
	margin-bottom:23px;
	margin-right:5px;
	margin-top:5px;
}
/* --------------------------------------------------------------
					FORMATAÇÃO INOVAÇÃO
-------------------------------------------------------------- */
.boxImagens{
  width:670px;
  height:242px;
  margin-top:10px;
}
.imagemEsquerdaFanPage{
  width:330px;
  height:281px;
  background-color:#eee;
  float:left;
}
.imagemDireitaFanPage{
  width:330px;
  height:281px;
  background-color:#eee;
  float:left;
}
.imagemEsquerda{
  width:330px;
  height:242px;
  background-color:#ccc;
  float:left;
  box-shadow:0 0 4px #777;
  -moz-box-shadow:0 0 4px #777;
  -webkit-box-shadow:0 0 4px #777;
}
.imagemDireita{
  width:330px;
  height:242px;
  background-color:#ccc;
  float:right;
  box-shadow:0 0 4px #777;
  -moz-box-shadow:0 0 4px #777;
  -webkit-box-shadow:0 0 4px #777;
}
/* --------------------------------------------------------------
					FORMATA��O RODAP�
-------------------------------------------------------------- */
.rodapeGeral{
	width:auto;
	height:245px ;
	background: url(../img/bgRodapeGeral.png);	
}
.rodape{
	width:950px;
	height:auto;
	margin:auto;		
}
.menuRodape{
	width:950px;
	height:159px;
	margin-top:30px;
	float:left;
}
.linkRodape{
	float:left;
	margin: 0 27px;
	line-height:5px;
	font-family:arial;
}
.linkRodape ul li {
	margin-top:12px;
	font-size:12px;
	color:#ccc;
}
.linkRodape ul li a:hover{
	color:#fff;
}
.rodapeTelefone{
	margin-top:8px;
	float:left;
}
.rodapeRS{
	width:232px;
	height:32px;
	float:left;
	margin-left:100px;
	margin-top:3px;
}
.redesSociais .facebook a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/facebook.png) no-repeat;
	float:left;
}
.redesSociais .facebook a:hover{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/facebookHover.png) no-repeat;
	float:left;
}
.redesSociais .twitter a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/twitter.png) no-repeat;
	float:left;
	margin-left:18px;
}
.redesSociais .twitter a:hover{
	background:url(../img/twitterHover.png) no-repeat;
}
.redesSociais .delicious a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/delicious.png) no-repeat;
	float:left;
	margin-left:18px;
}
.redesSociais .delicious a:hover{
	background:url(../img/deliciousHover.png) no-repeat;
}
.redesSociais .flickr a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/flickr.png) no-repeat;
	float:left;
	margin-left:18px;
}
.redesSociais .flickr a:hover{
	background:url(../img/flickrHover.png) no-repeat;
}
.redesSociais .linkedIn a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/linkedIn.png) no-repeat;
	float:right;
}
.redesSociais .linkedIn a:hover{
	background:url(../img/linkedInHover.png) no-repeat;
}
.redesSociais .lastfm a{
	display:block;
	width:32px;
	height:32px;
	background:url(../img/lastfm.png) no-repeat;
	float:right;
	margin-right:18px;
}
.redesSociais .lastfm a:hover{
	background:url(../img/lastfmHover.png) no-repeat;
}
.rodapeCopyright{
	margin-top:12px;
	float:right;
	color:#666;
	font-size:13px;
	font-family:arial;
}