@font-face{
	font-family:"banana brick";
	src:url("../fonts/BBrick.ttf") format("truetype"),
		url("../fonts/BBrick.eot") format("embedded-opentype");
	font-weight:normal;
	font-style:normal;
}
@font-face{
	font-family:"SquareAntiqua";
	src:url("../fonts/SquareAntiqua.ttf") format("truetype")/*,
		url("../fonts/SquareAntiqua.eot") format("embedded-opentype")*/;
	font-weight:normal;
	font-style:normal;
}

*{
	padding:0px;
	margin:0px;
}
html{
	height:100%;
	min-width:1000px;
}
body{
	font-family:sans-serif;
	min-width:1000px;
	background-image:-webkit-gradient(
		linear,
		left bottom,
		right bottom,
		from(rgb(128, 150, 140)),
		color-stop(0.25, rgb(180, 210, 200)),
		color-stop(0.75, rgb(180, 210, 200)),
		to(rgb(128, 150, 140))
	);
	background-image:-moz-linear-gradient(left, 
				rgb(128, 150, 140), 
				rgb(180, 210, 200) 25%,
				rgb(180, 210, 200) 75%, 
				rgb(128, 150, 140)
	);
	background-image:-o-linear-gradient(left, 
				rgb(128, 150, 140), 
				rgb(180, 210, 200) 25%,
				rgb(180, 210, 200) 75%, 
				rgb(128, 150, 140)
	);
	background-image:-ms-linear-gradient(left, 
				rgb(128, 150, 140), 
				rgb(180, 210, 200) 25%,
				rgb(180, 210, 200) 75%, 
				rgb(128, 150, 140)
	);
	background-image:-webkit-linear-gradient(left, 
				rgb(128, 150, 140), 
				rgb(180, 210, 200) 25%,
				rgb(180, 210, 200) 75%, 
				rgb(128, 150, 140)
	);
	background-image:linear-gradient(left, 
				rgb(128, 150, 140), 
				rgb(180, 210, 200) 25%,
				rgb(180, 210, 200) 75%, 
				rgb(128, 150, 140)
	);
}

