@charset "utf-8";

html {
	font-size: 62.5%;
}
body {
	background: url('images/background-front.png');
	color: #666666;
	font-family: "Century Gothic", helvetica, arial, sans-serif;
	font-size: 1.4em; /* equiv 14px */
	line-height: 1.5; /* adapt to your design */
}

/* soft reset */
html,
body,
label,
h1,h2,h3,h4,h5,h6,
div {
	margin: 0;
	padding: 0;
}
ul,
ol {
	padding-left: 30px;
}
code,
pre,
samp {
	white-space: pre-wrap;
	font-family: consolas, 'DejaVu Sans Mono', courier, monospace;
}
code { line-height: 1em; }
table { margin-bottom: 21px; }
.m-reset { margin: 0 !important; }
.p-reset { padding: 0 !important; }

/* avoid collapsing margins on headings */
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
	margin-top: 0;
}

/* avoid margins on nested elements */
li p,
li ul,
li ol {
	margin-top: 0;
	margin-bottom: 0;
}

/* HTML5 tags */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block;
}

/* max values */
img, table, td, blockquote, code, pre, textarea, input, object, video {
	max-width: 100%;
	height: auto;
}

/* Permets de couper les mots lors d'un passage a la ligne */
textarea, table, td, th, code, pre, samp, div, p {
	word-wrap: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

/* pictures */
img {
	width: auto;
	vertical-align: middle;
}
a img { border: 0; }

a {
	text-decoration:none;
	font-size:1.2em;
	color:#666;
	-webkit-transition-property: color;
		-webkit-transition-duration: 1s;
	-moz-transition-property: color;
		-moz-transition-duration: 1s;
	transition-property: color;
	transition-duration: 0.5s;	
}

p{
	text-align:justify;
	padding:10px 0 10px 0;
	margin:0;
}

p.forget{
	float:left;
	padding:0;
	margin:0;
	line-height:33px;
	margin-left:10px;
	cursor:pointer;
}	

p.presentation{text-align:center;}

p.error{text-align:center;color:#C31719;}

span.error{float:left;font-size:0.7em; color:red;}

.green{color:#C31719;}

/*** GLOBAL ***/

.clear {clear: both;font-size: 0%;height: 0px;}

.bloc_1{width:90%;padding:5%;}
.bloc_2{width:45%;padding:2.5%;}
.bloc_3{width:30.3333333%;padding:1.5%;}

.float_left{float:left;}
.float_right{float:left;}

.padding_5{padding-top:5%;}
.padding_10{padding-top:10%;}
.padding_15{padding-top:15%;}
.padding_20{padding-top:20%;}

.all_padding_5{padding:5%;}
.all_padding_10{padding:10%;}
.all_padding_15{padding:15%;}
.all_padding_20{padding:20%;}

.text_center {text-align:center;}
.text_left {text-align:left;}
.text_justify {text-align:justify;}
.text_right {text-align:right;}

.font_xsmall {font-size:0.5em;}
.font_small {font-size:0.75em;}
.font_medium {font-size:1em;}
.font_large {font-size:1.25em;}
.font_xlarge {font-size:1.5em;}

.mbottom_xsmall {margin-bottom:1em}
.mbottom_small {margin-bottom:2em}
.mbottom_medium {margin-bottom:3em}
.mbottom_large {margin-bottom:4em}
.mbottom_large {margin-bottom:5em}

.radius_top_left{
	border-top-left-radius : 10px;
	-moz-border-radius-topleft : 10px;
	-webkit-border-top-left-radius : 10px;
}

.radius_bottom_left{
	border-bottom-left-radius : 10px;
	-moz-border-radius-bottomleft : 10px;
	-webkit-border-bottom-left-radius : 10px;
}

.radius_top_right{
	border-top-right-radius : 10px;
	-moz-border-radius-topright : 10px;
	-webkit-border-top-right-radius : 10px;
}

.radius_bottom_right{
	border-bottom-right-radius : 10px;
	-moz-border-radius-bottomright : 10px;
	-webkit-border-bottom-right-radius : 10px;
}

.box_shadow{
/*
	-webkit-box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.5);
			box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.5);	
*/
}

/*** DEBUT TYPO ***/
/*@font-face {
	font-family: 'HNLight';
	src: url('../font/helveticaneueltstd-lt-webfont.eot');
	src: url('../font/helveticaneueltstd-lt-webfont.eot?#iefix') format('embedded-opentype'), url('../font/helveticaneueltstd-lt-webfont.woff') format('woff'), url('../font/helveticaneueltstd-lt-webfont.ttf') format('truetype'), url('../font/helveticaneueltstd-lt-webfont.svg#HelveticaNeueLTStd45Light') format('svg');
	font-weight: normal;
	font-style: normal;
}*/

/*** FIN TYPO ***/


/*** FIN TYPO ***/
/*** DEBUT ENTETE ***/

#wrapper{width:960px;margin:auto;}

#top {
	margin-top:20px;
	padding: 5px 10px 5px 10px;	
	color:#666;
	font-size:1.25em;
	display:none;
}

#top .hidden{font-size:0px;}

#header {
	width: 100%;
	position: relative;
	height:100px;
	text-align:center;
	z-index:1;
	margin-top:10%;
}

#head {
	width: 180px;
	padding: 10px;
	margin: auto;
	position: relative;
	/*border-bottom:solid 2px #f5f5f5;*/
	text-align:center;
	float:left;
	background:#fff;
	height:80px;
}

