/**
* Layout padrão para: Nome do Site
*
* Esse estilo irá definir a estrutura, e componentes gerais do site.
*
* @project Nome do Site
* @version 1.0
* @package layout
* @author Camila Tigre
* @copyright Camila Tigre
* @fontdef font-family:;
* 
*/

/*------------------
* @section RESET 
-------------------*/
html, body, form, fieldset {margin: 0;padding:0;font:100%/120%  Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {margin:0;padding:0;word-spacing:0;}
li, dd, blockquote {margin-left:0;}
form label {cursor:pointer;}
fieldset {border:none;}
input, select, textarea {font-size:100%;font-family:inherit;}
img{border:0;}
a{font-size:12px;color:#8a8a8a;text-decoration:none;line-height:1.3em;text-align:justify;}
a:hover{text-decoration:underline;}
header,nav,section,article,aside,footer,hgroup {display: block;}
/*------------------
* @section LAYOUT 
-------------------*/
/*--------------------------------------------
* @subsection GERAL: REGRAS DE FORMATAÇÃO
----------------------------------------------*/
body,html {width:100%;font-family:Arial, Helvetica, sans-serif;background:url(../img/bg.png);font-smooth:12em;}
.containerPage {width:980px;height:auto;margin:0 auto;position:relative;}
input, textarea {font-size:12px;color:#000;border:0;background-repeat:no-repeat;}
label {font-size:10px;color:#787878;}
p{font-size:12px;color:#8a8a8a;line-height:1.3em;text-align:justify;margin-bottom:15px;}
li{font-size:12px;color:#8a8a8a;line-height:1.3em;text-align:justify;list-style-position:inside;}
/*--------------------------------------------
* @subsection GERAL: REGRAS DE ESTRUTURA
----------------------------------------------*/
.title {width:100%;height:23px;float:left;background:url(../img/bg_linhas_do_titulo.png) center;position:relative;margin:20px 0;}
.title .texto {width:auto;height:23px;background-color:#fff;position:absolute;left:0;display:block;padding:0 15px 0 0;}
.title .texto h2 {float:left;color:#008b0d;font-size:26px;text-transform:capitalize;font-family: 'caviar_dreamsregular';}

#header {width:980px;margin:0 auto;position:relative;}
#header .logo {width:257px;height:61px;float:left;margin:20px 0;}
#header .fone, #header .email {width:622px;float:left;background-position:right;background-repeat:no-repeat;padding:0 30px 0 0px;text-align:right;margin:0 10px 0 0;color:#656565;}
#header .fone  {background-image:url(../img/icon_phone.png);margin:35px 0 5px 0;}
#header .email {background-image:url(../img/icon_mail.png);}
#header .leftSombra {width:258px;height:101px;background:url(../img/sombra_lateral_esquerda.png) no-repeat right top;padding:0 30px 0 0;}
#header .rightSombra {width:692px;height:101px;float:right;background:url(../img/sombra_lateral_direita.png) no-repeat right top;position:absolute;right:0;top:0;}

#bgBanner {width:100%;height:295px;float:left;background:url(../img/bg_banner.jpg) top center;}
#menuBanner   {width:980px;margin:0 auto;position:relative;}
#menuBanner .leftSombra {width:258px;height:295px;background:url(../img/sombra_lateral_esquerda.png) no-repeat right top;padding:0 30px 0 0;}
#menuBanner .rightSombra {width:692px;height:295px;float:right;background:url(../img/sombra_lateral_direita.png) no-repeat right top;position:absolute;right:0;top:0;}

#menu {float:left;margin:15px 0 0 0;}
#menu li {width:243px;float:left;list-style:none;background:url(../img/seta_menu.png) no-repeat;border-bottom:dotted #fff 1px;padding:0 0 12px 15px;margin:0px 0 14px 0;}
#menu li h3, #menu li a {color:#fff;font-size:14px;text-transform:uppercase;font-weight:normal;}

#menuBanner .banner {width:672px;min-height:295px;float:left;background:url(../img/de_baixo_do_banner.png) center bottom no-repeat;padding:0 0 13px 0;}

#bgFooter {width:100%;float:left;}
#footer {width:980px;height:27px;margin:0 auto;background:#f3f3f3;padding:13px 0px 0 0px;}
#footer p            {float:left;margin:0 0 0 20px;}
#footer .recifesites {float:right;margin:0 20px 0 0px;}
/*-------------------------------
* @subsection PAGINA INICIAL 
---------------------------------*/
/*
*
* @deletar
* Aqui toda a estrutura e formatação especifica da primeira página.
* este comentario pode ser deletado
*
*/
#conteudo {width:980px;height:auto;margin:0 auto;}
#conteudo .leftSombra, #conteudo .rightSombra {min-height:523px;background-position:0 -356px;background-repeat:no-repeat;}
#conteudo .leftSombra {width:20px;float:left;background-image:url(../img/sombra_lateral_esquerda.png);margin:0 0 0 10px;}
#conteudo .rightSombra {width:20px;float:right;background-image:url(../img/sombra_lateral_direita.png);position:absolute;right:0;top:295px;}
#conteudo .right {width:632px;float:left;margin:0 0 0 20px;}

#conteudo .noticias {width:258px;float:left;}
#conteudo .noticias li{width:258px;float:left;list-style:none;border-bottom:#8a8a8a solid 1px;padding:0 0 15px 0;margin:0 0 50px 0;}
#conteudo .noticias .data {background:#008b0d;padding:2px 5px;color:#fff;text-align:center;}
#conteudo .noticias a {width:258px;float:left;margin:10px 0 0 0;}


#conteudo .right img {margin:0 20px 0 0;}
#conteudo .right .servicos {width:310px;float:left;}
#conteudo .right .produtos {width:310px;float:right;}
#conteudo .right .linha {width:1px;min-height:100px;float:left;margin:20px 0px;border-right:1px solid #8a8a8a;}

#conteudo .right li  {width:270px;height:24px;float:left;list-style:none;margin:0 0 15px 0;}
#conteudo .right li a{width:270px;height:24px;float:left;background:url(../img/Button_on.png);padding:10px 0 0 40px;color:#000;}
#conteudo .right li a:hover {width:270px;height:24px;float:left;background:url(../img/Button_hover.png);text-decoration:none;}
/*-------------------------------
* @subsection PAGINAS INTERNAS
---------------------------------*/
/*
*
* @deletar
* Aqui toda a estrutura e formatação especifica em comum com todas 
* as paginas internas.
*
*/
#conteudoInterno {width:980px;height:auto;margin:0 auto;}
#conteudoInterno .leftSombra, #conteudoInterno .rightSombra {min-height:463px;background-position:0 -416px;background-repeat:no-repeat;}
#conteudoInterno .leftSombra {width:20px;float:left;background-image:url(../img/sombra_lateral_esquerda.png);margin:0 0 0 10px;}
#conteudoInterno .rightSombra {width:20px;float:right;background-image:url(../img/sombra_lateral_direita.png);position:absolute;right:0;top:295px;}
#conteudoInterno .voltar {width:80px;padding:3px 0px;display:block; margin: 0px 0px 15px 0px;text-align:center;background-color:#008b0d;color:#fff;text-transform:uppercase;}
#conteudoInterno .voltar:hover {background-color:#2c9736;text-decoration:none;}

#conteudoInterno .left    {width:258px;float:left;}
#conteudoInterno .left li {width:258px;float:left;list-style:url(../img/app.png) inside;margin:0 0 5px 0;}
#conteudoInterno .left p  {margin:0px 0 0 0;}

#conteudoInterno .right {width:632px;float:left;margin:0 0 0 20px;}

/*---------------------------
* @subsection EMPRESA
----------------------------*/
#empresa a {color:#008b0d;} 
/*-----------------------------------
* @subsection SERVIÇOS | PRODUTOS 
-------------------------------------*/
#servProd hgroup{width:348px;float:left;margin:0 0 0 20px;}
#servProd h1 {color:#434343;font-size:18px;font-weight:bold;margin:0 0 10px 0;}
/*--------------------------
* @subsection NOTICIAS 
----------------------------*/
#noticias {width:632px;float:left;}
#noticias .leftNews {width:306px;float:left;}#noticias .rightNews {width:306px;float:right;}
#noticias li{width:306px;float:left;list-style:none;border-bottom:#8a8a8a solid 1px;padding:0 0 15px 0;margin:0 0 25px 0;}
#noticias .data {background:#008b0d;padding:2px 5px;color:#fff;text-align:center;font-size:12px;}
#noticias a {width:306px;float:left;margin:10px 0 0 0;}
#noticias h1 {width:632px;float:left;font-size:18px;color:#474747;font-weight:bold;margin:10px 0;}
#noticias .foto {margin: 0px 10px 10px 0px;}
/*-------------------------------
* @subsection FORMULARIOS 
---------------------------------*/
#form {width:632px;float:left;}
#form input {width:299px;height:32px;float:left;margin:0 0 20px 0;padding:0 10px 0 5px;padding-top:7px\9;background:#f8f8f8;border:1px solid #ccc;color:#8a8a8a;}
#form .left {width:306px;float:left;}
#form .right {width:306px;float:right;}
#form .msg   {width:284px;height:121px;background:#f8f8f8;border:1px solid #ccc;color:#8a8a8a;padding:10px;overflow:auto;resize:none;}

#form .submit {width:80px;height:25px;padding:0px 0px;display:block;text-align:center;background-color:#008b0d;color:#fff;text-transform:uppercase;border:0;cursor:pointer;}
#form .submit:hover {background-color:#2c9736;text-decoration:none;}

/*---------------------------------------
* @subpackage CSS PARA JS: TOOLTIP 
----------------------------------------*/
/*
*
* @css-for para submenu
*
*/
.bubbleInfo {position: relative;}
/*HACK CHROME e SAFARI*/
@media screen and (-webkit-min-device-pixel-ratio:0)
{
	.popup { 
		position: absolute ;
		display: none; 
		z-index:99;
		width:1px;
		height:1px; 
	}
}
/*HACK MOZILA*/
.popup, x:-moz-any-link, x:default {
position: absolute ;
display: none;
z-index:99;
width:1px;
height:1px;
}
/*HACK OPERA*/
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
       .popup { 
		position: absolute ;
		display: none; 
		z-index:99;
		width:1px;
		height:1px; 
	}
 }

/* IE*/
.popup  {
position: absolute ;
display: none; /* keeps the popup hidden if no JS available */
z-index:99;
}
/*
* Serviços / Produtos
*/
.setinha {position:absolute;left:-8px;top:40px;}
.conteudo_tt {position:relative;margin:160px 0 0 140px;}
.conteudo_tt2 {position:relative;margin:200px 0 0 140px;}
.ctt .ctt_topo, .ctt .ctt_miolo, .ctt .ctt_pe {width:174px;display:table; }
.ctt .ctt_topo  {height:29px;background:url(../img/menu/tooltip_topo.png);}
.ctt .ctt_miolo {background:url(../img/menu/tooltip_miolo.png); text-align: left;}
.ctt .ctt_pe    {height:39px;background:url(../img/menu/tooltip_base.png);}

.conteudo_tt a, .conteudo_tt2 a {width:auto;height:auto;display:block;color:#008b0d;font-size:12px;padding:2px 5px;margin:0 20px 5px 20px; text-align: left;}
.conteudo_tt a:hover, .conteudo_tt2 a:hover {color:#fff;background-color:#008b0d;text-decoration:none;}

/*---------------------------------------
* @subpackage CSS PARA JS: JCAROUSEL 
----------------------------------------*/
/*
*
* @css-for para produtos home
*
*/
.jcarousel-skin-tango .jcarousel-container {width:310px;height:196px;float:left;}
.jcarousel-skin-tango .jcarousel-direction-rtl {direction:rtl;}
.jcarousel-skin-tango .jcarousel-container-vertical {width:310px;height:196px;}
.jcarousel-skin-tango .jcarousel-clip {overflow:hidden;}
.jcarousel-skin-tango .jcarousel-clip-vertical {width:310px;height:156px;}
.jcarousel-skin-tango .jcarousel-item {width:270px;height:24px;}
.jcarousel-skin-tango .jcarousel-item-vertical {margin-bottom:15px;}
/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {position:absolute;bottom:0px;right:0;width:24px;height:24px;cursor:pointer;background: transparent url(../img/next-vertical.png) no-repeat 0 0;}
.jcarousel-skin-tango .jcarousel-next-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-vertical:focus {background-position:0 0px;}
.jcarousel-skin-tango .jcarousel-next-vertical:active {background-position: 0 0px;}
.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {cursor: default;background-position: 0 0px;}

.jcarousel-skin-tango .jcarousel-prev-vertical {position:absolute;bottom:0px;right:29px;width:24px;height:24px;cursor:pointer;background:transparent url(../img/prev-vertical.png) no-repeat 0 0;}
.jcarousel-skin-tango .jcarousel-prev-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-vertical:focus  {background-position: 0 0px;}
.jcarousel-skin-tango .jcarousel-prev-vertical:active {background-position: 0 0px;}
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {cursor: default;background-position: 0 0px;}

/*---------------------------------------
* @subpackage CSS PARA JS: SERVPROD 
----------------------------------------*/
/*
*
* @css-for para produtos/ SErvicos
*
*/
#mycarousel2 img {width:244px;height:140px;float:left;border:0;background-color:#b4b4b4;}
.jcarousel-skin-tango2 .jcarousel-container {width:264px;height:159px;float:left;background:url(../img/bgcarousel.png);-moz-box-shadow: 0 0 5px #888;-webkit-box-shadow: 0 0 5px#888;box-shadow: 0 0 5px #888;padding:0px 0 0 0;}
.jcarousel-skin-tango2 .jcarousel-direction-rtl {direction:rtl;}
.jcarousel-skin-tango2 .jcarousel-container-vertical {width:264px;height:159px;}
.jcarousel-skin-tango2 .jcarousel-clip {overflow:hidden;}
.jcarousel-skin-tango2 .jcarousel-clip-vertical {width:244px;height:140px;margin:10px 10px 0 10px;}
.jcarousel-skin-tango2 .jcarousel-item {width:244px;height:140px;}
.jcarousel-skin-tango2 .jcarousel-item-vertical {margin-bottom:20px;}
/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango2 .jcarousel-next-vertical {position:absolute;bottom:-40px;left:29px;width:24px;height:24px;cursor:pointer;background: transparent url(../img/next-vertical.png) no-repeat 0 0;}
.jcarousel-skin-tango2 .jcarousel-next-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-next-vertical:focus {background-position:0 0px;}
.jcarousel-skin-tango2 .jcarousel-next-vertical:active {background-position: 0 0px;}
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical:focus,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical:active {cursor: default;background-position: 0 0px;}

.jcarousel-skin-tango2 .jcarousel-prev-vertical {position:absolute;bottom:-40px;left:0px;width:24px;height:24px;cursor:pointer;background:transparent url(../img/prev-vertical.png) no-repeat 0 0;}
.jcarousel-skin-tango2 .jcarousel-prev-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-prev-vertical:focus  {background-position: 0 0px;}
.jcarousel-skin-tango2 .jcarousel-prev-vertical:active {background-position: 0 0px;}
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical:focus,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical:active {cursor: default;background-position: 0 0px;}