/* Concerne toutes les pages */

body	/* Tout ce qu'il y a dans le code html, c'est a dire tout le contenu de notre site */
{
	color : #000000 ;	/* Couleur du texte du site */
	background : #f7f3e5 ;	/* Couleur de fond du site */
	font-size : 12px ;	/* Taille de la police */
	font-family : Verdana, Arial, "Lucida Grande", "Lucida Sans Unicode", "Bitstream Vera Sans", Futura, Helvetica, serif, sans-serif ;	/* Type de police. La premiere est prioritaire et ainsi de suite */
}

h2	/* Texte present dans les barres de couleur */
{
	font-size : 15px ;	/* Taille du texte pour le rendre un peu plus petit */
	color : #0A328C ;	/* Couleur du texte pour remplacer celle par defaut (noire) */
	background : #aecbf0 ;	/* Couleur d'arriere plan pour les barres bleues */
	margin : 0% 5% ;	/* Marge haut bas et gauche droite */
	padding : 4px 8px ;	/* Grossit les barres en couleur */
}

img	/* Images */
{
	border : none ;	/* Enleve la bordure bleue autour des images qui comportent un lien */
}

em	/* Mots ou phrases assez importantes */
{
	text-decoration : underline ;	/* Souligne le texte */
}





/* Concerne la partie du haut de toutes les pages (header.html) */

h1	/* Block h1 qui constitue le titre */
{
	font-size : 20px ;	/* Reduit la taille du texte */
	color : #0A328C ;	/* Couleur bleue foncee */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
	text-align : center ;	/* Centre le texte */
	margin : 30px ;	/* Marge autour du texte */
}

#logosdct	/* Logo SDC vert */
{
	margin-left : 15% ;	/* Marge entre le logo SDC rouge et la gauche de la page */
}

#logosdc	/* Logo SDC rouge */
{
	margin-top : -77px ;	/* Pour avoir l'image SDC rouge au meme niveau que l'image du SDC verte */
	margin-right : 15% ;	/* Marge entre le logo SDC rouge et la droite de la page */
	float : right ;	/* Permet de mettre l'image a droite */
	width : auto ;	/* Pour enlever l'avertissement du validateur CSS pour cause de presence d'un float juste au-dessus */
}

/* Concerne le menu */

ul#menu-horizontal
{
	margin : 60px 5% 10px ;	/* Marge haut, gauche droite et bas */
	padding : 3px 0 25px ;	/* Espace entre les images et lien, et la bordure haut, gauche droite et bas */
	border : 1px dotted black ;	/* Type de bordure */
	list-style-type : none ;	/* Retirer les puces (petits ronds) */
}


ul#menu-horizontal li.bouton-gauche	/* Concerne les liens de gauche */
{
	float : left ;	/* Permet au liens d'etre l'un a cote de l'autre au lieu de l'un sur l'autre */
	border-right : 1px solid black ;	/* Type de bordure */
}

ul#menu-horizontal li.bouton-droite	/* Concerne les liens de droite */
{
	float : right ;	/* Permet aux liens devant se trouver a droite d'etre a droit lieu d'etre a gauche */
	border-left : 1px solid black ;	/* Type de bordure */
}

ul#menu-horizontal a	/* Concerne les liens du menu */
{
	color : black ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
	text-decoration : none ;	/* Retire le soulignage du texte */
	padding : 0px 5px ;	/* Espace liens haut bas et gauche droite */
}

ul#menu-horizontal a:hover	/* Lorsqu'on pointe la souris sur un lien */
{
	text-decoration : none ;	/* Retire le soulignage du texte */
}

ul#menu-horizontal a img	/* Lien dans les images */
{
	border : none ;	/* Retire la bordure */
	padding : 0px 2px ;	/* Espace entre images et liens haut bas et gauche droite */
}





/* Concerne la partie basse de toutes les pages (footer.html) */

#footer	/* Le texte en bas de page */
{
	margin : 40px 0px ;	/* Marge haut bas et gauche droite */
	color : gray ;	/* Met le texte en bas de page en gris */
	background : #f7f3e5 ; /* Meme couleur de fond que le site */
}

