/* DIMENSIONS ***************************************************************************************************************/
/* COLORS *****************************************************************************************************************/
/* FONTS *****************************************************************************************************************/
@font-face {
  font-family: 'Champagne & Limousines Bold';
  src: url('../font/ChampagneLimousines-Bold.woff2') format('woff2'), url('../font/ChampagneLimousines-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Champagne & Limousines';
  src: url('../font/ChampagneLimousines.woff2') format('woff2'), url('../font/ChampagneLimousines.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Futura PT';
  src: url('../font/FuturaPT-MediumObl.woff2') format('woff2'), url('../font/FuturaPT-MediumObl.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
.ac-content-section p,
#start p,
#end p {
  font-family: 'Champagne & Limousines', sans-serif;
  color: #212121;
}
.ac-content-section h1,
#start h1,
#end h1,
.ac-content-section h2,
#start h2,
#end h2,
.ac-content-section h3,
#start h3,
#end h3 {
  font-family: 'Champagne & Limousines Bold', sans-serif;
  color: #212121;
}
.ac-content-section h1,
#start h1,
#end h1 {
  font-size: 38px;
  line-height: 40px;
}
.ac-content-section h2,
#start h2,
#end h2 {
  font-size: 24px;
  line-height: 26px;
}
.ac-content-section .ac-text-lead,
#start .ac-text-lead,
#end .ac-text-lead {
  font-size: 28px;
  line-height: 30px;
  font-family: 'Champagne & Limousines Bold', sans-serif;
}
.ac-content-section p,
#start p,
#end p {
  font-size: 24px;
  line-height: 26px;
}
.ac-content-section p span,
#start p span,
#end p span {
  font-family: 'Champagne & Limousines Bold', sans-serif;
}
.ac-content-section .uk-text-small,
#start .uk-text-small,
#end .uk-text-small {
  font-size: 14px;
  line-height: 16px;
}
/* CARD *****************************************************************************************************************/
.ac-card {
  background-color: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
}
/* FORM *****************************************************************************************************************/
.ac-input {
  height: 30px;
  border: 1px solid #ffffff;
  color: #212121;
  font-size: 17px;
  font-family: 'Champagne & Limousines', sans-serif;
  font-weight: 400;
  border-radius: 3px;
  text-align: center;
}
.ac-input::placeholder {
  color: #212121;
  transition: color 0.5s;
}
.ac-input:focus::placeholder {
  color: transparent;
}
.ac-input-padding-bottom {
  padding-bottom: 5px;
}
.ac-input-padding-left {
  padding-left: 5px;
}
@media (min-width: 640px) {
  .ac-input-padding-left-desktop {
    padding-left: 5px;
  }
}
/* BOUTONS *****************************************************************************************************************/
.ac-button-default {
  background-color: #f7c300;
  color: #ffffff;
  font-family: 'Champagne & Limousines Bold', sans-serif;
  font-size: 21px;
  line-height: 27px;
  font-weight: 400;
  padding: 5px 40px;
  border-radius: 50px;
  text-transform: inherit;
  transition: all 0.5s;
}
.ac-button-default:hover {
  background-color: #ffffff;
  color: #212121;
}
.ac-button-large {
  font-size: 24px;
}
.ac-button-banner-cookies {
  font-size: 14px;
  background-color: #f0f0f0;
  color: #212121;
  padding: 3px 15px;
}
.ac-button-banner-cookies:hover {
  background-color: #212121;
  color: #f0f0f0;
}
.uk-table tr {
  border-bottom: 1px solid #f7c300;
  font-family: 'Champagne & Limousines Bold', sans-serif;
  color: #212121;
  font-size: 18px;
  line-height: 20px;
}
.uk-table tr.ac-table-highlight {
  color: #00ade0;
}
.uk-table td {
  padding: 3px;
}
.uk-table .ac-table-place {
  text-align: right;
}
.uk-table .ac-table-joueur {
  text-align: left;
  text-transform: capitalize;
}
.uk-table .ac-table-score {
  text-align: right;
}
/* CONTENT SECTION *****************************************************************************************************************/
/* INSCRIPTION *****************************************************************************************************************/
#inscription {
  background-image: url(../img/bg-pages.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  display: block;
}
#inscription .ac-chat-page {
  position: absolute;
  bottom: 0;
}
@media (max-width: 640px) {
  #inscription {
    padding: 20px;
    background-image: url(../img/bg-mobile-pages.jpg);
    background-position: right top;
    background-size: 100%;
    background-color: #a0eaf5;
    padding-bottom: 16vh;
  }
  #inscription #ac-logo-cse {
    width: 30%;
    margin: auto;
  }
  #inscription .ac-chat-page {
    right: 5%;
    max-width: 35%;
  }
}
@media (min-width: 640px) {
  #inscription {
    padding: 40px;
    background-size: 100%;
  }
  #inscription #ac-date-titre-dotations {
    width: 61%;
    max-width: 700px;
  }
  #inscription .ac-chat-page {
    right: 5%;
  }
}
/* GAMEPLAY *****************************************************************************************************************/
#start .uk-modal-dialog,
#end .uk-modal-dialog,
#lost .uk-modal-dialog {
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 5px;
}
#start .uk-modal-dialog h2,
#end .uk-modal-dialog h2,
#lost .uk-modal-dialog h2 {
  font-size: 30px;
  line-height: 32px;
  color: #212121;
  font-family: 'Champagne & Limousines Bold', sans-serif;
}
#start .uk-modal-dialog p,
#end .uk-modal-dialog p,
#lost .uk-modal-dialog p {
  font-size: 22px;
  line-height: 24px;
  color: #212121;
  font-family: 'Champagne & Limousines', sans-serif;
}
#start .uk-modal-dialog .ac-text-lead,
#end .uk-modal-dialog .ac-text-lead,
#lost .uk-modal-dialog .ac-text-lead {
  font-size: 24px;
  line-height: 26px;
  font-family: 'Champagne & Limousines Bold', sans-serif;
  color: #212121;
}
#start .uk-modal-dialog #ac-text-or,
#end .uk-modal-dialog #ac-text-or,
#lost .uk-modal-dialog #ac-text-or {
  color: #00ade0;
}
#start .uk-modal-dialog {
  max-width: 700px !important;
}
#gameplay {
  padding: 0;
  z-index: 0;
}
#gameplay #game-container {
  position: fixed;
  width: 100vw;
  height: 94.5vh;
}
#gameplay #game-container #ac-objets {
  width: 6016px;
  height: 4016px;
}
#gameplay #game-container .oeuf {
  position: absolute;
  z-index: 50;
  display: none;
}
#gameplay #game-container .ac-explosion {
  position: absolute;
  perspective: 1000px;
  top: 50%;
  left: 50%;
}
#gameplay #game-container .ac-explosion div {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: absolute;
  transform: translate(-50%, 50%);
  user-select: none;
}
#gameplay #game-container #oeuf1 {
  top: 79.15%;
  left: 48.4%;
}
#gameplay #game-container #oeuf2 {
  top: 68.8%;
  left: 5.2%;
}
#gameplay #game-container #oeuf3 {
  top: 77.9%;
  right: 7.75%;
}
#gameplay #game-container #oeuf4 {
  top: 47.3%;
  left: 41.9%;
}
#gameplay #game-container #oeuf5 {
  top: 29.9%;
  right: 2.5%;
}
#gameplay #game-container #oeuf6 {
  top: 76.05%;
  left: 14.5%;
}
#gameplay #game-container #oeuf7 {
  top: 14.2%;
  right: 30.6%;
}
#gameplay #game-container #oeuf8 {
  top: 0.3%;
  left: 62%;
}
#gameplay #game-container #explosion8 {
  top: 0.5%;
  left: 64%;
}
#gameplay #game-container #oeuf9 {
  top: 61.9%;
  right: 14%;
}
#gameplay #game-container #oeuf10 {
  top: 91%;
  left: 10.2%;
}
#gameplay #game-container #oeuf11 {
  top: 22.45%;
  left: 50.45%;
}
#gameplay #game-container #oeuf12 {
  top: 47.95%;
  left: 59.45%;
}
#gameplay #game-container #oeuf13 {
  top: 50.8%;
  right: 7.7%;
}
#gameplay #game-container #oeuf14 {
  top: 28.1%;
  left: 25.7%;
}
#gameplay #game-container #gameplay-chat {
  position: absolute;
  top: 25.8%;
  left: 13.8%;
  z-index: 40;
  display: none;
}
#gameplay #game-container .objetTrouve {
  animation: animationPulsation 0.25s linear;
}
@keyframes animationPulsation {
  0% {
    transform: scale(1);
  }
  75% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}
