/*****************************************************************************
 *	Screen.css
 *	Feuille de style pour la mise en forme générale du site à l'écran
 *
 *	Lunaweb(c)2008
 *****************************************************************************/

/* CSS Blueprint */
@import url(blueprint/screen.css);
/* CSS Common */
@import url(common.css);

body {
	background: #FFEED8 url(../media/img/design/pages/body_bg.png) top left repeat-x;
	margin: 0 auto;
	text-align: center;
}

a {
	color: #336975;
}

p           { margin: 0 0 1em; }
ul, ol      { margin:0 1.5em 1em; }
ul          { list-style-type: disc; }

#header,
#navsublinks,
#contenu {
	border-left: 2px solid white;
}

#global {
	text-align: left;
	width: 813px;
	overflow: hidden;
	margin: 0 auto;
}

#site {
	background: transparent url(../media/img/design/pages/sidebar_bg.png) 0 0;
}

#set {
	padding-bottom: 0.5em;
	background: transparent url(../media/img/design/pages/footer-sans-ombre.png) bottom left no-repeat;
}

#header {
	position: relative;
	background: transparent url(../media/img/design/pages/header.png) 0 0;
	width: 510px;
	height: 88px;
}

#header ul,
#navsublinks ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#accesslinks li {
	line-height: 1;
	position: relative;
	list-style: none;
}

li#logo a {
	position: absolute;
	display: block;
	width: 310px;
	height: 88px;
	left: 500px;
	top: 2px;
}

li#logo a#logo-fr {
	background: transparent url(../media/img/design/pages/logo-fr.png) top left no-repeat;
}

/* hack pour corriger un décalage sous firefox : */
li#logo>/**/a {
	top: 0;
}

#footer {
	margin: 1em 0;
	color: #336975;
}

#footer ul {
	margin: 0;
	list-style: none;
}

#footer a {
	color: #336975;
	text-decoration: underline;
}

#footer li {
	display: inline;
	margin: 0 0 0 5px;
}

a#register {
	background: transparent url(../media/img/design/pages/register.png) top left no-repeat;
	width: 75px;
	height: 75px;
	position: absolute;
	display: block;
	top: -27px;
	left: 145px;
}

h2 {
	min-height: 40px;
	_height: 40px;
	line-height: 1;
}

#toolbar {
	position: absolute;
	height: 21px;
	z-index: 20;
}

	#toolbar div {
		display: block;
		height: 21px;
		width: auto;
		float: left;
		background: white;
		filter:alpha(opacity=50); /* IE */
		-moz-opacity:0.5; /* Mozilla */
		-khtml-opacity: 0.5; /* Safari */
		opacity: 0.5; /* CSS3 */
		position: relative;
	}

	#toolbar img {
		margin: 0;
	}

	#toolbar ul {
		list-style: none;
		display: inline;
	}

	#toolbar ul li {
		display: inline;
		margin: 0 5px;
		height: 21px;
		font-size: 0.9em
	}
	#toolbar span#toolbar_right {
		position: absolute;
		width: 35px;
		background: transparent url(../media/img/design/pages/outils-last.png) left top no-repeat;
		filter:alpha(opacity=50); /* IE */
		-moz-opacity:0.5; /* Mozilla */
		-khtml-opacity: 0.5; /* Safari */
		opacity: 0.5; /* CSS3 */
		height: 21px;
	}
/*
=NAVLINKS (menu)
************************************************************/
#navlinks {
	position: absolute;
	top: 63px;
	height: 25px;
	width: 505px;
	background: #BCBCBC url(../media/img/design/pages/navlinks_bg.png) top left repeat-x;
}

	#navlinks ul {
		font: normal 0.9em/25px Verdana, Helvetica, sans-serif;
		list-style: none;
	}

		#navlinks li {
			display: inline;
			padding: 0;
			margin: 0;
		}

			#navlinks a {
				display: block;
				background: url(../media/img/design/pages/tab_on_left.png) top left no-repeat;
				float: left;
				text-decoration: none;
				color: #4C4C4C;
				padding: 0 0 0 7px;
			}

			#navlinks a span {
				float: left;
				display: block;
				padding: 0 10px 0 3px;
				margin-right: 2px;
				background: url(../media/img/design/pages/tab_on_right.png) top right no-repeat;
			}

			#navlinks a:hover span,
			#navlinks a.active span {
				background-position: 100% -25px;
			}

			#navlinks a:hover,
			#navlinks a.active {
				background-position: 0 -25px;
			}
		    /* Commented Backslash Hack hides rule from IE5-Mac \*/
				#navlinks a span {
					float:none;
				}
		    /* End IE5-Mac hack */

.flag {
	width: 16px;
	height: 13px;
	padding: 0 18px 5px 0;
	vertical-align: bottom;
	background-repeat: no-repeat;
}


