BODY{
	font:12px Arial, Helvetica, sans-serif;
	margin:0;
	line-height:18px;
	color:#333;
	background:#ebebeb url(/images/background.jpg) no-repeat left top;
}
BODY.blanc{
	background:#fff;
	padding:20px
}

td, textarea, input {
font-family:Arial, Helvetica, sans-serif;
font-size:12px}

.button {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
background: url(/images/degrade-gris.gif) repeat-x;
padding:2px;
text-transform:uppercase;
font-weight:bold;
height:30px;
border:1px outset #666666;
cursor:pointer;
}

/*---------------------images bandeau include haut----------------------*/
#bandeau {
background:url(/images/bandeau_pf.jpg) no-repeat;
height:90px;
width:1000px;
border:0px;
}
/*---------------------video----------------------*/
#video {
background:#f5f5f5 url(/images/background-video.gif) no-repeat left top;
vertical-align:middle;
margin-top:20px;
text-align:center;
}

#video2 {
background:#f5f5f5 url(/images/background-video.gif) no-repeat left top;
vertical-align:middle;
margin-top:0px;
text-align:center;
}
a.mb
{
	color:#17248d;
	text-decoration: underline;
	font-size:12px
}
a.mb:hover
{	color:#000;

}

a.mb2
{
	color:#17248d;
	text-decoration: underline;
	font-size:12px
}
a.mb2:hover
{
	color:#000;
}



/*-----------------------------liens ---------------------------------------*/
 a
{
	color: #000000;
	text-decoration: none;
	font-size:12px
}
 a:hover
{
	color:#17248d;
}
/*----------------------- menu -------------------------*/
#menu 
{
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	background:#f5f5f5;
	height:24px;

}

#menu a
{
	color: #000000;
	text-decoration: none;
	text-transform:uppercase;
	font-weight:bold;
	display:block;
	padding:4px 5px 4px 5px;
	border-right:1px solid #ccc;
	text-align:center
}

#menu a:hover {
	text-decoration: none;
	background:#333;
	color:#FFFFFF;	
}

/*----------------------- Couleurs-------------------------*/

#menu a:hover.formation
{
	background: #c60c46;
	color:#FFFFFF;	
}
.formation{color:#c60c46;}

#menu a:hover.videochat
{
	background: #f0a200;
	color:#FFFFFF;	
}
.videochat{color:#f0a200;}

#menu a:hover.compte
{
	background: #db58c2;
	color:#ffffff;	
}
.compte{color: #db58c2;}

#menu a:hover.actualites
{
	background: #00c5ef;
	color:#ffffff;	
}
.actualites{color:#00c5ef;}

#menu a:hover.ressources
{
	background: #C0C0C0;
	color:#FFFFFF;	
}
.ressources{color:#C0C0C0;}

#menu a.deconnexion
{
	color:#fff;	
	border-right:0;
	background: #004c9e;
}
#menu a:hover.deconnexion
{
	background: #fff;
	color:#004c9e;	

}



/*------------------------------titres-------------------------------*/
h1{
	font-size:22px;
	font-weight: bold;
	padding-bottom:5px;
}
h2 {
	font-size:14px;
	font-weight: bold;
	margin:0;
	padding-bottom:5px;
	text-transform:uppercase
}
h3  {
	font-size:14px;
	font-weight: bold;
	margin:4px 0 4px 0;
}

h4{
	font-size:11px;
	font-weight: bold;
	margin:0;
}
/*-----------------------------liste -----------------------------*/

li{
list-style-type: square;
}
ul {
margin:5px 0 5px 0;
padding-left:15px
}


/*---------------------milieu de page----------------------*/
#milieu{
width:1000px;
background:#FFFFFF;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:8px solid #ccc;
}
#milieu td.centre {
padding:15px;
width:100%;
height:400px;
text-align:left;
}
#milieu td.tableau{
width:100%;
padding:5px;
background: #f5f5f5;
text-transform:uppercase;
border-left:20px solid #ccc
}
#milieu td.tableau2{
width:100%;
border-left:20px solid #f5f5f5;
border-bottom:1px solid #e1e1e1;
padding:4px 0 4px 10px;
background: #fff;
}
#milieu td.tableau3{
width:100%;
border-left:20px solid #f5f5f5;
padding:8px 0 8px 10px;
background: #fff;
}

#milieu .button {
font-family:Arial, Helvetica, sans-serif;
font-size:9px;
background: url(/images/degrade-gris.gif) repeat-x;
padding:2px;
text-transform:uppercase;
font-weight:bold;
height:18px;
border:1px outset #666666;
cursor:pointer;
}
/*---------------------bas de page----------------------*/
#bas td {
width:1000px;
padding:5px;
height:30px
}

/*------------------------ login --------------------------*/
#login{
width:600px;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:5px solid #004c9e;
background:#FFFFFF;
}

#login a{
text-decoration: underline;
color: #333333;
}

#login a:hover{
text-decoration: underline;
color:#0066CC;
}
/*-----------------------------cadres gris accueil-----------------------*/
#cadre a {
font-size:14px
}

.cadreformation {
width:220px;
height:250px;
vertical-align:top;
background: #f5f5f5 url(/images/banniere-accueil-formation.jpg) top no-repeat;
padding:55px 15px 10px 15px;
border:1px solid #CCCCCC;
border-left:10px solid #CCCCCC

}
.cadreactu {
width:220px;
height:250px;
vertical-align:top;
background: #f5f5f5 url(/images/banniere-accueil-actu.jpg) top no-repeat;
padding:55px 15px 10px 15px;
border:1px solid #CCCCCC;
border-left:10px solid #CCCCCC

}
.cadrecompte {
width:220px;
height:250px;
vertical-align:top;
background: #f5f5f5 url(/images/banniere-accueil-compte.jpg) top no-repeat;
padding:55px 15px 10px 15px;
border:1px solid #CCCCCC;
border-left:10px solid #CCCCCC

}

/*--------------------images alignement ----------------------------------*/
img{
	margin: 0px;	
	padding: 0px;
	vertical-align:middle;

}

.imgg{
	float:left;
	margin-right: 12px;	
	vertical-align: top;
	margin-bottom: 12px;	

}

/* ----------------------Boutons------------------------- */
a.boutongris {
font-family:Arial, Helvetica, sans-serif;
	color:#333333;
    background: transparent url(/images/bouton-droite.png) no-repeat scroll top right;
	display:inline-block;
    height:32px;
    margin:5px 6px 5px 0;
    padding-right: 17px; /* sliding doors padding */ 
    text-decoration: none;
	font-size:12px;
	cursor:pointer;
	width:auto
}

a.boutongris span {
    background: transparent url(/images/bouton-gauche.png) no-repeat;
	display: block;
	height:24px;
    line-height:25px;
    padding: 4px 0 4px 10px;
} 

a.boutongris span img{
	border:0px;
	margin:0px;
	float:left;
	position:relative;
	top:2px;
	padding-right:8px;
	background-image: url(Nouveau);
}
a.boutongris:hover {
   /* background-position: bottom right;*/
   color:#9F9F9F;
   /* outline: none; hide dotted outline in Firefox */
}

a.boutongris:hover span {
   /* background-position: bottom left;
    padding: 4px 0 4px 10px;  push text down 1px */
}