*{
    margin:0;
    padding:0;font-family:Arial, Helvetica, sans-serif;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
a{
    color:#89181a;
}
#footer a{
    color:#89181a;
}


a:hover{
    text-decoration:none;}
body{
    background:url(../images/bg-site.png) top center no-repeat #FFFFFF;
    position:relative;}

h1,h2,h3,h4{
    color:#363488;
    text-align:center;
    font-size:1.4em;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25);
    font-family: "Lucida Grande", sans-serif;
    font-weight: 500;
    margin-bottom: 15px;
}
h1,h2{
    color:#22214c;
}
.result{}

label{
    width:auto;
    min-width: 45%;
    text-align:left;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
    padding: 2px 5%;
    display: inline-block;
}

.hidden{
    display: none;
}

#conteneur{
    width:950px;
    margin: 0 auto;
    padding-top: 110px;
    position:relative;
    background:transparent }
#conteneur h1{
    font-size:20px;}
#conteneur h1 span{
    font-size:14px;
    color:#40A220;}
form{
    text-align: center;

}
#formulaire{
    width:100%;
    margin:0px auto 0 auto;
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.0);
    border-radius: 0px;


}
#formulaire.starting form{
    max-width:450px;
    margin-left:auto;
    margin-right:auto;
    display:block;
}

#formulaire.starting select ,
#formulaire.starting input {
    max-width:450px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
}
#formulaire.starting .partcheck{
    width:450px;
}

#formulaire.starting .partcheck .accept {
    margin-top:0px;
    width:370px;
    line-height: 35px;
    font-size: 11px;
    background:transparent;
    padding:0;
}
#formulaire p{

}
#formulaire input[type!=radio],
#formulaire select{
    height:35px;
    width: 100%;
    width: auto;
    font-size:1.1em;
    padding:5px;
    border:1px solid rgba(0,0,0,0.25);
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    max-width: 100%;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;

}

#formulaire select option:first {
    color:#999;
}
#formulaireResult{

    margin:0px auto 0 auto;

    padding-top: 0px;
    text-align: center;
    width: 580px;
    background: transparent;
    border-radius: 10px;
    padding:25px;
}

#formulaireResult input{
}
#formulaireResult label{


}
.bg-info {
    background-color: #5bc0de;
    color: #fff;

    padding: 7px;
    border-radius:6px;
    margin-bottom: 15px;
}
#bouton{

    max-width:225px;
    background: none repeat scroll 0 0 transparent;
    clear:both;margin:20px auto 10px auto;
    display: block;
    text-align: center;
}
#bouton img{
    max-width:70px;
}
.bouton{
    /*background:url(../images/bg-bouton.png) no-repeat center top;*/
    background-size:70%;
    /*text-indent:-9999px;*/
    /*width:130px !important;*/
    /*font-size:40px;*/
    color:#fff !important;
    padding:10px; border:none !important;
    background: #13a0d8;
    cursor:pointer;
    text-decoration:none;
    border-radius:7px;
    -webkit-appearance: none;
    display: block;
    margin: auto auto;
    background: #22214c;
    text-align:center;
    box-shadow: 0 0 6px rgba(0,0,0,0.4);
    height:auto!important;
    padding:10px 20px!important;
    max-width:225px;
}
.mxkcanvas{
    position:absolute !important;
    margin: 0 auto;
    top:0;
    z-index:9999999;
    width:100% !important;
    display:block;
}
canvas{

    display:block;

}
.boutonresult{
    background:url(../images/bg-bouton.jpg) repeat-x;
    height:30px;
    border: 1px solid #77AE02 !important;

    color: #FFFFFF !important;
    cursor: pointer;
    font-size: 40px;
    height: 34px !important;
    padding: 10px;
    text-shadow: 2px 2px 2px #628B08;
    width: 100% ;
}

