/*  
    Feuille de style CSS - General
    -----------------------------------------
    projet: 	FGT
    créé le: 	28-01-2009
    auteur: 	Jean-Christophe Brebion
    email: 		jean-christophe@fairytree.net
    site web: 	http://www.fairytree.net   
*/

body {
	font-family: Arial, Verdana, sans-serif;
	font-size: 0.75em;
	background: #fff;
	height: 100%;
	color: #898989;
}
div#wrapper {
	background: #f6f6f6 url(images/bg-body.jpg) repeat-x 0 0;
	overflow:  auto;
}
p { margin:0 0 10px; line-height:1.5em;}
p.txtright { text-align:right;}
strong { font-weight:  bold; color:  #535353;}
abbr, acronym { border-bottom: 1px dotted gray; cursor: help;}
.floatright { float:right;}

/*----- IMAGES -----*/

/* Affichage des images des différentes galeries */
div.ce_gallery img, div.image_container img {
	padding:  5px;
	background: #fff;
	border:  1px solid #ddd;
}
div.blank img {
	padding:  0 !important;
	border:  0 !important;
	background:  transparent !important;
}

/*----- LIENS -----*/
a {
	text-decoration:  underline;
	color:  #535353;
}
div#main a:hover, div#outer a:hover, div#footer a:hover { color:  #535353;}
div#outer a { color: #1996ba;}

div#content a:hover, div#footer a:hover {
	color: #000;
}

/*----- TITRES -----*/
h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 0.5em;	
	color: #f47900;
}
h2 { font-size: 1.5em; clear:both;}
h3 { font-size: 1.3em;}
div#sidebar-home h3 {
	margin-top: 5px;
    margin-bottom:  5px;
}
div#sidebar-home ul li h3 a { color: #f47900;}
div#sidebar h3 {
	color: #1996ba;
	font-size:  1.2em;
}
div#outer h2, div#outer h3, div#outer h4 { color: #1996ba;}

/* Titre principal de la page */
div#content h2 {
	background: url(images/bg-h2-content-home.jpg) repeat-x bottom left;
	padding-bottom: 0.5em;
}

/* Titre Bandeau produits */
body#home div#outer h2 {
	background: url(images/bg-h2-outer.jpg) repeat-x bottom left;
	padding-bottom: 0.5em;
}

/* Titre des blocs de la page "produits" */
div.liste-produits h3 {
	padding:  10px 0 8px 10px;
	margin:  0;
}

/*----- FORMULAIRES -----*/
fieldset {
	margin-bottom: 10px;
	padding: 10px;
	background: #fff;
	border: 1px solid #ccc;
}
legend {
	font-size: 1.1em;
	color: #f47900;
	padding: 0 10px;
	font-weight:  bold;
}
label {
	float:left;
	width:190px;
	margin:5px 10px 5px 0;
	padding:4px;
	text-align:right;
	font-weight:bold;
}
input,textarea {
	border:1px solid #aaa;
	padding:4px;
	margin:5px 0 5px 0;
	background: #eee;
}
input {	width:200px;}
input.captcha {
	width:20px;
	text-align:center;
}
input.submit {
	text-align: center;
	margin: 15px 0 0 207px;
	width:  75px;
	height:  30px;
    border: none;
    background: url(images/submit.jpg) no-repeat 0 0;
	cursor: pointer;
	text-indent:  -9999px;
	color: transparent;
}
input.submit:hover { background: url(images/submit.jpg) no-repeat 0 -30px;}
input.telephone {
	background: #eee url(images/telephone.jpg) no-repeat 4px 3px;
	padding-left: 26px;
	width:  178px;
}
input.email {
	background: #eee url(images/mail.jpg) no-repeat 5px 3px;
	padding-left: 26px;
	width:  178px;
}
input.fax {
	background: #eee url(images/fax.jpg) no-repeat 5px 3px;
	padding-left: 26px;
	width:  178px;
}
.error { color:#CC0000;}

/*----- HEADER -----*/
div#header {
	width: 800px;
	height: 150px;
	margin: 0 auto;
	position: relative;
}
h1#site-title a {
	position: absolute;
	top: 30px;
	left: 0;
	width: 238px;
	height:  71px;
	background: url(images/logo.jpg) no-repeat 0 0;
	text-indent: -9999px;
}
h1#site-title a:hover { background: url(images/logo.jpg) no-repeat 0 -71px;}

