/* 
* Copyright (c) 2009 Informatique Prog. Tous droits réservés
*/

/*
* Reset
*/
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{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
background:transparent;
}
table, caption, tbody, tfoot, thead, tr, th, td{
border:0;
outline:0;
font-size:100%;
background:transparent;
}
table{
border-collapse:collapse;
border-spacing:0;
}
body{
line-height:1;
}
ol, ul{
list-style:none;
}
:focus{
outline:0;
}
ins{
text-decoration:none;
}
del{
text-decoration:line-through;
}


/*
* Eléments HTML en général
*/
body{
background-color:#000;
color:#FFF;
font:normal normal 0.8em/1.25em Arial,Helvetica,sans-serif;
padding:6px 0;
}
h1{
font:normal normal 1.8em Arial,Helvetica,sans-serif;
padding:20px 0 20px 50px;
}
h2{
font:normal bold 1.4em Arial,Helvetica,sans-serif;
padding:18px 0;
}
h3{
font:normal bold 1em Arial,Helvetica,sans-serif;
}
h4{
font:normal bold 0.9em Arial,Helvetica,sans-serif;
}
a,a:visited{
color:#CCC;
text-decoration:none;
}
a:active,a:hover{
color:#CCC;
text-decoration:underline;
}
p{
margin:.75em 0;
}
ul, ol{
margin:.75em 0 .75em 24px;
}
ul{
list-style:square;
}
.clear{
clear:both; 
font-size:0; 
line-height:0;
}


/*
* Page
*/
#global{
background:#510908 url(./images/fond_page.gif) no-repeat 0 190px;
width:980px;
margin:0 auto;
}
#entete{
margin:0 0 6px 0;
background:transparent url(./images/bandeau.png) no-repeat top center;
height:117px;
text-align:right;
}
#navigation{
background:transparent url(./images/fond_menu.jpg) repeat-x 0 16px;
height:80px;
}
#centre{
width:980px;
min-height:420px;
}
#pied{
background:transparent url(./images/fond_pied.jpg) repeat-x;
margin:8px 0 0 0;
padding:12px 20px 0 0;
}


/*
* Entete
*/


/*
* Navigation
*/
#navigation ul{
list-style:none;
margin:0 auto;
padding:16px 0 0 0;
width:922px;
}
#navigation ul li{
background:url(./images/fond_menu_texte_begin.jpg) no-repeat;
float:left;
height:47px;
padding:10px 0 0 8px;
text-align:center;
width:78px;
}
#navigation ul li.contenu{
width:66px;
}
#navigation ul li.last{
width:76px;
}
#navigation .separateur{
background:url(./images/fond_menu_texte_end.jpg) no-repeat;
padding:0;
width:22px;
height:47px;
}
#navigation a{
display:block;
color:#000;
font:normal bold 0.85em/1.2em Arial,Helvetica,sans-serif;
text-decoration:none;
}
#navigation a:hover,#navigation a:focus{
text-decoration:underline;
}


/*
* Pied
*/
#copyright{
color:#CCC;
font:normal bold 0.8em Arial,Helvetica,sans-serif;
float:left;
margin:0;
padding:4px 0 0 20px;
text-align:left;
}
#copyright a{
color:#CCC;
font:normal bold 1em Arial,Helvetica,sans-serif;
}
#icons{
float:right;
margin:0;
padding:0;
}



/*
* Centre
*/
.ancetre{
font:normal normal 0.95em Arial,Helvetica,sans-serif;
color:#CCC;
margin:0 0 0 166px;
padding:0 40px 10px 40px;
background-color:#510908;
}
.ancetre .separateur{
color:#CCC;
padding:0 3px;
}
.twoCols{
background:url(./images/separateurs.gif) repeat-y center 20px;
}
.oneColLeft{
background:url(./images/separateur.gif) repeat-y 199px top;
}
.oneColRight{
background:url(./images/separateur.gif) repeat-y 778px top;
}
#colLeft{
float:left;
width:192px;
margin:0;
overflow:hidden;
padding:14px 10px 40px 6px;
}
#colRight{
float:right;
width:186px;
margin:0;
overflow:hidden;
padding:14px 6px 40px 10px;
}
#colMiddle{
float:left;
}
.colMiddle0{
padding:2px 80px 15px 80px;
width:820px;
}
.colMiddle1{
padding:2px 4px 15px 4px;
width:764px;
}
.colMiddle2{
padding:2px 4px 15px 4px;
width:770px;
}
.colMiddle3{
padding:2px 4px 15px 4px;
width:562px;
}


