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

html,body{
    width: 100%;
    height: 100%;
    background-color: #EDEDED;
}

img{
    width: 100%;
}


#cuerpo{
    width: 100%;
    margin: 0px auto;
    padding: 0px;
    background-color: #EDEDED;
}

#fijo{
    width: 100%;
    position: fixed;
    background-color: #EDEDED;
    z-index: 100;
}
header{
    width: 90%;
    margin: 0px auto;
	background-color: #EDEDED;
	margin-bottom: 20px;
}

header h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 30px;
    margin-top: 15px;
    
    
}

header h1 a{
    color: black;
    text-decoration: none;
    list-style: none;
}


header h1 a:hover{
    color: #A7A7A7;
}
        
.btn{
    width: 35px;
    height: 35px;
    position: absolute;
    top: 20px;
    right: 80px;
    display: block;
    cursor: pointer;
}
    
nav{
    width: 100%;
    display: none;
    background-color: black;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 140px;
    padding-bottom: 155px;
}
        
nav ul{
    display: block;
    text-align: center;
    
}
    
nav ul li{
    list-style: none;
    margin-bottom: 30px;
}
        
nav ul li a{
    margin-left: 0px;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 70px;
    color: #EDEDED;
    text-decoration: none;
}
        
nav ul li a:hover{
    color: #A7A7A7;
}



/*--INDEX--*/

#portada-index{
    position: relative;
    top: 70px;
}



/*--ABOUT--*/

.fo{
    position: relative;
    top: 50px;
}
.negro{
    background-color: black;
}

.blanco{
    color: white;
}

.espa{
    margin-top: 110px;
    margin-bottom: 110px;
}


#entrada{
    width: 90%;
    margin: 0px auto;
    margin-top: 60px;
}

#entrada article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 130px;
    line-height: 120px;
}

#entrada article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 23px;
    line-height: 32px;
    letter-spacing: 1px;
}

.e{
    margin-bottom: 50px;
}

#about{
    width: 90%;
    margin: 0px auto;
}

#about article h1{
    
    font-family: 'sharp_sans_display_no1bold';
    font-size: 130px;
    line-height: 120px;
}

#about article h2{
    
    font-family: 'sharp_sans_display_no1bold';
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 1px;
}

#about article p{
    
    font-family: 'sharp_sans_display_no1light';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
}

.pad{
    padding-right: 60px;
}

.yo{
    width: 500px;
    display: block;
    text-align: left;
    float: left;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 30px;
    text-decoration: none;
    padding: 0px;
    margin-top: 60px;
    
}
       
        
.yo:hover{
color: coral;
}

.cv{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: white;
    border-radius: 50px;
    color: black;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    text-decoration: none;
    padding: 10px;
    margin-top: 60px;
    
}
       
        
.cv:hover{
background-color: #A7A7A7;
}


.c{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: black;
    border-radius: 50px;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    text-decoration: none;
    padding: 10px;
    margin-top: 60px;
    
}
       
        
.c:hover{
background-color: #A7A7A7;
}

.web{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: black;
    border-radius: 50px;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    text-decoration: none;
    padding: 10px;
    margin-top: 0px;
    
}
       
        
.web:hover{
background-color: #A7A7A7;
}


/*--WORKS--*/
#works div{
overflow: hidden;
height: auto;
}

#works div a{
    display: block;
        }
#works div img:hover{
            animation-name: agrandar;
            animation-duration: 0.8s;
            animation-iteration-count: 1;
            animation-timing-function: ease;
            animation-fill-mode: forwards;
            
        }
        @keyframes agrandar{
            from{
                transform: scale(1.0);
            }
            to{
                transform: scale(2.0);
            }
        }

#works{
    width: 90%;
    margin: 0px auto;
    padding-top: 100px;
    padding-bottom: 100px;
}

.din{
   padding: 10px; 
}


/*--TRABAJOS--*/

.bot{
    padding-bottom: 20px;
}

#trabajo{
    width: 90%;
    margin: 0px auto;
    padding-top: 50px;
    padding-bottom: 50px;
}

#trabajo article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 100px;
    line-height: 100px;
    letter-spacing: 1px;
}

#trabajo article h2{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
    
}

#trabajo article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
}

.pa{
    padding-right: 270px;
}

.no{
  color: #EDEDED;  
}

.ver{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: black;
    border-radius: 50px;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 16px;
    text-decoration: none;
    padding: 10px;
    margin-top: 20px;
    
}
       
        
.ver:hover{
background-color: #A7A7A7;
}

#port{
    width: 90%;
    margin: 0px auto;
    padding: 0px;
    padding-bottom: 50px;
}

.w{
    padding-right: 10px;
}

.r{
    padding-left: 10px;
}

.movil{
    display: none;
}

/*--CONTACTO--*/


