@charset "UTF-8";
/* Hoja de estilo de CowWeb */
/* Reglas de estilo */
/* selector { atributo: valor; } */

	body{
		/* Fondos */
		background-color: whitesmoke;
		background-image: url("../imagenes/background.png");
		background-size: auto auto;
		background-repeat: repeat-y;
		background-position: 10px top;
		background-attachment: fixed;		
	}

	h1{
		color: dodgerblue;
		background-color: lightcyan;
		width: 50%;
		height: auto;
/* Márgenes (internos/externos)
	Padding/Margin
	Notación condensada
		margin: 100px;
		margin: 100px auto;
		margin: 10px 20px 30px 40px;
	Notación específica
		margin-top: 0;
		margin-right: auto;
		margin-bottom: 50px;
		margin-left: auto;
*/
		margin: 100px auto;
		padding: 30px 0;
		text-align: center;
/* Bordes 
	3 propiedades (ancho, color, estilo)
		border-width: 25px;
		border-color: blue;
		border-style: solid;
		border: none; <-Para quitar el borde
/* Notación específica para cada borde
		border-top-color: skyblue;
		border-right-color: yellow;
		border-bottom-color: red;
		border-left-color: green;
		border-top-style: dotted;
		border-left-width: 100px;
	Notación condensada (a todos o a uno concreto)
		border: o border-left:
*/
		border: 20px lightblue solid;
/* Otras propiedades de borde */
		border-radius: 500px 25px;
		outline: none;
		box-shadow: 10px 10px 10px 2px steelblue;	
/* [inset] offset-x offset-y blur spread color */	
	}

	h2{
		color: dodgerblue;	
		text-align: center;
		width: 50%;
		margin: 30px auto;
		background-color: azure;
		background-image: url("../imagenes/background.png");
		background-repeat: repeat-x;
		background-position: left center;
		border: 2px solid black;
		padding: 20px;
		border-radius: 20px;
	}

	nav{
		width: 50%;
		height: auto;
		margin: 50px auto;
		padding: 20px;
		background-color: yellow;
		/* Gradientes de color */
		background: linear-gradient(to right, azure 300px, dodgerblue);
		/* background: radial-gradient(yellow, green); */
		/* background: conic-gradient(yellow, green, orange, red 45deg) */
	}

/* Colores */

		h1{ /* Nombres de color */
			color: navy;
			background-color: aqua;
		}
		
		h2{ /* Valores RGB */
			color: rgb(20,40,220); /* función rgb() */
			background-color: #DAEEF2; /* hexadecimal */
		}
		
		h3{
			color: #018; /* Web Safe Colors */
			background-color: hsl(200,70%,90%); /* Valores HSL */
		}
		
		p{ /* Transparencia: rgba() hsla() */
			background-color: rgba(60,60,250,0.2);
		}