﻿/* On intégre des polices */

@font-face {
  font-family: 'Glyphs';
  src: url('police/stargate_glyphs.ttf');
}

/* Body */
body{
	/* --- CSS pour le texte en lui même --- */
	font-family : Arial, Calibri, sans-serif; /* La police */
	font-size : 12px; /* Taille de la police */
	color : #dcdcdc;
	line-height : 16px; /* La hauteur d'une ligne d'un bloc de texte */
	text-shadow : 0px 1px 0px #000000; /* Ajoute de l'ombre sur le texte : Décalage horizontal - puis vertical - Flou - Couleur */
	
	/* --- CSS pour le background --- */
	background : black url(./image/fond/space_vaisseau.jpg) no-repeat center top;
	background-attachment : fixed;
}

/* Les liens de la page en général */
a{
	color : #dcdcdc;
	text-decoration : underline;
}

/* Les images de la page en général */
img{
	border : 0px;
}

/* Les images avec des bord arrondi */
img.bordure{
	margin : 10px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	-moz-border-radius : 5px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 5px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 5px;

	-moz-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 5px #1c588a;
	
	-webkit-transition : all .4s ease-in-out;
	-moz-transition : all .4s ease-in-out;
}

/* Les images avec des bord arrondi en mode hover */
img.bordure:hover{
	border-color : #FFFFFF;
	outline : none; /* Pour enlever le contour lorsque le navigateur le met lui même lorsque l'on sélectionne un input */
	
	-moz-box-shadow : 0px 0px 5px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 5px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 5px #FFFFFF;
}

/* Les images screen avec des bord arrondi */
img.screen{
	margin : 0px 8px 30px 8px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	-moz-border-radius : 8px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 8px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 8px;
	
	-moz-box-shadow : 0px 0px 8px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 8px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 8px #1c588a;
	
	-webkit-transition : all .4s ease-in-out;
	-moz-transition : all .4s ease-in-out;
}

/* Les images screen avec des bord arrondi en mode hover */
img.screen:hover{
	border-color : #FFFFFF;
	outline : none; /* Pour enlever le contour lorsque le navigateur le met lui même lorsque l'on sélectionne un input */
	
	-moz-box-shadow : 0px 0px 8px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 8px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 8px #FFFFFF;
}

/* Pour les grandes images */
img.screen_grand{
	border-color : #000000;
	
	-moz-border-radius : 15px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 15px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 15px;
	
	-moz-box-shadow : 0px 0px 15px #000000; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 15px #000000; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 15px #000000;
}

/* Pour le menu en haut de la page */
#menu ul {
	margin-left : auto; 
	margin-right : auto;
	margin-top : 20px;
	list-style-type : none; /* Enlève le style liste */
	width : 860px;
	height : 36px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #000000, #03111e); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#03111e), to(#000000)); /* Chrome, Safari : Dégradés de couleur */
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px; 
	
	-moz-box-shadow : 0px 0px 15px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 15px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 15px #1c588a;
}

/* Pour les liens dans le menu */
#menu ul a{
	width : 76px;
	text-align : center;
	display : block;
	padding : 10px 15px 10px 15px;
	list-style-type : none; /* Enlève le style liste */
	float: left;
	
	font-size : 12px;
	font-weight : bold; /* Texte en gras */
	text-decoration : none; /* Enlève les décorations du texte */
	
	border-right : 1px solid #1c588a;
	-moz-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	
	-webkit-transition : color .5s ease-in;
	-moz-transition : color .5s ease-in;
}

/* Pour afficher le nom et le prénom de la personne connecté */
#menu ul .no_lien{
	display : block;
	padding : 10px 30px 10px 0px;
	list-style-type : none; /* Enlève le style liste */
	float: left;
	
	font-size : 12px;
	font-weight : bold; /* Texte en gras */
	text-decoration : none; /* Enlève les décorations du texte */
}

/* Le premier lien */
#menu ul a.first{
	border-left : 1px solid #1c588a;
}

/* Quand on passe la souris au-dessus d'un lien */
#menu ul a:hover{
	color : #024271;
	text-shadow : 1px 0px 2px #000000; /* Ajoute de l'ombre sur le texte : Décalage horizontal - puis vertical - Flou - Couleur */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #03111e, #000000); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#000000), to(#03111e)); /* Chrome, Safari : Dégradés de couleur */
}

