/*----------------------General------------------------*/

/*---- Reset css -------*/
* {margin: 0; padding: 0;}
a img {border: 0;}
p, span {font-size: .9em;}
a {outline: none;}

html, body {
    height: 100%;
}

/*---- Mise en page -------*/
body {
	background-color: #078bbd;
	background-image: url(fond_ocean.png);
	background-repeat: repeat-x;
	text-align: center;
	font-family:  Trebuchet, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	font-size: 100%;
	color: #003366;
	position: relative;
}
	
/* Pour la page d'intro */
body.index {
	background: #FFFFFF url(fond_ocean.jpg) 0 0 repeat-x;
	margin-top: 20px;
	text-align: center;
	font-family:  Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	font-size: 100%;
	color: black;
	position: relative;
}
/* Pour la page d'info blanche */
body.info {
	background-color: #fff;
	background-image: none;
	text-align: center;
	font-family:  Trebuchet, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
	font-size: 100%;
	color: #003366;
	position: relative;
}

	#page {
		position: relative;
		width:900px;
		height:80%;
		margin: 0 auto;
		text-align:left;
		/*background: #84D2E8 url(conteneur_bck.gif) 0 323px repeat-x;*/
	}
	
/*---- Bandeau -------*/
#header {
	height: 120px;
	/*width:800px;*/
	background: inherit;
}
	#banniere {
		position: absolute;
		top: 0px;
		right: 0px;
		text-align: center;
		font-size: 2em;
		color: #FFFF00;
	}
	#banniere h1 {
		font-size: 1pt;
		padding-left: 10px;
		padding-top: 10px;
		color: white;
		background: transparent url(slogan_bck.gif) 0 0 no-repeat;
		height: 26px;
	}

/*---- Menu -------*/
#menu {
	float: left;
	width: 203px;
	margin-top: 10px;
	padding-bottom: 20px;
	background: inherit;
}
	#menu ul {
		list-style-type: none;
	}
		#menu li {
			padding: 3px 0;
			margin:0;
			/*font-size: 1.2em;*/
			font-weight: bold;
		}
		#menu li a {
			color: #FFFF00;
			text-decoration: none;
			padding:5px 0 5px 18px;
			display: block;
			width: 170px;
			float: left;
		}
		#menu li a.lien_actif {
			color: #FFFF00;
			text-decoration: none;
			background: url(fond_menu.png) 0 center no-repeat;
		}
			#menu li a:hover {
				text-decoration: none;
				background: url(fond_menu.png) 0 center no-repeat;
			}

.sous-menu ul {
		list-style-type: none;
}
.sous-menu li a{
	margin-left:30px;
	font-size: 0.8em;	
}
.sous-menu a.lien_actif {
			background: url(fond_menu.png) 0 center no-repeat;
}
#langue {
	position: absolute;
	top:10px;
	right:8px;
	margin: 0;
	padding: 0;
}

/*---- Menu bas -------*/
#menubas {
	margin-top: 10px;
	margin-left:210px;
	padding-bottom: 5px;
	background: inherit;
}
	#menubas ul {
		list-style-type: none;
	}
		#menubas li {
			display: inline;
			padding: 0 4px 0 2px;
			font-size: .8em;
			border-right:1px solid #FFFF00;
		}
		#menubas li.last {
			border:0;
		}
		#menubas li.lien_actif {
			color:#FFFF00 !important;
			text-decoration: underline;
		}
			#menubas a {
				color: #FFFF00;
				text-decoration: none;
			}
				#menubas a:hover {
					text-decoration: underline;
				}

