/* =========== */
/* = GENERAL = */
/* =========== */

body{
  margin:0;
  padding:0;
/*  width:980px;*/
  height:600px;
  text-align:center;
  background-color:#0f2b58;
  font-family: Arial, sans-serif;
  color:#0f2b58;
  position:relative;
}
h1,h2,h3,h4,h5,h6,p{
  margin:0 auto;
}
img{
  border:0;
}
#footer{
  margin:0;
  padding:0;
  list-style-type: none;
  line-height:33px;
  width:500px;
  position:absolute;
  bottom:0;
  right:50%;
  margin-right:-250px;
}
#footer li{
  display:inline;
}
#footer a{
  color:#fff;
  text-decoration:none;
  font-size: 12px;
  padding:0 10px;
}
#footer a:hover{
  text-decoration: underline;
}
#enhaut{
  height:0;
  margin:0 auto;
  position:relative;
}
#accueil{
  position:absolute;
  top:0;
  left:50%;
  margin-left:387px;
}
#accueil img{
  border:0;
}

/* ========= */
/* = INTRO = */
/* ========= */

#intro h1, #intro h2, #intro p{
  text-indent: -9999px;
}
#intro h1 {
  background: transparent url('../images/intro_h1.jpg') no-repeat scroll top center;
  width: 980px;
  height: 289px;
}
#intro h2 {
  background: transparent url('../images/intro_h2.jpg') no-repeat scroll top center;
  width: 980px;
  height: 103px;
}
#intro p {
  background: transparent url('../images/intro_p.jpg') no-repeat scroll top center;
  width: 980px;
  height: 208px;
}

/* ================ */
/* = PRESENTATION = */
/* ================ */

#presentation{
  background: #0f2b58 url('../images/background.jpg') no-repeat scroll top center;
  margin:0 auto;
  padding:0 23px 0 0;
}
#presentation h1,
#inscription h1,
#code h1,
#confirmation h1{
  text-indent:-9999px;
  width: 980px;
  height: 150px;
  color:#fff;
}
#presentation h2{
  height: 47px;
  font-size: 12px;
  color:#fff;
}
#presentation #argumentaire {
  width:500px;
  font-size: 12px;
  line-height:110%;
  margin:0 auto;
  padding:0;
  color:#0f2b58;
  height:102px;
}
#presentation #actions{
  margin:0 auto;
  width:501px;
}
#presentation #identifiezvous{
  width:267px;
  float:left;
}
#presentation #inscrivezvous{
  float:right;
  width:234px;
}

#presentation #identifiezvous h2 {
  padding:0 0 0 70px;
}
#presentation .contenu {
  position: relative;
  height: 180px;
}
#presentation #identifiezvous .contenu p{
  margin:0 0 20px 20px;
  text-align:left;
  height:23px;
}
#presentation label{
  color:#0f2b58;
  width:90px;
  display:block;
  float:left;
  font-size: 12px;
  line-height:23px;
}
#presentation .input{
  float:left;
  width: 138px;
  height: 23px;
  background: url('../images/inscription_champ.gif') no-repeat scroll top left;
}
#presentation .input input{
  width: 138px;
  height: 23px;
  border:0;
  background-color:transparent;
}
#presentation .bouton{
	width: 125px;
	height: 57px;
}
#presentation #oubli_mdp{
  color:#0f2b58;
  display:block;
  font-size: 12px;
  margin:0 0 0 90px;
}
#presentation #valider{
  text-align:center;
}
#presentation #inscrivezvous .contenu p{
  color:#0f2b58;
  font-size:12px;
  text-align:left;
  margin:0 20px 20px 20px;
}
#presentation #sinscrire,
#presentation #valider{
  position:absolute;
  bottom:0;
  left:50%;
}
#presentation #valider{
  margin-left:-36px;
}
#presentation #sinscrire{
  margin-left:-70px;
}
#presentation .nb,
#inscription .nb,
#code .nb{
  font-size:10px;
  color:#00afd9;
}
#presentation .erreur_saisie label, #presentation span.erreur_saisie{
  color:#f00;
}
#presentation .erreur_saisie .input{
/*  background: transparent url('../images/presentation_champ_err.gif') no-repeat scroll top left;*/
}
/* =============== */
/* = INSCRIPTION = */
/* =============== */