#intro{
	display : none;
	opacity : 0;
	margin-right : auto; 
	margin-left : auto;
	padding-top : 200px;
	height : 140px;
	width : 650px;
}

#symbole{
	opacity : 0;
	font-family : 'Glyphs', Arial, Calibri, sans-serif;
	font-size : 17px;

	margin-left : auto; 
	margin-right : auto; 
	
	padding-top : 4px;
	padding-bottom : 8px;
	
	vertical-align : top;
	text-align : center;
}

#symbole .allume, #intro .allume{
	color : #227bb5; /* Ajoute un bord */
	text-shadow : 1px 1px 2px #227bb5, -1px -1px 2px #227bb5; /* Ajoute de l'ombre sur le texte : Décalage horizontal - puis vertical - Flou - Couleur */
}

/* Pour le corps */
#corps{
	font-size : 12px;
	margin-left : auto; 
	margin-right : auto; 
	width : 860px;
	min-height : 150px; /* Hauteur minimum */
	padding : 5px 20px 20px 20px; /* Un espace entre le texte et le bord */
	margin-top : 75px; 
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(100deg, #020e1b, #082338); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#082338), to(#020e1b)); /* Chrome, Safari : Dégradés de couleur */
	background-repeat : no-repeat;
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px; 
	
	-moz-box-shadow : 0px 0px 15px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 15px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 15px #1c588a;
}

/* Mise en forme de h1 pour le corps */
#corps h1, #sous_corps h1{
	border-bottom : 1px solid #1c588a;
	font-size : 11px;
	font-weight : bold;
	letter-spacing : 2px; /* Espace entre les lettres */
	margin-bottom : 10px; 
	text-transform : uppercase; /* Le texte en majuscule */
	cursor : pointer;
}

/* Mise en forme de h2 pour le corps */
#corps h2, #sous_corps h2{
	color : #0d639c;
	border-bottom : 1px dotted #1c588a;
	font-size : 11px;
	font-weight : bold;
	margin-bottom : 5px; 
	text-transform : uppercase; /* Le texte en majuscule */
	cursor : pointer;
}

/* Mise en forme de h3 pour le corps */
#corps h3, #sous_corps h3{
	color : #F75200;
	font-size : 10px;
	font-weight : bold;
	margin-bottom : 5px; 
	text-transform : uppercase; /* Le texte en majuscule */
	cursor : pointer;
}

/* La sous partie */
#corps div.sous_partie, #sous_corps div.sous_partie{
	text-align : justify;
	padding : 0px 30px 20px 30px;
}

/* La sous partie mais au centre ! */
#corps div.sous_partie_centre, #sous_corps div.sous_partie_centre{
	vertical-align : center;
	text-align : center;
	padding : 0px 30px 20px 30px;
	margin-right : auto;
	margin-left : auto;
}

/* Div pour les news */
#corps div.news, #sous_corps div.news{
	text-align : justify;
	font-size : 1em;
	line-height : 16px; /* La hauteur d'une ligne d'un bloc de texte */
	
	-moz-column-count : 2;
	-webkit-column-count : 2;
	column-count : 2;
	
	-moz-column-gap : 20px;
	-webkit-column-gap : 20px;
	column-gap : 20px;
}

/* Centrer les textes des div */
#corps div.center, #sous_corps div.center{
	text-align : center;
	width : 100%
}

/* Centrer les tableaux */
#corps table.center, #sous_corps table.center{
	margin-left : auto; 
	margin-right : auto; 
	width : 100%;
}

/* Les tableaux */
#corps table.staff{
	margin-left : auto; 
	margin-right : auto; 
	padding-top : 20px; 
	padding-bottom : 30px;
	width : 78%;	
}

#corps table.staff th{
	padding-bottom : 4px;
	font-size : 0.9em;
	text-transform : uppercase; /* Le texte en majuscule */
}

/* Les tableaux : ligne */
#corps table.staff td{
	padding-top : 2px;
	border-bottom : 1px solid #1c588a;
}

/* Tableaux ligne */
#sous_corps table.ligne td{
	padding-top : 2px;
	border-bottom : 1px solid #1c588a;
}

/* Pour les pages */
#corps div.page{
	text-align : right;
	padding : 5px 20px 2px 20px;
	vertical-align : top;
	width : 98%
}

