/*Nativ */

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

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

/*#bodyHome{background: #387A9C url(../imagens/bg.jpg) repeat-x;}
#bodyInt{background: #387A9C url(../imagens/bg_int.jpg) repeat-x;}*/

p{padding:0 0 1.6em 0;}

/*Divs de estruturação*/

#corpoHome{
position: relative;
margin: 0px;
padding: 0px;
top: 0px;
left: 0px;
width: 100%;
background: #387A9C url(../imagens/bg.jpg) repeat-x;
}

#corpo{
position: relative;
margin: 0px;
padding: 0px;
top: 0px;
left: 0px;
width: 100%;
background: #387A9C url(../imagens/bg_int.jpg) repeat-x;
}

#pagina {
position: relative;
margin: auto;
top: 0px;
left: 0px;
width: 960px;
}	

#topo{
position: relative;
top: 0px;
margin: auto;
width: 940px;
height: 87px;
}	

#logo {
float: left;
margin: 18px 43px 0px 0px;
width: 275px;
height: 50px;
}	

#logo h1{  
width: 275px;
height: 50px;
left: 0px;
top: 0px; 
float: left;
visibility: visible;
background: url(../imagens/logomarca.gif) no-repeat;
}

#logo h1 a {
float: left;
display: block;
top: 0px;
left: 0px;
width: 275px;
height: 50px;
cursor: pointer;
}

#logo h1 a span {display: none;}

/**************** Estilos do Menu ****************/

#menu {
position: relative;
/*float: left;*/
top: 45px;
margin: 0px 0px 0px 330px;
width: 505px;
height: 40px;
background: url(../imagens/menu.gif) no-repeat;
}	

#menu ul{list-style:none;}

#menu li{
   position: absolute;
   top:0px;
   height:40px;
} 

#menu li a{
   position: absolute;
   display:block;
   width:100%;
   height:100%;
   margin: 0px;
   cursor: pointer;
   text-decoration: none;
   font-size: 8px;
   color: #163F53;
   text-transform:uppercase;
   }

#menu li a span{
	position: absolute;
   display:block;
   width: 100%;
   height:100%;
   top:0;
}

#home{width:55px; left: 0px;}
#quem{width:119px; left:55px;}
#solucoes{width:98px; left:174px;}
#clientes{width:87px; left: 272px;}
#cases{width:73px; left: 359px;}
#contato{width:73px; left:432px;}

#home a span{background:url(../imagens/menu.gif) no-repeat 0 0;}
#quem a span{background:url(../imagens/menu.gif) no-repeat -55px 0;}
#solucoes a span{background:url(../imagens/menu.gif) no-repeat -174px 0;}
#clientes a span{background:url(../imagens/menu.gif) no-repeat -272px 0;}
#cases a span{background:url(../imagens/menu.gif) no-repeat -359px 0;}
#contato a span{background:url(../imagens/menu.gif) no-repeat -432px 0;}

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

#home a:hover span{background:url(../imagens/menu.gif) no-repeat 0 -40px;}
#quem a:hover span{background:url(../imagens/menu.gif) no-repeat -55px -40px;}
#solucoes a:hover span{background:url(../imagens/menu.gif) no-repeat -174px -40px;}
#clientes a:hover span{background:url(../imagens/menu.gif) no-repeat -272px -40px;}
#cases a:hover span{background:url(../imagens/menu.gif) no-repeat -359px -40px;}
#contato a:hover span{background:url(../imagens/menu.gif) no-repeat -432px -40px;}

/* ID BODY */
#bodyHome ul li a.menuHome span{background:url(../imagens/menu.gif) no-repeat 0 -40px;}
#bodyQuem ul li a.menuQuem span{background:url(../imagens/menu.gif) no-repeat -55px -40px;}
#bodySolucoes ul li a.menuSolucoes span{background:url(../imagens/menu.gif) no-repeat -174px -40px;}
#bodyClientes ul li a.menuClientes span{background:url(../imagens/menu.gif) no-repeat -272px -40px;}
#bodyCases ul li a.menuCases span{background:url(../imagens/menu.gif) no-repeat -359px -40px;}
#bodyContato ul li a.menuContato span{background:url(../imagens/menu.gif) no-repeat -432px -40px;}

#centroHome {
position: relative;
margin: auto;
width: 940px;
font-size:0.9em;
padding-bottom: 0px;
background: url(../imagens/sombra_coldir.jpg) no-repeat 287px 22px;
}	

#colunaEsquerdaHome{
margin: 0px;
width: 241px;
float: left;
margin: 0px;
padding: 45px 24px 0px 15px;
color: #9DDAF7;
font-size: 12px;
text-align: justify;
}

