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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

.fr{float:right;}
.fl{float:left;}
.clear{clear:both;}


/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	line-height:16px;
	color: #fcfcfc;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

body
{
	text-align: center;
	background: #2a2a2a url('bg-top.jpg') top repeat-x;
	font-size: .8em;
	font-family: Arial, Helvetica, sans-serif;
	color: #757575;
}

h1 { font-size: 18px;}

strong { font-weight: bold; }

#expo label {font-weight: bold; display: block;}
#expo input {display: block; margin-bottom: 10px;}

.ancre
{
	display: none;
}

.clear
{
	clear: both;
}

.spacer
{
	clear: both;
	background: url('spacer.gif') bottom repeat-x;
	padding-top:  10px;
	margin-bottom: 10px;
}

.border-spacing { background: url(double-border.jpg) bottom repeat-x; 
		  padding-top: 30px; margin-bottom: 30px; clear: both;
		  }


.border-dotted { border: 1px dotted #5d6164; padding: 2px; height: 340px; width: 436px; float: left;}

p.suite
{
	text-align: right;
}

p.suite a:visited, p.suite a:link
{
	text-align: right;
	font-size: 0.9em;
	color: #511a00;
	text-decoration: none;
}

p.suite a:hover, p.suite a:active
{
	color: #511a00;
	text-decoration: underline;
}

p
{
	margin: 0;
	color: #CCCCCC;
	font-size: 14px;
}

a
{
	text-decoration: none;
}

h2
{
	color: #fcfcfc;
	text-transform: uppercase;
	/*background: url('picto-cles.gif') left no-repeat;*/
	font-size: 1.1em;
	font-weight: bold;
	margin-bottom: 20px;
}

h2 span
{
	color: #277792;
}

.page
{
	text-align: left;
	width: 870px;
	margin: 0 auto;
}

#extra-logos {
	background: #ffffff;
	border-top: 1px solid #b9b9b9;
	border-bottom: 1px solid #b9b9b9;
	height: 80px;
	padding-top: 10px;
}

div.scrollable { 
 
    /* required settings */ 
    position:relative; 
    overflow:hidden; 
    width: 800px; 
    height:130px;
    margin: 0 auto; 
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
} 
 
/* 
    a single item. must be floated on horizontal scrolling 
    typically this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable div.items div { 
    float:left; 
} 
 
/* you may want to setup some decorations to active item */ 
div.items div.active { 
    border:1px inset #ccc; 
    background-color:#fff; 
}

#header
{
	background: url('serrure-header.jpg') right no-repeat;
	padding: 0;	
	height:175px;
	width: 870px;
	margin: 0px auto 0 auto;
}

#header p#logo{width:500px;float:left;}

div#header div#nos-videos
{
	width:180px;
	font-size:12px;
	font-family:arial;
	margin-top: 30px;
	color: #FFFFFF;
	font-weight: bold;
}

#header div#nos-videos a{color:#ffffff;text-decoration:none;}
#header div#nos-videos a:hover{text-decoration:underline;}

p#logo a img
{
	display: block;
	width: 435px;
}


#menu-bg
{
	
}

#menu-bg form { width: 220px; background: #8e8b7a; height: 44px; float: left;
		margin-top: 2px; padding: 10px 0 0 10px; }
#menu-bg form input {border: 1px solid #767561; margin-bottom: 6px;}
#menu-bg form input#search {margin-right: 10px; width: 167px;}
#menu-bg form input#go_search {width: 27px; background: #c0c0c0;}

#main-menu
{
	height: 20px;
	text-align: left;
	margin-top: 15px;
	float: left;
}

/*#main-menu ul
{
	list-style-type: none;
	margin-bottom: 20px;
}

#main-menu ul li
{
	float: left;
}

#main-menu ul li a:link,
#main-menu ul li a:visited
{
	display: block;
	height: 54px;
	line-height: 54px;
	float: left;
	margin-right: 24px;
	color: #514f40;
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
}

#main-menu ul li a:hover,
#main-menu ul li a:active,
#main-menu ul li a#menuHoverStyle
{
	color: #ffffff;
}   */




ul#menu a:hover
{
	color: #00e190;
}

ul#menu a#menu2HoverStyle
{
	color: #00e190;
}


#content
{
	margin-top: 25px;

}

/*--------------- cr?ation de la colonne de gauche ---------------*/
.bigSide
{
	width: 556px;
	float: right;  
}


.bigSide h1
{
	font-size: 1.3em;
	text-align: left;
	padding: 0;
	margin: 0;
	font-weight: normal;
}


