@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600');

* {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: 0;
    text-decoration: none;
    text-underline-position: none;
}

.caja {
   
}
h1 { 
    font-family: 'Montserrat', sans-serif;
    font-size: 1em;
}

.logo{
    max-width: 40%;
}

figure img{
   width: 100%;
    
}


footer, p, a {
    list-style: none;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
}


main section{
    background-color: #a3a3a3;
    padding: 3em;
    margin: 0.5em;
    font-family:'Montserrat', sans-serif; 
    font-size: 0.8em
}
main section p {
    background-color: white;
    color: #a3a3a3;
    width: 100%;
    font-size: 0.7em
} 


section h2 {
    color:black;
    font-size: 1em;
}

p {
    color:white;
    max-width: 100%;
}

.boton {
    color:black;
    
}


aside article {
    background-color: #000000;
    font-family: 'Montserrat', sans-serif;
    width: 100%;
    
}

aside article a {
    color:white;
    
}

footer {
  color: #000000; 
  font-size: 0.6em;
}


/*----------flexbox--------*/

.caja{
display:flex;
flex-direction:column;
justify-content: center;
align-content: center;

}

.cajitas {
    align-content: center
    
}

header {
    display: flex;
    justify-content: space-between;
    margin: 1em;
    margin-top: 2em;
    
}

figure img {
    display: flex;
    flex-direction: row;
    align-content: center;
    margin-right: 3em;
}

main section {
    text-align: left;
    
}

main section p {
    padding: 0.4em;
}

main section h2{
    margin: 0.5em;
    margin-left: 0em;
}

.boton {
    align-content: center;
    text-align: center;
    margin: 1em;
}


aside {
    display: flex;
    flex-direction: row;
    
}

aside article {
    text-align: center;
    }

aside article a {
    font-size: 0.6em;
    align-content: baseline;
}

footer {
    display: flex;
    align-content: center;
    margin: 1em;
    
}


@media screen and (min-width:50em) {
    
    main section {
        width: 50%;
    }
    
    h1 {
        margin-top: 5em;
    
    }
    
    .boton {
        text-align: left;
    }
    
}