/* Padronizando propriedades pros navegadores ficarem parecidos e corrigindo alguns bugs */
* { margin: 0; padding: 0; outline: 0;
 font-weight: inherit; font-style: inherit;
 font-size: 100%; font-family: inherit;
 /*line-height: 1.1em; vertical-align: baseline; outline: none; */} /* zerando os valores de todas as tags html */
p { margin-bottom: 0.5em; }
hr { clear: both; float: none; width: 100%; }
* html body hr { margin: -7px; display: block; }  /* os hr tem uma altura extra misteriosa no IE */
a, img { border: none; }
/*img { vertical-align: middle; }*/
fieldset { display: block; border: 2px ridge #FFF; padding: 10px; } /* fieldset não é block em todos */
ul, ol { /* margin-left: 1.5em; */ list-style-position: outside; }
li { vertical-align: top; line-height: 1.2em; list-style: none; }  /* IE: posição vertical do marcador no IE  e espaço extra fantasma em li's */
li a { zoom: 1; line-height: 1.2em; }  /* complemento do anterior */
input[type=hidden]{ display: none !important; visibility: hidden !important; } /* input hidden no FF */
button { border: 1px outset #AAA; }
legend { margin-bottom: 1.4em; } /* Fixes incorrect styling of legend in IE6 fieldsets. */
/*label { display: block; }*/
/*table { border-collapse: separate; border-spacing: 0; }*/
caption, th, thead, tfoot { text-align: center; font-weight: bold; }
blockquote:before, blockquote:after,q:before, q:after { content: “”; }
blockquote, q { quotes: "" ""; }
pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap !important; /* FF 1999 */
 white-space: -pre-wrap; /* OP 4-6 */ white-space: -o-pre-wrap; /* OP 7 */  word-wrap: break-word; /* IE 5.5+ */ }
h1 { font-size: 250%; font-weight: normal; }
h2 { font-size: 200%; font-weight: normal; }
h3 { font-size: 150%; font-weight: normal; }
h4 { font-size: 120%; font-weight: normal; }
h5 { font-size: 110%; font-weight: normal; }
h6 { font-size: 100%; font-weight: bold; }

/* classes úteis de posicionamento */
.top { margin-top: 0; vertical-align: top; vertical-align: top; }
.bottom { margin-bottom: 0; vertical-align: baseline;  vertical-align: bottom; }
.left { margin-left: 0; float: left; }
.right { margin-right: 0; float: right; }
.center { margin: auto; vertical-align: middle; }
.first { margin-top: 0; margin-left: 0; vertical-align: top; }
.last { margin-bottom: 0; margin-right: 0; vertical-align: bottom; }
.lastVert { margin-right: 0 !important; padding-right: 0 !important; border-right: none !important; }

/* classes úteis na formatação */
.screenreader { display: none; }
.ak { text-decoration: underline; /* access keys */ }
.u { text-decoration: underline; /* textos underline */ }
.notice { background-color: #F9FF9A; /*yellow*/ }
.error { background-color: #FF8E8E; /*red*/ }
.highlight  { background:#ff0; }
.hrDiv {margin: 10px 0; border-color: #ccc;}

/* clear float */
.clear { display: inline-block; }
.clear:after, .container:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clear { display: block; zoom: 1; }
.divClear {clear: both; height:0; font-size:0; line-height:0; }

/* debug */
.debug {	border: 1px dashed red; }

/* anuladores */
.mNone { margin: 0 !important; }
.mLeftNone { margin-left: 0 !important; }
.mRightNone { margin-right: 0 !important; }
.floatRight { float: right !important; }
.floatLeft { float: left !important; }
.floatNone { float: none !important; } 
.pLeftNone { padding-left: 0 !important; }
.pRightNone { padding-right: 0 !important; }

.taLeft { text-align: left !important; }
.taRight { text-align: right !important; }
.bNone { border: none !important; }
.dNone { display: none  !important; }
.bgNone { background: none !important; }

/*
 Menus drop-down horizontal-vertical (hv) e vertical-vertical (vv) até 4 níveis
 by Micox - elmicox.blogspot.com - Ver. 2.0 - 20/02/08 - Creative Commons License
*/
.menu-hv, .menu-vv { position: relative; margin: 0; padding: 0; /* display: block; */ zoom: 1; z-index:500; margin:3px 3px 0;}
.menu-hv * , .menu-vv * { margin: 0; padding: 0 ; list-style: none}
.menu-hv li , .menu-vv li { position: relative; line-height: 1.2em; vertical-align: top }
.menu-hv a , .menu-vv a { display: block; zoom: 1; line-height: 1.2em }
.menu-hv li ul, .menu-vv li ul { position: absolute; visibility: hidden; right: 0; }
.menu-hv li:hover ul, .menu-vv li:hover ul, .menu-hv li.hover ul, .menu-vv li.hover ul { visibility: visible; }
.menu-hv li:hover ul ul, .menu-vv li:hover ul ul, .menu-hv li.hover ul ul, .menu-vv li.hover ul ul { visibility: hidden; background: red; }
.menu-hv li li:hover ul, .menu-vv li li:hover ul, .menu-hv li li.hover ul, .menu-vv li li.hover ul { visibility: visible }
.menu-hv li li:hover ul ul, .menu-vv li li:hover ul ul, .menu-hv li li.hover ul ul, .menu-vv li li.hover ul ul { visibility: hidden }
.menu-hv li li li:hover ul, .menu-vv li li li:hover ul, .menu-hv li li li.hover ul, .menu-vv li li li.hover ul { visibility: visible }
/* características horizontal-vertical e caracteristica de layout/skin */
.menu-hv:after, .menu-hv.after { content: "."; line-height: 0px; clear: both; display: block; visibility: hidden}
.menu-hv li { float: left; }
.menu-hv li ul { background: #fdfdfd url(../images/bg_dropDown.png) repeat-x left top; width: 160px;}
.menu-hv li ul li { float: none; color: #333; height: 21px; line-height: 21px}
.menu-hv li ul li a{ background: transparent url(../images/bg_linhaPontilhada.png) repeat-x left bottom; color: #333; display: block; font-size: 11px; height: 21px; line-height: 21px }
.menu-hv li ul li a:hover{ background: #d4d4d4 url(../images/bg_linhaPontilhada.png) repeat-x left bottom; color: #333;}
.menu-hv li ul li ul { position: absolute; left: 100%; top: 30px; }
/* características vertical-vertical */
.menu-vv { float: left; }
.menu-vv li ul { left: 100%; top: 0; }
/* ****************************************
ALTERE ABAIXO. defina a largura, cor, formatações, etc, dos itens do seu menu abaixo
ou apague as linhas se for definir em outro lugar
*/
/*
.menu-hv li { }
.menu-vv li {  }
.menu-hv li a:hover {  }
.menu-vv li a:hover {  } */
/* ****************************************
  Configuração de Estilo do menuNavHv */
.menu-hv {background: url(../images/bg_menuUL.png) repeat-x;}
ul.menuNavHv { font: normal 12px Arial, Helvetica, sans-serif; color: #252525; }
ul.menuNavHv li { /* height: 25px; */ height: 32px; }
ul.menuNavHv li a { color: #fff;  padding:  0 15px; font-weight: normal; text-decoration: none; line-height: 32px; #display:inline; }
ul.menuNavHv li a:hover { color: #252525; background: #f6f6f6 url(../images/bg_menuHover.png) repeat-x;  text-decoration: none; }

.menuNavHv li ul.lastNivel { }
.menuNavHv li ul.lastNivel li a { font-weight: normal; background: none; visibility: hidden; background: red; }
.menuNavHv li ul.lastNivel li a:hover { background-color: #f6f6f6;  text-decoration: none; visibility: visible; background: red; color: #f4161e;}

/* **************************************** */

/* styles html */
body { background: #000 url(../images/bg_body.png) repeat-x left top; }
.containerGeral { background: #fff; width: 980px; margin:0 auto; vertical-align: middle; /* padding: 5px; */}

.containerHeader { background: url(../images/bg_header.gif) repeat-x left top; height: 164px; width: 100%; position: relative; }
.topo { position:relative; float: right; margin-right:20px; margin-top:5px; }
.img_televendas { position: absolute; top:90px; left: -20px; }

.containerMenuNavHeader {background: url(../images/bg_barraUser.png) repeat-x; height: 30px; position: relative; width:100%;}

.nomeUser {	font: bold 12px arial; color: #f9f171; margin-left: 20px; line-height: 30px; float: left;}
.bt_sair {background: url(../images/bg_bt_sair.png); width: 40px; height: 20px; margin-left: 10px; color: #333; text-decoration: none; font: bold 11px arial; display:inline-block; text-align: center; line-height: 20px; }

ul.menuNavHeader {height: 30px; float: right; }
ul.menuNavHeader li { height: 30px; float: left; line-height: 30px; }
ul.menuNavHeader li a { background: url(../images/sprite_iconsUser.png) no-repeat; padding-left: 18px; padding-right:30px; color: #fff; font: normal 12px Arial, Helvetica, sans-serif; line-height: 24px; text-decoration: none; }
ul.menuNavHeader li a:hover { color: #ffce08; text-decoration: none;}
ul.menuNavHeader li a.pedidos {	background-position: 0 0;}
ul.menuNavHeader li a:hover.pedidos {	background-position: 0 -50px;}
ul.menuNavHeader li a.carrinho { background-position: -1px -18px;}
ul.menuNavHeader li a:hover.carrinho { background-position: -1px -68px;}
ul.menuNavHeader li a.finalizar { background-position: 0 -33px;}
ul.menuNavHeader li a:hover.finalizar { background-position: 0 -83px;}
ul.menuNavHeader li a.user { background-position: 0 -100px;}
ul.menuNavHeader li a:hover.user { background-position: 0 -117px;}

.containerBuscaCart { background: url(../images/bg_BuscaCart.png) repeat-x; height:63px; margin-top: 5px; padding:0 10px; }
.formBusca { /* height: 25px; */  z-index: 5; position: relative; margin-top: 110px; margin-right: 15px; display:block;line-height: 1.2em}
.formBusca input, .formBusca span { vertical-align: middle; padding-top:3px;}
.formBusca label { color: #000; font: bold 12px arial, helvetica, clean, sans-serif; display: inline; height: 25px; line-height: 25px; }
.inputBusca { background: url(../images/bg_inputBusca.png) no-repeat; padding-left: 6px; width: 242px; height: 25px; border: none; font: normal 12px arial, helvetica, clean, sans-serif; margin-left: 5px; color: #4c4c4c; line-height: 24px;}
.btBusca {background: url(../images/bt_buscaOK.png) no-repeat; width: 44px; height: 25px; border: none; margin-left:5px; line-height: 25px;}
a.buscaAvanc { background: url(../images/arrow04.png) no-repeat 0 4px; font: bold 11px  Arial, Helvetica, sans-serif; color: #fff; text-decoration: none; padding-left: 10px; margin-left: 50px; /* display: block; */ }
a:hover.buscaAvanc { color: #ffce08; }

.containerBreadCrumb {background: url(../images/bg_breadCrumb.png) repeat-x; min-height: 38px; padding-left:15px;  margin: 1px 3px 0px 3px;}
.containerBreadCrumb a{color: #505050; text-decoration: none; font: bold 11px Arial, Helvetica, sans-serif; background: url(../images/arrow05.png) no-repeat left 6px; padding-left:  10px; margin-right: 3px; line-height: 38px;}
.containerBreadCrumb a:hover{color: #efbf00; text-decoration: none;}

.containerAbaVitrine {}
ul.abaVitrine { background: url(../images/bg_abaVitrine.png) repeat-x left bottom; }
ul.abaVitrine li { float: left; background: url(../images/img_divAbaVitrine.png) no-repeat right top; font: bold 14px  Arial, Helvetica, sans-serif; }
ul.abaVitrine li a{ float: left; height: 37px; padding-right: 37px; color: #939393; text-decoration: none; line-height: 37px;}
ul.abaVitrine li a:hover{ color: #3c3c3c; }

.containerCart {float: right; margin-top: 10px; font-family: Arial, Helvetica, sans-serif; /* width: 335px; */}
.contentLogin {float:left; text-align: right; margin-right: 10px; background: url(../images/img_separadorCart.png) no-repeat right -5px; padding-right: 30px; height: 50px;}
.contentLogin p {font-size: 12px; font-weight: bold;}
a.bt_logOut {color: #fff; background: url(../images/bt_logOut.png) no-repeat; width: 45px; height: 19px; text-decoration: none; 
font: bold 11px  Arial, Helvetica, sans-serif; display: block; text-align: center; float: right; line-height: 19px;}
a:active.bt_logOut {margin: 1px 1px 0 0;}
a:hover.bt_logOut {color: #FFEF94;}

.yourCart {float: right; background: url(../images/img_sacolaFla.png) no-repeat 0 5px; padding-left: 45px;}
.yourCart p {color:#ee091a; font-size: 11px; font-weight: bold;}
.valueCart span{color: #333; font: normal 18px Arial, Helvetica, sans-serif; margin-right: 5px;}

a.bt_cinzaPequeno, a.bt_cinzaMedio, a.bt_cinzaGrande { background: url(../images/sprite_buttonsCinza.gif) no-repeat; height: 35px; color: #333; display: block; text-decoration: none; text-align: center; font: bold 12px Arial, Helvetica, sans-serif; margin-right: 15px; line-height: 35px;}
a:hover.bt_cinzaPequeno, a:hover.bt_cinzaMedio, a:hover.bt_cinzaGrande {color: red;}
a.bt_cinzaPequeno { background-position: left -70px; width: 107px; }
a.bt_cinzaMedio { background-position: left -35px; width: 132px; }
a.bt_cinzaGrande { background-position: left top; width: 180px; }

a.bt_pretoPequeno, a.bt_pretoMedio, a.bt_pretoGrande { background: url(../images/sprite_buttonsPreto.gif) no-repeat; height: 35px; color: #fff; display: block; text-decoration: none; text-align: center; font: bold 12px Arial, Helvetica, sans-serif; margin-right: 15px; line-height: 35px;}
a:hover.bt_pretoPequeno, a:hover.bt_pretoMedio, a:hover.bt_pretoGrande {color: #FFEF94;}
a.bt_pretoPequeno { background-position: left -70px; width: 107px; }
a.bt_pretoMedio { background-position: left -35px; width: 132px; }
a.bt_pretoGrande { background-position: left top; width: 180px; }

a.bt_vermPequeno, a.bt_vermMedio, a.bt_vermGrande { background: url(../images/sprite_buttonsVerm.gif) no-repeat; height: 35px; color: #333; display: block; text-decoration: none; text-align: center; font: bold 12px Arial, Helvetica, sans-serif; margin-right: 15px; line-height: 35px;}
a:hover.bt_vermPequeno, a:hover.bt_vermMedio, a:hover.bt_vermGrande {color: #FFEF94;}
a.bt_vermPequeno { background-position: left -70px; width: 107px; }
a.bt_vermMedio { background-position: left -35px; width: 132px; }
a.bt_vermGrande { background-position: left top; width: 180px; }

.containerTwitter {background: url(../images/bg_twitter.gif) no-repeat 0 0; width: 655px; height: 99px; position: relative; text-align: right; margin: 20px auto;}
h3.lastTwitt {font: normal 22px Arial, Helvetica, sans-serif; color: #333; letter-spacing: -1px; font-style: italic; position: relative; top:10px; right: -55px; width:570px}
h3.lastTwitt a{ color: orange; text-decoration: none;}
h3.lastTwitt a:hover{ color: #333; text-decoration: none;}
a.linkFollow {font: bold 12px Arial, Helvetica, sans-serif; color: red; text-decoration: none; position: absolute; right: 0; bottom: 0; margin: 0 30px -10px 0;}
a.linkFollow:hover {color: #333; text-decoration: none;}

.containerVitrine {	padding: 20px;}
.boxProd {width: 140px; text-align: center; }
.infoProd {font: normal 11px arial; color: #333;}
.infoProd p strong{font-weight: bolder;}
.infoProd p strong.preco{color: #f9bb00; }

.contentVisuProd {padding: 20px; }
h2.nomeProdVisu { color: #333; font: bold 20px Arial, Helvetica, sans-serif; margin-bottom: 25px; }
.cliqueAmp {font: bold 10px Arial, Helvetica, sans-serif; color: #333;}
.infoProdVisu {border-left: 1px solid #ccc; padding-left: 20px; margin-left: 20px; height: 140px; }
.infoProdVisu span{color: red; font-size: 16px;}
.infoProdVisu p{ color: #333; font: bold 12px Arial, Helvetica, sans-serif; font: bold 12px Arial, Helvetica, sans-serif; }
.tabelaInfoProd {border: 1px solid #000; margin-top: 30px; border-collapse: collapse;}
.tabelaInfoProd td{border: 1px solid #000; padding: 5px; }

.containerLojas {background: url(../images/bg_lojas.png) repeat-x; height: 93px;}
.boxLojas {float: left;}
.infoEnderecos {float: left;}
.infoEnderecos span{display: block; color: #fff; font: bold 12px arial; }

.containerRodape { background: #000 url(../images/bg_rodape.png) repeat-x left top; height: 300px; padding: 35px 0 0 40px; }
.containerRodape h3{ font: bold 16px Arial, Helvetica, sans-serif; color: #fff; text-transform: uppercase; }

.boxRodape { height: 135px; }
.colunaRodape { float: left; border-right: 1px solid #5d5d5d; padding-right: 35px; margin-right: 35px; position: relative; }

.textoFormaPag { font: normal 11px Arial, Helvetica, sans-serif; color: #fff; margin-top:6px; }

.bg_santos { background: url(../images/bg_sempresantos.png) no-repeat center 90px; }

.containerSteps {margin-bottom: 15px; border: 1px solid #666; border-top: none; border-bottom: none; width: 928px; margin-left:auto;margin-right:auto;margin-top:15px }
a.stepsCheckout {background: url(../images/img_divSteps.png) no-repeat right top; height: 30px; line-height: 30px; color: #333;
border: 1px solid #666; border-right: none; border-left: none; text-align: center; width: 217px;
float: left; display: block; padding-right: 15px; text-decoration: none; font: bold 12px Arial, Helvetica, sans-serif;  line-height: 30px;  }
a:hover.stepsCheckout { height: 30px; line-height: 30px; color: #FFA500; }
a.ative { height: 30px; line-height: 30px; color: #FFA500; }

.class_hr {border: 1px solid #ccc; margin: 10px 0;}

.boxItemCheckout {border: 1px solid #666; border-bottom: 3px solid #666; margin-top: 40px; margin-bottom: 50px; position: relative; padding: 15px;}
.boxItemCheckout h3{color:#333; position:relative; top:-20px; font-weight: bold; font-size: 16px; position: absolute; font-family: Arial, Helvetica, sans-serif;}
.sub-titleH3 {background: url(../images/arrow04.png) no-repeat 0 5px; padding-left: 10px; color: #333; font:  normal 12px Arial, Helvetica, sans-serif }
.infoEndereco {font: normal 12px Arial, Helvetica, sans-serif; line-height: 16px;}
.infoEndereco strong {font-weight: bold;}

ul.navRodapeList { margin-top: 6px; }
ul.navRodapeList li { background: url(../images/arrow01.png) no-repeat 0 8px; padding-left: 12px; font: normal 12px Arial, Helvetica, sans-serif; line-height: 20px; }
ul.navRodapeList li a { text-decoration: none; color: #fff; }
ul.navRodapeList li a:hover { color: #fbd637; }

ul.navSocialMedia { margin-top: 6px; width: 400px; }
ul.navSocialMedia li { background: url(../images/sprite_socialMedia.png) no-repeat; height: 30px; padding-left: 40px; float: left; font: normal 12px Arial, Helvetica, sans-serif; margin-bottom: 25px; }
ul.navSocialMedia li strong { font-weight: bold; }
ul.navSocialMedia li a { text-decoration: none; color: #fff; }
ul.navSocialMedia li a:hover { color: #fbd637; }
ul.navSocialMedia li.twitter { background-position: 0 0; margin-right: 70px; }
ul.navSocialMedia li.orkut { background-position: 0 -60px; }
ul.navSocialMedia li.facebook { background-position: 0 -30px; }

ul.navTelevendas { margin-top: 6px; }
ul.navTelevendas li { background: url(../images/sprite_televendas.png) no-repeat; padding-left: 22px; font: normal 12px Arial, Helvetica, sans-serif; line-height: 20px; color: #fff; height: 17px; margin-bottom:8px; }
ul.navTelevendas li.tel { background-position: -2px  2px; }
ul.navTelevendas li.mail { background-position: 0  -13px; }
ul.navTelevendas li.hora { background-position: 0  -28px; }

.containerCredito { background:url(../images/bg_credito.png) repeat-x; height: 70px; padding: 0 15px; }
.copyright { float:left; font-family: Arial, Helvetica, sans-serif; margin-top: 25px; position: relative; font-style: normal; }
.logoFlaRodape { position: absolute; top: -45px; }
.mascoteBaleia { position: absolute; bottom:-115px; left:-80px; }
.copyright strong { font-weight: bold; font-size: 11px; }
.copyright p { font-size: 10px; }
h5 a.creditos { width:126px; height:28px; background: url(../images/logo_realweb.png) no-repeat top left; display: block; float: right; text-indent:-9999px; position: relative; top:25px; }
h5 a:hover.creditos { width:126px; height:28px; background: url(../images/logo_realweb.png) no-repeat top right; display: block; }


/* Micox Pseudo-class-css2 to IE (MXPC). Activate .hover and .first-child in IE 6 
   Deixe isto ao final de tudo do seu CSS pois o Webkit não interpreta nada mais abaixo do expression
*/
* html * { color: expression( (function(who){ if(!who.MXPC && who.nodeName != 'A'){
 who.MXPC = '1';
 who.onmouseenter=function(){ who.className += ' hover'};
 who.onmouseleave=function(){ who.className = who.className.replace(' hover','')};
 (who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }