/* ################# STYLES CNED.FR ### DIRCOM ### 12 avril 2007 #################### */
/*
Feuille de style institutionnelle : couleurs utilisées

Couleurs qui changent :

Couleur 1 : #a78766 (titre de la page, H1, HR)
Couleur 4 : #e0d1a9 (menu principal, bordure des images)
Couleur 7 : #76391b (H2, liens)
COuleur 7 : #f7e6dd (couleur 7 à 220 de luminosité. Imput:focus).

Couleurs constantes :

#113250 (lien onglet)
#2872a7 (lien onglet hover)
#62A6D9 (lien onglet actif)
#ede8c7 (couleur 2)
#f4f2df (couleur 2 à 220 de luminosité : colonnes, input)
#f3f1f1 (onglet infactif)
#c4c3c3 (bordure des onglets)
#363636 (couleur du texte, P, H3)
#a78766 (couleur 1 à 70 de luminosité : menu principal : séparateurs, a:hover)
#b6d6ed (conglet activ:active)
#b63c3d (onglet lock)
#823F1E (a)
#927354 (a:hover)

Les numéros des couleurs sont, de gauche à droite,
celles du tableau p. 22-23 du Guide de l'identité.
Pour la palette institutionnelle, la couleur 4
est remplacée par la couleur 3.
*/

/* ################################################################################## */
/* ##################### STYLES CNED INSTITUTIONNEL ################################# */
/* ################################################################################## */

.titre
{	font-size: 180%;
	color: #a78766;							/* couleur 1 */
	text-align: right;
	margin-right: 10;
	vertical-align:middle
}

ul		{font-size: 12px; list-style-image:url('fleche.gif'); color:#363636; margin-left: 13;
padding-left: 13; margin-top:5; margin-bottom:0}

hr {
	color:#a78766;                          /* couleur 1 */
	background-color:#a78766;               /* couleur 1 */
	height: 2px;
	border: 0;
}

input:focus
{
	background-color: #F7E6DD;               /* couleur 7, luminosité 220 */
}

/* ############################### MENU PRINCIPAL ##################################### */
/* C'est la barre sous la ligne de vie, colorée selon la gamme,                         */
/* qui accueille ou non des éléments de menu.                                           */

.menu_principal
{
	background-color: #e0d1a9;              /* couleur 4 (3 pour l'institutionnel)*/
	font-size: 14px;
	margin-top:5px;
	margin-bottom:5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight:normal;
	text-align:center;
	height:20px;
}

.menu_principal_fond
{
	background-color: #e0d1a9;              /* couleur 4 (3 pour l'institutionnel)*/
}

.menu_principal_separateur
{
	background-color: #e0d1a9;              /* couleur 4 (3 pour l'institutionnel)*/
	width: 1px;
	height:20px;
	color:#a78766;                          /* couleur 1 à 70 de luminosité */
	font-size: 12px;
	margin-top:5;
	margin-bottom:5;
}

