/* 
** URWALD CSS Document 
** 
** Autor: isDesign (www.isdesign.com.br)
** Data: Janeiro de 2013
** Versão 0.1
**
*/

* {
	margin: 0px;
	padding: 0px;
	outline: none; /* resetar outline do chrome */
	border: 0;
}
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
table { 
	border-collapse: collapse; 
	border-spacing: 0; 
}
hr { 
	display: block; 
	height: 1px; 
	border: 0px; 
	border-top: 1px solid #ccc; 
	margin: 0px;
	padding: 0px;
}
input, select { 
	vertical-align: middle; 
}
a img {
	border: none;
}
::-moz-selection{ 
	background: #CD9965; 
	color: #fff; 
	text-shadow: none; 
}
::selection { 
	background: #CD9965; 
	color: #fff; 
	text-shadow: none; 
}

/* ----- Formatação ----- */

body, td{
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif;
	color: #7A5745;
}
a {
	color: #7D4A31;
	text-decoration: none;
}
a:hover {
	color: #6C3E27;
	text-decoration: underline;
}

/* ----- Títulos ----- */

h1 {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 20px;
	font-style: italic;
	font-weight: bold;
	margin-bottom: 20px;
	color: #7E431D;
}
h2 {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 15px;
	font-style: italic;
	font-weight: bold;
}
.big {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 15px;
	font-style: italic;
	font-weight: bold;
	color: #000;
}

/* ----- Páginas ----- */

.paginas {
    top: 70px;
    left: -5%;
    right: -5%; /* JBS: coloquei -5% pois o tamanho total é 110% */
	width: 110%; /* JBS: coloquei mais do que 100% para mermitir a rotação sem que apareça o fundo do elemento de baixo */
	height: 100%;
    margin: auto;
	overflow: hidden;
	position: fixed; 
	z-index: 10;
	background: url(http://www.urwald.com.br/img/fundo.jpg) center center repeat;
	-webkit-box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
	box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
}

.paginas.home {
	z-index: 1;
}

/* ----- Estrutura Cabecalho ----- */

#wpr_cabecalho { width:100%; height:70px; top:0; position:fixed; z-index:42; background:#004C26; box-shadow:0px 0px 8px 0px rgba(0, 0, 0, 1); }
#wpr_cabecalho::before { width:100%; height:100%; position:absolute; top:0; left:0; background:linear-gradient(to bottom, rgba(0,0,0,.20) 0%, rgba(0,0,0,0) 100%); content:""; }
#cabecalho { 
	width: 990px;
	height: 70px;
	margin: 0px auto;
	position: relative;
}
#logo {
	width: 199px;
	height: 135px;
	margin-top: 5px;
	margin-left: 15px;
	float: left;
	cursor: pointer;
}
#menu {
	width: 750px;
	height: 70px;
	margin: 0px;
	margin-right: 10px;
	padding: 0px;
	list-style: none;
	float: right;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}
#menu li {
	height: 25px;
	line-height: 25px;
	margin: 25px 17px 20px 15px;
	padding: 0px;
	color: #FFF;
	display: block;
	position: relative;
	cursor: pointer;
	float: right;
	opacity: 0.9;
	filter: alpha(opacity=90);
}
#menu li p {
	height: 25px;
	line-height: 25px;
	padding-right: 4px;
	float: left;
}
#menu li span {
	width: 25px;
	height: 25px;
	padding-left: 10px;
	background: url(http://www.urwald.com.br/img/menu_seta.png) top right no-repeat;
	float: left;
}
#menu li ul.menuSub {
	width: 130px;
	margin: 0px;
	padding: 10px;
	background: url(http://www.urwald.com.br/img/rodape_fundo.jpg) center top;
	border: 2px solid #4B2F1D;
	list-style: none;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	top: 25px;
	left: -25px;
	position: absolute;
	display: none;
	font-size: 12px;
	color: #CCC;
	font-weight: bold;
}
#menu li ul.menuSub li {
	width: 130px;
	height: 25px;
	line-height: 25px;
	margin: 0px 0px 0px 10px;
	padding: 0px;
	display: block;
	position: relative;
	clear: both;
}
#menu li.menuProdutos {
	cursor: default;
}

/* ----- Estrutura Rodapé ----- */

#wpr_rodape {
	height: 100px;
	width: 110%;
	left: -5%;
	right: -5%;
	bottom: 0px;
	background: #004C26;
	color: #FFF;
	position: fixed;
	z-index: 41;
	-webkit-box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
	box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
}
#wpr_rodape::before { width:100%; height:100%; position:absolute; top:0; left:0; background:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.20) 100%); content:""; }
#rodape { 
	width: 930px;
	height: 100px;
	margin: 0px auto;
}