/*----- MENU -----*/
div#menu {
	position: absolute;
	width: 543px;
	height: 100%;
	top: -4px;
	right: 0;
}
div#menu ul li {
	list-style: none;
	margin:0;
	padding: 0;
	display: inline;
}

/* Menu - Affichage par défaut */
div#menu ul li a, div#menu ul li span {
	display: inline;
	float: left;
	height: 132px;
	background: url(images/menu.jpg) no-repeat 0 0;
	text-indent:  -9999px;
	margin:  0;
	padding:  0;
}

/* Menu - Définition des propriétés pour chaque onglet */
div#menu ul li a.accueil { width: 72px; background-position: 0 0;}
div#menu ul li a.accueil:hover { background-position: 0 -132px;}
div#menu ul li span.accueil { width: 72px; background-position: 0 -264px;}

div#menu ul li a.produits { width: 79px; background-position: -72px 0; }
div#menu ul li a.produits:hover { background-position: -72px -132px; }
div#menu ul li a.produits.trail { background-position: -72px -264px; }
div#menu ul li span.produits { width: 79px; background-position: -72px -264px; }

div#menu ul li a.applications { width: 105px; background-position: -151px 0; }
div#menu ul li a.applications:hover { background-position: -151px -132px; }
div#menu ul li a.applications.trail { background-position: -151px -264px; }
div#menu ul li span.applications  { width: 105px; background-position: -151px -264px; }

div#menu ul li a.devis { width: 58px; background-position: -256px 0; }
div#menu ul li a.devis:hover { background-position: -256px -132px; }
div#menu ul li span.devis { width: 58px; background-position: -256px -264px; }

div#menu ul li a.qui-sommes-nous { width: 150px; background-position: -314px 0; }
div#menu ul li a.qui-sommes-nous:hover { background-position: -314px -132px; }
div#menu ul li a.qui-sommes-nous.trail { background-position: -314px -264px; }
div#menu ul li span.qui-sommes-nous { width: 150px; background-position: -314px -264px; }

div#menu ul li a.contact { width: 76px; background-position: -464px 0; }
div#menu ul li a.contact:hover { background-position: -464px -132px; }
div#menu ul li a.contact.trail { background-position: -464px -264px; }
div#menu ul li span.contact { width: 76px; background-position: -464px -264px; }

/*----- CONTENU -----*/
div#main {
	width: 800px;
	margin: 0 auto;
	overflow: auto;
}

