/*
 * Redéfinitons gnales
 */

/* HTML5  */

@font-face {
    font-family: 'HoneyScript SemiBold';
    src:url(../fonts/honeyscript-semibold-webfont.ttf);
}

@font-face {
    font-family: 'HoneyScript Canopedia';
    src:url(../fonts/HoneyScript-Canopedia.ttf);
    /*src: url('../fonts/honeyscript-light-webfont.eot');*/
    /*src: local('☺'), url('../fonts/honeyscript-light-webfont.woff') format('woff'), url('../fonts/honeyscript-light-webfont.ttf') format('truetype'), url('../fonts/honeyscript-light-webfont.svg#webfontcgRAFle3') format('svg');*/
    /*font-weight: normal;*/
    /*font-style: normal;*/
}
/* -------- ELEMENTS GENERAUX --------- */

html body {
    font-family:Arial,Helvetica,sans-serif;
    font-size: 11px;
    color: #59593B;
    background-color: #C1C69D;
    margin:0;
}

p{
    font-size:12px;
}

a {
    color:#59593B;
}

a:hover {
    color: #8BA914;
    font-weight: bold;
}

a:visited {
    color:#555;
}

img{
    vertical-align:middle;
}

a img{
    border: 0px solid black;
    background-image: none;
}

h1 {
    padding-left: 4px;
    margin-left: -2px;
    margin-top:12px;
    background: url(../img/line.png) no-repeat scroll 0 70%;
    padding-bottom:5px;
	color: white;
    font-family: 'HoneyScript Canopedia', Arial, Helvetica, sans-serif;
    letter-spacing:1px;
    font-size : 3.6em;
    font-weight:normal;
}

h1:first-letter {
    text-transform:capitalize;
}


form label{
    display:block;
    width:150px;
    float:left;
    text-align:left;
}

.illus{
    width:25%;
}

.aere{
    margin:0 0 50px 0;
    text-align:justify;
}

ul li label{
    display:block;
}

.canopedia{
    font-weight:bold;
    color : #669900;
    font-size:1.1em;
}

/* -------- MESSAGES D'INFO --------- */


.error, .errorlist {
    background:#D60500 url(../img/cancel.png) no-repeat scroll 5px 50%;
    color:white;
    padding:5px 30px;
    -moz-border-radius:7px;
    -webkit-border-radius: 7px;
    -border-radius: 7px;
    text-align:left;
}

.error{
    margin : 5px auto;
}


.success {
    background:transparent url(../img/thumb_up.png) no-repeat scroll 8px 3px;
    color:white;
    padding:5px 30px;
    -moz-border-radius:7px;
    -webkit-border-radius: 7px;
    -border-radius: 7px;

    background-color:#64A804;
    width : 50%;
    margin : 5px auto;
}


.notice,.pluf-messages,.user-messages {
    background:transparent url(../img/error.png) no-repeat scroll 8px 3px;
    color:white;
    padding:5px 30px;
    -moz-border-radius:7px;
    -webkit-border-radius: 7px;
    -border-radius: 7px;

    background-color:#E5B900;
    width : 50%;
    margin : 5px auto;
}

.lefty{
    float:left;
}

.righty{
    float:right;
}

.cleary{
    clear:both;
}

.centry{
    margin-left:auto;
    margin-right:auto;
    width:50%;
}


/* -------- LES CONTENEURS --------- */


#all {
    width:990px;
    margin-top: 5px;
    margin-left:auto;
    margin-right:auto;
}

#labulle {
    height: 150px;
    background:transparent url(../img/line.png) repeat-x scroll 0 145px;
    font-size:1.77em;
    padding: 0px 85px 10px;
    color: white;
    font-weight: bold;
    vertical-align: middle;
    display: table-cell;

}

/* -------- haut --------- */

#topTop{
    height:20px;
    line-height:20px;
    background:#ffbb00 ;/*url('../img/at_work.png') repeat-x top left;*/
    text-align:center;
    margin-top :0px;
    border-bottom : 1px solid #DFA200;
    position:absolute;
    top:0;
    width:100%;
}

