body *{
	margin: 0px;
	padding: 0px;
}

#logo-reflexe{
	display: block;
	width: 50px;
	height: 22px;
	margin: 4px auto 0px auto;
	background: url(http://www.reflexe-internet.com/IMG/structure/logo_small.jpg);
}

#logo-reflexe span{
	display: none;
}

body{
    /* La taille de base sera de 10px avec les valeurs par défaut de police du navigateur */
    /*font: 0.72em Verdana, Geneva, Arial, Helvetica, sans-serif;*/
    font: 0.82em Verdana, Geneva, Arial, Helvetica, sans-serif;
    background-color: #000;
    color: #FFF;
    margin: 0px;
    /*padding: 0px auto 0px auto;*/
}

body .clearfix:after{
    content: "."; 
    display: block; 
    height: 0px; 
    clear: both; 
    visibility: hidden;
    overflow:hidden;
}

body #conteneur .clearfix{
	display: inline;
	font-size: 0px;
}

/* Hides from IE-mac \*/
* html body #conteneur .clearfix{height: 0px; font-size: 0px;}
body #conteneur .clearfix{
	display: block; 
	font-size: 0px;
}
/* End hide from IE-mac */

HTML{
    font-size: 100%;    
}

input, select, textarea{
    font-size: 100%;
}

h1{
    /* Par défaut, ce texte s'affichera à 20px */
    font: 2em/1em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

h2{
    /* Par défaut, ce texte s'affichera à 15px */
    font: 1.5em/1em Arial, Helvetica, sans-serif;
}

h3{
    /* Par défaut, ce texte s'affichera à 12px */
    font: bold 1.2em/1em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

p{
	line-height: 1.3em;
	margin-bottom: 0.7em;
	
}

a{
	color: #FFF;
}

fieldset.hidden{
	display: none;
}

#modalOverlay {
  background-color:#000;
  cursor:wait;
}

#modalContainer {
  width:350px;
  left:50%;
  top:15%;
  margin-left:-175px; /* half the width, to center */
  background-color:#fff;
  border:3px solid #ccc;
  color: #000;
}

#modalContainer *{
	color: #000;
}

#modalContainer p{
	text-align: center;
}

#modalContainer .boutons{
	float: left;
	width: 100%;
	margin: 0px 0px 5px 0px;
}

#modalContainer .boutons a{
	display: inline;
	float: left;
	margin: 0px 0px 0px 5px;
	width: 150px;
	height: 22px;
}

#modalContainer .boutons a span{
	display: none;
}

#modalContainer .boutons #btn-retour{
	background: url(../IMG/habillage/btn_retour.png) left top no-repeat;
}

#modalContainer .boutons #btn-panier{
	width: 182px;
	background: url(../IMG/habillage/btn_panier.png) left top no-repeat;
}

#modalContainer a.modalCloseImg {
  	background:url(../IMG/habillage/close_icon.gif) no-repeat;
  	width:25px;
  	height:29px;
  	display:inline;
  	z-index:3200;
	position:absolute;
	top:2px;
	right: -8px;
	cursor:pointer;
	display: none;
}

#modalContainer #popup *{
	text-align: left;
}

/* ---------------------------------------------------------------- structure des pages */
#conteneur{
	position: relative;
	max-width: 948px;
	margin: 30px auto 0px auto;
	overflow: hidden;
}

#header{
	height: 64px;
}

#header img{
	border: none;
}

#header p{
	width: 500px;
	text-align: right;
	margin: 0 !important;
	color: #FFF;
}


#index-links{
	max-width: 948px;
	margin: 0px auto 0px auto;
	padding-left: 2px;
	font-size: 0.9em;
}

#index-links a{
	color: #CCC;
}

/* comme pas d'attribut max-width sous IE, implémentation en javascript,
ici, dimensions "safe" pour que ça passe en 1024 x 768 */
* html #index-links,
* html #conteneur{
	width: 948px;
}

#conteneur-gauche{
	display: inline;
	float: left;
	width: 170px;
	float: left;
	padding: 25px 0px 0px 10px;
}

