@charset "UTF-8";

/* #Déclaration des fonts
================================================== */
@font-face {
  font-family: 'old-london-5yurcw';
  src: url('../fonts/font.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;

}

@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SFProDisplay-Black.woff2') format('woff2'),
       url('../fonts/SFProDisplay-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
}

/* #Basic Styles
================================================== */
  *, *:before, *:after {
    margin:0;padding:0;
    /* apply a natural box layout model to all elements */
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
  }
  body {
    background-color: #101010;
    background-image: url("../img/texture_noise_blue.jpg");
    background-attachment: fixed;
    background-repeat: repeat;
    font-family: 'SF Pro Display', sans-serif;
    font-size: 12px;
    line-height: normal;
    color: #363636;
    -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
    -webkit-text-size-adjust: 100%;
  }


  a, a:visited { color: #FFF; text-decoration: none; /*outline: 0;*/ }
  a:hover, a:focus { color: #FFF; }
  p a, p a:visited { line-height: inherit; }
  p { margin: 0 0 20px 0; }

  strong, b { font-weight: bold;}
  hr { border: solid #eaeaea; border-width: 1px 0 0; clear: both; height: 0; }

  h1 {
    color: #FFF;
    font-family: 'SF Pro Display', sans-serif;
    font-weight: 800; 
  }

  h2, h3 {
    color: #FFF;
    font-family: 'old-london-5yurcw', sans-serif;
    font-weight: 800; 
  }

  h1 a, h2 a, h3 a, { font-weight: inherit; }
  h1{font-size: 44px;margin-top:20px; margin-bottom:20px;line-height: 0.85em; letter-spacing: -0.02em}
  h2{font-size: 80px; margin-top:60px; margin-bottom:60px;}
  h3{font-size: 40px; margin-top:40px; margin-bottom:15px;}

  /* #Lists
================================================== */
  ul, ol { margin-bottom: 20px;  }
  ul { list-style: none outside; }
  ol { list-style: decimal; }
  ol, ul.square, ul.circle, ul.disc { margin-left: 20px; }
  ul.square { list-style: square outside; }
  ul.circle { list-style: circle outside; }
  ul.disc { list-style: disc outside; }

  ul ul, ul ol,
  ol ol, ol ul { margin: 4px 0 5px 30px; font-size: 90%;  }

  ul ul li, ul ol li,
  ol ol li, ol ul li { margin-bottom: 0px; }

  li {display: inline; margin-right: 30px; 
    -webkit-transition: all 0.2s ease; /* Safari and Chrome */
    -moz-transition: all 0.2s ease; /* Firefox */
    -ms-transition: all 0.2s ease; /* IE 9 */
    -o-transition: all 0.2s ease; /* Opera */
    transition: all 0.2s ease;}
  li a:hover  {border-bottom: solid 1px #FF0000; }
  li:hover {    -webkit-transform:scale(1.10); /* Safari and Chrome */
    -moz-transform:scale(1.10); /* Firefox */
    -ms-transform:scale(1.10); /* IE 9 */
    -o-transform:scale(1.10); /* Opera */
    transform:scale(1.10);}

  li a  {border-bottom: solid 0px rgba(0,0,0,0); padding-bottom:0px; } /* permet de définir la translation de couleur */

/* #Images
================================================== */
  img{display: block;}
  img.autowidth { max-width: 100%; height: auto; }

/* #Custom class
================================================== */
  .trans3 {-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
  .trans5 {-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-ms-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
  .fl{float: left;}
  .fr{float: right;}
  .clear{clear: both;display: block;overflow: hidden;visibility: hidden;width: 0;height: 0;}