/************* Fichiers JPEG *************
fond.jpg : Image du fond dégradé sur toute la page
top.jpg  : Image du top 900x150px

**************** Couleurs ****************
FOND_COLOR..........#C46622..........Couleur du fond à la suite du dégradé : marron clair
BARS_COLOR..........#ECDBC9..........Couleur des barres latérales : Couleur "peau"
LIGHT_COLOR.........#FFF0E0..........Couleur de la séparation light
JAUNE...............#FFFF66..........Jaune */

body
	{text-align:center; padding:0; margin:0;
	background-color:#C46622;                /* FOND_COLOR */
	background-image:url("img/fond.jpg");
	background-repeat:repeat-x;
	background-attachment:fixed;}

div.fond							/* Couleur "peau". Englobe aussi les barres latérales. */
	{width:900px; margin:0; margin-left: auto; margin-right: auto; background-color:#ECDBC9;}
	
		
/*****************************************************
*                                                    *
*        IMAGE TOP (900x150), TITRES INCRUSTES       *
*                                                    *
*****************************************************/
	
div.top
	{background-image:url("img/top.jpg");
	margin-top: 30px; margin-bottom: 0; margin-left: auto; margin-right: auto;
	font-style:italic; font-family:"arial"; font-weight:bold;
	height:150px; width:900px; color:#0000AA;}   /* HEADER-TITLE */
	
aside.top		/* Titre incrusté : "Part 1" */
	{position: absolute; margin-top:100px; margin-left:85px; font-family:"times new roman";
	font-style:italic; font-weight:bold; font-size:24pt; color:#FFFFAA;}
	
h2.top			/* Titre incrusté : "Spacetime Model" */
	{position: absolute; margin-top:30px; margin-left:500px;
	font-family:"times new roman";
	font-style:italic; font-weight:bold; font-size:30pt; color:#FFFFAA;}

h3.top			/* Titre incrusté : "A new Theory of Everything" */
	{position: absolute; margin-top:80px; margin-left:480px;
	font-family:"times new roman";
	font-style:italic; font-weight:bold; font-size:20pt; color:#FFFFAA;}



/******************************************
*                                         *
*              PAGE PRINCIPALE            *
*                                         *
******************************************/	

main
	{width:720px;margin-left:50px;padding:40px; 
	text-align:justify; background-color:white;}
	
aside.h1-no-seo		/* Titre principal de page en non-SEO */
	{margin-top:30px; margin-bottom:0; margin-left:40px; text-align:left;
	font-family:"times new roman"; font-style:italic; font-size:24pt; color:grey;}	

h1					/* Titre principal de page */
	{text-align:center; font-weight:bold; font-style:normal; font-size:28pt;
	font-family:"arial"; margin-top:20px; margin-bottom:50px; color:#0000BB;}	


/*****************************************
*                                        *
*           BALISES ELEMENTAIRES         *
*                                        *
*****************************************/	


section
	{font-family:"arial"; font-weight:normal; font-size:12pt;color:#0000AA;}

p
	{margin:0; margin-bottom:7px; text-align:justify; text-indent: 2em; font-family:"arial";
	font-size:12pt; color:#0000AA; font-weight:normal;hyphens: auto; overflow-wrap: break-word;}	

aside.h2-no-seo		/* Remplace <h2> en non-SEO */
	{margin-top:30px; margin-bottom:10px; margin-left:0; margin-right:auto;
	font-family:"arial"; font-weight:bold; font-size:20pt; color:#0000FF;}

h2
	{margin-top:30px; margin-bottom:5px; margin-left:0; margin-right:auto;
	font-family:"arial"; font-weight:bold; font-size:18pt; color:#0000FF;}	

h3
	{margin:0; margin-top:20px; font-family:"arial"; font-weight:bold; font-size:14pt; color:#0000FF;}

h4
	{margin:0; margin-top:20px; margin-bottom:5px; font-family:"arial"; font-weight:bold; font-size:14pt; color:#0000FF;}

h5
	{margin:0; margin-top:16px; margin-bottom:5px; font-family:"arial"; font-weight:bold; font-size:12pt; color:#0000CC;}
	
strong
	{font-family:"arial"; font-weight:bold;}
	
ul
	{margin-top:0; margin-bottom:10px;}

ol
	{margin-top:0; margin-bottom:10px;}
			
li
	{margin:0; margin-left:30px; margin-bottom:3px;}
	
li.last-item
	{margin:0; margin-left:30px; margin-bottom:20px;}

figure
	{margin:0; margin-top:15px; margin-bottom:20px; text-align:center;}

img
	{margin:2px; margin-left:25px;}

hr
	{height:1px; background-color: #0000AA; border: none;}

footer
	{margin-top:30px;}
	
	
/*****************************************
*                                        *
*             BALISES COMPOSEES          *
*                                        *
*****************************************/
	
div.end	                                     
	{width:900px; height:30px; margin: auto; background-color:#ECDBC9;} /* NAV COLOR */

p.note
	{margin:10pt; text-align:justify; text-indent: 2em; color:brown;
	font-style:italic; font-size:12pt;}

p.comment
	{margin:5pt; margin-left:70pt; margin-right:70pt; text-align:justify; text-indent: 2em; font-style:italic; font-size:12pt; color:brown;}

p.promo
	{margin:0; margin-left:70pt; margin-right:70pt; margin-bottom:5pt;
	text-indent:0; font-size:12pt; color:brown}

p.copyright
	{margin:0; text-align:left; color:brown; font-style:italic; font-size:12pt;}

p.footer
	{font-size:11pt;}
	
p.math
	{text-align:center; font-style:italic; font-size:12pt;}

div.bottom			/* Séparateur rose de fin de page */
	{height:50px; margin-top: 0; margin-bottom: 50px; margin-left: auto; margin-right: auto; }


/*****************************************
*                                        *
*         ENCARTS (top et bottom)        *
*                                        *
*****************************************/

div.encart
{margin-top:30px; margin-bottom:0; margin-right:auto; margin-left:auto; padding:20px;
width:600px; text-align:justify; background-color:#DDDDDD;
border: 1px solid black; box-shadow: 5px 5px 15px 0px #444444;}

aside.encart-title		/* Pour les titres non SEO */
	{margin-top:10px; margin-bottom:20px; font-family:"arial"; text-align:center;
	font-weight:bold; font-size:18pt; color:blue;}
		
h2.encart
	{margin-top:10px; margin-bottom:20px; font-family:"arial"; text-align:center;
	font-weight:bold; font-size:18pt; color:blue;}
	
p.encart
	{font-family:"arial"; font-size:12pt; color:dark-blue;}

/****************************************
*                                       *
*                  BOX                  *
*                                       *
****************************************/

div.box-small
{margin-top:20px; margin-bottom:30px; margin-right:auto; margin-left:auto;
width:300px; padding:20px; padding-bottom:15px; 
border: 1px solid black; background-color:#FFFFBB;
box-shadow: 5px 5px 15px 0px #444444;}

div.box-medium
{margin-top:20px; margin-bottom:20px; margin-right:auto; margin-left:auto;
width:400px; padding:20px; padding-bottom:15px; 
border: 1px solid black; background-color:#FFFFBB;
box-shadow: 5px 5px 15px 0px #444444;}

div.box-large
{margin-top:20px; margin-bottom:20px; margin-right:auto; margin-left:auto;
width:500px; padding:20px; padding-bottom:15px;
padding-left:30px; border: 1px solid black; background-color:#FFFFBB;
box-shadow: 5px 5px 15px 0px #444444;}

p.box
{font-size:15pt; font-weight:bold; margin-bottom:5px; text-indent:0;}

p.box-center
{text-align:center; font-size:15pt; font-weight:bold; margin-bottom:5px; text-indent:0;}

p.box-light
{text-indent: 2em; font-size:13pt; font-weight:normal; margin-bottom:5px;}

ul.box
{text-align:left; font-size:14pt; font-weight:bold; margin: 0; padding-left: 0;}

li.box
{text-align:left; font-size:15pt; font-weight:bold;}



/****************************************
*                                       *
*                BOUTONS                *
*                                       *
****************************************/

div.bt1
	{text-align:center; margin-top:40px;background}

div.bt2
	{text-align:center; margin-top:2px; padding:0px;}

/******** PINK ********/
a.pink
	{width: 160px; height: 40px; cursor: pointer; background-image: url('bt/pink.gif');
	display: inline-block; text-decoration: none; text-align: center; margin-top:3px;
	font-size:18px; font-weight: bold; line-height: 45px; color:darkblue;}
	a.pink:hover {background-image: url('bt/pink-over.gif'); color: #4444FF;}
	a.pink:active {background-image: url('bt/pink-down.gif'); line-height: 48px; color: black;}

/******** GREEN ********/
a.green
	{width: 160px; height: 40px; cursor: pointer; background-image: url('bt/green.gif');
	display: inline-block; text-decoration: none; text-align: center; margin-top:3px;
	font-size:18px; font-weight: bold; line-height: 45px; color:darkblue;}
	a.green:hover {background-image: url('bt/green-over.gif'); color: #4444FF;}
	a.green:active {background-image: url('bt/greendown.gif'); line-height: 48px; color: black;}


/******** BLUE ********
a.blue
{width: 160px; height: 40px; cursor: pointer; background-image: url('bt/blue.gif');
display: inline-block; text-decoration: none; text-align: center; margin-top:3px;
font-size:18px; font-weight: bold; line-height: 45px; color:darkblue;}
a.blue:hover {background-image: url('bt/blue-over.gif'); color: #4444FF;}
a.blue:active {background-image: url('bt/blue-down.gif'); line-height: 48px; color: black;}

/******** GREY ********
a.grey
{width: 160px; height: 40px; cursor: pointer; background-image: url('bt/grey.gif');
display: inline-block; text-decoration: none; text-align: center; margin-top:3px;
font-size:18px; font-weight: bold; line-height: 45px; color:darkblue;}
a.grey:hover {background-image: url('bt/grey-over.gif'); color: #4444FF;}
a.grey:active {background-image: url('bt/grey-down.gif'); line-height: 48px; color: black;}

display: flex; flex-direction: row;*/