/* CSS Document */
/**
 *************************************************************************************************************************
 * STRUCTURE DU SITE
 *************************************************************************************************************************
*/ 

html {
 width:100%;
 height:100%;
}
body {
        
        
	background-color:#fff;
	margin:0px;
	padding:0;
	background-image:url(../images/fd_cozyn2.gif);
	background-repeat:no-repeat;
	/* background-position:40% 55%; */
        background-position:50% 50%;
	font-family:verdana, arial;
	font-size:11px;
/* *************** SCROLL BAR ************* */
scrollbar-3dlight-color :#fff;
scrollbar-arrow-color : #fff;
scrollbar-base-color :#fff;
scrollbar-darkshadow-color :#fff;
scrollbar-face-color : #a0c07c;
scrollbar-highlight-color : #fff;
scrollbar-shadow-color : #fff;
scrollbar-track-color :#fff;
/* **************************************** */
}

body.contentpane {       
        width:350px;
	background-color:transparent;
	margin:0px;
	padding:0;
	background-image:none;
	font-family:verdana, arial;
	font-size:11px;
/* *************** SCROLL BAR ************* */
scrollbar-3dlight-color :#fff;
scrollbar-arrow-color : #fff;
scrollbar-base-color :#fff;
scrollbar-darkshadow-color :#fff;
scrollbar-face-color : #a0c07c;
scrollbar-highlight-color : #fff;
scrollbar-shadow-color : #fff;
scrollbar-track-color :#fff;
/* **************************************** */
}



#page {
	margin:auto;
	overflow:visible;
        width:990px;
        /* height:510px; */
}

#logo {
	width:957px;
	height:118px;
	background-image:url(../images/logo.gif);
	background-repeat:no-repeat;
	left:0px;
	top:0px;
	z-index:20;
}

#milieu {
	/* height:347px; */
        height:357px;
	/* position:absolute;
	top:93px;
	left:0px; */
        margin-top:-35px;
	z-index:15;	
}

#repere {
	
}

#familles {
	width:100px;
	/* height:312px; */
       height:332px;
	/* position:absolute;
	left:10px;
	top:0px; */
        float:left;
	z-index:17;
	padding:17px 5px 0px 5px;
        /* border-right:15px solid #fff; */
}
#drag {
  width:1px;
}

#vignettes_categories {
	/* width:355px; */
        /* width:333px; */
        width:365px;
        /* margin-right:22px; */ 
	height:332px;
	/* position:absolute;
	left:109px;
	top:0px; */
        float:left;
	z-index:12;
	overflow:hidden;
	/* padding:35px 5px 0px 5px;  */
        padding:35px 0px 0px 0px;   
}

#mousemove, #mousemove_1, #mousemove_2, #mousemove_3, #mousemove_4 {
        width:318px;
        float:left;
	z-index:12;
	overflow:hidden;
        padding:0px 10px 0px 10px;
}


#mousemove:hover, #mousemove_1:hover, #mousemove_2:hover, #mousemove_3:hover, #mousemove_4:hover {
        width:318px; 
        float:left;
	z-index:12;
	overflow:hidden;
        /* background-color:#ccff00; */
        /* background-image:url(../images/fleches_survol.gif);
        background-repeat:no-repeat;
        background-position: 0px 30px; */
padding:0px 10px 0px 10px;
}


/* ****************** FLECHES AU SURVOL DES MENUS VIGNETTES ******************** */
#survol_1, #survol_2, #survol_3, #survol_4 {
        background-image:none;
        height:22px;
        width:355px;
        position:absolute;
        margin-top:25px;
        margin-left:-14px;
}
#survol_1:hover, #survol_2:hover, #survol_3:hover, #survol_4:hover {
        background-image:url(../images/fleches_survol.gif);
        height:22px;
        width:355px;
        position:absolute;
        margin-top:25px;
        margin-left:-14px;
}




div.inside_1, div.inside_3, div.inside {
	/* width:650px; */
        /* margin-left:5px;  
	float:left;   */   
}
div.inside_2, div.inside_4 {
	/* width:100%; */
        /* margin-left:5px;  
	float:left; */     
}


#contenu {
	height:330px;
        width:456px;
	background-image:url(../images/fd_contenu.png);
	background-repeat:no-repeat;
	background-position:0px 0px;

