* {
    margin: 0;
    padding: 0
    }
html {
    height: 100%
    }
body {
    background: #FFF url(i/img/bg_body.png) repeat-x;
    font-family: arial, sans-serif;
    text-align: center;
    font-size: 1em;
    height: 100%;
    color: inherit
    }
#content {
    width: 800px;
    text-align: left;
    min-height: 100%;
    height: auto !important;
    /* min-height IE */
    height: 100%;
    /* min-height IE */
    margin: 0 auto -70px;
    /* the bottom margin is the negative value of the footer's height */
    }
/***********************************************
 *************** SUPERHEADER *******************
 ***********************************************/
#subheader {
    height: 100px
    }
#subheader #green-act {
    margin: 1px 0 0 -110px;
    width: 217px;
    height: 104px;
    float: left;
    position: relative
    }
#subheader a img {
    border: none
    }
#subheader .left {
    margin-left: -64px;
    position: relative
    }
#subheader h1 {
    font-family: Arial;
    font-size: 2.7em;
    font-style: italic;
    font-weight: normal;
    margin: 20px 0 0 9px
    }
#subheader h1 a {
    text-decoration: none;
    color: #00a5cd
    }
#subheader h2 a {
    text-decoration: none;
    color: #969696
    }
#subheader h2 {
    color: #969696;
    font-size: 1em;
    margin: -8px 0 0 9px
    }
#subheader .blogh1 {
    font-size: 1.4em;
    text-align: right;
    font-style: normal;
    margin: 0 10px 0 0;
    font-family: Tahoma, arial, sans-serif
    }
#subheader .blogh2 {
    font-size: 0.8em;
    text-align: right;
    font-weight: normal;
    margin: -3px 10px 0 0
    }
/*************************************************
 ******************** HEADER *********************
 *************************************************/
#header {
    height: 96px;
    background: url(i/img/spirales.png) no-repeat top left
    }
* html #header {
    margin-top: -4px
    }
#header p {
    color: #FFF;
    font-size: 0.8em;
    min-height: 72px;
    background: url(i/img/bulle.png) no-repeat 0 22px;
    margin: 0 50px 0 50px;
    padding: 25px 0 0 60px
    }
* html #header p {
    height: 72px
    }
/************************************************
 **************** MENU HORIZONTAL ***************
 ************************************************/
#menu-horizontal {
    height: 45px;
    background: url(i/img/menu.png) no-repeat
    }
* html #menu-horizontal {
    margin-top: -5px;
    text-align: center
    }
#menu-horizontal ul {
    list-style-type: none;
    text-align: center;
    padding-top: 7px
    }
#menu-horizontal li {
    display: inline;
    font-size: 0.9em;
    margin-left: 0;
    /** Bug Firefox **/
    border-right: 1px solid #63c1d8;
    border-left: 1px solid #388ba1;
    padding: 5px 10px 5px 10px
    }
* + html #menu-horizontal li, * html #menu-horizontal li {
    margin-left: 0
    }
#menu-horizontal a {
    text-decoration: none;
    color: #FFF;
    font-weight: bold
    }
#menu-horizontal a:hover {
    text-decoration: underline;
    color: #e0e0e0
    }
#menu-horizontal .outside-left {
    border-left: none
    }
#menu-horizontal .outside-right {
    border-right: none
    }
/********************************************* 
 ******************* PAGE ********************
 *********************************************/
#main {
    height: auto;
    border-left: 4px solid #d8d8d8;
    border-right: 4px solid #d8d8d8;
    font-size: 1em;
    background: #f1f1f1 url(i/img/bg_main.png) no-repeat bottom right;
    padding-top: 25px;
    padding-left: 30px
    }
* + html #main, * html #main {
    height: 1%
    }
#main h1 {
    color: #00a5cd;
    font-size: 1.7em;
    font-family: arial;
    font-style: italic;
    background: url(i/img/puce_h1.png) no-repeat top left;
    padding: 5px 0 0 25px;
    min-height: 40px
    }
* html #main h1 {
    height: 45px
    }
#main h1 a {
    color: #00a5cd;
    text-decoration: none
    }
#main h2 {
    font-size: 1.1em;
    color: #00a5cd
    }
#main h3 {
    margin: 0 40px 4px 40px;
    font-size: 1.05em;
    color: #00a5cd
    }
#main h3 a {
    color: #00a5cd
    }
#main p {
    color: #999;
    font-size: 0.8em
    }
#main a {
    color: #7cba2c;
    font-size: 1em
    }
#main a:hover {
    text-decoration: none
    }
#main ul {
    list-style-type: none;
    list-style-image: url(i/img/puce_fleche.png);
    list-style-position: inside
    }
#main ol {
    list-style-position: inside
    }
#main .col-left {
    float: left;
    width: 465px
    }
#main .col-right {
    float: right;
    width: 290px
    }
#main option {
    padding-right: 10px
    }
/********************************************* 
 	 ***************** HOMEPAGE ******************
 	 *********************************************/
#erreur-found {
    margin: -15px 70px 15px;
    height: 1%
    }
#erreur-found h2 {
    background: url(/i/img/warning.png) no-repeat 40px top;
    color: #c00;
    padding: 7px 0 0 80px;
    text-align: left
    }
* html #main div.erreur-form h2 {
    height: 28px
    }
#erreur-found p {
    width: 500px;
    margin: 10px auto 5px
    }
/** Annuaire des catégories **/
#main #categories ul {
    margin-top: 15px
    }
#main #categories ul.col2 {
    margin-left: 15px
    }
#main #categories li {
    margin-bottom: 10px
    }
#main #categories li a {
    font-size: 0.9em;
    margin-left: 2px;
    font-weight: bold
    }
* + html #main #categories li a, * html #main #categories li a {
    padding-left: 8px
    }
/** Les plus + actifs **/
#main #most-active {
    margin-top: 15px
    }
#main #most-active p {
    margin: 10px 0 0 15px;
    width: 430px;
    text-align: justify
    }
#main #most-active .barre {
    float: left;
    margin-top: 10px;
    position: relative
    }
#main #most-active ol {
    color: #00A5CD;
    font-style: italic;
    font-size: 0.8em;
    margin-top: 10px;
    width: 215px;
    margin-left: -3px;
    font-weight: bold;
    list-style-position: inside
    }
#main #most-active ol.col1 {
    border-left: 3px solid #ffc002;
    padding-left: 9px
    }
#main #most-active ol.col2 {
    border-left: 3px solid #85be39;
    padding-left: 9px
    }
#main #most-active li {
    margin-bottom: 10px
    }
/** Outils de secours **/
#main #utilities {
    margin-top: 30px;
    color: #7cba2c
    }
#main #utilities p {
    margin: 10px 0 10px 15px
    }
#main #utilities ul {
    color: #999;
    list-style-image: none;
    list-style-type: square;
    font-size: 0.9em;
    margin: 0 0 10px 25px
    }
#main #utilities hr {
    display: none
    }
/** Créer son forum **/
#main .forum ol {
    list-style-type: none;
    color: #999;
    font-size: 0.9em;
    margin-left: 40px
    }
* + html #main .forum ol, * html #main .forum ol {
    margin-left: 20px
    }
#main .forum li {
    margin-bottom: 6px
    }
#main #buble-top {
    background: url(i/img/bulle_top.png) no-repeat;
    width: 272px;
    text-align: center;
    padding-top: 20px
    }
#main #buble-top #button {
    text-align: center;
    background: url(i/img/button_top.png) no-repeat top;
    width: 236px;
    margin-left: auto;
    margin-right: auto
    }
#main #buble-top #button h1 {
    padding: 12px 5px 0 5px;
    background-image: none;
    font-size: 0.8em;
    min-height: 30px
    }
* html #main #button h1 {
    height: 20px
    }
#main #buble-top #button a {
    color: #fff;
    text-decoration: none;
    font-size: 1.4em;
    font-style: italic;
    font-weight: normal
    }
#main #buble-top #button .button-bottom {
    background: url(i/img/button_bottom.png) no-repeat left bottom;
    width: 236px;
    height: 9px
    }
