/* CSS Document */

/* --- STYLES DE BASE --- */

/* Page */
html {
    font-size: 100%; /* Évite un bug d'IE 6-7. (1) */
}
body {
    margin: 0;
    padding: 0; /* Remettre à zéro si nécessaire. */
    /* Pensez à utiliser une collection de polices (2), par ex:
    font-family: Arial, Helvetica, FreeSans, sans-serif; */
    font-size: .8em; /* À adapter pour la police choisie. (3) */
    line-height: 1.4; /* À adapter au design. (4) */
    color: black;
    background: white;
}

/* Titres */
h1, h2, h3, h4, h5, h6 {
    margin: .2em 0 .8em 0; /* Rapproche le titre du texte. (5) */
    line-height: 1.4;
    font-weight: bold; /* Valeur par défaut. (6) */
    font-style: normal;
}

/* Paragraphes */
p {
    margin: .75em 0; /* Marges plus faibles que par défaut. (7) */
}


/* Liens */
a {
    text-decoration: underline;
}
a:link {
    color: #003366;
}
a:visited {
    color: #003366;
}
a:hover, a:focus, a:active {
    color: crimson;
}
a img {
    border: none;
}


h1 {font-family: "Verdana", Arial, "Arial Black", serif; color: #003366; font-size: 20px; font-weight: bold; text-align: left; border-bottom: 2px solid gray;}/* Titres de 20 pixels soulignés */
h2 {font-family: "Verdana", Arial, "Arial Black", serif; color: #000099; font-size:  12px; font-weight: bold; text-align: center;}/* Textes de 12 pixels en gras*/
h3 {font-family: "Verdana", Arial, "Arial Black", serif; color: #666666; font-size: 14px; font-weight: bold;line-height: 0px; text-align: center; text-decoration: underline;/* Paragraphes de 12 pixels */}
h4 {font-family: "Verdana", Arial, "Arial Black", serif; color: #333333; font-size:  12px; font-weight: normal; line-height: 18px; text-align: left;}/* Titres de 11 pixels */
h5 {font-family: "Verdana", Arial, "Arial Black", serif; color: #666666; font-size:  10px; font-weight: bold; text-decoration: none; text-align: left;}/* Titres de 10 pixels */
h6 {font-family: "Verdana", Arial, "Arial Black", serif; color: #333333; font-size: 9px; font-weight: bold; text-align: center; line-height: 14px;}/* pied de page de 9 pixels */
p {font-family: "Verdana", Arial, "Arial Black", serif; color: #333333; font-size: 12px; font-weight: normal; line-height: 15px;text-align: left;/* Paragraphes de 12 pixels */}
a { text-decoration:none; color:#333333; line-height: 14px;}


#body
{
   margin-top: 0;
   background-color:#CCCCCC;
   background-image: url("images/fond_job.jpg");
   background-repeat:no-repeat;
 }

#boite
{
     position: relative; /* on positionne le conteneur */
     margin-left: auto;
     margin-right: auto;
	 margin-top: 0;
     width: 996px;
     text-align: left;
	 border: 0px solid #000;
	 height: 1100px;
	 background-image: url("images/shadow.gif"); 
	 z-index: 0;
 }

#conteneur
{
     position: relative; /* on positionne le conteneur */
     margin-left: 10px;
     margin-right: auto;
	 margin-top: 0;
     width: 976px;
     text-align: left;
	 border: 0px solid #000;
	 height: 1100px;
	 background-color:#999999;
	 border-bottom: 1px solid #666666;
	 z-index: 10;
 }

/* L'en-tête, le logo*/
#logojob
{
   width: 306px;
   height: 95px;
   position: absolute;
   top: 0px;
   left: 10px;
   border: 0px;
   background-image: url("images/logojob.jpg");
}
   /* zones cliquables */
   .zone1 { /* zone cliquable */
	float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
	width : 73px;
	height: 20px;
	margin-left: 0px;
	margin-top: 72px;
	border: 0px dotted black; /* ajouté pour visualiser la zone*/
}
	.zone2 { /* zone cliquable */
	float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
	width : 75px;
	height: 20px;
	margin-left: 0px;
	margin-top: 72px;
	border: 0px dotted black; /* ajouté pour visualiser la zone*/
}
	.zone3 { /* zone cliquable */
	float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
	width : 82px;
	height: 20px;
	margin-left: 0px;
	margin-top: 72px;
	border: 0px dotted black; /* ajouté pour visualiser la zone*/
}
	.zone4 { /* zone cliquable */
	float: left; /* permet de donner une dimension à la balise a qui est une balise en ligne */
	width : 74px;
	height: 20px;
	margin-left: 0px;
	margin-top: 72px;
	border: 0px dotted black; /* ajouté pour visualiser la zone*/
}

#anim
{
   width: 375px;
   height: 95px;
   position: absolute;
   top: 0px;
   left: 315px;
}
/* L'en-tête, liaison vers le site meetinggame */
#retrouvez
{
   width: 264px;
   height: 95px;
   position: absolute;
   left: 702px;
   top: 0px;
}

/* Le menu */

#menu {
	margin:0px; 
	font:11px Verdana,Arial;
	text-align: center;
	position: absolute;
	width: 954px;
	top: 102px;
	left: 11px;
	height:21px;
	z-index:10;
	background:#eee}
	
ul.menu {list-style:none; margin:0; padding:0}
ul.menu * {margin:0; padding:0}
ul.menu a {display:block; color:#FFFFFF; text-decoration:none}
ul.menu li {position:relative; float:left; margin-right:0px}
ul.menu ul {position:absolute; top:22px; left:0; background:#d1d1d1; display:none; opacity:0; list-style:none}
ul.menu ul li {position:relative; border:1px solid #aaa; border-top:none; width:158px; margin:0}
ul.menu ul li a {display:block; padding:4px 0px 4px;font:10px Verdana,Arial; background-color:#78A1C4}
ul.menu ul li a:hover {background-color:#5C809A}
ul.menu ul ul {left:149px; top:0px}
ul.menu .menulink {border:1px solid #999999; padding:4px 4px 3px; font-weight:bold; background:url(images/menujobf.jpg); width:149px}
ul.menu .menulink:hover, ul.menu .menuhover {background:url(images/menujobc.jpg)}
ul.menu .sub {background:#d1d1d1 url(images/arrow.gif) 149px 0px no-repeat}
ul.menu .topline {border-top:0px solid #aaa}

/* l'article */

#article
{
   	width: 671px;
   	height: 906px;
   	position: absolute;
   	top: 132px;
    left: 10px;
   	padding-top:0px;
   	padding-bottom:5px;
   	padding-right:5px;
   	padding-left:7px;
   	background-color: #FFFFFF;
    border-width: 1px;
	border-style: solid;
	border-color: #666666;	
	z-index: 0;
}
	  /* Les sites */
#site_a
{
position: absolute;
top: 140px;
text-decoration:none;
display:block;
background-image: url("images/logo_anpe_fr.gif");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 10px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}
#site_b
{
position: absolute;
top: 140px;
text-decoration:none;
display:block;
background-image: url("images/logo_apec.png");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 347px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}
#site_c
{
position: absolute;
top: 327px;
text-decoration:none;
display:block;
background-image: url("images/logo_cadremploi.jpg");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 10px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}
#site_d
{
position: absolute;
top: 327px;
text-decoration:none;
display:block;
background-image: url("images/logo_monster.jpg");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 347px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}
#site_e
{
position: absolute;
top: 514px;
text-decoration:none;
display:block;
background-image: url("images/logo_viadeo.gif");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 10px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}

#site_f
{
position: absolute;
top: 514px;
text-decoration:none;
display:block;
background-image: url("images/logo_regionsjob.jpg");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 347px;
padding-left: 10px;
padding-botton: 0px;
padding-top: 100px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}

#site_g
{
position: absolute;
top: 701px;
text-decoration:none;
display:block;
background-image: url("images/logo_option.gif");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 10px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}
#site_h
{
position: absolute;
top: 701px;
text-decoration:none;
display:block;
background-image: url("images/logo_keljob.gif");
background-repeat:no-repeat;
width: 315px;
height: 75px;
left: 347px;
padding-top: 100px;
padding-botton: 0px;
padding-left: 10px;
border-width: 1px;
border-style: solid;
border-color: #999999;
}


/* première pub */
#pubtop
{
	width: 260px;
   	height: 280px;
  	position: absolute;
    left:705px;
    top: 132px;
    background-color: #FFFFFF;
    border-width: 1px;
	border-style: solid;
	border-color: #666666;	
	z-index: 0;
}

/* pub Fnac */
#fnac
{
   	width: 260px;
   	height: 220px;
   	position: absolute;
   	left:705px;
   	top: 422px;
    border-width: 1px;
	border-style: solid;
	border-color: #666666;	
}
/* troisième pub */
#pubmilieu
{
   	width: 260px;
   	height: 180px;
   	position: absolute;
   	left: 705px;
   	top: 653px;
	background-color: #FFFFFF;
    border-width: 1px;
	border-style: solid;
	border-color: #666666;	
}
/* quatrième pub */
#pubbas
{
   	width: 260px;
   	height: 200px;
   	position: absolute;
   	left: 705px;
   	top: 843px;
	background-color: #FFFFFF;
    border-width: 1px;
	border-style: solid;
	border-color: #666666;	
}

/* le pied de page */
#pied_de_page
{
   width: 950px;
   height: 30px;
   position: absolute;
   top: 1060px;
   padding: 5px;
   text-align: center;
   border: 0px solid black;
}
#pied_de_page h1
{
   text-align: center; /* Pour centrer le titre */
}