@charset "utf-8";
/* CSS Document */

*{
	margin:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
}

body,html{
	background-color:#cef8ff;
	width:100%;
	min-width:800px;
	height:100%;
}

#temp{
	display:none;
}

#conteneur{
	width:100%;
	min-width:800px;
	min-height:100%;
	background:url("images/background.jpg") bottom left no-repeat ;
	background-attachment:fixed;
}

#conteneur table{
	clear:both;
	width:80%;
	min-width:800px;
	border:none;
	margin:auto;
	margin-top:3px;
	background:url(images/bgTable.png) top left;
	border:1px #FFF outset;
	-moz-border-radius:0 0 10px 10px; /* CSS3 Firefox */
	-webkit-border-bottom-left-radius:10px; /* CSS3 Safari */
	-webkit-border-bottom-right-radius:10px;
}

#conteneur th {
	font-size:1.1em;
	border-bottom:2px double #039;
	border-collapse:collapse;
	padding:0.6em;
	margin-right:0.2em;
	
}

#conteneur td {
	text-align:center;
	border-bottom:1px dashed #039;
	padding-top:0.4em;
	padding-bottom:0.4em;
	padding-left:0.8em;
}

.spacer{
	clear:both;
	height:0;
	margin:0;
	padding:0;
	border:none;
	line-height:0;
}

/*
Mise en page de la div de login
*/

#panel{
	width:100%;
	height:0;
	background-color:#09C;
	color:#FFF;
}

#panel_content{
	width:500px;
	height:220px;
	margin:auto;
	display:none;
	
}

#panel_content form{
	padding-top:40px;
}

#panel_content label{
	width:200px;
	font-size:20px;
	float:left;
	display:block;
	
	
}

#panel_content input{
	width:180px;
	height:35px;
	font-size:1.5em;
	border:2px solid #069;
	
}

#panel_content input:focus{
	background-color:#6F6;
	border:2px solid #FFF;
	
}

#panel_content input.submit{
	
	width:385px;
	height:40px;
}

#panel_content input.submit:hover{
	background-color:#6F6;
	border:2px solid #FFF;	
}

.panel_button {
	position:relative;
	height:20px;
	background:url("images/loginBG.png") top center repeat-x;
	text-align:right;
	padding-right:20px;
	
}

.panel_button a {
	display:block;
	position:absolute;
	top:0;
	right:0;
	text-decoration:none;
	color:#FFF;
	font-weight:bold;
	width:200px;
	height:100px;
	padding-top:15px;
	text-align:center;
	background:url("images/ongletLogin.png") top center no-repeat;
}

.panel_button a:hover{
	text-decoration:underline;
}

#hide_button{
	display:none;
}

#show_button{
	display:block;
}

#loginForm p {
	margin-left:100px;
}

#feu{
	position:absolute;
	width:0px;
	margin:auto;
	
}

#feu img{
	position:relative;
	top:0;
	left:-110px;
	display:none;
}

/* Mise en forme des boutons */

a.icone{
	display:block;
	width:93px;
	height:40px;
}

a.ajout{
	background:url(images/btnAjout.png) top center no-repeat;
}

a.ajout:hover{
	background:url(images/btnAjoutHover.png) top center no-repeat;
}

a.ajout:active{
	background:url(images/btnAjoutActive.png) top center no-repeat;
}

a.retrait{
	background:url(images/btnRetrait.png) top center no-repeat;
}

a.retrait:hover{
	background:url(images/btnRetraitHover.png) top center no-repeat;
}

a.retrait:active{
	background:url(images/btnRetraitActive.png) top center no-repeat;
}

a.annuler{
	background:url(images/btnAnnuler.png) top center no-repeat;
}

a.annuler:hover{
	background:url(images/btnAnnulerHover.png) top center no-repeat;
}

a.annuler:active{
	background:url(images/btnAnnulerActive.png) top center no-repeat;
}

/* Mise en page de la page d'accueil */

#accueil{
	width:70%;
	margin-top:30px;
	margin:auto;
}

#accueil p{
	text-align:justify;
	
}

#accueil div.col1, #accueil div.col2, #accueil div.col3{
	float:left;
	min-height:300px;
	width:29%;
	padding:2%;
	
	
}

#accueil div.col1 p, #accueil div.col2 p, #accueil div.col3 p{
	background:url(images/bgTable.png) top center;
	min-height:180px;
	padding:10px;
	border:1px outset #036;
}

#accueil h2{
	color:#333;
	font-variant:small-caps;
	font-style:oblique;
	font-family:"Warnock Pro","Goudy Old Style","Palatino","Book Antiqua",Georgia,serif;
	line-height:0.9em;
	border-bottom:1px #006 solid;
	margin-bottom:30px;
}

#accueil h2 span{
	font-size:1.1em;
	font-family:"Warnock Pro","Goudy Old Style","Palatino","Book Antiqua",Georgia,serif;
	letter-spacing:0.2em;
	color:#000;
	
}

#accueil #dejaInscrit{
	position:absolute;
	top:40px;
	right:75px;
}

#accueil p.welcome{
	width:70%; /* Oouahou ! */
	margin:auto;
	font-size:22px;
	font-weight:100;
	font-style:italic;
	font-family:"Warnock Pro","Goudy Old Style","Palatino","Book Antiqua",Georgia,serif;
	color:#06C;
	padding-top:60px;
	padding-bottom:15px;
}

#accueil p.welcome span{
	color:#039;
	font-size:18px;
	font-variant:small-caps;
	word-spacing:1px;
	font-style:italic;
	margin-bottom:0;
}

#accueil a {
	display:block;
	background:url(images/inscription.png) top center no-repeat;
	width:192px;
	height:60px;
	margin:auto;
}

