/* -----------------------------------------
        Elements de base
   ----------------------------------------- */
html,body{
	height: 100%;
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color:#FFFFFF;
	color:#222222;
}

a       {	color:#395da7;	text-decoration:underline;}
a:hover {	color:#395da7;	text-decoration:none;}

.mise_en_valeur{	color:#395da7;	font-weight:bold;}

h1{	font-size:14px;	color:#395da7;	margin:0px;	padding:0px; }
h2{	font-size:12px;	color:#395da7;	margin:0px;	padding:0px; display: inline; }
h3{	font-size:12px;	color:#000000;  margin:0px;	padding:0px; display: inline; }
h4{	font-size:12px;	color:#F2B245;  margin:0px;	padding:0px; display: inline; }

hr { color:#000000;	size:1pt; }
img{ border: 0px; }


/* -----------------------------------------
        Structure de la page
   ----------------------------------------- */

#page, #header, #footer{
	width: 100%;
	min-width: 1000px;
}
#page{
	position: relative;
	min-height: 100%;
	margin: 0px;
	padding: 0px;
}
/*
	Utilisé pour le positionnement du pied de page

	<!--[if lte IE 6]>
		#page {
			height: 100%;
		}	
	<[endif]-->
*/

#header{
    width:100%;
    background-color:#222222;
    border-top:4px #F0B241 solid;
    
}
    /* -------------------------------------
            Main nav
       -------------------------------------*/
    #header ul#nav{
		width: 1000px;
		height: 60px;
		margin: 0px auto;
	}
	#header ul#nav ul{
		list-style-type: none;
		margin: 0px;
	}
	#header ul#nav li {
		float: left;
		cursor: pointer;
		display: block; 
	}
	#header ul#nav li a { 
		display: block; 
		text-indent: -9999px;
		margin: 0px 10px;
	}
	#header ul#nav a{
		height: 60px; 
		width: 100px;
		border: 0px;
	}

    #header ul#nav a#accueil{			background: url("../images/nav/nav-accueil.jpg") no-repeat left top;		}
    #header ul#nav a:hover#accueil{		background: url("../images/nav/nav-accueil.jpg") no-repeat left -120px;		}
	#header ul#nav a#accueil.selected{ 	background: url("../images/nav/nav-accueil.jpg") no-repeat left -60px;	    }
	
	#header ul#nav a#apropos{			background: url("../images/nav/nav-apropos.jpg") no-repeat left top;		}
	#header ul#nav a:hover#apropos { 	background: url("../images/nav/nav-apropos.jpg") no-repeat left -120px;	}
	#header ul#nav a#apropos.selected { background: url("../images/nav/nav-apropos.jpg") no-repeat left -60px;	}
	
	#header ul#nav a#produits{ 		    background: url("../images/nav/nav-produits.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#produits{	background: url("../images/nav/nav-produits.jpg") no-repeat left -120px; 	}
	#header ul#nav a#produits.selected{	background: url("../images/nav/nav-produits.jpg") no-repeat left -60px; 	}
	
	#header ul#nav a#metiers{ 		    background: url("../images/nav/nav-metiers.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#metiers{	    background: url("../images/nav/nav-metiers.jpg") no-repeat left -120px; 	}
	#header ul#nav a#metiers.selected{	background: url("../images/nav/nav-metiers.jpg") no-repeat left -60px; 	}
	
	#header ul#nav a#newsletters{ 		background: url("../images/nav/nav-newsletters.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#newsletters{	background: url("../images/nav/nav-newsletters.jpg") no-repeat left -120px; 	}
	#header ul#nav a#newsletters.selected{	background: url("../images/nav/nav-newsletters.jpg") no-repeat left -60px; 	}
	
	#header ul#nav a#actualites{ 		background: url("../images/nav/nav-actualites.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#actualites{	background: url("../images/nav/nav-actualites.jpg") no-repeat left -120px; 	}
	#header ul#nav a#actualites.selected{	background: url("../images/nav/nav-actualites.jpg") no-repeat left -60px; 	}
	
	#header ul#nav a#partenaires{ 		background: url("../images/nav/nav-partenariats.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#partenaires{	background: url("../images/nav/nav-partenariats.jpg") no-repeat left -120px; 	}
	#header ul#nav a#partenaires.selected{	background: url("../images/nav/nav-partenariats.jpg") no-repeat left -60px; 	}
	
	
	#header ul#nav a#recrutement{ 		background: url("../images/nav/nav-recrutement.jpg") no-repeat left top; 	}
	#header ul#nav a:hover#recrutement{	background: url("../images/nav/nav-recrutement.jpg") no-repeat left -120px; 	}
	#header ul#nav a#recrutement.selected{	background: url("../images/nav/nav-recrutement.jpg") no-repeat left -60px; 	}


    /* -------------------------------------
            Second nav
       -------------------------------------*/        
    #second-nav img{
        display:none;
        position:absolute;
        z-index:10;
    }
    #second-nav-wrap{
        width:100%;
        height:18px;
        background-color:#EEEEEE;
        border-bottom:1px solid #DDD;
    }
    #second-nav ul{
        margin:0px;
        padding:0px;
        display:none;
        position:absolute;
        width:250px;
        background-color:#FAFAFA;
        border:1px solid #888888;
        border-top:0px;
        z-index:9;
    }
    #second-nav ul li{
        display:block;
        width:240px;
        padding:5px;
        border-top:1px solid #888888;
        text-align:left; 
        cursor:pointer;   
    }
        #second-nav ul li:hover{
            background-color:#F2B245;
        }
        #second-nav ul li:hover a{
            color:#444;
        }
        #second-nav ul li:hover p{
            color:#555;
        }
    #second-nav ul a{
        font-size:12px;
        color:#777;
        margin:0px;
        margin-bottom:12px;
        padding:0px;
        font-weight:bold;
    }
    #second-nav ul p{
        font-size:10px;
        color:#AAA;
        margin:0px;
        margin-bottom:5px;
        padding:0px;
    }
    
    /* -------------------------------------
            Nav espace réservé
       -------------------------------------*/
    #nav a#articles{			background: url("../images/nav/nav-informations.jpg") no-repeat left top;		}
    #nav a:hover#articles, #nav a#articles.selected { 	background: url("../images/nav/nav-informations.jpg") no-repeat left -60px;	}
    #nav a#faq{ 				background: url("../images/nav/nav-faq.jpg") no-repeat left top; 	}
    #nav a:hover#faq, #nav a#faq.selected{			background: url("../images/nav/nav-faq.jpg") no-repeat left -60px; 	}
    #nav a#gestionAT{ 			background: url("../images/nav/nav-sav.jpg") no-repeat left top; 	}
    #nav a:hover#gestionAT, #nav a#gestionAT.selected{		background: url("../images/nav/nav-sav.jpg") no-repeat left -60px; 	}
    #nav a#telecharger{ 		background: url("../images/nav/nav-documents.jpg") no-repeat left top; 	}
    #nav a:hover#telecharger, #nav a#telecharger.selected{	background: url("../images/nav/nav-documents.jpg") no-repeat left -60px; 	}
    #nav a#gestioncontacts{ 	background: url("../images/nav/nav-gestioncontacts.jpg") no-repeat left top; 	}
    #nav a:hover#gestioncontacts, #nav a#gestioncontacts.selected{background: url("../images/nav/nav-gestioncontacts.jpg") no-repeat left -60px; 	}
    #nav a#formations{ 	background: url("../images/nav/nav-formations.jpg") no-repeat left top; 	}
    #nav a:hover#formations, #nav a#formations.selected{background: url("../images/nav/nav-formations.jpg") no-repeat left -60px; 	}
    #nav a#forum{ 	background: url("../images/nav/nav-forum.jpg") no-repeat left top; 	}
    #nav a:hover#forum, #nav a#forum.selected{background: url("../images/nav/nav-forum.jpg") no-repeat left -60px; 	}
    #nav a#projet{ 	background: url("../images/nav/nav-projet.jpg") no-repeat left top; 	}
    #nav a:hover#projet, #nav a#projet.selected{background: url("../images/nav/nav-projet.jpg") no-repeat left -60px; 	}
	
	