#footer{
    width:100%;
    margin:0px auto 0px auto;
    clear:both;
    position: absolute;
    bottom: 0;
    left:0;
    padding:10px 5px ;
    font-size:11px;
    color:#5e5e5e;
    background:rgba(255,255,255,0.00);
}

#footer span{
    font-size:13px !important;
    font-weight:bold;
    float:right;display:block;

}
#footer span a{
    text-decoration:none;background:#48BD59;
    display:block;padding:5px;}
#footer span a:hover{
    text-decoration:none;
    display:block;background:#92CE52;}



.choice.champs {
    background: rgba(255, 255, 255, 0.85) none repeat scroll 0 0;
    border-radius: 6px;
    display: inline-block;
    font-weight: bold;
    margin-bottom: 14px;
    text-align: left;
    transition-duration:1s;
    max-width:100%;
}

.champs {
    background: none;
    border-radius: 6px;
    font-weight: bold;
    margin-bottom: 14px;
    text-align: left;
    transition-duration:1s;
    max-width:100%;
}

.champs.error{
    background: #d9534f none repeat scroll 0 0;
    animation: redalert 4s infinite;
}
.champs.error .champs-label label{
    color:#ffffff;


}
.champs-control{
    text-align:center;
}
.champs-control,
.champs-label{
    font-size:20px;
    line-height: 20px;
}
.partcheck {
    margin: 0 auto;
    width: 50%;
    padding: 1px;
    margin-bottom:15px;
}
.optin_check{
    float: left;
    padding: inherit !important;
    width: 30px !important;
}

.spacer {clear:both;}
.gagne{
    text-align:center;
    background:url(../images/icongagne.png) no-repeat top center;
    padding-top:134px;
}

.perdu{
    text-align:center;
    /*background:url(../images/iconperdu.png) no-repeat top center;
    padding-top:134px;*/
}
#formulaireResult img{
    margin-bottom:32px;
    max-width: 100%;
}
.imgperdu{
    background:url(../images/perdu-code-barre.png) no-repeat top center;
    width : 549px;
    height : 147px;
    display:block;
    background-size:auto 100%;

}
#formulaireResult h1{
    padding-top: 0px;
    font-size: 2.1em;
    font-weight: 200;
    padding-bottom:0.4em;
}
#formulaireResult p{

}
.imgperdu,
.gagne{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 30%;
    margin-right:5%;
    text-align:right;
    float:left;
}
#win #formulaireResult p{


}
#vid {
    text-align: center;

}
#vid  video{
    border: 14px solid rgba(0, 0, 0, 0.6);
    border-radius: 14px;
}
p{
    margin-top: 0.5em ;
    margin-bottom: 0.5em ;
}


#conteneur.reglement{
    background: top center no-repeat #ffffff;
    color:#5e5e5e;
    padding:20px;

}
.partcheck2{
    border:2px solid #22214c;

}
.partcheck2 label{
    margin:0;
    padding:1em 1.5em;
    display:block;
    width:100%;
    box-sizing: border-box;
}
#formulaire .partcheck2 input{
    display:none;
}
.partcheck2.selected label{
    background:#22214c;
    color:#ffffff;
}
#formulaire.starting label{
    font-size:1.0em;
    margin-top:0.5em;
    padding: 0.5em 15px  0.5em 5px ;
    background:#f9f9f9;
    border-radius: 5px 5px 0 0 ;
    text-transform: none;
    color:#757575;

}


#formulaire.starting select{
    margin-bottom:1em;
}
legend{
    border-radius:5px 0 0 5px;
    text-align:center;
    background:#BF0909;
    color:#ffffff;
}

/* Effet blur */
.show.blur-effect ~ .overlay {
    background: rgba(123,123,123,0.4);
}

.show.blur-effect ~ .container, .show.blur-effect ~ .bgall{
    -webkit-filter: blur(30px);
    -moz-filter: blur(30px);
    filter: blur(30px);
}

