/*Definições gerais*/
*{margin:0; padding:0;}
html,body {height: 100%; }
html, body, h2, h3, h4, div, p, ul, li, input {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

body { 
font-size: small/100%; /* Certeza que usuários do IE podem aumentar o tamanho da fonte.*/
background: #313537;}

/*Divs de estruturação*/

#geral{
position: relative;
width: 100%;
margin: auto;
background: #181C1F;
}	

#conteudo {
position: relative;
margin: auto;
width: 763px;
height: 100%;
color:#ffffff;
font-size: 12px;
background: #181C1F;
}	

#topo {
margin: auto;
width: 100%;
height: 138px;
background: #E8E8EB url(../imagens/bg_topo.jpg) repeat-x;
border-bottom: 6px solid #FDCA00;
}

#topo #containerTopo{
position: relative;
margin: auto;
width: 763px;
}

h1{  
width: 244px;
height: 84px;
margin: 32px 0px 0px 0px;
float: left;
visibility: visible;
background: url(../imagens/logomarca.gif) no-repeat;
}

h1 a {
float: left;
display: block;
width: 244px;
height: 84px;
cursor: pointer;
z-index: 5;
}

h1 a span {display: none;}

/**************** Estilos do menu ****************/

#containerMenu #menu{
float: left;
width: 479px;
height: 107px;
margin: 15px 0px 0px 30px;
}

#containerMenu #menu {
position: relative;
/*float: left;*/ 
width: 479px;
height: 107px;
background: url(../imagens/menu.gif) no-repeat;
}

#containerMenu #menu ul{list-style:none;}
#containerMenu #menu li{position: absolute; top:0; height:107px;} 

#containerMenu #menu li a{
   position: absolute;
   display:block;
   width:100%;
   height:100%;
   margin: 0px;
   cursor: pointer;
   text-decoration: none;
   font-size: 0px;
   color: #1E6AA8;
   }

#containerMenu #menu li a span{
   position: absolute;
   display:block;
   width: auto;
   height:100%;
   top:0px;
   text-indent: -9999px;
}

#home{width:66px; left: 0px;}
#agencia{width:110px; left:66px;}
#servicos{width:99px; left:176px;}
#portfolio{width:109px; left: 275px;}
#contato{width:95px; left:384px;}

#home a span{background:url(../imagens/menu.gif) no-repeat 0px 0px;}
#agencia a span{background:url(../imagens/menu.gif) no-repeat -66px 0px;}
#servicos a span{background:url(../imagens/menu.gif) no-repeat -176px 0px;}
#portfolio a span{background:url(../imagens/menu.gif) no-repeat -275px 0px;}
#contato a span{background:url(../imagens/menu.gif) no-repeat -384px 0px;}

#containerMenu #menu ul li a:hover{z-index:10;}

#home a:hover span{background:url(../imagens/menu.gif) no-repeat 0px -107px;}
#agencia a:hover span{background:url(../imagens/menu.gif) no-repeat -66px -107px;}
#servicos a:hover span{background:url(../imagens/menu.gif) no-repeat -176px -107px;}
#portfolio a:hover span{background:url(../imagens/menu.gif) no-repeat -275px -107px;}
#contato a:hover span{background:url(../imagens/menu.gif) no-repeat -384px -107px;}

#centro{
position: relative;
width: 763px; 
margin: 0px;
font-size: 11px;
background: url(../imagens/bg_centro.gif) repeat-y;
padding-bottom: 40px;
}

h2{
color: #FC9300;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
position: relative;
width: 100%;
margin: 15px 0px 15px 0px;
}

h2 span {
float: left;
margin: 0px 0px 10px 0px;
text-indent: -999em;
}

h2 span.tit_trabRecentes{
background: transparent url(../imagens/tit_trabRecentes.gif) no-repeat top left;
width: 154px;
height: 10px;
}

h2 span.tit_queFazemos{
background: transparent url(../imagens/tit_queFazemos.gif) no-repeat top left;
width: 111px;
height: 12px;
}

