/* CSS Document */


/*=>>>;>>>>;>>;>>>>;>>>>>>>>>>>> DEBUG OG en cours ligne 381 */

/*
Rapport:
-bug bloc actualité sous safari corrigé vers ligne  107
-bug diaporama corrigé vers ligne 386
-bug page index fix dans la css spécifique à IE
/*** Eléments communs ***/

*{
margin:0;
padding:0
}
body{
font-family:arial,sans-serif;
color:#4D4F53;
font-size:16px;
line-height:22px;
background:#333;
}
h1{
font-family:arial;
color:#333;
margin:25px 0 25px 0;
}
h2,h3,h4 {
font-family:trebuchet ms, verdana, arial,sans serif;
text-transform:uppercase;
color:#333;
}
h2{
font-family:arial,sans serif;
font-size:18px;
margin-top:14px;
text-transform:uppercase;
font-weight:normal;
color:#999;
border-bottom:1px solid #999;
}
h4{
margin:7px 0 7px 0;
}
p{
margin:7px 0 0 0;
}
ul,li {
margin:0;
}
li {
list-style-type:none; 
}
a{
color:#003399;
font-family:arial;
text-decoration:none;
}
a:hover {
text-decoration:none;
color:#003366;
}
.column a:hover {
border-bottom:1px dotted #003366;	
}
img {
border:none;
outline:none;
}
.container, .container_generique, .container_orange, .container_vert, .container_violet, .container_prune{
width:100%;
background:#fff;
}
.clear {
clear:both;
visibility:hidden;
height:14px;
}
/* éléments spécifiques PAGE D'ACCUEIL */
#topheader_home{
margin:0 auto;
width:850px;
height:200px;
background: url(_templates/neufbref.gif) center right no-repeat;
}
#central_home {
height:350px;
background:ur(_templates/fond_index.jpg) bottom left no-repeat;	
}

#logo {
float:left;
width:240px;
height:140px;
}
#promo{
float:left;
width:200px;
heigth:200px;
}
#actualites{
float:right;
width:200px;
height:150px;
margin:14px 34px 0 0;
overflow:hidden;            /* FIX OG : safari bloc d'actualité trop grand */
}
#leftheader_home{
float:left;
width:220px;
margin-top:50px;
margin-left:20px;
text-align:right;
}
#mainheader_home{
float:left;
width:610px;
}
#texte_home{
height:300px;
width:250px;
}
#leftheader_home h1{
font-size:31px;
font-family:;
line-height:31px;
text-transform:uppercase;
margin-bottom:0;
}
#navigation_home{
margin-top:80px;
/*margin-right:35px;*/
width:570px;
}

/* TOPHEADER PAGES CONTENU */
#topheader{
margin:0px auto 0;
width:850px;
height:120px;
}
#topspacer{
width:100%;
background:#fff;
height:10px;
}
#middlespacer{
width:100%;
background:#fff;
height:20px;
}
#homelink {
float:left;
width:100px;
height:110px;
}
#homelink a{
display:block;
width:100px;
height:110px;
}
#homelink a:hover{
background:#fff url(_templates/Logo_PS_Conseil_petit.jpg) center no-repeat;
}
.container_generique #homelink {
background:#003366;
}
.container_orange #homelink {
background:#fB4F14;
}
.container_vert #homelink {
background:#C9DD03;
}
.container_violet #homelink {
background:#9B1889;
}
.container_prune #homelink {
background:#6E2585;
}
#topcenter{
float:left;
margin-left:70px;
width:120px;
}
#topnavigation{
float:right;
width:400px;
height:110px;
}

/**** PAGES ACCUEIL METIERS ****/
#central, #central2, #central3, #central_home, #central_neufbref, #central_famille {
margin:0 auto;
width:850px;
}
.container_orange #central {
background:url(_templates/philippe_assis.jpg) bottom left no-repeat;	
}
.container_vert #central {
background:url(_templates/philippe.jpg) bottom left no-repeat;	
}
.container_violet #central {
background:url(_templates/bleudatelier.jpg) bottom left no-repeat;	
}
.container_prune #central {
background:url(_templates/yolande.jpg) 0% 100% no-repeat;	
}
.container_generique #central2 {
background:url(_templates/Phil_Yolande.jpg) 0% 100% no-repeat;	
}