#logos	/* Logos xiti, xhtml et css */
{
	text-align : center ;	/* Place les logos */
}

#phpmyvisites
{
	display : none ;
}





/* Concerne uniquement la premiere page (index.php) */

#p-presentation	/* Phrase en premiere page situee avant la liste des jeux */
{
	margin : 10px 5% ;	/* Marge haut bas et gauche droite */
}

ul#listejeu	/* Liste des jeux videos en premiere page */
{
	width : 60% ;	/* Pour que le menu s'affiche correctement suivant la resolution employee */
	margin : 25px 10% 40px;	/* Marge haut, gauche droite et bas */
	list-style-image : url("/images/ul.png") ;	/* Remplace les puces par defaut (petits ronds) par une image */
}

#listejeu a:link	/* Liens le la liste des jeux en premiere page du site */
{
	color : #0A328C ;	/* Couleur des liens de la liste */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

#listejeu a:visited	/* Pour les liens qui ont deja ete visites */
{
	color : #0A328C ;
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}





/* Concerne uniquement la page plan.php */

ul.listeplan	/* Liens du contenu a l'interieur des cadres */
{
	margin : 10px 5% ;	/* Marge haut bas et gauche droite */
	list-style-image : url("/images/ul.png") ;	/* Remplace les puces par defaut (petits ronds) par une image */
}

.titre	/* Titres de chaque catégorie */
{
	margin : 30px 5% 5px ;	/* Marge haut, gauche droite et bas */
	font-weight : bold ;	/* Met le texte en gras */
}

.titre a:visited	/* Pour les liens qui ont deja ete visites */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.titre a:link	/* Liens du contenu a l'interieur des cadres */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

ul.listeplan li	/* Titres de chaque catégorie */
{
	margin-left : 15px ;	/* Décale la liste vers la droite */
}

.listeplan a:link	/* Liens du contenu a l'interieur des cadres */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.listeplan a:visited	/* Pour les liens qui ont deja ete visites */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}





/* Concerne les pages d'Alerte Rouge 2 */

.titrear2
{
	padding-left : 40px ;	/* Decale le texte vers la droite */
	margin-bottom : -10px ;	/* Descend le texte */
	font-weight : bold ;	/* Met le texte en gras */
}





/* Concerne toutes les autres pages */

.block	/* Cadres */
{
	margin : 10px 5% ;	/* Marge haut bas et gauche droite */
	padding : 10px ;	/* Augmente l'espace entre le cadre et le contenu du cadre afin que le texte ne soit pas colle au cadre */
	border : solid 2px #1582eb ;	/* Type de bordure du cadre */
}

h3	/* Texte qui sert de titre pour chaque block */
{
	font-size : 13px ;	/* Reduit la taille du texte */
	font-weight : bold ;	/* Texte en gras */
	margin : 15px 5% 2px;	/* Marge haut, gauche droite et bas */

}

.texte-description-block	/* Texte d'explication en gras dans les cadres */
{
	font-weight : bold ;	/* Met le texte en gras */
	margin-top : 0px ;	/* Annule le saut a la ligne de la balise p */
}

ul.liste	/* Liens du contenu a l'interieur des cadres */
{
	margin : 30px 5% ;	/* Marge haut bas et gauche droite */
	list-style-image : url("/images/ul.png") ;	/* Remplace les puces par defaut (petits ronds) par une image */
}