#main #buble-top #blog-button {
    text-align: center;
    background: url(i/img/button_top_blog.png) no-repeat top;
    width: 236px;
    margin-left: auto;
    margin-right: auto
    }
#main #buble-top #blog-button h1 {
    padding: 12px 5px 0 5px;
    background-image: none;
    font-size: 0.8em;
    min-height: 30px
    }
* html #main #blog-button h1 {
    height: 20px
    }
#main #buble-top #blog-button a {
    color: #fff;
    text-decoration: none;
    font-size: 1.4em;
    font-style: italic;
    font-weight: normal
    }
#main #buble-top #blog-button .button-bottom {
    background: url(i/img/button_bottom_blog.png) no-repeat left bottom;
    width: 236px;
    height: 9px
    }
#main #buble-bottom {
    background: url(i/img/bulle_bottom.png) no-repeat;
    height: 25px
    }
#main .act-vert-buble {
    background: url(/i/img/act_vert_bulle.png) no-repeat;
    height: 139px;
    width: 157px;
    margin: -33px 0 0 140px
    }
/** Formulaire de recherche **/
#main #search {
    margin: -25px 0 0 25px;
    width: 235px
    }
#main #search h2 {
    margin-bottom: 5px
    }
#main #search form {
    padding: 20px 0 0 20px
    }
#main #search input {
    margin-bottom: 5px
    }
#main #search label {
    vertical-align: top
    }
* + html #main #search label, * html #main #search label {
    vertical-align: middle
    }
/********************************************* 
 	 ***************** ANNUAIRE ******************
 	 *********************************************/
/** Top des forums **/
#main #top h2 {
    margin: -25px 0 10px 45px;
    padding: 25px 0 5px 0;
    background: url(/i/img/exclamation.png) no-repeat top right
    }
#main #top h2 a {
    padding-left: 10px;
    font-weight: normal
    }
#main #top a.active {
    margin-left: 80px
    }
#main #top .fleche-annuaire {
    position: relative;
    float: left
    }
#main #top ol {
    background-color: #FFF;
    width: 445px;
    border-left: 6px solid #84be39;
    margin-top: 15px;
    float: left;
    margin-left: -15px;
    min-height: 602px
    }
* html #main #top ol {
    height: 602px
    }
#main #top li {
    border-bottom: 1px solid #f1f1f1;
    padding: 8px 15px 10px 15px;
    color: #10abd0;
    font-style: italic;
    font-weight: bold;
    font-size: 0.9em
    }
* html #main #top li a {
    padding-left: 20px
    }
* + html #main #top li a {
    padding-left: 20px
    }
#main #top li p {
    font-weight: normal;
    font-style: normal;
    margin-top: 3px;
    text-align: justify;
    width: 410px;
    clear: both
    }
#main #top ul {
    margin-left: 25px;
    list-style-image: none;
    position: relative
    }
#main #top ul li {
    background: url(/i/img/puce_bleu.png) no-repeat 0 12px
    }
* + html #main #top ul li {
    background-position: 17px 14px;
    padding-left: 0
    }
* html #main #top ul li {
    padding-left: 0
    }
#main #top ul li a {
    color: #00a5cd
    }
#main #top li ul {
    font-weight: normal;
    list-style-image: none;
    list-style-position: outside
    }
#main #top li ul li {
    background: url(/i/img/puce_active.png) no-repeat left 12px;
    margin: 0 0 -10px -5px;
    font-weight: normal;
    padding-left: 20px
    }
* + html #main #top li ul li {
    margin-left: 40px
    }
* html #main #top li ul li {
    margin-left: 20px
    }
#main #top li ul li a {
    color: #7cba2c;
    text-decoration: none;
    padding-left: 0
    }
#main #top li ul li a:hover {
    text-decoration: underline
    }
/** Annuaire colonne droite **/
#main #annuaire-droite {
    margin: 0 25px 0 25px
    }
#main #annuaire-droite p {
    text-align: justify
    }
#main #annuaire-droite ul {
    color: #7cba2c;
    margin: 20px 0 25px 0;
    list-style-type: square;
    list-style-image: none;
    font-weight: bold
    }
#main #annuaire-droite form {
    margin: 5px 0 5px 0
    }