#gameplay #game-container .interfaceElement {
  position: absolute;
}
#gameplay #game-container #ac-logo-titre {
  top: 30px;
  left: 30px;
  width: 25%;
}
#gameplay #game-container #timer {
  top: 50px;
  right: 30px;
  background: url('../img/gameplay/bg-chrono.png') center center no-repeat transparent;
  background-size: contain;
  height: 103px;
  width: 90px;
}
#gameplay #game-container #timer #texteCompteur {
  color: #212121;
  font-size: 28px;
  line-height: 115px;
  font-family: 'Futura PT', sans-serif;
  font-weight: 500;
}
#gameplay #game-container #target {
  top: 50px;
  right: 135px;
  background: url('../img/gameplay/bg-target.png') center center no-repeat transparent;
  background-size: contain;
  width: 89px;
  height: 99px;
}
#gameplay #game-container #target .target-oeuf {
  position: absolute;
  top: 4px;
  left: 9px;
}
#gameplay #game-container #zoomPlus {
  bottom: 30px;
  right: 110px;
}
#gameplay #game-container #zoomLess {
  bottom: 30px;
  right: 30px;
}
#gameplay #game-container .hoverElement {
  cursor: pointer;
  transition: all 0.5s ease;
}
#gameplay #game-container .hoverElement:hover:not(.inactive) {
  transform: scale(0.95);
  opacity: 0.9;
}
#gameplay #game-container .inactive {
  opacity: 0.5;
  cursor: auto;
}
@media (max-width: 1024px) {
  #gameplay #game-container #ac-logo-titre {
    top: 30px;
    left: 30px;
    width: 40%;
  }
}
@media (max-width: 640px) {
  #gameplay #game-container #ac-logo-titre {
    top: 15px;
    left: 15px;
    width: 60%;
  }
  #gameplay #game-container #target {
    top: 15px;
    right: 15px;
    width: 69px;
    height: 79px;
  }
  #gameplay #game-container #target .target-oeuf {
    position: absolute;
    top: 4px;
    left: 6px;
  }
  #gameplay #game-container #timer {
    top: 100px;
    right: 15px;
    height: 83px;
    width: 65px;
  }
  #gameplay #game-container #timer #texteCompteur {
    color: #212121;
    font-size: 20px;
    line-height: 93px;
    font-family: 'Futura PT', sans-serif;
    font-weight: 500;
  }
  #gameplay #game-container #zoomPlus {
    bottom: 15px;
    right: 90px;
  }
  #gameplay #game-container #zoomLess {
    bottom: 15px;
    right: 15px;
  }
}
/* FIN *****************************************************************************************************************/
#fin,
#terminer {
  background-image: url(../img/bg-pages.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  display: block;
}
#fin .ac-chat-page,
#terminer .ac-chat-page {
  position: absolute;
  bottom: 0;
}
#fin h1,
#terminer h1 {
  font-style: italic;
}
#fin h1 span,
#terminer h1 span {
  color: #00ade0;
}
@media (max-width: 640px) {
  #fin,
  #terminer {
    padding: 20px;
    background-image: url(../img/bg-mobile-pages.jpg);
    background-position: right top;
    background-size: 100%;
    background-color: #a0eaf5;
    padding-bottom: 16vh;
  }
  #fin #ac-logo-cse,
  #terminer #ac-logo-cse {
    width: 30%;
    margin: auto;
  }
  #fin .ac-chat-page,
  #terminer .ac-chat-page {
    right: 5%;
    max-width: 35%;
  }
}
@media (min-width: 640px) {
  #fin,
  #terminer {
    padding: 40px;
    background-size: 100%;
  }
  #fin #ac-date-titre-dotations,
  #terminer #ac-date-titre-dotations {
    width: 61%;
    max-width: 440px;
  }
  #fin .ac-chat-page,
  #terminer .ac-chat-page {
    right: 5%;
  }
}
/* FOOTER SECTION ****************************************************************************************************************************/
.uk-nav li,
.uk-nav a {
  font-family: 'Champagne & Limousines', sans-serif;
  color: #9e9e9e;
  font-size: 16px;
  line-height: 18px;
  font-weight: 400;
}
.uk-nav li:first-child a {
  text-decoration: underline;
}
.uk-modal-body h2,
.uk-modal-body h3 {
  color: #212121;
}
.ac-footer-separateur {
  margin-left: 5px;
  margin-right: 5px;
  max-width: 4px;
}
@media (max-width: 640px) {
  #ac-logo-footer {
    max-width: 60px;
  }
}
/* COOKIES BANNER ****************************************************************************************************************************/
#ac-cookies-banner {
  background-color: #ffffff;
  color: #212121;
  z-index: 30;
  padding: 5px !important;
}
#ac-cookies-banner p {
  font-size: 14px;
}