#central_neufbref {
background:url(_templates/neufbref_big.gif) center left no-repeat;	
}

/* Header */
#header, #header_home{
/*margin:0 auto;*/
width:850px;
}
#leftheader{
float:left;
width:100px;
height:70px;
margin-top:19px;
}
.container_orange #leftheader{
background:#fB4F14;
}
.container_vert #leftheader{
backgroun:#C9DD03;
}
.container_violet #leftheader{
background:#9B1889;
}
.container_prune #leftheader{
backgroun:#6E2585;
}
.container_generique #leftheader{
background:#003366;
}

#mainheader{
float:left;
width:476px;
font-family:times,arial;
font-size:18px;
line-height:24px;
padding:0 30px 0 60px;
}
#mainheader h1{
font-size:47px;
line-height:12px;
}
#mainheader p {
margin-top:7px;	
}
#rightheader{
float:left;
width:150px;
padding:17px;
margin-top:19px;
text-align:center;
color:#fff;
}
#rightheader a {
text-transform:uppercase;
font-size:11px;
font-weight:bold;
}
.container_orange #rightheader {
background:#fB4F14; 
}
.container_vert #rightheader {
background:#C9DD03;	
}
.container_violet #rightheader {
background:#9B1889;	
}
.container_violet #rightheader a {
color:#ccc;
font-size:20px;
line-height:30px;
letter-spacing:1px;
}
.container_generique #rightheader {
background:#003366;	
}
.container_prune #rightheader {
background:#6E2585;	
}
.container_prune #rightheader a{
color:#ddd;	
}
#rightheader a:hover {
color:#fff;
}

/* Contenu */
#content{
margin:30px auto;
width:850px;
clear:both;
}
#column1{
float:left;
width:190px;
height:150px;
margin-top:25px;
padding-right:50px;
}
#column2{
float:left;
width:184px;
padding-right:14px;
}
#column3, #column3_peint{
float:left;
width:183px;
padding:0 14px 0 14px;
border-left:1px solid #ddd;
}
#column4, #column4_peint{
float:left;
width:184px;
padding-left:14px;
border-left:1px solid #ddd;
}
#column3_peint, #column4_peint{
width:282px;
}
.column li{
margin-left:40px;
list-style-type:circle;
font-size:13px;
line-height:18px;
color:#333;
}
.column h3{
font-size:16px;
margin:0 0 10px 0;
line-height:24px;
}
#maincontent_famille h3{
font-size:16px;
margin:0 0 10px 0;
line-height:24px;
border-bottom:7px solid #003366;
}

.container_generique .column h3{
border-bottom:7px solid #003366;
}
.container_orange .column h3{
border-bottom:7px solid #fB4F14;
}
.container_vert .column h3{
border-bottom:7px solid #C9DD03;
}
.container_violet .column h3{
border-bottom:7px solid #9B1889;
}
.container_prune .column h3{
border-bottom:7px solid #6E2585;
}
.lettrine {
float:left;
font-size:300%;
margin:9px 2px 0 0;
font-family:trebuchet ms, arial;
}
.container_generique .lettrine {
color:##003366;
}
.container_orange .lettrine {
color:#fB4F14;
}
.container_vert .lettrine {
color:#C9DD03;
}
.container_violet .lettrine {
color:#9B1889;
}
.container_prune .lettrine {
color:#6E2585;
}
.encart .lettrine {
color:#333;
}
#bottomrightcontent .lettrine{
	color:#333;
}

/**** PAGES METIERS ****/

/* Côté gauche */
#leftcontent{
float:left;
width:190px;
}