/*
* Catalogue
*/
.catalogueNiv1{
background:url(./images/fleche.gif) no-repeat 0 4px;
margin:0;
padding:0 0 0 14px;
}
.catalogueNiv1 a{
font:normal bold 1.1em/1.4em Arial,Helvetica,sans-serif;
}
.catalogueNiv2{
list-style:none;
margin:2px 0 0 10px;
padding:0;
}
.catalogueNiv2 a{
background:url(./images/fleche2.gif) no-repeat 0 4px;
font:normal normal 0.9em/1.5em Arial,Helvetica,sans-serif;
padding:0 0 0 14px;
}
#colRight p.spacer{
margin:0;
padding:0;
height:14px;
}
.fondBig{
background:url(./images/fond_bloc_actu.png) no-repeat;
height:200px;
overflow:hidden;
width:189px;
}
.fondBig h2{
color:#000;
font:normal bold 1.1em/1.3em Arial,Helvetica,sans-serif;
height:35px;
overflow:hidden;
padding:6px;
text-align:center;
}
.fondBig p.image{
margin:0 8px;
height:110px;
overflow:hidden;
text-align:center;
}
.fondBig p.image img{
border:1px solid #000;
height:108px;
}
.fondBig p.image img.noImg{
margin:0 22px;
width:135px;
}
.fondBig h3{
background:url(./images/search.gif) no-repeat 14px 4px;
color:#000;
font:normal bold 1.05em/1.1em Arial,Helvetica,sans-serif;
height:36px;
overflow:hidden;
margin:0;
padding:5px 4px 0 34px;
text-align:left;
white-space:pre;
}
.fondBig h3 a{
color:#000;
}
.fondBig h3.coupCoeur{
height:23px;
}
#coupDeCoeur p.image{
height:120px;
}
#coupDeCoeur p.image img{
height:118px;
}
.fondSmall{
background:url(./images/fond_bloc_petit.png) no-repeat 0 0;
float:left;
height:168px;
margin:20px 16px;
padding:0;
overflow:hidden;
width:155px;
}
.fondSmall h2{
color:#000;
font:normal bold 0.85em/1.1em Arial,Helvetica,sans-serif;
height:28px;
overflow:hidden;
padding:9px 2px 4px 2px;
text-align:center;
}
.fondSmall a{
font:normal bold 1.1em Arial,Helvetica,sans-serif;
color:#000;
}
.fondSmall p.image{
background:url(./images/ph_n_dispo2.gif) no-repeat 41px 16px;
height:112px;
margin:0;
overflow:hidden;
padding:0 21px 0 23px;
text-align:center;
}
.fondSmall p.image img.photo{
border:1px solid #000;
}
.fondProduit{
background:url(./images/fond_bloc_produit.png) no-repeat 0 0;
float:left;
height:348px;
margin:0 0 0 17px;
overflow:hidden;
width:348px;
}
.fondProduit h2{
color:#000;
font:normal bold 0.95em Arial,Helvetica,sans-serif;
height:26px;
overflow:hidden;
padding:12px 2px 0 2px;
text-align:center;
}
.fondProduit h2 span{
font:normal bold 1.1em Arial,Helvetica,sans-serif;
}
.fondProduit table.image{
background:url(./images/ph_n_dispo2.gif) no-repeat center center;
height:252px;
margin:0 10px;
overflow:hidden;
text-align:center;
vertical-align:middle;
width:328px;
}
.fondProduit table.image img.photo{
border:1px solid #000;
}
.fondProduit .navigation{
padding:6px 4px 0 4px;
}
.navigation .navPrec, .navigation .navSuiv{
float:left;
padding:6px 4px 0 4px;
width:29px;
}
.navigation div{
float:left;
padding:5px 0 0 0;
width:266px;
}
.navigation p{
color:#000;
font:normal bold 1em Arial,Helvetica,sans-serif;
margin:0;
text-align:center;
}
#diaporama{
clear:both;
padding:2px 0 0 0;
cursor:pointer;
}
#accessoires{
padding:0 0 0 3px;
}
#descriptif{
color:#FFF;
padding:10px 30px;
text-align:left;
}
#postscriptum{
color:#CCC;
text-align:center;
}


/*
* Navigation pages
*/
#pagination{
color:#CCC;
font:italic normal 0.85em Arial,Helvetica,sans-serif;
margin:0;
text-align:center;
}
#pagination .separateur{
color:#CCC;
padding:0 6px;
}
#pagination .enCours{
color:#CCC;
font:italic bold 1.2em Arial,Helvetica,sans-serif;
}