#colunaEsquerdaHome P{
position: relative;
margin: 0px;
width: 241px;
margin: 15px 0px 0px 0px ;
padding: 0px;
color: #9DDAF7;
font-size: 12px;
text-align: justify;
}

#iframedaHome h2{font-weight: bold; margin: 0px; padding: 0px; font-size: 13px;}

#colunaEsquerdaHome h2{font-weight: bold; margin: 0px; padding: 0px; font-size: 13px;}

#colunaEsquerdaHome ul{text-align: right; list-style: none; width: 170px; float: right; margin: 5px 0px 10px 0px;}
#colunaEsquerdaHome ul img{float: left; margin: 0px;}
#colunaEsquerdaHome ul li{display: inline;}
#colunaEsquerdaHome ul li a{
border: none;
text-decoration: none;
background: #1A4D68;
padding: 2px 5px 2px 5px;
color: #fff;
font-weight: bold;
font-size: 11px;
}

#colunaEsquerdaHome  a{
border: none;
text-decoration: none;
color: White;
padding: 2px 5px 2px 5px;
font-weight: bold;
font-size: 11px;
}

#colunaEsquerdaHome  ul li a:hover{text-decoration: none; border: none; color: #387A9C;}

/**************** Estilos da coluna direita ****************/

#colunaDireitaHome{
float: right;
margin: 0px;
padding: 42px 0px 0px 38px;
color: #ffffff;
font-size:12px;
width: 615px;
}

#colunaDireitaHome h2{
display:block;
margin:0 0 16px 0;
font-size:1.7em;
font-weight:normal;
letter-spacing:-1px;
color:#505050;
background-color:inherit;
}

#colunaDireitaHome #boxChamada{width:200px; float: left; margin: 0px 30px 10px 0px;}

#colunaDireitaHome h2 a{font-weight:normal;}
#colunaDireitaHome h3{margin:0 0 5px 0; font-size:1.4em; letter-spacing:-1px;}
#colunaDireitaHome a:hover{text-decoration:underline;}
#colunaDireitaHome ul {margin:0 5px 16px 35px;}

#colunaDireitaHome dl{margin:0px 0px 25px 0px; width: 191px; min-height: 180px;}
#colunaDireitaHome dt{margin-bottom:5px;}
#colunaDireitaHome dd{margin:0px 5px 10px 8px;}
#colunaDireitaHome dd a {text-decoration: none; color: White; font-weight: bold; font-size: 10px;}
#colunaDireitaHome dd a:hover {text-decoration: none; color:#CBE7EA;}
#colunaDireitaHome dd a img{border: none; text-decoration: none;}
#colunaDireitaHome dd.link{ text-align: right;}


/**************** Estilos das internas ****************/

#centro {
position: relative;
margin: auto;
width: 940px;
font-size:0.9em;
padding-bottom: 20px;
background: transparent;
}

#colunaEsquerda{
float: left;
margin: 0px;
width: 700px;
color: #ffffff;

}

#colunaEsquerda.quemsomos{background: url(../imagens/bg_quemsomos.gif) no-repeat 515px 105px;}
#colunaEsquerda.contato{background: url(../imagens/bg_contato.gif) no-repeat 450px 130px;}

#colunaEsquerda h2{
	position: relative;
	top: 0px;
	left: 0px;
	color: #fff;
	padding: 0px;
}

#colunaEsquerda h2 span {
float: left;
margin: 26px 0px 35px 0px;
text-indent: -999em;
}

#colunaEsquerda h2 span.tit_quem{
background: transparent url(../imagens/tit_quem.gif) no-repeat top;
width: 119px;
height: 15px;
}

#colunaEsquerda h2 span.tit_iso{
background: transparent url(../imagens/tit_iso.gif) no-repeat top;
width: 32px;
height: 22px;
}


#colunaEsquerda h2 span.tit_solucoes{
background: transparent url(../imagens/tit_solucoes.gif) no-repeat top;
margin-top: 22px;
width: 100px;
height: 22px;
}

#colunaEsquerda h2 span.tit_clientes{
background: transparent url(../imagens/tit_clientes.gif) no-repeat top;
width: 80px;
height: 15px;
}

#colunaEsquerda h2 span.tit_cases{
background: transparent url(../imagens/tit_cases.gif) no-repeat top;
width: 80px;
height: 15px;
}
	
#colunaEsquerda h2 span.tit_contato{
background: transparent url(../imagens/tit_contato.gif) no-repeat top;
width: 80px;
height: 15px;
}