.blur-effect .popup-content {
    -webkit-transform: translateY(-5%);
    -moz-transform: translateY(-5%);
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
    opacity: 0;
}

.show.blur-effect ~ .container,
.blur-effect .popup-content, .show.blur-effect ~ .bgall {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.show.blur-effect .popup-content {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}
/*  popup */
.modal {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 50%;
    max-width: 630px;
    min-width: 320px;
    height: auto;
    z-index: 2000;
    visibility: hidden;
    background: #473542;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

.show {
    visibility: visible;
}

.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    visibility: hidden;
    top: 0;
    left: 0;
    z-index: 1000;
    opacity: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.show ~ .overlay {
    opacity: 1;
    visibility: visible;
}

.popup-content {
    color: #fff;
    position: relative;

    margin: 0 auto;
    padding: 6% 10%;
}

.popup-content h3 {
    margin: 0;
    text-align: center;
    font-size: 3.4em;
    font-weight: 300;
    position: relative;
}



.popup-content .para {
    color: #B494AB;
    margin-bottom: 30px;
    text-align: justify;
}

.popup-content > div {
    padding: 0px;
    margin: 0;
    font-weight: 300;
    font-size: 1.15em;
}

.popup-content > div p {
    margin: 0;
    padding: 10px 0;
}

.popup-content > div ul {
    margin: 0;
    padding: 0 0 30px 20px;
}

.popup-content > div ul li {
    padding: 5px 0;
}

.popup-content button {
    display: block;
    margin: 0 auto;
    font-size: 0.8em;
}
.popup-content .close{
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    padding: 15px;
    text-align: center;

    transition-duration:0.3s;
    display: inline-block;
    width:auto;
}
.popup-content .close:hover{
    cursor:pointer;
    background:rgba(255,255,255,0.2)
}
/*fin popup*/
.center-block {
    text-align: center;
}
/* coffre */
#coffre{
    display:block;
    width:100%;
    margin:1.5em auto;
    position:relative;
}
#hautcoffre{
    background:url(/images/HAUT-COFFRE-OUVERT2.png)  bottom center no-repeat transparent;
    width:100%;
    height:433px;
    display:block;
    position:absolute;
    top:-433px;
    left:50%;
    margin-left:-50%;

}
#hautcoffre.ouvert{
    background:url(/images/HAUT-COFFRE-OUVERT2.png)  top center no-repeat transparent;


}
#bascoffre.ouvert{
    background:url(/images/BAS-COFFRE.png)  bottom center no-repeat transparent;
}
#bascoffre{
    background:url(/images/BAS-COFFRE.png)  top center no-repeat transparent;
    width:676px;
    height:225px;
    display:block;

    margin: 217px auto 0;
}
.code {
    display:inline-block;
    width:43px;
    margin: 0 5px 0 6px;
}
.code input{
    font-weight:bold;
    color: #d6c600;
    background:transparent;
    border:0px none !important;
    text-align:center;
    padding:0;
    min-height:30px;
    line-height:30px;
    width:100%;
}
.combinaison{
    margin-left: 25px;
    padding-top: 27px;
}
.combinaison .button{

    cursor:pointer;
    color: rgba(0,0,0,0);
}
.combinaison button {
    background: transparent;
    border: 0 none;
    border-radius: 50%;
    display: inline-block;
    height: 44px;
    line-height: 44px;
    margin: 16px 20px 20px 25px;
    vertical-align: top;
    width: 44px;
    cursor: pointer;
    color: rgba(0,0,0,0);
}
.code .button:hover,
.combinaison button:hover {
    background:rgba(255,255,255,0.15);
}
#bascoffre form {
    margin: 0 auto;
    max-width: 267px;
}
/*fin coffre*/

