* {margin: 0; padding: 0; border: 0;}

/*--------structure de page type

la structure est comparable a une page sur base <table> avec les <tr>  class="line" et <td>  class="item"
chaque "item" doit contenir un  <div class="sap-content"></div>

exemple :

<div id="optionnel" class="line">	  	
	  <div class="item" id="myid">
	    <div class="sap-content">contenu de votre choix</div>
	  </div>
	  
	  <div class="item" id="anotherid">
	    <div class="sap-content">contenu de votre choix</div>
	  </div>
	   
	   etc.
	   ...repetter pour chaque colonne dans une ligne
	   
</div>

repetter selon les besoins, voici l'example d'une page simple

line  id=header 
line  id=breadcrumbs
line  item id=menu_gauche id=contenu id=.... autant que de colonnes
line  id=footer

-----------*/


/*--------styles de base--------------*/

body 		{
	font-family: Arial, Helvetica, sans-serif;
}
body.popup	{background-color: white;}
h1 			{font-size: 1.6em;color: #565F49;margin-top:1em;margin-bottom:0.1em;padding-left:13px;line-height:1.15em;}
.tabboutique h1	{margin-top:0px;}/*pour l'alignement du titre des bouquins dans la boutique*/
h2 			{font-size: 1.4em;	margin-top: 1.3em;	margin-bottom: 0.8em;	color: #565F49;	padding-left:0px;
			margin-left:13px;	border-bottom:#999999 1px solid;}
h3 			{font-size: 1.1em;	margin-top: 1.3em;	margin-bottom: 0.8em;	color: #565F49;	padding-left:0px;
			margin-left:13px;	border-bottom:#999999 1px solid;}
h4 			{font-size: 1em;font-weight: bold;	margin-top:0;border-bottom:#999999 1px solid;margin-bottom:5px;}
h5 			{
	font-size: 0.95em;
	font-weight: bold;
	margin-top:0;
	margin-bottom:5px;
	line-height: 1.2em;
	border-top-width: 10px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF;
}
p  			{
	color: #333333;
	padding-left:13px;
	font-size: 0.8em;
}
p.normal  			{
	color: #333333;
	padding-left:7px;
	font-size: 0.8em;
	line-height: 1.1em;
	padding-top: 10px;
}
p.normal.a  			{
	color: #CC0000;
	padding-left:13px;
	font-size: 0.8em;
	line-height: 1.1em;
	padding-top: 10px;
	text-decoration: none;
}

p.tabcentre  			{
	color: #333333;
	font-size: 0.8em;
	padding-left: 0px;
	text-align: center;
}
.imagell {
	float: left;
	clip: rect(auto,auto,auto,auto);
	margin-right: 5px;
}
p.marge10	{margin-bottom:10px;}
p.indexplusgrand {line-height: 1.75em;padding-left:0px;}/*en page d'accueil : le padding left supprime celui de p*/
p.sanspadding {
}/*en page d'accueil : le padding left supprime celui de p*/

.source		{font-style: italic; color:#666666;font-size:0.8em;}
.petit		{font-size:11px;} /* qq liens accueil - en absolu (au lieu d'une taille relative en em) car 0.9 est trop grand et 0.8 est trop petit...*/

table 				{color: white}
tr 					{color: #333333;}
td, th				{line-height: 1.3em;padding-left:3px;padding-right:3px;vertical-align:top;}
td 					{font-size: 1em;}
td.sansmarge 		{padding:0px;}/* en page d'accueil, zone rechercher - pour annuler celui de td */
tr.entete			{background-color:#AF9270; color:white; text-transform:capitalize; text-align:center; font-weight:bold; }
tr.fond_clair		{background-color:#E3DACE; }
tr.fond_clair2		{background-color:#F4F1EC; }
tr.fond_clair td,tr.fond_clair2 td		{border-bottom:1px solid white;}

ul 				{padding-left:13px;}
/*les liens*/
a 				{color: #CC0000;text-decoration: none }
a:hover 		{text-decoration: underline	}
.plus 			{background:transparent url(file:///Pao/maquette/1PAO/POLES/COMMUNICATION/images/plus-gris.gif) no-repeat 1% 5px; padding-left:15px;}
.carreliens		{background:url(file:///Pao/maquette/1PAO/POLES/COMMUNICATION/images/carre-liens.gif) no-repeat 2% 5px; padding-left:15px;}
.panier 		{background:transparent url(file:///Pao/maquette/1PAO/POLES/COMMUNICATION/images/picto-panier.gif) no-repeat 2% 2px; padding-left:23px;}
.pdf			{
	padding-left:23px;
	background-color: transparent;
	background-image: url(file:///Pao/maquette/1PAO/POLES/COMMUNICATION/images/picto-pdf.gif);
	background-repeat: no-repeat;
	background-position: 2% 0px;
}
.gris			{color:#333333;}
.gris:hover	{text-decoration:none;}
.highlight:hover	{background-color: #f3ecd6;} /*pour les MontrerCalque dans breves internationales et resume des docs*/
/*a.actif { passé dans la feuille de style de Spry MenuBarHorizontal.css
	background-color: #7E1512;
	background-image:url(../images/onglet_over.gif);
	background-repeat:repeat-x;
	color: #FFF;
}*/

img 			{display: block; /*needed to avoid alignment with baseline of text*/}
img.bottom 		{position:relative;	top: 5px;	vertical-align: baseline;	float: left; }

#menuhome2 img	{display:compact}
hr				{border: none 0; border-top: 2px dotted #cccccc;/*the border*/ 
				width: 100%;	height: 2px;margin-bottom: 5px;margin-top: 8px;} 
.positionnement	{padding-left:13px;} /*sur div ou td pour la marge de gauche dans la zone centrale*/
div.floatG			{float: left;position:relative;padding:5px 10px 5px 13px;}
div.boutique		{float: right;position:relative;padding-left:20px;margin:5px 0px 5px 30px;
					border-left:1px solid #ccc;border-bottom:1px solid #ccc;height:100px;width:200px;}
div.encadre			{background-color:#E3DACE;padding-left:5px;padding-left:0px;}
.fond_marron	{background-color:#f3ecd6;} /* zone contact dans le tableau de moteur-recher-publications */
div.spacer			{background-color:white;height:9px;}/*espacement entre elements dans colBoxFarRight*/
.trait			{border-bottom:1px solid #CC0000;}

/*--------- MENU PRINCIPAL en absolu pour passer au dessus des autres div --------------------------*/
#menugeneral	{position:absolute;top:43px;left:50%;margin-left:-349px;width:640px;z-index:2000;}
/*--------- DIV QUI ENGLOBE TOUTE LA PAGE ---------------------------------------------------------*/
#container {margin:0px auto;font-size: 0.8em;overflow: hidden;padding:0px;background-color:white;
			text-align:left;width:1000px;	}

/*---------- BANDEAU -----------------------------------------------------------------------------*/
#fond {top:0px;margin-top:-1px;	margin-left:15px;	width:1000px;}

	/*---------fond gris sur photo------*/
	#grey {position:absolute;margin-top:-5px;z-index:1000;	height:70px;width:1000px;margin-left:-15px;background-color:#000000;
	opacity:.70;filter:alpha(opacity=70);-moz-opacity:0.7;vertical-align:top;padding:3px; }
		#logo{	position:absolute;	top:1px;	left:10px;	z-index:1000;		}

	/*----------menu sur fond degrade--------*/
	#menu{position:absolute;left:151px;bottom:109px;z-index:2000;}
	/*----------petit menu de droite ---------*/

	#menu2{position:absolute;left:813px;bottom:114px;z-index:1001;width:150px;}
	p.white a.white {position:absolute;right:30px;bottom:110px;color:#FFFFFF;font-size:0.9em;}

/*---------- CHEMIN ------------------------------------------------------------------------------*/
#breadcrumbs {margin-left: -100%;width: 100%;background-color: #fff;z-index:1000;} 
.breadcrumbs {font-size: 10px;font-weight: bold;line-height: 0.9em;color: #5B654E;background-color:white;
			padding: 8px 5px 8px 25px;}


/*---------- CONTENU DE LA PAGE ----------------------------------------------------------------*/
.line 	{ /*---------lignes : contiennent des item un par colonne ----------*/
		float: left; width: 100%; display: block; position: relative; /*prevents shifting when changing viewport in IE;thanks to Alan Gresley*/z-index:500;
		}
	.item 	{ /*---------------- colonnes - contiennent sap-content ------*/
				position: relative; float: left;  left: 100%;overflow: hidden;z-index:1;}/**/
		.sap-content 	{ /*------sap=simulated absolute position---------*/
								overflow: hidden;z-index:1;} /**/

/* end generic; all sap elements must have margin-left and with defined */



/*-----------menu, premier item, ligne 2-------*/

#menu_gauche {
	margin-left: -98.5%;
	width: 17%;
	margin-top:-15px;
	z-index: 1000; 

}
div.MenuL a {
	display: block;	
	background-color: #f3ecd6;
	padding: 0.5em 0.5em;
	color: #3e4435;
	text-decoration: none;
	border-top:#FFFFFF solid 1px;
}
div.MenuLon a {
	display: block;	
	background-color: #3e4435;
	padding: 0.5em 0.5em;
	color: white;
	text-decoration: none;
	border-top:#FFFFFF solid 1px;
}
div.ssMenuL a {
	display: block;
	background-color: #FAF7EF;
	padding: 0.3em 0.3em 0.3em 1.2em;
	color: #3e4435;
	text-decoration: none;
	border-top:#FFFFFF solid 1px;
}

div.ssMenuLon a {
	display: block;
	background-color: #FAF7EF;
	padding: 0.3em 0.3em 0.3em 1.2em;
	color: #CC0000;	
	text-decoration: none;
	border-top:#FFFFFF solid 1px;
	}
div.MenuL a:hover, div.MenuL a:focus, div.MenuLon a:hover
{
	background-color: #3e4435;
	color: #FFF;
}

div.ssMenuL a:hover, div.ssMenuL a:focus, div.ssMenuLon a:hover
{
	background-color: #3e4435;
	color: #FFF;
}

/*-----------colonnes de largeur variable-------*/
/*------------ HOME PAGE ---------------------------------------------------------------------------------*/
#menuhome{position:absolute;left:151px;bottom:0px;z-index:1000;}


	/*----------petit menu de droite ---------*/
	#menuhome2{position:absolute;left:813px;bottom:5px;z-index:1001;width:150px;}
		p.homewhite a.homewhite {position:absolute;right:30px;bottom:5px;color:#FFFFFF;font-size:0.9em;}
#anim {
	margin-left:-98.5%;
	width:77.0%;
	background-color:#FAF7EF;
}

#leftIndex {
	margin-left:-98.5%;
	width:37.5%;
	
	}
#leftIndex h1 {font-size:1.4em;clear:right;margin-top:-2px;margin-left:10px;margin-bottom: 0.5em;
				font-variant: small-caps;letter-spacing: 0.05em;}
#leftIndex h2 {font-variant: small-caps;font-size:1em;letter-spacing: 0.08em;margin : 0 0 0.05em 0; border-bottom:white;}
	
	.redsquare {
	float: left;
	}	

			
#middleIndex {

	margin-left:-60%;
	width:38.5%;

			}
	
#middleIndex h2 {font-variant: small-caps;font-size:1em;letter-spacing: 0.08em;margin : 0 0 0.05em 13px; border-bottom:white;}

	
#middleIndex	li	{
	line-height: 1.3em;
	list-style-type: square;
	list-style-position: inside;
	}			
			
	.titreindex {

			background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-385.jpg);
			background-repeat: repeat-y;
			background-color: #CC0000;
			margin-bottom: 0.5em;
			font-variant: small-caps;
			font-weight:lighter;
			color: #FFFFFF;
			padding: 3px 3px 3px 13px;
			width:100%;
			}			

#colBoxFarRightHome {
	margin-left:-21.5%;
	width:20%;
	height: 175px;
	background-color: #f3ecd6;
	}

#colBoxFarRightHome p {
	padding-right: 2px;
	padding-left: 28px;
	padding-bottom: 0px;
	padding-top: 7px;
	font-size:0.89em;
	line-height:1.4em;
	}
/*-------fin home page------------*/
.titre585,.titre385,.titre785 {background-repeat: repeat-y;
			background-color: #CC0000;
			font-variant: small-caps;
			font-weight:lighter;
			color: #FFFFFF;
			padding: 3px 3px 3px 13px;
			margin-bottom:15px;
			width: 100%;
			}
/*CO*/
#coltexte585 		{margin-left:-80%;width:58.5%;}
#coltexte585	ul	{margin-bottom: 1em;}
#coltexte585	li	{line-height: 1.3em;list-style: square;list-style-position: outside;
					margin-left:18px;padding-left:1px;}
#coltexte585	li ul li{line-height: 1.3em;list-style-type: circle;list-style-position: outside;
					margin-left:-14px;padding-left:1px;}
.titre585 {background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-585.jpg);}

/*CO et pas de C3 : contenu central sur 1 grande colonne */
#coltexte785 		{margin-left:-80%;width:78.5%;}
.titre785 {background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-785.jpg);}

/*C1 - colonne n1 lorsque le contenu central est en 2 colonnes */
#coltexte385 {margin-left:-80%;width:38.5%;}
.titre385 {background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-385.jpg);}
#coltexte385	li	{
	line-height: 1.3em;
	list-style: square;
	list-style-position: outside;
	margin-left:18px;
	padding-left:1px;
	}
	#coltexte385	li ul li{
	line-height: 1.3em;
	list-style-type: circle;
	list-style-position: outside;
	margin-left:-14px;
	padding-left:1px;
	}
/*C2 - colonne n2 lorsque le contenu central est en 2 colonnes */
#coltextRight 		{width:28.5%;margin-left:-50%;}
#coltextRight	li	{line-height: 1.3em;list-style: square;list-style-position: outside;margin-left:18px;padding-left:1px;}
#coltextRight	li ul li{line-height: 1.3em;list-style-type: circle;list-style-position: outside;margin-left:-14px;
						padding-left:1px;}
	
#colBoxRight {
	margin-left:-40%;
	width:18.5%;
	}
	
#colBoxRight	li	{
	line-height: 1.3em;
	list-style: square;
	list-style-position: inside;
	}
#colBoxRight h1, #colBoxRight p, #colBoxRight ul {padding-left:0px;} /*suppression de l'espacement*/
#colBoxRight h2 {margin-left:0px;}

.titre185rouge {/* titre de colBoxRight de la zone Nos actions R&D */
	background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-185-rouge.jpg);
	background-repeat: repeat-y;
	background-color: #993300;
	font-variant: small-caps;
	font-weight:lighter;
	color: #FFFFFF;
	padding: 3px 2px 3px 13px;
	width:100%;
	font-size:1em;
	line-height: 1.3em;
	}
	
/*C3 - colonne n3 */
#colBoxFarRight {
	margin-left:-20%;
	width:18.5%;
	background-color: #f3ecd6;
	}	
#colBoxFarRightFlotte { /*C3 mais dans une page avec C0 large : evite de perdre toute la colonne de droite car elle flotte en fait dans C0*/
	width:185px;
	background-color:white;
	padding-left:15px;
	float:right;
	z-index:100;
	margin-top:-38px;

}
#colBoxFarRightFlotteint	{background-color:#f3ecd6;}
#colBoxFarRight	li,#colBoxFarRightFlotte li	{
	line-height: 1.3em;
	list-style: square;
	list-style-position: inside;
	}
