@charset "UTF-8";
/*Hoja de estilo de CowWeb*/

body{
			/*Fondos*/
			background-color: whitesmoke;
			background-image: url("../imagenes/background.png");
			background-size: auto auto;
			background-repeat: repeat-x;
			background-position: center top;
			background-attachment: fixed;
		}	
	
		h1{color: darkmagenta; 
			background-color: lightcyan;
			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: 20px;
					border-color: darkmagenta;
					border-style: solid;
					border: none -> para quitar el borde
					
				/*Estilos de borde
					border-style: solid;
					border-style: dashed;
					border-style: dotted;
					border-style: outset;
					border-style: inset;
					border-style: ridge;
					border-style: groove;
				*/
				
		/*Notación específica bordes	
					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;
			box-shadow: 10px 10px 15px 2px black;			
		/*[inset]offset-x offset-y blur spread color (no se puede tener spread sin blur)*/
		}
		
		h2{color: indigo; 
			width: 50%;
			height: auto;
			background-image: url("../imagenes/background.png");
			background-repeat: repeat-x;
			background-position: left center;
			background-color: lavender;
			margin: 30px auto;
			text-align: center;
			border: 2px solid black;
			border-radius: 40px;
		}
		
		nav{width: 50%;
			margin: 50px auto;
			padding: 20px;
			border: 1px solid black;
			border-radius: 10px;
			background-color: lightgoldenrodyellow;
			background: linear-gradient(lavender, lightgoldenrodyellow);
			
		}

		/*Colores*/	
		
		h1{/*Nombres color*/
			color: maroon;
			background-color: lightcyan;
		}		
		
		h2{/*Valores RGB*/
			color: rgb(220,20,60); /*rgb()*/
			background-color: #FFC597; /*hexadecimal*/
		}
		
		h3{/*Valores HSL*/
			color: #C02; /*Web Safe Colors*/
			background-color: hsl(340, 50%, 80%);
		}
		
		p{/*Transparencia: rgba() hsla()*/
			background-color: rgba(255,0,0,0.2);
		}