﻿@font-face
{
	font-family:'Ecliptiques14';
	src: 	url('Polices/Ecliptiques1.4.otf');
}
@font-face
{
	font-family:'LucidaFile';
	src: 	url('Polices/LCALLIG.TTF');
}

html
{
	height:100%;
	background-color:#E0E0E0;
	/*background-image:linear-gradient(to bottom right, white, #969696);*/
	
	/*************************************/
	/* *** Style par défaut du texte *** */
	/*************************************/
	font-family:"Open Sans",Helvetica,Arial,sans-serif;
	font-size:larger;
	font-weight:normal;
	color:black;
	letter-spacing:0.01rem;
	line-height:1.5rem;
	-webkit-font-smoothing: antialiased;
}
body
{
	position:relative;
	height:100%;
	margin:0px;
	padding:0px;
}
#content
{
	position:relative;
	min-height:100%;
	margin:0px;				/* Mettre à 40px pour une bordure de page */
	background-color:#FFFFFF;
	box-shadow: 0px 0px 15px 0px #808080;
}
#header
{
	position:relative;
	background-color:#f7f2fb;
}
#main
{
	position:relative;
	padding-top:20px;
	padding-bottom:35px;
	padding-left:75px;
	padding-right:75px;
}
#footer
{
	position:absolute; 
	
	padding:8px;
	left:0px;	right:0px;	bottom:0px;		/* Positionnement en bas */
	clear:both;
	color:#400f64;
	font-size:small;
	font-weight:bold;
	text-align:left;
	/*height:25px;*/
	background:#965aaf;
	/*box-shadow: 0px 0px 20px 0px #808080;*/
}
#footer a
{
	color:#400f64;
}
#footer a:hover
{
	color:#FFFFFF;
}
img
{
	max-width:50%;
}


/*************************************************************/
/***** BARRE DE TITRE DU SITE ********************************/
/*************************************************************/
h1
{
	font-family:Ecliptiques14, Book antiqua, Harrington, Arial;
	text-shadow: 3px 3px 1px #CCCCCC;		/* décalage_horizontal décalage_vertical flou couleur */
	color:#7030A0;
	font-size:3em;
	padding:0px;
	margin:0px;
	margin-bottom:10px;	/* Espace avec le slogan */
	font-weight:normal;
}
h2.T1
{
	color:#00B050;
}
h2.T2
{
	color:#EE0000;
}
h2.T3
{
	color:#1711FF;
}

.eFont
{
	font-family:Ecliptiques14, Book antiqua, Harrington, Arial;
}
.slogan
{
	color:black;
	font-style:normal;
}
td.title_middle
{
	padding:10px;	/* Espace minimal avec le haut de la page et le menu */
	width:100%;
	text-align:center;
}
td.title_img img
{
	padding:0px;	/* Pas d'espace avec la page */
	height:180px;
	width:240px;
	min-width:240px;
	
	height:135px;
	width:180px;
	min-width:180px;
}
/*************************************************************/



/*************************************************************/
/***** BARRE DE MENU *****************************************/
/*************************************************************/
#menu
{
	-webkit-font-smoothing: antialiased;
	text-align:center;
	background:#965aaf;			/* Couleur de fond du menu */
	padding:0px;
	width:100%;
	/*box-shadow: 0px 0px 20px 0px #808080;*/
}
/*************************************************************/



/*************************************************************/
/***** CASE DU MENU NIVEAU 1 *********************************/
/*************************************************************/
#menu ul.niveau1
{
	margin-top: 0px;
	margin-bottom:0px;
	padding-left: 0px;
	padding-inline-start: 0px;
}
/* Format du texte */
#menu li, #menu li a
{
	text-decoration:none;
	color:white;
	font-weight:normal;
	text-align:left;
	list-style-type: none;
	cursor:pointer;
}
/* Format du fond */
#menu li
{
	position: relative;
	padding-top:10px;		/* Espacement haut de chaque case */
	padding-bottom:10px;	/* Espacement bas de chaque case */
	padding-left:15px;		/* Espacement gauche de chaque case */
	padding-right:15px;		/* Espacement droite de chaque case */
	margin: 0px;
	display:inline-block;
}
/*************************************************************/



/*************************************************************/
/***** CASE DU MENU NIVEAU 2 *********************************/
/*************************************************************/
/* Format du texte */
#menu li li, #menu li li a		
{
	text-decoration:none;
	color:white;
	font-weight:normal;
	text-align:left;
	list-style-type: none;
}
/* Format du fond */
#menu li li					
{
	background-color: #965aaf;		/* Couleur de fond du sous-menu */
	min-width:125px;	
	z-index:999;
	display:block;
}
/* Emplacement du sous-menu */
#menu ul.niveau2
{
	display: none;			/* Masquage des sous-menu */
	position: absolute;
	margin:0px;			
	padding:0px;
	top:44px;				/* Hauteur du sous-menu, par rapport au début du menu */
	left:0px;				/* Décalage horizontal du sous-menu */
}
/* Affichage du sous-menu au survol du menu */
#menu li:hover ul.niveau2, li.sfhover ul.niveau2
{
	display: block;
}
/*************************************************************/



