@charset "utf-8";

#home { float: left; width: 100%;}
#home .subtitulo { float: left; width: 100%; margin-bottom: 10px;}
#home .subtitulo h2 { float: left; width: 100%; padding: 8px; background-color: #FFF041; text-transform: uppercase; font-weight: bold; font-size: 1.2em; color: #090909; border-radius: 5px; box-sizing: border-box;}
#home .subtitulo em { float: left; width: 100%;}

#home .coluna { float: left; width: 100%; margin: 11px 0;}
#home .coluna .conteudo { display: flex; gap: 15px; float: left; width: 100%;}
#home .coluna .conteudo .lado1 { flex: 1;}
#home .coluna .conteudo .lado2 { width: 280px;}

#home .pendrives { float: left; width: 100%; position: relative;}
#home .artistas { float: left; width: 100%; position: relative;}
#home .estourados { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .singles { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .minis { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .lancamentos { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .maisbaixadas { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .maisouvidos { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .recomendados { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .mp3 { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .playlist { float: left; width: 100%; padding: 11px 0; position: relative;}
#home .noticias { float: left; width: 100%; padding: 11px 0; position: relative;}

#home .artistas .tab { float: left; width: 100%; display: flex; align-items: center; padding: 10px; margin: 0 0 3px; background-color: #FFFFFF1A; box-sizing: border-box; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#home .artistas .tab .img { float: left; width: 30%;}
#home .artistas .tab .img img { float: left; width: 100%;}
#home .artistas .tab .nome { float: left; width: 70%; margin: 8px 0 0;}
#home .artistas .tab .nome h2 { display: flex; align-items: center; justify-content: center; gap: 5px; float: left; width: 100%; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; color: #FFFFFF; line-height: 1;}
#home .artistas .tab .nome h2 em { width: 20px; height: 20px; background-image: url('../imagens/verificado.png'); background-repeat: no-repeat;}
#home .artistas .tab .nome a { float: left; width: 100%; margin: 10px 0 0; text-align: center;}
#home .artistas .tab .nome a b { padding: 7px 10px 5px; background-color: #FFF0415E; text-transform: uppercase; color: #FFFFFF;}
#home .artistas .tab .nome a:hover b { background-color: #FFF0419E;}
#home .artistas .mais { float: left; width: 100%; padding: 8px 0 6px; margin: 10px 0 0; background-color: #FFFFFF; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; color: #000000; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#home .artistas .mais:hover { background-color: #FFF041;}

#home .estourados .fundo { float: left; width: 100%; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#home .estourados .tab { float: left; width: 100%; padding: 10px; background-color: #FFFFFF; box-sizing: border-box; border-radius: 8px;}
#home .estourados .tab .imagem { float: left; width: 100%;}
#home .estourados .tab .imagem .img { float: left; width: 100%;}
#home .estourados .tab .texto { float: left; width: 100%;}
#home .estourados .tab .texto h3 { float: left; width: 100%; height: 28px; margin: 8px 0 0; text-align: center; font-size: 0.9em; color: #000000; line-height: 1;}

#home .singles .conteudo { display: grid; gap: 10px; grid-template-columns: 1fr 1fr 1fr 1fr; float: left; width: 100%;}
#home .singles .tab { display: flex; gap: 10px; float: left; width: 100%; padding: 10px; background-color: #0000005D;}
#home .singles .tab .img { width: 100px;}
#home .singles .tab .img img { float: left; width: 100%;}
#home .singles .tab .detalhes { flex: 1;}
#home .singles .tab .detalhes h3 { font-size: 1em; color: #FFFFFF;}
#home .singles .tab .detalhes h4 { font-size: 0.9em; color: #FFFFFF;}
#home .singles .tab .detalhes span { float: right; padding: 4px 10px; background-color: #FFF041; font-weight: bold;}
#home .singles .tab .detalhes span:hover { transform: scale(1.1);}

#home .minis .conteudo { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; float: left; width: 100%;}
#home .minis .tab { float: left; width: 100%;}
#home .minis .tab img { float: left; width: 100%;}