/* ----- Estrutura Páginas ----- */

#conteudo {
	width: 990px;
	height: 550px;
	margin: 0px auto;
	position: relative;
}
.texto {
	margin-left: 30px;
	margin-top: 100px;
	float: left;
	position: relative;
}
.imagem {
	margin-right: 30px;
	float: right;
	text-align: center;
	position: relative;
}
.urwald .texto {
	width: 520px;
}
.urwald .imagem {
	width: 400px;
	margin-top: 25px;
}
.paginas.cervejas {
	background: url(http://www.urwald.com.br/img/fundo.jpg) center center repeat;
	-webkit-box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
	box-shadow:  0px 0px 8px 0px rgba(0, 0, 0, 1);
}

.cervejas .texto {
	width: 400px;
}
.cervejas .imagem {
	width: 480px;
	margin-right: 70px;
}
.nasuacasa .texto {
	width: 440px;
	position: absolute;
	z-index: 23;
}
.nasuacasa .imagem {
	width: 700px;
	margin-top: 100px;
}
.fabricacao .texto {
	width: 330px;
}
.fabricacao .imagem {
	width: 590px;
	height: 460px;
	margin-top: 45px;
	position: relative;
	background: url(http://www.urwald.com.br/img/img_fabricacao.png) top left no-repeat;
}
.onde .texto {
	width: 410px;
}
.onde .imagem {
	width: 510px;
	height: 428px;
	margin-top: 60px;
	position: relative;
	/*background: url(http://www.urwald.com.br/img/img_mapa_rs.png) top left no-repeat;*/
}
.contato .texto {
	width: 460px;
}
.contato .imagem {
	width: 460px;
	margin-top: 5px;
}
.calculo .texto {
	width: 430px;
}
.calculo .imagem {
	width: 490px;
	margin-top: 70px;
}

#rodape .txt1, #rodape .txt2, #rodape .txt3 {
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
}
#rodape .txt1 {
	width: 300px;
	margin-top: 33px;
	line-height: 23px;
	float: left;
}
#rodape .txt2 {
	width: 105px;
	margin-top: 35px;
	line-height: 23px;
	margin-left: 70px;
	float: left;
	cursor: pointer;
}
#rodape .txt3 {
	width: 130px;
	margin-top: 33px;
	line-height: 23px;
	margin-left: 70px;
	float: left;
	cursor: pointer;
}
#rodape .txt3  p {
	float: left;
}
#rodape .txt3 span {
	width: 23px;
	height: 23px;
	padding-left: 10px;
	background: url(http://www.urwald.com.br/img/rodape_seta.png) top right no-repeat;
	float: left;
}
#rodape .txt4 {
	width: 190px;
	margin-top: 28px;
	line-height: 34px;
	float: right;
	text-align: right;
}
#rodape a {
	color: #FFF;
}
#rodape a:hover {
	color: #FFF;
}

/* ----- Anime Home ----- */

#img-capa-2014 { width:835px; height:525px; margin:-265px 0px 0px -417px; position:absolute; top:50%; left:50%; opacity:0; }

#img_capa {
	width: 650px;
	height: 550px;
	margin: 0px;
	position: relative;
	float: left;
}
#img_capa_01 {
	width: 164px;
	height: 538px;
	margin: 12px 243px 0px 243px;
	text-align: center;
	z-index: 5;
	position: absolute;
}
#img_capa_01 img {
	width: auto;
	height: 0px;
	margin-top: 538px;
}
#img_capa_02 {
	width: 220px;
	height: 444px;
	top: 108px;
	left: 0px;
	margin-left: 96px;
	z-index: 4;
	position: absolute;
	overflow: hidden;
}
#img_capa_02 img {
	margin-left: 220px;
}
#img_capa_03 {
	width: 220px;
	height: 444px;
	top: 108px;
	right: 0px;
	margin-right: 91px;
	z-index: 4;
	position: absolute;
	overflow: hidden;
}
#img_capa_03 img {
	margin-left: -140px;
}
#img_capa_04 {
	width: 650px;
	height: 510px;
	top: 30px;
	z-index: 2;
	position: absolute;
}
#img_capa_04 img {
	display: none;
	position: absolute;
	bottom: 0px;
}

#compartilhe {
	width: 150px;
	height: 34px;
	line-height: 34px;
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 490px;
	text-align: left;
	float: left;
}
#compartilhe a {
	margin-left: 2px;
}
#creditos {
	width: 130px;
	height: 34px;
	line-height: 34px;
	margin-left: 30px;
	margin-top: 490px;
	color: #8F6850;
	font-size: 12px;
	text-align: right;
	float: right;
}
#role {
	width: 50px;
	height: 80px;
	top: 240px;
	right: 20px;
	z-index: 1;
	position: absolute;
	background: url(http://www.urwald.com.br/img/role.png) 0px 0px no-repeat;
	display: none;
}