.bigSide h2
{
	font-size: 1.1em;
	text-align: left;
	font-weight: bold;
}

#intro h2
{
	font-size: 1.3em;
	text-align: left;
	padding: 0;
	margin: 0 0 10px 0;
	font-weight: normal;
}

h3
{
	font-size: 1.2em;
	font-weight: bold;
	margin: 0 0 10px 0;
}



#intro
{
	margin: 0;
	padding: 20px;
}

#intro p
{
	color: #9b9b9b;
}


.legend { float: right; width: 140px;}
.legend h2 { margin: 0; }
.legend p { margin-bottom: 20px; }


/* deco de + d'infos */
p.plus-infos a:link, p.plus-infos a:visited
{
	display: block;
	height: 21px;
	font-size: 1em;
	font-weight: bold;
	color: #1d0e09;
	text-align: right;
	margin: 18px 0 0 0;
	padding-top: 4px;
	padding-right: 25px;
	background: url(arrow-title.gif) 0px no-repeat #48281d;
}

p.plus-infos a:hover, p.plus-infos a:active
{
	background-color: #f2d68f;
}

/* Bloc rowProduits */

#rowProduits
{
	padding: 0;
	margin: 10px 0 0 5px;
	color: #767676;
}


div#rowProduits div.rowProduitsArticle {
	float:left;
	margin:15px 0;
	padding:0 5px;
	width:275px;
}

div#rowProduits div.rowProduitsArticle img
{
        float: left;
	margin: 0 10px 5px 0;
	display: block;
}

div#rowProduits div.rowProduitsArticle a img 
{
	float: left;
	margin: 0 10px 5px 0;
	padding:2px;
	border:1px solid #767676;
	display: block;
}

div#rowProduits div.rowProduitsArticle h2,
div#rowProduits div.rowProduitsArticle  h2
{
	margin: 0;
	font-size: 1em;
	padding: 0;
	color: ##f9f9f9;
	padding-left: 25px;
}

div#rowProduits div.rowProduitsArticle h3
{
	margin: 5px 0 5px 0;
	font-size: 1em;
	padding: 0 0 0 5px;
	color: #767676;
	
}

div#rowProduits div.rowProduitsArticle p
{
	margin: 5px 0 0;
	padding: 0 0 0 5px;
	color: #FFFFFF;
}

div#rowProduits div.rowProduitsArticle a:link,
div#rowProduits div.rowProduitsArticle a:visited
{
	margin: 0;
	padding: 0;
	color: #1c7c95;
	height: 100px;
}

div#rowProduits div.rowProduitsArticle a:hover,
div#rowProduits div.rowProduitsArticle a:active
{
	margin: 0;
	padding: 0;
}

p.pretour{margin:10px 0;}

p.pretour,
p.psuite
{
	text-align: left;
}

p.pretour a:visited, p.pretour a:link,
p.psuite a:visited, p.psuite a:link
{
	text-align: right;
	font-size: 0.9em;
	text-decoration: none;
	margin-right: 5px;
	color: #1c7c95;
}

p.pretour a:hover, p.pretour a:active,
p.psuite a:hover, p.psuite a:active
{
	text-decoration: underline;
	color: #1c7c95;
}

/* Fin bloc rowProduits*/


/*     fiche     */


div#form
{
	margin: 10px;
}

div#form table{border-collapse:collapse;}
div#form table tr{}
div#form table tr td{padding:2px 0;vertical-align:middle;}

div#fiche
{
	margin: 0;
	padding: 10px;
}

div#fiche form
{
	width: 580px;
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
}

div#fiche h2
{
	padding: 5px 0;
	margin: 0 0 10px 0;
	font-size: 16px;
	font-weight: bold;
}

div#fiche h3
{
	font-size: 12px;
	padding: 0;
	margin: 0;
	text-indent: 0;
}

div#fiche img a
{
	border: none;
	margin: 0 10px 10px 0;
	float: left;
}

div#fiche img 
{
	border: none;
	margin: 0 10px 10px 0;
	float: left;
}

div#fiche h2+a img 
{
	border:1px solid #767676;
	padding:2px;
	width:auto;
}

div#fiche a img{width:110px;border:1px solid #767676;padding:2px;}

div#ficheLeft
{
	float: left;
	width: 232px;
	padding: 16px 0;
	margin: 0;
}

div#ficheeLeft img, 
div#ficheLeft a:link img,
div#ficheLeft a:visited img  
{
	display: block;
	margin: 0 auto;
	padding: 0;
}

div#ficheLeft a:hover img,
div#ficheLeft a:active img  
{
	border: 4px solid #5c1e0f;
}

