@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Handlee);


body {
    background-color: #ac97b1;
    font-family: sans-serif;
}

a {text-decoration: none;}

#cuerpo { 
 background-color: #eae6e6;
    width: 70%;
    margin: auto;
    padding: 1em;
}
#cuerpo h4{ text-align: left; 
    padding-left: 10em;
 
}

ul {padding: 0px;}

nav li {
    background-color: #ac97b1;
    padding: 0.6em;
    margin-right: auto;
    display: inline;
    }

nav li a {color: #ffffff;}

li {list-style: circle;
    
}

h1{
   font-family: 'Handlee', cursive;
    width: 200%;
    color: #4d2e55
}

h2, h3, h4 {
    font-family: sans-serif;
    color: #2f1f1f;
}

figure img {margin-right: 4em;}

footer p{ 
    margin: 0;
    padding: 0;
}

footer {
    background-color: #ffffff;
    font-size: 11px;
    padding: 1em 2em;
}

ul li {color: crimson;}


@media screen and (max-width: 480px) and (min-width: 350px) {
    #cuerpo { 
 background-color: #eae6e6;
    width: 70%;
    margin: auto;
    padding: 1em;
}
#cuerpo h4{ 
font-size: 8px; 
}
     nav {     
  display: flex;
    flex-direction: column;
    flex-wrap: wrap;           
    }
   
    nav ul {
        display: flex;
        flex-direction: column;
        margin-right: auto;
        margin:auto;
        } 
      nav li {
    background-color: #ac97b1;
    padding: 0.6em;
    margin:0.8em;
    text-align: center;
    }
    
     article {
       padding: 1em;
        } 
    
    div img {width: 30%;}
    figure img {width: 100%;
                padding-bottom: 3em;}
    *  { text-align: justify;}
    body{background-color: #4d2e55;}
  
}