@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: 200px 100px; 
		background-position: left top;
		background-repeat: no-repeat;
		background-attachment: fixed;
		
	}
	
	h1{
		color: blue;
		background-color: lavender;
		width: 50%;
		height: auto;
/* Notaciones condensadas
		margin: 100px;
		margin: 100px auto;
		margin: 10px 20px 30px 40px;
		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;
		
		border-radius: 100px 0;
		
		outline: none;
		/* [inset] offset-x offset-y blur spread color */
		box-shadow: 20px 20px 10px 5px blue;
	}
	
	h2{
		color: dodgerblue;
		text-align: center;
		width: 50%;
		margin: 30px auto;
		background-color: azure;
		background-repeat: repeat-x;
		background-position: left center;
		border: 2px solid black;
		padding: 10px;
		border-radius: 20px;
	}
	
	nav{
		width: 50%;
		margin: 50px auto;
		padding: 20px;
		border: 1px solid black;
		background-color: yellow;
		background: linear-gradient(to left,red,yellow);
		/*background: radial-gradient(whitesmoke, pink); */
		/*background: conic-gradient(whitesmoke, pink, lightcoral);*/
	}
	
/* Colores */

		h1{ /* Nombres de color */
			color: red;
			background-color: gold;
		}
		
		h2{ /* Valores RGB */
			color: rgb(220,40,80); /* función rgb () */
			background-color: #FFB57C; /* hexadecimal */
		}
		
		h3{
			color: #AFE; /* Web Safe Colors */
			background-color: hsl(200,65%,50%); /* Valores HSL */
		}
		
		p{ /* Transparencia: rgba() hsla() */
			background-color: rgba(59,246,165,0.5);
		}