/*---------------------------------------------------------------------------------------------------
!                 Feuille de style (CSS2) développée, écrite et commentée                      !
!	      par Josée Valérie Murat  pour le site FromCantoCanvas.fr                     !
-----------------------------------------------------------------------------------------------------*/

/* ---------------------------------------------------------------------------------------------------
+				ELEMENTS  PRINCIPAUX  			                  +
-----------------------------------------------------------------------------------------------------*/

body { /* La totalité de l'écran */
	margin: 0;
	padding: 0;
	text-align: center;
	background: rgb(255,255,255);
	width: 100%;  
}
div#page { /* La page du site contient absolument tous les autres éléments */
	margin-top : 0px;
	margin-left: auto;
	margin-right: auto; 	
	padding-top: 0px; 
	width: 780px;
	/* height: 900px; */
	background-image: url("log5.jpg");
	background-repeat: no-repeat;
	/* background: rgb(244,245,249); */
	color : #0998f6; 
	font-family : arial, sans-serif; 
	font-size: 95%; 
}

/* ---------------------------------------------------------------------------------------------------
+				  Menu d'accessibilité     			                  +
-----------------------------------------------------------------------------------------------------*/

div#Accessibilite {display : none;}


/* ---------------------------------------------------------------------------------------------------
+				           Bandeau titre     	    		                             +
-----------------------------------------------------------------------------------------------------*/

div#header { 
	margin-top : 0;
	margin-left : 275px;
	padding: 0;
	width: 500px;
	height:100px;
	background: transparent;	
	text-align: right;
	border-bottom : solid 1px gray; 
/* 	color: gray; */
	font-size: 80%;
}
p.gros_titre {
	margin-top: 25px;
	padding: 0px;
	font-size: 132%;
	font-weight: bold;
	} 
p.petit_titre {
	margin: 0px;
	padding: 0px;
	font-size: 122%;
	font-weight: bold;
	color: black;
	}
sup.petit_titre {
	margin-top: 2px;
	line-height: 2%; 

/* 	padding: 0px;
	font-size: 122%;
	font-weight: bold;
	color: black; */
	} 
/* div#header p {display: none;} */

/* ---------------------------------------------------------------------------------------------------
+	            Menu principal horizontal (les différents services)   	                  +
-----------------------------------------------------------------------------------------------------*/

div#menu{display : none;}


/* ---------------------------------------------------------------------------------------------------
+		              Zone de corps de texte de chaque page     	                  +
-----------------------------------------------------------------------------------------------------*/

div#photo { /*photo exceptionnelle à mettre en avant */
	background: white;
	/* color: rgb(190,4,4); */
	/* width : 215px; */
	margin-left : 2%;
	margin-right : 25%;
	margin-top : 5%;
	margin-bottom : 2%;
	/* border : solid 1px red; */
	/* font-weight: bold; */
	font-family : arial, sans-serif; 
	font-size: 120%;
	text-align: center;
}
div#photo p  {
	color : rgb(76,76,76);
	font-weight: normal;
	/* margin-bottom: 55px; */
	margin-right : 95%;
}

div#signal {display : none;}


