/* Cambias la tipografia de toso los elementos de la pagina
porque trabaja con la etiqueta body que contiene a todos los elementos  */

body{
	
	font-family: Arial, Helvetica, sans-serif;
}
/* EUQIVALE EN HTML AL ATRIBUTO CLASS=""
Y SIRVE PARA MARCAR UNA APARIENCIA O UN DISEÑO ESPECIAL */
.borde-inicial{
	border-left:40px solid orange;
	padding-left:110px;
}
/* ES EL EVENTO DE LOS ENLACES, CAMBIA EL DISEÑO CUANDO PONGO 
EL CURSOR SOBRE EL ENLACE Y OJO LO CAMBIA EN LA ETIQUETA FINAL QUE ES IMG*/
A:hover img{
	opacity:0.5;
}

/* ES UN IDENTIFICADOR UNICO, NO PUEDE HABER UN NOMBRE IGUAL EN LA MISMA PAGINA Y
EUQIVALE EN HTML AL ATRIBUTO IN="" */
div#boton-music´{
	
background-color:#999;
	margin:25px;
	border:1px solid black;
	padding:25px;
}

/* ALINEAR VARIOS TITULOS A LA VEZ
CON LAS COMAS PODEMOS AÑADIR ESTILOS A VARIAS ETIQUETAS
P ES EL PARRAFO */

h1,h2,h3,h4,h5,h6,p{
	text-align:center;
	letter-spacing:2px;
	line-height:25px;
	padding:20px;
	background-color:#ffffbf;
	
}

/* CUANDO TENGO 2 ESTILOS SEMEJANTES, LE DAMAS RELEVANCIA AL QUE LLEVA !IMPORTANT **
PADDING=RELLENO INTERIOR DE LAS IMAGENES O TEXTO, BORDER = CONTORNO, MARGIN= ESPACIO EXTERIOR
h1 tiene padding 4px y el resto 20px*/
h1{
	padding: 4px !important;
}



div h3{
	color:white;
}

/* PARA CAMBIAR EL COLOR DEL CONTAINER FORMULARIO */
.container{
	background-color: #FFFFBF;
}
/* el estilo de margen se aplican a los div que estan dentro del div con clase container */
.container div{
	margin:25px
}

footer
/* PRACTICA 2 */

/* CSS ORIGINAL BLOQUES */


div.galeria {
  display: flex; /* distribución dinámica y adaptable */
  justify-content: center; /* Centra horizontalmente */
  align-items: center; /* Centra verticalmente */
  background-color: lightgray;
}






div.galeria div.item {
  flex: 1; /* hace que cada div."item" CONTENEDOR HIJO se expanda por igual, proporcional dentro del contenedor.*/
 /*HEIGHT=ALTO, PARA QUE NO SALGA height: 100px; ES PARA LA RETICULA ORIGINAL 
  COLOR DE FONDO=BACKGROUD , TAMPOCO QUEREMOS QUE SALGA background-color: steelblue; */
  margin: 5px;
}