html,body {
    height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;

}

@keyframes blinker {
  50% { opacity: 0; }
}

@media (orientation: landscape) {
  .html {
    font-size: 62.5%;
  }
  .body {
    font-size: 1.4rem;
  }
}

@media (orientation: portrait) {
  .html {
    font-size: 62.5%;
  }
  .body {
    font-size: 3.4rem;
  }
}

.container {
    height: 100%;
    width: 100%;
}

.bg {
    text-align:center;
    height:100vh;
    background-color: black;
}

.divTop {
    height: 36.44%;
    width: auto;
    /*max-width:640px;*/
    background-repeat:no-repeat;
    background-size:contain;
    background-position-x:center;
    background-position-y:bottom;
    margin: 0 auto;
}

.divBottom {
    height: 54.05%;
    width: auto;
    /*max-width:640px;*/
    background-repeat:no-repeat;
    background-size: contain;
    background-position-x:center;
    background-position-y:top;
    margin: 0 auto;
}

.divBottom2 {
    height: 9.51%;
    width: auto;
    /*max-width:640px;*/
    background-repeat:no-repeat;
    background-size: contain;
    background-position-x:center;
    background-position-y:top;
    margin: 0 auto;
}

.divTopInner {
    height: 100%;
    display: inline-block;
    position: relative;
    bottom: 0;
}

.imgTopInner {
    height: 100%;
    visibility: hidden;
}

.divBottomInner {
    height: 100%;
    display: inline-block;
    position: relative;
    top: 0;
}

.imgBottomInner {
    height: 100%;
    visibility: hidden;
}

.divFull {
    height: 90.49%;
    width: auto;
    /*max-width:640px;*/
    background-repeat:no-repeat;
    background-size:contain;
    background-position-x:center;
    background-position-y:bottom;
    margin: 0 auto;
}

.fr {
    float: right;
}

.life {
    height: 90%;
}

.divLife {
    position: absolute;
    height: 20%;
    top: 80%;
    width: 37%;
    left: 63%;
}

.iDHFr {
    background-image:url(../img/doreeHautFr01.png);
    background-color: #8ac1ff;
}

.iDB {
    background-image:url(../img/doreeBasSmall.gif);
    background-color: #8ac1ff;
}

.iDB2 {
    background-color: #8ac1ff;
}

.iSB2 {
    background-color: #007eff;
}

.iSH {
    background-image:url(../img/splashHautFr.png);
    background-color: #007eff;
}

.iSB {
    background-image:url(../img/splashBasFr.png);
    background-color: #007eff;
}

.iAB {
   background-image:url(../img/accueilFr_anim.gif);
    background-color: #b9b7ff;
}

.iAH {
    background-color: #b9b7ff;
}

.iAH1 {
    background-image:url(../img/accueilHautFr01.png);
    background-color: #b9b7ff;
}

.iAH2 {
    background-image:url(../img/accueilHautFr02.png);
    background-color: #b9b7ff;
}

.iAH3 {
    background-image:url(../img/accueilHautFr03.png);
    background-color: #b9b7ff;
}

.iAH4 {
    background-image:url(../img/accueilHautFr04.png);
    background-color: #b9b7ff;
}

.iAH5 {
    background-image:url(../img/accueilHautFr05.png);
    background-color: #b9b7ff;
}

.iCH {
    background-image:url(../img/chaudeMeter.png);
    background-color: #ffc3c3;
}

.iCB {
    background-image:url(../img/chaudeBasSmall.gif);
    background-color: #ffc3c3;
}

.iCB2 {
    background-color: #ffc3c3;
}

.iCH2 {
    background-image:url(../img/chaudeHautFr02.jpg);
    background-color: #ffc3c3;
}

.iCH3 {
    background-image:url(../img/zenHautFr03.png);
    background-color: #c6ffaa;
}

.iDH {
    background-image:url(../img/doreeMeter.png);
    background-color: #8ac1ff;
}

.iDH1 {
    background-image:url(../img/doreeHautFr01.png);
    background-color: #8ac1ff;
}

.iDH2 {
    background-color: #8ac1ff;
}

.iZH {
    background-image:url(../img/zenHautFr01.png);
    background-color: #c6ffaa;
}

.iZB {
    background-image:url(../img/zenBas01Small.gif);
    background-color: #c6ffaa;
}