/* Bouton devis */
p a.bouton-devis {
	text-indent: -9999px;
	width:  154px;
	height:  38px;
	display: block;
	float:  right;
	margin:  5px auto;
	background:  url(images/bouton-devis.jpg) no-repeat 0 0;
}
p a.bouton-devis:hover { background: url(images/bouton-devis.jpg) no-repeat 0 -38px;}
div#main a.btn { 
	height:30px; line-height:30px; text-decoration:none; font-weight:bold; padding:0 10px; border:1px solid #C0C0C0; display:inline-block; font-size:13px; color:#7C7C7C;
	-moz-box-shadow:0px 1px 4px #aaa; -webkit-box-shadow:0px 1px 4px #aaa; box-shadow:0px 1px 4px #aaa;
	background: rgb(248,248,248); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(248,248,248,1) 0%, rgba(219,219,219,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,248,248,1)), color-stop(100%,rgba(219,219,219,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(219,219,219,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(219,219,219,1) 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(219,219,219,1) 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#dbdbdb',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, rgba(248,248,248,1) 0%,rgba(219,219,219,1) 100%); /* W3C */
	-webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px;
}
div#main a.btn:hover { color:#555;}

/* Sidebar Page d'accueil */
div#sidebar-home {
	float: right;
	width: 280px;
	padding-top: 15px;
}
div#sidebar-home ul li {
	list-style: none;
	margin-bottom:  20px;
	height: 60px;
	width: 163px;
	padding:  15px 100px 15px 15px;
	display: block;
	text-decoration: none;
}
div#sidebar-home ul li a:hover { color: #535353;}
div#sidebar-home ul li p {
	margin-top:  0; 
	color: #898989;
}
div#sidebar-home ul li.bobines-carton {
	height: 60px;
	width: 163px;
	padding:  15px 100px 15px 15px;
	background: url(images/bg-bobines-carton.jpg) no-repeat 0 0;
}
div#sidebar-home ul li.bobines-plastique {
	height: 63px;
	width: 143px;
	padding:  12px 15px 15px 120px;
	background: url(images/bg-bobines-plastique.jpg) no-repeat 0 0;
}
div#sidebar-home ul li.emballages-carton {
	height: 68px;
	width: 163px;
	padding:  16px 100px 15px 15px;
	background: url(images/bg-emballages-carton.jpg) no-repeat 0 0;
}
div#sidebar-home ul li.pieces-injectees {
	height: 63px;
	width: 143px;
	padding:  8px 15px 15px 120px;
	background: url(images/bg-pieces-injectees.jpg) no-repeat 0 0;
}

/* Sidebar Pages standard */
div#sidebar {
	float: left;
	width: 245px;
	margin: 10px 0 15px -3px;
	background:  url(images/bg-sidebar.png) no-repeat bottom left;
	padding-bottom:  10px;
}
div.mod_breadcrumb {
	background: url(images/bg-sidebar-top.jpg) repeat-x 0 0;
	width: 230px;
	padding:  15px 0 6px 15px;
	font-size: 0.9em;
}
div#sidebar div.mod_article { margin:  10px 15px;}
div#sidebar ul { margin:  8px 10px 9px;}
div#sidebar ul li { list-style: none;}
div#sidebar ul li a {
	color: #1996ba;
	display:  block;
	padding: 7px 0;
	margin:  0 5px;
	text-decoration:  none;
	border-bottom:  1px solid #ccc;
}
div#sidebar ul li.active {
	color:  #535353;
	background: url(images/sidebar-li.png) no-repeat -3px 7px;
	padding:  7px 0 7px 10px;
	margin:  0 5px;
	list-style-type: none;
	border-bottom:  1px solid #ccc;
}
div#sidebar ul li.active span.active {	font-weight:  bold;}
div#sidebar ul li a.last, div#sidebar ul li.active.last  {
	border-bottom: 0;
	padding-bottom:  0;
}

/*----- CONTENU PRINCIPAL -----*/
div#content {
	float: right;
	width: 540px;
	padding-bottom: 20px;
	position:  relative;
  	min-height: 400px;
  	height: auto !important; /* Empêche IE6 d'interpréter cette déclaration */
  	height: 400px;
}
div#content ul {
	margin: 0 0 0.75em 1em;
	line-height: 1.5em;
}
div#content ul ul {	margin-bottom:  0;}

div#content ul li {	list-style-position: inside;}

/*----- OUTER -----*/
div#wrapper-outer {
    clear: both;
	background: url(images/bg-wrapper-outer.jpg) repeat-x 0 0;
	margin-top:  10px;
}
div#outer {
	width: 800px;
	margin: 0 auto;
	overflow: auto;
}
div#outer ul li {
	display: block;
	background: url(images/bg-box-outer.jpg) repeat-x 0 0;
	float: left;
	width:  161px;
	height:  138px;
	margin:  5px 12px 10px 0;
	padding:  0 15px;
}
div#outer ul li h3 {
	padding-top:  4px;
	padding-left:  30px;
}
div#outer ul li.sur-mesure h3 {	background: url(images/sur-mesure.png) no-repeat 0 -2px;}
div#outer ul li.eco-emballage h3 {	background: url(images/eco-emballage.png) no-repeat 0 -2px;}
div#outer ul li.suivi-qualite h3 {	background: url(images/suivi-qualite.png) no-repeat 0 -2px;}
div#outer ul li.reactivite h3 {	background: url(images/reactivite.png) no-repeat 0 -2px;}
div#outer ul li.last { margin-right: 0;}

