body {
	background-color: black;
	font-family: 'Inter';
	font-size: 1.7vw;
  }

/* Header */
    .header {
      overflow: hidden;
      background-color: #5B5F7F;
      padding: 1.4vw 1.6vw;
      position: sticky;
      top: 0;
      z-index: 100;   /* No overlap */
      }
      
      .header a {
      float: left;
      color: white;
      text-align: center;
      padding: 1vw;
      text-decoration: none;
      font-size: 1.7vw;
      line-height: 2vw;
      border-radius: 1vw;
      font-family: 'Inter';font-size: 1.5vw;
      }
      
      .header a.logo {
      font-size: 2vw;
      font-style: italic;
      font-weight: bolder;
      }
      
      .header a:hover {
      background-color: #ddd;
      color: black;
      }
    
      .header a.active {
      background-color: white;
      color: red;
      }
      
      .header-right {
      float: right;
      }


/* Footer */
    footer {
      overflow: hidden;
      background-image: linear-gradient(to right, #2B28B0 , #010037);
      padding: 1.4vw 10vw;
      float: left;
    }

    .youtube {
      text-align: center;
      color: #ffffff;
    }


/* Bouton Accueil couleurs stonk */    
    .rainbow-button {
      width:calc(6vw + 0.5vw);
      height:calc(2vw + 0.2vw);
      background-image: linear-gradient(90deg, #00C0FF 0%, #FFCF00 49%, #FC4F4F 80%, #00C0FF 100%);
      border-radius:1vw;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:3vw;
    }
    .rainbow-button:after {
      content:attr(alt);
      width:9vw;
      height:3vw;
      background-color:#191919;
      border-radius: 0.5vw;
      color: #ffffff;
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .rainbow-button:hover {
      animation:slidebg 4s linear infinite;
    }

    @keyframes slidebg {
      to {
      background-position:9vw;
      }
    }
















/* Breadcrumb */
ul.breadcrumb {
  padding: 0.6vw 1.2vw;
  background-color: rgb(32, 37, 110);
}


ul.breadcrumb li {
  display: inline-block;
  font-size: 1.4vw;
  color: white;
}


ul.breadcrumb li+li:before {
  padding: 0.6vw;
  color: yellow;
  content: "/\00a0";
}


ul.breadcrumb li a {
  color: yellowgreen;
  text-decoration: none;
}


ul.breadcrumb li a:hover {
  color: white;
  text-decoration: underline;
}