/* Pour les pages */
#corps a.nb_page{
	color : dcdcdc;
	cursor : pointer; /* Curseur de type pointer */
	font-family : Arial, Calibri, sans-serif;
	font-size : 12px;
	padding : 3px 5px 3px 5px;
	margin : 3px 2px 3px 2px;
	text-decoration : none; /* Enlève la décoration du texte */
	text-shadow : 0px 1px 0px black;
	
	border : 1px solid #03111e; /* Ajoute un bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #000000, #03111e); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#03111e), to(#000000)); /* Chrome, Safari : Dégradés de couleur */
	background-repeat : no-repeat;
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px; 

	-moz-box-shadow : 0px 0px 2px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 2px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 2px #1c588a;
}

/* Pour les pages */
#corps a.nb_page_actuelle{
	color : white;
	cursor : pointer; /* Curseur de type pointer */
	font-family : Arial, Calibri, sans-serif;
	font-size : 12px;
	font-weight : bold;
	padding : 3px 5px 3px 5px;
	margin : 3px 2px 3px 2px;
	text-decoration : none; /* Enlève la décoration du texte */
	text-shadow : 0px 1px 0px #000000; /* Ajoute de l'ombre sur le texte : Décalage horizontal - puis vertical - Flou - Couleur */
	
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(100deg, #020e1b, #082338); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#082338), to(#020e1b)); /* Chrome, Safari : Dégradés de couleur */
	background-repeat : no-repeat;
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px; 

	-moz-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 5px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 5px #1c588a;
}


/* Le bas de la page */
#copyright{
	font-size : 11px;
	margin-top : 20px;
	text-align : center;
	padding-bottom : 30px;
}

label{
	font-weight : bold;
	cursor : pointer;
}

/* Les labels */
label.connexion{
	font-weight : bold;
	margin-right : 10px;
	cursor : pointer;
}


/* Pour les champs d'un formulaire : mode Normal */
input[type=text], input[type=password], input[type=checkbox], textarea {
	color : #dcdcdc;
	font-family : Arial, Calibri, sans-serif;
	font-size : 12px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	padding : 3px; /* Un espace entre le texte et le bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #03111e, #000000); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#000000), to(#03111e)); /* Chrome, Safari : Dégradés de couleur */
	
	-moz-border-radius : 3px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 3px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 3px;

	-moz-box-shadow : 0px 0px 3px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 3px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 3px #1c588a;
}

select{
	color : #dcdcdc;
	font-family : Arial, Calibri, sans-serif;
	font-size : 12px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	padding : 3px; /* Un espace entre le texte et le bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #03111e, #000000); /* Firefox : Dégradés de couleur */
	
	-moz-border-radius : 3px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 3px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 3px;

	-moz-box-shadow : 0px 0px 3px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 3px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 3px #1c588a;
}

/* Pour les champs d'un formulaire : mode Focus */
input[type=text].erreur:focus, input[type=password].erreur:focus, input[type=text]:focus, input[type=password]:focus, input[type=checkbox]:focus, textarea:focus, select:focus{
	border-color : #FFFFFF;
	outline : none; /* Pour enlever le contour lorsque le navigateur le met lui même lorsque l'on sélectionne un input */
	
	-moz-box-shadow : 0px 0px 3px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 3px #FFFFFF; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 3px #FFFFFF;
}

/* Personnalisé */
input[type=text].erreur, input[type=password].erreur{
	border : 1px solid red;
	
	-moz-box-shadow : 0px 0px 3px red;
	-webkit-box-shadow : 0px 0px 3px red;
	box-shadow : 0px 0px 3px red;
}