padding-right:4px;
	margin-top:16px; 
        float:left;
	z-index:17;
	padding:17px 0px 0px 25px;        
        overflow-y:auto;
        overflow-x:hidden;
}
#contenu div, #contenu span, #contenu table {
       max-width:450px;
}

#ancre {

}

#bas {
	width:980px;
	height:100px;
        margin-top:20px;
	background-image:url(../images/fd_bas.png);
	background-repeat:no-repeat;
        background-position:10px 0px;
	/* position:absolute;
	left:0px;
	top:440px; */
}

#footer {

}


#footer, #footer a:link, #footer a:visited {
	color:#fff;
	text-decoration:none;
}
#footer a:hover, #footer a:active{
	color:#fff;
	text-decoration:underline;
}


/**
 *************************************************************************************************************************
 * STYLES JOOMLA 
 *************************************************************************************************************************
*/ 

/*
 ****************************
 * Menus
 ****************************
 */

 /** 
 * Style du menu
 * ------------------- 
 * Vous pouvez contrôler l'apparence et la disposition du menu principal 
 * en utilisant les paramètres CSS suivant 
 */ 
/* ****************** MENU DECO ************************* */
.inside ul, .inside_1 ul, .inside_2 ul, .inside_3 ul, .inside_4 ul {
    clear:left;
}
.inside ul li, .inside_1 ul li, .inside_2 ul li, .inside_3 ul li, .inside_4 ul li {
    float:left;
    margin:0px 2px 0px 0px;
    padding:0px;
}

/* Menu classique ********************************************************/
a.mainlevel:link, a.mainlevel:visited {
	/* niveau 1 du menu à l'état normal ou visité */
	text-transform:uppercase;
	display:block;
	height:20px;
        color:#fff;

        font-weight:bold;
}
a.mainlevel:hover {
	/* niveau 1 du menu à l'état survolé */
	text-transform:uppercase;
	display:block;
	height:20px;
        color:#ccc;
        font-weight:bold;
}

/* Sous MEnu *************************************************************/
a.sublevel:link, a.sublevel:visited {
	/* niveau 2 du menu à l'état normal ou visité */
        color:#fff;
	text-decoration: none;
}
a.sublevel:hover {
	/* niveau 2 du menu à l'état survolé */
        color:#fff;
        font-weight:normal;
	text-decoration: underline;
}

/* Actifs ***************************************************************/
#active_menu {
	font-weight: bold;
}
a#active_menu:hover {
	
}

/* Menu horizontal ********************************************************/
ul#mainlevel-nav {
	list-style:none;
	list-type:none;
         width:100%;
}
ul#mainlevel-nav li {
	display:block;
	float:left;
	margin-right:0px;
}
ul#mainlevel-nav li a:link, ul#mainlevel-nav li a:visited {
	color:#333;
	font-weight:bold;
	text-decoration:none;
         background-color:#eee;
         display:block;
         padding:5px;
         border-bottom:2px solid #ccc;
}
ul#mainlevel-nav li a:hover, ul#mainlevel-nav li a:active {
	color:#330000;
	font-weight:bold;
	text-decoration:none;
        background-color:#ccc;
         display:block;
         padding:5px;
         border-bottom:2px solid #ccc;
}

/*
 **************************************
 MENU INFOS GENERALES (ROSE)
 **************************************
*/
ul#menuinfosgénérales_level0 {
  float:left;
  margin-top:3px;
  margin-left:15px;
}

ul#menuinfosgénérales_level0 li {
  display:block;
  float:left;
  padding-top: 20px;
  margin: 0px 0px 0px 4px;
  background-image:url(../images/bt_men_rose.gif);
  background-repeat: no-repeat;
  background-position: 25% 4px;
  text-decoration: none;
}
ul#menuinfosgénérales_level0 li a:link, ul#menuinfosgénérales_level0 li a:visited {
    color:#444;
    text-decoration: none;
}
ul#menuinfosgénérales_level0 li a:hover, ul#menuinfosgénérales_level0 li a:active{
    color:#f88bf3;
    text-decoration: underline;
}

/*
 **************************************
 MENU USER (VERT)
 **************************************
*/
ul#menuachat_level0 {
  margin-left:80px;
  float:left;
  margin-top:3px;
}

ul#menuachat_level0 li {
  float:left;
  display:block;
  padding-top: 20px;
  margin: 0px 0px 0px 4px;
  background-image:url(../images/bt_men_vert.gif);
  background-repeat: no-repeat;
  background-position: 25% 4px;
  text-decoration: none;
}