.menu_principal a          {text-decoration:none; color:#76391B}    /* couleur 7 */
.menu_principal a:hover    {text-decoration:none; color:#a78766}    /* couleur 1 à 70 de lum. */

/* ################################## COLONNES ######################################## */
/* Ces styles définissent les colonnes à gauche et à droite                             */
/* du contenu principal de la page.                                                     */

.colonne
{	background-color:#F4F2DF;               /* couleur 2  à 220 de luminosité */
	vertical-align:top
}

.colonne p {padding-top:5px; margin: 0 10 0 10; vertical-align:top; font-size:13px; color:#363636}

.colonne h1
{	border-left:3px double #a78766;         /* couleur 1 */
	border-bottom: 1px solid #a78766;       /* couleur 1 */
	color:#a78766;                          /* couleur 1 */
	font-size:13px;	
	font-weight: bold;
	vertical-align:bottom;
	margin-top:20px;
	padding-left:5px;
}

.colonne h2
{	font-size:13px;
	color:#76391b;                          /* couleur 7 */
	margin: 1em 10 0 10;
}

.colonne h3 {font-size:13px; color:#363636; margin: 1em 10 0 10}

.colonne input {background-color: #FFFFFF}

.colonne input:focus
{
	background-color: #F7E6DD;              /* couleur 7, luminosité 220 */
}

.colonne .telephone 
{	font-size:100%;
	font-weight:bold;
	text-align : center;
	color:#A78766;                          /* couleur 1 */
}

.colonne .nf {font-size:60%}

/* ############################ CONTENU PRINCIPAL ##################################### */
/* Ces styles définissent le contenu principal de la page (colonne centrale).           */

.contenu {vertical-align:top; padding-top:10px; height:500px}

.contenu p {padding-top:5px; font-size:13px; color:#363636; margin: 0 10 0 10}

.contenu h1
{	font-size:15px;
	color:#a78766;                          /* couleur 1 */
	margin: 10 10 0 10;
}

.contenu h2
{	font-size:13px;
	color:#76391b;                          /* couleur 7 */
	margin: 1em 10 0 10;
}

.contenu h3     {font-size:13px; color:#363636; margin: 1em 10 0 10}

.contenu td     {font-size:13px; color:#363636; padding:5 10 0 10}

.contenu td p   {font-size:13px; color:#363636; margin-left:0px}

.contenu td h1
{	font-size:15px;
	color:#a78766;                           /* couleur 1 */
	margin-left:0px;
	margin-top:10px;
}

.contenu td h2
{	font-size:13px;
	color:#76391b;                           /* couleur 7 */
	margin-left:0px;
	margin-top:10px;
}

.contenu td h3	{font-size:13px; color:#363636; margin-left:0px; margin-top:10px}

.contenu ul		{font-size: 12px; list-style-image:url('carre.gif'); color:#363636; margin-left: 13; padding-left: 13}

.contenu .telephone 
{	font-size:160%;
	margin-left:100px;
	color:#A78766;							/* couleur 1 */
}

.contenu .nf {font-size:70%; margin-left:100px}

/* ####################################################################################"*/
/* ####################### STYLES IDENTIQUES POUR CHAQUE GAMME ########################"*/
/* ####################################################################################"*/

html	{overflow-y: scroll;}
body	{background-color:#ffffff;font-family:Arial;text-align:center}
#table7	{margin-left : auto; margin-right : auto}

input
{
	background-color: #F4F2DF;                          /* couleur 2, luminosité 220 */
	font-size:12px;
	height:20px
}

.bloc {background-color: #F4F2DF; margin-left:20px; margin-right:300px}  /* couleur 2, luminosité 220 */

.cadre   { border: 1px solid #EDE8C7; }                 /* couleur 2 */

a			{text-decoration:none; color:#823F1E}
a:hover		{text-decoration:underline; color:#927354}

/* ################################ ONGLETS ###########################################"*/
/* Ces styles définissent le menu d'onglets en haut de page.                            */

.onglet_actif
{	border-bottom: 1px solid #ffffff;
	border-left: 1px solid #c4c3c3;
	border-right: 1px solid #c4c3c3;
	border-top: 1px solid #c4c3c3;

	width: 114px;
	height: 19px;

	text-align: center;
	font-size:11px;
	font-weight:bold;
}

.onglet_actif a			{text-decoration:none; color: #113250}
.onglet_actif a:hover	{text-decoration:none; color: #2872a7}

.onglet_inactif
{	background-color: #f3f1f1;
		
	border: 1px solid #c4c3c3;
	
	width: 114px;
	height: 19px;
	
	text-align: center;
	font-size:11px;
	font-weight:bold;
}

.onglet_inactif a		{text-decoration:none; color: #2872a7}
.onglet_inactif a:hover	{text-decoration:none; color: #62A6D9}

.onglet_espace
{
	border-bottom: 1px solid #c4c3c3;
	border-left: 0px solid #ffffff;
	border-right: 0px solid #ffffff;
	border-top: 1px solid #ffffff;
	width: 199px;
	height: 19px;
	font-size:11px;
}

.onglet_plus
{
	border-top: 1px solid #ffffff;
	border-left: 0px solid #ffffff;
	border-right: 0px solid #ffffff;
	border-bottom: 1px solid #c4c3c3;
	height: 19px;
	text-align: center;
	vertical-align:bottom;
	font-weight: bold;
	font-size:11px;
}

.onglet_plus a			{text-decoration:none; color: #2872a7}
.onglet_plus a:hover	{text-decoration:none; color: #62A6D9}

.onglet_separateur
{
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #c4c3c3;
	width: 5px;
	height: 19px;
	color:#c4c3c3;
	text-align: center;
	font-weight: bold;
	font-size:11px;
}

.onglet_inactif_lock
{
	background-color: #f3f1f1;
	border : 1px solid #c4c3c3;
	width: 114px;
	height: 19px;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
	background-image: url('../images/lock_onglet.gif');
	background-repeat: no-repeat;
	background-position:  8px 3px;
} 

.onglet_inactif_lock a			{text-decoration : none; margin-left : 5px; color : #b63c3c} 
.onglet_inactif_lock a:hover	{text-decoration : none; color : #62a6d9}


.onglet_actif_bout
{
	border-bottom : 1px solid #ffffff;
	border-left : 1px solid #c4c3c3;
	border-right : 1px solid #c4c3c3;
	border-top : 1px solid #c4c3c3;
	width : 114px;
	height : 19px;
	text-align : center;
	font-size : 11px;
	font-weight : bold;
}

.onglet_actif_bout a 		{text-decoration : none; color : #113250}
.onglet_actif_bout a:hover	{text-decoration : none; color : #2872a7}
.onglet_actif_bout a:active	{text-decoration : none; color : #62a6d9}


.onglet_inactif_bout
{
	background-color : #f3f1f1;
	border : 1px solid #c4c3c3;
	width : 114px;
	height : 19px;
	text-align : center;
	font-size : 11px;
	font-weight : bold;
}

.onglet_inactif_bout a			{text-decoration : none; color : #ff7011}
.onglet_inactif_bout a:hover	{text-decoration : none; color : #62a6d9}
.onglet_inactif_bout a:active	{text-decoration : none; color : #ff7011}


/* ############################# PIED DE PAGE ####################################### */
/* Ces styles définissent le pied de page (copyright, références, etc.).              */

.pied_page {margin:0px; padding-left:2px; padding-right:2px; text-align: center; font-size:12px; color:#363636}

.pied_page a			{color:#000000}
.pied_page a:hover		{color:#113250}