/* Pour les champs d'un formulaire : mode normal */
input[type=submit],  input[type=button]{
	background : black;
	background : -moz-linear-gradient(90deg, #0459B7, #08ADFF); /* Firefox : Dégradés de couleur */
	background : -webkit-gradient(linear, left top, left bottom, from(#08ADFF), to(#0459B7)); /* Chrome, Safari : Dégradés de couleur */
	border : 1px solid #093C75;
	color : #FFFFFF;
	cursor : pointer; /* Curseur de type pointer */
	font-family : Arial, Calibri, sans-serif;
	font-size : 12px;
	font-weight : bold;
	padding : 3px 10px 3px 10px;
	margin : 5px 0px 5px 0px;
	text-decoration : none; /* Enlève la décoration du texte */
	text-shadow : 0px 1px 1px #333333; /* Ajoute de l'ombre sur le texte : Décalage horizontal - puis vertical - Flou - Couleur */
	text-transform : uppercase; /* Pour mettre en majuscule le texte */
	
	-moz-border-radius : 3px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 3px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 3px;
	-moz-box-shadow : 0px 0px 2px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 2px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 2px #1c588a;
}

/* Pour les champs d'un formulaire : mode hover */
input[type=submit]:hover, input[type=button]:hover{
	background : #EEEEEE;
	background : -moz-linear-gradient(90deg, #067CD3, #0BCDFF); /* Firefox : Dégradés de couleur */
	background : -webkit-gradient(linear, left top, left bottom, from(#0BCDFF), to(#067CD3)); /* Chrome, Safari : Déradés de couleur */
	border-color : #093C75;
	text-decoration : none; /* Enlève la décoration du texte */
}

/* Pour les champs d'un formulaire : mode active, hover */
input[type=submit]:active,  input[type=button]:active{
	background : #CCCCCC;
	background : -moz-linear-gradient(90deg, #0bcdff, #067cd3); /* Firefox : Dégradés de couleur */
	background : -webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff)); /* Chrome, Safari : Dégradés de couleur */
	border-color : #093C75;
	outline : none; /* Enléve les effets du navigateur */
}

/* ---------------------------------------------------
Pour ouvrir une fenetre popup personnalisé en jquery
La partie CSS
----------------------------------------------------*/

#fade {
	display : none;
	background : #000000;
	position : fixed; 
	left : 0; 
	top : 0;
	width : 100%; 
	height : 100%;
	z-index : 9999;
	opacity : 0.80;
}

.popup_block{
	display : none;
	padding : 20px;
	border : 5px solid #1c588a; /* Ajoute un bord */
	float : left;
	position : fixed;
	top : 50%; 
	left : 50%;
	z-index : 99999;
	
	background-color : black;
	background-image : -moz-linear-gradient(100deg, #020e1b, #082338); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#082338), to(#020e1b)); /* Chrome, Safari : Dégradés de couleur */
	background-repeat : no-repeat;
	
	-webkit-box-shadow: 0px 0px 20px #1c588a;
	-moz-box-shadow: 0px 0px 20px #1c588a;
	box-shadow: 0px 0px 20px #1c588a;

	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

img.btn_close {
	float : right;
	margin : -45px -45px 0 0;
}

*html #fade {
	position : absolute;
}

*html .popup_block {
	position : absolute;
}

/* --------------------------------------------*/

/* Gestion des couleurs */
.rouge	{ color : red; }
.vert	{ color : green; }
.bordeau{ color : #830000; }
.orange	{ color : #F75200; }
.bleu	{ color : #0d639c; }
.cyan	{ color : cyan; }
.blanc	{ color : white; }
.noir	{ color : black; }
.gris	{ color : #6A6B6B; }
.violet	{ color : #640089; }
.jaune	{ color : gold; }

/* Pour les erreurs de PDO */
.erreurPDO{
	font-size : 0.8em;
	color : red;
}

/* Pour les erreurs de PHP */
.erreurPHP{
	font-size : 0.8em;
	color : orange;
}

/* Pour les barres de progression */
#corps div.progressionBarre{
	background : #0459B7;
	background : -moz-linear-gradient(90deg, #0459B7, #08ADFF); /* Firefox : Dégradés de couleur */
	background : -webkit-gradient(linear, left top, left bottom, from(#08ADFF), to(#0459B7)); /* Chrome, Safari : Dégradés de couleur */
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px;

	width : 1px;
	height : 20px;
}

#corps div.barre{
	width : 700px;
	height : 20px;
	border : 1px solid #1c588a; /* Ajoute un bord */
	
	background-color : black;
	background-image : -moz-linear-gradient(90deg, #000000, #03111e); /* Firefox : Dégradés de couleur */
	background-image : -webkit-gradient(linear, left top, left bottom, from(#03111e), to(#000000)); /* Chrome, Safari : Dégradés de couleur */
	
	-moz-border-radius : 10px; /* Contour arrondi pour Mozilla */
	-webkit-border-radius : 10px; /* Contour arrondi pour Chrome, Safari */
	border-radius : 10px;

	-moz-box-shadow : 0px 0px 4px #1c588a; /* Ajoute de l'ombre sur le contour pour Mozilla */
	-webkit-box-shadow : 0px 0px 4px #1c588a; /* Ajoute de l'ombre sur le contour pour Chrome, Safari */
	box-shadow : 0px 0px 4px #1c588a;
}