/*---- Contenu -------*/
.largeur { /* Meme que contenu pour utilisation d'un bloc sur tout le contenu */
	width: 690px;
}
#contenu {
	position: relative;
	float: left;
	width: 683px;
	/*height:100%;*/
	background: inherit url(texte_bck.gif) 0 0 repeat-y;
	margin: 10px 0px 0 7px;
	color: inherit;
}
	#contenu h2 {
		color: #FFFF00;
		font-size: 1.3em;
		margin-bottom: 1em;
		margin-right: 30px;
		margin-left: 0px;
		padding-left: 60px;
		background: url(puce00.png) no-repeat;
		line-height: 40px;
	}
	/* Pour rajouter un bloc a droite du h2, même ligne */
	#contenu .lienhaut{
		position: absolute;
		right:10px;
		top:0px;
		font-size: .9em;
	}
	#contenu .lienhaut a{
		text-decoration: underline;
	}

	#contenu h3 {
		margin: 0;
		padding: 0;
		font-size: 1em;
		color: #003366;
	}
	#contenu p {
		padding: 0em 0px .7em 0px;
	}
	#contenu .preface p {
		font-style: italic;
		text-indent: 15px;
	}
	
	#contenu a, #contenu a:visited{
		color:#003366;
	}
		#contenu a:hover {
			color: #FFFF00;
		}
	#contenu strong, #contenu b {
		font-weight: bold;
	}
	#contenu ul {
		margin: 2px 15px 15px 45px;
		padding: 0;
		font-size: .9em;
		list-style-type:  square;
	}
		#contenu ul ul {
			margin: 2px 15px 5px 45px;
			font-size: 100%;
			list-style-type: disc;
		}
	#contenu dl {
		margin: 0 10px;
		padding: 1px;
		background-color: #ECEDC5;	
		border:1px solid #FFFF00;
	}
	#contenu img {
		margin: 5px;
		padding: 0;
		vertical-align: middle;
	}
	#contenu dt {
	}
	#contenu dd {
		font-size:.8em;
		font-style: italic;
	}
	
/*---- Actualité -------*/
.actu {
	clear: both;
	padding:0;
	margin: 0 0 30px 0;
	text-align: left;
	overflow: auto;
}
.actu h3{
	clear: both;
}
	.actu img {
		float: left;
		padding:3px !important;
		margin:0 10px 0 0 !important;
		background-color: #FFFFFF !important;
	}
	.actu p {
		float:left;
		margin:0 0 10px 0;
		padding: 0;
	}
	
/*---- Livre d'or -------*/
.livre {
	clear: both;
	padding:5px;
	margin: 0;
	text-align: left;
	background-color: #ECEDC5;
}
	.livre p{
		text-indent: 15px;
		margin-bottom:0;
	}
	.livre .nom {
		margin:0 0 0 0px;
		padding: 0;
		font-weight: bold;
	}
	.livre img {
		vertical-align:top;
		margin:0 !important;
		padding:0;
	}
	hr {
		width:30%;
		margin:0 auto;
		color:#000080;
		
	}
/*---- Galerie photo -------*/
table#galerie {

}
	#galerie td {
		margin: 10px;
		padding: 0;
		border:0;
		text-align: center;
		vertical-align: top;
	}
	#galerie img {
		border:0px #FFFF00 solid;
		padding:3px;
		background-color: #FFFFFF;
		margin: 4px 2px;
	}
	#galerie p {
		font-size: .8em;
		padding: 0;
		border:0;
		text-align: left;
	}
	
/*---- Page info -------*/
table#info {
}
	table#info td {
		vertical-align:top;
		padding:10px 10px 0 0;
		margin: 10px;
		border:0;
		border-collapse:collapse;
	}
	table#info .intro {
		font-style:italic;
	}
	table#info p {
		
	}
	
/*---- Formatage -------*/
.col50 {
	float:left;
	width:49%;
	padding: 0 3px;
}
.col2 {
	float:left;
	width:2%;
}

.col100 {
	float:left;
	width:100%;
}
.left {
	text-align: left;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}

.justify {
	text-align: justify;
}

.floatleft{
	float: left;
	margin: 5px 10px 3px 20px;
}
.floatright{
	float: right;
	margin: 5px 20px 3px 10px;
}
.clear {
	clear: both;
}
.texteNote {
	font-size: .8em;
	font-style: italic;
}
img.cadre {
	border: 1px #FFFF00 solid;
	padding:2px;
	margin: 0 8px 1px 8px;
}
.no-padding {
	padding:0 !important;
}

