/*****************************************************/
/*   Author:  Vonjy Randriamanarivo                  */
/*            randriav@op-systems.com	             */
/*   Version: 1.0                                    */
/*   Date:    3 juin 2006                            */
/*****************************************************/

/*****************/
/*   MAIN BODY   */
/*****************/

body {
	margin: 0px; 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0em auto;
	padding: 0em;
	text-align: justify;
}

#wrapper {
	margin: 0 auto;
	top: 0;
	margin-top: 0;
	width: 1000px;
    height: 100%;
    voice-family: "\"}\"";
    voice-family: inherit;
    height: auto;
}

html>body #wrapper {
    height: auto;
}

/**************/
/*   HEADER   */
/**************/

#header-section-swap  {
	position:relatve; 
	width:400px;
	min-width:120px;
	margin:0px 0px 5px 0px;
	background-color: transparent;
	top: 2px;
	height: 35px;
	visibility: visible; 
	padding:0px;
}

.swaplayers {
  color: #0059AD;
  font-weight: bold;
  text-transform: uppercase;
  font-size:  14px;
  position: absolute; 
  visibility:hidden;
  background-image: url(../IMG/fleche_titre.png);
  background-position: center left;
  background-repeat: no-repeat;
  padding: 0  0 0 20px; 
  margin-top: 15px;
}

.header-section ul {	
	margin: 0em;
	padding: 0em;
	list-style: none;
	font-weight: bold;
	font-size: 1.0em;
}	

.header-section li {
	float: left;
	white-space: nowrap;
}

.header-section li a {
	display: block;
	padding: 0em 1.0em 0em 1.0em;
	border-right: solid 0.1em rgb(175,175,175);	
	background-color: rgb(235,235,235);	
	text-decoration: none;
	color: rgb(50,50,50);
}

.header-section a:hover {
	border-right: solid 0.1em rgb(175,175,175);	
	background-color: rgb(220,220,220);			
	text-transform: uppercase;
	text-decoration: none;
	color: rgb(50,50,50);
}

.header-section .selected {
	padding: 0em 0.5em 0em 0.5em;
	border-right: solid 0.1em rgb(175,175,175);		
	background-color: rgb(220,220,220);
	color: rgb(50,50,50);
}

.header-section-flag {
	width: 66em; 
	height: 100%;
	float: left;
	text-align: right;
	vertical-align: bottom ;
	border: 0;
	margin: 0em 0em 0em 0em;
}

* html .header-section a {width:1%;}

/*****************/
/*   LEFT COLUMN */
/*****************/

#menu-left {
	float: left;
	width: 188px;
	height: 100%;
}

/*************************/
/***   MIDDLE COLUMN   ***/
/*************************/

#mid {
	float: left;
	width: 807px;
	height: 100%;
	margin: 0 ;
}
#mid-left {
	float: left;
	width: 335px;
	height: 100%;
	margin: 0 ;
	padding: 0;
}

#mid-mid {
	float: left;
	width: 172px;
	height: 100% ;
	margin-top: 6px ;
}

.mid-right-homepage {
	float: right;
	width: 473px;
	height: 100%;
	margin: 0 ;
}

.mid-right {
	float: left;
	width: 300px;
	height: 100%;
	margin: 0 ;
}

.mid-right h2,  .mid-right h2 a, .mid-right h2 a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	color: #000;
	border
}
.fond-accueil {
  background-image: url(../IMG/acceuil_fond.jpg);
  background-position: top right;
  background-repeat:no-repeat;
  height: 595px;
}

.right_side {
	float: right;
	width: 280px; 
	color: #414141;
	padding: 5px;
	margin-top: 6px;
	border: 1px solid #73AAF7;
	background-color: #EFF3FF;
	}
	
.left_side {
		float: left;
		width: 300px;
		padding: 2px;
		margin: 0px;
	}

/* Box titlebars */
/*****************/


.middle-column-box-rub-10 {
	clear: both;
	display: block;
	padding: 3px;
	border: 1px solid #0060CE;
	margin-top: 10px;
	margin-right: 10px;
	background-color: #AAD2FF;
	min-height: 150px;
}

.middle-column-box-rub-18 {
	clear: both;
	display: block;
	padding: 3px;
	border: 1px solid  #CA8B60;
	margin-top: 10px;
	margin-right: 10px;
	background-color: #EBCFBE;
	min-height: 150px;
}

.middle-column-box-rub-11 {
	clear: both;
	display: block;
	padding-top: 3px;
	border: 1px solid  #5FCA7C;
	margin-top: 10px;
	margin-right: 10px;
	background-color: #beebcc; 
	min-height: 150px;
}

/* Sections */
/************/

.fond-accueil {
  background-image: url(../IMG/acceuil_fond.jpg);
  background-position: top left;
  background-repeat:no-repeat;  
}

.fond-rub1 {
  background-image: url(../IMG/fond_rub1.jpg);
  background-position: top left;
  background-repeat:no-repeat;
}