ul#menuachat_level0 li a:link, ul#menuachat_level0 li a:visited {
    color:#444;
    text-decoration: none;
}
ul#menuachat_level0 li a:hover, ul#menuachat_level0 li a:active {
    color:#9fbf7c;
    text-decoration: underline;
}


/*
 ****************************
 * Divers navigation
 ****************************
 */
/* Bouton retour ********************************/
.back_button {
  font-size: 11px;
  font-weight: bold;
  margin-top: 5px;
   display:block;
  /* margin-left: 15px; */
  width: 97%;
  text-align:center;
  clear:left;
  /* padding: 4px; */
}
a.back_button:link, a.back_button:visited{
  font-size: 11px;
  font-weight: bold;
  margin-top: 15px;
  margin-bottom: 10px;
  width: 40px;
  padding: 4px;
  color:#444;
}
a.back_button:link, a.back_button:visited{
  font-size: 11px;
  font-weight: bold;
  margin-top: 15px;
  margin-bottom: 10px;
  width: 40px;
  padding: 4px;
  color:#333;
}
/* << Premier < Précédent 1 Suivant > Dernier >> */
.pagenavbar {} /* il n’est pas utilisé dans la page nav bar mais pour l’affichage des noms sur le forum Simple Board? */
.pagenav {
	font-weight: normal;
	font-size: 11px;
} 
a.pagenav, a.pagenav:visited {
	font-weight: bold;
	color:#666;
}
a.pagenav:hover {
	font-weight: bold;
	color: #993366;
} 
a.pagenav img {
	border:0px;
} 


.precedent {
   width:49%;
   text-align:left;
   float:left;
}

.suivant {
   width:49%;
   text-align:right;
   float:left;
}


/* Liens de base *********************************/
a:link, a:visited {
	color: #6b8a46; 
        text-decoration: underline;
}

a:hover {
	color: #333;	
        text-decoration: underline;
}


/** 
 * Interface de Navigation
 * --------------------------------- 
 * Les styles CSS que voici définissent l’affichage des interfaces de navigation 
 */ 

/* "Onglets" actifs dans l'editeur d'article en "frontend" */
.ontab {
	background-color: #323A15;
	border-left: outset 1px #DCF2FA;
	border-right: outset 1px #808080;
	border-top: outset 1px #DCF2FA;
	border-bottom: solid 1px #d5d5d5;
	text-align: center;
	font-weight: bold;
	color: #FFFFFF;
}

/* "Onglets" inactifs dans l'editeur d'article en "frontend" */
.offtab {
	background-color : #e5e5e5;
	border-left: outset 1px #E0E0E0;
	border-right: outset 1px #E0E0E0;
	border-top: outset 1px #E0E0E0;
	border-bottom: solid 1px #d5d5d5;
	text-align: center;
	cursor: hand;
	font-weight: normal;
}


/* Ce style est utilisé pour fixer la taille des cases en question  */
.tabpadding {
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;
} 
.tabheading {} /* Je ne suis pas sur que ce soit utilisé. Je n’ai pas trouvé d’exemple concernant ce style. */ 

/* Ce style est utilisé pour le contenu des formulaire d’éditions, de saisie des articles (ce que l’ont fait avec htmlarea par exemple)   */ 
.pagetext {
	visibility: hidden;
	display: none;
	position: relative;
	top: 0;
} 




/* * 
 * Styles de Formulaires 
 * -------------------------------- 
 * Voici les 2 styles que utilisés pour les contrôles des utilisateurs 
 * (boutons et champs de saisies) 
 */ 
.form {
  margin:0px;
  padding:0px;
}
.button {
	color: #333; 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin-top: 4px;
	font-weight: normal;
	text-align: center;
	font-size: 10px;
	background-color:#A0C07C;
	border: 1px solid #84AD5A;
        border-width:1px 0px 1px 0px;
	height: 20px;
} 

.inputbox {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #333;
	  border: 1px solid #eee;
  /* background-color:#A0C07C; */
}


select#product_id_field {
        border:0px;
        background-color:transparent;
        background-image:url(../images/fd_liste.gif);
        background-repeat:no-repeat;
        height:21px;
        width:280px;
        text-indent:20px;
}

select#product_id_field option {
     background-color:#ccc;
}

/*
 ****************************
 * Contenu
 ****************************
 */