/*************************************************************/
/***** CASE DU MENU AU SURVOL ********************************/
/*************************************************************/
#menu li:hover, li.sfhover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #FFFFFF, #505050);
}
#menu li.red:hover, #menu li.red * li:hover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #FF0000, #505050);
}
#menu li.green:hover, #menu li.green * li:hover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #00FF00, #505050);
}
#menu li.blue:hover, #menu li.blue * li:hover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #0000FF, #505050);
}
#menu li.violet:hover, #menu li.violet * li:hover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #7030A0, #505050);
}
#menu .violet:hover
{
	background-color: #868686;
	background-image:linear-gradient(to bottom right, #7030A0, #505050);
}
/********************************************************/



/*************************************************************/
/***** TITRE DE PARAGRAPHE ***********************************/
/*************************************************************/
h2
{
	font-size:1.5em;
	text-align:center;
	color:7030A0;
	padding:0px;
	margin-top:20px;
	margin-bottom:20px;
	margin-left:0px;
	margin-right:0px;
}

h2:before,h2:after
{
	content:" ◈ "; 
	/* 
	https://www.jchr.be/html/caracteres.htm
	https://www.alt-codes.net/smiley_alt_codes.php
	*/
}
/*************************************************************/



/*************************************************************/
/***** SOUS-TITRE DE PARAGRAPHE ******************************/
/*************************************************************/
h3
{
	padding-top:10px;
	font-weight:bold;
}
/*************************************************************/



/*************************************************************/
/***** PARAGRAPHES *******************************************/
/*************************************************************/
p
{
	text-align: justify;
	text-justify: inter-word;
}
/*************************************************************/



/*************************************************************/
/***** FORMAT DES IMAGES *************************************/
/*************************************************************/
img.gauche
{
	float:left;
	margin-right:15px;
	
	border-width:1px;			/* bordure - épaisseur */
	border-style:solid;			/* bordure - style */
	border-color:#A0A0A0;		/* bordure - couleur */
	/* Voir tous les styles de bordure sur : https://www.w3schools.com/css/css_border.asp */
}
img.droite
{
	float:right;
	margin-left:15px;
	
	border-width:1px;			/* bordure - épaisseur */
	border-style:solid;			/* bordure - style */
	border-color:#A0A0A0;		/* bordure - couleur */
	/* Voir tous les styles de bordure sur : https://www.w3schools.com/css/css_border.asp */
}
/*************************************************************/



/*************************************************************/
/***** ACTUALITES ********************************************/
/*************************************************************/
.pager
{
	text-align:center;
	margin-bottom:0px;
}
.pager_num
{
	padding:5px;
	border-style:solid;
	border-color:#F5F5F5;
	border-width:1px;
	border-radius:5px;
	background-color:#F5F5F5;
	box-shadow: 0px 0px 5px 0px #808080;
	display:inline;
}
.pager_current
{
	background-color:#808080;
}
.pager_link:link,.pager_link:active,.pager_link:visited,.pager_link:hover
{
	text-decoration:none;
	color:black;
}
div.actu
{
	border-width:0px;			/* bordure - épaisseur */
	border-style:solid;			/* bordure - style */
	border-color:#A0A0A0;		/* bordure - couleur */
	/* Voir tous les styles de bordure sur : https://www.w3schools.com/css/css_border.asp */
	box-shadow: 0px 0px 5px 0px #808080;
	background:#F5F5F5;			/* fond */
	padding:15px;				/* marge intérieure */
	margin-bottom:30px;			/* espace entre les actualités */
}
span.actu_title					/* format du titre */
{
	font-weight:bold;
	font-size:x-large;
	color:black;
}
span.actu_title:before
{
	/*content:"♊ "; */
}
span.actu_date
{
	font-weight:normal;			/* format de la date */
	font-size:small;
	color:#A0A0A0;
}
td.actu_content
{
	/* Marge du contenu avec le bord */
	padding-top:20px;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:20px;
}
/*************************************************************/



/*************************************************************/
/***** COMMENTAIRES ******************************************/
/*************************************************************/
div.comment
{
	border-width:0px;			/* bordure - épaisseur */
	border-style:solid;			/* bordure - style */
	border-color:#A0A0A0;		/* bordure - couleur */
	/* Voir tous les styles de bordure sur : https://www.w3schools.com/css/css_border.asp */
	box-shadow: 0px 0px 5px 0px #808080;
	background:#F5F5F5;			/* fond */
	padding:15px;				/* marge intérieure */
	margin-bottom:30px;			/* espace entre les actualités */
}
span.comment_title					/* format du titre */
{
	font-weight:bold;
	font-size:x-large;
	color:black;
}
span.comment_title:before
{
 
}
span.comment_date
{
	font-weight:normal;			/* format de la date */
	font-size:small;
	color:#A0A0A0;
}
td.comment_content
{
	padding:20px;	/* Marge du contenu avec le bord */
}
/*************************************************************/



/*************************************************************/
/***** COMMENTAIRES ******************************************/
/*************************************************************/
div.article
{
	border-width:0px;			/* bordure - épaisseur */
	border-style:solid;			/* bordure - style */
	border-color:#A0A0A0;		/* bordure - couleur */
	/* Voir tous les styles de bordure sur : https://www.w3schools.com/css/css_border.asp */
	box-shadow: 0px 0px 5px 0px #808080;
	background:#F5F5F5;			/* fond */
	padding:15px;				/* marge intérieure */
	margin-bottom:30px;			/* espace entre les actualités */
}
span.article_title					/* format du titre */
{
	font-weight:bold;
	font-size:x-large;
	color:black;
}
span.article_title:before
{
 
}
span.article_date
{
	font-weight:normal;			/* format de la date */
	font-size:small;
	color:#A0A0A0;
}
td.article_content
{
	padding:20px;	/* Marge du contenu avec le bord */
	text-align:justify;
}
span.article_menu_date
{
	font-size:small;
	font-style:italic;
	color:#888888;
}
span.article_menu_date:after
{
	/*content:")";*/
}
span.article_menu_date:before
{
	/*content:"(";*/
}
a.article_menu_link
{
	font-weight:bold;
	text-decoration:none;
}
a.article_menu_link:hover
{
	text-decoration:underline;
}
a.blog_menu_link
{
	font-weight:normal;
	text-decoration:none;
}
/*************************************************************/



/***********************************************************/
/*** SOUS-MENU *********************************************/
/***********************************************************/
a.menu_blog
{
	color:black;
	display:inline-block;
	width:210px;
	text-decoration:none;
	
	padding:5px;
}
a.menu_blog:hover
{
	background-color:#FFFFFF;
}
a.menu_blog_selected
{
	background-color:#EACCFF;
}
td.menu_gauche
{
	font-size:larger;
	display:table-cell;
	min-width:220px;
	max-width:220px;
	width:220px;
	background-color:#F5F5F5;
	padding:25px;
	vertical-align:top;
	white-space: nowrap;
	line-height:1em;
}
td.menu_bas
{
	font-size:larger;
	display:none;
	padding:15px;
	width:100%;
	background-color:#F5F5F5;
	vertical-align:top;
	white-space: nowrap;
	line-height:1em;
}
td.menu_content
{
	font-size:larger;
	padding-top:30px;
	padding-left:30px;
	padding-right:30px;
	padding-bottom:30px;
	vertical-align:top;
	text-align:justify;
}
a.menu_shortcut
{
	font-size:larger;
	background-color:#505050;
	color:white;
	border:1px solid white;
	text-decoration:none;
	padding:5px;
	display:none;
}
a.menu_shortcut:hover
{
	background-color:white;
	color:#505050;
	border:1px solid #505050;
}
@media (max-width: 715px)
{
	td.menu_gauche
	{
		display:none;
	}
	td.menu_bas
	{
		display:table-cell;
	}
	td.menu_content
	{
		padding-top:25px;
		padding-left:15px;
		padding-right:15px;
		padding-bottom:25px;
		vertical-align:top;
	}
	a.menu_shortcut
	{
		display:inline-block;
	}
}

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



/***********************************************************/
/*** Adaptation en fonction de l'écran *********************/
/***********************************************************/
@media (min-width: 1000px)
{	
	
}
@media (max-width: 1000px)
{
	#main
	{
		padding-top:15px;
		padding-bottom:35px;
		padding-left:35px;
		padding-right:35px;
	}
	h1, h1.E00, h1.E01, h1.E02, h1.E11, h1.E12, h1.E13, h1.E14
	{
		font-size:2.0em;	/* Taille du titre */
		margin-bottom:5px;	/* Espace avec le slogan */
	}
	td.title_img img
	{
		height:90px;
		width:120px;
		min-width:120px;
	}
}
@media (max-width: 715px)
{
	html, h3
	{
		font-size:medium;
	}
	#main
	{
		position:relative;
		padding-top:5px;
		padding-bottom:35px;
		padding-left:15px;
		padding-right:15px;
	}
	#footer
	{
		font-size:x-small;
		/*white-space:nowrap;*/
	}
	#menu li li					
	{
		background-color: #808080;		
		/* Couleur de fond du sous-menu, on change pour différencier avec le menu principal (puisqu'il y a cheveauchement) */
	}
	td.title_img img
	{
		/* Masquage des images */
		height:0px;
		width:0px;
		min-width:0px;
		visibility:hidden;
	}
	td.actu_content
	{
		padding-top:10px;
		padding-left:0px;
		padding-right:0px;
		padding-bottom:0px;
	}
}
/****************************************************/