div#leftcontent div.bloc_diapo {
height:200px;            
/* FIX OG : ajout d'un div autour de la brique diaporama. 
Car par défaut cette brique génère un <div style="height:100%; width:100%">...</div>
Or dans notre cas le container n'a pas de hauteur. J'ai donc ajouter un div intermédiaire
auquel on fix une hauteur de manière à ce que tout les navigateurs est le même
comportement.
*/}

.container_violet #leftcontent{
width:240px;
}
#boxmetier{
width:100px;
height:70px;
}
.container_generique #boxmetier{
background:none;
}
.container_generique #boxmetier #central2{
background:none;
}
.container_generique #boxmetier #central3{
background:none;
}
.container_orange #boxmetier{
background:#fB4F14;
}
.container_vert #boxmetier{
background:#C9DD03;
}
.container_violet #boxmetier{
background:#9B1889;
}
.container_prune #boxmetier{
background:#6E2585;
}
#middleleftcontent, #menu_galeries{
margin-top:20px;
}
#menu_galeries {
float:right;
width:50px;
}
#middleleftcontent, #menu_galeries li{
text-align:right;
}
#middleleftcontent a, #menu_galeries a {
text-transform:uppercase;
color:#333;
font-size:11px;
font-weight:bold;
}
#middleleftcontent, #menu_galeries a:hover {
text-decoration:none;
}
.container_orange #middleleftcontent a:hover {
color:#fB4F14;
}
.container_orange #middleleftcontent a.selected {
color:#fB4F14;
}
.container_vert #middleleftcontent a:hover {
color:#C9DD03;
}
.container_vert #middleleftcontent a.selected {
color:#C9DD03;
}
.container_violet #middleleftcontent a:hover {
color:#9B1889;
}
.container_violet #menu_galeries a:hover {
color:#9B1889;
}
.container_violet #middleleftcontent a.selected {
color:#9B1889;
}
.container_violet #menu_galeries a.selected{
color:#9B1889;
}

.container_prune #middleleftcontent a:hover {
color:#6E2585;
}
.container_prune #middleleftcontent a.selected {
color:#6E2585;
}
#bottomleftcontent{
margin-top:20px;
}
#vignettes{
margin-top:20px;
float:left;
width:140px;
}

/* Colonne centrale */
#maincontent{
float:left;
margin-left:50px;
width:420px;
}
#maincontent_famille{
float:left;
margin-left:0px;
width:660px;
height:600px;
}
#preview{
float:left;
margin-left:0px;
width:420px;
text-align:center;
}
#preview table{
margin:auto;
}
.texte_secondaire, .lexique_besoins{
font-size:13px;
line-height:18px;
color:#333;	
}
.lexique_besoins h4{
margin:7px 0 0 0;	
}
.lexique_besoins a{
margin-left:7px;	
}
.texte_secondaire p{
margin:0;	
}
.encart {
float:left;
width:164px;
margin:20px 35px 10px -35px;
padding:7px;
font-size:13px;
line-height:18px;
color:#333;
background:#CCC;
}
.encart h4 {
margin-top:0;
}
.encart li {
clear:left;
}
.encart p {
margin-top:3px;
}
/* Côté droit */
#rightcontent{
float:right;
width:161px;
}
#toprightcontent{
width:100%;
height:100px;
text-align:center;
}
#intitule_galerie{
width:100%;
height:60px;
text-align:center;
background:#9B1889;
padding-top:40px;
font-size:30px;
color:#fff;
}
#toprightcontent a {
text-transform:uppercase;
font-size:11px;
font-weight:bold;
}
.container_prune #toprightcontent a {
color:#ccc;
}
.container_generique #toprightcontent a {
color:#ccc;
}
#toprightcontent a:hover {
color:#fff;
}
.container_generique #toprightcontent{
background:#003366;
}
.container_orange #toprightcontent{
background:#fB4F14;
}
.container_vert #toprightcontent{
background:#C9DD03;
}
.container_violet #toprightcontent{
background:#9B1889;
}
.container_prune #toprightcontent{
background:#6E2585;
}
#bottomrightcontent{
width:154px;
margin-top:14px;
font-size:13px;
color:#333;
line-height:18px;
padding-left:7px;
border-left:1px solid #ddd;
}
#bottomrightcontent, #legende p{
margin-top:3px;
}
#legende{
width:154px;
margin-top:14px;
font-size:13px;
color:#333;
line-height:18px;
padding-left:7px;
border-left:1px solid #ddd;
}
.legende {
color:#CCC;
}