#logo {
    position: relative;
    width: 228px;
    float: left;
}

#definition {
    bottom: -10px;
    left: 78px;
    font-weight: bold;
    position: absolute;
    width: 400px;
}


.menuo {
    margin-top: 18px;
    margin-left: 5px;
    line-height: 12px;
    float: left;
}

.menuo a{
    color: white;
    font-weight: bold;
    margin:0 2px;
    padding: 2px 2px 2px 18px;
    line-height:16px;
}

.menuo span{
    padding: 2px 2px 2px 18px;
    font-size:1.1em;
}

.menuo #link-login{
   background : transparent url('../img/user.png')scroll no-repeat 0% 50%;
}
.menuo #link-logout{
   background : transparent url('../img/user_go.png')scroll no-repeat 0% 50%;
}
.menuo #link-rand{
    background:transparent url('../img/arrow_rotate_anticlockwise.png') scroll no-repeat 0% 50%;
}
.menuo #link-rss{
    background:transparent url('../img/rss.png') scroll no-repeat 0% 50%;
}
.menuo #link-identica{
    background:transparent url('../img/identica.png') scroll no-repeat 0% 50%;
}
.menuo #link-twitter{
    background:transparent url('../img/t.png') scroll no-repeat 0% 50%;
}
.menuo #link-help{
    background:transparent url('../img/help.png') scroll no-repeat 0% 50%;
}

#recher {
    margin-top: 17px;
    margin-right:10px;
    float: right;
}

#form_recher {
    font-size:11px;
    border:1px solid #96A982;
    padding-left:5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -border-radius: 5px;
}

#form_recher_submit {
    background:#6D84B4 url(../img/search.png) no-repeat scroll;
    display:block;
    margin:0;
    padding:3px 0;
}

/* --------- goldenmenu ----------- */

#goldenmenu {
    width: 990px;
    height: 32px;
    margin-top: 5px;
    /*background: url(../img/goldenmenu.png);
    background-repeat: no-repeat;*/
}

a.goldenbulle{
    margin-left:-3px;
}
a.goldenbulle:first {
    margin-left:0;
}

a.goldenbulle em {
    display:none;
}

a.goldenbulle:hover {
    border: 0;
    position: relative;
    z-index: 500;
    text-decoration:none;
}

a.goldenbulle:hover em {
    font-style: normal;
    display: block;
    position: absolute;
    top: 30px;
    left: -10px;
    padding: 5px;
    color: #1B2B14;
    border: 0px;

}

a.goldenbulle:hover em span {
    position: absolute;
    top: -7px;
    left: 15px;
    height: 11px;
    width: 22px;
    margin:0;
    padding: 0;
    border: 0;
}

#goldenbulle_bouf:hover em {
    background:#049300;
}

#goldenbulle_bouf:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_bouf.png);
}


#goldenbulle_vet:hover em {
    background: #64A804;
}

#goldenbulle_vet:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_vet.png);
}


#goldenbulle_cor:hover em {
    background: #82B700;
}

#goldenbulle_cor:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_cor.png);
}


#goldenbulle_hom:hover em {
    background: #B1C900;
}

#goldenbulle_hom:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_hom.png);
}


#goldenbulle_prop:hover em {
    background: #C4D800;
}

#goldenbulle_prop:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_prop.png);
}

#goldenbulle_jard1:hover em {
    background: #E2D600;
}

#goldenbulle_jard1:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_jard1.png);
}


#goldenbulle_trans:hover em {
    background: #E5B900;
}

#goldenbulle_trans:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_trans.png);
}


#goldenbulle_com:hover em {
    background: #ED8100;
}

#goldenbulle_com:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_com.png);
}


#goldenbulle_info:hover em {
    background: #DD5E00;
}

#goldenbulle_info:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_info.png);
}


#goldenbulle_geek:hover em {
    background: #D60500;
}

#goldenbulle_geek:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_geek.png);
}