#conteneur-gauche strong.titre{
	float: left;
	margin: 0px 0px 5px 0px;
}

#conteneur-gauche object{
	position: relative;
	top: -40px;
	left: -20px;
	overflow: hidden;
}

#conteneur-gauche object img{
	position: absolute;
	top: 80px;
	left: 70px;
	border: none;
}


#conteneur-page{
	width: 100%;
	/*background-color: #FFF;*/
	background: #8D0036 url(../IMG/habillage/bg_conteneur.jpg) right bottom no-repeat;
}

#header-bg{
	height: 30px;
	background-color: #000;
}

/* dépasse mais on s'en fout */
#conteneur-exterieur-page{
	float: right;
	width: 80%;
	height: 100%;
	
}

/* fixe le padding pour la page */
#conteneur-interieur-page{
	padding: 0px 20px 10px 30px;
	
}

#contenu-page{
	float: left;
	width: 99%;
	height: 480px;
	clear: both;
	position: relative;
	overflow: auto;
	scrollbar-3dlight-color:;
	scrollbar-arrow-color:#000;
	scrollbar-face-color:#8E0038;
	scrollbar-highlight-color:#8E0038;
	padding-top: 10px;
}

/* -------------------------------------------------------------- navigation-principale */
#navigation-principale{
	position: absolute;
	top: 62px;
	border: 1px solid #000; /* si non spécifié, ne fonctionne pas sous IE6 */
	height: 20px; /* si non spécifié, ne fonctionne pas sous IE6 */
	padding-top: 10px;
}

#navigation-principale a{
	font-size: 0.95em;
	text-decoration: none;
	font-weight: bold;
	color: #CD0164;
}

#navigation-principale a:hover{
	color: #FFF;
}

#navigation-principale h2{
	display: none;
}


#navigation-principale dl{
	float: left;
	position: relative;
}

#navigation-principale dt{
	margin: 0px 0.2em 0px 0.2em;
}

#navigation-principale dt a{
	padding: 0px 0.5em 0px 0.5em;
}

#navigation-principale dl.en-cours dt a,
#navigation-principale dl.en-cours dd ul li.en-cours a{
	color: #FFF;
}

#navigation-principale dd{
	position: absolute;
	top: 0px;
	left: 5px;
	display: none;
	padding: 18px 0px 0px 0px;
}

#navigation-principale dl.en-cours dd{
	display: block;
}

#navigation-principale ul{
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style: none;
	background-color: #000;
}

#navigation-principale ul li{
	padding: 0px 0px 0px 0px;
	border: 1px solid #000;
}

#navigation-principale ul li a{
	display: block;	
	padding: 2px 5px 2px 5px; /* permet que la surface des liens empêche un mouseout intempestif */
	white-space: nowrap;
}

#titre-secteur span,
#titre-secteur{
	display: none; /* spécifié en Javascript, si pas de javascript, élément pas indispensable */
}

#pied{
	/*float: left;*/
	width: 100%;
	height: 20px;
	line-height: 10px;
	text-align: right;
}

#pied #marqueur-xiti{
	margin: 0px 2px 0px 0px;
}
#pied #marqueur-xiti img{
	position: relative;
	top: 6px;
}


#logo-reflexe{
	display: none;
	float: left;
	display: block;
	width: 50px;
	height: 20px;
	margin: 1px 0px 0px 0px;
	background: url(http://www.reflexe-internet.com/IMG/structure/logo_small.png);
}

#logo-reflexe span{
	display: none;
}

#pied #bot-nav{
	/*float: right;*/
}

/* ----------------------------------------------------------------------- page accueil */
body#index #articles-accueil .article-accueil{
	float: left;
	display: inline;
	width: 180px;
	height: 228px;
	margin-right: 10px;
	padding: 245px 0px 0px 0px;
	position: relative;
	background-color: #000;
}