/*
=NAVSUBLINKS (sous menu)
************************************************************/
#navsublinks {
	height: 27px;
	width: 100%;
	background: white;
}

	#navsublinks ul {
		background: #fff;
		height: 24px;
		font: normal 0.9em/24px Verdana, Helvetica, sans-serif;
		list-style: none;
		padding-top: 3px;
	}

		#navsublinks ul li {
			display: inline;
			padding: 0;
			margin: 0;
		}

		#navsublinks ul li a {
			text-decoration: none;
			color: #B5B5B5;
			display: block;
			float: left;
			padding: 0 0 0 8px;
		}

			#navsublinks ul li a span {
				float: left;
				display: block;
				padding: 0 10px 0 0;
				margin-right: 2px;
			}

		#navsublinks ul li a:hover,
		#navsublinks ul li a.active {
			background: url(../media/img/design/pages/navsub_left.png) top left no-repeat;
			color: #403F3F;
		}

			#navsublinks ul li a:hover span,
			#navsublinks ul li a.active span {
				cursor: pointer;
				background: url(../media/img/design/pages/navsub_right.png) top right no-repeat;
			}

			/* Commented Backslash Hack hides rule from IE5-Mac \*/
				#navsublinks a span {
					float:none;
				}
		    /* End IE5-Mac hack */

/*
=CONTENU
************************************************************/
#contenu {
	background: #F5F5F5 url(../media/img/design/pages/bg-contenu.png) top left no-repeat;
	position: relative;
	margin-right: -2px;
	width: 590px;
}

	#contenu .box {
		padding-top: 0;
		background: transparent;
	}

	#contenu .box.white,
	#contenu .box.yellow {
		padding-top: 1.5em;
	}

	#contenu .box.white {
		background: #FFFFFF;
	}

	#contenu .box.yellow {
		background: #FFF6BF;
	}

	#contenu p#contenu_top {
		height: 20px;
		width: 590px;
	}

	#contenu p#contenu_footer {
		background: transparent url(../media/img/design/pages/main_footer.png) bottom right no-repeat;
		height: 20px;
		width: 590px;
	}

	a#decouvrez-offres {
		background: transparent url(../media/img/design/pages/decouvrez-offres.jpg) 0 -54px no-repeat;
		display: block;
		height: 54px;
		width: 590px;
	}

	a#decouvrez-offres:hover {
		background-position:  0 0;
	}

	#contenu .box p {
		line-height: 1.3;
	}

	#contenu h4 {
		 margin-bottom: 0.75em;
	}

	#contenu h5 {
		 margin-bottom: 0.5em;
	}

/*
=SIDEBAR
************************************************************/
#sidebar {
	width: 230px;
}

	#sidebar #sidebar_top {
		height: 33px;
		background: #fff url(../media/img/design/pages/sidebar_top.png) 2px 100% no-repeat;
		margin: 0;
		padding: 0;
	}

	/* boite dans la sidebar */
	#sidebar div.sidebox {
		position: relative;
		margin: 0 6px 6px;
		width: 208px;
		text-align: left;
	}

		#sidebar div.sidebox div {
			background: transparent url(../media/img/design/pages/sidebar_whitebox_footer.png) bottom center no-repeat;
			margin: 0;
			padding: 0 5px 30px;
		}

		#sidebar div.sidebox>div {
			background: transparent url(../media/img/design/pages/32/sidebar_whitebox_footer.png) bottom center no-repeat;
		}

		#sidebar div.sidebox hr {
			margin: 0.5em 0
		}

		#sidebar div.sidebox h4 {
			color: #4C4C4C;
			background: transparent url(../media/img/design/pages/sidebar_whitebox_top_gris.png) top left no-repeat;
			width: 208px;
			height: 31px;
			padding: 4px 0 0 8px;
			margin: 0;
			font-weight: normal;
		}

		#sidebar div.sidebox>h4 {
			background: transparent url(../media/img/design/pages/32/sidebar_whitebox_top_gris.png) top left no-repeat;
		}

		#sidebar div.loginbox h4 {
			background: transparent url(../media/img/design/pages/sidebar_whitebox_top.png) top left no-repeat;
		}

		#sidebar div.loginbox>h4 {
			background: transparent url(../media/img/design/pages/32/sidebar_whitebox_top.png) top left no-repeat;
		}

		#sidebar div.sidebox h5 {
			margin-bottom: 0.3em;
		}

			#sidebar div.sidebox h5 a {
				color: #FF9400;
				text-transform: uppercase;
				text-decoration: none;
			}

		#sidebar div.sidebox p {
			font-size: 0.9em;
			line-height: 1.375;
		}

			#sidebar div.sidebox p.date_actu {
				font-style: italic;
				margin: 0;
			}

			#sidebar p.sidebarfoot {
				background: transparent url(../media/img/design/pages/sidebar_footer.png) bottom left no-repeat;
			}

			#sidebar div.sidebox p a {
				color: black;
				text-decoration: none;
			}

		#sidebar button {
			margin: 0.5em 0 0 0;
			padding: 0.2em 0.4em;
		}

		#sidebar button:hover {
			background-color: #F9E0BF;
			border-color: #F8C887;
			color: #EC8A01;
		}

		#sidebar input,
		#sidebar select {
			width: 190px;
			margin: 0 0 0.5em;
		}

		#sidebar div.loginbox div {
			padding-bottom: 0.8em;
		}

		#sidebar div.loginbox ul {
			text-align: center;
			font-size: 0.8em;
			margin: 0.1em;
		}

		#sidebar div.loginbox li {
			padding-left: 2px;
			padding-right: 5px;
			display: inline;
			list-style: none;
		}

		#sidebar div.loginbox ul>/**/li {
			border-right: 1px solid #ccc;
		}

		#sidebar div.loginbox ul li:last-child {
			border-right: 0;
			padding-right: 0;
		}

		#sidebar div.loginbox label {
			display: none;
		}

		#sidebar div.loginbox form p {
			margin-top: 0.5em;
			margin-bottom: 0.5em;
		}

		#sidebar div.loginbox form p.align-right {
			margin-bottom: 1.5em;
		}

		#sidebar div.sidebox p#timer_zone_affichage {
			font-size: 2em;
			text-align: center;
			color: #FF9400;
		}

		#sidebar #bloc-espace-entreprise h4 {
			text-indent: -9999px;
			background: url(../media/img/design/pages/bg-formulaire-contact-entreprise.png) top left no-repeat;
			height: 130px;
		}

		#sidebar #bloc-espace-entreprise div {
			padding-top: 1.5em;
		}

		#sidebar div.warnbox {
			text-align: center;
			color: #4C4C4C;
			padding: 0 5px 5px;
		}

		#sidebar div.warnbox p {
			margin: 0;
			padding: 0;
		}

		#sidebar div.warnbox p a,
		#sidebar div.warnbox p .big {
			color: #ff9100;
			font-weight: bold;
		}

		#sidebar div.warnbox p .big {
			font-size: 2.2em;
		}

