body
{
	background: url(image/background.jpg) fixed top; 
	background-size:cover;
	margin:5px;
}

article, aside
{
	display: inline-block;
	vertical-align:middle;
}

article
{
	text-align: justify;
	width: 55%;
	margin:auto;
	padding: 1%;
}

aside
{
	width: 300px;
	text-align: center;
}


@font-face {
    font-family: 'splashregular';
    src: url('font/splash__-webfont.eot');
    src: url('font/splash__-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/splash__-webfont.woff') format('woff'),
         url('font/splash__-webfont.ttf') format('truetype'),
         url('font/splash__-webfont.svg#splashregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
#index
{
	
	color: #990000;
	font-family: splashregular, "Times New Roman", Times, serif;
	text-align: center;
	margin: auto;
}

#logo_nav
{
	font-family: splashregular, "Times New Roman", Times, serif;
	display:none;
	margin: auto;
	border-radius: 5px;
	position:fixed;
}

#menu
{
	font-family: splashregular, "Times New Roman", Times, serif;
	position: fixed;
	top: 20%;
	width: 15%;
	color: black;
	text-shadow: 4px 4px 6px white;
}	

#back
{
	position: fixed;
	top: 50%;
	width: 15%;
	text-align: center;
	background-color: none;
}	

news
{
	font-family: splashregular, "Times New Roman", Times, serif;
	position: fixed;
	top: 2%;
	left: 0px;
	width: 15%;
	padding-left: 5px;
	color: green;
	text-align: center;
	text-shadow: 8px 8px 12px red;
}	

moi
{
	font-family: splashregular, "Times New Roman", Times, serif;
	position: fixed;
	top: 20%;
	right: 0px;
	width: 15%;
	padding-right: 5px;
	color: black;
	text-align: center;
	text-shadow: 4px 4px 6px white;
}	

table
{
	margin-left: auto;
	margin-right:auto;
}

header
{
	color: black;
	font-family: splashregular, "Times New Roman", Times, serif;
	text-align: center;
	padding: 15px;
	text-shadow: 8px 8px 12px white;
}

#corps
{
	background-color: white;
	color: #990000;
	font-family: splashregular, "Times New Roman", Times, serif;
	text-align: center;
	width: 64%;
	margin: auto;
	padding: 2%;
	border-radius: 30px;
}

#corps_form
{
	background-color: white;
	color: #990000;
	font-family: splashregular, "Times New Roman", Times, serif;
	text-align: center;
	border-radius: 30px;

}

form
{
	background-color: white;
	width: 64%;
	margin: auto;
	padding: 2%;
	border-radius: 30px;
}

footer
{
	font-family: splashregular, "Times New Roman", Times, serif;
	width: 62%;
	margin: auto;
	margin-bottom: 20px;
	padding: 10px;
	text-align: center;
}
	
a
{
	color: black;
	font-family: splashregular, "Times New Roman", Times, serif;
	text-shadow: 4px 4px 6px white;
}

a:hover
{
	color: rgb(0,255,255);
	font-family: splashregular, "Times New Roman", Times, serif;
	text-shadow: 4px 4px 6px maroon;
}

a:active
{
	color: rgb(0,255,255);
	font-family: splashregular, "Times New Roman", Times, serif;
	text-shadow: 4px 4px 6px maroon
}

#infor
{
	background-color: white;
	color: black;
	font-family: serif;
	text-align: justify;
	margin: auto;
	padding: 2%;
}

.niveau2
{
	display:none;
}
.niveau1:hover .niveau2
{
	display:block;
}

.niveauB
{
	display:none;
}
.niveauA:hover .niveauB
{
	display:block;
	border-radius:15px;
	padding:10px;
	margin:0px;
}

@media screen and (max-width:850px)
{
	moi{display:none;}
	news{display:none;}
	#corps{margin-left:55px; margin-right:0px; width:auto;}
	form{margin-left:60px; padding:auto; margin-right:0px; width:auto;}
	#menu{display:none;}
	img{max-width:150px;}
	textarea{max-width:250px;}
	input{max-width:150px;}
	header{padding:1px;}
	h1{font-size:1.5em;}
	h2{font-size:1em;}
	p{font-size:0.8em;}
	.niveau1{font-size:0.8em;}
	.niveau2{font-size:0.8em; display:block;}
	#infor{font-size:0.5em;}
	#logo_nav{display:block; margin-top:0px; top:0px; position:fixed;}
	.niveauB{background:grey; border-radius:15px; padding:10px; margin:0px;}
}