body#index #articles-accueil .article-accueil .illustrations{
	margin: 0px !important;
	padding: 0px !important;
	position: absolute;
	display: inline;
	top: 4px;
	left: 4px;
	width: 170px;
	height: 245px;
	overflow: hidden;
}

body#index #articles-accueil .article-accueil .illustrations img{
	border: none;
}

* html body#index #articles-accueil .article-accueil .illustrations{
	left: 6px;
}

body#index #articles-accueil .article-accueil h2{
	padding: 8px 8px 0px 24px;
	margin: 0px !important;
	border: 1px solid #000;
	font-size: medium;
	background: url(../IMG/habillage/bg_secteurs_accueil.gif) left 4px no-repeat;
}

body#index #articles-accueil .article-accueil h2 a{
	display: block;
	width: 150px;
	height: 30px;
	background-position: 0px -10px !important;
	background-repeat: no-repeat;
}

body#index #articles-accueil .article-accueil .texte{
	padding: 0em 0.5em 0em 0.5em;
	height: 13em;
}

body#index #anim-vagues{
	float: left;
	display: none;
}

#liens-sommaire{
	position: relative;
	top: -15px;
	width: 80%;
}

/* ------------------------------------------------------------------ contenu des pages */
#contenu-page h1{
	height: 2.2em;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: relative;
	left: -10px;
}

#contenu-page h1 span{
	/* masqué en Javascript */
}


/* --------------------------------------------------------------- contenu des articles */
#contenu-page #contenu-article{
	padding: 0px 0px 0px 0px;
	position: relative;
}

#contenu-page #contenu-article #sous-titre-article{
	font-size: 1.3em;
	font-weight: bold;
	font-style: italic;
}

#contenu-page #contenu-article #chapeau{
	font-style: italic;
}

#contenu-page #contenu-article p.logo{
	float: right;
	position: relative;
	top: -50px;
	right: 0px;
	margin: 0px 0px 10px 10px;
	text-align: right;
}


#contenu-page #contenu-article p.logo img{
	border: 1px solid #FFF;
}

#contenu-page #contenu-article #ps-article p{
	font-style: italic;
}

#contenu-page #contenu-article a{
	font-weight: bold;
}

#contenu-page #contenu-article p{
	clear: left;
}

#contenu-page #contenu-article h3{
	clear: left;
	margin: 0.3em 0em 0.5em 0em;
	font-weight: bold;
	font: bold 1.2em/1em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#contenu-page #contenu-article ol,
#contenu-page #contenu-article ul{
	padding-left: 30px;
	margin-bottom: 1.2em;
}


#contenu-page #contenu-article .spip_documents{
	margin-bottom: 15px;
	overflow: hide;
}

#contenu-page #contenu-article .spip_documents *{
	text-align: center;
}

#contenu-page #contenu-article .spip_documents img{
	border: 1px solid #FFF;
}

#contenu-page #contenu-article .spip_documents_left{
	float: left;
	margin-right: 15px;
}


#contenu-page #contenu-article .spip_documents_center{
	float: left;
	clear: left;
	width: 100%;
	text-align: center;
}

#contenu-page #contenu-article .spip_documents_right{
	float: right;
	margin-left: 15px;
}


/* ------------------------------------------------------------------------ collections */
body#body-secteur-1 #vignettes{
	float: left;
	display: inline;
	width: 145px;
	margin: 0px 0px 0px 0px;
	padding: 0px !important;
	list-style: none;
}

body#body-secteur-1 #vignettes li{
	position: relative;
	float: left;
	display: inline;
	width: 60px;
	height: 40px;	
	line-height: 122px;	
	margin: 0px 10px 10px 0px;
	background-color: #000;
	border: 1px solid #FFF;
}

/* marge supérieure négative mise en place dans le js */
body#body-secteur-1 #vignettes li img{
	position: absolute;
	top: 50%;
	left: 50%;
	border: none;
}

body#body-secteur-1 #bloc-illustration{
	float: left;
	width: 300px;
	padding: 0px 0px 0px 0px;
	margin: 0px 10px 0px 0px;
}

