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

* {box-sizing: border-box;}
	

	body {
    background-image: url(FONDO.jpg);
    background-repeat:no-repeat;
    background-position: center;
    background-size: cover;
    font-family:"Ubuntu", sans-serif;
    }

header, article, footer {
    padding: 1em;   
}


	.logo {margin:auto;
        width: 960px;}
	

	header {background-color:#34b992; width:100%; height:130px; }

footer {clear: both;}

  
header h1 {
    font-size: 50px;
    float: left;
    margin-top: 20px;
    font-weight: 700;
    color:#dee4c3;
    height: 100%;
    display: block;
    border-bottom: #dee4c3 5px solid;
    }


header nav ul {list-style: none;
    float:right;
width: auto;}

header nav ul li {display: inline-block;
   margin-top: 50px;
margin-right: 20px;
} 

header nav ul li a {
    display: block;
    background-color: #ece6b4;
    color: #35b996;
    padding: 0 20px;
    text-decoration: none;
    line-height: 2em;
    font-weight: 700;
        }

header nav ul li a:hover {background-color:#dfe19f;
                        color:#5cc27c;
                        font-weight: 700;
box-shadow: 3px 3px 0px rgba(0,0,0,0.2)}



article img {width: 400px;
    float: left;
    margin-left: 60px;
    margin-bottom: 20px;
   }

.recuadro {
    margin: auto;
    padding: 50px;
    width: 710px;
    height: 500px;
    position: relative;
        
}

.bloques{
    float: left;
     
}
            
.bloque1 {display: block;
            background-color:#35b996;
            margin-bottom: 2px;
           margin: 20px;
    width: 260px;
    margin-top: 2px;
}

.bloque1 p {color: #ebe6c3;
    font-weight: 700;
    font-size: 20px; 
    text-align: left;
    padding: 10px;
    margin: 0px;
    
}
	
.bloque2 {display: block;
            background-color:#ebe6c3;
            margin: 20px;
width:260px;}

.bloque2 p {color: #35b996;
    font-weight: 700;
    font-size: 18px; 
    text-align: left;
    padding: 10px;
    margin: 2px;
    
}

.bloque3 ul {list-style:none;
        display: block;
        background-color: #ebe6c3;
        margin: 20px;
        padding:10px 10px;
          width:260px;}
                
.bloque3 ul li {color: #64c3a4;
    font-weight: 700;
    font-size: 14px; 
    text-align: left;
    line-height: 16px;
    margin: 2px;
    margin-bottom: 5px;
    margin-top: 3px;
    border-bottom: 1px solid  #64c3a4;}

.portfolio {
    display: block;
    margin-bottom: 3px;
    margin-left:20px;
    height: 40px;
    background-color:#ece6b4;
    float: left;
    
}
                
.portfolio a {color:#35b996;
    font-weight: 700;
    font-size: 19px; 
    text-align: left;
    line-height: 36px;
    padding: 10px 10px;
    margin: 3 px;
    text-decoration: none;}

.portfolio a:hover {background-color: #b9d8ae;
    color:#ebe6c2;
    font-weight: 700;
    line-height: 30px;
    box-shadow: 4px 4px 0px rgba(0,0,0,0.2);
}

	
footer {background-color: #9ed19b;
       height:70px;
        margin: 30px; 50px;
    line-height: 18px;
    padding: 10px;
    text-align: center;
}

footer p {font-size:12px;}