/******************************************************************************
 * Reset CSS v1.0 | 20080212 (Eric Meyer)
 *****************************************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/******************************************************************************
 * Définition des valeurs générales
 *****************************************************************************/

body {
    background : #ebe6e1;
    font-family : "Trebuchet MS", sans-serif;
    font-size : 12px;
    color : #4a4a4a;
}

a { color : #4a4a4a; }
a:hover { color : #EB6E08; text-decoration : none; }

#corps a { color: #EB6E08; }

.clear { clear : both; }

.lient1 a,
.lient2 a {
    -moz-border-radius : 3px;
    text-decoration : none;
}

.lient1 a span,
.lient2 a span {
    text-transform : uppercase;
    padding : 1px 5px;
    font-size : 11px;
    font-weight : bold;
}

.lient1 a { border : 2px solid white; }
.lient1 a span { background : black; color : white; }

.lient2 a { border : 2px solid #cfccc7; }
.lient2 a span { background : white; color : black; }

.gauche img { float:left; margin-right:10px; }
.droite img { float:right; margin-left:10px; }


/******************************************************************************
 * Définition des zones
 *****************************************************************************/


/* Content */

#z1 .content,
#z2 .content,
#z3a .content,
#z3b .content,
#z4 .content,
#z5 .content,
#z6 .content {
   width : 910px;
   margin : auto;
}


/* Zones */

#z1 {
    background : url(images/bg_z1.jpg) top left repeat-x;
    height : 40px;
    position : relative;
    z-index : 2;
}

#z2 {
    background : white;
    height : 143px;
}

#z2 .content {
    position : relative;
    z-index : 0;
    padding-top : 21px;
}

#z3a { background : url(images/bg_z3a-2.png) bottom left repeat-x #f19246; }
#z3a .content {
    background : url(images/bg_z3a.jpg) top left no-repeat;
    height : 335px;
}

#z3b { background : url(images/bg_z3b-2.jpg) #f19246 top left repeat-x; }

#z3b .content {
    background : red;
    height : 90px;
    background : url(images/bg_z3b.jpg) top left no-repeat;
}

#z3b #hierarchie {
	height : 29px;
	line-height : 29px;
	padding-left : 50px;
	font-size : 11px;
}

#z3b #hierarchie,
#z3b #hierarchie a {
	color : black;
	text-decoration : none;
}

#z3b h1 {
	height : 61px;
	line-height : 61px;
	padding-left : 50px;
	color : white;
	font-size : 22px;
}

#z4 {
    background : url(images/bg_z4.jpg) top left repeat-x;
	padding : 22px 0 31px 0;
}

#z5 {
    background : #454340;
    height : 175px;
    padding : 15px 0 10px 0;
}

#z6 {
    padding : 15px 0 40px 0;
	text-align : center;
}



/* Zone 1 : Menu */

#menu { padding-top : 10px; }
#menu ul { display : none; }
#menu li { float : left; }
#menu a { text-decoration : none; }

#menu .category {
    line-height : 23px;
    height : 23px;
    padding : 0 10px 7px 10px;
    color : black;
    display : block;
    margin-right : 10px !important;
    margin-right : 5px;
    font-weight : bold;
    float : left;
}

#menu a:hover,
#menu .current a,
#menu .current span,
#menu li:hover .category,
#menu .category.on {
    background : white;
    color : #eb6e08;
    cursor : pointer;
}


/* Zone 1 : Sous-menu */

#menu li:hover { position : relative; }

#menu li:hover ul { display : block; }

#menu li ul {
    position : absolute;
    top : 30px;
    left : 0;
    display : none;
    background : #f3f3f3;
    border-right : 1px solid #b2b2b2;
    border-bottom : 1px solid #b2b2b2;
    padding : 0 10px 0 10px;
    width : 150px;
}

#menu ul li {
    float : none;
    margin : 10px 0 10px 0;
}

#menu ul a { color : #6c6c6c; }

#menu ul a:hover,
#menu ul .on {
    color : #eb6e08;
    background : none;
}


/* Zone 2 : Titre et liens */

#z2liens {
    position : absolute;
    right : 0;
    top : 15px;
    width : 170px;
}

#z2liens li {
    padding : 5px 0 5px 0;
    background : url(images/e_pointilles.png) bottom left repeat-x;
}

#z2liens li.sansligne { background : none; }

#z2liens a {
    height : 28px;
    padding-left : 39px;
    display : block;
    text-decoration : none;
    color : #4e4e4e;
}

#z2liens a:hover {
    color : #eb6e08;
}

#z2liens .facebook { background : url(images/ico_facebook.png) top left no-repeat; line-height : 28px; }
#z2liens .arobase { background : url(images/ico_arobase.png) top left no-repeat; line-height : 28px; }
#z2liens .people { background : url(images/ico_people.png) top left no-repeat; line-height : 14px; }


