/****************************

	ELEMENTS HTML GENERAL
	
 ****************************/
	
html, body {
	margin: 0;
	padding: 0;
	background: #FFFFFF;
	background: url('header_degrade.png') 0 0 repeat-x;
	height: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #1a2127;
	line-height:120%;
}
body {
	font-size:62.5%;
	}


/* Suppression des marging et padding d'lments principaux */

h1, h2, h3, h4, h5, h6, ol, ul, form, p, input, img {
	margin: 0;
	padding: 0;
	font-weight: normal;
	
}

ul{
	list-style-type:none;
}
ol li{
	list-style-position: inside;
}

textarea, input{	
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	font-size:1.25em;
}

a, a:visited {
	color: #60666b;
	text-decoration: none;
	
}
a:hover {
	color: #003569;
	text-decoration: underline;
}

a img {
	border: none;
}

.spacer{
	clear:both;
}


/*****************************

	GLOBAL

 *****************************/
 
 #page {
	width: 880px;
	margin: 0 auto;
	position: relative;
	min-height: 100%;
	_height: 100%;
}

/*****************************

	HEADER : logo et menu

 *****************************/

#header {
	background: url(cadre_blanc.png) center 70px no-repeat;
	_background:none;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/cadre_blanc_ie.png', sizingMethod='crop');
	height:318px;	
}

#header  div.services, #header div.inscription, #header div.equipe, #header div.emploi, #header div.faq , #header div.contact{
	height:318px;	
}

#header  div.services {
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.inscription {
	background: url(header/bg_inscription.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.equipe {
	background: url(header/bg_equipe.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.emploi {
	background: url(header/bg_emploi.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.faq {
	background: url(header/bg_faq.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.contact {
	background: url(header/bg_contact.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}

#header div.admin {
	background: url(header/bg_contact.jpg) center 81px no-repeat;
	background: url(header/bg_services.jpg) center 81px no-repeat;
}


#header h1, #logo {
	float: left;
	margin:35px 0 0 45px;
	width: 146px;
	height: 146px;
	background: url(logo.png) 0 0 no-repeat;
	_background:none;	
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/logo.png', sizingMethod='crop');
}

#header h1 span, #logo span, .hide{
	position: absolute;
	left: -5000px;
}

/*------------------------ Menu ---------------------------*/
#navigation ul {
	position:absolute;
	top:259px;
	right:18px;
}

#navigation li {
	display: inline;
}

#navigation li a {
	float: left;
	padding: 7px 3px;
	margin: 0 6px;
	color: #8F959A;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:1.3em;
	text-transform:uppercase;
	text-decoration: none;
}

#navigation li a:hover, #navigation li a.active{
	border-top: 3px solid #003569;
	padding-top: 4px;
	color: #003569;
}

/*------------------------ Langues ---------------------------*/
#header #lang{
	float: right;
	margin:58px 30px 0 0;
	font-size: 0.9em;
	text-align: right;
}

#header #lang ul {
	padding: 0;
	list-style: none;
}

#header #lang li {
	display: inline;
	float: left;
	color: #9BAAB9;
}

#header #lang li a {
	text-decoration: none;
	color: #8F959A;
}

#header #lang li a:hover, #header #lang li a.active {
	color: #d4d7d9;
}


/*****************************

	CONTENU

 *****************************/
#content{
	padding-top:15px;
	padding-bottom:35px;
	min-height:273px;
	_height: 273px;
}
 
 /*----------------- Colonne de gauche ----------------------*/

 #sub-nav-nobackg, #sub-nav{
	float:left;
	width:212px;
	margin-left:8px;
	padding-bottom:86px;
 }
 
 #sub-nav{
	background: url(cadre_sub_nav.png) 0 0 no-repeat;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/cadre_sub_nav.png', sizingMethod='crop');
	_background:none;
}

#sub-nav ul {
	list-style-type: none;
	margin:20px 4px 20px 14px;
}

#sub-nav li {
	padding: 5px 0 5px 11px;
	color: #687077;
	background: url(puce.png) left 10px no-repeat;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/puce.png', sizingMethod='crop');
	_background:none;
}

#sub-nav li a {
	color: #8F959A;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:1.1em;
	text-decoration: none;
}

#sub-nav li a:hover, #sub-nav li a.active{
	color:#003569;
}

#sub-nav .cta, .cta, #sub-nav .cta-repassage, .cta-repassage{
	background: url(cta_call_1.png) center 0 no-repeat;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/cta_call_1.png', sizingMethod='crop');
	_background:none;
	font-weight:bold;
	font-size:1.4em;
	color:#fff;
	height:64px;
	text-align:center;
	padding-top:16px;
	line-height:1.3em;
}

