@charset "utf-8";
/* CSS Document */
*{
	margin: 0;
	padding: 0;
}

body{
	font-family: Verdana, Geneva, sans-serif;
	font-size:1em;
}

h1,h2,h3{
	font-family: Arial, Helvetica, sans-serif;
	margin:0.25em auto;
	text-align:center;
	text-shadow: 5px 5px 10px rgba(40,40,40,0.8);
	font-weight: bold;
}

.cab{
	background-color: chocolate;
	background-image: url(../img/em_cab.jpg);
	background-size: cover;
	grid-area: cab;
} 
		.logo {
			width: auto;
			height: auto;
			grid-area: logo;
		}
		.slogan {
			justify-content: center;
			font-style:italic;
			color:#FFF;
			line-height:1em;
			text-align: center;
			background-color: rgba(0,0,0,0.2);
			grid-area: slogan;
		}
.mn_sp{
	display: grid;
	justify-content: center;
	grid-area: mn_sp;
}

	.top_mn{
        width: 100%;
		align-items: baseline;
		height:50%;
    	display: inline-block;
		flex-wrap: wrap;
	}

	.top_mn ul{
	    list-style:none;
	    float:left;
        background-color: rgba(50,50,50, 0.20);
		padding: 0.5%;
	    width:100%;
	}

	.top_mn ul li{
		float:left;
		width:115px;
	    margin-right:5px;
	    margin-bottom:.5px;
	    background: black;
	    padding: 1px;
		text-align:center;
		border-radius:5%;
		border-top-color:goldenrod;
		border-bottom-color:gold;
		border-style:groove;
	}

	.top_mn ul li a{
	    color: #FFFFFF;
	    text-decoration:none;
		font-size:.9em;
	}

	.top_mn ul li a:hover{
		font-size: 1em;
	    font-style:bold;
	    color: #000;
		text-decoration: inherit;
		background-color: gold;
}

.principal{
    width:95%;
	margin: 10px auto;
	height: auto;
	min-height:900px;
    padding-top:5px;
    padding-bottom:5px;
	grid-area: principal;
}

.sidebar{
    width: 20%;
	float:left;
    padding-left: 5px;
	padding-right: 5px;
	grid-area: sidebar;
}

.promos {
	width: 100%;
	height: auto;
    margin-bottom: 10px;
}

#menu_lat{
	min-width:90%;
	height:auto;
    color:black;
    background-color: rgba(255, 255, 255, 0.30);
}

.menu_lat ul{
	    list-style:none;
	    float:left;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
    	padding: 2%;
	    width:95%;
}
.menu_lat ul li{
		float:left;
		width:auto;
		margin-right:1px;
		margin-bottom:1px;
		background-color: rgba(255, 255, 255, 0.45);
		padding: 1px;
		margin-bottom: 3px;
		text-align:center;
		border-radius:5%;
		border-bottom-color:#000;
		border-bottom-style: inset;
		border-top-style: solid;
		border-top-color: goldenrod;
}

.menu_lat ul li a{
	    color: #FFFFFF;
	    text-decoration:none;
		font-size:.7em;
}
.menu_lat ul li a:hover{
	    font-style:bold;
	    color: #000;
		text-decoration: inherit;
		background-color:#fff;
}


#enmedio{
	width:70%;
	height:auto;
	float:right;
    padding-top:1px;
    padding-bottom:1px;
}
.enmedio{
	grid-area: enmedio;
}

#diapos{
 	width:100%;	
	height:400px;
	visibility:visible;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

#slider {
	align-items: center;
	justify-content: center;
	width:900px;
	height:300px;
}

.tarjetas{
	width: 95%;
	height: auto;
	margin: 5px auto;
	background-color: floralwhite;
	display: grid;
	grid-area: tarjetas;
}

.id_generos{
	width: 100%;
	height: auto;
	font-size: 1.5em;
	color: #C60;
	font-weight: 600;
	background-color: rgba(0, 0, 0, 0.070);
	grid-area: id_generos;
}
.card1{
	grid-area: card1;
}
.card2{
	grid-area: card2;	
}

.card3{
	grid-area: card3;
}
.card4{
	grid-area: card4;
}

#contacto {
    width: 70%;
	height:auto;
	margin: auto;
	text-decoration: underline;
	font-family: Verdana, Geneva, sans-serif;
	display: grid;
	grid-area: contacto;
}
.datos{
	grid-area: datos;
}

.propa{
	grid-area: propa;
}

#pre_ft{
	width: 100%;
	height: auto;
	display: flex;
	background-color: rgba(0, 0, 0, 0.50);
	margin-bottom: 10px;
	grid-area: pre_ft;
}


#logo_mne {
	width:20%;
	height:auto;
	grid-area: logo_mne;
}

#red_mne {
	width:75%;
	height:auto;
	grid-area: red_mne;
}

footer {
	width: 100%;
	height: 15em;
    color:white;
}

.pie_pag{	
	background-color: rgba(0, 0, 0, 0.80);
	border-top-color: #000;
	border-top-style: double;
	display: grid;
	grid-area: pie_pag;
}

#redes-soc {
	width:100%;
	height:auto;
}

#mn_inf {
	width:100%;
	height:auto;
}

.mn_inf ul{
	    list-style:none;
	    float:left;
    	padding: 2%;
	    width:95%;
}
.mn_inf ul li{
		float:left;
		width:115px;
	    margin-right:1px;
	    margin-bottom:1px;
	    background: #C60;
	    padding: 1px;
		text-align:center;
		border-radius:5%;
		border-bottom-color:#000;
}

.mn_inf ul li a{
	    color: #FFFFFF;
	    text-decoration:none;
		font-size:.7em;
}
.mn_inf ul li a:hover{
	    font-style:bold;
	    color: #000;
		text-decoration: inherit;
		background-color:#fff;
}

.acerca_de{
	font-style: italic;
}

a{
	    color: darkred;
	    text-decoration:none;
		font-size:.9em;
	}

a:hover{
		font-size: 1em;
	    font-style:bold;
	    color: goldenrod;
		text-decoration: inherit;
		background-color: black;
}

.tit_secc{
	font-size: 1em;
	font-style: italic;
	color: darkgoldenrod;
	align-content: center;
	justify-content: center;
}

.grande-blancas-neg{
	font-size:2em;
	font-feature-settings:  -style:bold;
	color: #FFF;
	text-align: left;
}

.negras-peques {
	font-family: Verdana, Geneva, sans-serif;
	font-size:.8em;
	font-style: normal;
}

.blancas-peque {
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-small;
	font-style: normal;
	color: #FFF;
}

.peques {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	color: dimgray;
}

.negru{
	color: #000;
	font-weight: 600;
}

.blangru{
	color: #fff;
	font-weight: 600;
}