﻿/* CSS layout */
body {
	color: #1F1F1F;
	text-align: center;
	background-color: #E1F0F0;
	margin: 0;
	padding: 0;
	font-size: 1.1em;
	font-family: helvetica, arial, verdana, sans-serif;
}
#contenant {
	border: 1px solid #DEE2E3;
	margin: 0;
	width: 100%;
	max-width: 1000px;
	min-width: 300px;
	text-align: left;
}
h1 {
	border: 1px solid #B5BDBF;
	font-size: xx-large;
	text-align: left;
	background-color: #7CBEBE;
	padding: 20px;
	margin: 0px -6px 16px -14px;
}
h2 {
	margin: -8px 140px 16px -14px;
	padding: 6px;
	background-color: #7CBEBE;
	color: #000000;
	font-weight: bold;
	font-size: large;
}
h1 img {
	max-width: 200px;
	padding: 18px 0px 0px 12px;
	margin: 10px 0px 0px 20px;
}
.finpage {
	background-color: #7CBEBE;
	padding: 20px;
	margin: 0px -6px 0px -14px;
}
.finpage img {
	max-width: 200px;
}
/* Styles pour le contenu modifiable */
#droite {
	margin: 5px 5px 5px 225px;
	padding: 10px;
	width: auto;
	overflow: visible;
	float: left;
	width: 100%;
	min-width: 300px;
	max-width: 760px;
	padding: 0 8px;
}
p {
	padding-left: 8px;
}
#droite img {
	margin: 3px 0px 0px 0px;
	background-color: #FFFFFF;
	border: 1px solid #C0C0C0;
	padding: 3px;
}
#droite a {
	text-decoration: underline;
	color: #000055;
	font-weight: bold;
	text-align: center;
}
#droite a:hover {
	background-color: #01266B;
	color: #FFF;
	text-decoration: none;
}
.gris {
	background-color: #F7F8F9;
	border: 1px solid #B5BDBF;
	padding: 0 6px 0 14px;
	margin: 0 10px;
}
.petit {
	font-size: 0.9em;
}
/* Écrans de taille non maximale */
@media screen and (max-width: 1000px)
{
#droite {
	float: none;
	width: auto;
	margin: 5px 5px 5px 75px;
}
#droite img {
	float: none;
	width: 100%;
}
h1 {
	font-size: x-large;
}
}
/* Moyens écrans */
@media screen and (max-width: 900px)
{
#droite {
	margin: 5px 5px 5px 15px;
}
}
/* Écrans petits-moyens */
@media screen and (max-width: 560px)
{
h1 {
	font-size: large;
}
#droite {
	float: none;
	width: auto;
	margin: 5px 5px 5px 10px;
}
#droite img {
	float: none;
	width: 100%;
}
}
/* Petits écrans */
@media screen and (max-width: 400px)
{
#droite {
	margin: 5px 5px 5px 0px;
	padding: 0;
}
#droite img {
	float: none;
	width: 100%;
}
.gris {
	padding: 0;
	margin: 0;
}
}
