/* TEXTES : COULEURS */

#page h1
{
	color: #60a3bc;
}

#page p
{
	color: #000000;
}

#page a
{
	color: #60a3bc;
}



/* TEXTES : ALIGNEMENTS */

#page h1.left
{
	text-align: left;
}
#page h1.right
{
	text-align: right;
}
#page p
{
	text-align: justify;
}



/* TEXTES : POLICES */

#page h1,
#page p
{
	font-family: 'Raleway', sans-serif;
}

#page h1
{
	line-height: 100%;
	font-weight: 200;
}

#page p
{
	line-height: 150%;
	font-weight: 300;
}

#page a
{
	text-decoration: none;
	font-weight: 500;
	font-style: italic;
}



/* GEOMETRIE */

body, html, #page, #page div, #page p, #page h1
{
	margin: 0;
	padding: 0;
}

#page h1,
#page p
{
	width: 100%;
}

#page .out
{
	width: 50%;
	padding-bottom: 37.5%;
	float: left;
	position: relative;
	overflow: hidden;
}
@media (orientation: portrait)
{
	#page .out
	{
		width: 100%;
		padding-bottom: 75%;
	}
}

#page .img.odd
{
	left: 50%;
}
#page .txt.odd
{
	left: -50%;
}
@media (orientation: portrait)
{
	#page .odd
	{
		left: 0 !important;
	}
}

#page .img.in
{
	width: 100%;
	height: 130%;
	position: absolute;
}

#page .img.in div
{
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	opacity: 0;
	position: absolute;
}

#page .txt.in
{
	width: 90%; /* c'était 100% avant... */
	height: 90%; /* c'était 100% avant... */
	padding: 5%;
	position: absolute;
}



/* DIVERS */

#page
{
	opacity: 0;
}

body
{

	cursor: default;
}

#menu div
{
	top: 55%;
	position: absolute;
	width:90%;
}
#menu p
{
	text-align:center !important;
}
#menu a
{
	text-decoration: underline;
	font-weight: 200;
	font-style: normal;
	color: black;
}