/*
* Les formulaires
*/
.formulaire legend{
padding:26px 35%;
font:normal bold 11px Arial,Helvetica,sans-serif;
}
.formulaire label{
display:block;
}
.formulaire .ctrlHolder{
padding:12px 7px 7px 7px;
border-bottom:1px solid #DFDFDF;
}
.formulaire .inlineLabels label, .formulaire .inlineLabels .label{
float:left;
position:relative;
line-height:100%;
width:35%;
margin:0.3em 2% 0 0;
font-weight:bold;
}
.formulaire .inlineLabels label em{
display:block;
font-style:normal;
font-weight:bold;
left:auto;
position:absolute;
right:0;
}
.formulaire .inlineLabels input,.formulaire .inlineLabels select,.formulaire .inlineLabels textarea, .formulaire .inlineLabels .value{
float:left;
width:60%;
}
.formulaire .clear{
margin-top:0;
margin-left:37%;
position:static;
height:4px;
float:none;
}
.formulaire .formHint{
color:#777777;
font-size:10px;
margin-left:37%;
margin-top:0;
position:static;
top:-0.5em;
width:35%;
float:none;
clear:both;
}
.ligneObligatoire{
margin:6px 0 6px 16px;
}
.bouton{
width:72px;
margin:10px auto 20px;
}


/*
* Nuage de Tags
*/
#nuage{
border:1px dotted #CCC;
overflow:hidden;
padding:6px;
width:175px;
}
#nuage p{
margin:0;
text-align:center;
}
.nuage0{
font:normal bold 11px Arial,Helvetica,sans-serif;
}
.nuage1{
font:normal bold 14px Arial,Helvetica,sans-serif;
}
.nuage2{
font:normal normal 16px Arial,Helvetica,sans-serif;
}
.nuage3{
font:normal bold 18px Arial,Helvetica,sans-serif;
}
.nuage4{
font:italic normal 20px Arial,Helvetica,sans-serif;
}
.nuage5{
font:normal normal 24px Arial,Helvetica,sans-serif;
}


/*
* Rubrique
*/
.petitBlocProduit{
float:left;
margin:0 20px 15px 0;
width:315px;
}
.petitBlocProduit h3 a, .petitBlocProduit h3 a:visited{
background-color:#CCC;
color:#00009E;
display:block;
/* height:20px; */
padding:5px 0 7px 7px;
text-decoration:none;
text-align:center;
}
.petitBlocProduit h3 a:hover, .petitBlocProduit h3 a:active{
background-color:#FD0100;
color:#333;
}
.petitBlocProduit div.contenu{
background-color:#EEE;
float:left;
margin:1px 0 0;
padding:4px;
width:307px;
}
.petitBlocProduit a.image, .petitBlocProduit a.image:visited{
background-color:#FFF;
border:1px solid #BBBDBF;
display:block;
float:left;
height:140px;
overflow:hidden;
padding:1px;
width:140px;
}
.petitBlocProduit div.contenu p{
float:left;
padding:2px;
width:159px;
}


/*
* scrollable
*/

.blocDImages{
width:640px;
margin:0 auto;
}
.bigImage{
width:440px;
height:380px;
margin:40px 2px;
float:left;
vertical-align:middle;
text-align:center;
cursor:pointer;
}
.blocScrollable{
width:140px;
height:366px;
float:left;
}
a.browse {
display:block;
width:30px;
height:30px;
float:left;
margin:40px 10px;
cursor:pointer;
font-size:1px;
}
.vertical{
position:relative;
overflow:hidden;
height:282px;
width:138px;
border:1px solid #CCC;
background:url(./js/images/scrollable/v300.png) repeat-y;
}
.vertical .items{
position:absolute;
height:20000em;
margin:0px;
}
.vertical img {
float:left;
margin:10px 21px 10px 21px;
padding:2px;
border:1px solid #ccc;
cursor:pointer;
width:90px;
height:68px;
}
a.up, a.down {
background:url(./js/images/scrollable/arrow/vert_large.png) no-repeat; 
float:none;
margin:5px 55px;
}
a.up:hover { background-position:-30px 0; }
a.up:active { background-position:-60px 0; }
a.down { background-position: 0 -30px; }
a.down:hover { background-position:-30px -30px; }
a.down:active { background-position:-60px -30px; } 
.horizontal{
position:relative;
overflow:hidden;
width: 680px;
height:120px;
border:1px solid #CCC;
background:url(./js/images/scrollable/h300.png) repeat-x;
float:left;
}
.horizontal .items {
width:20000em;
position:absolute;
clear:both;
}
.horizontal img {
float:left;
margin:20px 5px 20px 21px;
background-color:#fff;
padding:2px;
border:1px solid #ccc;
cursor:pointer;
width:100px;
height:75px;
}
a.right { background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover { background-position:-30px -30px; }
a.right:active { background-position:-60px -30px; } 
a.left { margin-left: 0px; } 
a.left:hover { background-position:-30px 0; }
a.left:active { background-position:-60px 0; }
a.disabled { visibility:hidden !important; }
.scrollable .active {
border:2px solid #000;
z-index:9999;
position:relative;
}