/*
=FORMS
************************************************************/
#sidebar input,
#sidebar textarea {
	border: 1px solid #ccc;
	font: normal 11px Verdana, Helvetica, sans-serif;
	padding: 2px 2px 2px 4px;
	margin: 0;
	background: transparent url(../media/img/design/forms/ombre_interieure.png) top left no-repeat;
}

#sidebar form.box {
	padding:4px 10px 3px 7px;
	border: 1px solid #dedede;
}

#contenu li {
	line-height: 1.5;
}

#contenu td {
	line-height: 1.5;
}

#choix-video {
	width: 485px;
	_width: 500px;
	margin: auto;
	margin-top:10px;
}

#choix-video li {
	display: inline;
}

#choix-video a:link,
#choix-video a:visited,
#choix-video a:hover,
#choix-video a:active {
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;

	display: block;
	width: 130px;
	height: 40px;
	float: left;
	padding: 15px 5px 0;
	margin: 20px 10px 40px;

	background: transparent url(../media/img/design/forms/btn-accueil-court.png) top left no-repeat;
}

#choix-video a:hover,
#choix-video a.active,
#choix-video li.entreprise a {
	color: #111111;
	background-position: bottom left;
}

#choix-video li.entreprise a:hover,
#choix-video li.entreprise a.active {
	background-position: top left;
	color: #336975;
}

.clearer {
	clear: both;
}

/** versions texte du site */
div.alt-home {
	width: 550px;
	height: 200px;
	overflow: hidden;
	background: transparent url(http://www.changermonjob.com/media/img/contenu/alt/home.jpg) top left no-repeat;
	text-indent: -9999px;
	margin: 0 0 20px 0;
}


dd {
	line-height: 1.8em;
}

ul.capture {
	margin: 0;
	padding: 0;
}

.capture li {
	list-style-type: none;
	margin: 0 0 1.5em;
	padding: 0;
	text-align: center;
	width: 110px;
	float: right;
}

.capture li img {
	margin: 0.5em 0.5em 0;
}

#home-right {
	float: right;
	text-align: center;
	width: 155px;
	margin: 0 0 1.5em 1.5em;
}

.capture li span.small,
#home-right span.small {
	line-height: 1.25em;
}

#home-right img {
	margin: 0;
}

img.center {
	float: none;
	margin: 0 auto;
	padding: 0.05em;
}

#tabs {
	height: 25px;
	font: normal 1.1em/25px Verdana, Helvetica, sans-serif;
	list-style: none;
	margin: 1em 0;
	padding: 0;
	border-bottom: 1px solid #4C4C4C;
}

	#tabs li {
		display: inline;
		padding: 0;
		margin: 0;
	}

		#tabs a {
			display: block;
			background: url(../media/img/design/pages/tab_on_left_orange.png) top left no-repeat;
			float: left;
			text-decoration: none;
			color: #4C4C4C;
			outline: none;
			padding: 0 0 0 7px;
		}

		#tabs a span {
			float: left;
			display: block;
			padding: 3px 10px 2px 3px;
			margin-right: 2px;
			background: url(../media/img/design/pages/tab_on_right_orange.png) top right no-repeat;
		}

		#tabs a:hover span,
		#tabs a.active span {
			color: #333;
			background-position: 100% -25px;
		}

		#tabs a:hover,
		#tabs a.active {
			background-position: 0 -25px;
		}
	    /* Commented Backslash Hack hides rule from IE5-Mac \*/
			#tabs a span {
				float:none;
			}
	    /* End IE5-Mac hack */