#goldenbulle_eco:hover em {
    background: #E20041;
}

#goldenbulle_eco:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_eco.png);
}


#goldenbulle_edu:hover em {
    background: #EF038F;
}

#goldenbulle_edu:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_edu.png);
}


#goldenbulle_art:hover em {
    background: #D11083;
}

#goldenbulle_art:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_art.png);
}


#goldenbulle_cite:hover em {
    background: #AA008A;
}

#goldenbulle_cite:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_cite.png);
}


#goldenbulle_buro:hover em {
    background: #870287;
}

#goldenbulle_buro:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_buro.png);
}


#goldenbulle_brico:hover em {
    background: #0049A0;
}

#goldenbulle_brico:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_brico.png);
}


#goldenbulle_oby:hover em {
    background: #008EC6;
}

#goldenbulle_oby:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_oby.png);
}


#goldenbulle_toutou:hover em {
    background: #18A6C2;
}

#goldenbulle_toutou:hover em span {
    background: transparent url(../img/goldenmenu/goldenbulle_toutou.png);
}


/* -------- milieu --------- */


#gauche {
    width:200px;
    height:100%;
    margin-top:10px;
    padding-right:6px;
    float :left;
    background-image:url(../img/trait.png);
    background-position: top right;
    background-repeat: repeat-y;
    text-align:right;
}



#centre {
    padding-left: 8px;
    /*width:40%;*/
    /*padding-top: 20px;*/
    float:left;
    width: 575px;
    margin-top:-5px;
    min-height: 450px;
    font-size:12px;
}

#centre ul label{
    margin-left:-20px;
}

#centre p a, #droite p a{
    text-decoration:none;
}



#droite {
    float: right;
    margin-top: 10px;
    width: 200px;
    background-image: url(../img/trait.png);
    background-position: top left;
    background-repeat: repeat-y;
}


/* -------- bas --------- */


#pied {
    width: 100%;
    margin: 20px auto;
    padding: 4px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright:5px;
    -moz-border-radius-topleft:5px;
    -moz-border-radius-topright:5px;
    -webkit-border-radius: 5px;
    -border-radius: 5px;
    text-align: center;
    border:1px solid white;
}

.menuba {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid #59593B;
}


/* -------- autres éléments --------- */


#formulaire {
    width: 750px;
    text-align:center;
    margin-left: 120px;
    /*    margin-top: 10px;
    background-image:url(../img/rounded.png);
    background-position: top center;
    background-repeat: no-repeat;*/
}

#annexes {
    margin-left: 200px;
    width: 575px;
}

#annexes li{
    margin: 5px 0px;
    list-style-image : url(../img/li-btn-black.png);
}

.button{
    background-color: white;
    border : 0;
    padding:5px 8px;
    font-weight:bold;
    font-size:11px;
    color:#1B2B14;
    cursor:pointer;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -border-radius: 3px;
}

input .logon{
    background-color:white;
    border:1px solid #59593B;
    color:#000000;
    padding:0.2em;
    vertical-align:middle;
    visibility:visible;
}

.hide {
    display:none;
}

.notice, .pluf-messages, .user-messages {
    background:transparent url(../img/error.png) no-repeat scroll 8px 3px;
    color:white;
    padding:5px 30px;
}

/* -------- BOUTONS et listes --------- */


ul{
    padding-left: 15px;
    margin-top: 0px;
}

li{
    margin: 13px 0px;
    list-style-type: none;
    list-style-position:outside;
}

ul li label {
    margin : 5px auto;
}

li a span {
    /* display: block; */
    line-height: 14px;
    padding: 5px;
    font-weight: bold;
}



#gauche ul, #droite ul, #centre label {
    text-transform: uppercase;
    font-size:12px;
}

#gauche li a {
    font-weight: bold;
}

#gauche li a:hover {
    margin-right: 10px;
}



#centre .category{
    margin : 0 0 20px 0;
}

#centre ul {
    margin-top:15px;
    margin-left: 0px;
    line-height: 16px;
    margin-bottom: 10px;

}