body#body-secteur-1 #bloc-illustration #bloc-zoom{
	position: relative;
	float: left;
	width: 300px;
	height: 200px;
	background-color: #000;
}

body#body-secteur-1 #bloc-illustration #bloc-zoom img{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: 0px 0px 0px 0px;
	display: none;
	border: none;
}

/* vignettes */
body#body-secteur-1 #bloc-illustration ul{
	float: left;
	margin: 5px 0px 0px 0px;
}

body#body-secteur-1 #bloc-illustration ul li{
	position: relative;
	display: inline;
	float: left;
	width: 60px;
	height: 40px;
	margin: 0px 5px 0px 0px;
	background-color: #000;
	border: 1px solid #FFF;
	
}

body#body-secteur-1 #bloc-illustration ul li img{
	position: absolute;
	top: 50%;
	left: 50%;
	border: none;
}

body#body-secteur-1 #bloc-illustration #copyright{
	margin: 5px 0px 0px 0px;
	float: left;
	clear: both;
	font-style: italic;
	font-size: 0.9em;
}

body#body-secteur-1 #contenu-page #contenu-article .spip_documents_left{
	/*height: 135px !important;*/
}

body#body-secteur-1 #contenu-page #contenu-article .spip_documents_left img{
	/*height: 135px !important;*/
}

/* 
affichage de la liste des rubrique, visible éventuellement par les utilisateurs
et de la liste des articles d'une rubrique avec comme mode de présentation "liste"	
*/
#contenu-page #liste-articles,
#contenu-page #liste-sous-rubriques{
	float: left;
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin-bottom: 10px;
}

#contenu-page #liste-articles dt,
#contenu-page #liste-sous-rubriques dt{
	float: left;
	clear: left;
	font: bold 1.2em/1em Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0em 0em 0em 0em;
	height: 32px;
	width: 100%;
	background-repeat: no-repeat;
	background-position: left top;
}

#contenu-page #liste-sous-rubriques dt{
	font-size: 0.9em;
}

#contenu-page #liste-sous-rubriques dd,
#contenu-page #liste-articles dd{
	position: relative;
	float: left;
	clear: left;
	width: 99%;
	padding: 0 0 0 1%;
	margin-bottom: 20px;
}

#contenu-page #liste-articles dd{
	background: url(../IMG/habillage/dotted.gif) left bottom repeat-x;
}

#contenu-page #liste-articles dd .spip_logos{
	float: right;
	position: relative;
	top: -30px;
	margin-bottom: -30px;
	right: 1em;
	margin: 0px 0px -20px 20px;
	border: 1px solid #FFF;
}

#contenu-page #liste-articles dd span.sous-titre{
	display: block;
	font-weight: bold;
	font-style: italic;
	padding-bottom: 0.5em;
}

#contenu-page #liste-articles dd span.descriptif{
	display: block;
	margin-bottom: 0.5em;
}

#contenu-page .pagination{
	float: left;
	clear: left;
	white-space: nowrap;
}

/* ------------------------------------------------------------------ fiches techniques */
#bg-menu{
	position: absolute;
	top: 170px;
	left: 20px;
	width: 146px;
	height: 385px;
	background-color: #000;
	border: 2px solid black;
	filter:alpha(opacity=50);
	opacity: 0.8;
	-moz-opacity:0.8;
}

#conteneur-menu-vignettes{
	position: absolute;
	top: 170px;
	left: 20px;
	width: 144px;
	overflow: hidden;
	height: 385px;
}

.menu-g-vignettes{
	height: 460px;
	float: left;
	display: inline;	
	margin: 0px 0px 0px 0px;
	padding: 4px 0px 4px 4px !important;
	list-style: none;
}

.menu-g-vignettes li{
	float: left;
	display: inline;
	width: 60px;
	height: 60px;	
	margin: 0px 10px 10px 0px;
	padding: 5px 0px 0px 0px;
	background-color: #000;
	border: 1px solid #FFF;
	text-align: center;
	-moz-opacity: 2;
}

