@import url(http://fonts.googleapis.com/css?family=Bad+Script|Montserrat);

.sans-serif, body, button{
	font-family: "Montserrat", sans-serif;
	font-weight: normal;
}

.cursive, h2, #content dl dt{
	font-family: "Bad Script", cursive;
	font-weight: normal;
}

*{
	margin: 0px;
	padding: 0px;
	font-weight: normal;
	outline: none !important;
	border:none;
}
body{
	color: #CCBFC4;
	font-size: 13px;
	background: #5F565E;
}
#page{
	height: 5000px;
	overflow: hidden;
	padding-left: 200px;
	padding-right: 150px;
}
#flashContent{
	position: absolute;
	left: 0px;
	top: 0px;
	display: none;
}
#flashContent #remote{
	position: absolute;
	z-index: 2;
	top: 0px;
	padding: 5px;
	left: 0px;
	cursor:pointer;
}
#header{
	position: relative;
	width: 700px;
	margin: auto;
	height: 200px;
	top: 300px;
}
#header .logo{
	position: absolute;
}
#header h1.titre{
	position: absolute;
	left: 220px;
	top: 40px;
	color: #8693FF;
	font-size: 40px;
}
#header h2.sous-titre{
	position: absolute;
	left: 220px;
	top: 85px;
	color: #F90;
	font-size: 30px;
}
#header h3.date{
	position: absolute;
	top: 25px;
	padding: 30px 20px 20px;
	border-left: 1px dotted #FFF;
	width: 120px;
	color: #FFF;
	left: 600px;
	font-size: 1em;
}
#content{
	position: relative;
	width: 700px;
	margin: 20px auto auto;
}
#content dl{}
#content dl dt.nav{
	position: absolute;
	line-height: 0px;
	display: block;
	top: 0px;
	left: -200px;
	text-align: right;
	width: 100px;
	cursor:pointer;
	overflow: visible;
	padding: 20px 50px 20px 20px;
	color: #000;
	font-size: 1.5em;
}
#content dl dt.on{
	color: #FFF;
}
#content dl dt.on:hover{
	text-decoration: none;
	cursor:default
}
#content dl dt:hover{
	text-decoration: underline;
}
#content dl dt.accueil {
	background: url(images/pictos.png) no-repeat right 0px;
}
#content dl dt.programme {
	background: url(images/pictos.png) no-repeat right -50px;
	margin-top: 50px;
}
#content dl dt.invites {
	background: url(images/pictos.png) no-repeat right -100px;
	margin-top: 100px;
}
#content dl dt.infos {
	background: url(images/pictos.png) no-repeat right -150px;
	margin-top: 150px;
}

#content dd {
	position: absolute;
	top: 0px;
	width: 100%;
	display: none;
}

#content dd #intro{
	float: left;
	width: 300px;
	position: relative;
}
#content img.visuel{
	float: right;
	padding: 10px;
	border: 1px solid #443D43;
}
#footer{
	position: absolute;
	background: #443D43;
	height:5000px;
	top: 0px;
	display: block;
	text-align: center !important;
	right: 0px;
	padding-top: 136px;
}
#footer ul{
	list-style: none;
	position: relative;
	width: 80px;
	margin: 10px;
}
#footer li{
	overflow: hidden;
	position: relative;
	height: 65px;
	width: 80px;
	margin: 10px 0px;
	background: #363136;
	display: block;
}
#footer li .legende{
	font-size: 0.85em;
	position: absolute;
	left: 0px;
	top: 0px;
	padding: 5px;
	height: 55px;
	width: 70px;
}
#footer li img{
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
}
#footer small.info{
	display: block;
	padding: 30px 0px 0px;
}
#footer small p{
	font-size: 0.9em;
	padding: 5px 0px;
	line-height: 1.5em;
}
#footer a.ville-evry{
	background: url(images/logo-ville-evry.png) no-repeat right bottom;
	display: block;
	padding: 0px 0px 70px;
}
#footer, #footer a{
	color: #CCBFC4;
}
.clear{
	clear: both;
}
a{
	color: #FF3C00;
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}
p{
	font-size: 1em;
	line-height: 2em;
}
.emphase {
	font-size: 120%;
	text-transform: uppercase;
	color: #FFF;
}
button{
	color: #FFF;
	background: #66C url(images/pictos.png) no-repeat 10px 5px;
	border-style: none;
	padding: 23px 15px 23px 60px;
	font-size: 1em;
	line-height: 0px;
}
.masque, #header .logo, #header h1, #header h2, #header h3, #content, #footer{
	display: none;
}