@font-face {
    font-family: 'authentic_hiltonregular';
    src: url('fonts/authentic_hilton-webfont.eot');
    src: url('fonts/authentic_hilton-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/authentic_hilton-webfont.woff2') format('woff2'),
         url('fonts/authentic_hilton-webfont.woff') format('woff'),
         url('fonts/authentic_hilton-webfont.ttf') format('truetype'),
         url('fonts/authentic_hilton-webfont.svg#authentic_hiltonregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'chaletmedium';
    src: url('fonts/chaletparisnineteensixty-webfont.eot');
    src: url('fonts/chaletparisnineteensixty-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/chaletparisnineteensixty-webfont.woff2') format('woff2'),
         url('fonts/chaletparisnineteensixty-webfont.woff') format('woff'),
         url('fonts/chaletparisnineteensixty-webfont.ttf') format('truetype'),
         url('fonts/chaletparisnineteensixty-webfont.svg#chaletmedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{
    background:#525354;
    color:white;
    font-family: 'chaletmedium';
    font-size:16px;
}
header{
    background:#33c4e8;
    border-bottom:2px solid white;
    
}
ul{
    list-style: none;
    margin:0;
    padding:0;
}
h2{
    font-size:92px;
    font-family:"authentic_hiltonregular",Arial,sans-serif;
}
h3{
    font-size:53px;
    font-family:"authentic_hiltonregular",Arial,sans-serif;
}
h4{
    font-size:28px;
    
}
h1,h2,h3,h4{
    color:#33c4e8;
    
}
p span{
    font-family: Arial;
    text-transform: uppercase;
    margin-top:10px;
}
#wrap_header{
    background:url(design/header_bcg.png) no-repeat;
    height:142px;
    text-align:center;
}

#wrap_header img{
    
    max-width:100%;
    max-height:142px;
    
}

#right_side{
    background:#414142;
    padding-top:15px;
    padding-bottom:15px;
}

.photo_williambamps img{
    max-width: 100%;
}

.bar_skill{
    background:#969998;
    height:12px;
}
.skill_color{
    background:#33c4e8;
    height:12px;
    
}

.skill_95{
    width:95%;
}

.skill_90{
    width:90%;
}

.skill_80{
    width:80%;
}

.skill_70{
    width:70%;
}

.skill_60{
    width:60%;
}

.skill_50{
    width:50%;
}

.intro{
    
    font-size:2em;
}



.photo_williambamps{
    margin:20px auto;
}
#me_caract{
    background:#514f50;
    padding:40px 10px;
}

@media screen and (max-width: 600px) {
  .intro{
    font-size:1.1em;   
      margin-bottom:1em;
  }
}