.barra-genero-mensagem{
	background:#BE1522;
	height:122px;
	text-align:center;
	width:100%;
	color:#FFF;
    font-family: 'roboto_condensedbold';
	font-size:31px;
	padding-top:42px;
}
.barra-genero-mensagem .conteudo{
	position:relative;	
	width:90%;
	max-width:90%;
}

.btt-acao-generos{
	width:290px;
	height:75px;
	line-height:75px;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:20px;
	font-weight:bold;
}

.flecha-generos{
	width:74px;
	height:37px;
	z-index:999;
	left:50%;
	margin-left:-37px;
	position:absolute;
	top:-1px;
	background:url(../../imagens/flecha-generos.png);	
}
.total-generos{
	width:100%;
	height:315px;
	padding-top:80px;
	position:relative;
	background:#CE3D3B;	
}
.contorno-icone{
	height:165px;
	width:14.222%;
	float:left;
	padding-left:5px;
	padding-right:5px;
}
.contorno-interno-icone{
	width:100%;
	cursor:pointer;
	position:relative;
	background:#BE1522;
	height:165px;	
}
.contorno-interno-icone:hover, .selecionado .contorno-interno-icone{
	background:#FFF;	
}
.contorno-interno-icone:hover .genero-titulo, .selecionado .genero-titulo{
	color:#BE1723;
	font-weight:bold;
}
.genero-icone{
	display:table;
	margin:0 auto;
}
.genero-titulo{
	color:#FFF;
	width:100%;
	position:absolute;
	bottom:20px;
	text-align:center;
	font-size:17px;
	font-family: 'roboto_condensedregular';
	opacity:0.8;	
}

.icone-academia{
	width:94px;
	height:50px;
	opacity:0.8;
	background:url(../../imagens/icone-academia.png)	
}
.hover-academia:hover .icone-academia,.selecionado .icone-academia{
	background:url(../../imagens/icone-academia-hover.png);
}

.icone-supermercado{
	width:83px;
	height:75px;
	opacity:0.8;
	background:url(../../imagens/icone-supermercado.png)	
}
.hover-supermercado:hover .icone-supermercado,.selecionado .icone-supermercado{
	background:url(../../imagens/icone-supermercado-hover.png);
}

.icone-store{
	width:83px;
	height:81px;
	opacity:0.8;
	background:url(../../imagens/icone-store.png)	
}
.hover-store:hover .icone-store,.selecionado .icone-store{
	background:url(../../imagens/icone-store-hover.png);
}

.icone-hotel{
	width:72px;
	height:71px;
	opacity:0.8;
	background:url(../../imagens/icone-hotel.png)	
}
.hover-hotel:hover .icone-hotel,.selecionado .icone-hotel{
	background:url(../../imagens/icone-hotel-hover.png);
}

.icone-gourmet{
	width:75px;
	height:83px;
	opacity:0.8;
	background:url(../../imagens/icone-gourmet.png)	
}
.hover-gourmet:hover .icone-gourmet,.selecionado .icone-gourmet{
	background:url(../../imagens/icone-gourmet-hover.png);
}

.icone-shopping{
	width:74px;
	height:71px;
	opacity:0.8;
	background:url(../../imagens/icone-shopping.png)	
}
.hover-shopping:hover .icone-shopping,.selecionado .icone-shopping{
	background:url(../../imagens/icone-shopping-hover.png);
}

.icone-outros{
	width:68px;
	height:62px;
	opacity:0.7;
	background:url(../../imagens/icone-outros.png)	
}
.hover-outros:hover .icone-outros,.selecionado .icone-outros{
	width:68px;
	height:62px;
	background:url(../../imagens/icone-outros-hover.png);
}