#home .lancamentos .conteudo { float: left; width: 100%; padding: 10px; background-color: #0000005D; box-sizing: border-box; border-radius: 8px;}
#home .lancamentos .tab { float: left; width: 10%;}
#home .lancamentos .tab .img { float: left; width: 100%; position: relative;}
#home .lancamentos .tab .img img { float: left; width: 90%; margin: 5%;}
#home .lancamentos .tab .img .obs { flex-direction: column; align-items: center; justify-content: center; position: absolute; width: 90%; height: 90%; top: 5%; left: 5%; display: none; background-color: rgba(0, 0, 0, 0.9);}
#home .lancamentos .tab .img .obs b { float: left; width: 90%; margin: 5%; text-align: center; font-size: 0.9em; color: #FFFFFF; line-height: 1;}
#home .lancamentos .tab .img .obs em { float: left; width: 90%; margin: 0 5%; background-color: #FFF041; text-align: center; font-weight: bold; font-style: normal; font-size: 1em; color: #000000; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#home .lancamentos .tab:hover .img .obs { display: flex;}
#home .lancamentos .linha10 { float: left; width: 100%; height: 1px;}
#home .lancamentos .linha5 { float: left; width: 100%; height: 1px; display: none;}

#home .recomendados .intes4 { float: left; width: 100%; display: flex; flex-wrap: wrap;}
#home .recomendados .intes4 .tab { width: 24.2%; overflow: hidden;}
#home .recomendados .intes4 .tab.ta1 { float: left;}
#home .recomendados .intes4 .tab.ta2 { float: left; margin-left: 1%;}
#home .recomendados .intes4 .tab.ta3 { float: left; margin-left: 1%;}
#home .recomendados .intes4 .tab.ta4 { float: right; margin-left: 1%;}
#home .recomendados .intes4 .tab h3 { font-family: 'aller_displayregular', Arial; text-transform: uppercase; letter-spacing: 1px; font-size: 1.1em; height: auto;}

#home .noticias .conteudo { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; float: left; width: 100%;}
#home .noticias .tab { display: flex; gap: 10px; float: left; width: 100%; padding: 20px; background-color: #0000005D;}
#home .noticias .tab .img { width: 200px;}
#home .noticias .tab .img img { float: left; width: 100%;}
#home .noticias .tab .detalhes { flex: 1;}
#home .noticias .tab .detalhes h3 { font-size: 1.5em; color: #FFFFFF; line-height: 1.1;}
#home .noticias .tab .detalhes h4 { margin: 7px 0 0; font-size: 1em; color: #FFFFFF80;}
#home .noticias .tab:hover { transform: scale(1.02);}

@media only screen and (max-width: 1000px) {
	#home .coluna { margin: 11px 0 0;}
	#home .coluna .conteudo { display: flex; flex-direction: column;}
	#home .coluna .conteudo .lado2 { width: 100%;}
	#home .singles .conteudo { grid-template-columns: 1fr 1fr;}
	#home .noticias .conteudo { grid-template-columns: 1fr;}
}
@media only screen and (max-width: 800px) {
	#home .recomendados .intes4 .tab { width: 48%; margin-bottom: 20px;}
	#home .recomendados .intes4 .tab.ta1 { float: left;}
	#home .recomendados .intes4 .tab.ta2 { float: right; margin-left: 0;}
	#home .recomendados .intes4 .tab.ta3 { float: left; margin-left: 0;}
	#home .recomendados .intes4 .tab.ta4 { float: right;}

	#home .minis .conteudo { grid-template-columns: 1fr;}
}
@media only screen and (max-width: 700px) {
	#home .estourados { padding: 5px 0;}
	#home .minis { padding: 5px 0;}
	#home .lancamentos { padding: 5px 0;}
	#home .maisbaixadas { padding: 5px 0;}
	#home .maisouvidos { padding: 5px 0;}
	#home .recomendados { padding: 5px 0;}
	#home .mp3 { padding: 5px 0;}
	#home .playlist { padding: 5px 0;}

	#home .lancamentos .tab { width: 20%;}
	#home .lancamentos .linha5 { display: block;}
	#home .singles .conteudo { grid-template-columns: 1fr;}
}
@media only screen and (max-width: 600px) {
	#home .subtitulo h2 { font-size: 1em;}
	#home .noticias .tab { flex-direction: column; gap: 15px;}
	#home .noticias .tab .img { width: 100%;}
}