/* Design and general layout */

body
{
   background-color: #66CDAA;  /*#D75E22 #A85444 #54814C #116250*/
   margin-top: 0px;
   margin-bottom: 20px;
   padding-bottom: 20px;
}

#page {
    background-color: white;
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

#page img.bandeau {
    width: 100%;
}



/* Title */

#titre {
    margin-top: -80px;
    margin-left: 85px;
    margin-bottom: 20px;
}

#titre p {
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: left;
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
    font-weight: bold;
    color: #000088;
}
#titre p.ttitre {
    font-size: 250%;
}
#titre p.stitre {
    font-size: 200%;
}

#titre a {
    text-decoration: none;
    color: #000088;
}
#titre a:hover, a:active, a:focus {
    text-decoration: underline;
}

span.exp {
    vertical-align: super;
    font-size: 50%;
}




/* Menu */

#menu {
    margin-top: 10px;
    margin-left: 21px;
    margin-right: 23px;
    margin-bottom: 20px;
    height: 50px;
}

#menu h2 {
    width: 95px;
    float: left;
    height: 66px;
    padding-top: 16px;
    margin-top: 0px;
    margin-bottom: 0px;
    background-color: #234567; /*#888EFF ou #234567 #54814C*/
    border-left: solid 2px white;
    border-top: solid 2px white;
    color: white;
    font-size: 13pt;
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

#menu h2.br {
    height: 50px;
    padding-top: 3px;
}

#menu h2.wide {
    width: 600px;
}

#menu a {
    text-decoration: none;
    color: white;
}
#menu a:hover, a:active, a:focus {
    color: #000088;
}


/* Page content */

#corps {
    margin-left: 0px;
    margin-top: 0px;
    margin-bottom: 10px;
    margin-right: 0px;
    padding-top: 30px;
    padding-left: 50px;
    padding-right: 20px;
    padding-bottom: 20px;
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
    font-size: 100%;
    min-height: 1100px;
}

#corps img.photo_droite  {
    float: right;
    width: 10%;
    margin: 5px;
    padding: 0px;
    padding-left: 10px;
    padding-right: 5px;
    margin-top: -5em;
}

#corps img.toutpetit  {
/*    float: right;*/
    width: 2%;
    margin: 0px;
    padding: 0px;
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: -0.2em;
}

p {
  text-align: justify;
  text-indent: 0em;
  /*margin-bottom: -0.6em;*/
}

