*{
  margin: 0;
  padding: 0;
}

html{
  height: 100%;
}

body {
  height: 100%;  
}

/* Police personnalisé */
@font-face {  font-family: "PrimeScript";  src: url('font/PrimeScript.ttf'); }
@font-face {  font-family: "CaviarDreams";  src: url('font/CaviarDreams.ttf'); }

Pour IE le code est différent soit : 
@font-face {  font-family: "PrimeScript";  src: url('font/PrimeScript.eot'); 
}

/* images input */
.input-ok{background-image: url('images/IconOkay-20px.png'); background-repeat: no-repeat; background-position: right; color: green; border-color: #8FCF3C; border-width:2px; }
.input-nok{background-image: url('images/IconError-20px.png'); background-repeat: no-repeat; background-position: right; color: red; border-color: #DB0B32; border-width:2px;}

#socialShare{width:500px;height:30px;margin-top:20px;}
#socialShare ul{padding: 0; margin: 0;text-align: center;}
#socialShare li{display: inline;list-style: none; height:30px;}
.socialLi{display:inline-block;margin: 0 20px;}
element.style {
  width: 103px;
  height: 23px;
}
/*********************** MENU *************************/

/* Feedback */
#sidePanel{
    z-index:999;
    width:350px;
    position:absolute;
    left:-302px;
    bottom:35%;
    
}
#panelHandle{
    background-image: -webkit-linear-gradient(top,#333,#222);
    background-image: -moz-linear-gradient(center top , #333333, #222222);
    background-image: -o-linear-gradient(center top , #333333, #222222);
    background-image: -ms-linear-gradient(center top , #333333, #222222);
    background-image:linear-gradient(center top , #333333, #222222);

    height:150px;
    width:40px;
    border-radius:0 5px 5px 0;
    float:left;
    cursor:pointer;
}
#panelContent{
    float:left;
    border:1px solid #333333;
    width:300px;
    height:250px;
    background-color:#EEEEEE;
}

#panelHandle p {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
    left: -4px;
    margin: 0;
    padding: 0;
    position: relative;
    top: 26px;
}






/* Slider commenter */
#slideCommenter{
  cursor:pointer;
  font-family: PrimeScript, "Trebuchet MS", Arial, Helvetica, sans-serif;
  letter-spacing: 1px;
  position: relative;
  color:white;
  width: 260px;
  height: 35px;
  margin: 0 auto;
  border: 1px solid #999087;
  text-align: center; 
  -webkit-border-radius: 0px 0px 20px 20px;
  -moz-border-radius: 0px 0px 20px 20px;
  border-radius: 0px 0px 20px 20px;
  -webkit-box-shadow: #666 0px 1px 2px;
  -moz-box-shadow: #666 0px 1px 2px;
  box-shadow: #666 0px 1px 2px;
  background: #2F332E;
}
#formSlideCommenter{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:0 auto;
  padding:20px;
  width:480px;
  height:515px;
  margin-top: 25px;
}
.commentaire{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:0 auto;
  padding:20px;
  width:480px;
  margin-top: 25px;
  -moz-box-shadow: 5px 5px 3px 0px #656565;
  -webkit-box-shadow: 5px 5px 3px 0px #656565;
  -o-box-shadow: 5px 5px 3px 0px #656565;
  box-shadow: 5px 5px 3px 0px #656565;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=3);
}
.commentaireAvatar{
 
-moz-border-radius:20px 0px 20px 0px;
-webkit-border-radius:20px 0px 20px 0px;
border-radius:20px 0px 20px 0px;

-moz-box-shadow: 7px 7px 3px 0px #656565;
-webkit-box-shadow: 7px 7px 3px 0px #656565;
-o-box-shadow: 7px 7px 3px 0px #656565;
box-shadow: 7px 7px 3px 0px #656565;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=3);

}
.commentaireContenu {
  font-family: CaviarDreams, "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 18px;
}



/* Options form accueil*/
.newClass {  height: 10px; }

/* Pagination des news */
#pagination{
  padding-top:45px;
}
.pagination {
  line-height:2em;
}
.pagination a,
.pagination span {
  padding:0.2em 0.5em;
}
.pagination a {
  border:1px solid #9AAFE5;
  color:#105CB6;
  text-decoration:none;
}
.pagination a:hover {
  border:1px solid #296BB5;
  color:#000031;
}
.pagination .prevnext {
  font-weight:bold;
}
.pagination span.disabled { 
  border:1px solid #DDDDDD;
  color:#999999;
}
.pagination span.current {
  border:1px solid #2E6AB1;
  background-color:#2E6AB1;
  color:#ffffff;
  font-weight:bold;
}