#colBoxFarRight p,#colBoxFarRightFlotte p {
	padding-right: 2px;
	padding-bottom: 1px;
	padding-top: 1px;
	font-size:0.89em;

	}
#colBoxFarRight td {font-size:0.89em;padding:0px;}
.titre185 {/* titres de colBoxFarRight - applique a une div pour plus de liberte sur les paragraphes dans cette zone */
	background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-185.jpg);
	background-repeat: repeat-y;
	background-color: #993300;
	font-variant: small-caps;
	font-weight:lighter;
	color: #FFFFFF;
	padding: 3px 2px 3px 13px;
	width:100%;
	font-size:1em;
	line-height: 1.3em;
	}

/*-------------pied de page-------------------*/

#footerline {
	border-bottom: none;
	}

#footer {
	margin-left: -100%;
	width: 98.5%;
	background-color: #fff;
	}

.footer { 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	line-height: 0.9em;
	color: #5B654E;
	background-color: #FFFFFF	;
	padding: 3px 3px 8px 13px;
	}
	

/* ------------------- admin & forms ----------------------*/

#coltexteAdmin {
	margin-left:-80%;
	width:78.5%;
	}

#voir {
	width:100%;
	overflow:scroll;
	}

#pageadmin {
    padding: 4px 20px;
	margin: 0px 1px 0px 0px;
	background-color: #f3ecd6;
	border-left: solid 1px #CCC;
	border-bottom: solid 2px #999;
	border-top: solid 1px #CCC;
	border-right: solid 2px #999
	}

