/**************REECRITURE CSS ALEROUX****************************
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@@@@@%%%%%%%%%%%%%&@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@%%%%%%%%%%%%%%%%%%%%#(/**(@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@%%%%%%%%%%%%%%%%%(        #%%%%%%%@@@@@@@@@@@@@@@
@@@@@@@@@@@@@&%%%%%%%%%%%%%%%(         ,%%%%%%%%%%%%@@@@@@@@@@@@@
@@@@@@@@@@@%%%%%%%%%%%%%%%/           %%%%%%%%%%%%%%%%&@@@@@@@@@@
@@@@@@@@@%%%%%%%%%%%%%%#             %%%%%%%%%%%%%%%%%%%@@@@@@@@@
@@@@@@@%%%%%%%%%%%%%%%              (%%%%%%%%%%%%%%%%%%%%%@@@@@@@
@@@@@@%%%%%%%%%%%%%%/               %%%%%%%%%%%%%%%%%%%%%%%@@@@@@
@@@@@%%%%%%%%%%%%%%                   /%%%%%%%%%%%%%%%%%%%%%&@@@@
@@@@%%%%%%%%%%%%%%                         #%%%%%%%%%%%%%%%%%&@@@
@@@%%%%%%%%%%%%%%.                           *%%%%%%%%%%%%%%%%@@@
@@@%%%%%%%%%%%%%(                              %%%%%%%%%%%%%%%%@@
@@%%%%%%%%%%%%%%                                #%%%%%%%%%%%%%%@@
@@%%%%%%%%%%%%%/                                 #%%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%.                                 .%%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%.                                  %%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%/                                  %%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%%                                 .%%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%%#                                #%%%%%%%%%%%%%&@
@@&%%%%%%%%%%%%%%#                              #%%%%%%%%%%%%%%@@
@@@%%%%%%%%%%%%%%%#                            (%%%%%%%%%%%%%%&@@
@@@@%%%%%%%%%%%%%%%%.                         %%%%%%%%%%%%%%%%@@@
@@@@&%%%%%%%%%%%%%%%%%,                     %%%%%%%%%%%%%%%%%@@@@
@@@@@@%%%%%%%%%%%%%%%%%%%/              ,#%%%%%%%%%%%%%%%%%%@@@@@
@@@@@@@%%%%%%%%%%%%%%%%%%%%%%%(/***(#%%%%%%%%%%%%%%%%%%%%%%@@@@@@
@@@@@@@@&%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@@@@@
@@@@@@@@@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@@@@@@@
@@@@@@@@@@@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@@@@@@@@@
@@@@@@@@@@@@@@&%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%&@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@&%%%%%%%%%%%%%%%%%%%%@@@@@@@@@@@@@@@@@@@@@@
****************************************************************/
.otc {
  position: relative;
  width: 320px;
  margin: 0 auto;
}

.otc fieldset {
  border: 0;
  padding: 0;
  margin: 0;
}

.otc fieldset div {
  display: flex;
  align-items: center;
  justify-content: center
}

.otc legend {
  margin: 0 auto 1em;
  color: #fff;
  font-weight: bold;
}