/* marge supérieure négative mise en place dans le js */
.menu-g-vignettes li img{
	border: none;
}

#menu-fiches-techniques{
	margin: 0px 0px 10px 0px;
}

#menu-fiches-techniques a.panier{
	padding-right: 28px !important;
	background: url(../IMG/habillage/shopping_basket.png) right top no-repeat !important;
}
	
.fiches-techniques #liste-fiches{
	float: left;
	list-style: none;
}

.fiches-techniques #liste-fiches li{
	float: left;
	width: 218px;
	height: 160px;
	margin: 0px 10px 0px 0px;
}

.fiches-techniques #liste-fiches li h3{
	height: 30px;
	font-size: 1em;
	padding: 2px 4px 2px 4px;
	margin: 0px 0px 4px 0px;
	background-color: #000;
	text-align: center;
}

.fiches-techniques #liste-fiches li .img-bloc{
	float: left;
	width: 100px;
	height: 100px;
	text-align: center;
}

.fiches-techniques #liste-fiches li img{
	margin: 0px auto;
}

.fiches-techniques #liste-fiches li .bloc-desc{
	margin: 0px 0px 0px 105px;
}


body.fiches-techniques .navigation-pages{
	margin: -10px 0px 0px 0px;
	float: left;
	width: 95%;
}

body.fiches-techniques .navigation-pages .contenu-navigation-pages{
	float: right;
}

/* détail d'une fiche */
.fiche-technique #contenu-page *{
	
}

#bloc-logo-fiche{
	float: left;
	margin: 10px 10px 0px 0px;
}

.fiche-technique #contenu-article{
	float: left;
	width: 420px;
	margin: 10px 0px 0px 0px;
}

.fiche-technique #contenu-article .lien-commander{
	display: block;
	width: 150px;
	height: 22px;
	
	background: url(../IMG/habillage/btn_ajout_panier.png) left top no-repeat;
}

.fiche-technique #contenu-article .lien-commander span{
	display: none;
	border: 1px solid #000;
}

/* -------------------------------------------------------------------- étapes commande */
#nav-etapes-commande{
	float: left;
	width: 100%;
	margin: 0px 0px 10px 0px;
	
}

#nav-etapes-commande div.etape{
	display: inline;
	float: left;
	text-align: center;
	margin: 0px 50px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #EEE;
	text-align: center;
}

/* numéro d'étape */
#nav-etapes-commande div.etape div.num-etape,
#nav-etapes-commande div.etape .num-etape a{
	color: #999;
}

#nav-etapes-commande div.etape div.num-etape{
	height: 30px;
	line-height: 25px;
	padding: 0px 10px 0px 10px;
	background: url(../IMG/habillage/bg_etapes.gif) center top no-repeat;
}

#nav-etapes-commande div.etape div.lib-etape{
	display: block;
	color: #FFF;
}




#nav-etapes-commande div.etape div a{
	color: #999;
}

#nav-etapes-commande .courante{
	font-weight: bold;
	color: #FFF;
}

#nav-etapes-commande .courante div.num-etape{
	color: #8D011C !important;
}


/* ----------------------------------------------------------------------------- panier */

#contenu-panier table{
	width: 98%;
	border-collapse: collapse;
	margin: 0px 0px 0px 10px;
}

#contenu-panier table th,
#contenu-panier table td{
	padding: 1px 2px 1px 2px;
	text-align: left;
	border: 1px solid #000;
}

#contenu-panier table th.prix,
#contenu-panier table th.qte{
	text-align: center;
}

#contenu-panier table td.qte{
	text-align: center;
}

#contenu-panier table td.prix{
	text-align: right;
	padding-right: 15px;
}

#contenu-panier table tr.total td{
	text-align: right;
	padding-right: 15px;
	font-weight: bold;
}

#actions-paiement div *{
	float: left;
}

#actions-paiement div fieldset{
	border: none;
}

/* --------------------------------------------------------- formulaire commande chèque */
#frm-commande-cheque{
	width: 500px;
	margin: 0px 0px 15px 0px;
}