h2, h3, h4 {
   font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

h2 {
  color: #0000AA;
  margin-top: 1.6em;
  margin-bottom: 1.4em;
  text-align: center;
}

h3 {
  color: #0000CC;
  margin-top: 1.2em;
  margin-bottom: 0.4em;
  margin-left: 2em;
 }

h4 {
  color: #0000EE;
  margin-top: 0.3em;
  margin-bottom: 0.2em;
  margin-left: 0em;
}

span.alert {
  color: #D75E22;
}

span.promo {
    padding-left: 20px;
    font-style: italic;
    color: red;
}

dt, dd {
  float: left
}

.retrait {
   text-indent: 1.5em;
}

.email {
    font-family: "Courier New", Courier, "Liberation Mono", monospace;
}

#corps a
       {
       text-decoration: none;
       color: #000088;
}

#corps a:hover, a:active, a:focus
       {
        border-bottom-width: 1px;
        border-bottom-color: #000088;
        text-decoration: none;
        background-color: white;
}

#corps a.img
       {
       border-bottom-width:0px
}

#corps li
       {
text-align: justify;
margin-left: 0px;
padding-left: 0px;
}

#corps ul
     {
margin: 0em;
padding: 0px;
padding-left: 1em;
margin-left: 3px;
}


/* Forms */

fieldset, legend, label, input {
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
} 

fieldset {
    margin-right: 30px;
    border: 1px dashed #d75e22;
    margin-bottom: 30px;
}

fieldset legend {
    color: #d75e22;
}

input[type=text], textarea {
    border: 1px solid grey;
}

input[type=checkbox] {
    margin-top: 10px;
}

textarea {
    margin-left: 183px;
}

label {
    display: inline-block;
    width: 180px;
    margin-top: 4px;
}

label.radio {
    display: inline;
}

input[type=radio] {
    margin-left: 15px;
}

fieldset.orga label {
    width: 230px;
}

fieldset.join label {
    width: 380px;
}

/*input[type=submit] {
    border: 0px;
    background-color: #888eff;
    color: white;
    padding: 7px;
    font-weight: bold;
}

input[type=submit]:hover {
    color: #000088;
}*/

p.btnext {
    margin-right: 30px;
    text-align: right;
}


/* Language links */
p.langfr, p.langen {
    text-align: right;
}

p.langfr a, p.langen a {
    font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
    font-size: 12px;
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 35px;
}

p.langfr a {
    background-image: url('frFlag.png');
}

p.langen a {
    background-image: url('enFlag.png');
}

/* Pour les paragraphes depliants */

/*@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);*/

input {
    display: none;
    visibility: hidden;
}
label {
    display: block;
    padding: 0.5em;
    text-align: center;
    border-bottom: 1px solid #CCC;
    color: #666;
}
label:hover {
    color: #000;
}
label::before {
    font-family: Consolas, monaco, monospace;
    font-weight: bold;
    font-size: 15px;
    content: "±" ;
    vertical-align: text-top;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 3px;
    background: radial-gradient(ellipse at center, #CCC 50%, transparent 50%);
}

#expand {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand1 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand2 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand3 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand4 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand5 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand6 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand7 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand8 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand9 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand10 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand11 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand12 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand13 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand14 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand15 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand16 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand17 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand18 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand19 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand20 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand21 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand22 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand23 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand24 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand25 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand26 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand27 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand28 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand29 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand30 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand31 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand32 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand33 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand34 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand35 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand36 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand37 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand38 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand39 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand40 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand41 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand42 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
#expand43 {
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #000;
}
section {
    padding: 0 20px;
}
#toggle:checked ~ #expand {
    height: 150px;
}
#toggle:checked ~ label::before {
    content: "±" ;
}
#toggle1:checked ~ #expand1 {
    height: 70px;
}
#toggle1:checked ~ label::before {
    content: "±" ;
}
#toggle2:checked ~ #expand2 {
    height: 250px;
}
#toggle2:checked ~ label::before {
    content: "±" ;
}
#toggle3:checked ~ #expand3 {
    height: 90px;
}
#toggle3:checked ~ label::before {
    content: "±" ;
}
#toggle4:checked ~ #expand4 {
    height: 550px;
}
#toggle4:checked ~ label::before {
    content: "±" ;
}
#toggle5:checked ~ #expand5 {
    height: 220px;
}
#toggle5:checked ~ label::before {
    content: "±" ;
}
#toggle6:checked ~ #expand6 {
    height: 210px;
}
#toggle6:checked ~ label::before {
    content: "±" ;
}
#toggle7:checked ~ #expand7 {
    height: 220px;
}
#toggle7:checked ~ label::before {
    content: "±" ;
}
#toggle8:checked ~ #expand8 {
    height: 350px;
}
#toggle8:checked ~ label::before {
    content: "±" ;
}
#toggle9:checked ~ #expand9 {
    height: 450px;
}
#toggle9:checked ~ label::before {
    content: "±" ;
}
#toggle10:checked ~ #expand10 {
    height: 380px;
}
#toggle10:checked ~ label::before {
    content: "±" ;
}
#toggle11:checked ~ #expand11 {
    height: 370px;
}
#toggle11:checked ~ label::before {
    content: "±" ;
}
#toggle12:checked ~ #expand12 {
    height: 280px;
}
#toggle12:checked ~ label::before {
    content: "±" ;
}
#toggle13:checked ~ #expand13 {
    height: 250px;
}
#toggle13:checked ~ label::before {
    content: "±" ;
}
#toggle14:checked ~ #expand14 {
    height: 410px;
}
#toggle14:checked ~ label::before {
    content: "±" ;
}
#toggle15:checked ~ #expand15 {
    height: 300px;
}
#toggle15:checked ~ label::before {
    content: "±" ;
}
#toggle16:checked ~ #expand16 {
    height: 130px;
}
#toggle16:checked ~ label::before {
    content: "±" ;
}
#toggle17:checked ~ #expand17 {
    height: 330px;
}
#toggle17:checked ~ label::before {
    content: "±" ;
}
#toggle18:checked ~ #expand18 {
    height: 170px;
}
#toggle18:checked ~ label::before {
    content: "±" ;
}
#toggle19:checked ~ #expand19 {
    height: 590px;
}
#toggle19:checked ~ label::before {
    content: "±" ;
}
#toggle20:checked ~ #expand20 {
    height: 350px;
}
#toggle20:checked ~ label::before {
    content: "±" ;
}
#toggle21:checked ~ #expand21 {
    height: 280px;
}
#toggle21:checked ~ label::before {
    content: "±" ;
}
#toggle22:checked ~ #expand22 {
    height: 210px;
}
#toggle22:checked ~ label::before {
    content: "±" ;
}
#toggle23:checked ~ #expand23 {
    height: 270px;
}
#toggle23:checked ~ label::before {
    content: "±" ;
}
#toggle24:checked ~ #expand24 {
    height: 380px;
}
#toggle24:checked ~ label::before {
    content: "±" ;
}
#toggle25:checked ~ #expand25 {
    height: 310px;
}
#toggle25:checked ~ label::before {
    content: "±" ;
}
#toggle26:checked ~ #expand26 {
    height: 180px;
}
#toggle26:checked ~ label::before {
    content: "±" ;
}
#toggle27:checked ~ #expand27 {
    height: 330px;
}
#toggle27:checked ~ label::before {
    content: "±" ;
}
#toggle28:checked ~ #expand28 {
    height: 240px;
}
#toggle28:checked ~ label::before {
    content: "±" ;
}
#toggle29:checked ~ #expand29 {
    height: 330px;
}
#toggle29:checked ~ label::before {
    content: "±" ;
}
#toggle30:checked ~ #expand30 {
    height: 440px;
}
#toggle30:checked ~ label::before {
    content: "±" ;
}
#toggle31:checked ~ #expand31 {
    height: 380px;
}
#toggle31:checked ~ label::before {
    content: "±" ;
}
#toggle32:checked ~ #expand32 {
    height: 250px;
}
#toggle32:checked ~ label::before {
    content: "±" ;
}
#toggle33:checked ~ #expand33 {
    height: 360px;
}
#toggle33:checked ~ label::before {
    content: "±" ;
}
#toggle34:checked ~ #expand34 {
    height: 550px;
}
#toggle34:checked ~ label::before {
    content: "±" ;
}
#toggle35:checked ~ #expand35 {
    height: 310px;
}
#toggle35:checked ~ label::before {
    content: "±" ;
}
#toggle36:checked ~ #expand36 {
    height: 430px;
}
#toggle36:checked ~ label::before {
    content: "±" ;
}
#toggle37:checked ~ #expand37 {
    height: 700px;
}
#toggle37:checked ~ label::before {
    content: "±" ;
}
#toggle38:checked ~ #expand38 {
    height: 490px;
}
#toggle38:checked ~ label::before {
    content: "±" ;
}
#toggle39:checked ~ #expand39 {
    height: 400px;
}
#toggle39:checked ~ label::before {
    content: "±" ;
}
#toggle40:checked ~ #expand40 {
    height: 300px;
}
#toggle40:checked ~ label::before {
    content: "±" ;
}
#toggle41:checked ~ #expand41 {
    height: 550px;
}
#toggle41:checked ~ label::before {
    content: "±" ;
}
#toggle42:checked ~ #expand42 {
    height: 550px;
}
#toggle42:checked ~ label::before {
    content: "±" ;
}
#toggle43:checked ~ #expand43 {
    height: 550px;
}
#toggle43:checked ~ label::before {
    content: "±" ;
}