#accueil p.welcome a span{
	display:none;
}

#accueil .probleme{
	font-size:12px;
	font-style:italic;
}

/* Mise en forme du formulaire d'inscription */

#inscription{
	display:none;
}

#inscriptionForm{
	padding-top:30px;
	width:90%;
	margin:auto;
}

#inscriptionForm label{
	width:40%;
	font-size:16px;
	float:left;
	display:block;
	
	
}

#inscriptionForm input{
	width:57%;
	height:20px;
	font-size:1.1em;
	border:2px solid #069;
	margin-bottom:2px;
	
}

#inscriptionForm input:focus{
	background-color:#9FC;	
}

#inscriptionForm input.submit{
	
	width:98%;
	height:30px;
	margin-top:20px;
	margin-bottom:30px;
}

#inscriptionForm input.submit:hover{
	background-color:#9FC;	
}

#inscriptionForm .error{
	clear:both;
	padding: .5em;
	width:93%;
	margin-bottom: 1em;
	border: 2px solid #FBC2C4;
	background: #FBE3E4;
	color: #8a1f11;
}

#inscriptionForm .success{
	clear:both;
	padding: .5em;
	width:93%;
	margin-bottom: 1em;
	background: #E6EFC2;
	color: #264409;
	border:2px solid #C6D880;
}

/* Mise en forme de la page d'activation */

#activationMessage{
	padding-top:150px;
	
}

#activationMessage .success{
	clear:both;
	padding: .5em;
	width:55%;
	min-height:100px;
	margin:auto;
	background: #E6EFC2;
	color: #264409;
	border:2px solid #C6D880;
}

#activationMessage .error{
	clear:both;
	padding: .5em;
	width:55%;
	min-height:100px;
	margin:auto;
	border: 2px solid #FBC2C4;
	background: #FBE3E4;
	color: #8a1f11;
	
}

#activationMessage form{
	width:55%;
	margin:auto;
	padding:20px;
	padding-bottom:40px;
	background-color:#9CE9FB;
	border:1px outset #FFF;
}

#activationMessage h1{
	text-align:center;
	margin:30px;
	color:#333;
	font-size:24px;
	font-variant:small-caps;
}

#activationMessage input{
	width:65%;
	height:30px;
	font-size:20px;
	border:2px solid #09C;
}

#activationMessage label{
	width:30%;
	font-size:20px;
	float:left;
	clear:both;
}

#activationMessage input#submit{
	width:95%;
	height:35px;
	margin-top:10px;
}

#activationMessage input#submit:hover{
	background-color:#0FC;
}

/* Mise en forme du formulaire de nouveau trajet */

#nouveauTrajet{
	width:80%;
	margin:auto;
	padding-top:116px;
}
#nouveauTrajet form{
	display:none;
}

#nouveauTrajet p a{
	display:block;
	text-decoration:none;
	text-align:right;
	padding-right:10px;
	font-weight:bold;
	color:#FFF;
	background-color:#4FB8DC;
	border:1px outset #FFF;
	-moz-border-radius:10px 10px 0 0; /* CSS3 Firefox */
	-webkit-border-top-left-radius:10px; /* CSS3 Safari */
	-webkit-border-top-right-radius:10px;
}

#nouveauTrajet p a:hover{
	background-color:#039;
}

#nouveauTrajet .success{
	clear:both;
	padding: .5em;
	width:65%;
	margin:auto;
	margin-top:20px;
	margin-bottom:20px;
	background: #E6EFC2;
	color: #264409;
	border:2px solid #C6D880;
}

#nouveauTrajet .error{
	clear:both;
	padding: .5em;
	width:65%;
	margin:auto;
	margin-top:1em;
	margin-bottom:-10px;;
	border: 2px solid #FBC2C4;
	background: #FBE3E4;
	color: #8a1f11;
	
}

#nouveauTrajet .notice{
	padding: .5em;
	width:40%;
	margin-left:55%;
	display:none;
	margin-top:30px;
	margin-bottom:1em;
	background: #FFF6BF;
	color: #514721;
	border: 2px solid #FFD324;
}

#nouveauTrajet form{
	padding-top:30px;
	padding-left:3%;
	width:50%;
	float:left;
}

#nouveauTrajet input{
	width:50%;
	height:25px;
	margin-bottom:5px;
	font-size:20px;
	
}

#nouveauTrajet input.short{
	width:10%;
}

#nouveauTrajet input.shorter{
	width:6%;
}

#nouveauTrajet label{
	clear:both;
	width:45%;
	float:left;
	font-size:20px;
	
}

#nouveauTrajet label.date{
	width:auto;
	float:none;
	display:inline;
}

#nouveauTrajet .submit{
	width:96%;
	height:40px;
	font-size:20px;
}

/* Mise en forme de la page de récapitulatif */

#recap{
	width:60%;
	margin:auto;
	padding-top:50px;
	
	
}

#recap h1{
	text-align:center;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size:18px;
	height:22px;
	color:#FFF;
	border:1px outset #CCC;
	margin-top:87px;
	background-color:#4FB8DC;
}

#recap h2{
	margin-left:10px;
	text-align:left;
	border-bottom:double #09C;
	font-size:18px;
	font-variant:small-caps;
}

#recap .info{
	border:1px outset #CCC;
	background:url(images/bgTable.png) top center;
	margin-bottom:22px;
}

#recap p{
	margin:10px 20px;
	font-family:Arial, Helvetica, sans-serif;
	
}
	
#versAccueil{
	position:absolute;
	top:55px;
	right:10px;
}

#versAccueil img, #versRecap img{
	border:none;
}

#versRecap{
	position:absolute;
	top:55px;
	left:10px;
}