.nuage_social_left{
  position:absolute;
  background-image:url(images/nuage_facebook.png);
  background-repeat:no-repeat;
  height:150px;
  width:300px;
  top:35%;
  left:12%;
  z-index:2;
  opacity:1;
  text-transform:uppercase;
  font-weight:bold;
  font-size:18px;
}
.nuage_facebook{
  position:absolute;
  background-image:url(images/nuage_facebook.png);
  background-repeat:no-repeat;
  height:150px;
  width:300px;
  top:35%;
  right:2%;
  z-index:2;
  opacity:1;
  text-transform:uppercase;
  font-weight:bold;
  font-size:18px;
}

.nuage_fond{
  position:relative;
  background-image:url(images/nuage3.png);
  background-repeat:no-repeat;
  height:110px;
  width:600px;
  margin-top:80px;
  margin-right:auto;
  margin-left:auto;
  z-index:2;
  opacity:1;
  text-transform:uppercase;
  font-weight:bold;
  font-size:18px;
}
#_envoi{
  margin-top:150px;
  margin-bottom:330px;
}
.nuage_gratuit{
  position:absolute;
  background-image:url(images/nuage.png);
  height:112px;
  width:250px;
  left:30px;
  top:15%;
  text-transform:uppercase;
  font-weight:bold;
  font-size:24px;
}
.nuage_illimite{
  position:absolute;
  background-image:url(images/nuage.png);
  height:112px;
  width:250px;
  right:30px;
  top:15%;
  text-transform:uppercase;
  font-weight:bold;
  font-size:24px;
}
.nuage_sans_pub{
  position:absolute;
  background-image:url(images/nuage.png);
  height:112px;
  width:250px;
  right:30px;
  bottom:15%;
  text-transform:uppercase;
  font-weight:bold;
  font-size:24px;
}
.nuage_sans_inscription{
  position:absolute;
  background-image:url(images/nuage.png);
  height:112px;
  width:250px;
  bottom:15%;
  left:30px;
  text-transform:uppercase;
  font-weight:bold;
  font-size:24px;
}
#formulaire_envoi
{
	min-width:1050px;
}

#superglobal{
  background-image:url(images/fond_css.png);
  position : relative;
  min-height: 100%;
}

#global{

  position: relative;
  min-height: 100%;
  margin: 0 auto;
  padding-bottom: 70px;
  width: 100%;
}
#barre_menu{
  z-index:2;
  padding-bottom:42px; /*Hauteur de la barre menu*/
  background-image:url(images/barre_menu.png);
  background-repeat:repeat-x;
  min-width:1050px;
  top: 0;
    left: 0;
  right: 0;
    border: 1px solid #000000;
    position: absolute;
  text-align:center;
  height:10px;
}
#logo{
  z-index:3;
  background-image:url(images/logo-test.png);
  background-repeat:no-repeat;
  margin: 0 0 0 0;
  top:10px;
  width:300px;
  height:37px;
  position:absolute;
  left: 5%;  
}
#menu{
  z-index:3;
  width:605px;
  float:right;
  margin-right:10px;  
}

.espacement_menu{
  padding: 15px 2px 2px 30px;
}
#pied{
  position:absolute;
  bottom: 0px;
  height: 100px;
  width: 100%;
}
#credits{
  padding-top:17px;
  font-size:11px;
  text-align:center;
}
#footer_centre{
  position:relative;
  z-index:2;
  height:100px;
  width:900px;
  margin: 0 auto;
  background-image:url(images/footer.png);
  background-repeat:no-repeat;
}

#footer_fond{
  z-index:1;
  position:absolute;
  bottom: 0px;
  height: 73px;
  width: 100%;
  background-image:url(images/fond_footer.png);
  background-repeat:repeat-x;
  }
#contenu{
  top:20px;
  height:100%;
  width:100%;
}  
.premiere_lettre{
  font-size:24px;
  font-weight:bold;
}

.erreur{
  border:4px solid red;
  padding: 10px 50px 10px 50px;
  background-image:url(images/barre_menu.png);
  color:red;
  box-shadow: 8px 8px 12px #aaa;
  text-decoration:underline;
  border-radius: 10px;
}

.validation{
  border:4px solid green;
  padding: 10px 50px 10px 50px;
  background-image:url(images/barre_menu.png);
  color:green;
  box-shadow: 8px 8px 12px #aaa;
  text-decoration:underline;
  border-radius: 10px;
}