header{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	height:150px;
	min-width:1000px;
	-moz-box-shadow:	inset 0px 5px 10px rgba(0, 0, 0, 0.3),
				inset 0px -20px 20px rgba(255, 255, 255, 0.5);
	-webkit-box-shadow:	inset 0px 5px 10px rgba(0, 0, 0, 0.3),
				inset 0px -20px 20px rgba(255, 255, 255, 0.5);
	box-shadow:	inset 0px 5px 10px rgba(0, 0, 0, 0.3),
				inset 0px -20px 20px rgba(255, 255, 255, 0.5);
}
header>h1{
	width:500px;
	margin:15px auto 0px auto;
	font-family:"banana brick";
	font-weight:normal;
	font-size:50px;
	line-height:50px;
	text-align:center;
	color:rgba(64, 128, 255, 0.3);
	text-shadow:3px 3px 5px rgba(0, 0, 0, 0.3),
				-3px -3px 5px rgba(255, 255, 255, 0.3);
}
nav#principal{
	position:absolute;
	bottom:1px;
	width:100%;
	text-align:center;
	height:30px;
}
nav#principal>ul>li{
	position:relative;
	display:inline-block;
	vertical-align:top;
	text-align:left;
	height:30px;
	z-index:100;
}
nav#principal nav>ul{
	list-style-position:none;
	list-style-type:none;
	text-indent:10px;
}
nav#principal a{
	display:block;
	text-decoration:none;
	color:black;
	line-height:25px;
	font-family:"SquareAntiqua";
	vertical-align:middle;
	padding: 0px 5px;
	background-color:#E0FFFF;
	border-top:1px solid #D0D0FF;
}
nav#principal>ul>li>nav a{
	border-width:0px;
	height:0px;
	line-height:0px;
	overflow:hidden;
	-webkit-transition-property:line-height, height;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease-in;
	-moz-transition-property:line-height, height;
	-moz-transition-duration:0.5s;
	-moz-transition-timing-function:ease-in;
	-o-transition-property:line-height, height;
	-o-transition-duration:0.5s;
	-o-transition-timing-function:ease-in;
	-ms-transition-property:line-height, height;
	-ms-transition-duration:0.5s;
	-ms-transition-timing-function:ease-in;
}
nav#principal>ul>li:hover>nav a{
	height:25px;
	line-height:25px;
	border-width:1px;
}
nav#principal>ul>li>a{
	line-height:30px;
	font-size:20px;
	-moz-border-radius:10px 10px 0px 0px;
	-webkit-border-radius:10px 10px 0px 0px;
	border-radius:10px 10px 0px 0px;
	-moz-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.5);
	box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.5);
}
nav#principal a:hover, nav#principal>ul>li:hover>a{
	background-color:#D0FFFF;
	color:#330000;
}
div#cadre{
	position:absolute;
	top:150px;
	left:0px;
	right:0px;
	bottom:0px;
	min-width:1000px;
	background-image:-webkit-gradient(
		linear,
		left top,
		right bottom,
		from(rgba(200, 220, 210, 0.5)),
		to(rgba(240, 255, 255, 1))
	);
	background-image:-moz-linear-gradient(135deg, 
				rgba(200, 220, 210, 0.5),
				rgba(240, 255, 255, 1)
	);
	background-image:-o-linear-gradient(135deg, 
				rgba(200, 220, 210, 0.5),
				rgba(240, 255, 255, 1)
	);
	background-image:-webkit-linear-gradient(135deg, 
				rgba(200, 220, 210, 0.5),
				rgba(240, 255, 255, 1)
	);
	background-image:-ms-linear-gradient(135deg, 
				rgba(200, 220, 210, 0.5),
				rgba(240, 255, 255, 1)
	);
	background-image:linear-gradient(135deg, 
				rgba(200, 220, 210, 0.5),
				rgba(240, 255, 255, 1)
	);
}
div#contenu{
	position:absolute;
	top:35px;
	left:0px;
	right:200px;
	bottom:0px;
	overflow:auto;
	padding:20px;
	min-width:760px;
}
#titre_page{
	position:absolute;
	top:0px;
	left:0px;
	right:200px;
	background-image:-webkit-gradient(
		linear,
		left top,
		left bottom,
		from(rgba(255, 255, 255, 1)),
		to(rgba(255, 255, 255, 0))
	);
	background-image:-moz-linear-gradient(-90deg, 
				rgba(255, 255, 255, 1),
				rgba(255, 255, 255, 0)
	);
	background-image:-webkit-linear-gradient(-90deg, 
				rgba(255, 255, 255, 1),
				rgba(255, 255, 255, 0)
	);
	background-image:-o-linear-gradient(-90deg, 
				rgba(255, 255, 255, 1),
				rgba(255, 255, 255, 0)
	);
	background-image:-ms-linear-gradient(-90deg, 
				rgba(255, 255, 255, 1),
				rgba(255, 255, 255, 0)
	);
	background-image:linear-gradient(-90deg, 
				rgba(255, 255, 255, 1),
				rgba(255, 255, 255, 0)
	);
	overflow:hidden;
}
#titre_page>h2{
	display:inline-block;
	padding:0px 30px 0px 50px;
	-moz-border-radius:0px 0px 20px 0px;
	-webkit-border-radius:0px 0px 20px 0px;
	border-radius:0px 0px 20px 0px;
	line-height:35px;
	font-size:20px;
	font-weight:bold;
	font-family:"SquareAntiqua";
	background-color:#A0C0FF;
	vertical-align:top;
}
#bordure_h2{
	display:inline-block;
	height:35px;
	width:35px;
	-moz-border-radius:15px 0px 0px 0px;
	-webkit-border-radius:15px 0px 0px 0px;
	border-radius:15px 0px 0px 0px;
	-moz-box-shadow:-15px -20px 0px #A0C0FF;
	-webkit-box-shadow:-15px -20px 0px #A0C0FF;
	box-shadow:-15px -20px 0px #A0C0FF;
	vertical-align:top;
}
div#infos{
	position:absolute;
	top:0px;
	right:0px;
	bottom:0px;
	overflow:auto;
	padding-top:20px;
	width:200px;
	background-image:-moz-linear-gradient(top, 
				rgba(200, 220, 210, 0.5), 
				rgba(240, 255, 255, 0.5)
	);
	-moz-box-shadow:inset 0px 20px 20px rgba(255, 255, 255, 0.4),
					-10px 3px 10px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow:inset 0px 20px 20px rgba(255, 255, 255, 0.4),
					-10px 3px 10px rgba(0, 0, 0, 0.2);
	box-shadow:inset 0px 20px 20px rgba(255, 255, 255, 0.4),
					-10px 3px 10px rgba(0, 0, 0, 0.2);
}
#infos>div{
	width:170px;
	margin:15px auto 0px auto;
	padding:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	-moz-box-shadow:inset 5px 5px 5px rgba(255, 255, 255, 0.3),
				inset -5px -5px 5px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow:inset 5px 5px 5px rgba(255, 255, 255, 0.3),
				inset -5px -5px 5px rgba(0, 0, 0, 0.1);
	box-shadow:inset 5px 5px 5px rgba(255, 255, 255, 0.3),
				inset -5px -5px 5px rgba(0, 0, 0, 0.1);
}
#infos p.text{
	width:100%;
	text-align:justify;
	text-indent:25px;
	font-family:serif;
	font-size:80%;
}
