/* Fontes */


/* Couleurs */
/* Bleu principal   : #008CD7 */
/* Bleu lumineux  : #008CD7 */
/* Bleu clair  : #00659B */
/* Bleu foncé : #003F61 */
/* Bleu profond : #002B42 */


/* Général */

body {
   	font-family: 'helvetica', sans-serif;
	color: black;
    font-size: 1.1em;
	line-height: 1.35em;
    text-align: center;
    margin: 0;
    padding: 0;
	background-color: #003F61;
}

.main {
    width: 80%;
    max-width: 900px;
    margin: 10px auto 0;
    padding: 10px 0;
	background-color: white;
}
.main p {
    margin: 10px 30px;
    text-align: left;
}
.main ul {
    text-align: left;
    margin: 10px;
    margin-left: 20px;
}
.main li {
	margin-top: 0.2em;
}

h1 {
	text-align: left;
	margin: 30px 30px;
	color: #008CD7;
	font-size: 3em;
	line-height: 1.1em;
	font-weight: 800;
}

h2 {
	text-align: left;
	margin: 30px 30px 15px;
	color: #008CD7;
	font-size: 1.6em;
	line-height: 1.3em;
	font-weight: 800;
}

b, strong { font-weight:800; color:#003F61; }

a, a:visited { color:#002B42; text-decoration:none; border-bottom:2px solid #002B42; }
a:hover { color:#008CD7; text-decoration:none; border-bottom:3px solid #008CD7; }

img { max-width:100%; }

/* Spécifique */

.main ul.big li {
	font-weight:800;
	font-size:110%;
	margin-top: 0.4em;
}

h1 .sous-titre {
	font-size: 50%;
	font-weight: 200;
	line-height: 70%;
}

p.tract {
	text-align: center !important;
	margin: 0 !important;
}

.tract img {
	max-width: 600px;
	margin: 0;
}

.hero {
	font-size:140%;
	line-height:150%;
}
.hero p { text-align:center; margin: 0.4em 1em !important; line-height:1.1em; }
.hero p.un { font-size:150%; color:#003F61; }
.hero p.deux { font-size:200%; color:#008CD7; }
.hero p.trois { font-size:150%; color:#003F61; }

.citation { margin:2em; border-left:4px solid #666; }
.citation p { font-style:italic; color:#999; }
.citation p:first-child { font-size:200%; line-height:100%; color:#666; }

footer {
	width: 100%;
	padding: 5px 0 10px 0;
	background-color: #002B42;
}
footer p {
	margin: 10px;
	font-size: 90%;
	color:white;
}
footer a, footer a:visited { color:white; text-decoration:none; border-bottom:2px solid white; }
footer a:hover { color:#008CD7; text-decoration:none; border-bottom:3px solid #008CD7; }

/* Responsive */

/* Small Desktops */
@media (min-width: 768px) and (max-width: 1096px) {
	.main { width: 84%; }
	.main p { margin: 10px 25px; }
	h1 { font-size:2.5em; margin: 25px; }
	h2 { font-size:1.4em; margin: 25px 25px 10px; }
    .hero p.un { font-size:120%; }
	.hero p.deux { font-size:150%; }
	.hero p.trois { font-size:120%; }
	.citation p:first-child { font-size:190%; line-height:100%; }
}

/* Small Tablets */
@media (min-width: 481px)and (max-width: 767px) {
	body { font-size: 1em; line-height: 1.2em; }
	.main { width: 90%; }
	.main p { margin: 10px 20px; }
	h1 { font-size:2.2em; margin: 20px; }
	h2 { font-size:1.3em; margin: 20px 20px 10px; }
	.hero p.un { font-size:110%; }
	.hero p.deux { font-size:130%; }
	.hero p.trois { font-size:110%; }
	.citation p:first-child { font-size:180%; line-height:100%; }
	.tract img { max-width: 100%; }
}
	
/* Mobile */
@media (max-width: 480px) {
    body { font-size: 1em; line-height: 1.2em; }
	.main { width: 94%; }
    .main p { margin: 10px 15px; }
    h1 { font-size:2em; margin: 20px 15px; }
	h2 { font-size:1.2em; margin: 20px 15px 10px; }
    .hero p.un { font-size:80%; }
	.hero p.deux { font-size:100%; }
	.hero p.trois { font-size:80%; }
	.citation p:first-child { font-size:160%; line-height:100%; }
	.tract img { max-width: 100%; }
}