#contact{
    width: 100%;
    margin: 0px auto;
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: black;
}

#con{
    width: 90%;
    margin: 0px auto;
    padding: 0px;
    background-color: black;
}

.di{
    padding-left: 10px;
}

#con img{
    width: 30px;
    justify-content: flex-start;
}



#contact div h1{
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 40px;
    line-height: 40px;
}

#contact div ul li a{
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    line-height: 24px;
}

#contact div ul li a:hover{
    color: #A7A7A7;
}

#contact div h2{
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 30px;
    line-height: 39px;
}



#contact div p{
    color: white;
    font-family: 'sharp_sans_display_no1light';
    font-size: 18px;
    line-height: 28px;
}

#contact div a{
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    text-decoration: none;
    list-style: none;
    margin-left: 10px;
    top: -20px;
}

#contact div a:hover{
    color: #A7A7A7;
   
}

.flo{
    float: left;
}



/*--FOOTER--*/




/*--COLUMNAS--------------------------*/

.flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
        
    .col-1{width: 8.33%;}
    .col-2{width: 16.66%;}
    .col-3{width: 25%;}
    .col-4{width: 33.33%;}
    .col-5{width: 41.66%;}
    .col-6{width: 50%;}
    .col-7{width: 58.33%;}
    .col-8{width: 66.66%;}
    .col-9{width: 75%;}
    .col-10{width: 83.33%;}
    .col-11{width: 91.66%;}
    .col-12{width: 100%;}



/*--TIPOGRAFÍA------------------------*/

@font-face {
    font-family: 'sharp_sans_display_no1bold';
    src: url('sharpsansdisplayno1-bold-webfont.eot');
    src: url('sharpsansdisplayno1-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('sharpsansdisplayno1-bold-webfont.woff') format('woff'),
         url('sharpsansdisplayno1-bold-webfont.ttf') format('truetype'),
         url('sharpsansdisplayno1-bold-webfont.svg#sharp_sans_display_no1bold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sharp_sans_display_no1light';
    src: url('sharpsansd1-light-webfont.eot');
    src: url('sharpsansd1-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('sharpsansd1-light-webfont.woff') format('woff'),
         url('sharpsansd1-light-webfont.ttf') format('truetype'),
         url('sharpsansd1-light-webfont.svg#sharp_sans_display_no1light') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*--TABLET----------------------------*/

@media screen and (max-width: 1024px){
    
    
    .col-t-1{width: 8.33%;}
    .col-t-2{width: 16.66%;}
    .col-t-3{width: 25%;}
    .col-t-4{width: 33.33%;}
    .col-t-5{width: 41.66%;}
    .col-t-6{width: 50%;}
    .col-t-7{width: 58.33%;}
    .col-t-8{width: 66.66%;}
    .col-t-9{width: 75%;}
    .col-t-10{width: 83.33%;}
    .col-t-11{width: 91.66%;}
    .col-t-12{width: 100%;}
    
    

nav{
    width: 100%;
    display: none;
    background-color: black;
    margin-top: 20px;
    margin-bottom: 0px;
    padding-top: 140px;
    padding-bottom: 140px;
}
        
nav ul{
    display: block;
    text-align: center;
    
}
    
nav ul li{
    list-style: none;
    margin-bottom: 30px;
}
        
nav ul li a{
    margin-left: 0px;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 70px;
    color: #EDEDED;
    text-decoration: none;
}
        
nav ul li a:hover{
    color: #A7A7A7;
}
    
.btn{
    width: 45px;
    height: 45px;
    position: absolute;
    top: 15px;
    right: 40px;
    display: block;
    cursor: pointer;
}

    
 /*--Index tablet--*/

#portada-index{
    position: relative;
    top: 80px;
}

.fo{
    position: relative;
    top: 80px;
}

/*--About tablet--*/
.negro{
    background-color: black;
}

.espa{
    margin-top: 30px;
    margin-bottom: 30px;
}
    
#entrada{
    width: 90%;
    margin: 0px auto;
    margin-top: 70px;
}

#entrada article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 150px;
    line-height: 120px;
}

#entrada article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 23px;
    line-height: 32px;
    letter-spacing: 1px;
}

.e{
    margin-bottom: 50px;
}


#about{
    width: 90%;
    margin: 0px auto;
    margin-top: 70px;
    padding-top: 50px;
    padding-bottom: 50px;
}
    


#about article h1{
    
    font-family: 'sharp_sans_display_no1bold';
    font-size: 130px;
    line-height: 120px;
}
    
.blanco{
       color: white;
    }

#about article h2{
    
    font-family: 'sharp_sans_display_no1bold';
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 1px;
}

#about article p{
    
    font-family: 'sharp_sans_display_no1light';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
}

.pad{
    padding-right: 0px;
}
    
   