h2 span.tit_news{
background: transparent url(../imagens/tit_news.gif) no-repeat top left;
width: 92px;
height: 10px;
}

h3{
color: #7FBCE9;
text-transform: uppercase;
font-weight: bold;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

p{margin-bottom: 10px; line-height: 16px;}
a {color: #FFE800; text-decoration: none;}
a:hover {color: #9FDAF6; text-decoration: none;}

#colunaEsquerda {
float: left;
width: 512px;
margin: 0px;
}

#colunaEsquerda #boxTrabalhos{
position: relative;
width: 100%;
clear: both;
}

#colunaEsquerda #boxTrabalhos .boxEsq{
width: 202px;
float: left;
background: #FFFFFF;
padding: 6px;
color: #181C1F;
text-align: right;
}

#colunaEsquerda #boxTrabalhos .boxEsq img{margin-bottom: 5px;}

#colunaEsquerda #boxTrabalhos .boxDir{
width: 202px;
float: right;
background: #FFFFFF;
padding: 6px;
color: #181C1F;
text-align: right;
margin-right: 24px;
}

#colunaEsquerda #boxTrabalhos .boxDir img{margin-bottom: 5px;}

#colunaDireita {
float: right;
width: 195px;
background: #1D2124;
padding: 31px 30px 0px 26px;
}

#colunaDireita .divisor{
border-bottom: 1px dashed #ffffff;
height: 30px;
margin-bottom: 35px;
}

#colunaDireita ul{
position: relative;
clear: both;
margin: 0px 0px 10px 20px;
}

#colunaDireita ul li{
list-style: url(../imagens/list_home.gif);
}

#colunaDireita form{
width: 195px;
margin: 15px 0px 5px 0px;
}

#colunaDireita input{
width: 185px;
margin-bottom: 5px;
padding: 5px;
font-size: 11px;
border: 1px solid #FDFBFB;
background: #000102;
color: #FFCC01;
}

#colunaDireita input.bt_news{
width: 40px;
height: 15px;
border: none;
cursor: pointer;
float: right;
margin-top: 3px;
background: url(../imagens/bt_enviar.gif) no-repeat;
}

/**************** Estilos do rodapé ****************/

#footer {
position: relative;
margin: auto;
width: 100%;
color: #FED300;
font-size: 10px;
background: #313537;
clear: both;
}

#footer #container{
position: relative;
margin:auto;
width: 763px;
}

#footer #container ul{
color: #ffffff;
padding: 20px 0px 10px 0px;
}

#footer #container ul li{
display: inline;
list-style: none;
text-transform: uppercase;
font-size: 10px;
font-weight: bold;
}

#footer #container ul li a{
color: #ffffff;
text-decoration: none;
}

#footer #container ul li a:hover{
color: #FED300;
text-decoration: none;
}

#footer #container a{
color: #FED300;
text-decoration: none;
font-weight: bold;
}

#footer #container a:hover{
color: #ffffff;
text-decoration: none;
font-weight: bold;
}

 /*ESTILOS FORM*/
 
form{
width: 280px;
margin: 15px 0px 10px 0px;
}

label{
width:100%;
font-weight: bold;
}

input, textarea{
position: relative;
width: 250px;
margin: 5px 0px 5px 0px;
padding: 5px;
font-size: 11px;
border: 1px solid #FDFBFB;
background: #000102;
color: #FFCC01;
}

input.ddd{width: 30px; margin-right: 4px;}
input.fone{width: 200px;}

input.bt_enviar{
width: 40px;
height: 15px;
border: none;
cursor: pointer;
float: right;
margin: 10px 18px 0px 0px;
background: url(../imagens/bt_enviar.gif) no-repeat;
}


 /*CLASSES E ESTILOS DIVERSOS*/
 
.clear{clear: both}
 
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {display: inline-table;}
/*  Esconde IE-mac \*/* html .clearfix {height: 1%;} .clearfix {display: block;}/* IE-mac */