#sub-nav .cta-repassage, .cta-repassage{
	background: url(cta_call_2.png) center 0 no-repeat;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/cta_call_2.png', sizingMethod='crop');
	_background:none;
	text-align:right;
	padding-top:0;
	height:80px;
}
#sub-nav .cta-repassage a, .cta-repassage a{
	display: block;
	padding-right: 16px;
	padding-top:24px;
	color:#fff;
	text-decoration: none;
	height: 54px;
}
#sub-nav .cta a:hover, .cta a:hover{
	color:#fff;
}
/*---------------- Menu admin -----------------*/
#menu-admin {
	border:1px solid #00356B;
	width:160px;
	margin:0 auto;
	background-color:#fafafa;
}

#menu-admin h2, #menu-admin h2.sub{
	border-bottom:1px solid #00356B;
	background-color:#82A9D0;
	font-size:1em;
	font-weight:bold;
	padding:5px;
	text-align:center;
}

#menu-admin h2.sub{
	border-bottom:1px solid #00356B;
	border-top:1px solid #00356B;
	background-color:#b3cbe2;
}

#menu-admin ul {
	margin:0;
	padding:6px 0;
}

#menu-admin ul li{
	background:none;
	padding:2px 3px;
}

#menu-admin ul li a {
	text-decoration:none;
	color: #8F959A;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:1.05em;
}

#menu-admin ul li a:hover, #menu-admin ul li a.active{
	color:#003569;
}



 /*----------------- Main ----------------------*/
#main, #contact{
	float:left;
	width:614px;
	margin:3px 0 0 20px;
	font-weight:normal;
	font-size:1.15em;
	line-height:120%;
}

#main-spacer{
	height:110px;
	clear:both;
}
 
#main h3, #contact h3{
	color:#00366D;
	font-weight:bold;
	font-size:1.35em;
	margin-bottom:26px;
}
#main h3.inscription{
	margin-top: 24px;
}
 
#main p{
	margin:8px 0;
	text-align:justify;
}
#main.admin h4{
	font-weight:bold;
	color:#00366D;
	font-size:1.0em;
	margin:24px 0 16px 0;
}
/*-------------  special contenu -------------*/
#main h4{
	font-weight:bold;
	color:#8F959A;
	font-size:1.1em;
	margin:24px 0 16px 0;
}

#main h5{
	color: #00366D;
	font-size: 1em;
	font-weight: bold;
	margin:14px 0 8px 0;
}
.blue-title{
	color: #003569;
}
/*-------------  special contenu -------------*/
#main img{
	float:right;
	margin:8px 0 16px 30px;
}

#main ul{
	margin:0 0 16px 10px;
	list-style-type:none;
}

#main ul li{
	background: url(puce2.png) 0 8px no-repeat;
	padding:2px 0 8px 11px;
}
#main ol li{
	padding:2px 0 8px 0;
}
#main a.back-top{
	display: block;
	float: right;
	margin: 3px 12px 8px 0;
	padding-left: 12px;
	background: url(top.png) no-repeat 0 4px;
}

#main img.titre-service{
	clear: both;
	float: none;
	margin: 5px 25px;
}

/*-----------  Admin  ------------*/
#main.admin h2{
	font-size: 1.3em;
}
#main.admin ul li{
	background: url(puce2.png) 3px 8px no-repeat;
	padding: 1px 0 3px 18px;
	clear: both;
	margin: 0;
	height: 16px;
}
#main.admin ul li.pair{
	background-color: #d9d9d9;
}
#main.admin ul{
	margin: 20px 0 34px 0;
}
#main.admin ul li span{
	display: block;
	float: left;
	width: 36em;
}
/*-- Admin --*/
#main.admin .btn-edit, #main.admin .btn-supp, #main.admin .btn-add{
	display: block;
	float: left;
	padding-left: 20px;
	height: 20px;
}
#main.admin .btn-edit{
	background: url(page_edit.png) no-repeat 0 0;
}
#main.admin .btn-supp{
	background: url(cross.png) no-repeat 0 0;
	margin-left: 20px;
	color: #fb5656;
}
#main.admin .btn-add{
	background: url(add.png) no-repeat 0 0;
	margin-bottom: 20px;
}
/*------------  Tips  -----------*/
#tips{
	background: url(tips.png) no-repeat 0 0;
	_background:none;
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/css/tips.png', sizingMethod='crop');	
	width: 212px;
	text-align: justify;
	color: #001C38;
}
#tips h3{
	font-size:1.5em;
	font-weight: bold;
	padding: 18px 0 10px;
	text-align: center;
}
#tips-infos{
	min-height: 100px;
	_height: 100px;
	margin: 10px 18px;
}
#tips-infos h4{
	font-size:1.2em;
	text-align: left;
	margin: 0 0 12px 0;
	padding: 0;
}
#tips-bottom{
	background: url(tips_bottom.png) no-repeat 0 0;
	height: 15px;
}


