* {
    box-sizing: border-box
  }

  body,
  html {
    font-family: "Manrope", sans-serif
  }

  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  html,
  li,
  ul {
    margin: 0;
    padding: 0
  }

  h2 {
    position: relative;
    display: inline-block;
    font-size: 2rem
  }

  h2:before {
    content: "";
    position: absolute;
    height: 20%;
    width: 100%;
    background: #f1c40f;
    top: 45%;
    z-index: -1
  }

  .content {
    width: 80%;
    max-width: 1100px;
    margin: auto
  }

  .content p,
  .content ul {
    font-size: 1.2rem;
    line-height: 2rem;
    font-weight: 500
  }

  .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: hsla(0, 0%, 100%, .3)
  }

  .introduction,
  .remerciements {
    padding: 3rem 0
  }

  .cover {
    min-height: 100vh;
    background: url(./imgs/bckg-cover.b68abce.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-position: 50%;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 0 1rem
  }

  .cover-header {
    position: relative;
    z-index: 2;
    height: 5rem
  }

  .cover-header,
  .cover-nav {
    display: flex;
    flex-direction: row
  }

  .cover-nav {
    align-items: center
  }

  .cover-nav--burger {
    width: 3rem;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 3rem;
    background: #000;
    border: 3px solid #f1c40f;
    font-size: 1.2rem
  }

  .cover-nav--title {
    font-weight: 700;
    font-size: 1.5rem;
    margin-left: 1rem;
    background: #000;
    color: #fff;
    border-bottom: 3px solid #f1c40f;
    padding: .2rem
  }

  .cover-nav--title a {
    color: #fff;
    text-decoration: none
  }

  .cover-nav--menu {
    position: absolute;
    top: 3.8rem;
    left: 4rem;
    display: none;
  }

  .cover-nav--menu.active {
    display: block;
  }

  .cover-nav--menu li,
  .cover-nav--menu ul {
    list-style-type: none;
    width: 21.3rem
  }

  .cover-nav--menu li {
    background: #000;
    padding: .3rem 0
  }

  .cover-nav--menu li:hover {
    background: #f1c40f
  }

  .cover-nav--menu li:hover a {
    color: #000
  }

  .cover-nav--menu li a {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    padding: 0 .5rem;
    width: 21rem;
    font-weight: 700
  }

  .cover-title {
    position: relative;
    height: calc(100vh - 5rem);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
  }

  .cover-title h1 {
    text-align: center;
    font-size: 3rem;
    border-bottom: 5px solid #f1c40f
  }

  @media(max-width:800px) {
    .cover-title h1 {
      border-color: transparent
    }
  }

  .cover-title h1 span {
    background: #000;
    color: #fff;
    padding: 0 1rem;
    display: inline-block;
    min-width: 20rem
  }

  .summary {
    background: url(./imgs/bckg-summary.1210586.jpg);
    background-size: cover;
    position: relative
  }

  .summary .content {
    position: relative;
    z-index: 2
  }

  .summary li {
    padding: 2rem 0
  }

  .summary li:hover .summary-number {
    color: #f1c40f;
    border-color: #f1c40f;
    background: #000
  }

  .summary li,
  .summary ul {
    list-style: none
  }

  .summary li>a {
    display: flex;
    flex-direction: row;
    text-decoration: none;
    align-items: center
  }

  @media(max-width:800px) {
    .summary li>a {
      flex-direction: column
    }

    .summary li>a .summary-number {
      margin-bottom: .3rem
    }
  }

  .summary-number {
    min-width: 10rem;
    height: 10rem;
    border-radius: 10rem;
    background: #fff;
    border: 5px solid #000;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 6rem;
    font-weight: 700;
    color: #000;
    transition: all .2s ease
  }

  .summary-text {
    width: auto;
    margin-left: 1rem;
    padding: .5rem 2rem;
    border-bottom: 5px solid #f1c40f
  }

  .footer,
  .summary-text {
    background: #000;
    color: #fff
  }

  .footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 0
  }

  .article-cover {
    height: 25rem;
    background-size: cover;
    background-attachment: fixed;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 0 1rem
  }

  .article-cover .cover-title {
    height: 20rem;
    align-self: center
  }

  .article-cover-navigation {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between
  }

  .article-cover-navigation a {
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.3rem;
    margin: .3rem 0;
    padding: .3rem;
    background: #000
  }

  .article-cover-navigation a:first-child {
    margin-right: .5rem
  }

  .article-cover-navigation a:hover {
    text-decoration: underline
  }

  .article-content {
    padding: 3rem 0
  }

  .figure-large {
    margin: .3rem 0;
    border: 5px solid #f1c40f;
    background: #f1c40f;
    text-align: center
  }

  .figure-large img {
    max-width: 100%
  }

  .figure-float {
    border: 5px solid #f1c40f;
    max-width: 50%;
    margin: .5rem
  }

  @media(max-width:800px) {
    .figure-float {
      width: 100%;
      max-width: -webkit-fit-content;
      max-width: -moz-fit-content;
      max-width: fit-content;
      display: block
    }
  }

  .figure-float-right {
    float: right
  }

  .figure-float-left {
    float: left
  }

  .youtube-player {
    border: 5px solid #f1c40f;
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    margin: .3rem 0
  }

  .soundcloud-player {
    margin: .3rem 0
  }

  .soundcloud-player iframe,
  .web-iframe iframe {
    border: 5px solid #f1c40f
  }

  .web-iframe iframe {
    width: 100%;
    min-height: 40rem
  }

  .web-iframe a {
    display: inline-block;
    background: #f1c40f;
    padding: .5rem 1rem;
    text-decoration: none;
    color: #000
  }

  .web-iframe a i {
    margin-right: .2rem
  }

  .block {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: .5rem
  }

  .block i {
    margin-right: .5rem
  }

  .block-info {
    background: #ffeaa7
  }

  .block-info i {
    color: #f0932b
  }

  .block-danger {
    background: #ff7675
  }

  .block-danger i {
    color: #c0392b
  }

  .nuxt-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    width: 0;
    opacity: 1;
    transition: width .1s, opacity .4s;
    background-color: #000;
    z-index: 999999
  }

  .nuxt-progress.nuxt-progress-notransition {
    transition: none
  }

  .nuxt-progress-failed {
    background-color: red
  }

  html {
    font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    word-spacing: 1px;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box
  }

  *,
  :after,
  :before {
    box-sizing: border-box;
    margin: 0
  }