.p-i-academia{
	padding-top:41px;	
}
.p-i-supermercado{
	padding-top:25px;	
}
.p-i-store{
	padding-top:25px;	
}
.p-i-hotel{
	padding-top:30px;	
}
.p-i-gourmet{
	padding-top:24px;	
}
.p-i-shopping{
	padding-top:30px;	
}
.p-i-outros{
	padding-top:40px;	
}
.conteudo-texto-generos{
	height:380px;
	display:none;
	width:100%;
}
.imagem-genero{
	width:525px;
	height:225px;	
	float:left;
}
.fundo-transparent-genero{
	width:100%;
	padding-top:38px;
	height:380px;
	background:url(../../imagens/fundo-transparent-genero.png);	
}
.titulo-genero{
	font-size:33px;
	color:#FFF;
	width:100%;
	position:relative;
	text-transform:uppercase;
    font-family: 'roboto_condensedbold';	
}
.icone-titulo-genero{
	position:absolute;
	left:-80px;
	top:0px;
	padding-top:3px;
	width:58px;
	text-align:center;
	height:58px;
}
.icone-titulo-genero img{
	max-height:45px;
	max-width:45px;
	display:inline;
	width:auto;
}
.texto-genero{
	font-size:18px;
	color:#FFF;
	width:100%;
	height:167px;
	overflow:hidden;
	margin-top:15px;
	margin-bottom:15px;
    font-family: 'roboto_condensedregular';
}
.mensagem-experimentar-generos{
	width:100%;
	color:#FFF;
	border-top:1px solid #FFF;
	padding-top:15px;
	text-align:left;	
    font-family: 'roboto_condensedregular';
	font-size:16px;
}
.mensagem-experimentar-generos img{
	float:left;
	margin-left:10px;
	margin-right:10px;
	margin-top:3px;
}
.mensagem-experimentar-generos a{
	float:left;
	color:#FFF;	
    font-family: 'roboto_condensedbold';
	font-size:16px;
	text-decoration:underline;	
}
.mensagem-experimentar-generos > div{
	float:left;
	margin-right:5px;
}
.mensagem-experimentar-generos span{
	display:block;
	float:left;
    font-family: 'roboto_condensedbold';
}
.contorno-conteudo-generos{
	float:right;
	width:600px;	
}
@media (max-width: 767px){
	.contorno-icone{
		width:50%;
		margin-bottom:10px;
	}
	.total-generos{	
		min-height:10px;
		height:auto;
		padding-top:45px;
		padding-bottom:45px;
	}
	.barra-genero-mensagem{
		min-height:10px;
		height:auto;
		padding:0px;
		font-size:25px;
		padding-top:30px;
		padding-bottom:30px; 	
	}
	.hover-outros{
		float:none;
		margin:0 auto;	
	}
	.flecha-generos{
		top:-15px;
	}
	.texto-genero,.titulo-genero{
		text-align:center;
	}
	.contorno-conteudo-generos{
		float:none;
		width:100%;	
	}
	.mensagem-experimentar-generos span, .mensagem-experimentar-generos img, .mensagem-experimentar-generos > div, .mensagem-experimentar-generos a{
		float:none;
		display:inline;
	}
	.mensagem-experimentar-generos{
		padding-top:10px;
		text-align:center;	
	}
	.barra-genero-mensagem .conteudo{
		min-height:10px;
		height:auto;	
	}
	.btt-acao-generos{
		display:table;
		margin:0 auto;	
	}
}
@media (min-width: 768px) and (max-width: 991px){
	.contorno-icone{
		width:25%;
		margin-bottom:10px;
	}
	.total-generos{	
		min-height:10px;
		height:auto;
		padding-bottom:35px;
	}
	.barra-genero-mensagem{
		min-height:10px;
		height:auto;
		padding:0px;
		font-size:25px;
		padding-top:30px;
		padding-bottom:30px; 	
	}
	.barra-genero-mensagem .conteudo{
		min-height:10px;
		height:auto;	
	}
}
@media (min-width: 992px) and (max-width: 1160px){
	.barra-genero-mensagem{
		min-height:10px;
		height:auto;
		padding:0px;
		font-size:25px;
		padding-top:30px;
		padding-bottom:30px; 	
	}
	.barra-genero-mensagem .conteudo{
		min-height:10px;
		height:auto;	
	}
}