/*----------- Contact ----------*/
#main input.input, #main textarea.input, #main input.input-err, #main textarea.input-err{
	border:1px solid #003D7B;
	width:300px;
	height:18px;
}
#main textarea.input, #main textarea.input-err{
	width:300px;
	height:140px;
}
#main textarea.input-err, #main input.input-err, #main select.input-err{
	background-color:#F8C3B9;
	border:1px solid #ff0000;
}
#main.admin input.field{
	border:1px solid #ccc;
	width: 480px;
	margin-bottom: 2px;
}
#main p.ok{
	text-align: center;
	font-size: 1.15em;
	margin: 30px 0;
}

#main p.err{
	font-size: 1.15em;
	margin: 5px 0 16px 70px;
	color: #ff0000;
}

#main p.err2{
	font-size: 1.15em;
	margin: 5px 0 5px 70px;
	color: #ff0000;
}
#main p.ch-oblig{
	font-size: 0.9em;
	margin: 5px 0 24px 115px;
}

#main p.ch-oblig2 {
	font-size: 0.7em;
	margin: 5px 0 24px 158px;
}

#main input.contact_btn, #main input.register_btn {
	margin-left:210px;
	padding:5px 12px;
	border:1px solid #003469;
	background: url(contact_back.png) repeat-x 0 0;
	color:#fff;
	font-weight:bold;
	cursor:pointer;
}

#main input.contact_btn {
	font-size:1.35em;
}

#main input.register_btn {
	font-size:1.20em;
}

#main label, #main label.err{
	width:106px;
	float:left;
	text-align:right;
	margin-right:8px;
	font-weight:bold;
	padding-top:3px;
}
#main label.err{
	color:#ff0000;
}
/* inscription formulaire */
#main.inscription label {
	width:150px;
}
#main.inscription input.prefixe{
	width:34px;
	font-size: 1em;
}
#main.inscription input.tel{
	width:116px;
}

#main.inscription input.postal {
	width:50px;
}

#main.inscription input.disabled {
	width: 238px;
	margin-left: 10px;
	background-color: #fff;
	color: #888;
	border:1px solid #003D7B;
}

#main.inscription select.selectcity {
	width: 238px;
	margin-left: 10px;
}

#main.inscription input.unfound {
	background-color:#F8C3B9;
	border:1px solid #ff0000;
}

#main.inscription input.niss1{
	width:57px;
}
#main.inscription input.niss2{
	width:30px;
}
#main.inscription input.niss3{
	width:22px;
}

#main.inscription input.voucher1{
	width:30px;
}
#main.inscription input.voucher2{
	width:40px;
}
#main.inscription input.voucher3{
	width:50px;
}

#main.inscription input.tel2{
	width: 30px; 
	margin-left: 2px;
}
#main.inscription input.tel3{
	width: 20px; 
	margin-left: 2px;
}
p.label-height {
	height: 34px;
}
p.label-height-2 {
	height: 48px;
}


/*-------------------------  Contact adresses  --------------------------------*/
#contact h4{
	clear: both;
	width: 80%;
	font-weight:bold;
	color:#003569;
	font-size:1.05em;
	margin:18px 0 6px;
}
#contact h4 span{
	color:#8F959A;
	font-size:0.85em;
}
#contact p{
	margin: 0 0 26px;
}
#contact p.coords{
	float: left;
	width: 220px;
}
#contact p.horaires{
	float: left;
}

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

#footer {
	margin:-86px auto 0;
	width:100%;
	text-align:center;
	background:url(footer.png) 0 0 repeat-x;
	height:86px;
	font-size:0.95em;
}
#footer p{
	width: 880px;
	margin:0 auto;
	padding-top:16px;
}
#footer a{
	text-align:center;
	display:inline;
	text-decoration:none;
	cursor:pointer;
	position:relative;
}
#footer a:hover{
	text-decoration:underline;
}
	
#footer a.vitam{
	color: #434343;
}