/** 
 * Style du contenu
 * l'ensemble des styles pour le contenu est listé ci-après. 
 */ 

.contentpane{

}

table.contentpane tr td{
  padding:5px 0px 5px 0px;
} 
/* ce style correspond principalement aux tableaux contenus dans les SECTIONS telles que les news. Quand vous créez un lien vers une section et quand vous cliquez dessus, cela vous montrera le “News” avec une description et une image (si vous en choisissez une), et une liste de catégorie des news. */ 

.contentpaneopen{ width:100%;

}/*ce style a été utilisé par Phil dans son Shambo 2?. Pas d'autre idée d'utilisation dans mambo.*/ 



.componentheading {
  font-size:16px;
  font-weight:bold;
  color:#669933;
  text-transform:uppercase;
  line-height:15px;
  margin-bottom:10px;
  margin-top:10px;
}

span.componentheading a {
   text-transform:none;
   font-size:10px;
   text-decoration:none;
}


.contentheading, .contentitem h1{
  font-size:16px;
  font-weight:bold;
  color:#669933;
  text-transform:uppercase;
  line-height:15px;
}/* ce style est employé dans plusieurs endroits ; le titre du contenu de la page principale (index.php), il est également utilisé pour l'entête de Section “News” (voir ci-dessus pour l'explication) ; ou tout autre titre vous employez.*/ 


.contentpagetitle{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 15px;
	font-weight: bold;
 	color: #fff;
	text-align:left;
        test-transform:uppercase;
}/*Pas d'informations de disponible. La présente partie sera mise à jour quand les infos seront obtenues. Désolé. Si vous savez, veuillez adresser les infos par mail.*/ 


.contentdescription{
	
}/*?*/ 

table.contenttoc{
	color: #343A58;
	background-color: #e0e0e0;
	border-top: 1px solid #465675;
	border-bottom: 1px solid #465675;
	border-left: 1px solid #465675;
	border-right: 1px solid #465675;
}/*ce style correspond au tableau (<table>) reprenant la liste des matières (ou “jump to box” ? -> connais pas ;( ) quand cela est possible dans une multiple pagination de contenu/articles.*/ 

table.contenttoc td{
	font-family: Arial, Verdana, Helvetica, sans-serif;
        font-size: 8pt;
        font-weight: normal;
        text-align:left;
	padding: 3px;
}/*idem mais pour les cellules de tableaux (<td>)*/ 

.content_rating{
	font-weight: normal;
	font-size: 10pt;
}/*ce style correspond au texte utilisé pour noter un article ou le commenter*/ 

.content_vote{
	font-weight: normal;
	font-size: 8pt;
}/*ce style correspond au texte utilise pour les votes (celui avec une case à cocher)*/ 



/** 
 * Style général dans Mambo des Sections / Catégories / Contenu? 
 * ------------------------------------------------------------- 
 * Ces styles sont le plus souvent utilisés à travers des Sections, 
 * Catégories et Contenus. Ils méritent donc d'être séparés des autres. 
 */ 
.creadate{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #777;
	text-decoration: none;
	font-weight: normal;
	}/*ce style correspond à la date figurant au-dessous du titre du contenu/article*/ 	

.modifydate{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #777;
	text-decoration: none;
	font-weight: normal;
}/*ce style correspond à la date figurant en fin de contenu/article «dernière modification»*/ 

a.readon:link, a.readon:visited {
	/* For formatting the "Read on..." link for blogs and on frontpage. */
  background-image:url(../images/suite.gif);
  background-repeat:no-repeat;
  background-position:-4px 10px;
  text-decoration:none;
  display:block;
  padding-left:10px;
  padding-top:7px;
}
a.readon:hover {
	/* Pfft..! */

  text-decoration:underline;

}

/** 
 * Style des Sections 
 * ----------------------------- 
 * Style des “tableaux” (<table>) dans les Sections 
 */ 
.sectiontableheader{
	color : #333;
	font-weight : normal;
        font-size:10px;
        background-color:#FC8DF7;
        height:10px;
}
.sectiontableheader th{
	color : #333;
	font-weight : normal;
        font-size:10px;
        background-color:#FDA5F9;
        height:15px;
}
/*ce style correspond aux entêtes des tableaux (<table>) dans les pages Section. Un exemple serait celui de la liste des articles quand vous cliquez sur “News” ou autre avec l'entête de tableau (<table>)comme “date”, “titre de l'article”, “auteur” et “hits”. C'est l'entête que vous pourrez contrôler avec ce style.*/ 