/*----- FOOTER -----*/
div#wrapper-footer {
	clear: both;
	background: url(images/bg-wrapper-footer.jpg) repeat-x 0 0;
}
body#home div#wrapper-footer { background: url(images/bg-wrapper-footer-home.jpg) repeat-x 0 0;}
div#footer {
	width: 800px;
	margin: 0 auto;
	overflow: auto;
	height: 100%;
	padding:  10px 0;
	position:  relative;
}
div#footer ul#liens-footer {
	float: right;
	width: 270px;
	list-style-type: none;
	padding-top:  15px;
}
div#footer ul#liens-footer li {
	display: inline;
	float:  right;
	margin-left:  15px;
}
div#footer ul#liens-footer li#fairytree {
	position:  absolute;
	top:  20px;
	right:  0;
}
div#footer p.logo-footer {
	width:  122px;
	height:  47px;
	background:  url(images/logo-footer.jpg) no-repeat 0 0;
	float:  left;
	text-indent: -9999px;
}
div#footer p.adresse {
	width:  125px;
	height:  30px;
	padding: 17px 0 0 10px;
	background:  url(images/bg-adresse.jpg) no-repeat bottom right;
	float:  left;
	font-size:  0.9em;
}
div#footer p.contact {
	width:  125px;
	height:  30px;
	padding: 17px 0 0 10px;
	float:  left;
	font-size:  0.9em;
}

/*----- STYLES PARTICULIERS -----*/
div.ce_text { overflow:hidden;}

/* Accueil */
#home .ce_text { clear:both;}
#home #content { float:left; width:490px;}
.slogan p { font-size:14px; font-weight:500; color: #535353; line-height:16px; margin-top: 0;}
#home #content h2 { background:url(images/bg-h2-content-home.jpg) repeat-x bottom left; padding-bottom:.5em; margin:10px 0;}
.wrap-btn { margin-bottom:0;}
.btn-devis { position:relative; top:12px;}

/* Page Produits */
div.liste-produits {
	float:  left;
	width:  250px;
	margin: 0 18px 20px 0;
	background:  #fff;
	border:  1px solid #ddd;
	position:  relative;
}
div.liste-produits div.image_container {  /* Permets de supprimer l'espace blanc sous l'image */
	height:  150px; 
}
div#content div.liste-produits div.image_container img { /* Suppression des styles généraux des images */
	padding:  0;
	border:  0;
}
div.liste-produits div.caption {
	display:  none;
}
div.liste-produits:hover h3 {
	background: #f47900;
    color:  #fff;
}
div.liste-produits:hover div.caption {
	display:  block;
	position:  absolute;
	bottom:  0;
	right:  0;
	padding:  5px;
	width:  250px;
	background:  #fff;
	text-align: center;
}

/* Page Qui sommes-nous ? */
div.bloc-quisommesnous { margin: 0 18px 20px 0; position:  relative;}
div.quisommesnous.last { margin-right: 0;}
div.bloc-quisommesnous div.image_container img {
	float:left;
	margin-right:20px;
	padding:  5px;
	background: #fff;
	border:  1px solid #ddd;
}

/* Lien pour l'impression en pdf */
div.pdf_link { float:right; width:500px; font-size:0.9em;}
div.pdf_link a {
	color: #aaa;
	text-decoration: underline;
	display: block;
	background: url(images/printer.png) no-repeat top right;
	padding: 3px 20px 3px 0;
	position:  absolute;
	top:  15px;
	right:  0;
}