/*--Works Tablet--*/
#trabajo{
    width: 90%;
    margin: 0px auto;
    padding: 0px;
}

#trabajo article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 1px;
}

#trabajo article h2{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
    
}

#trabajo article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 1px;
}

.pa{
    padding-right: 0px;
}

.no{
  color: #EDEDED;  
}

.ver{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: black;
    border-radius: 50px;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 16px;
    text-decoration: none;
    padding: 10px;
    margin-top: 20px;
    
}
       
        
.ver:hover{
background-color: #A7A7A7;
}

.ocultar{
        display: none;
}
    
.espa{
    margin-top: 30px;
    margin-bottom: 20px;
}

.w{
    padding-right: 0px;
}

.r{
    padding-left: 0px;
}
    
.movil{
    display: none;
}
    
    
    
    
}

/*--Contacto tablet--*/




/*--Footer tablet--*/




/*--MÓVIL------------------------------*/
    
@media screen and (max-width:640px){
    
    .col-m-1{width: 8.33%;}
    .col-m-2{width: 16.66%;}
    .col-m-3{width: 25%;}
    .col-m-4{width: 33.33%;}
    .col-m-5{width: 41.66%;}
    .col-m-6{width: 50%;}
    .col-m-7{width: 58.33%;}
    .col-m-8{width: 66.66%;}
    .col-m-9{width: 75%;}
    .col-m-10{width: 83.33%;}
    .col-m-11{width: 91.66%;}
    .col-m-12{width: 100%;}
    
 

    
 /*--Index móvil--*/

.btn{
    width: 35px;
    height: 35px;
    position: absolute;
    top: 20px;
    right: 30px;
    display: block;
    cursor: pointer;
}
    
#fijo{
    width: 100%;
    position: fixed;
    background-color: #EDEDED;
    z-index: 100;
}
    
nav{
    width: 100%;
    display: none;
    background-color: black;
    margin-top: 20px;
    margin-bottom: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
}
        
nav ul{
    display: block;
    text-align: center;
    
}
    
nav ul li{
    list-style: none;
    margin-bottom: 30px;
}
        
nav ul li a{
    margin-left: 0px;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 40px;
    color: #EDEDED;
    text-decoration: none;
}
        
nav ul li a:hover{
    color: #A7A7A7;
}



/*--About móvil--*/
.fo{
    position: relative;
    top: 80px;
}




/*--Works móvil--*/
.din{
   padding: 5px; 
}

.espa{
    margin-top: 30px;
    margin-bottom: 30px;
}
    
.e{
    margin-bottom: 0px;
}
 
#entrada{
    width: 90%;
    margin: 0px auto;
    margin-top: 70px;
    padding-bottom: 40px;
}

#entrada article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 80px;
    line-height: 120px;
}

#entrada article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 1px;
}
    
.cv{
    width: 160px;
    display: block;
    text-align: center;
    float: left;
    background-color: white;
    border-radius: 50px;
    color: black;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 16px;
    text-decoration: none;
    padding: 10px;
    margin-top: 30px;
    margin-bottom: 30px;
    
}

#about{
    width: 90%;
    margin: 0px auto;
    margin-top: 0px;
    padding-top: 30px;
    padding-bottom: 10px;
}

#about article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 60px;
    line-height: 120px;
}

#about article h2{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 1px;
}

#about article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
}

.pad{
    padding-right: 0px;
}
    
    .oc{
        display: block;
    }
    
#works{
    width: 90%;
    margin: 0px auto;
    padding-top: 50px;
    padding-bottom: 50px;
}

#trabajo{
    width: 90%;
    margin: 0px auto;
    padding: 0px;
}

#trabajo article h1{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 1px;
}

#trabajo article h2{
    font-family: 'sharp_sans_display_no1bold';
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 1px;
    
}

#trabajo article p{
    font-family: 'sharp_sans_display_no1light';
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 1px;
}

.pa{
    padding-right: 0px;
}

.no{
  color: #EDEDED;  
}

.ver{
    width: 180px;
    display: block;
    text-align: center;
    float: left;
    background-color: black;
    border-radius: 50px;
    color: white;
    font-family: 'sharp_sans_display_no1bold';
    font-size: 16px;
    text-decoration: none;
    padding: 10px;
    margin-top: 20px;
    
}
    
.ver:hover{
background-color: #A7A7A7;
}

.ocultar{
        display: none;
}
    
.espa{
    margin-top: 20px;
    margin-bottom: 10px;
}


.w{
    padding-right: 0px;
}

.r{
    padding-left: 0px;
}
    
.de{
    display: none;
    }
    
.movil{
    display: block;
}
/*--Contacto móvil--*/

.di{
    padding-left: 0px;
}


}
/*--Footer móvil--*/