.sectiontableentry1 td a:link, .sectiontableentry1 td a:visited, .sectiontableentry2 td a:link, .sectiontableentry2 td a:visited {
        color:#555;
}
.sectiontableentry1 td a:hover, .sectiontableentry1 td a:active, .sectiontableentry2 td a:hover, .sectiontableentry2 td a:active {
        color:#555;
}/* ce style est employé quand il y a une liste entière de données à fournir et que vous devez créer des couleurs alternatives pour chaque rangée des données. C'est le 1ère des couleurs. 

.sectiontableentry2 td{
        height:15px;
        line-height:15px;
}/*ce style correspond à la seconde couleur pour les rangées. Ainsi, le générateur de table, alternera le style entre sectionableentry1 et sectiontableentry2 en formant un cycle pour chaque rangée des données. Semblable aux listes de “posts” dans les forums.*/ 



/** 
 * Style des Categories / Category
 * ------------------------------------- 
 * Les styles suivant configurent l'affichage des objets «Category / Categories» 
 * generée à partir de la zone “Sections” 
 */ 

.category {
	font-size: 12px; 
	font-weight: bold; 
	text-decoration: none;
} /*Cette classe definit le titre de la Categorie */ 

a.category:link, a.category:visited {
	color: #555; font-weight: bold;
} /*meme chose qu'au dessus mais pour les titres Liens*/ 

a.category:hover {
	color: #555;
        text-decoration:underline;
} /* meme chose qu'au dessus mais avec le curseur pointé dessus*/ 



/** 
 * Style du Blog
 * -------------------- 
 * Ce n'est pas certain que cette classe soit encore utilisée. 
 * n'esitez à nous envoyer un mail si vous avez des info sur cette partie 
 */ 
a.blogsection:link, a.blogsection:visited {
	color: #fff; 
	text-decoration: none; 
}
a.blogsection:hover {
	color: #fff;	
	text-decoration: underline;
}


/*
 ************************************************************************************************************************
 * MODULES
 ************************************************************************************************************************
 */
 
/** 
 * Format des modules 
 * ----------------------------- 
 * Ces styles configurent l'affichage des modules, 
 * ceci concerne principalement l'affichage des table 
 */ 
table.moduletable {
	/* styling the module table */
	clear:left;
}

table.moduletable th {
	/* styling the module header, and the module titles */
	
}

table.moduletable td {
	/* well.. for formatting the table cells of the module table */
	
}

.moduletable h3 {
  color:#6D1E00;
  font-weight:bold;
  text-transform:uppercase;
}




/*
 ************************************************************************************************************************
 * COMPOSANTS
 ************************************************************************************************************************
 */

/** 
 * Style des «Components / Composants» Mambo
 * ----------------------------------------- 
 * Ces style CSS definissent la maniere dont le titre des «Composant / Component» est affiché 
 */ 
 /* Cette class est utilisée pour l'affichage du titre du composant, quand il est affiché sur la page principal */ 

/**
 * Style des «Components / Composants» integrés à Mambo 
 * ---------------------------------------------------- 
 *Ces styles configurent l'affichage des composants integrés a mambo 
 * tel que news externes, annuaire de liens, contact, recherche et sondage.
 */ 

/* Sondages ******************************************************************/ 
.poll {
	/* polls texts */
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #343A58;
	line-height: 14px
}
.pollstableborder {
	/* set the border properties of the polls voting table */
	border: 1px solid #465675;
}


/* Liens Web *****************************************************************/
a.weblinks:link, a.weblinks:visited {
	/* well.. to format the link's titles under the "Weblinks" 
	   section on the frontend */
	color: #405115; text-decoration: none; font-weight: normal;
	font-family:  Arial, Verdana, Helvetica, sans-serif;
}
a.weblinks:hover {
	/* same as above, but for link with mouseover */
	color: #000099;	text-decoration: underline;
}


