@font-face { font-family : 'Ringfinger';
src: url('ringfinger.ttf') format('truetype'); }

body 
{
	margin-left: 25%;
	margin-right:25%;
	margin-top: 250px;
	background-color: #FFE796;
}

#banniere {
	background-position: 0px 0px;
	background-repeat: no-repeat;
	position: absolute;
	left: 0px;
	display:block;
	width: 800px;
	height : 250px;
	top:0px;
	background-image: url('../banniere.png');
	margin-bottom: 10px;
}

#fond_banniere {
	position: absolute;
	left: 0px;
	top:0px;
	display:block;
	width : 100%;
	height : 115px;
	background-color: #672C2D;
	border-bottom: solid 2px #675D5D;
	margin-bottom: 10px;
}

#titre {
	
	position:absolute;
	text-align: center;
	width: 500px;
	height:100px;
	top : 3px;
	left : 400px;
	font-family: "Ringfinger", "Courier New", sans-serif;
	font-size: x-large;
	color: #ffe796;
	text-shadow: -2px 2px 5px #ffe796;

	
}



.histoire {
	color: #ffe796;
	font-family: "Comic Sans MS", Arial, sans-serif;
	font-size: large;
	display: block;
	background-color: #672c2d;
	width:500px;
	height:auto;
	
	padding : 20px;
	margin : 70px;
	line-height: 20px;
	
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	-webkit-box-shadow: rgb(0, 0, 0) 0.2em 0.2em 1em;
	
	-moz-border-top-colors: #672C2D #FFE796;
	-moz-border-left-colors: #672C2D #FFE796;
	-moz-border-right-colors: #672C2D #FFE796;
	-moz-border-bottom-colors: #672C2D #FFE796;
	text-shadow: -2px 2px 30px #ffe896;
}

.numero {
	margin: 0px;
	left: -10px;
	text-align: left;
	position: relative;
	text-transform: uppercase;
	top: -20px;
	color: #FFE796;
	font-family: "Comic Sans MS", Arial, sans-serif;
	font-size: small;
	display: inline-block;
	width: 10px;
	height:auto;
	
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;

	
	-moz-border-top-colors: #672C2D #FFE796;
	-moz-border-left-colors: #672C2D #FFE796;
	-moz-border-right-colors: #672C2D #FFE796;
	-moz-border-bottom-colors: #672C2D #FFE796;
}