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

#logo {
    margin-bottom: 1em;
    max-width: 170px;
}

img {
    max-width: 100%
    height: auto;
    
}

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

a {
    text-decoration: none;
    
}





h1 {margin-bottom: 1em;
    color: #ff8080
        
}

h2 a { color: #81878b;

}

h2, h3, p {
    margin-bottom: 1em;
    color: #81878b;
}

#contenedor {
    
    max-width: 75em;   
    width: 100%;
    margin: auto;
    text-align: center

}

header {
    padding: 1 em;
    background-color: none;
    margin: 0px;
    display: block;
    text-align: center;

}

#boton {  color:#ffffff;
    background-color: #5f5d5d;
    
}

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: #818486;
    color:#ffffff;
    padding: 10px 20px;
    display: block;
    width: 200px;
    border-radius:0px;
    border-bottom: solid #ffff 2px ;
}

nav ul li a:hover {
    color:#ffffff;
    background-color: #5f5d5d;
}

nav ul li a:active {
    color:#81878b;
    background-color: #818486;
    
}


p {
    color: #626262
}
#info{
    color: #4a4a4a
    
       
        }

main {
    
    text-align : justify;  
}

h4 {
    
    color: #535353;
    
    
}

.img #logouba { max-width: 110px;
    
}


@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;
  }


    
    

    
div.img {
    border: 0px;
}

div.img:hover {
    border: 0px;
}
 
div.img img {
    width: 90%;
    height: auto;
}
    
div.desc {
    padding: 10px;
    text-align: center;
}

* {
    box-sizing: border-box;
}

.responsive {
    padding: 0 6px;
    float: left;
    width: 24.99999%;
}


@media only screen and (max-width: 700px){
    .responsive {
        width: 49.99999%;
        margin: 6px 0;
    }
}

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


.clearfix:after {
    content: "";
    display: table;
    clear: both;
}
    
    .responsive,p {
        font-size: 7pt;

        
            }

    
    
footer {
    padding: 1 em;
    background-color:white;
    text-align: center;
    margin-top: 30px;
    
    }