/******* FOOTER *******/
#footer{
margin:0 auto;
clear:left;
width:850px;
height:50px;
}
#centerfooter {
float:right;
width:480px;
margin-top:31px;
height:22px;
background:#333;
}
#centerfooter li {
display:inline;
}
#centerfooter li a {
display:block;
float:left;
height:22px;
width:91px;
margin-right:25px;
}
#item1 a{
background:url(_templates/contact.jpg) 7px -17px no-repeat;
}
#item1 a:hover{
background:url(_templates/contact.jpg) 7px 3px no-repeat;
}
#item2 a{
background:url(_templates/plan_acces.jpg) 0 -17px no-repeat;
}
#item2 a:hover{
background:url(_templates/plan_acces.jpg) 0 3px no-repeat;
}
#item3 a{
background:url(_templates/newsletter.jpg) 5px -17px no-repeat;
}
#item3 a:hover{
background:url(_templates/newsletter.jpg) 5px 3px no-repeat;
}
#item4 a{
background:url(_templates/neuf_bref.jpg) 5px -17px no-repeat;
}
#item4 a:hover{
background:url(_templates/neuf_bref.jpg) 5px 3px no-repeat;
}
#rightfooter {
float:right;
}
#mentions{
float:left;
width:220px;
height:25px;
margin:30px 7px 0 0;
font-size:11px;
}
#mentions li{
display:inline;
float:left;
margin-right:7px;
}
#logobox {
background: url(_templates/logo_psconseil.jpg) top right no-repeat;
}
#logobox a {
display:block;
float:left;
height:25px;
width:25px;
}
/******* POPUP INFOS LEGALES *******/
#container_mentions {
background:#FFF;
overflow:auto;
padding:10px;
}
#texte_mentions_legales{
font-size:12px;
line-height:15px;
}
#texte_mentions_legales h4{
border-bottom:1px solid #003366;
color:#adafaf;
}
#texte_mentions_legales li{
list-style-type:circle;
margin-left:50px;
}

/***  ***/
.container_prune div#fancy_overlay {
background-color: #6E2585;
}
.pagination li{
display:inline;
margin:7px;
}
.detail_news_orange, .detail_news_vert, .detail_news_violet, .detail_news_prune, .detail_news_generique {
padding-bottom:7px;
border-bottom:2px solid #eee;
}
.detail_news_orange, .detail_news_vert, .detail_news_violet, .detail_news_prune img {
float:left;
margin:0 20px 10px 0;
}
.detail_news_orange h4{
color:#FB4F14;
}
.title_news_orange {
color:#FB4F14;
margin:7px 0 7px 0;
font-size:16px;
}
.detail_news_vert h4{
color:#C9DD03;
}
.title_news_vert {
color:#C9DD03;
padding:7px 0 7px 0;
font-size:16px;
}
.detail_news_violet h4{
color:#9B1889;
}
.title_news_violet {
color:#9B1889;
padding:7px 0 7px 0;
font-size:16px;
}
.detail_news_prune h4{
color:#6E2585;
}
.title_news_prune {
color:#6E2585;
padding:7px 0 7px 0;
font-size:16px;
}
.detail_news_generique h4{
color:#003366;
}
.title_news_generique {
color:#003366;
padding:7px 0 7px 0;
font-size:16px;
}

.container_vert #container_mentions h4 {
color:#C9DD03;
}
.message {
	font-weight:bold;
}

#viewer_galerie {
height:610px;
width:660px;
margin:0;
padding:0;
}