.fond-rub2 {
  background-image: url(../IMG/fond_rub2.jpg);
  background-position: top left;
  background-repeat:no-repeat;  
}

.fond-rub3 {
  background-image: url(../IMG/fond_rub3.jpg);
  background-position: top left;
  background-repeat:no-repeat;  
}

.fond-rub4 {
  background-image: url(../IMG/fond_rub4.jpg);
  background-position: top left;
  background-repeat:no-repeat;  
}

.fond-rub20 {
  background-image: url(../IMG/fond_rub20.jpg);
  background-position: top left;
  background-repeat:no-repeat;  
}

.crumbs {
	position:relative;
	width:auto;
	min-width:120px;
	margin:0;
	/*background-color: #EFF3FF;*/
	background-color: #FFF;
	padding:5px;
	border: 0px solid;
	clear:both;
}

.crumbs ul {	
	margin: 0em;
	padding: 0em;
	list-style: none;
	font-weight: bold;
}	

.crumbs li {
	display: inline;
	white-space: nowrap;

}

.crumbs li a {
	padding: 0em 0.2em 0em 0.2em;
	text-decoration: none;
	font-weight: bold;
	color: #226EB7;
	font-size: 12px;
}

.crumbs li a:hover {
	text-decoration: underline;
}



/*
.items {
	position:relative; 
	width:auto;
	min-width:120px;
	margin: 0px 0px  25px 5px;
	border: 1px solid black;
	padding:5px;
	
}

.items ul {	
	margin: 0em;
	padding: 0em;
	list-style: none;
	font-weight: bold;
}	

.items li {
	display: inline;
	white-space: nowrap;

}

.items li a {
	padding: 0em 1.0em 0em 1.0em;
	border-right: solid 0.1em rgb(175,175,175);	
	text-decoration: none;
	font-weight: bold;
	color: #226EB7;
	font-size: 12px;
}

.items li a:hover {
	border-right: solid 0.1em rgb(175,175,175);	
	text-decoration: bold;
	color: #FF9E01;
}

.items .selected {
	padding: 0em 0.5em 0em 0.5em;
	border-right: solid 0.1em rgb(175,175,175);		
	color: #FF9E01;
	text-decoration: underline;
}
*/

.items {
	position:relative;
	float: left;
	width:auto;
	min-width:120px;
	margin:0px O 5px Opx;
	padding:1px;
}

.items ul {	
	height: 100%;
	margin: 0;
	padding: 0 0 0 10px;
}	

.items li {
	list-style-type: none;
	float: left;
	width: auto;
	margin: 7px 5px 0 5px;

}

.items li a:active, .items li a:link, .items li a:visited {
	display: block;
	color: #1c6ea8;
	font-weight: bold;
	text-decoration: none;
	padding: 1px 10px 2px 12px;
	background:inherit;
	border-bottom: 2px solid #1c6ea8;
}

.items li a:hover {
	color: #1c6ea8;
	text-decoration: none;
	border-bottom: 2px solid #FF9E01;
}

.items li.selected a.selected {
	color: #1c6ea8;
	border-bottom: 2px solid #FF9E01;
	text-decoration: none;
}

.adresse{
	background-color: #6B71A0;
	margin: 0px 0 0 0;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
}	

/*******************/
/***   FOOTER    ***/
/*******************/

#clearer {
	clear:both;
	font-size: 1em;
	height: 1px;
}


.footerlink {
	position:relative; 
	width:auto;
	margin:0;
	font-size: 0.8em;
	text-align: center;
	padding: 0;
}


/**************************/
/***   PLAN SITE        ***/
/**************************/

#carte {
    font-size: 1em;
}

#carte li {
	list-style: none;
}

#carte li ul {
	font-size: 90%;
	list-style-image: url(../puce.gif);
}

/**************************/
/***   Recherche        ***/
/**************************/

.resultat {
    font-size: 1em;
}

.resultat li {
	list-style: none;	
	list-style-image: url(../puce.gif);
}

.resultat li ul {
	font-size: 90%;
}


/**************************/
/***   list        ***/
/**************************/

.spip_puce {
    font-size: 1em;
}

.spip_puce li {
	list-style: none;	
	list-style-image: url(../IMG/puce_grise.gif);
}

.spip_puce li ul {
	font-size: 90%;
}
/**************************/
/***   FORMS 		    ***/
/**************************/



form.catalogue {
  margin: 0px;
  padding: 0px;
  font-size: 100%;
}

form .clear {
  margin: 0px;
  padding: 0px;
  font-size: 100%;
  clear: both;
}

form {
  margin: 0px;
  padding: 0px;
  font-size: 100%;
}

form fieldset {
  clear: both;
  font-size: 100%;
  border-color: #000000;
  border-width: 1px 0px 0px 0px;
  padding: 10px;
  margin: 0px 0px 0px 0px;
}

form fieldset legend {
  font-size: 150%;
  font-weight: normal;
  color: #000000;
  margin: 0px 0px 0px 0px;
  padding: 0px 5px;
}

