/*
ID des différentes pages :
	#home
	#register
	#jobs
	#gallery
	#releases
	#services

Couleurs :
	texte					#314d45
	liens					#659386
	liens hover		#000
*/


/* --- ELEMENTS GENERIQUES --- */

* {margin: 0; padding: 0;}

body {font-family: sans-serif; color: #314d45;}

hr {clear: both; visibility: hidden; height: 0px;}

a {color: #659386; text-decoration: none;}
a:hover {color: #000; text-decoration: underline;}


/* --- LAYOUT COMMUN --- */

#page {}

#header {
	position: relative;
	width: 960px;
	margin: 0 auto;
	text-align: center;
	border-bottom: 1px solid #659386;
}
#header img#logo {margin: 0 auto; border: none;}
#header #menu {
	position: absolute;
	top: 0;
	left: 0;
	list-style: none;
	letter-spacing: 4px;
	text-transform: uppercase;
	font-size: .75em;
}
#header #menu li {
	width: 150px;
	height: 20px;
	position: absolute;
	top: 110px;
	left: 120px;
	text-align: center;
}
#header #menu li#h-home {display: none;}
#header #menu li#h-reg {}
#header #menu li#h-serv {top: 130px;}
#header #menu li#h-jobs {left: 690px;}
#header #menu li#h-gal {left: 690px; top: 130px;}
#header #menu span {font-weight: bold; color: #659386;}
/*
#header #menu span:before {content: "-";}
#header #menu span:after {content: "-";}
#header #menu a:before {content: "-";}
#header #menu a:after {content: "-";}
*/
#header #lang {
	position: absolute;
	top: 0;
	right: 0;
	list-style: none;
	font-size: .7em;
}
#header #lang li {float: left; margin-left: 5px;}
#header #lang a {text-decoration: underline;}

#content {
	width: 960px;
	margin: 0 auto;
	padding: 25px 0 30px;	/* = #footer.height; pour compenser la hauteur du footer au cas où le contenu déborde en bas de la fenêtre */
	background: #fff url(../img/css/bg-header.gif) no-repeat left -25px scroll;
}
.vcc {color: #41afaf; font-weight: bold;}

#footer {
	position: fixed;
	bottom: 0px;
	left: 50%;
	width: 960px;
	height: 20px;
	margin-left: -480px;	/* pour centrer l'élément sur la page */
	padding-top: 5px;
	text-align: center;
	font-size: .75em;
	color: #659386;
	border-top: 1px solid #659386;
	background: #fff;
	z-index: 3;
}


/* --- HOME --- */

#home #menu {display: none;}
#home #content {padding-top: 0;}
#diapo {height: 387px;text-align: center;}
#diapo img {border: 1px solid #659386; border-top: none;}

#intro {width: 890px; margin: 30px auto; text-align: center; font-size: .95em;}
#intro p {margin: 20px 0;}
#intro strong {font-weight: bold;}
#intro a {text-decoration: underline; font-weight: bold;}

/* liste des outils : trois colonnes de 300px, espacées de 30px */
#toolbox {}
#col1, #col2, #col3 {width: 300px; float: left; padding-bottom: 25px;}
#col1 {}
#col2 {margin: 0 30px;}
#col3 {}
.tool {margin-bottom: 25px; border: 1px solid #81c3a7; font-size: .9em; background: #fff;}
.tool h3 {border-bottom: 1px solid #659386; background: #e9f5eb; font-weight: normal; padding-left: 5px;}
.tool p {margin: 10px;}
.tool ul {list-style: none; margin: 10px;}
.tool ul span {font-size: .85em; font-weight: bold; color: #000;}
.tool a {font-style: italic; text-decoration: underline;}
.tool a.more {display: block; text-align: right; border-top: 1px dotted #659386; font-style: italic; font-size: .85em; padding-right: 10px;}
.tool a.more:hover {background: #e9f5eb;}
.tool form {margin: 10px;}

#calendar {}
#register {}
#rent {}
#services {}
#organize {}
#newsletter {}
#newsletter label {display: block; width: 100px; float: left;}
#newsletter input {width: 173px;}
#newsletter select {width: 177px;}
#newsletter .bouton {width: 100px; margin: 5px 0 0 178px;}
#visit {}
#jobs {}
#press {}


/* --- REGISTER --- */

#reg-form {
	width: 500px;
	padding-top: 15px;
	margin: 0 auto;
	text-align: center;
}
#reg-form p {position: relative; height: 2.5em;}
#reg-form label {position: absolute; left: 0; top: 0; width: 240px; text-align: right;}
#reg-form input {position: absolute; right: 0; top: 0; width: 240px;}
#reg-form select {position: absolute; right: 0; top: 0; width: 244px; text-align: center;}
#reg-form option {text-align: left;}
#reg-form #request-p {height: 230px;}
#reg-form #request-p textarea {position: relative; top: 22px; left: 0; width: 496px; height: 180px;}
#reg-form input.bouton {position: relative;}


/* --- JOBS --- */

.job-item {width: 420px; margin: 15px 30px 30px; float: left;}
.job-item h3 {text-align: center; border-bottom: 1px solid #659386;}
.job-item p {color: #659386;}
.job-item p.occ {padding-top: 5px; font-weight: bold;}
.job-item p.eng {font-weight: bold;}
.job-item p.sal {font-weight: bold;}
.job-item p.des {color: #314d45; text-align: justify; font-style: italic; font-size: .9em; padding: 7px 10px 5px;}
.job-item span {color: #659386; font-weight: normal;}
.job-item a {
	display: block;
	padding: 3px;
	margin: 10px 0 0;
	color: #659386;
	text-align: center;
	font-weight: bold;
}
.job-item a:hover {
	color: #000;
	text-decoration: none;
}


/* --- GALLERY --- */

#gallery #content {padding-top: 0;}
#photo {text-align: center;}
#photo img {margin: 0 auto 25px; border: 1px solid #659386; border-top: none;}
#photo #gal-nav {
	position: relative;
	height: 2em;
	width: 700px;
	margin: 0 auto;
	font-size: .75em;
	text-transform: lowercase;
	letter-spacing: 3px;
}
#photo #gal-nav a {
	position: absolute;
	display: block;
	width: 100px;
	top: 0px;
}
#photo #gal-nav a#first {left: 0px; text-align: left;}
#photo #gal-nav a#prev {left: 100px; text-align: left;}
#photo #gal-nav a#next {right: 100px; text-align: right;}
#photo #gal-nav a#last {right: 0px; text-align: right;}


/* --- RELEASES --- */

.rel-item {position: relative; padding-bottom: 25px;}
.rel-item span {display: block; width: 90px; height: 30px; font-size: .8em; background: #b6e8b7; padding-left: 3px; margin-bottom: 15px; z-index: 3;}
.rel-item h3 {position: absolute; top: 18px; left: 20px;}
.rel-item p {margin: 10px 20px;}


/* --- SERVICES --- */

#services #content p {margin: 0 15px 25px;}