#head img{max-height:100%;}

/*
#head #bg_left,
#head #bg_right{
	width:100px;
	height:138px;
	position:absolute;
	top:0px;
	z-index:2;
}

#head #bg_left{
	background:url('images/head-left.png') left top repeat-y;
	left:0px;
}

#head #bg_right{
	background:url('images/head-right.png') left top repeat-y;
	right:0px;	
}
*/

#head #bg_left,
#head #bg_right{display:none;}

.border{
	background: #C31719;
	/*background: -moz-linear-gradient(top,  #C31719 0%, #cfdd7a 50%, #97c227 51%, #97c227 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C31719), color-stop(50%,#cfdd7a), color-stop(51%,#97c227), color-stop(100%,#97c227));
	background: -webkit-linear-gradient(top,  #C31719 0%,#cfdd7a 50%,#97c227 51%,#97c227 100%);
	background: -o-linear-gradient(top,  #C31719 0%,#cfdd7a 50%,#97c227 51%,#97c227 100%);
	background: -ms-linear-gradient(top,  #C31719 0%,#cfdd7a 50%,#97c227 51%,#97c227 100%);
	background: linear-gradient(to bottom,  #C31719 0%,#cfdd7a 50%,#97c227 51%,#97c227 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C31719', endColorstr='#97c227',GradientType=0 );*/
	display:block;
	-webkit-box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 1);
	   -moz-box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 1);
			box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 1);		
	width:97%;
	height:1px;
	margin:auto;
	margin-bottom:8px;
}

#header .border{
	/*width:100%;
	height:2px;
	position:relative;
	z-index:3;
	margin-bottom:0;*/
	display:none;
}

#content .border{
	position:absolute;
	z-index:3;
	bottom:30px;
	left:50%;
	margin-left:-475px;
}

#logo img{margin-top:-45px;}

#logo:hover {text-decoration: none;}

#logo span {
	visibility: hidden;
	border: 0px none;
	position:absolute;
	z-index:2;	
}

#logo a {text-decoration: none;position:absolute;z-index:2;}

