/* CSS Document 
 * © Cameleo Design
 * http://www.cameleo-design.fr
 */
 
@charset "utf-8";

/* ----------------------------------------------------------------------------------------------
   -----------------------------------    DECLARATIONS GENERALES    -----------------------------
   ---------------------------------------------------------------------------------------------- */

* {
margin:0;
padding:0;
}

img, a img { border: 0 none; display: inline;}

a {
font: normal 11px Arial, Tahoma, sans-serif;
color: #eee;
text-decoration : none;
}

a:hover {
color: #c0babe;
}

body {
background: #732452 url(../img/bg.gif) top left repeat-x;
font: normal 11px Arial, Tahoma, sans-serif;
color: #ddd;
}

.dispnone { display: none; }
.vishidden { visibility: hidden; }
.center { margin: 0 auto; }
.right { float:right; }
.red { color: #f00; font-weight:bold; }
.date { color: #fc3 
font-weight:bold; 
}
.blue { color: #02d; font-weight:bold; }

.lineclear{
height:1px;
clear:both;
}

.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}

address {
font-style:normal;
font-size: 10px;
}

input, textarea {
border:solid 1px #555;
font: normal 10px Arial,Tahoma,sans-serif;
color:#c8b9c2;
background:#333;
}

legend {
padding: 2px;
font: bold 12px Arial,Tahoma,sans-serif;
}
fieldset { 	
border: 1px solid #e50;
padding: 5px;
}

/*______DIVS FLASHS DANS LESQUELLES ECRIT SWFOBJECT_________*/

div#flashRefs {
width:150px;
height:80px;
margin:0 auto;
}


div#infos {
position:absolute;
top: 320px;
left:220px;
display:none;
padding: 1em;
background-color: #000;
font-size: 2.4em;
color: #e50;
z-index: 150;
}


/* ----------------------------------------------------------------------------------------------
   -----------------------------------    STRUCTURE NIV1    -------------------------------------
   ---------------------------------------------------------------------------------------------- */

#ombre{
width: 920px;
min-height: 700px;
position: relative;
background: url(../img/ombre.gif) 0 111px no-repeat;
margin: 0 auto;
}

#ombreB {
height: 10px;
background: url(../img/bg-ombre-b.gif) repeat-x;
}

#padd-bas { padding: 0 10px; }
html>body #ombre { height:auto; } /* OPERA */


/* ----------------------------------------------------------------------------------------------
   -----------------------------------    HEADER    ---------------------------------------------
   ---------------------------------------------------------------------------------------------- */

/* __________ PARTIE HAUTE _______________ */

#bandeau{
	height:112px;
	padding-top: 25px;
	background:#000 url(../img/bg-haut.jpg) left top no-repeat;
}

#logo{
	width:580px;
	padding-left:10px;
	float:left;
	margin-top:30px;
}

/* __________ PARTIE GAUCHE _______________ */

#bandeau h2{
	font-size:12px;
	color:#fff;
	float:left;
	padding-top:75px;
}

#logo img{
	float:left;
}

/* __________ PARTIE DROITE _______________ */

#loginpass{
	width:238px;
	float:right;
	padding:17px 17px 0 0;
	text-align:right;
	height:60px;
	margin:32px 30px 0 0;
}

#readspeaker{
	margin:9px 0 19px 0;
}

#champs{
	background:url(../img/bg_champs.gif) no-repeat 0px 0px;
	width:253px;
	height:32px;
	padding-left:9px;
}

#champs input{
	margin-top:9px;
	height:13px;
	width:102px;
	float:left;
	padding-left:4px;
}

.champ_id{
	margin-right:6px;
}

#champs #bouton{
	font_size:12px;
	color:#999;
	display:block;
	width:31px;
	height:15px;
	background:none;
	border:none;
	cursor:pointer;
}

/* ----------------------------------------------------------------------------------------------
   -----------------------------------    MENU    -----------------------------------------------
   ---------------------------------------------------------------------------------------------- */

div#menuBg {
height: 41px;
background: url(img/bg_menu.gif) repeat-x #000;
}

div#menu {
width: 553px;
margin: 0 auto;
}

div#menu ul { list-style-type:none; }

dl {
z-index: 200;
float: left;
position: relative;
display: inline;
}

#menu dl dt a {
display: block;
height: 36px;
font: bold 10px/12px Tahoma, Arial, sans-serif;
color: #000;
text-decoration: none;
}