/* Zone 3 : diaporama */

#z3a .content {
    overflow : hidden;
    position : relative;
}

#z3a .panorama {
    overflow : hidden;
    width : 830px;
    height : 307px;
    margin-left : 40px;
    position : relative;
}

#z3a #slide1 {
    position : absolute;
    width : 5000px;
    height : 307px;
}


#z3a .element {
    position : relative;
    height : 307px;
    width : 830px;
    float:left;
}

#z3a .element .description {
    position : absolute;
    top : 0;
    left : 0;
    width : 290px;
    padding-right : 10px;
    height : 300px;
    color : white;
}

#z3a .element .description p {
    margin-bottom : 10px;
    line-height : 15px;
}

#z3a .element .description h3 {
    font-size : 23px;
    padding : 30px 0 20px;
}

#z3a .el2 .description h3 {
    font-size : 23px;
    padding : 10px 0 20px;
}

#z3a .el2 .description .vendeur {
    position:absolute;
    bottom:0px;
    left:220px;
}

#z3a .element .image {
    position : absolute;
    top : 0;
    right : 0;
    height : 265px;
    width : 528px;
    padding-top : 20px;
}

#z3a .element .liens {
    position : absolute;
    bottom : 0;
}

#z3a .element .liens a {
    display : block;
    border : 2px solid #b18a62;
    -moz-border-radius : 3px;
    text-decoration : none;
    margin-bottom:2px;
}

#z3a .element .liens span {
    display : block;
    background : url(images/bg_bouton1.png) top left repeat-x #2c2c2c;
    color : white;
    text-transform : uppercase;
    text-decoration : none;
    font-weight : bold;
    height : 28px;
    line-height : 28px;
    padding : 0 10px 0 10px;
}

#z3a .navigation .suivant,
#z3a .navigation .precedent {
    position : absolute;
    top : 137px;
    padding-top : 32px;
    height : 0;
    width : 24px;
    overflow : hidden;
    background-image : url(images/e_fleche1.png);
}

#z3a .navigation .suivant { right : 0; background-position : top right; }
#z3a .navigation .precedent { left : 0; background-position : top left; }

#z3a .navigation .chiffres {
    background : #333335;
    position : absolute;
    right : 0;
    bottom : 0;
    height : 28px;
    line-height : 28px;
}

#z3a .navigation .chiffres a,
#z3a .navigation .chiffres li {
    float : left;
}

#z3a .navigation .chiffres a {
    margin : 0 5px;
    width : 18px;
    text-align : center;
    font-weight : bold;
    text-decoration : none;
    color : black;
    font-size : 14px;
    background : url(images/e_nav1.png) 0 5px no-repeat;
}

#z3a .navigation .chiffres a.on {
    background-position : -18px 5px;
}


/* Zone 5 : liste des magazines */

#z5title {
    padding-left : 76px;
    margin : auto;
    width : 834px;
    color : white;
    overflow : visibile;
}

#z5title span {
    background : #454340;
    padding : 3px 28px 3px 28px;
}


/* Zone 4 : Article*/

#z4 {
	color : #494949;
	line-height : 18px;
}

#z4 .fond {
    background : url(images/e_articlefond.png) bottom right no-repeat;
    padding : 0 9px 9px 0;
}

#z4 .content {
    width : 919px;
}

#chapo,
#corps {
	padding : 27px 50px 40px 50px;
}

#chapo {
	background : #f2eeeb;
    font-size:13px;
    font-weight:bold;
    line-height:15px;
    padding-bottom : 0;
}

#chapo .lien {
    text-align : right;
    margin-top : 10px;
}

#chapo .image {
    float : left;
    width : 92px;
    margin-right : 12px;
}

#chapo .text {
    width : 417px;
    float : left;
}

#chapo .separation {
    padding-top : 16px;
}

#corps {
	background : white;
	padding-top : 22px;
}

#z4 h3 {
	padding : 13px 16px 9px 16px;
	margin-left : -16px;
    margin-bottom : 16px;
    text-align : left;
}

#z4 #chapo h3 {
    font-size : 15px;
    background : white;
}

#z4 #corps h3 {
    font-size : 15px;
    background : #f1eeea;
}

#corps ul {
    list-style-type: disc;
    list-style-position : inside;
}

#corps ul ul {
    list-style-type: circle;
    list-style-type : none !important;
}

#corps ul ul li:before {
    content : "- ";
}

.plan ul ul {
	padding-left : 17px;
}

#corps .blocvideos { clear : both; }

#corps .video.droite { float : right; }
#corps .video.gauche { float : left; }

#corps p { margin : 15px 0 15px 0; }
#chapo .text p { margin : 0 0 15px 0; }

/* Zone 4 : colones */

#colgauche {
	width : 630px;
	float : left;
}

#coldroite {
	width : 250px;
	float : right;
    overflow : hidden;
}