#background_navigation, #background_navigation_right {
	width: 375px;
	height:100px;
	position:relative;
	z-index:3;
	margin:auto;
	-webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.5);	
	background: #4c4c4c;
	background: -moz-linear-gradient(top,  #4c4c4c 0%, #131313 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(100%,#131313));
	background: -webkit-linear-gradient(top,  #4c4c4c 0%,#131313 100%);
	background: -o-linear-gradient(top,  #4c4c4c 0%,#131313 100%);
	background: -ms-linear-gradient(top,  #4c4c4c 0%,#131313 100%);
	background: linear-gradient(to bottom,  #4c4c4c 0%,#131313 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 );
	float:left;
}

#background_navigation_right{float:right;width: 300px;background:transparent;}

.navigation{
	width: 365px;
	/*padding: 0 0 0 16px;*/
	padding: 0;
	margin: 0 auto;
	position:relative;
	z-index:9;	
	height:50%;
	float:left;
	padding-right:10px;
}

.navigation.navigation-first{border-bottom:solid 1px #fff;height:49px;}

.navigation li {
	list-style: none;
	width: auto;
	text-align: center;	
	margin:0;
	height:50px;
	line-height:50px;
	margin:0;
	float:right;
}

.navigation li.connexion{position:relative;background:none;padding-right:75px;}
.navigation li.connexion span{display:block;position:absolute;right:0;top:-4px;height:54px;width:70px;background:url('images/connexion-solutions.png') center center no-repeat;}
.navigation li.line{height:50px;line-height:1em;font-weight:bold;}
.navigation li.line strong{color:#fff;font-size:1.5em;letter-spacing:.25em;display:block;margin-top:3.5px;margin-bottom:1.5px;}
.navigation li.line span{font-size:.75em;font-weight:normal;}

.navigation li a {
	color:#fff;
	font-size:1.1em;
	border-left:solid 1px #fff;
	padding:0 5px;
}

.navigation li a:hover,.navigation li.menu_current a {color:#C31719;}
.navigation li.connexion a:hover,.navigation li.connexion.menu_current a {color:#fff;}
.navigation li.no_border a {border:none;}

.navigation.navigation-connexion{float:right;width: 290px;background:#C31719;}
.navigation.navigation-connexion li a{font-size:1.25em;}
.navigation.navigation-contact{float:right;width: 300px;padding:0;background:#93969A;}

.navigation.navigation-contact{text-align:center;}
.navigation.navigation-contact li{float:none;color:#1D2124;}
/*** FIN ENTETE ***/
/*** DEBUT CORPS ***/

#wait {
	width:100%;
	height:100%;
	position:absolute;
	/*background:#666;
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */	
	text-align: center;
}

#wait img {padding-top:25%;}

#main{/*width: 1280px;*/width: 960px;margin: auto;}

#content, #top {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	text-align:center;
	z-index:0;	
	position:relative;	
}

#content{/*padding: 30px 10px 40px 10px;*/min-height:500px;}

#content ul {padding:30px;}

#content li {text-align:justify;padding:5px 0 5px 0;}

#presentation-accueil {width:750px; margin:auto;height:500px;background:#fff;}
#presentation-accueil img{max-width:100%;}
#presentation {width:750px; margin:auto;height:auto;min-height:500px;background:#fff;padding-top:50px;}

.content{width:97%;margin:auto;}

#content h1{
	background:url('images/carre_rouge.png') left center no-repeat;
	color:#7F7F7F;
	height:30px;
	line-height:30px;
	width:auto;
	padding:10px 0 10px 35px;
	margin:auto;
	display:inline-block;
}

#content h2{
	background:url('images/carre_rouge.png') left center no-repeat;
	color:#7F7F7F;
	font-size:1.75em;
	height:24px;
	line-height:24px;
	width:auto;
	padding:10px 0 10px 35px;
	margin:auto;
	display:inline-block;
}

#content h2.gris{background:url('images/carre_gris.png') left center no-repeat;}

.bloc_3 img {padding-top:10px;}

/*** FIN CORPS ***/

/*********************
DEBUT GENERAL
**********************/

.fancyblock{
	width:75%;
	padding:5%;
	margin:auto;
	text-align:center;
}

.fancyblock h2 {text-transform:uppercase;}
.fancyblock table{text-align:justify;}
.fancyblock table td {vertical-align:top;padding:10px 0px;}

/*******************
FIN GENERAL
********************/

/*** INPUT TYPE FILE ***/
.file-wrapper {
	cursor: pointer;
	display: inline-block;
	overflow: hidden;
	position: relative;
	float:left;
}

.file-wrapper input {
	cursor: pointer;
	font-size: 100px;
	height: 100%;
	filter: alpha(opacity=1);
	-moz-opacity: 0.01;
	opacity: 0.01;
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;	
}

.file-wrapper .button {
	background: #A8A8A7;
	color: #fff;
	display: inline-block;
	margin-right: 5px;
	padding: 4px 18px;
	text-transform: uppercase;
	font-family:"century gothic", arial, verdana, sans-serif;	
	cursor: pointer;		
}

/*** FORMULAIRE ***/

span.radio{float:left;padding:0 10px;line-height:27px;display:block;}

input, select, textarea{
	float:left;
	transition: border 0.5s;			
	border:solid 1px #666;
	padding:5px;
	height:20px;
	width:50%;
} 

textarea {height:150px;}

input.cp {margin-right:2.8%;width:10%;}

input.ville, select.ville{width:35%;}

select {height:32px;}
 
input:focus, textarea:focus,
input:hover, textarea:hover {border:solid 1px #C31719;}

.loader{float:left;width:auto;text-align:center;padding-top:3px;}
 
/*** DEBUT FOOTER ***/

#footer{
	position:absolute;
	bottom:-40px;
	right:65px;
	text-align:center;
	width:80px;
	height:80px;
	background:#c31719 url('images/contact.png') center center no-repeat;
}

#footer a {display:block;width:80px;height:80px;}

#footer_ref {width:960px;margin:auto;margin-bottom:30px;}


#footer_ref ul {
	float:left;
	width:15%;
	border-left:solid 1px #666;
	padding-right:1.5%;
	margin:0;
}

#footer_ref ul.first {border-left:none;}

#footer_ref ul li{
	list-style:none;
	font-size:0.75em;
	text-align:left;
	padding:0;
	margin:0;
	color: #666;
}

#date_heure{color:#19181C;font-size:1em;font-size:1em;margin-bottom:8px;line-height:3em;}

/*** FIN FOOTER ***/

label{float:left;display:block;width:250px;text-align:left;}
input[type="radio"]{width:20px;margin:auto;line-height:27px;}
select{text-transform:uppercase;}
.bloc_50{float:left;width:45%;padding-left:2.5%;padding-right:2.5%;}

input.cp {margin-right: 2.8%;width: 10%;}
input.ville, select.ville {width: 35%;}

.invisible{display:none;}
.block{display:block;}

.presentation{padding-top:5%;}

.presentation p {text-align:center;padding:0px 10px 0px 10px !important;}

form.jqtransformdone {
    margin: auto;
    width: 50%;
}

.stagiaire, .etablissement{display:block;color:#C31719;cursor:pointer;}
.stage{padding-top:25%;}

input[type="submit"]{height:30px;line-height:30px;width:52.5%;}

@media screen and (max-width: 1280px) {
	#navigation li {width:125px;}
	#navigation li.connexion{padding-left:35px;background:url('images/carre_rouge.png') left center no-repeat;}
	#navigation li.connexion span{background:none;}
}

@media screen and (max-width: 960px) {
	#main, #content, #top, #footer {width: 800px;}
	#footer{width: 750px;position:relative;margin:auto;display:block;bottom:auto;right:auto;}
	#footer 	a{width: 750px;}
	#navigation li {width:125px;}
	#navigation li.connexion{padding-left:35px;background:url('images/carre_rouge.png') left center no-repeat;}
	#navigation li.connexion span{background:none;}
}

@media screen and (max-width: 800px) {
	#main, #content, #top {width: 100%;}
	#navigation li {display:block;width:50%;margin:auto;background:none;height:auto;line-height:auto;border-bottom:solid 1px #666;}
	#presentation-accueil, #presentation{width: 100%;min-height:0;height:auto;}
	#footer{width: 100%;position:relative;margin:auto;display:block;bottom:auto;right:auto;height:60px}
	#footer 	a{width: 100%;height:60px}
	.bloc_50{width:100%;}
	form.jqtransformdone label, input, select, textarea{float:none;width:100% !important;text-align:center;}
	input.ville, select.ville{margin-top:10px;}
	#navigation li {width:75%;}
	#navigation li.connexion{padding-left:35px;background:none;}
	#navigation li.connexion span{background:none;}
}