div#menu dl dt a:hover { color: #fdd; }
div#menu dl dd ul { padding: 5px; }
div#menu dl dd img { cursor:pointer; }

div#menu dl dt a#navseitosei {
width: 70px;
background: url(../img/menu/menu-seitosei.jpg) no-repeat 0 0;
}

div#menu dl dt a#navmetiers {
width: 83px;
background: url(../img/menu/menu-metiers.jpg) no-repeat 0 0;
}

div#menu dl dt a#navpdv { /* Points de vue */
width: 116px;
background: url(../img/menu/menu-pdv.jpg) no-repeat 0 0;
}

div#menu dl dt a#navfocus {
width: 70px;
background: url(../img/menu/menu-focus.jpg) no-repeat 0 0;
}

div#menu dl dt a#navRecrut {
width: 115px;
background: url(../img/menu/menu-recrutement.jpg) no-repeat 0 0;
}

div#menu dl dt a#navContact {
width: 99px;
background: url(../img/menu/menu-contacts.jpg) no-repeat 0 0;
}

div#menu dl dt a.focus {
background-position: 0px -29px;
}

/* ----------------------------------------------------------------------------------------------
   -----------------------------------    MENU DEROULANT    -------------------------------------
   ---------------------------------------------------------------------------------------------- */

div#menu dl dd {
position:absolute;
z-index: 100;
top:36px;
padding-top: 5px;
display:none;
width:250px;
}

dd#deroulseitosei { 
left: 4px; 
background : url(../img/menu/deroulant/seitosei-haut.gif) no-repeat left top;
}
dd#deroulmetiers { 
left: 10px;
background : url(../img/menu/deroulant/metiers-haut.gif) no-repeat left top;
}
dd#deroulpdv { 
left: 9px;
background : url(../img/menu/deroulant/pdv-haut.gif) no-repeat left top;
}
dd#deroulfocus {
left: 4px;
background : url(../img/menu/deroulant/focus-haut.gif) no-repeat left top;
}

div#menu dl dd div {
background: url(../img/menu/deroulant/bg.gif) no-repeat left bottom;
}

div#menu dl dd div ul li, div#menu dl dd div ul a { /* lien inactif/actif du menu déroulant */
font: bold 11px Arial, Tahoma, sans-serif;
color: #000;
text-decoration:none;
}

div#menu dl dd div ul a:hover { color: #fed; }

div#menu dl dd div ul li ul li, div#menu dl dd div ul li ul li a { /* lien inactif/inactif du menu déroulant 2e niveau */
font: bold 10px Arial, Tahoma, sans-serif;
color: #fff;
}

div#menu dl dd div ul li ul li a:hover { color: #fff; }

/* ----------------------------------------------------------------------------------------------
   -----------------------------------    CONTENU    --------------------------------------------
   ---------------------------------------------------------------------------------------------- */

div#contenu{
background:#000;
}

div#contact{
margin: 40px 0 0 38px;
}

/* __________ RUBRIQUE GAUCHE _______________ */

div#rubrique_gauche{
position: relative;
width: 250px;
padding: 0 0 0 12px;
float: left
}

div#rubrique_gauche h3{ /* Grands titre sur la gauche des pages génériques */
font-size: 14px;
color: #ae4482;
}

.firstletter3 {
font-size: 18px;
}

div#rubrique_gauche h4 { /* Titres en vishidden sous h3 */
font-size: 18px;
font-weight: bold;
}

h5 { /* Dates pour news */
font: normal 12px Arial, Helvetica, sans-serif;
color: #af4684;
}

/*   cadre   */

div#rubrique_gauche div.cadreMetierTxtBg {
line-height: normal;
font-size: 11px;
}

div#rubrique_gauche div.cadreMetierTxt {
background: url(../img/bloc-type-degrad-bd.jpg) no-repeat bottom right;
padding: 13px 7px 0px 11px;
}

div.cadreMetierTxt {
position: relative;
background: url(../img/bloc-type-degrad-bd.jpg) no-repeat bottom right;
padding: 13px 7px 0px 11px;
height: 122px;
}

img.contact {
/*border: 1px solid #eee;*/
margin-top: 10px;
}

/* __________ RUBRIQUE DROITE _______________ */

div#rubrique_droite {
position: relative;
float: right;
width: 571px;
/*height: 314px;*/
height:610px;
padding: 17px 10px 0 10px;
background: url(../img/rubDroite-bg.jpg) no-repeat;
margin-top: 17px;
overflow: auto;
}