/* #coldroite */

#coldroite h3 {
    padding : 10px 0;
    text-align : center;
    font-size : 18px;
}

#colgauche .separation,
#coldroite .separation {
    background : url(images/e_pointilles.png) bottom left repeat-x;
    height : 1px;
}

#coldroite .separation {
    margin : 10px 0;
}

/* Devenez vendeur */

#devenezvendeur a {
    position : relative;
    height : 176px;
    display : block;
    background : url(images/e_vendeur.png) left -22px no-repeat;
    text-decoration : none;
}

#devenezvendeur h3 { display : none; }

#devenezvendeur .b {
    position : absolute;
    top : 97px;
    line-height : 14px;
}
#devenezvendeur .c {
    position : absolute;
    top : 134px;
    font-weight : bold;
    font-size : 20px;
}
#devenezvendeur .b span {
    display : block;
}

/* Partenaires */

#partenaires {
    text-align : center;
    margin-bottom : 15px;
}

#partenaires .encadre {
    position : relative;
    border : 1px solid #6b635c;
    height : 90px;
    width : 248px;
    overflow : hidden;
    margin : 10px 0;
}

#partenaires .listepartenaires {
    position : absolute;
    width : 1000px;
    height : 76px;
    top : 0;
    left : 0;
}

#partenaires .listepartenaires li{
    float : left;
    width : 248px;
    height : 76px;
    line-height : 76px;
}

#partenaires .listepartenaires img {
    vertical-align : middle;
}

#partenaires #suivant,
#partenaires #precedent {
    position : absolute;
    bottom : 0;
    text-decoration : none;
    padding : 0 10px 0 10px;
    font-weight : bold;
}

#partenaires #suivant { left : 0; }
#partenaires #precedent { right : 0; }

/* #coldroite publicite */

#coldroite .publicite {
	padding-top : 15px;
    padding-bottom : 15px;
}

#coldroite .publicite h3 {
    font-size : 10px;
    font-weight : normal;
	margin-top : 0;
	padding-top : 0;
    padding-bottom : 0;
    margin-bottom : 0;
	display : none;
}

#coldroite .publicite .encadre {
    height : 250px;
    width : 250px;
    background : white;
}

/* #coldroite nosvendeurs */

#coldroite #nosvendeurs {
    width : 254px;
    margin-left : -3px;
    padding-left : 2px;
    margin-bottom : 20px;
}

#coldroite #nosvendeurs li {
    float : left;
}

#coldroite #nosvendeurs li img {
    background : #efeae6;
    padding : 2px;
    margin : 2px;
    border : 1px solid #d5d5d5;
    float : left;
}

/* #coldroite ateliers */

#coldroite #atelierecriture { margin-top : 20px; }

#coldroite #atelierecriture,
#coldroite #atelierecriture h3,
#coldroite #atelierecriture a {
    color : white;
}

#coldroite #atelierecriture .text {
    background : #6c635c;
    padding : 20px;
}

#coldroite #atelierecriture h3 {
    background : #8a837d;
    text-align : left;
    padding-left : 35px;
    margin-bottom : 0;
}

/* Zone 5 : archives */

#z5 .content {
    position : relative;
}

#z5 #archives {
    width : 760px !important;
    height : 175px;
    margin-left : 76px;
    overflow : hidden;
}

#z5 #archives ul {
    width : 3000px;
}

#z5 #archives li {
    float : left;
    text-align : center;
    width : 800px;
}

#z5 #archives li a {
    float : left;
    margin-right : 40px;
    width : 120px;
    display : block;
    overflow : hidden;
}

#z5 #archives img {
    width : 120px;
    height : 157px;
    margin-bottom : 7px;
}

#z5 #archives a {
    color : white;
    text-decoration : none;
}

#z5 .navigation .precedent,
#z5 .navigation .suivant {
    position : absolute;
    top : 66px;
    height : 40px;
    width : 29px;
    background-image : url(images/e_fleches2.png);
}

#z5 .navigation .precedent {
    background-position : top left;
    left : 19px;
}
#z5 .navigation .suivant {
    background-position : top right;
    right : 19px;
}

#nextBtn, #prevBtn, #nextBtn2, #prevBtn2, #nextBtn3, #prevBtn3 {
    display:none;
}

/*.chiffres, #nextBtn, #prevBtn, #nextBtn2, #prevBtn2, #nextBtn3, #prevBtn3 {
    display:none;
}*/

/* Modèle archives */
#modele-archives li {
    display:block;
    float:left;
    margin-right:40px;
    overflow:hidden;
    width:120px;
    height:195px;
    text-align:center;
}

#modele-archives li a {
    text-decoration:none;
}

/* Plumes */

.plumes-liens {
    text-align:right;
}

/* Actu page d'accueil */

.image-actu {
    float : left;
    width : 92px;
    margin-right : 12px;
}