/* -------------------------------------
            Contenu
   -------------------------------------*/
#content, #contentEspace, #contentAdmin{
	width: 1000px;
	margin: 25px auto 0px auto;
	padding-bottom: 80px;
}
.contenu{
	border: 1px solid #DDDDDD;
}
.titre{
	border:1px solid #F2B245;
	background-color:#FBE8C7;
	padding:3px;
	margin-bottom:5px;
	text-align:center;
	font-weight:bold;
}
#logo_octa{
	width:140px;
	height:90px;
	margin-bottom:20px;
}
#logo_divalliance{
	width:140px;
	height:90px;
	margin-bottom:20px;
}
#box-gauche, #box-droite{
	width: 160px;
}
#box-gauche{
	float: left;
}
#box-droite{
	float: right;
}
#box-droite h1, #box-gauche h1{
	margin: 0px 0px 4px;
	text-align:center;
	padding:2px;
	border-bottom:1px solid #DDD;
}
#box-contenu{
	width: 650px;
	margin: 0px auto;
}
	#box-gauche .contenu, #box-droite .contenu{
		padding: 5px 7px;
		background-color:#FAFAFA;
	}
	#box-contenu .contenu{
		padding: 5px 20px 10px;
		border: 1px #f2b245 solid;
		border-top: 0px;
		border-bottom:0px;
		margin-bottom:20px;
	}
	#actualite{
		overflow: hidden;
	}
	#actualite h1{
		margin: 0px 0px 5px;
	}
	#actualite .date{
		font-size: 10px;
		margin-bottom: 10px;
	}
	#actualite .lien{
		margin-left: 100px;
		margin-bottom: 15px;
	}
	
	#box-droite .contenu h3{
		color: #000000;
		text-decoration:underline;	
	}
	