#main #annuaire-droite .buble-top {
    padding-top: 15px
    }
#main #annuaire-droite .buble-top p {
    margin-left: 20px
    }
#main #annuaire-droite .buble-top ul {
    color: #00a5cd;
    font-size: 0.9em;
    margin: 10px 0 10px 20px
    }
#main #annuaire-droite #searchform2 {
    padding-left: 20px
    }
#main #annuaire-droite #searchform2 input {
    margin-bottom: 5px
    }
#main #annuaire-droite #searchform2 label {
    vertical-align: top
    }
* + html #main #annuaire-droite #searchform2 label, * html #main #annuaire-droite #searchform2 label {
    vertical-align: middle
    }
/********************************************* 
 	 ****************** THEMES *******************
 	 *********************************************/
#main div.buble-form {
    margin: 0 0 0 25px;
    width: 700px
    }
#main div.top-right, #main div.top-left, #main div.bottom-right, #main div.bottom-left {
    position: relative;
    width: 29px;
    height: 29px
    }
#main div.top-right {
    background: url(/i/img/top_right.png) no-repeat;
    float: right
    }
#main div.top-left {
    background: url(/i/img/top_left.png) no-repeat
    }
#main div.bottom-right {
    background: url(/i/img/bot_right.png) no-repeat;
    float: right
    }
#main div.bottom-left {
    background: url(/i/img/bot_left.png) no-repeat
    }
#main div.contenu {
    background: #FFF url(/i/img/spirale.png) no-repeat top left;
    border: 4px solid #E0E0E0;
    margin: -29px 0;
    padding: 5px 0 0 20px
    }
#main div.contenu p {
    width: 600px;
    padding: 0 0 10px 25px
    }
#main div.contenu form {
    margin: 0 0 20px 10px;
    text-align: center
    }
#main div.buble-form dl.left-dl {
    margin-left: 30px;
    text-align: left;
    width: 275px
    }
#main div.buble-form .left-dl dt {
    float: left;
    width: 20px;
    margin-top: 55px
    }
#main div.buble-form .left-dl p {
    font-style: italic;
    text-align: center;
    width: 250px
    }
/********************************************* 
 	 **************** FORMULAIRE ******************
 	 *********************************************/
#main div.buble-form dl.normal {
    text-align: left;
    margin-left: 30px;
    clear: both
    }
* html #main div.buble-form input {
    font-size: 0.8em
    }
#main h2.form-step {
    font-size: 1em;
    margin-left: 60px;
    margin-bottom: 10px;
    padding-left: 20px;
    background: url(/i/img/puce_fleche.png) no-repeat scroll left 8px
    }
#main div.buble-form input.button1 {
    background: #e7f3f7 url(/i/img/bg_button.png) repeat-x;
    padding: 2px 20px;
    border: 1px solid #00A5CD;
    color: #222;
    overflow: visible;
    /* One more IE BUG */
    }
#main div.buble-form input.button1:hover {
    border: 1px solid #7CBA2C;
    color: #7CBA2C
    }
#main div.buble-form input.button_disabled {
    border: 1px solid #D8D8D8;
    background: #F1F1F1 url(/i/img/wait.gif) no-repeat scroll right 50%;
    padding: 2px 20px;
    color: transparent;
    overflow: visible;
    /* One more IE BUG */
    }
#main div.erreur-form {
    background-color: #FFF;
    border: 2px dotted #E0E0E0;
    margin: 0 70px 15px
    }
#main div.erreur-form p {
    background: url(/i/img/warning.png) no-repeat top left;
    color: #000;
    min-height: 28px;
    padding: 7px 0 0 40px
    }
* html #main div.erreur-form p {
    height: 28px
    }
#main div.buble-form .normal dt {
    float: left;
    padding-bottom: 10px;
    width: 250px;
    font-size: 0.9em;
    text-align: justify
    }
#main div.buble-form .normal dd {
    margin-left: 260px;
    padding-bottom: 10px
    }
#main div.buble-form .normal p {
    font-style: italic;
    width: 365px;
    padding: 0;
    text-align: justify
    }