/* ----- Página Urwald ----- */

.img {
	width: 112px;
	height: 112px;
	top: 300px;
	z-index: 11;
	position: absolute;
	overflow: hidden;
}
.img a {
	-webkit-filter: sepia(1);
	/* transição de um pro outro */
	-webkit-transition: 0.5s linear; /* Safari e Chrome */
}
.img a:hover {
	-webkit-filter: sepia(0);
	/* transição de um pro outro */
	-webkit-transition: 0.5s linear; /* Safari e Chrome */
}
.img_lupa {
	width: 35px;
	height: 35px;
	background: url(http://www.urwald.com.br/img/lupa.png) no-repeat center;
	bottom: 5px;
	right: 5px;
	position: absolute;
	display: none;
	z-index: 12;
}
#foto01 {
	left: 10px;
}
#foto02 {
	left: 130px;
}
#foto03 {
	left: 250px;
}
#foto04 {
	left: 370px;
}

/* ----- Página Cervejas ----- */

.cerveja {
	width: auto;
	top: 0px;
	left: 20px;
	opacity: 0.0;
	filter: alpha(opacity=0); /* For IE8 and earlier */
	position: absolute;
	z-index: 20;
}
#cerveja_1 {
	opacity: 1.0;
	filter: alpha(opacity=100); /* For IE8 and earlier */
}
.setas {
	width: 55px;
	height: 62px;
	top: 400px;
	cursor: pointer;
	position: absolute;
	z-index: 25;
}
.cervejas .imagem #seta_e {
	background: url(http://www.urwald.com.br/img/seta_e.png) 5px 0px no-repeat; 
	left: -10px;
}
.cervejas .imagem #seta_d { 
	background: url(http://www.urwald.com.br/img/seta_d.png) 0px 0px no-repeat;
	right: -10px;
}
.cervejas ul {
	/* text-align: right;*/
	margin: 0px;
	margin-top: 40px;
	margin-left: 50px;
	padding: 0px;
	list-style: none;
}
.cervejas ul li {
	position: absolute; 
	padding: 0px;
	display: none;
}

/* ----- Página Fabricação ----- */

#fabricacao {
	width: 530px;
	height: 387px;
	top: 40px;
	left: 29px;
	position: absolute;
	z-index: 24;
}
#fabricacao img {
	width: 530px;
	height: 387px;
}
#loading {
	width: 26px;
	height: 26px;
	top: 216px;
	left: 280px;
	position: absolute;
	z-index: 25;
	display: none;
}
.fabricacao .imagem .setas {
	top: 400px;
}
.fabricacao .imagem #seta_e {
	background: url(http://www.urwald.com.br/img/seta_e.png) 5px 0px no-repeat; 
	left: -4px;
}
.fabricacao .imagem #seta_d { 
	background: url(http://www.urwald.com.br/img/seta_d.png) 0px 0px no-repeat;
	right: -13px;
}
.fabricacao ul {
	margin: 0px;
	margin-right: 10px;
	padding: 0px;
	list-style: none;
}
.fabricacao ul li {
	padding: 0px;
	display: none;
}

/* ----- Representantes ----- */

.statusAjax {
	width: 50px;
	height: 20px;
	margin: 20px 0px 0px 0px;
	line-height: 20px;
	text-align: center;
	display: none;
}
.vendas-estado { height:65px; display:none;  }
#vendas-texto  { height:90px; display:block; }
#vendas-representantes { width:490px; height:300px; overflow:hidden; display:none; }

.onde select {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 14px;
	font-style: italic;
	font-weight: normal;
	color: #FFF;
	background: #C0A48C; 
	width: 210px; 
	height: 28px;
	padding: 5px 0px 5px 15px;
	border: none;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
}