/*---- Pied de page -------*/
#footer {
	clear: both;
	color: #00B2D2;
	padding: 11px 0 5px 0;
	background: transparent url(footer_bck.gif) bottom right no-repeat;
	text-align: center;
	position:relative;
}
#copyright {
	padding: 0;
	margin: 0;	
	font-size: .8em;
}

.index #footer a, .index #footer a:link { /* Lien page d'intro */
	color: #00B2D2;
	font-size: 1.1em !important;
}
.index #footer a:hover { /* Lien page d'intro */

}
#bloc-gauche {
	position:absolute;
	bottom:0;
	left:0;
}

/*---- multi page -------*/
#contenu .multipage {
	clear: both;
	text-align: center;
	padding-top: 15px;
	font-size: 1em;
}
	#contenu .multipage a, #contenu .multipage strong{
		border: 1px solid #FFFF00;
		background-color: inherit;
		margin:0 0 0 5px;
		padding: 0px 5px;
		text-decoration: none;
		color: #FFFF00;
	}
	#contenu .multipage a:hover{
		border: 1px solid #e1e4ec;
		background-color: #FFFF00;
		color: #003366;
	}
	#contenu .multipage strong{
		background-color: #FFFF00;
		color: #003366;
		font-weight: bold;
	}
	
/*---- Contact (Livre d'or) ----*/	
#formcontact * {
	padding: 0;
	margin: 0;
}

#formcontact form {
	margin: 10px 30px;
}
#formcontact label {
	font-weight: bold;
	display: block;
	cursor: pointer;
}
#formcontact input, #formcontact textarea {
	display: block;
}

#formcontact .error {
	color: #FFFF99;
	font-weight: bold !important;
}
.submit {
	padding: 0px 2px;
}

/*---- Contact ----*/	
#contact {
}
	#contact table {
		border-collapse: collapse !important;
		margin: 0 auto;
	}
		.competences th {
			color: #003366;
			font-weight: bold;
			margin: 0;
			padding: 0;
			font-size: 1.4em;
			border-bottom: 1px solid #003366;
		}
		.competences td {
			text-align: center;
			vertical-align: bottom;
			margin: 0;
			padding: 0;
			width:16.5%;
			font-style: italic;
			color:#003366;
		}
		.competences tr.top {
			background: transparent url(_fond_film_top.gif) top repeat-x;
			color: #FFFFFF;
			vertical-align: bottom;
		}
		.competences tr.centre {

			background-color: inherit;
			color: #FFFFFF;
		}
		.competences .centre td{
			width:120px;
			vertical-align: bottom;
		}
		.competences tr.bottom {
			background: transparent url(_fond_film_bottom.gif) bottom repeat-x;
			color: #FFFF00;
		}
		.competences .bottom td {
			vertical-align: top;
			font-size: .8em;
		}
		.competences td img {
			margin: 0;
			padding: 0;
			border:1px solid #FFFFFF;
		}
		.competences p {
			margin: 0;
			padding: 0;
		}
	/*   Carte visite centrale  */		
	table#cv {
		border-collapse: collapse;
		margin: 20px auto 20px auto;
		background-color: #FFFFFF;
		border:1px solid #003366;
	}
	table#cv td {
		padding: 2px 5px;
	}
	#cv th {
		text-align: center;
		font-size: 1.3em;
		background-color: #FFFFFF;
		margin: 0;
		padding: 10px 0 0 0;
		font-weight: bold;
		/*border:1px solid #003366;*/
	}
	#cv a, #cv a:hover {
		color: inherit;
		font-size: 1em;
	}

/*---- Messages divers -------*/
.attention, .confirmation {
	background: #FFFFFF url(warning.jpg) 10px 5px no-repeat;
	padding: 10px 5px 5px 50px;
	margin: 1em 1em;
	border: 1px #ff9100 solid;
	width:60%;
	margin: 0 auto;
}
.attention strong{
	color: #FF0000;
}
.confirmation {
	background: #F0FFF0 url(ok.jpg) 10px 5px no-repeat;
	border: 1px #009F00 solid;
}

/*---- bloc -------*/