#main div.buble-form .normal input {
    border-color: #7CBA2C;
    border-style: solid;
    border-width: 1px 1px 1px 4px;
    padding-left: 4px;
    width: 200px
    }
#main div.buble-form .normal select {
    border-color: #7CBA2C;
    border-style: solid;
    border-width: 1px 1px 1px 4px
    }
#main div.buble-form .normal option {
    padding-right: 10px
    }
#main div.buble-form .normal textarea {
    border-color: #7CBA2C;
    border-style: solid;
    border-width: 1px 1px 1px 4px
    }
/********************************************* 
 	 ************** CONGRATULATION ***************
 	 *********************************************/
#main div.congratulation {
    background: #FFF url(/i/img/spirale.png) no-repeat top left;
    border: 4px solid #E0E0E0;
    margin: -29px 0;
    padding: 25px 0 0 20px
    }
#main div.congratulation h2 {
    margin: 25px 0 20px 0;
    color: #7bb92b;
    background: url(i/img/win.png) no-repeat 85px 0;
    min-height: 60px;
    padding: 10px 0 0 165px;
    font-size: 1.1em;
    font-weight: normal
    }
* html #main div.congratulation h2 {
    height: 60px
    }
#main div.congratulation #print {
    background: url(/i/img/puce_bleu.png) no-repeat 0 5px;
    font-size: 0.7em;
    color: #16a9cd;
    padding-left: 15px
    }
#main div.congratulation p {
    color: #16a9cd
    }
#main div.congratulation #c-explain {
    margin-left: 70px
    }
.field1, .field2, .field3 {
    width: 390px
    }
.field1 {
    margin: 10px 0 15px 60px;
    background: url(/i/img/c_cadre1.png) no-repeat
    }
.field2 {
    margin: 0 0 15px 120px;
    background: url(/i/img/c_cadre2.png) no-repeat
    }
.field3 {
    margin: 0 0 15px 170px;
    background: url(/i/img/c_cadre3.png) no-repeat
    }
.field1 p, .field2 p, .field3 p {
    margin-left: 50px;
    padding-top: 10px;
    min-height: 50px
    }
* html .field1 p, * html .field2 p, * html .field3 p {
    height: 50px
    }
.cadre-bottom {
    background: url(/i/img/c_cadre_bottom.png) no-repeat bottom;
    height: 21px
    }
#pouce {
    background: url(/i/img/pouce.png) no-repeat 420px 10px
    }
/********************************************* 
 	 ***************** LANGUAGE ******************
 	 *********************************************/
#main #img-lang {
    margin: 20px 0 0 20px
    }
#main #img-lang ul {
    margin: 10px 0 0 120px
    }
#main #img-lang img {
    margin-top: 20px
    }
/********************************************* 
 	 ******************* CGU *********************
 	 *********************************************/
#main #cgu {
    text-align: justify;
    width: 700px;
    margin-left: 30px;
    color: #999;
    font-size: 0.9em
    }
#main #cgu h2 {
    margin: 10px 0;
    font-size: 1.3em
    }
#main #cgu hr {
    display: none
    }
/********************************************* 
 	 ***************** RECHERCHE *****************
 	 *********************************************/
#main #form-search {
    background-color: #FFF;
    width: 520px;
    margin: 10px 0 0 100px;
    border: 3px dotted #E0E0E0;
    padding: 10px 20px 20px 20px
    }
#main #form-search p {
    text-align: center
    }
/********************************************* 
 	 ******************* OUTILS ******************
 	 *********************************************/
form.disconnect {
    text-align: right
    }
#main #utilities-form h2 {
    margin: 20px 0 0 25px
    }
#ombre {
    margin: -57px 0 0 -178px;
    float: left;
    position: relative;
    width: 178px;
    height: 106px
    }
#main-bottom {
    background: url(i/img/main_bottom.png) no-repeat;
    width: 800px;
    height: 48px
    }
#main-bottom-nu {
    background: url(i/img/main_bottom_nu.png) no-repeat;
    width: 800px;
    height: 25px
    }
.push {
    height: 69px
    }
/********************************************* 
 ***************** PIED **********************
 *********************************************/