label {
  font-size: 100%;
}

label u {
  font-style: normal;
  text-decoration: underline;
}

input, select, textarea {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  color: #000000;
}

textarea {
  overflow: auto;
}

form div {
  clear: left;
  display: block;
  width: 300px;
  margin: 5px 0px 0px 0px;
  padding: 1px 3px;
}

form fieldset div.notes {
  float: right;
  width: 158px;
  height: auto;
  margin: 0px 0px 10px 10px;
  padding: 5px;
  border: 1px solid #666666;
  background-color: #ffffe1;
  color: #666666;
  font-size: 88%;
}

form fieldset div.notes h4 {
  background-image: url(../IMG/icon_info.gif);
  background-repeat: no-repeat;
  background-position: top left;
  padding: 3px 0px 3px 27px;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
  border-color: #666666;
  color: #666666;
  font-size: 110%;
}

form fieldset div.notes p {
  margin: 0em 0em 1.2em 0em;
  color: #666666;
}

form fieldset div.notes p.last {
  margin: 0em;
}

form div fieldset {
  clear: none;
  border-width: 1px;
  border-style: solid;
  border-color: #666666;
  margin: 0px 0px 0px 142px;
  padding: 0px 5px 5px 5px;
  width: 197px;
}

form div fieldset legend {
  font-size: 100%;
  padding: 0px 3px 0px 9px;
}

form div.required fieldset legend {
  font-weight: bold;
}

form div label {
  display: block;
  float: left;
  width: 130px;
  padding: 3px 5px;
  margin: 0px 0px 5px 0px;
  text-align: right;
}

div.optional label, label.optional {
  font-weight: normal;
}

form div.required label, label.required {
  font-weight: bold;
}

form div label.labelCheckbox, form div label.labelRadio {
  float: none;
  display: block;
  width: 200px;
  height: expression('1%');
  padding: 0px;
  margin: 0px 0px 5px 142px;
  text-align: left;
}

form div fieldset label.labelCheckbox, form div fieldset label.labelRadio {
  margin: 0px 0px 5px 0px;
  width: 170px;
}

form div img {
  border: 1px solid #000000;
}

p.error {
  background-color: #ff0000;
  background-repeat: no-repeat;
  background-position: 3px 3px;
  color: #ffffff;
  padding: 3px 3px 5px 27px;
  border: 1px solid #000000;
  margin: auto 100px;
}

form div.error {
  background-color: #ffffe1;
  background-image: url(../IMG/required_bg.gif);
  background-repeat: no-repeat;
  background-position: top left;
  color: #666666;
  border: 1px solid #ff0000;
}

form div.error p.error {
  background-position: top left;
  background-color: transparent;
  border-style: none;
  font-size: 88%;
  font-weight: bold;
  margin: 0px 0px 0px 118px;
  width: 200px;
  color: #ff0000;
}

form div input, form div select, form div textarea {
  width: 200px;
  padding: 1px 3px;
  margin: 0px 0px 0px 0px;
}

form div input.inputSmall{
  width: 50px;
}

form div input.inputFile {
  width: 211px;
}

form div select.selectOne, form div select.selectMultiple {
  width: 211px;
  padding: 1px 3px;
}


form div input.inputCheckbox, form div input.inputRadio, input.inputCheckbox, input.inputRadio {
  display: inline;
  height: 14px;
  width: 14px;
  background-color: transparent;
  border-width: 0px;
  padding: 0px;
  margin: 0px 0px 0px 14px;
}

form div.submit {
  width: 214px;
  padding: 0px 0px 0px 140px;
}

form div.submit div {
  display: inline;
  float: left;
  text-align: left;
  width: auto;
  padding: 0px;
  margin: 0px;
}

form div input.inputSubmit, form div input.inputButton, input.inputSubmit, input.inputButton {
	border: 1px solid #404040;
	padding: 3px;
	background: #226EB7;
	font-family: "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
}

form div.submit div input.inputSubmit, form div.submit div input.inputButton {
  float: right;
  margin: 0px 0px 0px 5px;
}

form div small {
  display: block;
  margin: 0px 0px 5px 142px;
  padding: 1px 3px;
  font-size: 88%;
  height: expression('1%');
}


form .formrecherche {
	width: 100px;
	float: left;
}

form .formrecherche  input {
	width: 110px;
	float:left;
}


/*** CLass display ***/

.spip {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	text-align: justify;
}

table tr td {
	margin-left: auto;
	margin-right: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: justify;
}

img.clean {
border: 0px;
}


/*****************/
/*   GENERIC Styles  */
/*****************/
a , a:link, a:visited {
	color: #0059B5;
	text-decoration: underline;
}

a:hover {
	color: #D98200;
	text-decoration: none;
}

h1 {
	font-size: 1.2em;
}

h3.spip {
	font-family: Arial;
	font-weight: bold;
	font-size: 1.1em;
	text-align: left;
	margin-top : 3px;
	margin-bottom : 3px;
	padding: 0em;
}