#faq{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:30px auto 0;
  padding:20px;
  width:800px;
  z-index:2;  
}
#nous_contacter{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:30px auto;
  padding:20px;
  width:800px;
  z-index:2;  
}
label.nous_contacter{
  cursor:pointer;
  display:block;
  font-size:13px;
  font-weight:bold;
  line-height:28px;
  margin-bottom:5px;
}
#news{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  margin:15px auto 0;
  padding:20px;
  width:800px;
  z-index:2;  
    -moz-box-shadow: 5px 5px 3px 0px #656565;
  -webkit-box-shadow: 5px 5px 3px 0px #656565;
  -o-box-shadow: 5px 5px 3px 0px #656565;
  box-shadow: 5px 5px 3px 0px #656565;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=3);
}
#contenu_news{
  margin:30px auto 0;
  min-height:350px;
}
#erreur404{
  margin:150px auto 0;
  min-height:350px;
}
.nuage_fond_ereur404{
  position:absolute;
  background-image:url(images/nuage3.png);
  background-repeat:no-repeat;
  height:110px;
  width:600px;
  margin-top:12%;
  margin-left:26%;
  z-index:-1;
  opacity:1;
  text-transform:uppercase;
  font-weight:bold;
  font-size:18px;
}
  
  /*****************************************************/
  /***************************************** ANCIENNE VERSION ************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{ margin:0; padding:0;}
table{ border-collapse:collapse; border-spacing:0;}
fieldset,img{ border:0;}
address,caption,cite,code,dfn,th,var{ font-style:normal; font-weight:normal;}
ol,ul{ list-style:none;}
caption,th{ text-align:left;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal;}
q:before,q:after{ content:'';}
abbr,acronym{ border:0;}

html {
  /*overflow:-moz-scrollbars-vertical;  // A metre que si on conserve le menu caché "option"  */
  
}
body{  
  
  color:#333;
  font-family:Arial,sans-serif;
  font-size:12px;
  line-height:16px;
}
  
  a{
  color:#333;
  text-decoration:underline;
}
#start{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:25px auto 0;
  padding:20px;
  width:470px;
  z-index:3;
}
#mon_compte_menu {
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:25px 20px 0 0;
  padding:20px;
  width:170px;
  float:left;
  z-index:3;
}
/** Permet de créer un espace entre le footer et le contenu **/
#spacer{clear: both; height: 80px;}

label{
  cursor:pointer;
  display:block;
  float:left;
  font-size:13px;
  font-weight:bold;
  margin-bottom:5px;
  width:160px;
}

#mon_compte_menu p:hover label{
  color:#0459b7;
  cursor: pointer;
}
#mon_compte_menu p:hover label:before{
  content:"   » ";
}

.mon_compte{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:25px auto 0;
  padding:20px;
  width:650px;
  float:left;
  z-index:3;
}
h1{
  border-bottom:1px solid #ccc;
  font-size:11px;
  font-weight:bold;
  letter-spacing:2px;
  margin-bottom:20px;
  text-transform:uppercase;
}
form p{
  margin-bottom:20px;
}
form p:last-child{ /* Sélecteur avancé pour sélectionner le dernier paragraphe du  */
  margin-bottom:0;
}
label.accueil{
  cursor:pointer;
  display:block;
  float:left;
  font-size:13px;
  font-weight:bold;
  line-height:28px;
  margin-bottom:5px;
  width:160px;
}

form p:hover label{
  color:#0459b7;
}
form p:hover label:after{
  content:" »";
}


input, textarea{
  background: rgba(255, 255, 255, 0.9);
  background:-moz-linear-gradient(90deg, #fff, #eee); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff), color-stop(0.2, #fff)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -moz-box-shadow:0 0 3px #aaa;
  -webkit-box-shadow:0 0 3px #aaa;
  padding:5px;
}
input[type=text]:focus,
input[type=password]:focus{
  -moz-box-shadow:0 0 3px #0459b7;
  -webkit-box-shadow:0 0 3px #0459b7;
  outline:none; /* Pour enlever le contour jaune lorsque l'on sélectionne un input dans Chrome */
}
select{
  cursor:pointer;
  padding:3px;
  -moz-box-shadow:0 0 3px #aaa;
  -webkit-box-shadow:0 0 3px #aaa;
}
select:active,
select:focus{
  border:1px solid #093c75;
  -moz-box-shadow:0 0 3px #0459b7;
  -webkit-box-shadow:0 0 3px #0459b7;
  outline:none;
}
input[type=submit],
a.submit{
  background:#ddd;
  background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
  border:1px solid #093c75;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -moz-box-shadow:0 1px 0 #fff;
  -webkit-box-shadow:0 1px 0 #fff;
  color:#fff;
  cursor:pointer;
  font-family:Arial,sans-serif;
  font-size:12px;
  font-weight:bold;
  margin-left:140px;
  padding:5px 15px;
  text-decoration:none;
  text-shadow:0 1px 1px #333;
  text-transform:uppercase;
}
input[type=submit]:hover,
a.submit:hover{
  background:#eee;
  background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
  background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
  border-color:#093c75;
  text-decoration:none;
}
input[type=submit]:active,
input[type=submit]:focus,
a.submit:active,
a.submit:focus{
  background:#ccc;
  background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
  background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
  border-color:#093c75;
  outline:none;
}
#options{
  margin-bottom:20px;
}
#options p{
  display:none;
}
#options .show{
  display:block;
}
#options:target .show{
  display:none;
}
#options .hide{
  display:none;
}
#options:target .hide{
  display:block;
}
#options:target p{
  display:block;
}
#finish{
  background:rgba(65, 166, 42, 0.2);
  border:2px solid #41a62a;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  display:none;
  padding:5px 10px;
}
#finish:target{
  display:block;
}
  #encadrement_compteur{
  background:#f7f7f7;
  background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
  border:1px solid #aaa;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow:0 0 15px #aaa;
  -webkit-box-shadow:0 0 15px #aaa;
  margin:25px auto 0;
  padding:20px;
  width:780px;
  height:400px;
}
  
  /* design par défaut (sert aussi de base aux skins)
----------------------------------------------------------------------------- */