#pied {
    border-top: 2px solid #b4e4f0;
    background-color: #eff9fc;
    font-size: 0.9em;
    color: #747474;
    padding-top: 0;
    height: auto;
    min-height: 69px
    }
* html #pied {
    height: 64px
    }
#pied img {
    float: right;
    margin-top: -25px;
    position: relative
    }
#pied ul {
    list-style-type: none
    }
#pied li {
    display: inline
    }
#pied a {
    text-decoration: none;
    color: #747474
    }
#pied a:hover {
    text-decoration: underline
    }
#pied p {
    text-align: right;
    margin-top: 10px;
    color: #00a5cd
    }
/********************************************* 
 ***************** COMMUN ********************
 *********************************************/
.col1, .col2 {
    float: left;
    width: 210px
    }
.right {
    float: right
    }
.left {
    float: left
    }
.green {
    color: #7cba2c !important
    }
.bold {
    font-weight: bold !important
    }
.gray {
    color: #959595
    }
.blue {
    color: #00a5cd !important
    }
.normal {
    font-weight: normal
    }
.italic {
    font-style: italic
    }
.clear {
    clear: both
    }
.center {
    text-align: center
    }
.marginli {
    margin-left: 5px;
    vertical-align: top
    }
.suite {
    background: url(i/img/puce_fleche.png) no-repeat center left;
    padding-left: 15px;
    font-size: 0.8em !important
    }
.active {
    background: url(i/img/puce_active.png) no-repeat center left;
    font-size: 1.1em !important;
    padding-left: 20px;
    margin-left: 80px
    }
.buble-top {
    background: url(i/img/search_top.png) no-repeat
    }
.buble-bottom {
    background: url(i/img/search_bottom.png) no-repeat left bottom;
    height: 10px
    }
input.btn_search {
    vertical-align: bottom
    }
.before-after {
    margin: 5px 20px;
    font-weight: bold;
    font-size: 1em !important
    }
.astuce {
    text-align: right !important;
    font-size: 0.9em !important
    }
.radio {
    width: 20px !important;
    border: none !important
    }
* + html .bord-select, * html .bord-select {
    border-color: #8FD534;
    border-style: solid;
    border-width: 1px 1px 1px 4px
    }
/********************************************* 
 ***************** MESSAGE *******************
 *********************************************/
div.die_title_red {
    color: #C00;
    font-size: 1.1em;
    padding-top: 30px;
    padding-bottom: 15px;
    text-align: center
    }
* + html .bord-select, * html .bord-select {
    border-left: 4px solid #8fd534;
    border-top: 1px solid #8fd534;
    border-right: 1px solid #8fd534;
    border-bottom: 1px solid #8fd534
    }
* + html .red-dt .bord-select, * html .red-dt .bord-select {
    border-left: 4px solid #C00;
    border-top: 1px solid #C00;
    border-right: 1px solid #C00;
    border-bottom: 1px solid #C00
    }
#main .red-dt {
    color: #C00
    }
input.with-hover:focus, input.with-hover:hover, textarea.with-hover:focus, textarea.with-hover:hover, select.with-hover:focus, select.with-hover:hover {
    background: #effff3
    }
/* Avoid bad rollover effect on IE */
.red-dt input.with-hover:focus, .red-dt input.with-hover:hover, .red-dt textarea.with-hover:focus, .red-dt textarea.with-hover:hover, .red-dt select.with-hover:focus, .red-dt select.with-hover:hover {
    background: #ffefef
    }
.red-dt input.with-hover {
    border-left: 4px solid #C00 !important;
    border-top: 1px solid #C00 !important;
    border-right: 1px solid #C00 !important;
    border-bottom: 1px solid #C00 !important
    }
.red-dt select {
    border-left: 4px solid #C00 !important;
    border-top: 1px solid #C00 !important;
    border-right: 1px solid #C00 !important;
    border-bottom: 1px solid #C00 !important
    }
.red-dt textarea {
    border-left: 4px solid #C00 !important;
    border-top: 1px solid #C00 !important;
    border-right: 1px solid #C00 !important;
    border-bottom: 1px solid #C00 !important
    }