div#corps { 	
	margin-top: 5%; /*Cela marche mieux pour IE6 et n'est pas trop génant pour les autres navigateurs*/
	margin-left: 0;
	margin-right: 0px;
	padding: 1%; 
	width: 760px;
	height: 98%;
	min-height: 400px;
	/* background: rgb(246,246,249);*/
	color : rgb(76,76,76);  
 	/* border : solid 1px #cccccc;
	border-top : transparent; */
	text-align: justify; 
	font-family : arial, sans-serif; 
	font-size: 95%; 
	overflow: auto;
}
div#corps  h1{
	color: #0998f6;
	font-family : arial, sans-serif; 
	font-size: 160%;
	text-align: left;
}
div#corps  h1.bio{
	color: rgb(120,3,81);
	font-family : arial, sans-serif; 
	font-size: 120%;
	text-align: left;
}
div#corps  h1 span.stitre{
	color: rgb(120,3,81);
	font-family : arial, sans-serif; 
	font-size: 70%;
	text-align: center;
}
div#corps  h2{
	color: #0998f6;
	font-family : arial, sans-serif; 
	font-size: 120%;
}
div#corps  h2.actu{
	background: rgb(233,231,232);
	color: rgb(103,2,69);
	margin-bottom : 5%;
	font-family : arial, sans-serif; 
	font-size: 120%;
	text-align: center;
}
div#corps  h2.wichtig{
	background: white;
	color: rgb(190,4,4);
	margin-bottom : 5%;
	border : solid 1px red;
	font-weight: bold;
	font-family : arial, sans-serif; 
	font-size: 120%;
	text-align: center;
}
div#corps  h3{
	color: #0998f6;
	font-family : arial, sans-serif; 
	font-size: 100%;
}
div#corps  h4{
	color: rgb(120,3,81);
	font-family : arial, sans-serif; 
	font-weight: normal;
	font-size: 95%;
}
#corps span.rot {
	color : red;
	font-weight: bold;
}
#corps span.titre {font-style : italic;}
#corps img {padding: 5px;}
#corps img.ico {
	padding-top: 0px;
	padding-bottom: 0px;
}
#corps a {
	color : #0998f6;
	text-decoration: none;
}
#corps a:hover {text-decoration: underline;}
#corps a:visited {color :#0998f6; }
#corps a.mail {
	color : rgb(17,17,204);
	text-decoration: underline;
}
/* #corps a:hover {text-decoration: underline;} */
#corps a:visited {color :#0998f6; }
ul.ligne {  /*  Petit menu de navigation à l'intérieur d'une page à texte trop long mais hiérarchisé en différents niveaux de titres   */
	padding-left: 0pt; 
	width: 100%;
	display : inline; 
	list-style-type : none;
	background: transparent;
	color : #990066; 
	text-align : center; 
	padding-top : 1pt;  
	overflow : auto; 
}
ul.ligne li {
	display : inline; 
	background : transparent; 
	list-style-type : none;
 	padding : 1%; 
	text-align : center; 
	overflow : auto; 
}
ul.ligne li a {
	text-decoration: none; 
	background: transparent;
	text-align : center; 
	color : #666666;
}
ul.ligne li a:hover {
	text-decoration: overline; 
	background: transparent;
	color : #990066;
}

ul.ariane { /*  équivalent de la classe .ligne pour le petit menu de navigation de la page accessibilité */
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	text-align: center;
}
ul.ariane li {
	display: inline;
}

#corps ul.plan li a { /* Lien cliquables dan le plan du site */
	text-decoration: none; 
	background: transparent;
	color : rgb(76,76,76);
}
#corps ul.plan li a:hover {
	text-decoration: underline; 
	background: transparent;
	color : #990066;
}
li.espace {
	padding-top : 5px;
}
li.wichtig {
	color : rgb(190,4,4);
	font-weight: bold;
	padding-bottom : 5px;
}
#corps ul li.wichtig a {
	color : rgb(190,4,4);
	font-weight: bold;
	text-decoration: underline; 

}
#corps span.wichtig a{
	color : rgb(190,4,4);
	font-weight: bold;
}
div.wichtig {
	background: white;
	margin-bottom : 5%;
	border-bottom : solid 1px red;
}

/* ---------------------------------------------------------------------------------------------------
+				    Menu de bas de page    			                  +
-----------------------------------------------------------------------------------------------------*/

div#bas {display : none;}


/* ---------------------------------------------------------------------------------------------------
+				             Illustrations       	     	     	                  +
-----------------------------------------------------------------------------------------------------*/

.illustration {
	margin-top : 0px;
	font-size: 85%;
	text-align: center;
}
.ill_droite {
	float : right;
	font-size: 85%;
	text-align : center;
}
.ill_gauche {
	float : left;
	font-size: 85%;
	text-align : center;
}
.legende {
	margin-top : 0px;
	padding-left: 25px;
	padding-right: 25px;
	font-size: 85%;
	text-align: center;
}
/* ---------------------------------------------------------------------------------------------------
+				         Pour éléments particuliers  		     	        +
-----------------------------------------------------------------------------------------------------*/
sup {
	font-size: 80%;
}
.droite {
	float : right;

}
.gauche {
	float : left;
}
.centre {
	text-align : center;
}
span.petit { /*  Utilisé pour certains éléments de titre des fiches biographiques */
	font-family : arial, sans-serif; 
	font-size: 80%; 
	text-align : right;
}
div.imagcentre {text-align : center; }

/* ---------------------------------------------------------------------------------------------------
+				                   Images   			                            +
-----------------------------------------------------------------------------------------------------*/

img {border: none;}