/* Encodé en UTF-8 */

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}
html {
	background: #0144a2 url(/images/splash/splash-bg.png) repeat-x 0 0;
}
body {
	background: url(/images/splash/logo-bg.png) no-repeat 50% 0;
	font: 62.5% "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3d4a5d;
	min-height: 776px;
}


p, form, img, h1, h2, h3, h4, h5, h6, ul, ol, li {
	margin: 0;
	padding: 0;
}

.hide {
	position: absolute;
	left: -5000px;
}

/*** PAGE ***/
#page {
	width: 900px;
	margin: 0 auto;
	position: relative;
}

/*** FRANCAIS & NEDERLANDS ***/
#francais a, #nederlands a {
	display: block;
	width: 155px;
	height: 49px;
	position: absolute;
	outline: none;
}

#francais ul, #nederlands ul {
	width: 800px;
	height: 31px;
	position: absolute;
}

#francais ul li, #nederlands ul li {
	display: block;
	float: left;
	color: #fff;
	line-height: 31px;
	text-transform: uppercase;
	font-size: 1.7em;
	font-weight: bold;
}


/*** FRANCAIS ***/

#francais {
	width: 800px;
	padding: 0 50px;
	height: 353px;
	position: relative;
}

#francais ul {
	bottom: 0;
	left: 50px;
}

#francais ul li.interim {
	margin-left: 168px;
	_margin-left: 84px;
}

#francais ul li.outplacement {
	margin-left: 88px;
}

#francais ul li.recrutement {
	margin-left: 60px;
}

#francais ul li.selection {
	margin-left: 58px;
}

#francais a {
	top: 201px;
}

#francais a.employeur, #francais a.employeur:visited {
	background: url(/images/splash/buttons-bg.png) no-repeat 0 0;
	left: 430px;
}
#francais a.employeur:hover {
	background: url(/images/splash/buttons-bg.png) no-repeat 0 -49px;
}

#francais a.candidat, #francais a.candidat:visited {
	background: url(/images/splash/buttons-bg.png) no-repeat -155px 0;
	left: 673px;
}
#francais a.candidat:hover {
	background: url(/images/splash/buttons-bg.png) no-repeat -155px -49px;
}

/*** NEDERLANDS ***/

#nederlands {
	width: 800px;
	padding: 116px 50px 0;
	height: 300px;
	position: relative;
}

#nederlands ul {
	top: 116px;
	left: 50px;
}

#nederlands ul li.interim {
	margin-left: 137px;
	_margin-left: 68px;
}

#nederlands ul li.outplacement {
	margin-left: 57px;
}

#nederlands ul li.recrutement {
	margin-left: 65px;
}

#nederlands ul li.selection {
	margin-left: 67px;
}

#nederlands a {
	top: 219px;
}

#nederlands a.werkgever, #nederlands a.werkgever:visited {
	background: url(/images/splash/buttons-bg.png) no-repeat -310px 0;
	left: 430px;
}
#nederlands a.werkgever:hover {
	background: url(/images/splash/buttons-bg.png) no-repeat -310px -49px;
}

#nederlands a.kandidaat, #nederlands a.kandidaat:visited {
	background: url(/images/splash/buttons-bg.png) no-repeat -465px 0;
	left: 673px;
}
#nederlands a.kandidaat:hover {
	background: url(/images/splash/buttons-bg.png) no-repeat -465px -49px;
}

/*** OFFRES ***/
#offres {
	position: absolute;
	top: 353px;
	left: 0;
	width: 900px;
	height: 116px;
	/*padding: 0 0 0 50px;*/
}

#offres ul {
	padding: 42px 0 0 50px;
}

#offres ul li {
	list-style: none;
	display: block;
	width: 395px;
	height: 34px;
	float: left;
	background: url(/images/splash/offre-bg.png) repeat-x 0 0;
}

#offres ul li.even {
	margin: 0 5px 0 0;
}

#offres ul li.odd {
	margin: 0 0 0 5px;
}

#offres ul li a, #offres ul li a:visited {
	display: block;
	width: 331px;
	_width: 373px;
	height: 32px;
	border: 1px solid #a9abac;
	font-size: 1.4em;
	line-height: 32px;
	color: #013785;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
	padding: 0 52px 0 10px;
	_padding: 0 10px 0 10px;
	position: relative;
	_position: static;
}
#offres ul li a:hover {
	border: 1px solid #a9abac;
}

#offres ul li a span {
	position: absolute;
	right: 10px;
	top: 0;
	font-size: 0.8em;
	font-weight: 400;
	color: #000;
	_display: none;
}

#offres ul li.new a, #offres ul li.new a:visited, #offres ul li.new a:hover {
	padding: 0 52px 0 58px;
	width: 283px;
	background: url(/images/splash/new-bg.png) no-repeat 0 0;
}

#offres div.jcarousel-prev {
	width: 20px;
	height: 34px;
	position: absolute;
	left: 10px;
	top: 42px;
	background: url(/images/splash/fleches-bg.png) no-repeat 0 0;
	cursor: pointer;
}
#offres div.jcarousel-prev:hover {
	background: url(/images/splash/fleches-bg.png) no-repeat 0 -34px;
}

#offres div.jcarousel-next {
	width: 20px;
	height: 34px;
	position: absolute;
	right: 10px;
	top: 42px;
	background: url(/images/splash/fleches-bg.png) no-repeat -20px 0;
	cursor: pointer;
}
#offres div.jcarousel-next:hover {
	background: url(/images/splash/fleches-bg.png) no-repeat -20px -34px;
}/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
	z-index:200;
	width:850px;
	padding: 0 0 0 50px;
}

.jcarousel-clip {
    z-index: 20;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
	width:800px;
	/*margin: 0 0 0 50px;*/
}

.jcarousel-list {
    z-index: 10;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 110px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 30;
    display: none;
}

.jcarousel-prev {
    z-index: 30;
    display: none;
}