#frm-commande-cheque #checkbox-row-conditions label{
	height: 40px;
}

#frm-commande-cheque .barre-boutons a img{
	position: relative !important;
	top: 0px !important;
}

/* --------------------------------------------------------------------------- paiement */
#body-secteur-26 #texte img{
	margin: 0px 5px 0px 0px;
	border: none;
	position: relative;
	top: 5px;	
}

#barre-choix-paiement .moyen-paiement{
	margin: 0px 0px 0px 0px;
}

#barre-choix-paiement .moyen-paiement form{
	text-align: right;
}

#moyen-paiement-paypal .descriptif-moyen-paiement{
	padding: 0px 0px 0px 130px;
	height: 100px;
	background: url(../IMG/habillage/paiement_paypal.png) left top no-repeat;
}

#moyen-paiement-paypal form{
	position: relative;
	top: -60px;
}


/* ------------------------------------------------------------------------------ liens */
body#body-secteur-14 #contenu-article{
	margin-left: 10px;
}

body#body-secteur-14 #contenu-article ul,
body#body-secteur-14 #contenu-page dl{
	float: left;
	margin: 0px 10px 10px 10px;
}

body#body-secteur-14 #contenu-page dl dt{
	clear: left;
	font-weight: bold;
}

body#body-secteur-14 #contenu-page dl dd{
	float: left;
	clear: left;
	margin: 5px 5px 15px 5px;
}

body#body-secteur-14 #contenu-page dl dd img{
	float: left;
	margin: 0px 4px 4px 0px;
	border: 1px solid #CCC;
}

body#body-secteur-14 #contenu-page #liens-annuaires{
	float: left;
}

body#body-secteur-14 #contenu-page #liens-annuaires p{
	/*float: left;
	clear: left;*/
	margin: 0px 0px 4px 15px;
}

body#body-secteur-14 #nav-gauche{
	float: left;
	width: 140px;
}

body#body-secteur-14 #nav-gauche *{
	
}

body#body-secteur-14 #nav-gauche a{
	display: block;
	padding: 3px 4px 0px 4px;
	border: 1px solid #FFF;
}

body#body-secteur-14 ul{
	list-style: none;
}

body#body-secteur-14 #contenu-article{
	float: right;
	width: 530px;
}

body#body-secteur-14 #contenu-article #lien-thumbshots{
	clear: both;
	text-align: right;
}

body#body-secteur-14 #contenu-article #lien-thumbshots a{
	color: #800000;
	font-size: 0.9em;
}

/* --------------------------------------------------------------------- nous contacter */

body#body-secteur-16 .formulaire_ecrire_auteur fieldset{
	display: inline;
	float: left;
	width: 450px;
	margin: 0px 0px 10px 0px;
	padding: 4px 4px 0px 4px;
	border: 1px solid #FFF;
}

body#body-secteur-16 .formulaire_ecrire_auteur fieldset *{
	font-size: 100%;
}

body#body-secteur-16 .formulaire_ecrire_auteur legend{
	display: none;
}

body#body-secteur-16 .formulaire_ecrire_auteur p,
body#body-secteur-16 .formulaire_ecrire_auteur .spip_bouton{
	width: 100%;
	float: left;
	width: 100%;
}

.formulaire_ecrire_auteur label{
	float: left;
	clear: left;
}

.formulaire_ecrire_auteur  p input,
.formulaire_ecrire_auteur  .spip_bouton input{
	float: right;
	width: 250px;
	border: 1px solid #666;
}

.formulaire_ecrire_auteur  p textarea{
	float: left;
	clear: both;
	width: 447px;
	border: 1px solid #666;
}

body#body-secteur-16 .formulaire_ecrire_auteur .spip_bouton{
	text-align: right;	
}

body#body-secteur-16 .formulaire_ecrire_auteur .spip_bouton *{
	color: #000000 !important;
}

body#body-secteur-16 .formulaire_ecrire_auteur .spip_bouton input{
	width: 140px;
}
