body{
	background: #b2b2b1 url(img/fond.png) repeat-x;
	margin: 0;
	padding: 0;
}

a:hover{
	outline: none;
}

#page{
	width: 1100px;
	margin: 0px auto 20px;
	padding-top: 80px;
	background: transparent url(img/page.png) center top no-repeat;
}

#cadre{
	width: 925px;
	height: 492px;
	margin: 0 auto;
	background: transparent url(img/cadre.png) no-repeat;
	position: relative;
}

a#a_m2c2{
	bottom: 15px;
    display: block;
    height: 16px;
    left: 28px;
    position: absolute;
    width: 49px;
}

a#a_sc{
	bottom: 15px;
    display: block;
    height: 22px;
    left: 83px;
    position: absolute;
    width: 91px;
}

#menu{
	width: 162px;
	height: 135px;
	position: absolute;
	bottom: 50px;
	right: 74px;
	margin: 0;
	padding: 30px 0 0;
	list-style: none;
}

	#menu li a{
		display: block;
		width: 162px;
		height: 22px;
		background: transparent url(img/menu.png) no-repeat;
		text-indent: -9999px;
		margin-bottom: 5px;
	}

		#menu li#m_m2c2 a{
			background-position: 0px -0px;
		}
		
		#menu li#m_m2c2 a:hover, #accueil #menu li#m_m2c2 a{
			background-position: -164px 0px;
		}
		
		#menu li#m_real a{
			background-position: 0px -38px;
		}
		
		#menu li#m_real a:hover, #realisation #menu li#m_real a{
			background-position: -164px -38px;
		}
		
		#menu li#m_refe a{
			background-position: 0px -75px;
		}
		
		#menu li#m_refe a:hover, #references #menu li#m_refe a{
			background-position: -164px -75px;
		}
		
		#menu li#m_cont a{
			background-position: 0px -113px;
		}
		
		#menu li#m_cont a:hover, #contact #menu li#m_cont a{
			background-position: -164px -113px;
		}
		
#conteneur{
	bottom: 58px;
    height: 408px;
    left: 31px;
    position: absolute;
    width: 659px;
}

a#a_contact{
	bottom: 86px;
    display: block;
    height: 16px;
    left: 143px;
    position: absolute;
    width: 241px;
}


a#lien_eric{
	position: absolute;
	top: 12px;
	left: 9px;
	display: block;
	width: 120px;
	height: 140px;
}

a#lien_eric2{
	display: block;
    height: 19px;
    left: 273px;
    position: absolute;
    top: 193px;
    width: 156px;
}

a#lien_alex{
	position: absolute;
	top: 12px;
	left: 140px;
	display: block;
	width: 120px;
	height: 140px;
}

a#lien_alex2{
	display: block;
    height: 19px;
    left: 455px;
    position: absolute;
    top: 193px;
    width: 144px;
}



/*
	################################## SCROLLABLE ####################################
*/

a.prev, a.next{
	display: block;
	width: 25px;
	height: 46px;
	background: transparent url(img/fleches.png) no-repeat;
}

a.prev{
	position: absolute;
	top: 180px;
	left: -3px;
	background-position: -2px -50px;
	z-index: 50;
	cursor: pointer;
}

a.next{
	position: absolute;
	top: 180px;
	right: -1px;
	background-position: -30px -50px;
	z-index: 50;
	cursor: pointer;
}

.scrollable {
	position:relative;
	overflow:hidden;
	width: 659px;
	height:408px;
}

.scrollable .items {
	width:20000em;
	position:absolute;
}

.items div {
	float:left;
}

.navi {
	position: absolute;
	height:15px;
	z-index: 50;
}

#realisation .navi{
	bottom: 4px;
	left: 320px;
	width:90px;
}

#references .navi{
	bottom: 4px;
	left: 329px;
	width:90px;
}

#besson .navi{
	bottom: 48px;
    left: 178px;
    width: 220px;
}

.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(img/bullets.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

.navi a:hover {
	background-position:0 -8px;      
}

.navi a.active {
	background-position:0 -8px;     
}


/*
	################################## POP-UPs ####################################
*/

#popups{
	
}

#pb01{
	position: absolute;
	top: 9px;
	left: 20px;
	width: 774px;
	height: 384px;
	z-index: 100;
}

#pb02,#pb03,#pb04,#pb05,#pb06,#pb07,#pb08,#pb09,#pb10,#pb11,#pb12,#pb13,#pb14{
	display: none;
	position: absolute;
	top: 9px;
	left: 20px;
	width: 774px;
	height: 384px;
	z-index: 100;
}