/*
#mapa_coordenadas {
	width: 510px;
	height: 428px;
	top: 0px;
	left: 0px;
	position: absolute;
	z-index: 32;
}
.mapa_regioes {
	position: absolute;
	z-index: 31;
	overflow: hidden;
	display: none;
}
#regiao1.mapa_regioes {	width:120px;	height:88px;	top:44px;	left:167px;	background:url(http://www.urwald.com.br/representantes/regiao_1.png); }
#regiao2.mapa_regioes {	width:127px;	height:116px;	top:45px;	left:274px;	background:url(http://www.urwald.com.br/representantes/regiao_2.png); }
#regiao3.mapa_regioes {	width:116px;	height:83px;	top:98px;	left:345px;	background:url(http://www.urwald.com.br/representantes/regiao_3.png); }
#regiao4.mapa_regioes {	width:213px;	height:188px;	top:97px;	left:69px;	background:url(http://www.urwald.com.br/representantes/regiao_4.png); }
#regiao5.mapa_regioes {	width:138px;	height:126px;	top:100px;	left:177px;	background:url(http://www.urwald.com.br/representantes/regiao_5.png); }
#regiao6.mapa_regioes {	width:79px; 	height:105px;	top:137px;	left:283px;	background:url(http://www.urwald.com.br/representantes/regiao_6.png); }
#regiao7.mapa_regioes {	width:154px;	height:164px;	top:215px;	left:235px;	background:url(http://www.urwald.com.br/representantes/regiao_7.png); }
#regiao8.mapa_regioes {	width:82px; 	height:97px;	top:165px;	left:374px;	background:url(http://www.urwald.com.br/representantes/regiao_8.png); }
#regiao9.mapa_regioes {	width:105px;	height:96px;	top:167px;	left:317px;	background:url(http://www.urwald.com.br/representantes/regiao_9.png); }
*/

/* ----- Contato ----- */

#sucess {
	width: 415px; 
	margin: 30px 0px 20px 0px;
	padding: 10px;
	color: #FFF;
	font-weight: normal;
	background: url(http://www.urwald.com.br/img/sucess_fundo.jpg) left center repeat-x;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	display: none;
	clear: both;
}

#form_contato {
	width: 430px;
	margin-top: 20px;
}
.campoFrm {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 15px;
	font-style: italic;
	font-weight: normal;
	color: #FFF;
	background: #C0A48C; 
	width: 415px; 
	height: 33px; 
	margin-top: 5px;
	padding-left: 15px;
	float: right;
	border: none;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
}
.campoFrm::-webkit-input-placeholder {
    color:#F1EFEB;
}
.campoFrm::input-placeholder {
    color:F1EFEB !important;
}
.campoFrm:-moz-placeholder {
    color:#F1EFEB;
}
.campoFrm:-ms-input-placeholder {
    color:#F1EFEB;
}
#form_contato textarea {
	height: 70px;
	padding-top: 15px;
	resize: none;
}
.enviando {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 15px;
	font-style: italic;
	font-weight: normal;
	color: #666;
	text-align: center;
	width: 125px;
	height: 33px;
	line-height: 33px;
	margin-top: 5px;
	float: right;
	border: 1px solid #E5E5E5;
	background:url(http://www.urwald.com.br/img/btn_enviar.jpg) repeat-x top left;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	display: none;
}

/* ----- Cálculo do Chopp ----- */

#form_calculo {
	width: 350px;
	margin-top: 20px;
}
#form_calculo .campoFrm {
	width: 335px; 
}
#resultado { 
	display: none;	
}

/* ----- Itens ----- */

.botao {
	font-family: Georgia, "Palatino Linotype", Palatino, "Times New Roman", Times, serif;
	font-size: 15px;
	font-style: italic;
	font-weight: normal;
	color: #666;
	text-align: center;
	height: 33px;
	line-height: 33px;
	margin-top: 5px;
	padding: 0px 10px;
	border: 1px solid #E5E5E5;
	background:url(http://www.urwald.com.br/img/btn_enviar.jpg) repeat-x top left;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	cursor: pointer;
}
.botao.centralizado{ margin: 5px auto; }
.botao.direita{ float: right; }
 
.botao:hover {
	background-position: bottom left;
}
.advertencia {
	width: 13px;
	height: 170px;
	margin-top: -145px;
	position: absolute;
	right: 5%;
	top: 50%;
}
.advertencia.adv1 {
	background: url(http://www.urwald.com.br/img/advertencia_1.png) center center no-repeat;
}
.advertencia.adv2 {
	background: url(http://www.urwald.com.br/img/advertencia_2.png) center center no-repeat;
}
.advertencia.adv3 {
	background: url(http://www.urwald.com.br/img/advertencia_3.png) center center no-repeat;
}
.advertencia.adv4 {
	background: url(http://www.urwald.com.br/img/advertencia_4.png) center center no-repeat;
}

/* ----- Extras ----- */

.subtitulo { font-weight:300 !important; font-size:14px; font-family:Georgia, Lucida Bright, serif; font-style:italic; }
.font-size-18 { font-size:18px; }

#rolagem {
	overflow-y:scroll;
	overflow-x:hidden;
	height: 300px;
	width: 420px;
}
.clearBoth {
	height: 0px;
	overflow: hidden;
	clear: both;
}
.pontilhado {
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 20px 0px;
	border-bottom: 1px dashed #DDD;
	clear: both;
}
.marginTop5  { margin-top:5px;  }
.marginTop10 { margin-top:10px; }
.marginTop20 { margin-top:20px; }
.marginTop30 { margin-top:30px; }
.marginTop40 { margin-top:40px; }