#contentEspace #box-contenu{
    width: 800px;
    margin: 0px;
}
#contentAdmin #box-contenu{
    width: 1000px;
    margin: 0px;
}

#contentAdmin h1{
	margin-bottom: 10px;
}



/* -----------------------------------------
                Footer
   ----------------------------------------- */
#footer-wrap{
    position:absolute;
    bottom:0px;
    width:100%;
}
#footer-wrap #footer{
    background-color:#222222;
    height:60px;
    border-top:1px solid #000000;
}
#footer-wrap #footer .content{
    width:1000px;
    margin-left:auto;
    margin-right:auto;
}
#footer-wrap #footer .content ul{
    float:left;
    list-style-type:none;
    margin:0px;
    padding:0px;
}
#footer-wrap #footer .content ul li{
    padding:0px;
    margin:0px;
    height:14px;
}
#footer-wrap #footer .content ul li a{
    color:#BBBBBB;
    font-size:11px;
    text-decoration:none;
}
#footer-wrap #footer .content ul li a:hover{
    text-decoration:underline;
}
#footer-wrap #footer .content ul li a.presse{
    color:#F2B245;
}

#footer-wrap #footer .content .adresse{
    float:right;
    width:250px;
    font-size:11px;    
    color:#BBBBBB;
}

#footer-wrap #footer .content .adresse a{
    font-size:11px;
    color:#555555;
    text-decoration:none;
}
#footer-wrap #footer .content .adresse a:hover{
    text-decoration:underline;
}

#footer-wrap #footer .content .adresse h1{
    margin:0px;
    padding:2px;
    font-size:11px;
    color:#F2B245;
}
#footer-wrap #footer .content .adresse h1 a{
    color:#F2B245;
}

#footer-wrap #info-legale{
    border-top:1px solid #333333;
    background-color:#111111;
    height:20px;
    text-align:center;
    color:#555555;
    font-size:11px;
    line-height: 16px;
}
#footer-wrap #info-legale a{
    color:#555555;
    text-decoration:none;
}
#footer-wrap #info-legale a:hover{
    text-decoration:underline;
}
	
/* -----------------------------------------
        Formulaire
   ----------------------------------------- */
fieldset{
	border: 0px;
	margin: 0px;
}
fieldset p{
	clear: both;
}
.champ{
	border: 1px solid #395da7;
}

#espaceClient .text{
	display: block;
	float: left;
}
#espaceClient input, #espaceClient p{
	margin: 0px 0px 2px;
}
#espaceClient .champ{
	width:120px;
}
.lblEtoile{
	color:#FF0000;
	font-weight:bold;
	font-size:18px;
}
.libelle
{
    width:150px;
    vertical-align:top;
}

.textBoxDemande
{
    border:1px solid #888;
    background-color:#FFF;
    padding:3px;
    height:200px;
    overflow:auto;
}

/* -----------------------------------------
        tabLigne
   ----------------------------------------- */
.tabEntete
{
    border:1px solid #F2B245; 
    background-color:#FBE8C7; 
    padding:2px;
    font-weight:bold;
    margin-bottom:10px;
}
.tabLigne
{
    border:1px solid #DDDDDD; 
    background-color:#FAFAFA; 
    padding:2px;
    margin-top:3px;
}
.tabLigne:hover
{
    border:1px solid #DDDDDD; 
    background-color:#EAEAEA; 
    padding:2px;
    margin-top:3px;
}
.tabLigneSujet{
	border:1px solid #8DD33A;
	background-color:#E4FBC7;
	padding:2px;
	margin-top:3px;
}
    .tabLigneSujet:hover{
	    background-color:#CEF49D;
    }
.tabLigneReponse, .tabLucie{
	border:1px solid #2882D7;
	background-color:#BECFDF;
	padding:2px;
	margin-top:3px;
}
    .tabLigneReponse:hover, .tabLucie:hover{
	    background-color:#A4C3E0;
    }

.tabPlaceDisponible{
	border:1px solid #BECFDF;
	background-color:#DAE5EE;
    padding:2px;
    margin-top:3px;
	color:#999;
}

.tabAlerte
{
    border:1px solid #E60000;
	padding:2px;
    margin-top:3px;
	background-color:#FFBDBD;
	text-align:center;
	font-weight:bold;
}
    .tabAlerte:hover
    {
        background-color:#FFBDBD;
    }