/* Diffusion des news ********************************************************/ 
.newsfeedheading {
	/* The newsfeed title. NOTE: This will not affect the newsfeed's news title! */
   font-family: Arial, Verdana, Helvetica, sans-serif;
   font-size: 11px;
   font-weight: bold;

   color: #343A58;
}
.newsfeeddate {
	/* yeah.. the date on the newsfeed */
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #343A58;
	font-weight: normal;
}
.fase4rdf {
	/* this is the body text of the newsfeed */
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px; 
	color: #343A58; 
	font-weight: normal;
}
a.fase4rdf:link {
	/* links of the body text of the newsfeed */
	font-size: 11px; 
	font-weight: bold; 
	color: #356C82;
}
a.fase4rdf:hover {
	/* links of the body text of the newsfeed when mouse points over it*/
	font-size: 11px;
	font-weight: bold; color: #759328;
}


/* Page de recherche ********************************************************/ 
table.searchintro {
	/* This is for formatting the box with "Search Keyword: test returned 4 matches" box
	   that appears after you have entered a search value. It appears on the mainbody
	   with the search results  */
  	background-color: #FFFFFF;
	border: 1px solid #8D9ABC;
}
/* Ce style configure l'affichage du resulta d'une recherche affichée dans la page principale */ 



/* Paramettres de la Table des Contactes ************************************/ 
table.contact {
	background-color: #FFFFFF;
} 
/* Pour formater la totalité de la table des “contacts” ce qui inclus le nom, addresse icons and formulaire. 
Note : Cette table n'inclus pas la liste deroulante qui permet de choisir “Department” “Personne” */
table.contact td.icons {
	background-color: #CCCCCC;
} 
/* Le nom vous en dis deja beaucoup. Ce style configure les cellules <td> 
ou sont affichés les petits icons prés des details (addresses, telephone etc) */ 


table.contact td.details {
	background-color: #F3F3F3;
	font-size: 11px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
} /* ceci definit le format <td> ( td pour table data ) des cellules ou sont les informations. 
Ces informations sont : addresses, telephone et autres info*/



/*
 *****************************************************************************************************************************
 * STYLES DE TEXTE
 *****************************************************************************************************************************
 */
hr {

} 


hr.separator {

} 

h1 {

}

h2 {
  font-size:16px;
  font-weight:bold;
  color:#669933;
  text-transform:uppercase;
  line-height:15px;

}

h3 {
  font-size:16px;
  font-weight:bold;
  color:#669933;
  text-transform:uppercase;
  line-height:10px;
}

h4 {

}

h5 {

}

h6 {

}

/* Infos articles */
.small {
	font-size:9px;
	font-style:italic;
	color:#999;
} 

.highlight {
	background-color: Yellow;
	color: Blue;
	padding: 0px 2px 0px 2px;
}

.code {
	background-color: #ddd;
	border: 1px solid #bbb;
}
.maintitle {

	color: #ffffff;

	font-size: 40px;

	padding-left: 15px;

	padding-top: 20px;

}

.error {
  font-style: italic;
  text-transform: uppercase;
  padding: 5px;
  color: #cccccc;
  font-size: 14px;
  font-weight: bold;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
li {
	line-height: 15px;
	padding-left: 15px;
	padding-top: 0px;
	background-image: url(../images/arrow.png) ;
	background-repeat: no-repeat;
	background-position: 0px 3px;
}

.img {
   border:4px solid #fff;
}




/* ************************************************** BOUTIQUE ************************************************************ */
.ligne {
  clear:left;
  /* height:104px; */
  /* margin-bottom:10px; */
}
.categorie {
   /* width:75px; */
   width:100px;
   /* height:290px;*/
   /* height:322px; */
   height:255px;
   background-color:#efefef;
   float:left;
   margin: 13px 5px 0px 0px;
}
.img_categorie {
   width:100px;
   height:287px;
   overflow:hidden;
   clear:left;
}

.tit_categorie {
   display:block;
   /* height:35px; */
   width:100px;
   clear:left;
   background-color:#eee;
   text-align:center;
}

 a.lien_categorie:link, a.lien_categorie:visited {
   color:#444;
   text-transform:uppercase;
   text-decoration:none;
   font-size:8px;


}
a.lien_categorie:hover,  a.lien_categorie:active {
   color:#444;
   text-transform:uppercase;
   text-decoration:underline;
   font-size:8px;
}


#product_list {
  margin:0px;
}
/* ******************** FOND SUIVANT FAMILLE DE PRODUIT **************** */
/* **** GRIS (defaut) *********** */
.fd_img_prod_liste {
  width:91px;
  height:90px;
  padding:9px;
  margin-bottom:5px;
  margin-right:2px;
  background-image:url(../images/fd_img_prod.gif);
  background-background-repeat-no-repeat;
}
/* **** ROSE ******************** */
.fd_img_prod_liste_rose {
  width:91px;
  height:90px;
  padding:9px;
  margin-bottom:5px;
  margin-right:2px;
  background-image:url(../images/fd_img_prod_rose.gif);
  background-background-repeat-no-repeat;
}
/* ****** VERT ***************** */
.fd_img_prod_liste_vert {
  width:91px;
  height:90px;
  padding:9px;
  margin-bottom:5px;
  margin-right:2px;
  background-image:url(../images/fd_img_prod_vert.gif);
  background-background-repeat-no-repeat;
}
/* ****** CYAN ***************** */
.fd_img_prod_liste_cyan {
  width:91px;
  height:90px;
  padding:9px;
  margin-bottom:5px;
  margin-right:2px;
  background-image:url(../images/fd_img_prod_cyan.gif);
  background-background-repeat-no-repeat;
}