#inscription,#code{
  background: #0f2b58 url('../images/background_bis.jpg') no-repeat scroll top center;
  margin:0 auto;
  padding:0 23px 0 0;
}
#inscription #argumentaire{
  width:500px;
  font-size: 12px;
  line-height:110%;
  margin:0 auto;
  padding:0;
  color:#0f2b58;
  height:30px;
}
#inscription #message,
#code #message {
  width:500px;
  font-size: 12px;
  line-height:110%;
  margin:0 auto;
  padding:0;
  color:#f00;
  height:30px;
  font-weight: bold;
}
#inscription .nb{
  position:absolute;
  right:15px;
  bottom:-20px;
}
#inscription p.erreur_saisie label.txt{
  color:#f00;
}
#inscription label.erreur_saisie{
  color:#f00;
}
#inscription div.erreur_saisie{
  background: transparent url('../images/inscription_champ_err.gif') no-repeat scroll top left !important;
}
#inscription #actions,
#code #actions{
  width:500px;
  margin:0 auto;
  position:relative;
}
#inscription form p{
  font-size:12px;
  width:500px;
  clear:both;
  text-align:left;
  height:31px;
  margin:0;
}
#inscription form p.chk{
  height:20px;
  padding:0 0 0 105px;
}
#inscription label.txt{
  display:block;
  width:90px;
  float:left;
  line-height:23px;
  margin:0 0 0 15px;
}
#inscription .input{
  float:left;
  width: 138px;
  height: 23px;
  background: url('../images/inscription_champ.gif') no-repeat scroll top left;
}
#inscription .input input{
  width: 138px;
  height: 23px;
  border:0;
  background-color:transparent;
}
#inscription label.dbl{
  display:block;
  width:90px;
  float:left;
  line-height:12px;
  margin:0 0 0 15px;
}
#inscription label.rad{
  margin:0 0 0 15px;
}
#inscription #valider{
  margin-left:93px;
}
#inscription #legal{
  width:500px;
  text-align:justify;
  font-size:10px;
  margin-top:40px;
  color:#fff;
  line-height:10px;
}

/* ======== */
/* = CODE = */
/* ======== */

#code form p{
  font-size:12px;
  text-align:left;
  clear:both;
  height:30px;
}
#code form p.captcha{
  height:37px;
}
#code form p.captcha img{
  vertical-align: middle;
}
#code #actions{
  height:240px;
}
#code label{
  display:block;
  width:230px;
  float:left;
  line-height:23px;
  margin:0 0 0 30px;
}
#code label.dbl{
  line-height:12px;
}
#code .input{
  float:left;
  width: 138px;
  height: 23px;
  background: url('../images/inscription_champ.gif') no-repeat scroll top left;
}
#code .input input{
  width: 138px;
  height: 23px;
  border:0;
  background-color:transparent;
}
#code #argumentaire {
  width:500px;
  font-size: 12px;
  line-height:110%;
  margin:0 auto;
  padding:0;
  color:#0f2b58;
  height:70px;
}
#code #valider{
  position:absolute;
  bottom:0;
  left:188px;
}
#code .nb{
  position:absolute;
  left:0;
  width:500px;
  text-align:center;
  bottom:100px;
  font-size: 12px;
}
#code .nb a{
  color:#00afd9;
}
#code label.erreur_saisie{
  color:#f00;
}
#code div.erreur_saisie{
  background: transparent url('../images/presentation_champ_err.gif') no-repeat scroll top left;
}
#code img.clickable{
	cursor: pointer;
}

/* ================ */
/* = CONFIRMATION = */
/* ================ */