.tabLigneErr
{
    border:1px solid #E02E2E;
    background-color:#FED3D3;
    padding:2px;
    margin-top:3px;
}
.tabLigneErr:hover
{
    border:1px solid #E60000;
    background-color:#FFBDBD;
    padding:2px;
    margin-top:3px;
}
    .tabLigne .cadreDerniereRep
    {
        border-left:1px solid #DDDDDD;
        padding-left:5px;
    }
    .tabLigneReponse .cadreDerniereRep
    {
        border-left:1px solid #2882D7;
        padding-left:5px;
    }
    .tabLigneSujet .cadreDerniereRep
    {
        border-left:1px solid #8DD33A;
        padding-left:5px;
    }

.tabInfo{
	padding:5px;
    margin-top:3px;
	padding-left:50px;
    border:1px solid #DDDDDD;
	background:url('../images/base/info.gif') #FAFAFA no-repeat 10px 3px;
}
.erreur, .erreur_etoile
{
    font-weight:bold;
    color:#FF0000;
}
    .erreur_etoile
    {
        font-size:18px;
    }


/* -----------------------------------------
        FAQ
   ----------------------------------------- */

.panelFAQText{
	border:1px solid #DDDDDD;
	margin-bottom:15px;
	padding:4px;
	background-color:#FAFAFA;
}

.panelFAQTit{
    border:1px solid #F2B245;
	margin-bottom:15px;
	padding:4px;
	background-color:#FBE8C7;
	font-weight:bold;
}
.btFAQ{
	cursor: pointer;
	font-size:10px;
	color:#222222;
}
.btFAQTit{
    cursor: pointer;
}

/* -----------------------------------------
        POP UP
   ----------------------------------------- */
.btFermerPop
{
    text-align:center;
    margin-bottom:10px;
    margin-top:10px; 
    padding-bottom:2px;
    border-bottom:1px solid #DDD;
    cursor: pointer;
	font-size:10px;
	color:#888888;
}
.btFermerPop:hover
{
    border-bottom:1px solid #444444;
    color:#444444;
}




/* -----------------------------------------
        INFO BULLES
   ----------------------------------------- */
.infoAjouterPJ
{
    position:absolute;
    width:200px;
    border:1px solid #000;
    display:none;
}
.infoAjouterPJ .textInfo
{
    color:#FFF;
    padding:5px;
}
.infoAjouterPJ .fondInfo
{
    top:0px;
    left:0px;
    position:absolute;
    background-color:#000000;
    width:100%;
    height:100%;
    filter: alpha(opacity=60);
    -moz-opacity : 0.6;
    opacity: 0.6; 
}
.infoAjouterPJ img
{
    position:absolute;
}

.notifPublic
{
    background-color:#FEC170;
    border:1px solid #F39409;
}
.navMenuContenu
{
    margin-bottom:20px;
}
.navMenuContenu a
{
    margin-right:20px;
}

.titreMaintenance
{
    font-weight:bold;
    font-size:16px;
    color:#EE1111;
    text-decoration:underline;
}
.infoMaintenance
{
    border-top:1px dashed #AAA; 
    margin-top:50px; 
    padding-top:10px;
}


/* -----------------------------------------
        Boutons navigation lien
   ----------------------------------------- */
.btNavLien, .btNavLienBandeau
{
    display:inline-block;
	border-top:1px solid #CCCCCC;
	border-bottom:1px solid #CCCCCC;
	
	background:#FAFAFA;
	
	padding: 6px 20px 6px 40px;
    margin: 10px 10px 15px 0px;
}
.btNavLienBandeau
{
	padding: 8px 10px 8px 40px;
    margin: 10px 0px 5px 0px;
    font-size:11px;
}
    .btNavLien:hover, .btNavLienBandeau:hover
    {
        background-color:#F1F1F1;
    }

.navRetour   {	background:url('../images/base/retour.gif') #FAFAFA no-repeat 10px 4px;}
.navResultat {	background:url('../images/base/navResultat.gif') #FAFAFA no-repeat 10px 4px;}
.navNouveau  {	background:url('../images/base/nouveau.gif') #FAFAFA no-repeat 10px 4px;}
.navAbo      {	background:url('../images/base/abo.gif') #FAFAFA no-repeat 10px 4px;}
.navOrdre    {	background:url('../images/base/navOrdre.gif') #FAFAFA no-repeat 10px 4px;}
.navListe    {	background:url('../images/base/navListe.gif') #FAFAFA no-repeat 10px 4px;}
.navFermer   {	background:url('../images/base/navFermer.gif') #FAFAFA no-repeat 10px 4px;}


.editArticle
{
    margin-bottom:5px;
    text-align:right;
    border-bottom: 1px solid #DDD;
}
    .editArticle a  { color:#888; }
    
    
.jVide  {    color:#AAAAAA;   }