body{
	background: #fff;
	padding: 0;
	margin: 0;
	font-family: Verdana, Geneva, sans-serif;
	text-align: center;
}

/* ----------- *** SUPER CONTENEUR *** ---------- */
/* Contient tous les �l�ments de la page, fix� � une largeur de 783px*/

#super_conteneur{
	width: 783px;
	margin: 0 auto;
}

/* ----------- *** HEADER *** ---------- */
/* Logo horizontal CEBI */

#header{
	height: 120px;
	background: url(images/header.png) no-repeat top white;
	padding: 0;
	margin: 0;
	text-indent: -5000px;
}

/* ----------- *** GRAND CONTENEUR *** ---------- */
/* Englobe tout le conteneur + partie gauche + partie droite, utilis� pour le background de fond (bordure lat�rale) qui se r�p�te verticalement */

#grand_conteneur{
	background: url(images/super_fond.png) repeat-y top;
	margin: 0;
	padding: 0;
}

/* Logo d�coratif gauche vertical CEBI, positionn� en flottant gauche ----------> */

#logo_gauche{
	float: left;
	width: 43px;
	height: 136px;
	margin: 50px 0 0 13px;
	padding: 0;
	background: url(images/logoCEBI.png) no-repeat top;
}

/* Partie droite du macaron du Header, positionn� en flottant droit ----------->*/

#logo_droite{
	float: right;
	width: 39px;
	height: 50px;
	margin: 0;
	padding: 0;
	background: url(images/coin_droite.png) no-repeat top left;
}

/* ----------- *** CONTENEUR *** ---------- */
/* Contient tout le corps de la page */

#conteneur{
	margin: 0 39px 0 58px;
	padding: 0;
	background: #fff6ad;
}

/* D�finition et Customisation du Menu horizontal principal --------> */

#menu{
	height: 50px;
	margin: 0;
	padding: 0;
	background: url(images/menu.png) no-repeat right bottom;
}
#menu li{
	float: left;
	list-style: none;
	padding: 0;
}
#menu li a{
	width: 132px;
	height: 35px;
	display: block;
	font-size: 14px;
	line-height: 35px;
	text-decoration: none;
	text-align: center;
	background: url(images/bouton.png) no-repeat top right;
	color: #aa2b1f;
}
#menu li a:hover{
	font-size: 15px;
}

#menu li a.bouton1{
	margin-left: 12px;
}

/* ----------- *** CORPS *** ---------- */
/* Contient le v�ritable contenu de la page: texte, images etc... */

#corps{
	overflow: auto;
	background: url(images/fond_corps.png) repeat-y top;
	margin: 0;
	padding: 0 15px;
}
#contenu{
	float: left;
	width: 590px;
	margin-left: 36px;
}

/* Menu de navigation gauche, float:left pour laisser la place au champ de recherche sur la droite ---------> */

#navigation{
	float: left;
	list-style: none;
	padding: 0;
	margin: 0;
}
#navigation li{
	display: inline;
	font-size: 13px;
	padding: 0;
	margin: 0;
}
#navigation li a{
	text-decoration: none;
	font-size: 12px;
	color: #ff6633;
}
#navigation li a:hover{
	text-decoration: underline;
}

#navigation li:before{ 
	content: "> "; 
}
#navigation li:first-child:before{
	content: ""; 
}
/* hack CSS pour IE */

* html #navigation li{
	background-image: url("images/gt.gif");
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 0 0.5em 0 1em;
	margin: 0 1em 0 -1em;
}

* html #navigation{ 
	height: 1%;
}

* html #navigation li{
	display: block;
	float: left;
}

/* Fin du hack*/

/*Mac IE 5*/

* html #navlist li:first-child{
	background-image: none;
}

/* D�finition et Personnalisation du Menu de Recherche, positionn� en flottant droit pour rester � la m�me hauteur que le menu de navigation gauche -----------> */

#recherche{
	float: right;
	margin: 0;
	width: 260px;
}
#barre{
	margin: 0 10px 0 5px;
	padding: 0 0 0 0;
}