div#ficheRight
{
	float: left;
	width: 340px;
	padding: 16px 0 0 6px;
	margin: 0;
}

div#ficheRight p.suite
{
	text-align: right;
}

div#ficheRight h3
{
	padding: 0;
	margin: 0 0 27px 0;
	font-size: 1.3em;
}


div#ficheRight h4 
{
	padding: 0;
	margin: 0;
}


div#ficheRight p 
{
	padding: 0;
	margin: 0 0 10px 0;
}


div#ficheRight p.description
{
	padding: 0;
	display: block;
	margin: 10px 0 0 0;
	text-decoration: none;
}
/*   fin fiche     */


table
{
	width: 100%;
	border-collapse: collapse;
}




/* deco du titre */
h2.produits-title
{
	font-size: 1.3em;
	font-weight: bold;
	color: #f2d68f;
	padding-left: 10px;
	padding-top: 10px;
	margin: 0 0 10px 0;
}

/*--------------- cr?ation de la colonne de droite ---------------*/
.littleSide
{
	width: 267px;
	float: left;
	padding: 0 0 0 21px;
	margin: 0;
}

.littleSide h2 {}

.littleSide p {padding-left: 8px;}

ul#bg-thumb {}

ul#bg-thumb li {
	border:1px solid #767676;
	float:left;
	height:113px;
	margin-bottom:4px;
	margin-right:4px;
	padding:2px;
	width:120px;
}

.ppuce
{
	background: url(puce.gif) 15px 5px no-repeat;
	margin-bottom: 20px;
}


#btn-ok
{
	width: 50px;
	height: 25px;
	background: url(btn-ok.gif) no-repeat;
	border: none;
	margin-left: 10px;
	margin-top: 4px;
	color: #f2d68f;
}


.pev
{
	margin-right: 4px;
}

.clear
{
	clear: both;
}

#footer-bottom
{
	height: 30px;
}


#footer-bottom a:link, #footer-bottom a:visited 
{
	color: #757575;
	text-decoration: none;
}

#footer-bottom a:hover, #footer-bottom a:active
{
	text-decoration: underline;
}

#footer-bottom ul { float: left; width: 330px; }
/*#footer-bottom ul li { float: left; padding-right: 10px; border-right: 1 px solid #52513f;} */
#footer-bottom ul li { float: left; padding-right: 10px; border-right: none;}

p#signature
{
	color: #757575;
	margin: 0;
	padding: 0;
	text-align: center;
}


ul#pageIndex
{
	list-style-type: none;
	margin: 20px 0 0 5px;
	padding: 0;
}

ul#pageIndex li
{
	float: left;
}

ul#pageIndex li a:link,
ul#pageIndex li a:visited
{
	display: block;
	float: left;
	height: 20px;
	margin: 10px 5px 10px 0;
	padding: 0px 5px;
	background: #8f8b7b;
	color: #515040;
	text-decoration: none;
	border: 1px solid #515040;
}

ul#pageIndex li a:hover,
ul#pageIndex li a:active
{
	background: #989686;
	color: #515040;
	text-decoration: none;
	border: 1px solid #989686;
}

ul#pageIndex li a:link.paginationHover,
ul#pageIndex li a:visited.paginationHover
{
	background: #989686;
	color: #515040;
	text-decoration: none;
	border: 1px solid #989686;
}

.captcha {
	border:1px solid #521800;
	background: none;
	padding:2px;
}


/**************   Livre or *****************/

#livreGauche
{


	
}

#livreGauche h2
{
	font-size: 1.3em;
	margin: 0 0 10px 0;
	padding: 0;
	
}

#livreGauche p
{
	margin: 0 0 5px 0;
	padding: 0;
	
}

#livreGauche input, #livreGauche textarea 
{
	margin: 0 0 10px 0;
	border: 1px solid #000000;
	width: 100%;
	
}

#livreGauche textarea 
{
	height: 150px;
	
}

#livreGauche input#oklivre
{
	margin: 0 auto 10px auto;
	border: 1px solid #000000;
	width: 30px;
	display: block
	
	
}

#website
{
	display: none;
}

#livreDroite
{
	margin: 0 0 0 0;
	padding: 0 0 0 10px;
}

div#livreDroite div.topComment
{
	margin: 0;
	padding: 0;
}

#livreDroite div#comment div.bottomComment
{
	margin: 0 0 10px 0;
	padding: 0;
	text-align: right;
	font-size: 11px;
	color: #999999;
	border-bottom: 1px solid #999999;
}

#livreDroite h3
{
	font-size: 1.1em;
	margin: 0 0 10px 0;
	padding: 0;
	
}

