* { margin: 0; 
    padding: 0; 
    box-sizing: border-box;
}

body {
    font-family: 'Raleway', sans-serif;
    background-color: rgb(222, 222, 222);
    color:#707173   
}


a {text-decoration: none;   
    
}

#arriba { display: flex;
              background-image: url(tumblr_nuj9zwCwCd1r6ljjno1_1280.jpg);
              width: 100%;
              align-content: center;
}
header { display: flex;
         justify-content: space-between;
         align-items: center; 
    }
.menu { padding: 25px;
        margin-top: -55px;
   
}

.menu nav ul li a  { font-weight: 600;
    
}


nav {   margin: auto;
        margin-top: 5%;
        flex-basis: calc(100%-8em);
                
    }
li  {
    display: inline-block;
    margin: 0;
    padding: :60px 60px;
    color: #fff;
    
    
}
nav ul {
    list-style: none;
    border-radius:0px; 
}
nav ul li {
    margin-bottom: 0.5em;
}
nav ul li a {
    
    background-color: #fce5df;
    color: #58585a;
    padding: 10px 20px;
    display: block;
    width: 205px;
    border-radius:0px;
    text-align: center;
    font-size: 15px;
    font-weight: 400;
}
nav ul li a:hover {
    color:#ffffff;
    background-color: gray;
}
nav ul li a:active {
    color:#81878b;
    background-color: #818486;
    
}


footer { display: flex;
    background-color: #fce5df;
    text-align: center;
    align-items: center;
    
    }
footer img { max-width: 70%;
             margin-left: 20px;
    }
    
footer p { font-size: 8pt;
           align-items: center;
           text-align: center;
           margin-right: 20px;
}








@media only screen and (max-width: 18em){
    #arriba { display: flex;
                flex-wrap: wrap;
                align-items: center;
                }
    
    header { align-items: center;
        
    }  
    
    .menu { align-items: center;
            
    }
    footer {display: none;
        
    }
     
}



@media only screen and (max-width: 30em){
   #arriba { display: flex;
                flex-wrap: wrap;
                align-items: center;
                }
    
    header { margin: auto;
             image-orientation: center;
            
    }  
    
    .menu { margin-left: auto;  
            text-align: center;
    }
    
    footer {display: none;
        
    }
     
}



@media only screen and (max-width: 90em){
    #arriba { display: flex;
                 align-items: center;     
    }
    
    header { display: flex;
            justify-content: space-between;
            align-items: center; 
    }
    
    
    nav { 
        margin: 0;
        margin-top: 5%;
        flex-basis: calc(100%-8em);            
    }
}


#contenedor2 {
    background-color: white;
    max-width: 75em;   
    width: 75%;
    margin: auto;
    margin-top: 20px;

}


h1 {
    font-size: 200%;
    color:lightcoral;
    font-family: 'Raleway', sans-serif;;
}

h2 {
    font-size: 150%;
    color:lightcoral;
    margin-top: 0.5em;
    font-family: 'Raleway', sans-serif;;
}

h3 {
    font-size:100%;
    color:grey;
    font-weight:lighter;
    font-family: 'Raleway', sans-serif;;
}

h4 {
    font-size: 100%;
    font-weight:lighter;
    font-family: 'Raleway', sans-serif;;
}

h5 {
    font-size: 75%;
    font-weight:lighter;
    font-family: 'Raleway', sans-serif;;
}


h6 {
    font-size: 100%;
    font-weight:bold;
    font-family: 'Raleway', sans-serif;;
    
}


h7 {
    font-size: 130%;
    color:lightcoral;
    margin-top: 0.5em;
    font-family: 'Raleway', sans-serif;;
    font-weight: lighter;
}


p {
    font-size: 70%;
}


.nav ul {
  list-style: none;
  background-color:gainsboro;
  text-align: center;
  padding: 0;
  margin: 0;
}
.nav li {
  font-family: 'Raleway', sans-serif;
  font-size: 1em;
  line-height: 30px;
  height: 40px;
  border-bottom: 0px solid #888;
}
 
.nav a {
  text-decoration: none;
  color: #fff;
  display: block;
  transition: .3s 
      background-color;
}
 
.nav ul li a { color:#fff;
              text-decoration: underline;
              font-weight: 700;
    
}

.nav a:hover {
  background-color:#8be2c6;
}
 
.nav a.active {
  background-color: #fff;
  color: #444;
  cursor: default;
}


.nav ul {
  list-style: none;
  background-color:gainsboro;
  text-align: center;
  padding: 0;
  margin: 0;
}
.nav li {
  ;
  font-size: 1em;
  line-height: 30px;
  height: 40px;
  border-bottom: 0px solid #888;
}
 
.nav a {
  text-decoration: none;
  color: #fff;
  display: block;
  transition: .3s background-color;
}
 
.nav a:hover {
  background-color:#8be2c6;
}
 
.nav a.active {
  background-color: #fff;
  color: #444;
  cursor: default;
}
 



@media only screen and (max-width: 500px){
    .responsive {
        width: 100%;
    }
}


.clearfix:after {
    content: "";
    display: table;
    clear: both;
}





@media screen and (min-width: 600px) {
  .nav li {
    width: 100px;
    border-bottom: none;
    height: 40px;
    line-height: 40px;
    font-size: 1em;
  }
 
.nav li {
    display: inline-block;
    margin-right: -4px;
  }


#boton {
        
        color:#ffffff;
        background-color: gray;
        
    }    
    

#titulo1 { color: #707173;
             font-size: 220%;
             text-decoration: underline;


            margin-left: 18%;
            margin-right: 18%; 
               text-align: center;}
    


              {font-weight: 500;
              font-size: 115%;
    
}