div#rubrique_droite h3 {
font-weight: bold;
font-size: 16px;
padding-bottom: 14px;
}

div#rubrique_droite p {
font-size: 12px;
color: #eee;
}
div#rubrique_droite div#images img { 
display:block; 
border: 1px solid #aaa;
margin-bottom: 1em;
 }
div#rubrique_droite div#images {
float:left;
margin: 0 5px;
}


/* ----------------------------------------------------------------------------------------------
   -----------------------------------    FOOTER    --------------------------------------------
   ---------------------------------------------------------------------------------------------- */

div#footer {
height: 18px;
background: url(../img/bg_footer.gif) repeat-x;
padding: 25px 15px 0 15px;
}

div#footer p { float:left; }
div#footer p.right{ float:right; }


/* ----------------------------------------------------------------------------------------------
   -----------------------------------    ACCUEIL    --------------------------------------------
   ---------------------------------------------------------------------------------------------- */

/* __________ CADRES HAUT _______________ */

div.cadreMetier {
position: relative;
width: 200px;
padding: 0px 12px;
float: left;
background-color: #000;
}

/* __________ TEXTE HAUT CADRE _______________ */


div.cadreMetier h3 {
font-weight: bold;
font-size: 14px;
color: #fff;
font-variant: small-caps;
}

.firstletter { font-size:16px; }

p.orange {
font-size: 11px;
color: #b93983;
}

.firstletter2 { font-size:15px; }

/* __________ BACKGROUND CADRE _______________ */


div.cadreMetierTxtBg{
background: url(../img/bloc-type-degrad-hg.jpg) no-repeat;
margin-top: 9px;
line-height: 10px;
}

div.cadreMetierTxt { 
background: url(../img/bloc-type-degrad-bd.jpg) no-repeat bottom right;
padding: 13px 7px 0px 11px;
min-height: 120px;
}

div.cadreMetier div.cadreMetierTxtBg ul { list-style-type:none; }
div.cadreMetier div.cadreMetierTxtBg li { padding-bottom:1em; line-height:1.1em; }
html>body div.cadreMetierTxt { height:auto; }

/* __________ CADRES BAS _______________ */

div#cadres-bas {
margin: 12px 0 0 8px;
width: 880px;
height: 137px;
background: url(../img/bg_cadres-bas.gif) no-repeat;
padding: 5px 0 0 1px;
}

div.cadreRefsDroite {
float: right;
width: 183px;
height: 111px;
padding: 8px 16px 8px 9px;
background: url(../img/bg-cadre-ref.gif) no-repeat;
}

div.cadreTypeBas {
background: url(../img/bg_cadre2.gif) no-repeat;
width: 183px;
height: 111px;
margin-right: 20px;
padding: 8px 10px 8px 9px;
float: left;
}

h3.h3_news {
font-size: 10px;
background: url(../img/bg_h3_news.gif) no-repeat;
display: block;
height: 14px;
width: 133px;
padding-bottom: 10px;
}


h3.h3_focus {
font-size: 10px;
background: url(../img/bg_h3_focus.gif) no-repeat;
display: block;
height: 14px;
width: 37px;
}

h3.h3_etude {
font-size: 10px;
background: url(../img/bg_h3_etude.gif) no-repeat;
display: block;
height: 14px;
width: 37px;
}

.etude{
font-size: 12px;
text-align:center;
}

.etude strong{
font-size: 14px;
}

.etude a{
font-size: 12px;
}

.etude a:hover{
font-size: 12px;
color:#b84b8b;
}

h3.h3_ref{
font-size: 10px;
background: url(../img/bg_h3_references.gif) no-repeat;
display: block;
height: 12px;
width: 69px;
padding-bottom: 12px;
}

/* ----------------------------------------------------------------------------------------------
   -----------------------------------    ADMIN    ----------------------------------------------
   ---------------------------------------------------------------------------------------------- */
 
span.orange-clair { color: #91326a; }
span.orange-vif { color: #b84b8b;
font-weight:bold; }
span.gros { font-size: 14px; }

div#rubrique_droite fieldset p{
float:none;
margin: 3px 0;
}

.admin {
z-index: 150;
padding: 5px;
background-color: #333;
border: 1px solid white;
}

.admin a {
font: bold 11px Arial, Tahoma, sans-serif;
color: #f20;
text-decoration: none;
}