.liste a:link	/* Liens du contenu a l'interieur des cadres */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.liste a:visited	/* Pour les liens qui ont deja ete visites */
{
	color : #0A328C ;	/* Couleur des liens */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.liste a.texte-gris	/* Pour les liens externes */
{
	color : gray ;	/* Liens en gris */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.liste a.lien-externe	/* Pour les liens externes */
{
	color : gray ;	/* Liens en gris */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
}

.p-description	/* Description se situant en-dessous d'un lien */
{
	margin : 2px 20px 10px ;
	font-style : italic ;	/* Met le texte en italique */
}

.p-instruction	/* Texte parfois present en bas d'un block */
{
	font-size : 13px ;	/* Reduit la taille du texte */
	font-weight : bold ;	/* Texte en gras */
	color : #0A328C ;	/* Couleur du texte */
	background : #f7f3e5 ;	/* Meme couleur de fond que le site */
	margin-bottom : 10px ;	/* Espace le texte du bas du cadre */
}

.message-avertissement
{
	font-size : 14px ;
	text-align : center ;
	color : red ;
	background : #f7f3e5 ;
	margin-top : 25px ;
}





/* Concerne les liens */

a	/* Concerne tous les liens */
{
	outline : none ;	/* Permet sur Mozilla Firefox de ne pas avoir de pointilles lorsqu'on clique sur un lien ou une image comportant un lien */
}

a:link	/* Pour les liens des pages qui n'ont pas encore ete visitees */
{
	color : #990000 ;
	background : none ;	/* Ne modifie pas la couleur de fond */
}

a:visited	/* Pour les liens qui ont deja ete visites */
{
	color : #990000 ;
	background : none ;	/* Ne modifie pas la couleur de fond */
}
/* Qu'on ait visite le lien ou pas, la couleur reste inchangee */

a:hover 	/* Lorsqu'on pointe la souris sur les liens */
{
	color : #0A328C ;	/* Evite de changer la couleur du lien lorsqu'on pointe dessus avec sa souris */
	background : none ;	/* Ne modifie pas la couleur de fond */
}

a:active	/* Lorsqu'on clique sur un lien */
{
	text-decoration : none ;	/* Retire le soulignage */
}





/* Concerne le menu d'onglets */

ul#tabnav	/* Proprietes autour des onglets */
{
	font : bold 11px verdana, arial, sans-serif ;	/* Type de police du texte dans les onglets */
	list-style-type : none ;	/* Retire les puces (petits carres) */
	padding-bottom : 24px ;	/* Pour que la ligne se situe en-dessous des onglets et non au-dessus */
	border-bottom : 1px solid #aecbf0 ;	/* Type de bordure pour la ligne situee en-dessous des onglets */
	margin-left : 5% ;	/* Decalage du menu vers la droite afin qu'il ne soit pas colle a gauche de la page */
	margin-right : 5% ;	/* Decalage du menu vers la gauche afin qu'il ne soit pas colle a gauche de la page */
}

ul#tabnav li	/* Proprietes des onglets */
{
	float : left ;	/* Place le menu a gauche de la page. Sans lui le menu serait en colonne */
	width : auto ;	/* Pour enlever l'avertissement du validateur CSS pour cause de presence d'un float juste au-dessus */
	color : #666 ;	/* Couleur des liens des onglets */
	background : #f3cb8c ;	/* Couleur des onglets du menu */
	height : 21px ;	/* Suivant les polices d'ecriture, les onglets n'etaient plus bien places par rapport a la ligne */
	margin : 2px 2px 0px 2px ;	/* Ajuste le placement des onglets (haut, droite, bas, gauche) */
	border : 1px solid #aecbf0 ;	/* Bordure autour des onglets */
}

ul#tabnav li.active	/* Lorqu'un onglet est selectionne */
{
	border-bottom : 1px solid #f7f3e5 ;	/* Efface la bordure du bas d'un onglet lorsqu'il est selectionne */
	color : #666 ;	/* Couleur des liens des onglets */
	background : #f7f3e5 ;	/* Colorise l'onglet utilise */
}

#tabnav li:hover	/* Lorsqu'on pointe sur un onglet du menu (ne prend pas en compte l'onglet deja active pour que ce dernier ne se colorise pas lorsqu'on pointe dessus) */
{
	color : #666 ;	/* Couleur des liens des onglets */
	background : #aecbf0 ;	/* Couleur de l'onglet lorsqu'on pointe le curseur de la souris dessus */
}

#tabnav a	/* Proprietes des liens des onglets du menu */
{
	display : block ;	/* Pour rendre l'element de type bloc */
	color : #666 ;	/* Couleur des liens */
	background : none ;	/* Ne modifie pas la couleur des onglets */
	text-decoration : none ;	/* A pour but d'effacer le soulignage des liens */
	padding: 4px ;	/* Agrandit la taille des onglets */
}