.iZB2 {
    background-color: #c6ffaa;
}

.iEndRoundZH {
    background-image:url(../img/zenHautFr02.jpg);
    background-color: #c6ffaa;
}

.iEndRoundCH1Life {
    background-image:url(../img/chaudeHautFr01.jpg);
    background-color: #ffc3c3;
}

.iEndRoundDH {
    background-image:url(../img/doreeHautFr01.png);
    background-color: #8ac1ff;
}

.iLegal{
  background-color: #007eff;
}

.iLegal .divTopInner {
    background-position: right top;
    background-repeat: no-repeat;
    background-image:url(../img/legal.png);
    background-size: 50%;
    font-family: "HelveticaNeue", "Droid", sans-serif;
}


.roundEnded.ITEM_ZEN .divTop { background-image: url(../img/zenHautFr02.jpg); background-color: #c6ffaa; }
.roundEnded.ITEM_ZEN.lastRound .divTop { background-image: url(../img/zenHautFr03.png); background-color: #c6ffaa;}
.roundEnded.ITEM_DANGER .divTop { background-image: url(../img/chaudeHautFr01.jpg); background-color: #ffc3c3; }
.roundEnded.ITEM_DANGER.lastRound .divTop { background-image: url(../img/zenHautFr03.png); background-color: #ffc3c3;}
.roundEnded.ITEM_DANGER.dead .divTop { background-image: url(../img/zenHautFr03.png); background-color: #ffc3c3;}
.roundEnded.ITEM_ZEN .divBottom { background-image:url(../img/zenBas01.png); background-color: #c6ffaa;}
.roundEnded.ITEM_DANGER .divBottom { background-image:url(../img/chaudeBas.png); background-color: #ffc3c3;}

.roundEnded.ITEM_ZEN .divBottom2 { background-color: #c6ffaa;}
.roundEnded.ITEM_DANGER .divBottom2 { background-color: #ffc3c3;}

.en .roundEnded.ITEM_ZEN .divTop { background-image: url(../img/zenHautEn02.jpg); background-color: #c6ffaa;}
.en .roundEnded.ITEM_ZEN.lastRound .divTop { background-image: url(../img/zenHautEn03.png); background-color: #c6ffaa;}
.en .roundEnded.ITEM_DANGER .divTop { background-image: url(../img/chaudeHautEn01.jpg); background-color: #ffc3c3;}
.en .roundEnded.ITEM_DANGER.lastRound .divTop { background-image: url(../img/zenHautEn03.png); background-color: #ffc3c3;}
.en .roundEnded.ITEM_DANGER.dead .divTop { background-image: url(../img/zenHautEn03.png); background-color: #ffc3c3;}
.en .roundEnded.ITEM_ZEN .divBottom { background-image:url(../img/zenBas01.png); background-color: #c6ffaa;}
.en .roundEnded.ITEM_DANGER .divBottom { background-image:url(../img/chaudeBas.png); background-color: #ffc3c3;}

.curseurHorz
{
    height: 31.03%;
    width: auto;

    display:block;
    position:absolute;
    left:1.875%;
    right:0;
    top:32%;
}

.shakeimg
{
    height: 29.5%;
    width: auto;

    display:block;
    position:absolute;
    left:0%;
    right:0;
    bottom:0;

    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;

    animation: blinker 1s ease infinite;
}

.loadingimg
{
    height: 15%;
    width: auto;
    display:block;
    position:absolute;
    top:45%;
    right:35%;
    z-index: 999 !important;
}

.shake {
    background-image:url(../img/objTxtFr01.png);
}

.tap {
    background-image:url(../img/objTxtTapoter.png);
}

.btnReady
{
    height: 24%;
    width: 64%;

    display:block;
    position:absolute;
    top:4.5%;
    right:18%;
}

.btnReady1
{
    height: 24%;
    width: 69%;

    display:block;
    position:absolute;
    top:4.5%;
    right:15%;

    background-image:url(../img/splashFr_txtAucune.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btnReady2
{
    height: 24%;
    width: 80%;

    display:block;
    position:absolute;
    top:4.5%;
    right:10%;

    background-image:url(../img/splashFr_butParticiper.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btnLang
{
    height: 18%;
    width: 42.5%;

    display:block;
    position:absolute;
    top:32%;
    right:8%;
}

.en .btnLang
{
    right:50.5%;
}


.btnRule
{
    height: 16%;
    width: 60%;

    display:block;
    position:absolute;
    top:36%;
    right:20%;
}

.btnWinner
{
    height: 16%;
    width: 55%;

    display:block;
    position:absolute;
    top:77.5%;
    right:22%;
    background-image:url(../img/splashFr_butLotsGagnes.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.chkGreen
{
    height: 32%;

    display:block;
    position:absolute;
    top:70%;
    right:10%;
}

.claimHeader
{
    height: 18%;
    width: 90%;
    display:block;
    position:absolute;
    top:6.5%;
    right:5%;
    color: #ffff00;
    font-size:2.5vh;
    font-weight: bold;
}

.claimHeader .claimWin
{
  font-size: 7vh;
  font-weight: bold;
}

.claimNumber
{
    height: 10%;
    width: 90%;
    display:block;
    position:absolute;
    top:25%;
    right:5%;
    color: white;
    font-size:4vh;
}

.claimFirstname,
.claimLastname
{
    height: 10%;
    width: 90%;
    display:block;
    position:absolute;
    right:5%;
    background-image:url(../img/objBoutonTxt.png);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    color: #013064;
    font-size:4vh;
}
.claimFirstname
{
    top:36%;
}

.claimLastname
{
    top:47%;
}

.claimThankYou
{
    height: 10%;
    width: 90%;
    display:block;
    position:absolute;
    top:46%;
    right:5%;
    color: #013064;
    font-size:4vh;
}

.claimSubmit
{
    height: 15%;
    width: 90%;
    display:block;
    position:absolute;
    top:65%;
    right:4%;
    background-image:url(../img/objBouton01.png);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    color: #013162;
    font-size:4vh;
    display:table;
}

.claimSubmitGray
{
    height: 15%;
    width: 90%;
    display:block;
    position:absolute;
    top:65%;
    right:4%;
    background-image:url(../img/objBouton01Gray.png);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    color: #013162;
    font-size:4vh;
    display:table;
}

.claimRule
{
    height: 15%;
    width: 90%;
    display:block;
    position:absolute;
    top:80%;
    right:5%;
    color: white;
    font-size:2.5vh;
}

.claimCheckbox
{
    height: 7.25%;
    width: auto;
    display:block;
    position:absolute;
    top:58%;
    left:11%;
    color: white;
    font-size:2.5vh;
}

.claimIm18
{
    display:block;
    position:absolute;
    top:60%;
    left:25%;
    color: white;
    font-size:3vh;
}

.claimInput
{
    width: 80%;
    height: 90%;
    border: 0;
    background: none;
    font-size:4vh;
}

.claimBtnText
{
    display: table-cell;
    vertical-align: middle;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #013064;
    font-size: 3vh;
    text-align: center;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #013064;
   opacity:  1;
   font-size: 3vh;
   text-align: center;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #013064;
   opacity:  1;
   font-size: 3vh;
   text-align: center;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #013064;
   font-size: 3vh;
   text-align: center;
}


.claimButton {
    background-image: url('/img/butLotFr01.gif');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    display:block;
    position:absolute;
    top: 50%;
    height: 140px;
}

.claimButton:active { background-image: url('/img/butLotFr02.gif'); }

.notsupported {
    display:block;
    position:absolute;
    width: 100%;
    top: 50%;
    vertical-align: middle;

}

.notsupported h3 {
    font-size: 3vh;
    color: #fff;
}

.willnotrender {
   transform: translateZ(0);
}

.debug-bar {
    background-color: rgba(255,255,255, 0.6);
    padding: 5px;
    width: 100%;
    position: absolute;
    bottom: 0;
}

.loadHeader
{
    height: 18%;
    width: 90%;
    display:block;
    position:absolute;
    top:10%;
    right:5%;
    color:white;
    font-size:4vh;
}

#survey .header img {
    position:absolute;
    width: 100%;
    left: 0;
    top: 0;
}

.surveyText {
    position: absolute;
    text-align: center;
    top: 32%;
    height: 65%;
    color:white;
    font-size: 22px;
    width: 100%;
}

.surveySend {
    position: absolute;
    text-align: center;
    top: 83%;
    width: 100%;
}

.surveySend button {
    font-size: 30px;
}

.surveyChoices {
    position: absolute;
    width: 100%;
    top: 50%;
    height: 170px;
}

.surveyBtn {
    float: left;
    width: 33%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
}

.surveyCheck {
    width: 75px;
    margin-top: 100px;
}

.surveyCheck.hide { display: none; }
.surveyCheck.show { display: inline; }

.surveyDanger { background-image: url('/img/sondagePatatesDanger.png'); }
.surveyZen { background-image: url('/img/sondagePatatesZen.png'); }
.surveyGain { background-image: url('/img/sondagePatatesGain.png'); }

#rules {
    position: absolute;
    text-align: left;
    top: 28%;
    height: 63%;
    overflow: scroll;
    color:white;
    font-size: 14px;
}

#divWinners {
    position: absolute;
    text-align: center;
    top: 28%;
    height: 65%;
    color:white;
    font-size: 30px;
    padding-top: 14px;
}

.divWinnersText {
    color:white;
    font-size: 16px;
}

#rules h3 { font-size: 14px; text-transform: uppercase; font-weight: normal; display: inline }

#rules ol { counter-reset: item; padding: 0 10px; }
#rules ol > li { display: block; }
#rules ol > li:before { content: counters(item, ".") ". "; counter-increment: item }



.rulesHeader
{
    height: 18%;
    width: 97%;
    display:block;
    position:absolute;
    top:10%;
    right:0%;
    color:white;
    font-size:4vh;
}

.button-sm {
  background-color: #4badf6;
  background: linear-gradient(to bottom, #4badf6, #49a0ff);
  border: 2px solid #fff;
  color: #fff;
  border-radius: 7px;
  text-align: center;
  box-shadow: 0px 2px 12px #303030;
}

.button {
  background-color: #4badf6;
  background: linear-gradient(to bottom, #4badf6, #49a0ff);
  border: 2px solid #fff;
  color: #fff;
  border-radius: 7px;
  text-align: center;
  box-shadow: 0px 2px 12px #303030;
  padding: 15px;
}

/**
 * English
 */
.en .iAB { background-image:url(../img/accueilEn_anim.gif); }
.en .iAH1 { background-image: url(../img/accueilHautEn01.png); }
.en .iAH2 { background-image: url(../img/accueilHautEn02.png); }
.en .iAH3 { background-image: url(../img/accueilHautEn03.png); }
.en .iAH4 { background-image: url(../img/accueilHautEn04.png); }
.en .iAH5 { background-image: url(../img/accueilHautEn05.png); }

 .en .iSH { background-image:url(../img/splashHautEn.png); }
.en .iSB { background-image: url(../img/splashBasEn_WLA.png); }

.en .iCH2 { background-image: url(../img/chaudeHautEn02.jpg); }
.en .iCH3 { background-image:url(../img/zenHautEn03.png); }

.en .iDH1 { background-image:url(../img/doreeHautEn01.png); }

.en .iZH { background-image:url(../img/zenHautEn01.png); }

.en .iEndRoundZH { background-image:url(../img/zenHautEn02.jpg); }

.en .iEndRoundCH1Life { background-image:url(../img/chaudeHautEn01.jpg); }

.en .iEndRoundDHen { background-image:url(../img/doreeHautEn01.png); }

.en .shake { background-image:url(../img/objTxtEn01.png); }

.en .tap { background-image:url(../img/objTxtTap.png); }

.en .claimButton { background-image: url('../img/butLotEn01.gif') };
.en .claimButton:active { background-image: url('../img/butLotEn02.gif') }

.en .claimWin
{
  font-size: 5.5vh;
  font-weight: bold;
}


.en .btnReady1
{
    height: 24%;
    width: 90%;

    display:block;
    position:absolute;
    top:4.5%;
    right:5%;

    background-image:url(../img/splashEn_txtNoGame.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.en .btnReady2
{
    height: 24%;
    width: 64%;

    display:block;
    position:absolute;
    top:4.5%;
    right:18%;

    background-image:url(../img/splashEn_butJoinIn.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.en .btnWinner
{
    height: 16%;
    width: 55%;

    display:block;
    position:absolute;
    top:58%;
    right:22%;
    background-image:url(../img/splashEn_butPrizesWon.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.lblCountdown  {
    height: 50px;
    width: 140px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 6vh;
    position: relative;
    left: 50%;
    top: -34%;
    margin-left: -70px;
    color: #fff;
}