input[type="text"] {
  width: .86em;
  line-height: 1;
  margin: .1em;
  padding: 8px 0 4px;
  font-size: 2.65em;
  text-align: center;
  appearance: textfield;
  -webkit-appearance: textfield;
  border: 0;
  color: #073A39;
  border-radius: 6px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* 2 groups of 3 items */
input[type="text"]:nth-child(n+4) {
  order: 2;
}
.otc div::before {
  content: '';
  height: 2px;
  width: 12px;
  margin: 0 .25em;
  order: 1;
  background: #fff;
  border-radius: 2px;
  opacity: .4;
}

.otc label {
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}


@font-face {
    font-family: Anton;
    src: url(Anton-Regular.ttf) format("truetype");
}
input[type=checkbox] {
  position: absolute;
  text-indent: -9999px;
  opacity: 0;
}
a.btn.btn-default.bt-noel {
    background: #E60000;
    color: #fff;
}
a.btn.btn-default.bt-noel:hover {
    background: #820000;
    color: #fff;
}
.col-md-3.right {
    text-align: right;
    margin-bottom: 20px;
}
.col-md-9.left {
    text-align: left;
    margin-bottom: 20px;
}
.right img {
    width: 150px;
    position: relative;
    margin: -90px 10px;
}
.modal-body input {
	padding: 10px;
    width: 60px;
    height: 70px;
    border: 1px solid #E60000;
    border-radius: 3px;
    margin-bottom: 10px;
    text-transform: uppercase;
    margin-top: 10px;
    box-sizing: border-box;
    color: #E60000;
    letter-spacing: 10px;
    box-shadow: inset 4px 4px 2px 0px #e6000024;
    text-align: center!important;
    font-size: 30px;
    font-weight: 700;
}
.jumbotron {
  background-color: transparent!important;
}
span.badge.badge-pill.badge-primary.badge-on-image {
    margin: 0 auto;
    text-align: center;
    display: inline;
    position: sticky;
    color: #ffffff !important;
    background: #E60000 !important;
}
.badge p {
    color: #fff !important;
}
.board {
  /*display: grid;*/
  grid-template-columns: repeat(6, 64px);
  grid-auto-rows: 64px;
  margin: auto;
  order: 2;
  background: rgba(0, 0, 0, 0.3);
  padding: 1rem;
  justify-content: center;
}

.number-box {
  display: flex;
}

.number-box label {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  font-size: 2.5rem;
  color: #fff;
  background: #f1c40f;
  border-radius: 50%;
  transform: scale(0.8);
  transition: 0.3s;
  transition-timing-function: cubic-bezier(.86, -0.41, .38, 1.48);
  position: relative;
  cursor: pointer;
}

.number-box input:checked {
  counter-increment: numbers;
}

.number-box label::before {
  position: absolute;
  content: "";
  left: 0;
  top: calc(50% - 4px);
  height: 8px;
  width: 0;
  background: rgba(255, 255, 255, 0.5);
  transition: 0.3s;
}

.number-box input:checked+label {
  background: #E60000;
  transform: scale(1);
  font-weight: bold;
}

.number-box input:checked+label::before {
  width: 64px;
}

.count {
  order: 1;
  color: white;
  font-size: 1.5rem;
  font-weight: 100;
  margin-top: 1rem;
}

.count::after {
  content: counter(numbers);
}

.reglement {
  margin-top: 100px;
}

.selection-du-jour {
  position: relative;
  text-align: center;
  margin: 0 auto;
  width: 260px;
  border: none;
}

.selection-du-jour:hover {
  position: relative;
  text-align: center;
  border: none;
  -webkit-animation: changeColor 7.77s infinite;
  -moz-animation: changeColor 7.77s infinite;
  -o-animation: changeColor 7.77s infinite;
  animation: changeColor 7.77s infinite;
}

.selection-du-jour:before,
.selection-du-jour:after {
  content: '';
  position: absolute;
  left: 26px;
  margin-top: -6px;
  width: 210px !important;
  height: 158px !important;
  border-radius: 17px;
  background: linear-gradient(45deg, #fb0094, #0000ff, #00ff00, #ffff00, #ff0000, #fb0094,
      #0000ff, #00ff00, #ffff00, #ff0000);
  background-size: 400%;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: -1;
  animation: roll 20s linear infinite;
}

@keyframes roll {
  0% {
    background-position: 0 0;
  }

  50% {
    background-position: 400% 0;
  }

  100% {
    background-position: 0 0;
  }
}

.selection-du-jour:after {
  margin-top: -150px;
  filter: blur(20px);
}

.effect {
  -webkit-animation: infinite fadeInFromNone 7.77s ease-out;
  -moz-animation: infinite fadeInFromNone 7.77s ease-out;
  -o-animation: infinite fadeInFromNone 7.77s ease-out;
  animation: infinite fadeInFromNone 7.77s ease-out;
}

@-webkit-keyframes fadeInFromNone {
  0% {
    display: none;
    filter: grayscale(100%);
    opacity: .20;
  }

  1% {
    display: block;
    filter: grayscale(77%);
    opacity: 0.50;
  }

  100% {
    display: block;
    filter: grayscale(0);
    opacity: 1;
  }
}

@-moz-keyframes fadeInFromNone {
  0% {
    display: none;
    filter: grayscale(100%);
    opacity: .20;
  }

  1% {
    display: block;
    filter: grayscale(77%);
    opacity: 0.50;
  }

  100% {
    display: block;
    filter: grayscale(0);
    opacity: 1;
  }
}

@-o-keyframes fadeInFromNone {
  0% {
    display: none;
    filter: grayscale(100%);
    opacity: .20;
  }

  1% {
    display: block;
    filter: grayscale(77%);
    opacity: 0.50;
  }

  100% {
    display: block;
    filter: grayscale(0);
    opacity: 1;
  }
}

@keyframes fadeInFromNone {
  0% {
    display: none;
    filter: grayscale(100%);
    opacity: .20;
  }

  1% {
    display: block;
    filter: grayscale(77%);
    opacity: 0.50;
  }

  100% {
    display: block;
    filter: grayscale(0);
    opacity: 1;
  }
}

.badge {
  color: #fff !important;
  background-color: #e60000 !important;
  box-shadow: 2px 2px 4px 1px rgb(0 0 0 / 36%) !important;
}

.navbar-inverse {
  border-bottom: 3px solid #a61d1b !important;
  height: 60px !important;
  padding-top: 5px;
  box-shadow: 0 3px 3px rgb(0 0 0 / 5%) !important;
  background-color: #000000e3 !important;
  z-index: 999;
  /*
  -webkit-animation: changeColor 7.77s infinite;
  -moz-animation:    changeColor 7.77s infinite;
  -o-animation:      changeColor 7.77s infinite;
  animation:         changeColor 7.77s infinite;
  */
}

video {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  transform: translateX(-50%) translateY(-50%);
  background-size: cover;
  transition: 1s opacity;
}

.stopfade {
  opacity: .5;
}

@-webkit-keyframes changeColor {

  0% {

    -webkit-filter: hue-rotate(0deg);

    -moz-filter: hue-rotate(0deg);

    -o-filter: hue-rotate(0deg);

    filter: hue-rotate(0deg);

  }



  100% {

    -webkit-filter: hue-rotate(360deg);

    -moz-filter: hue-rotate(360deg);

    -o-filter: hue-rotate(360deg);

    filter: hue-rotate(360deg);

  }

}

@-moz-keyframes changeColor {

  0% {

    -webkit-filter: hue-rotate(0deg);

    -moz-filter: hue-rotate(0deg);

    -o-filter: hue-rotate(0deg);

    filter: hue-rotate(0deg);

  }



  100% {

    -webkit-filter: hue-rotate(360deg);

    -moz-filter: hue-rotate(360deg);

    -o-filter: hue-rotate(360deg);

    filter: hue-rotate(360deg);

  }

}

@-o-keyframes changeColor {

  0% {

    -webkit-filter: hue-rotate(0deg);

    -moz-filter: hue-rotate(0deg);

    -o-filter: hue-rotate(0deg);

    filter: hue-rotate(0deg);

  }



  100% {

    -webkit-filter: hue-rotate(360deg);

    -moz-filter: hue-rotate(360deg);

    -o-filter: hue-rotate(360deg);

    filter: hue-rotate(360deg);

  }

}

@keyframes changeColor {

  0% {

    -webkit-filter: hue-rotate(0deg);

    -moz-filter: hue-rotate(0deg);

    -o-filter: hue-rotate(0deg);

    filter: hue-rotate(0deg);

  }



  100% {

    -webkit-filter: hue-rotate(360deg);

    -moz-filter: hue-rotate(360deg);

    -o-filter: hue-rotate(360deg);

    filter: hue-rotate(360deg);

  }

}

h3.noyel {
  font-family: 'Charm', cursive;
  margin: 0;
  padding: 0;
  font-size: 5rem;
  background: url('../images/text-bg.png') no-repeat;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  animation: move 90s linear infinite;
  -webkit-animation: move 90s linear infinite;

}

/* Text Background Animation */
@keyframes move {
  0% {
    background-position: 0% 30%;
  }

  100% {
    background-position: 100% 50%;
  }
}

div#logo2 {
  margin-top: 0px;
}

.navbar {
  margin-bottom: 0px !important;
}
.container {
    z-index:10
}
.navbar {
    z-index:9999
}
body {
  background-color: #000 !important;
  background-image:none!important;
  padding: 0px 0px !important;
  margin-top: 0px !important;
  margin-right: 0px !important;
  margin-bottom: 0px !important;
  margin-left: 0px !important;
  background-repeat: repeat !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  background-position: 0 0 !important;
  box-shadow: 0 0 0 0 #ffffff !important;
}

li.droit a {
  display: inline-block !important;
}

.nav>li.droit>a {
  padding: 15px 0px !important;
}

li.gauche {
  text-transform: capitalize;
  position: relative !important;
  display: block !important;
  float: left !important;
}

li.droit {
  position: relative !important;
  display: inline-block !important;
  float: right !important;
}

.fa {
  color: #9d9d9d !important;
}

.navbar-nav {
  float: none !important;
  margin: 0;
}

.img-jeu {
  text-align: center;
  padding: 10px 0px;
  font-weight: bold;
  cursor: -webkit-grab;
  cursor: grab;
  background: linear-gradient(90deg, #4169e1, #5768df, #8164d7, #aa60c8, #cc60b3, #e3689c, #ed7889, #ee8c7e, #e99e7c, #e4ac7f, #e0b585, #deb887, orange);
  background-size: 200%;
  /* Background Text Clip */
  /* webkit vendor prefix start */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  /* webkit vendor prefix end */
  background-clip: border-box;
  width: 220px;
  border-radius: 20px;
  display: inline-block;
  animation: gradient-text-animation 3s alternate infinite;
}
.bubbly-button {
  font-family: "Anton", sans-serif;
  display: inline-block;
  font-size: 1em;
  padding: 1em 2em;
  margin-top: 0px;
  margin-bottom: 5px;
  -webkit-appearance: none;
  appearance: none;
  background-color: #E60000;
  color: #fff;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  position: relative;
  transition: transform ease-in 0.1s, box-shadow ease-in 0.25s;
  box-shadow: 54px 0px 100px rgba(255, 0, 0, 0.5);
}
.bubbly-button:focus {
  outline: 0;
}
.bubbly-button:before, .bubbly-button:after {
  position: absolute;
  content: "";
  display: block;
  width: 140%;
  height: 100%;
  left: -20%;
  z-index: 9999;
  transition: all ease-in-out 0.5s;
  background-repeat: no-repeat;
}
.bubbly-button:before {
  display: none;
  top: -75%;
  background-image: radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, transparent 20%, #E60000 20%, transparent 30%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, transparent 10%, #E60000 15%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%);
  background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%, 10% 10%, 18% 18%;
}
.bubbly-button:after {
  display: none;
  bottom: -75%;
  background-image: radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, transparent 10%, #E60000 15%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%), radial-gradient(circle, #E60000 20%, transparent 20%);
  background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 10% 10%, 20% 20%;
}
.bubbly-button:active {
  transform: scale(0.9);
  background-color: #e60074;
  box-shadow: 0px 2px 25px rgba(255, 0, 0, 0.2);
}
.bubbly-button.animate:before {
  display: block;
  animation: topBubbles ease-in-out 0.75s forwards;
}
.bubbly-button.animate:after {
  display: block;
  animation: bottomBubbles ease-in-out 0.75s forwards;
}

@keyframes topBubbles {
  0% {
    background-position: 5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%, 55% 90%, 70% 90%;
  }
  50% {
    background-position: 0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%, 65% 20%, 90% 30%;
  }
  100% {
    background-position: 0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%, 65% 10%, 90% 20%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}
@keyframes bottomBubbles {
  0% {
    background-position: 10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%, 70% -10%, 70% 0%;
  }
  50% {
    background-position: 0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%;
  }
  100% {
    background-position: 0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}
.img-lock {
  opacity: 0.4;
  text-align: center;
  padding: 10px 0px;
  cursor: not-allowed;
  transition-property: opacity;
  font-weight: bold;
  transition-duration: 0.5s;
  transition-timing-function: linear;
}

.img-lock:hover {
  opacity: 1;
}

.jumbotron {
	background-image: linear-gradient(to bottom, rgb(0 0 0) 0%, rgba(130, 0, 0, 0.2) 100%) !important;
  background-repeat: repeat !important;
  background-size: cover !important;
  background-attachment: local !important;
  background-color: none!important;
}

.jumbotron h1 {
  font-weight: 800;
  background: #fff;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

header.jumbotron.hero-spacer {
  color: #fff;
  margin-top: 100px;
  border: 2px solid #E60000;
  font-family: "Anton", sans-serif;
  font-size:20px;
  text-align: center;
  box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.77);
}
header h3, header span {
    background: linear-gradient(
    90deg,
    #4169e1,
    #5768df,
    #8164d7,
    #aa60c8,
    #cc60b3,
    #e3689c,
    #ed7889,
    #ee8c7e,
    #e99e7c,
    #e4ac7f,
    #e0b585,
    #deb887,
    orange
  );
  background-size: 200%;
  /* Background Text Clip */
  /* webkit vendor prefix start */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  /* webkit vendor prefix end */
  background-clip: text;
  animation: gradient-text-animation 3s alternate infinite;
}
.modal-dialog {
    border: 2px solid #E60000;
    border-radius: 7px;
    box-shadow: 0px 0px 12px 5px #E60000;
    z-index: 99999;
    text-align: center;
}
.vf-code{
	color:#E60000;
}
.vf-code:hover{
	color:#820000;
}
h5#myModalLabel {
	font-size: 30px;
    font-weight: bold;
    text-align: center;
    background: linear-gradient(
    90deg,
    #4169e1,
    #5768df,
    #8164d7,
    #aa60c8,
    #cc60b3,
    #e3689c,
    #ed7889,
    #ee8c7e,
    #e99e7c,
    #e4ac7f,
    #e0b585,
    #deb887,
    orange
  );
  background-size: 200%;
  /* Background Text Clip */
  /* webkit vendor prefix start */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  /* webkit vendor prefix end */
  background-clip: text;
  animation: gradient-text-animation 3s alternate infinite;
}
/* Gradient Text Animation */
@keyframes gradient-text-animation {
  from {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  to {
    background-position: 0 50%;
  }
}  
.modal-dialog {
    margin-top: 100px!important
}

.image_with_badge_container img {
  border-radius: 15px;
  box-shadow: 4px 4px 11px 0px rgb(0 0 0 / 50%);
}
/***************************************************
 * Generated by SVG Artista on 11/5/2025, 10:54:02 AM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

@keyframes animate-svg-stroke-1{0%{stroke-dashoffset:370.4637145996094px;stroke-dasharray:370.4637145996094px}100%{stroke-dashoffset:0;stroke-dasharray:370.4637145996094px}}@keyframes animate-svg-fill-1{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-1{animation:animate-svg-stroke-1 1s cubic-bezier(0.645,0.045,0.355,1) 0s both,animate-svg-fill-1 1s cubic-bezier(0.55,0.055,0.675,0.19) 0.8s both}@keyframes animate-svg-stroke-2{0%{stroke-dashoffset:172.99415588378906px;stroke-dasharray:172.99415588378906px}100%{stroke-dashoffset:0;stroke-dasharray:172.99415588378906px}}@keyframes animate-svg-fill-2{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-2{animation:animate-svg-stroke-2 1s cubic-bezier(0.645,0.045,0.355,1) 0.12s both,animate-svg-fill-2 1s cubic-bezier(0.55,0.055,0.675,0.19) 0.9s both}@keyframes animate-svg-stroke-3{0%{stroke-dashoffset:106.28033447265625px;stroke-dasharray:106.28033447265625px}100%{stroke-dashoffset:0;stroke-dasharray:106.28033447265625px}}@keyframes animate-svg-fill-3{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-3{animation:animate-svg-stroke-3 1s cubic-bezier(0.645,0.045,0.355,1) 0.24s both,animate-svg-fill-3 1s cubic-bezier(0.55,0.055,0.675,0.19) 1s both}@keyframes animate-svg-stroke-4{0%{stroke-dashoffset:146.50332641601562px;stroke-dasharray:146.50332641601562px}100%{stroke-dashoffset:0;stroke-dasharray:146.50332641601562px}}@keyframes animate-svg-fill-4{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-4{animation:animate-svg-stroke-4 1s cubic-bezier(0.645,0.045,0.355,1) 0.36s both,animate-svg-fill-4 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.1s both}@keyframes animate-svg-stroke-5{0%{stroke-dashoffset:92.60429382324219px;stroke-dasharray:92.60429382324219px}100%{stroke-dashoffset:0;stroke-dasharray:92.60429382324219px}}@keyframes animate-svg-fill-5{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-5{animation:animate-svg-stroke-5 1s cubic-bezier(0.645,0.045,0.355,1) 0.48s both,animate-svg-fill-5 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.2000000000000002s both}@keyframes animate-svg-stroke-6{0%{stroke-dashoffset:127.30184173583984px;stroke-dasharray:127.30184173583984px}100%{stroke-dashoffset:0;stroke-dasharray:127.30184173583984px}}@keyframes animate-svg-fill-6{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-6{animation:animate-svg-stroke-6 1s cubic-bezier(0.645,0.045,0.355,1) 0.6s both,animate-svg-fill-6 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.3s both}@keyframes animate-svg-stroke-7{0%{stroke-dashoffset:92.60431671142578px;stroke-dasharray:92.60431671142578px}100%{stroke-dashoffset:0;stroke-dasharray:92.60431671142578px}}@keyframes animate-svg-fill-7{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-7{animation:animate-svg-stroke-7 1s cubic-bezier(0.645,0.045,0.355,1) 0.72s both,animate-svg-fill-7 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.4000000000000001s both}@keyframes animate-svg-stroke-8{0%{stroke-dashoffset:219.86973571777344px;stroke-dasharray:219.86973571777344px}100%{stroke-dashoffset:0;stroke-dasharray:219.86973571777344px}}@keyframes animate-svg-fill-8{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-8{animation:animate-svg-stroke-8 1s cubic-bezier(0.645,0.045,0.355,1) 0.84s both,animate-svg-fill-8 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.5s both}@keyframes animate-svg-stroke-9{0%{stroke-dashoffset:153.12586975097656px;stroke-dasharray:153.12586975097656px}100%{stroke-dashoffset:0;stroke-dasharray:153.12586975097656px}}@keyframes animate-svg-fill-9{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-9{animation:animate-svg-stroke-9 1s cubic-bezier(0.645,0.045,0.355,1) 0.96s both,animate-svg-fill-9 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.6s both}@keyframes animate-svg-stroke-10{0%{stroke-dashoffset:276.5765686035156px;stroke-dasharray:276.5765686035156px}100%{stroke-dashoffset:0;stroke-dasharray:276.5765686035156px}}@keyframes animate-svg-fill-10{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-10{animation:animate-svg-stroke-10 1s cubic-bezier(0.645,0.045,0.355,1) 1.08s both,animate-svg-fill-10 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.7000000000000002s both}@keyframes animate-svg-stroke-11{0%{stroke-dashoffset:191.55197143554688px;stroke-dasharray:191.55197143554688px}100%{stroke-dashoffset:0;stroke-dasharray:191.55197143554688px}}@keyframes animate-svg-fill-11{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-11{animation:animate-svg-stroke-11 1s cubic-bezier(0.645,0.045,0.355,1) 1.2s both,animate-svg-fill-11 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.8s both}@keyframes animate-svg-stroke-12{0%{stroke-dashoffset:187.79576110839844px;stroke-dasharray:187.79576110839844px}100%{stroke-dashoffset:0;stroke-dasharray:187.79576110839844px}}@keyframes animate-svg-fill-12{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-12{animation:animate-svg-stroke-12 1s cubic-bezier(0.645,0.045,0.355,1) 1.3199999999999998s both,animate-svg-fill-12 1s cubic-bezier(0.55,0.055,0.675,0.19) 1.9000000000000001s both}@keyframes animate-svg-stroke-13{0%{stroke-dashoffset:160.12921142578125px;stroke-dasharray:160.12921142578125px}100%{stroke-dashoffset:0;stroke-dasharray:160.12921142578125px}}@keyframes animate-svg-fill-13{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-13{animation:animate-svg-stroke-13 1s cubic-bezier(0.645,0.045,0.355,1) 1.44s both,animate-svg-fill-13 1s cubic-bezier(0.55,0.055,0.675,0.19) 2s both}@keyframes animate-svg-stroke-14{0%{stroke-dashoffset:146.49452209472656px;stroke-dasharray:146.49452209472656px}100%{stroke-dashoffset:0;stroke-dasharray:146.49452209472656px}}@keyframes animate-svg-fill-14{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-14{animation:animate-svg-stroke-14 1s cubic-bezier(0.645,0.045,0.355,1) 1.56s both,animate-svg-fill-14 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.1s both}@keyframes animate-svg-stroke-15{0%{stroke-dashoffset:106.29533386230469px;stroke-dasharray:106.29533386230469px}100%{stroke-dashoffset:0;stroke-dasharray:106.29533386230469px}}@keyframes animate-svg-fill-15{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-15{animation:animate-svg-stroke-15 1s cubic-bezier(0.645,0.045,0.355,1) 1.68s both,animate-svg-fill-15 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.2s both}@keyframes animate-svg-stroke-16{0%{stroke-dashoffset:153.12049865722656px;stroke-dasharray:153.12049865722656px}100%{stroke-dashoffset:0;stroke-dasharray:153.12049865722656px}}@keyframes animate-svg-fill-16{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-16{animation:animate-svg-stroke-16 1s cubic-bezier(0.645,0.045,0.355,1) 1.7999999999999998s both,animate-svg-fill-16 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.3s both}@keyframes animate-svg-stroke-17{0%{stroke-dashoffset:299.4617614746094px;stroke-dasharray:299.4617614746094px}100%{stroke-dashoffset:0;stroke-dasharray:299.4617614746094px}}@keyframes animate-svg-fill-17{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-17{animation:animate-svg-stroke-17 1s cubic-bezier(0.645,0.045,0.355,1) 1.92s both,animate-svg-fill-17 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.4000000000000004s both}@keyframes animate-svg-stroke-18{0%{stroke-dashoffset:106.28141021728516px;stroke-dasharray:106.28141021728516px}100%{stroke-dashoffset:0;stroke-dasharray:106.28141021728516px}}@keyframes animate-svg-fill-18{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-18{animation:animate-svg-stroke-18 1s cubic-bezier(0.645,0.045,0.355,1) 2.04s both,animate-svg-fill-18 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.5s both}@keyframes animate-svg-stroke-19{0%{stroke-dashoffset:172.87782287597656px;stroke-dasharray:172.87782287597656px}100%{stroke-dashoffset:0;stroke-dasharray:172.87782287597656px}}@keyframes animate-svg-fill-19{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-19{animation:animate-svg-stroke-19 1s cubic-bezier(0.645,0.045,0.355,1) 2.16s both,animate-svg-fill-19 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.6s both}@keyframes animate-svg-stroke-20{0%{stroke-dashoffset:187.91407775878906px;stroke-dasharray:187.91407775878906px}100%{stroke-dashoffset:0;stroke-dasharray:187.91407775878906px}}@keyframes animate-svg-fill-20{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-20{animation:animate-svg-stroke-20 1s cubic-bezier(0.645,0.045,0.355,1) 2.28s both,animate-svg-fill-20 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.7s both}@keyframes animate-svg-stroke-21{0%{stroke-dashoffset:203.6500701904297px;stroke-dasharray:203.6500701904297px}100%{stroke-dashoffset:0;stroke-dasharray:203.6500701904297px}}@keyframes animate-svg-fill-21{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-21{animation:animate-svg-stroke-21 1s cubic-bezier(0.645,0.045,0.355,1) 2.4s both,animate-svg-fill-21 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.8s both}@keyframes animate-svg-stroke-22{0%{stroke-dashoffset:216.74169921875px;stroke-dasharray:216.74169921875px}100%{stroke-dashoffset:0;stroke-dasharray:216.74169921875px}}@keyframes animate-svg-fill-22{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-22{animation:animate-svg-stroke-22 1s cubic-bezier(0.645,0.045,0.355,1) 2.52s both,animate-svg-fill-22 1s cubic-bezier(0.55,0.055,0.675,0.19) 2.9000000000000004s both}@keyframes animate-svg-stroke-23{0%{stroke-dashoffset:153.1294708251953px;stroke-dasharray:153.1294708251953px}100%{stroke-dashoffset:0;stroke-dasharray:153.1294708251953px}}@keyframes animate-svg-fill-23{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-23{animation:animate-svg-stroke-23 1s cubic-bezier(0.645,0.045,0.355,1) 2.6399999999999997s both,animate-svg-fill-23 1s cubic-bezier(0.55,0.055,0.675,0.19) 3s both}@keyframes animate-svg-stroke-24{0%{stroke-dashoffset:159.52133178710938px;stroke-dasharray:159.52133178710938px}100%{stroke-dashoffset:0;stroke-dasharray:159.52133178710938px}}@keyframes animate-svg-fill-24{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-24{animation:animate-svg-stroke-24 1s cubic-bezier(0.645,0.045,0.355,1) 2.76s both,animate-svg-fill-24 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.1000000000000005s both}@keyframes animate-svg-stroke-25{0%{stroke-dashoffset:203.6368408203125px;stroke-dasharray:203.6368408203125px}100%{stroke-dashoffset:0;stroke-dasharray:203.6368408203125px}}@keyframes animate-svg-fill-25{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-25{animation:animate-svg-stroke-25 1s cubic-bezier(0.645,0.045,0.355,1) 2.88s both,animate-svg-fill-25 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.2s both}@keyframes animate-svg-stroke-26{0%{stroke-dashoffset:153.1240234375px;stroke-dasharray:153.1240234375px}100%{stroke-dashoffset:0;stroke-dasharray:153.1240234375px}}@keyframes animate-svg-fill-26{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.gjdn-vf-26{animation:animate-svg-stroke-26 1s cubic-bezier(0.645,0.045,0.355,1) 3s both,animate-svg-fill-26 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.3s both}@keyframes animate-svg-stroke-27{0%{stroke-dashoffset:442.4743347167969px;stroke-dasharray:442.4743347167969px}100%{stroke-dashoffset:0;stroke-dasharray:442.4743347167969px}}@keyframes animate-svg-fill-27{0%{fill:transparent}100%{fill:rgb(227,11,19)}}.gjdn-vf-27{animation:animate-svg-stroke-27 1s cubic-bezier(0.645,0.045,0.355,1) 3.12s both,animate-svg-fill-27 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.4000000000000004s both}@keyframes animate-svg-stroke-28{0%{stroke-dashoffset:160.1395721435547px;stroke-dasharray:160.1395721435547px}100%{stroke-dashoffset:0;stroke-dasharray:160.1395721435547px}}@keyframes animate-svg-fill-28{0%{fill:transparent}100%{fill:rgb(227,11,19)}}.gjdn-vf-28{animation:animate-svg-stroke-28 1s cubic-bezier(0.645,0.045,0.355,1) 3.2399999999999998s both,animate-svg-fill-28 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.5s both}@keyframes animate-svg-stroke-29{0%{stroke-dashoffset:179.6934051513672px;stroke-dasharray:179.6934051513672px}100%{stroke-dashoffset:0;stroke-dasharray:179.6934051513672px}}@keyframes animate-svg-fill-29{0%{fill:transparent}100%{fill:rgb(227,11,19)}}.gjdn-vf-29{animation:animate-svg-stroke-29 1s cubic-bezier(0.645,0.045,0.355,1) 3.36s both,animate-svg-fill-29 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.6000000000000005s both}@keyframes animate-svg-stroke-30{0%{stroke-dashoffset:210.06283569335938px;stroke-dasharray:210.06283569335938px}100%{stroke-dashoffset:0;stroke-dasharray:210.06283569335938px}}@keyframes animate-svg-fill-30{0%{fill:transparent}100%{fill:rgb(227,11,19)}}.gjdn-vf-30{animation:animate-svg-stroke-30 1s cubic-bezier(0.645,0.045,0.355,1) 3.48s both,animate-svg-fill-30 1s cubic-bezier(0.55,0.055,0.675,0.19) 3.7s both}
@media (min-width: 992px) {
  .badge-on-image {
    position: absolute;
    top: 2px;
    /* position where you want it */
    left: 2px;
    padding: 3px 6px;
  }
}

@media (min-width: 490px) and (max-width: 991px) {
  .img-jeu {
    width: 50%;
  }

  .badge-on-image {
    position: absolute;
    top: 2px;
    margin-left: -155px !important;
    font-size: 16px !important;
  }
}
@media (min-width: 580px) and (max-width: 992px) {
	div#ui {
	    position: relative;
	    width: 620px;
	    padding-bottom: 150px;
	    padding-top: 90px;
	    left: 50%;
	    display: block;
	    margin: 0 auto;
	    text-align: center;
	}
	#ui .text {
	  	font-size: 7rem;
	  	color: #fff;
	  	line-height: 7rem;
	  	mix-blend-mode: screen;
	  	letter-spacing: 1rem;
	}
}
@media (min-width: 769px) and (max-width: 992px) {
    .right img {
        width: 150px;
        position: relative;
        right:42%;
        margin: 0 auto!important;
    }
}
@media (max-width: 768px) {
  video{
    display:none
  }
  .right img {
    width: 150px;
    position: relative;
    right:30%;
    margin: 0 auto!important;
  }
}
@media (min-width: 319px) and (max-width: 579px) {
	div#ui {
	    position: relative;
	    width: 420px;
	    padding-bottom: 150px;
	    padding-top: 90px;
	    left: 50%;
	    display: block;
	    margin: 0 auto;
	    text-align: center;
	}
	#ui .text {
	  	font-size: 4.5rem;
	  	color: #fff;
	  	line-height: 6rem;
	  	mix-blend-mode: screen;
	  	letter-spacing: 0.7rem;
	}
}
@media (min-width: 319px) and (max-width: 489px) {
  .img-jeu {
    width: 100%;
  }

  .badge-on-image {
    position: absolute;
    top: 2px;
    margin-left: -155px !important;
    font-size: 16px !important;
  }
}

@media screen and (max-width: 767px) {
	.navbar-inverse .navbar-collapse {
	    background: #171717;
	}
}