form.adminform fieldset {
  	margin-bottom: 10px;
	}

form.adminform legend {
  	padding: 0 2px;
	font-size: 1.1em;
  	font-weight: bold;
	}

form.adminform label {
  	display: inline-block;
  	line-height: 110%;
 	vertical-align: top;
  	text-align:right;
	width: 30%; /* Width of labels */
	}

form.adminform label.assoc {
  text-align:left;

}

form.adminform fieldset ol {
  margin: 0;
  padding: 0;
 
}

form.adminform fieldset li {
  list-style: none;
  padding: 5px;
  margin: 0;
 
}

form.adminform fieldset fieldset {
  border: none;
  margin: 3px 0 0;

}

form.adminform fieldset fieldset legend {
  padding: 0 0 5px;
  font-weight: normal;

}

form.adminform fieldset fieldset label {
  display: block;
  width: auto;

}

form.adminform em {
  /*font-weight: bold;*/
  font-style: italic;
  /*color: #f00;*/

}

form.adminform input {
  width: 50%; /* Width of input */
  padding:2px;
}

form.adminform textarea {
  width: 50%; /* Width of textarea */
  height: 150px; 
  padding:2px;
}
form.adminform input#rech_site	{height:15px;width:120px;padding:0px 0px 1px 2px;margin:-1px -2px 5px 0;font-size:0.9em;background-color:black;border:1px solid #B9B9B9;color:#B9B9B9;}
form.adminform .public {border:1px solid #E3DACE;}
form.adminform input.public {width : 260px;margin-bottom:10px;}
form.adminform .etroit {width:20px;}
form.adminform select {width: 50%;height: auto; margin-bottom:3px;}
form.adminform select.public {width : 260px;margin-bottom:7px;}
form.adminform select#ordre {width: 40px; /* Width of textarea */}
form.adminform input.bouton {width : 70px;background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-185-rouge.jpg);color:white}