#confirmation{
  background: #0f2b58 url('../images/background_confirmation.jpg') no-repeat scroll top center;
  margin:0 auto;
  padding:0 23px 0 0;
}
#confirmation #argumentaire {
  width:500px;
  font-size: 12px;
  margin:0 auto 20px auto;
  padding:0;
  color:#0f2b58;
}
#confirmation #gain{
  color:#fff;
  font-size:12px;
}
#confirmation #link_retour{
	margin-top: 12px;
	color: white;
	font-size: 12px;
	text-decoration: underline;
	display: block;
	outline: none;
}

/* ========= */
/* = OUBLI = */
/* ========= */

#oubli,
#gratuit {
  background: url('../images/background_oubli_mdp.jpg') no-repeat scroll top left;
  width: 594px;
  height: 390px;
  background-color:#0f2b58;
  position:relative;
}

#oubli #actions,
#gratuit #actions{
  position:absolute;
  top:160px;
  left:75px;
  width:444px;
}
#oubli #valider,
#gratuit #valider{
  display:block;
  position:absolute;
  top:63px;
  left:32px;
  width:141px;
  height:66px;
  text-decoration:none;
}
#oubli label,
#gratuit label{
  font-size:12px;
  margin-right:20px;
  margin-left:100px;
  float:left;
  width:50px;
}
#oubli #argumentaire,
#gratuit #argumentaire{
  position:absolute;
  top:80px;
  left:75px;
  font-size:12px;
  width:444px;
}
#oubli .input,
#gratuit .input{
  float:left;
  display:block;
  width: 138px;
  height: 23px;
  background: url('../images/inscription_champ.gif') no-repeat scroll top left;
}
#oubli .input input,
#gratuit .input input{
  width: 138px;
  height: 23px;
  border:0;
  background-color:transparent;
}
#oubli #fermer,
#gratuit #fermer{
  display:block;
  width:30px;
  height:30px;
  position:absolute;
  left:476px;
  top:45px;
  text-decoration:none;
  z-index:100;
}
#oubli #message_succes,
#oubli #message_erreur{
  font-size:12px;
  color:#00afd9;
  position:absolute;
  width:444px;
  top:200px;
  left:75px;
}
#oubli #message_erreur{
  color:#f00;
  font-weight:bold;
}

/* =========== */
/* = GRATUIT = */
/* =========== */

#gratuit #message_succes,
#gratuit #message_erreur,
#gratuit #message_vide{
  font-size:12px;
  color:#00afd9;
  position:absolute;
  width:444px;
  top:200px;
  left:75px;
}
#gratuit #message_erreur,
#gratuit #message_vide{
  color:#f00;
  font-weight:bold;
}
#gratuit #legal,
#oubli #legal{
  width:440px;
  text-align:justify;
  font-size:10px;
  color:#fff;
  position:absolute;
  bottom:20px;
  left:75px;
  line-height:10px;
}

/* =========== */
/* = CREDITS = */
/* =========== */

#reglement,
#credits{
  color:#fff;
  font-size:12px;
  text-align:left;
  padding:0;
  overflow:hidden;
  background: #0f2b58 url('../images/bg_popup.jpg') no-repeat scroll top left;
}
#credits{
/*  background: #0f2b58 url('../images/bg_popup_credits.jpg') no-repeat scroll top left;*/
}
#reglement div,
#credits div{
  width:594px;
  height:390px;
  margin:0 auto;
  overflow-y:scroll;
  text-align:justify;
}
#credits div{
/*  overflow-y:hidden;*/
}
#reglement h1,
#credits h1{
  margin:18px 30px 18px 30px;
}
#reglement h2,#reglement h3,#reglement h4,
#credits h2,#credits h3,#credits h4{
  margin:0 30px 18px 30px;
}
#reglement p,
#credits p{
  margin:0 30px 18px 30px;
}
#reglement a,
#credits a{
  color:#fff;
}
#reglement ul{
  margin:0 30px 18px 24px;
  padding:0 0 0 30px;
}
#reglement li{
  margin:0 0 9px 0;
}