@charest "UTF-8";
/* Hoja de estilo de COwWeb */


h1{

color: navy;
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: 10px;
border-color: purple;
border-style: solid;
border: none; <-Para quitar el borde
/*Notación específica
border-top-color: black;
border-right-color: purple;
border-left-color: yellow;
border-top-style: dotted;
border-left-width: 100px
Notación condensada
border-left:
*/
border: 20px pink solid;

border-radius: 100px 0;

outline: none; 
/* [inset]offset-X offset-y blur spread color*/
box-shadow: 20px 20px 10px 5px blue;

}



body{
/*Fondos*/
background-color: whitesmoke;
background-image: url("imagenes/background.png");
background-size: 20% auto;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}


nav{
width: 50%;
margin: 50px auto;
padding: 20px;
border: 5px solid blue;
background-color: yellow;
background: linear-gradient(lightgreen,lightblue,lightpink,lightyellow 150px);
background: radial-gradient(lightgreen,lightblue,lightpink,lightyellow);
}



/*Colores*/

h1 {/*Nombres de color*/
color: pink;
background-color: gold;
}

h2{/*Valores RGB*/
color: rgb(220,40,80);/*función rgb ()*/
background-color: #FFC0CB /* hexadecimal */
}

h3{ /* Valores HSL*/
color: #081; /* Web Safe Colors */
background-color: hsl(70,100%,90%);
}

p{/* Transparencia: rgba() hsla() */
background-color: rgba(60,190,50,0,1);
}