#centre label {
    line-height:25px;
    font-weight: bold;
}

#centre li{
    margin: 6px 10px;
    list-style-image : url(../img/li-btn-black.png);
}

#centre li:first-letter {
    text-transform: uppercase;
}

#centre li .intro{
    margin: 4px 0px;
    list-style-image : none;
}

#centre p a, #droite p a{
    text-decoration:none;
}

/*#centre a {
background: url(../img/external.png) no-repeat scroll left center;
padding-left:13px;
}*/

#droite a {
    font-weight: bold;
}

#droite li a {
    font-weight: bold;
}

#droite li a:hover {
    margin-left: 5px;
}

#droite p{
    margin-left:22px;
}



ul.btn li {
    padding: 5px  0;
    margin: 5px;
}

ul.btn li a{
    -moz-border-radius:3px;
    -webkit-border-radius: 3px;
    -border-radius: 3px;
}

.btn a{
    color: #1B2B14;
    height: 24px;
    margin-right: 6px;
    padding : 5px 8px 5px 8px;
    text-decoration: none;
}



/* --------- couleur des boutons ---------- */



#gauche li:first-child a {
    background-color:#fff;
}

/* ------- solutions ------- */

li.alt a{
    background-color:#fff;
}

li.sol_cool a{
    -moz-border-radius-bottomleft:5px;
    -moz-border-radius-bottomright:5px;
    -moz-border-radius-topleft:5px;
    -moz-border-radius-topright:5px;
    border:1px solid #c5dd30;
}

li.sol_bof a{
    -moz-border-radius-bottomleft:5px;
    -moz-border-radius-bottomright:5px;
    -moz-border-radius-topleft:5px;
    -moz-border-radius-topright:5px;
    border:1px solid #eaa804;
}

li.sol_ohno a{
    -moz-border-radius-bottomleft:5px;
    -moz-border-radius-bottomright:5px;
    -moz-border-radius-topleft:5px;
    -moz-border-radius-topright:5px;
    border:1px solid black;
}

/* ------- thématiques ------ */

li.bouf a {
    background-color:#049300;
}

li.vet a{
    background-color: #64A804;
}

li.cor a{
    background-color: #82B700;
}

li.hom a{
    background-color: #B1C900;
}

li.prop a{
    background-color: #C4D800;
}

li.jard1 a{
    background-color: #E2D600;
}

li.trans a{
    background-color: #E5B900;
}

li.com a{
    background-color: #ED8100;
}

li.info a{
    background-color: #D60500;
}

li.geek a{
    background-color: #E20041;
}

li.eco a{
    background-color: #EF038F;
}

li.edu a{
    background-color: #AA008A;
}

li.art a{
    background-color: #D11083;
}

li.cite a{
    background-color: #DD5E00;
}

li.buro a{
    background-color: #00B5D3;
}

li.brico a{
    background-color: #870287;
}

li.oby a{
    background-color: #0049A0;
}

li.toutou a{
    background-color: #008EC6;
}


/* --------- couleur des titres et listings ---------- */

.intro span {
    font-style: italic;
 }


 .astuce label {
     background-color: #CEEF45;
     padding:3px 5px;
     /*background:  #CEEF45 url(../img/triangle_astuce.png) no-repeat scroll 0 25px;*/
}

.astuce span {
    background-color:#CEEF45;
    padding-left:3px;
    padding-right:3px;
 }


 .lien label {
     background-color:#F9B800;
     padding:3px 5px;
 }

 .lien span {
     background-color:#F9B800;
     padding-left:3px;
     padding-right:3px;
 }


 .adresse label {
     background-color:#60ACEA;
     padding:3px 5px;
 }

 .adresse span {
     background-color:#60ACEA;
     padding-left:3px;
     padding-right:3px;
 }


 .marque label{
     background-color:#d0dd25;
     padding:3px 5px;
}

.marque span{
    background-color:#d0dd25;
    padding-left:3px;
    padding-right:3px;
}