/* le titre de la boîte de message */
.msgBox #msgTitle {
  margin:0;
  padding: .2em .6em; 
  font-size: 1.1em;
  font-weight: bold;
  background: #e8e0ca;
  color: #584b2c;
  border-bottom: 1px solid #c2b487;
  
  -moz-border-radius: .8em 0 0 0;
  -webkit-border-radius: .8em 0 0 0;
  border-radius: .8em 0 0 0;
}

/* la boîte */
.msgBox { 
  border-width: 1px;
  border-style: solid;
  max-width: 400px;
  padding: 0;
  background: #fff;
  border-color: #c2b487;
  
  -moz-border-radius: 1em 0 1em 0;
  -webkit-border-radius: 1em 2em 1em 2em;
  border-radius: 1em 0 1em 0;
}

/* le div de contenu du message */
.msgBox #msgContent {
  padding: .4em .6em; 
  text-align: justify;
  color: #514721;
}
/* le bouton de fermeture et son conteneur */
.msgBox #closeBtn { 
  text-align: right;
  margin: 0;
  padding: 0;
  padding-bottom: 1px;
}
.msgBox #closeBtn a {
  padding: 4px .5em;
  border: 1px solid #c2b487;
  border-width: 1px 0 0 1px;
  margin: 0 0 .0 .6em; 
  font-weight:bold;
  text-decoration: none;
  color: #514721;

  -moz-border-radius: 0 0 .8em 0;
  -webkit-border-radius: 0 0 .8em 0;
}
.msgBox #closeBtn a:hover {
  background: #e8e0ca;
}
#button_compteur{
  background:#ddd;
  background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
  background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
  border:1px solid #093c75;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -moz-box-shadow:0 1px 0 #fff;
  -webkit-box-shadow:0 1px 0 #fff;
  color:#fff;
  cursor:pointer;
  font-family:Arial,sans-serif;
  font-size:12px;
  font-weight:bold;
  padding:5px 15px;
  text-decoration:none;
  text-shadow:0 1px 1px #333;
  text-transform:uppercase;
}
#button_compteur:hover{
  background:#eee;
  background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
  background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
  border-color:#093c75;
  text-decoration:none;
}
.button_compteur:active,
#button_compteur:focus,
{
  background:#ccc;
  background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
  background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
  border-color:#093c75;
  outline:none;
}

.LV_validation_message{
    font-weight:bold;
    margin:0 0 0 5px;
}

.LV_valid {
    color:#00CC00;
}
  
.LV_invalid {
    color:#CC0000;
}
    
.LV_valid_field,
input.LV_valid_field:hover, 
input.LV_valid_field:active,
textarea.LV_valid_field:hover, 
textarea.LV_valid_field:active {
    border: 2px solid #00CC00;
}
    
.LV_invalid_field, 
input.LV_invalid_field:hover, 
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover, 
textarea.LV_invalid_field:active {
    border: 2px solid #CC0000;
}
/* styles invariables
----------------------------------------------------------------------------- */

/* le div qui fait écran sur le reste de la page */
#modalObj {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  z-index: 1000;
  background: #fff; /* modifiable par option javascript */
}

/* la boîte de message */
#msgBox {
  position: absolute;
  z-index: 1001;
}
/* skins
----------------------------------------------------------------------------- */
.error          { background: #ffe1e2; }
#msgBox.error #msgTitle      { background: #ffaeb0; color: #fff; }
#msgBox.error #msgContent    { color: #8a1f11; }
#msgBox.error #closeBtn a    { color: #f09486; }
#msgBox.error #closeBtn a:hover    { color: #fff; background: #ffaeb0;}

.success        { background: #E6EFC2;  }
#msgBox.success #msgTitle    { background: #C6D880; color: #fff;  }
#msgBox.success #msgContent    { color: #264409; }
#msgBox.success #closeBtn a    { color: #b1ca51; }
#msgBox.success #closeBtn a:hover  { color: #fff; background: #C6D880; }