form.adminform select#type {
  width: 250px; /* Width of textarea */
 
  }
form.adminform input#checkbox {
  width: 15px; /* Width of checkbox */
  margin-left: 15px;

}

form.adminform input#radio {
  width: 15px; /* Width of checkbox */
  margin-left: auto;

}

form.adminform span.radio {
	line-height: 1.8;
  	vertical-align: middle;
  }

form.adminform input#button{
  width: 80px;
  margin-top:5px;
  background-color:#ffffff; 
  border: 1px solid #cccccc; 
  background-image: url(file:///Pao/maquette/1PAO/POLES/images/bg-185-rouge.jpg);color:white

}

form.adminform fieldset fieldset label {
  margin-left: 32%; /* Width plus 3 (html space) */
}

form.adminform p.liens {
position:relative;
top: -18px;
left: 222px;
 }
 .blanctexte {
	color: #FFFFFF;
	font-size: 0.8em;
	background-position: center;
}
p.blanctexte {
	color: #FFFFFF;
	font-size: 0.8em;
	background-position: center;
	text-align: center;
	padding-left: 0px;
}
#video {
	background-image: url(video/ombre.jpg);
	background-repeat: no-repeat;
	padding: 10px;
	}

/*------------- AJAX suggestion contenu -------*/
#attente {visibility:hidden;height:0px;}
#suggestion {visibility:hidden;height:0px;position: relative;margin: 10px 0px 0px 0px;width:200px;background-color:#FFFFFF;-moz-border-radius: 7px;-webkit-border-radius:7px;border: 1px solid #000;color: #212427;overflow:auto;}
.td_tete {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #CC0000;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
	padding: 1px;
}
.td_normal {
	font-family: Arial, Helvetica, sans-serif;
	color: #333333;
	background-color: #F3E7C2;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
}
.td_norfonce {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #AF9270;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
}
.td_femelles {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #FF6C93;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
}
.td_castra {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #1EB554;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
}
.td_entier {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #43A3D8;
	text-align: center;
	vertical-align: middle;
	font-size: 0.8em;
}