.img_prod_liste  {
  width:91px;
  height:89px;
  overflow:hidden;
  margin:auto;
  text-align:center;
   /* background-color:#fff; */
  vertical-align:middle;
line-height : 89 px;
}
.img_prod_liste img, .img_prod_liste a {
 /* vertical-align: middle; display: inline;  */
 margin:auto;

}

.det_image {
  float:left;
  margin-right:7px;
  /* height:280px; */
  width:115px;
}

.det_infos {
  float:left;
  width:300px;
}
.det_infos h1 {
  font-size:16px;
  font-weight:bold;
  color:#669933;
  text-transform:uppercase;
}

.prix {
  /* display:block; */
 line-height:20px;
  margin-bottom:5px;
  /* float:left; */
}

.det_desc {
display:block;
margin-top:7px;

}
.fabricant {
  font-size:11px;
  font-weight:bold;
  color:#fc8df7;
  text-transform:capitalize;
}

.quantite {
  border:0px;
  background-color:#D1F0C1;
}

.panier {
  border:0px;
  padding-left:25px;
  clear:left;
}

/* ***************** Champs d'infos de facturation ***************************** */
div.ligne_champ {
 margin:2px;
  clear:left;
  padding:2px;
  width:97%;
text-align:right;
}

div.ligne_champ div {
 float:left;
 text-align:right;
}

.div_produit {
  float:left;
}
/*
#title_div {
  float:left;
}

#first_name_div {
  float:left;
}

#last_name_div {
  float:left;
}

adress_1_div {

}

adress_2_div {

}

city_div {

}

#zip_div {

}

#country_div {

}

#phone_1_div {

}

#email_div {

}

#agreed_div {


} 
*/

.entete_etape{
        color : #333;
	font-weight : normal;
        font-size:10px;
        background-color:#FC8DF7;
        padding:5px;
        width:380px;
}



/* ********************************** BLOG ************************************** */
.blog {
  margin:0px;
  padding:0px;
}
.blogleading {
  margin:0px;
  padding:0px;
}
.contentitem {
  position:absolute;
  /* top:-20px; */
  margin:0px; 
 display:block;
padding:0px 10px 0px 0px;
  width:480px;
  overflow:auto;
  text-align:justify;
height:330px;
}

.contentitem a img {
  border:0px;
}

contentintro {
   height:300px;
 display:block;
   overflow:visible;

}

/* ******************************** IDENTIFICATION ***************************** */
#login .row {
  margin-bottom:5px;
}

/* ******************************* PARRAINAGE ********************************* */
fieldset {
  border:1px solid #ccc; 
  margin-top:10px;
  widyh:400px;
}
fieldset legend.sectiontableheader {
  background-color:#9fbe7e;
  padding:5px;
}

fieldset form {
  width:390px;
}
fieldset input {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #333;
	  border: 1px solid #eee;
  /* background-color:#A0C07C; */
}

#lien_parrainage input {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 9px;
	color: #333;
	  border: 1px solid #eee;
  /* background-color:#A0C07C; */
}


/* ******************************** FORMULAIRE CREATEURS ************************ */
iframe {
 z-index:20px;
}



p {
  margin:0px;
}

.allvideos {
 height:300px;
 overflow:hidden;
}

.shop_error {
  visibility: hidden;
  height:0px;
  margin-top:-42px;
}

#test > h2 {
font-size:0px;
display:block;
padding-top:40px;
}

img > h2 {
text-transform:capitalize;
}