#livreDroite p
{
	margin: 0;
	padding: 0;
	
}

	      "
#bDefil
{
	padding: 0;
	margin: 0 0 20px 0;
}

ul#submenu { padding-left: 10px; margin-left: 12px; list-style-type: square;}

ul#submenu li { margin-bottom: 10px; }

ul#submenu li a:link, ul#submenu li a:visited { font-weight: bold; color: #514f40; }

ul#submenu li a:hover, ul#submenu li a:active, ul#submenu li a.subactive { color: #ffffff; }

table#divers h2 { padding-left: 30px;}

table#divers td.divers-first  {padding: 0 26px 0 12px; width: 170px; }

table#divers td.divers-td  { padding: 0 26px; }

table#divers td p  { padding-left: 28px; margin-bottom: 11px; }

table#divers td p.puce  { background: url('puce-grey.gif') 23px 8px no-repeat; }

table#divers td p span { color: #1574a0; }

table#divers td a:link, table#divers td a:visited { 
	color: #1574a0; 
	background: url('puce-blue.gif')  left  no-repeat;
	text-decoration: underline;
	padding-left: 3px;
}

table#divers td a:hover, table#divers td a:active { 
	text-decoration: none;
}


#s3slider {
   clear: both;  height: 230px;
   width: 556px;
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 536px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 10px; /* important */
   margin-top: 10px;
   background: #807c7a;
}
#s3sliderContent li{
	height:273px;
	overflow:hidden;
}

#s3sliderContent div{
	background-color:#000000;
	bottom:110px;
	font-size:18px;
	height:30px;
	left:0;
	padding:10px;
	position:relative;
	width:516px;
	filter : alpha(opacity=50);
    -moz-opacity : 0.5;
    opacity : 0.5; 
}
#s3sliderContent div+p{
	font-weight:bold;
	text-transform:uppercase;
	font-size:16px;
	bottom:145px;
	color:#FFFFFF;
	left:20px;
	position:relative;
	filter : alpha(opacity=100);
    -moz-opacity : 1;
    opacity : 1; 
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage img {
   border: none;
   height:273px;
	overflow:hidden;
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 374px;
   background: transparent;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

#cache { 
   height: 230px;
   background: url('diaporama-cadre.png');
   width: 556px;
   position: absolute; /* important */
   overflow: hidden;
   z-index: 10; 
   margin-top: -230px;
}

/*#main-menu a{color:#1C5171;display:block;height:100%;width:100%;border-bottom:1px solid #D3D3D3;}
/*#main-menu a:hover{text-decoration:underline;}
/*#main-menu>ul>li{float:left;line-height:50px;height:50px;text-align:center;cursor:pointer;width:93px;}
/*#main-menu>ul>li>a{border-bottom:none;}
/*#main-menu ul ul {display: none; position: absolute; left: 0px; top: 54px; margin:0px; padding: 0px; border: 1px solid grey;}
/*#main-menu ul ul li{height:20px;line-height:20px;text-align:left;/* width: 93px;*/
/*#main-menu li {list-style-type: none; position: relative;width:125px;background-color: #E0E0E0; padding: 2px 2px 2px 5px; margin: 0px}
#main-menu li:hover {background-color: #BDD9EF;}
#main-menu li:hover ul.niveau2, li li:hover ul.niveau3 {display: block;}
/*#main-menu li.plus {background-position:right; background-image: url(illustrations/fdroite.gif); background-repeat: no-repeat; border-bottom: 1px solid grey;}*/







/* 2 niveaux de menu */
div#main-menu a{color:#fcfcfc;}
div#main-menu a:hover{color:#fcfcfc;}
div#main-menu ul ul {display: none; position: absolute; left: 0px; top: 32px; margin:0px; padding: 0px; border: 1px solid grey;background-color: #2a2a2a;}
div#main-menu li {list-style-type: none; position: relative; width: 80px;height:25px;padding: 2px; margin: 0px;float:left;color:#A9A9A9;text-align:center;}
div#main-menu li.big{width: 170px;}
div#main-menu li a{display:block; width: 80px;height:30px;padding: 2px;}
div#main-menu li.big a{width: 170px;}
div#main-menu li ul li{width: 220px;text-align:left;height:25px;padding:0 5px;line-height:25px;}
div#main-menu li ul li a,
div#main-menu li.big ul li a{width: 220px;height:25px;padding:0 5px;} /* les li du sous-menu */
div#main-menu li:hover {background-color: #277792;}
div#main-menu li:hover ul.niveau2{display: block;z-index:50;}