/* Personnalisation du champ de texte ----------> */

#text{
	float: left;
	width: 203px;
	height: 22px;
	border: 0;
	font-size: 12px;
	background: url(images/recherche.png) no-repeat top left;
	padding: 0 0 0 10px;
}

/* Personnalisation du bouton submit ----------> */

#submit{
	float: right;
	width: 31px;
	height: 26px;
	border: 0;
	background: url(images/bouton_recherche.png) no-repeat top right;
 	cursor: pointer;
}

/* Personnalisation des Paragraphes du corps --------> */

#corps h1{
	margin: 0 auto;
	margin-top: 60px;
	width: 590px;
	font-size: 14px;
	color: #F90;
	font-weight: normal;
	padding-bottom: 5px;
	border-bottom: 1px solid #F90;
}
#corps p.titre{
	width: 590px;
	margin: 0 auto;
	margin-top: 25px;
	margin-bottom: 10px;
	font-size: 13px;
	color: #900;
	text-align: center;
}
.competences{
	width: 590px;
	height: 315px;
	margin: 0 auto;
	margin-top: 30px;
}
.comp_left{
	float: left;
	width: 285px;
}
.bordure{
	border: 1px solid #f3cf07;
}
.comp_right{
	float: right;
	width: 285px;
}
.comp_left h2, .comp_right h2, #diapo h2{
	font-size: 13px;
	color: #F90;
	border-bottom: 1px solid #F90;
	padding: 3px;
	background: url(images/bg_titre.png) no-repeat center top;
}
.comp_left p, .comp_right p{
	height: 58px;
}
.comp_left p, .comp_right p, #diapo p{
	font-size: 12px;
	color: #600;
	text-align: justify;
}

#corps p.normal{
	width: 590px;
	margin: 0 auto;
	margin-top: 35px;
	font-size: 12px;
	text-align: justify;
	color: #600;
}

/* Diapo d'accueil --------> */
object{
	background: url(images/cebi_transparent.png) no-repeat center bottom;
}
#diapo{
	width: 590px;
	margin: 0 auto;
	margin-top: 30px;
	text-align: center;
	clear: both;
}
#diapo p a{
	text-decoration: none;
	color: #ff6633;
}
#diapo p a:hover{
	color: #FC6;
}
#diaporama{
	width: 518px;
	height: 400px;
	overflow: scroll;
	text-align: center;
	margin: 0 auto;
}
#diaporama h3{
	font-size: 12px;
	color: #C60;
}
#diaporama img{
	width: 488px;
	margin: 5px 0;
	border: 1px solid #F93;
}

/* Formulaire de contact --------> */

#formulaire{
	margin: 30px 30px 0 30px;
	text-align: left;
}
#formulaire p.align{
	margin-left: 20px;
}
.centred{
	color: #600;
	font-size: 12px;
	margin: 40px 0 0 0;
}
#formulaire input.label{
	width: 203px;
	height: 22px;
	border: none;
	margin: 5px;
	font-size: 12px;
	background: url(images/recherche.png) no-repeat top left;
	padding: 3px 0 3px 10px;
}
#envoi{
	width: 203px;
	height: 22px;
	border: none;
	font-size: 12px;
	background: url(images/recherche.png) no-repeat top left;
	padding: 3px 0 10px 10px;
	cursor: pointer;
}
#formulaire textarea{
	border: none;
	padding: 0;
	margin-top: 5px;
}
#formulaire textarea:hover{
   	background-color: #FFFF99;
}
 
#formulaire label{
   	color: #933;
   	font-size: 12px;
}
 
#formulaire legend{
   	font-family: Arial, "Arial Black", Georgia, "Times New Roman", Times, serif;
   	color: #FF9933;
   	font-weight: bold;
}
 
#formulaire fieldset{
	padding: 0 0 10px 10px;
   	margin-top: 10px;
	border: 1px solid #f3cf07;
}

/* Page de l'�quipe --------> */