#colunaEsquerda h3{
color: #FFF;
font-weight: bold;
text-transform: uppercase;
font-size:16px;
padding: 10px 0px 20px 0px;
clear: both;

}



#colunaEsquerda h4{
color: #FFF;
font-weight: bold;
font-size:13px;
padding: 10px 0px 10px 10px;
clear: both;
background-color:#316A87;
border-bottom: 1px solid #387898; 
}

#colunaEsquerda P{ margin: 4px 0px 15px 0px ; clear: both;  text-align: justify; line-height: 20px;}
#colunaEsquerda a{color: #9DDAF9; text-decoration: none;}
#colunaEsquerda a:hover{color: #173A50; text-decoration: underline;}

#colunaEsquerda .logoCases{border: 1px solid #97D8F6; padding: 3px; float: left; margin: 0px 0px 0px 5px; background-color: #2D6A87; width: 150px;}
#colunaEsquerda .logoCases:hover { border: 1px solid #ffffff; }


#colunaEsquerda .txtCases{float: right; margin: 0px 0px 20px 0px; padding: 0px; width: 525px; text-align: justify;}

#colunaEsquerda dl{margin: 0px; clear: both;}
#colunaEsquerda dt{font-weight: bold;}
#colunaEsquerda dd{margin: 0px}

#colunaEsquerda ul{margin: 0px 0px 0px 50px; list-style: url(../imagens/list.gif); /*width: 460px;*/ clear: both;}
#colunaEsquerda ul li{color: #B5EBFF; font-weight: bold; margin: 0px 0px 5px 0px;} 

/*************** Formulário contato *******************/

#colunaEsquerda fieldset {
padding: 0px;
margin: 0px;
width: 390px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
border: none;
}

#colunaEsquerda form {
width: 390px;
margin: 0px;
padding: 0px;
}

#colunaEsquerda label {
float:left;
color: #ffffff;
width: 100%;
font-size: 11px;
text-align:left;
margin-bottom: 4px;
}

#colunaEsquerda input, textarea, select{
border: 1px solid #4182A2;
width: 383px;
font-size: 11px;
color: #ffffff;
margin: 0px 0px 10px 0px;
padding: 3px;
clear: both;
background: #2A6C8C url(../imagens/bg_input.gif) repeat-x top left;
}

#colunaEsquerda input.ddd{width: 35px; margin-right: 10px; text-align: center;}
#colunaEsquerda input.fone{width: 325px;}
#colunaEsquerda textarea{height: 70px;}

#colunaEsquerda input.submit { 
background: url(../imagens/btn_enviar.gif);
width: 65px;
height: 25px;
float: right;
margin: 0px;
clear: both;
border: none;
cursor: pointer;
}

#colunaEsquerda input.submit:hover, .submit:active {
background: url(../imagens/btn_enviar.gif);
border:none;
}

#colunaDireita{
float: right;
margin: 62px 0px 0px 0px;
color: #44868F;
font-size:11px;
width: 175px;
padding: 0px;
}

#colunaDireita a{coloor: #44868F; font-weight: bold; text-decoration: none;}
#colunaDireita a img{border: none; text-decoration: none;}

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

#rodape{
position: relative;
margin: auto;
width: 940px;
height: 50px;
padding: 20px 0px 0px 5px;
clear: both;
font-size:11px;
color: #9DDAF9;
border-top: 1px solid #4587A7;
}	

#rodape ul {
margin: 10px 0 10px 175px;
list-style: none;
text-align: left;
}
#rodape ul li {display: inline; margin: auto; color: #fff;}	
#rodape ul li a {width: auto; color: #fff; text-decoration:none}
#rodape ul li a:hover {width: auto; color: #83CFD9; text-decoration:none}

#rodape img.redegestao{float: right; margin: -40px 30px 0px 0px;}
#rodape img.redegestao a{border: none; text-decoration: none;}
#rodape img.redegestao a:hover{border: none; text-decoration: none;}

#rodape .assinatura{float: right; margin: 10px 30px 0px 0px;}

 /*CLASSES E ESTILOS DIVERSOS*/
 
.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 */  
 
 .box{
margin: 20px 0 20px 0;
padding:5px 10px 10px 10px ;
border:1px solid #4182A2;
color:#505050;
line-height:1.5em;
background: #2A6C8C;

}
.splitcontentleft{float:left; width:48%;}
.splitcontentright{float:right; width:48%;}
.clear{clear:both;}
.small{font-size:0.8em;}
.hide{display:none;}
.textcenter{text-align:center;}
.textright{text-align:right;}

.important{color:#f02025; background-color:inherit; font-weight:bold;}