.bgsite.container{
    margin: 0 auto;
}
.reglement{
    font-size:15px;
}
.finalresult{
    transition-duration: 2.5s;
}
#conteneur #already,
#conteneur #lose,
#conteneur #win{
    perspective: 800px;
}
#formulaireResult{
    width: 100%;
    height: 100%;

}
#formulaireResult.animate{
    transform-style: preserve-3d;
    transition-duration: 2.5s;
    transform: rotateX( 4500deg );
    background:rgba(255,255,255,1);
    backface-visibility: hidden;
}
#formulaireResult img{max-height: 180px;border-radius: 50%;margin-bottom: 0;}
#formulaireResult h1{ backface-visibility: hidden;transition-duration: 2.5s;}
.flipped {
    transform: rotateX( 0deg )!important;
    background:rgba(255,255,255,0.0) !important;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes grow {
    0%   {top: -66px;font-size:25px;-webkit-transform:rotateX( 0deg )!important;color:#8CBF43;line-height: 25px;}
    10%  {top: -123px; font-size:23px;color:#068711;}
    20%  {top: -66px;font-size:25px;color:#8CBF43;}
    30%  {top: -123px; font-size:23px;color:#068711;}

    40%  {top: -66px;font-size:25px;-webkit-transform:rotateX( 4680deg )!important;color:#8CBF43;}
    100%  {top: -66px;font-size:25px;-webkit-transform:rotateX( 4680deg )!important;}

}

/* Standard syntax */
@keyframes grow {
    0%   {top: -66px;font-size:25px;-webkit-transform:rotateX( 0deg )!important;color:#8CBF43;line-height: 25px;}
    10%  {top: -123px; font-size:23px;color:#068711;}
    20%  {top: -66px;font-size:25px;color:#8CBF43;}
    30%  {top: -123px; font-size:23px;color:#068711;}

    40%  {top: -66px;font-size:25px;-webkit-transform:rotateX( 4680deg )!important;color:#8CBF43;}
    100%  {top: -66px;font-size:25px;-webkit-transform:rotateX( 4680deg )!important;}
}
/* Chrome, Safari, Opera */
@-webkit-keyframes bckgrow {
    0%   {background-size: auto 100%;}
    10%  {background-size: auto 65%;}
    20%  {background-size: auto 100%;}
    30%  {background-size: auto 65%;}

    40%  {background-size: auto 100%;}
    100%  {background-size: auto 100%;}

}

/* Standard syntax */
@keyframes bckgrow {
    0%   {background-size: auto 100%;}
    10%  {background-size: auto 65%;}
    20%  {background-size: auto 100%;}
    30%  {background-size: auto 65%;}

    40%  {background-size: auto 100%;}
    100%  {background-size: auto 100%;}
}

/* Chrome, Safari, Opera */
@-webkit-keyframes redalert {
    0%   {background: #d9534f ;}
    25%  {background: #ff0000 ;}
    50% {background: #d9534f;}
    75%  {background: #ff0000 ;}
    100% {background: #d9534f;}

}

/* Standard syntax */
@keyframes redalert {
    0%   {background: #d9534f ;}
    25%  {background: #ff0000 ;}
    50% {background: #d9534f;}
    75%  {background: #ff0000 ;}
    100% {background: #d9534f;}
}
.starting h3.grow{
    position: absolute;
    top: 0px;
    left: 227px;
    -webkit-animation: grow 8s infinite; /* Chrome, Safari, Opera */
    animation: grow 8s infinite;

}

.starting.grow{
    -webkit-animation: bckgrow 4s infinite; /* Chrome, Safari, Opera */
    animation: bckgrow 4s infinite;

}

#vid{
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index:999;
    background: #000000 none repeat scroll 0 0;
    height: 100%;
    padding-top: 0px;
}
#vid video{
    height: 100%;
    border:0px solid rgba(0, 0, 0, 0.6);
    border-radius: 0px;
}
.loi{
    text-align: justify;
    padding: 0 10px;
}
.alert {
    background: #ffffff none repeat scroll 0 0;
    color: #222;
    display: block;
    font-size: 37px;
    text-transform:uppercase;
    transition-duration:1s;
    left: 0;
    opacity: 0.8;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2147483647;
}
input + span:before{
    display:none;
    content:"";
}
.error input.required + span:before{
    content:"champs requis";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}

.error input.numeric + span:before{
    content:"champs requis";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}
.error input.email + span:before{
    content:"email invalide";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}
.error input.tel + span:before{
    content:"numero de telephone invalide";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}
.error input.tel_fixe + span:before{
    content:"numero de telephone invalide";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}
.error input.tel_port + span:before{
    content:"numero de telephone invalide";
    display: block;
    padding: 5px;
    font-size:10px;
    color:#ffffff;
}
.error .partcheck{
    background: #d9534f none repeat scroll 0 0;
    animation: redalert 4s infinite;

}
.error .optin_check.required + span:before{
    content:"vous devez accepter le reglement";
    display: block;
    padding: 5px;
    font-size:10px;
}

/* bandit manchot */

.machineContainer{
    background-color: #000;
    padding: 5px 1px 5px 1px;
    overflow: hidden;
    height: 135px;

}
.slotMachine{
    width: 30%;
    margin: 1%;
    border: 5px solid rgba(0,0,0,0.3);
    height: 100px;
    padding: 0px;
    overflow: hidden;
    display: inline-block;
    text-align: center;
    /*margin: 0px 5px;*/
    /*border: 5px solid #000;*/
    background-color: #ffffff;

}
.machineResult{
    color:#fff;
    text-align:center;
    font-weight: 900;
}
.noBorder{
    border:none !important;
    background: transparent !important;
}
.slotMachine .slot{
    height:100px;
    background-position-x: 55%;
    background-repeat: no-repeat;
    background-color: #ffffff;
}
.slot1{
    background-image: url("/img/slot1.jpg");
}
.slot2{
    background-image: url("/img/slot2.jpg");
}
.slot3{
    background-image: url("/img/slot3.jpg");
}
.slot4{
    background-image: url("/img/slot4.jpg");
}
.slot5{
    background-image: url("/img/slot5.jpg");
}
.slot6{
    background-image: url("/img/slot6.jpg");
}


#textMachine, #textMachine2{
    width:520px;
    height: 67px;
    overflow: hidden;
    display: inline-block;
    text-align: left;
}
#textMachine > *, #textMachine2 > *{
    padding: 0px 0px;
}




.slotMachineButton{
    width:60px;
    height: 60px;
    overflow: hidden;
    display: inline-block;
    text-align: center;
}
.slotMachineButton {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff670f+0,ff670f+100;Orange+Flat+%231 */
    background: #ff670f; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #ff670f 0%, #ff670f 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #ff670f 0%,#ff670f 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #ff670f 0%,#ff670f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff670f', endColorstr='#ff670f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */


    border: 6px solid #e2e2e2;
    border-radius: 50%;

    clear: both;
    color: #ffffff;
    cursor: pointer;
    display: block;
    font-size: 40px;
    font-style: normal;
    font-weight: bold;
    height: 200px;
    line-height: 180px;
    margin: 0 auto;
    text-align: center;
    text-decoration: none;
    text-indent: 0;
    text-shadow: 1px 1px 0 #cc9f52;
    width: 200px;
}
.slotMachineButton:hover {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff670f+0,ff782b+100 */
    background: #ff670f; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff670f 0%, #ff782b 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ff670f 0%,#ff782b 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ff670f 0%,#ff782b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff670f', endColorstr='#ff782b',GradientType=0 ); /* IE6-9 */


}.slotMachineButton:active {
     background: #ff670f; /* Old browsers */
     background: -moz-linear-gradient(top,  #ff670f 0%, #ff782b 100%); /* FF3.6-15 */
     background: -webkit-linear-gradient(top,  #ff670f 0%,#ff782b 100%); /* Chrome10-25,Safari5.1-6 */
     background: linear-gradient(to bottom,  #ff670f 0%,#ff782b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff670f', endColorstr='#ff782b',GradientType=0 ); /* IE6-9 */
 //position:relative;
 //top:1px;
 }

#slotmachine{
    position: relative;
    margin: 0 auto;
    top:0;
    left:0;
    text-align: center;
    width: 100%;
    padding-top: 50px;
    z-index: 999;
    height: 100%;
}
.slotMachine .slot{
    background-position: center center;
}
.slotMachine  .slot{
    background-size: 100% auto;
}
.slotMachine ,
.slotMachine  .slot{
    height:720px;

}
#slotmachine a {
    background: #f7f7f7 none repeat scroll 0 0;
    border: 1px solid #cecece;
    border-radius: 5px;
    display: inline-block;
    padding: 1em 2em;
    text-decoration: none;
    text-transform: uppercase;
}
.machineResult{
    height:2.5em;
    color:#cecece;
    padding: 1em;
    display: block;
}
.bouton.print{
    max-width: 100%;
    width:100%;
    font-size:2.3em;

}
#footer #bouton{
    max-width: 100%;}

#conteneur img{
    display: block;
    margin: 0 auto;
    max-width: 80%;}
#vid.nobackground{
    background: transparent;

}
a.bouton.print{
    background: rgba(0,0,0,0.5);
}
a.bouton.print:hover{
    background: #BF0909;
}
#scan-form legend{
    left: 0;
    position: fixed;
    text-align: center;
    top: 0;
    z-index: 999999999;
    line-height: 1.5em;
    font-size:5em;
    font-weight:bold;
    width:100%;

}
.champs label{
    min-width:0;
}

.champs-label{
    padding-right:1em;
    position: relative;
}
.champs-label .required{
    float: right;
    position: absolute;
    right: 0.5em;
    top: 0.2em;
}

#slotmachine{
    padding-top: 183px;
}

.slotMachine{
    margin: 27px 97px 1% 0;
    width: 415px;
    border: 0px none;
    box-shadow: 0px 0px 5px #000 inset;
    border-radius: 4px;
}
.slotMachine .slot{
    box-shadow: 0 0 96px #000 inset;
}
.slotMachineButton{
    position: absolute;
    right: 7px;
    top: 18px;
    width: 170px;
    height:170px;
    line-height: 150px;
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.8) inset;
    border: 10px solid rgba(0, 0, 0, 0.26);

}

.slotMachine, .slotMachine .slot{
    width: 100%;
}

#slotcontainer {
    margin: 0 auto;
    width: 87%;
    background-color: gray;
    border: 5px ridge black;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
}
.slotMachineButton {
    width: 240px;
    height:240px;
    line-height: 240px;
}
.slotMachine{
    width: 29.333%;
    margin: 1.5% 1.5% 1%;
}
/* #slotmachine {
     background: transparent url("/img/slot-machine-games.png") no-repeat scroll 0 183px;
     background-size: 100% auto;
 //background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #ffffff 7%, #ffffff 48%, #e1e1e1 59%, #f6f6f6 100%) repeat scroll 0 0;
 }*/
.slotMachineButton {
    position: relative;
    top:0;
    right:0;
}


.champs-control > a,
.partcheck > a{
    display: inline-block;
    vertical-align: middle;
}
.champs-control > a > img,
.partcheck > a > img{
    display: inline-block !important;
    vertical-align: initial;
    width:62px;
}

.boxtoggle{
    background :rgba(255,255,255,0.8);
    color:#5e5e5e;
    border-radius:5px;
    padding: 5px 10px;
    margin-right:15px;
    box-shadow:  0 0 0 3px rgba(255,255,255,0.3);
}
input[type="radio"]:checked+label.boxtoggle{
    background: #009265;
    color:#ffffff;
}

input[type="checkbox"]:checked+label.boxtoggle{
    background: #009265;
    color:#ffffff;
}




span.smileys:before,
span.notes:before{
    content:"";
    display:block;
    height:138px;
    width:138px;
    max-width: 100%;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: contain;
    height:32px;
    width:32px;
}
span.smiley0:before{
    background-image:url('/img/smiley0.png')

}
span.smiley1:before{
    background-image:url('/img/smiley1.png')

}
span.smiley2:before{
    background-image:url('/img/smiley2.png')

}
span.smiley3:before{
    background-image:url('/img/smiley3.png')

}
span.smiley4:before{
    background-image:url('/img/smiley4.png')

}
input[type="radio"] + span{
    border: 8px solid rgba(255,255,255,0.0);
    border-radius: 50%;
    display: block;
    padding: 1em;
}
input[type="radio"]:checked + span{
    border: 8px solid #009265;
}
.inline-block{
    display:inline-block;
}

span.note0:before{
    background-image:url('/img/note0.png')

}
span.note1:before{
    background-image:url('/img/note1.png')

}
span.note2:before{
    background-image:url('/img/note2.png')

}
span.note3:before{
    background-image:url('/img/note3.png')

}
span.note4:before{
    background-image:url('/img/note4.png')

}
.boxtoggle {max-width:80%;text-align: center;}

#rotate780 {
    transform-style: preserve-3d;
    transition-duration: 2.5s;
    transform: rotateX( 4500deg );
    background:rgba(255,255,255,0);
    backface-visibility: hidden;
    margin:0 auto;


}
.champs.smileys{
    width:100%;
}


.pacman > div:first-of-type, .pacman > div:nth-child(2) {
    border-color: #2FBBFC transparent #2FBBFC #2FBBFC;
    border-radius: 25px;
    border-style: solid;
    border-width: 25px;
    height: 0;
    width: 0;
}
@keyframes rotate_pacman_half_up {
    0%, 100% {
        transform: rotate(270deg);
    }
    50% {
        transform: rotate(360deg);
    }
}
@keyframes rotate_pacman_half_down {
    0%, 100% {
        transform: rotate(90deg);
    }
    50% {
        transform: rotate(0deg);
    }
}
@keyframes pacman-balls {
    75% {
        opacity: 0.7;
    }
    100% {
        transform: translate(-100px, -6.25px);
    }
}
.pacman {
    position: absolute;
    left:50%;
    top:50%;
}
.pacman > div:nth-child(3) {
    animation: 1s linear 0.33s normal none infinite running pacman-balls;
}
.pacman > div:nth-child(4) {
    animation: 1s linear 0.66s normal none infinite running pacman-balls;
}
.pacman > div:nth-child(5) {
    animation: 1s linear 0.99s normal none infinite running pacman-balls;
}
.pacman > div:first-of-type {
    animation: 0.5s ease 0s normal none infinite running rotate_pacman_half_up;
}
.pacman > div:nth-child(2) {
    animation: 0.5s ease 0s normal none infinite running rotate_pacman_half_down;
    margin-top: -50px;
}
.pacman > div:nth-child(3), .pacman > div:nth-child(4), .pacman > div:nth-child(5), .pacman > div:nth-child(6) {
    background-color: #2FBBFC;
    border-radius: 100%;
    height: 10px;
    left: 100px;
    margin: 2px;
    position: absolute;
    top: 25px;
    transform: translate(0px, -6.25px);
    width: 10px;
}
.cartload{
    position: fixed;
    top:0;
    left:0;
    background:rgba(255,255,255,1);
    width:100%;
    height:100%;
    z-index: 99999;
    display: block;
    opacity: 0.6;
}

.countdown{
    position: fixed;
    top:0;
    left:0;
    background:none;
    width:100%;
    height:100%;
    z-index: 99999;
    display: block;
    opacity: 1;
}

.number_count{
    font-size: 30em;
    text-align: center;
    color: black;
    top: 500px;
    position: relative;
}

.gagnants{
    color: #bb04de;
    font-size: 4em;
    position: fixed;
    top:0;
    left:0;
    text-align: center;
    width: 100%;
    height:1.5em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    background: rgba(255,255,255,0.9);
    padding-top:0.25em;
    margin-top:0;
}
.hide{display:none;}
.bouton.btn-disabled{
    background: #999!important;
    cursor: default;
}

.mmchoiceimg{
    line-height: 200px;
    max-height: 200px;
    margin: 0 auto;
    max-width: 100%;
    display: block;

}
.mmchoiceimg img{
    max-height: 200px;
    line-height: 200px;
    display: inline-block!important;
    vertical-align: middle;
}
.choice{
    vertical-align: top;
}

.row{
    clear: both;

}
.col-lg-6{
    display: inline-block;
    width: 50%;
    vertical-align: top;
}

.bouton{
    font-size:18px;
    min-width: 300px;
    max-width: 100%;
    display: inline-block;
}
.bouton.btn-success {
    background: #008F00 none repeat scroll 0 0;
}
.text-left{
    text-align: left;
}
.text-right{
    text-align: right;
}
.btn-group{
    margin-top: 3em;
}

.bouton.print {
    font-size: 1.3em;
    max-width: 100%;
    width: inherit;
    display:inline-block;
}
a.bouton.print{
    background: rgba(0,0,0,0.5);
}
a.bouton.print:hover{
    background: #BF0909;
}
#bouton {max-width:100%;}
label{
    padding: 2px 10px;
}
.champs-label .required {position:relative;float:none;}
.choice{
    border:5px solid  #ffffff;
}
.chosen{
    border:5px solid  #008f00;
}
.chosen label{
    color:  #008f00;
}
.gagnants {
    position: absolute;
    z-index: 9999999;
}

.full_width{
    width: 80%;
}

.full_width input, .full_width textarea{
    width: 80%;
}

.top-title{
    position: relative;
    top: -80px;
}

#wheelmachine {
    position: fixed;
    top: 80px;
    left: 560px;
    z-index: 900;
    height: 100%;
}

#wheelarrow{
    position: fixed;
    top: 430px;
    right: 510px;
    z-index: 999;
}

#wheelarrow img{
    width: 100%;
}



/*body{
cursor: none;
}*/

.mmchoiceimg img {
    max-height: 300px;
    margin-bottom: 40px !important;
}

.choice.champs {
    background: rgba(255, 255, 255, 0.0) none repeat scroll 0 0;
    margin: 0;
    height: auto;
}


/* largeur et hauteur des champs (input) du formulaire mais pour réduire les dimensions, aller en haut dans champs du formulaire*/
#formulaire input, #formulaire select {
    height: 50px;
    font-size: 2em;
}

#formulaire select {
    width: 100%;
}



#take_snapshots, {
    margin: 0.5em;
    margin-top: -50px!important;
}

/* pour changer l'optin du formulaire (largeur, couleur et taille du texte)*/

label {
    color: #000000;
    font-size: 1.5em;}

h3 {
    font-size: 2em;
    font-weight: bold;
}

#optin_ok {
    font-size : 21px;
    margin-bottom: 2%;
    margin-top: 2%;
    background: #162047;
    border-radius: 7px;
    color: #ffffff;
    padding: 20px;}

#optin_ko {
    font-size : 21px;
    margin-bottom: 2%;
    margin-top: 2%;
    background: #ffffff;
    border-radius: 7px;
    color: #162047;
    padding: 20px;}

.gagnants {
    padding-top:0.25em;
    margin-top:450px;
    color: #000000;
}

/* petite etoile */
.champs-label .required{
    float: right;
    position: absolute;
    right: 0.5em;
    top: 0.2em;
}

input[type=radio] {
    display:none;
}


/* quizz*/
.choice {
    height: 220px;
    min-height: 100px;
    justify-content: center;
    align-items: center;
}

#formulairequizz{
    padding-top:50px;
}