#equipe{
	width: 500px;
	margin: 0 auto;
	margin-top: 20px;
}
#equipe .personne{
	position: relative;
	border: 1px solid #f3cf07;
	margin: 0 0 10px 0;
	height: 123px;
}
#equipe .personne img{
	float: left;
	width: 100px;
	border-right: 3px dotted #f3cf07;
}
#equipe .personne h2.description{
	color: #9C7200;
	font-size: 13px;
	font-weight: bold;
	margin: 5px 0 0 0;
}
#equipe .personne p.def{
	font-size: 12px;
	color: #600;
	text-align: justify;
	margin: 10px 10px 0 110px;
}
p.lien{
	position: absolute;
	bottom: 0;
	right: 10px;
	font-size: 11px;
	text-align: right;
}
p.lien a{
	color: #f90; /*#F90*/
	text-decoration: none;
}
p.lien a:hover{
	color: #FC6;
}

/* Page mappemonde ---------> */

#carte{
	position: relative;
	margin: 0 auto;
	margin-bottom: 30px;
	width: 597px;
}
#france{
	border: none;
}

.point1, .point2, .point3, .point4{
	position: absolute;
	width: 25px;
	height: 27px;
	border: none;
}
.point1{
	top: 145px;
	left: 394px;	
}
.point2{
	top: 157px;
	left: 330px;	
}
.point3{
	top: 140px;
	left: 389px;
}
.point4{
	top: 105px;
	left: 320px;
}
a.infobulle{
	color: #900;
	text-decoration: none;
}
a.infobulle .cache{
	display: none;
}
a.infobulle:hover{
	z-index: 500;	
}
a.infobulle:hover .cache{
	width: 230px;
	position: absolute;
	top: 0px;
	left: 0px;
	display: inline;
	white-space: nowrap;
	border: 2px dotted #f3cf07;
	padding: 5px 10px 10px 10px;
}

.titre_cache{
	font-size: 12px;
	color: #F90;
	font-weight: normal;
	padding-bottom: 5px;
	margin: 0;
	border-bottom: 1px dotted #f3cf07;
}

.p_cache{
	font-size: 10px;
	text-align: center;
	color: #600;
	overflow: visible;
}
.bas_titre{
	font-size: 10px;
	font-weight: bold;
	font-style: italic;
	color: #600;
	margin: 10px 0 0 0;
}
.yellowborder{
	border: 1px solid #FF0;
	height: 110px;
	width: 200px;
}

/* Sph�re d�corative, utilise le positionnement absolu pour passer au dessus du cadre --------> */

#orb{
	float: right;
	margin-top: 10px;
	padding: 0;
}

/* Bordure verticale du bas du corps ------>*/

#bas_corps{
	height: 18px;
	background: url(images/bas_cadre.png) no-repeat bottom;
	margin: 0;
	padding: 0;
}

/* ----------- *** FOOTER *** ---------- */

#footer{
	height: 69px;
	background: url(images/footer_11.png) no-repeat bottom;
	margin: 10px 0 0 0;
	padding: 0;
}

/* Menus du Footer --------> */

#navliste{
	list-style: none;
	padding-top: 5px;
	margin: 0;
}
#navliste2{
	list-style: none;
	padding: 0;
	margin: 0;
}

#navliste li, #navliste2 li{
	display: inline;
	padding: 0;
	margin: 0;
}
#navliste li a, #navliste2 li a{
	text-decoration: none;
	font-size: 11px;
	color: #ff6633;
}
#navliste a:hover, #navliste2 a:hover{
	text-decoration: underline;
	color: #ff6633;
}

/* Copyright du Bas --------> */

#footer p{
	font-size: 13px;
	color: #F90;
	text-align: center;
	margin: 0 auto;
	padding: 5px 0 0 0;
}

/* Bordure verticale du Bas, "clear: both" pour qu'elle reste toujours en bas --------> */
#validation{
	height: 31px;
	margin: 10px 0 0 0 ;
	padding: 0;
}
#validation img{
	text-decoration: none;
	border: none;
}
#bas{
	clear: both;
	height: 23px;
	background: url(images/bas.png) no-repeat bottom;	
}
