/*------------ MISE EN PAGE ----------------------------------------*/
  
   /* @section browser reset */
 * { margin:0; padding: 0 }

 /** bugs in IE 5.x and IE 6 */
  * html body * { overflow:visible; }
  * html iframe, * html frame { overflow:auto; }
  * html frameset { overflow:hidden; }

  /* Forcing vertical scrollbars in Netscape, Firefox and Safari browsers 
  html { height: 100%; margin-bottom: 1px; }*/
  body {
    /* Fix for rounding errors when scaling font sizes in older versions of Opera browser */ 
	font-size: 100.01%;
    /* (en) Standard values for colors and text alignment */
    color: #000;
    background: #fff;
    text-align: left;
  }

  /* Clear borders for <fieldset> and <img> elements */
  fieldset, img { border: 0 solid; }

  /* new standard values for lists, blockquote and cite */
  ul, ol, dl { margin: 0 0 1em 1em }
  li { margin-left: 1.5em; line-height: 1.5em; }

  dt { font-weight: bold; }
  dd { margin: 0 0 1em 2em; }

  blockquote { margin: 0 0 1em 1.5em; }

  /* @section hidden elements |*/

  .skip, .hideme, .print {
    position: absolute;
    top: -1000em;
    left: -1000em;
    height: 1px;
    width: 1px;
  }

  /*------------ EN PLUS ----------------------------------------*/

#main {
width:965px;
margin:0 auto;
}



#centreur {
position: relative;
top:180px;
left:150px;
width:10px; 
height:10px;
z-index:99;
    }
   
#transparent {
position: absolute;
left:-250px;
top:-250px;
width:400px;
height:400px;
z-index:98;
padding:0;
background-color:transparent;
}




.animationContainer{
	height: 300px;
}
.hideInitially{
	visibility: hidden;
}

#musique {
position:fixed;
bottom:0px;
right:0px;
width:90px; 
height:20px;
margin:0;
padding:0;
z-index:99;
}

/*---- CSS du plan de site retractable : typographie ---- */
#plan {
text-align:center;
margin: 0 auto;
width:100%;
padding: 0 0 500px 0;
}

.plan1 {
margin:0;
width:250px;
float:left;
text-align:left;
padding:5px;
font-size:9px;
border-right:1px solid #F0F0F0;
border-left:1px solid #F0F0F0;
}

#plan a,
#plan a:visited {color:#999999; text-decoration:none;}
#plan a:focus,
#plan a:hover,
#plan a:active {background-color:transparent; color:#DF37CC; text-decoration:underline;}

/*---- CSS du moteur de recherche du plan de site ---- */

.bouton_recherche {	
border: dotted thin #999999; 
padding: 6px 4px 4px 4px;
background-color:#F5F5F5;
font-weight:bold;
color:#666666;
margin:0px;
}

.bouton_recherche:hover {
border: solid thin #000;	
background-color:#FFFFFF;
color:#000;

}

#q{	border: dotted thin #999999;
	background: #eee url(images/search.gif) no-repeat 0px center;
	padding: 6px 0 4px 18px;
	width: 150px;
	font-size:14px;}
#q:focus {background: #fff url(images/search.gif) no-repeat 0px center;}

/*---- CSS du moteur de recherche de portrait ---- */

.recherche_entreprise {
font-size:10px;
background: url(images/recherche_entreprise.jpg) no-repeat 0px center;
width:200px;
height:110px;
/* float:right;*/
}

.recherche_entreprise form {
display:block;
padding:34px 0 0 12px;
}

.bouton_recherche_entreprise {	
background: url(images/rouage.jpg) no-repeat 0px center;
background-color:transparent;
padding: 4px 3px 3px 3px;
margin:0px;
width:30px;
border: none;
}

.bouton_recherche_entreprise:hover {
background-color:black;	
background: url(images/rouage.gif) no-repeat 0px center;


}

#q_entreprise{	border: none;
margin:0;
	padding: 3px 0 0 0;
	width: 145px;
	font-size:10px;
	background-color:transparent;
	}
	
/* #q_entreprise:focus {background-color: #CCC;} */


/*------------ CSS des formulaires d'envoi d'email ----------------------------------------*/


.formulario {
	background-color:#ffffff;
	border: 0px solid silver;
	font-size:90%;
	margin-top:.9em;
	color:#000000;
}

.formulario  label{
	display:block;
	clear:both;
	color:#663399;
	margin-top:15px;

	width: 95%;
}


.formulario p {
	color:#000;
	line-height:normal;
	width: 95%;
	margin:0;
}


	
.campos {
	width: 95%;
	font-size:90%;
	padding-left: 2px;
	padding-right: 2px;
	padding-top:2px;
	padding-bottom:2px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#000000;
	margin-bottom:0;
	border:none;
	clear:both;
	background: url(images/fond_plan.jpg) top center repeat-x ;
}

.campos:focus {
background: none;
background-color:#F9E8F4;
}

.filet{
	width: 95%;
	padding: 0;
	margin:0;
	border:none;
height:85px;	
	background: url(images/formulairebas.jpg) no-repeat top center;

}
	
.monbouton {
float:right;
height:50px;
width:100px;
	padding: 0px;
	margin:1px 0;
	font-size:0;
	color: #fff;
	border:none;
	background: transparent url(images/bouton_envoyer.gif) no-repeat top center;
	
}

.monbouton:hover {
	background: transparent url(images/bouton_envoyer_hover.gif) no-repeat top center;
	
}




/*------------ CSS du plan de site retractable : layout ----------------------------------------*/

.CollapsiblePanel {
	text-align:center;
}

.CollapsiblePanelTab h4 {
color:#DDDDDD;
font-variant:small-caps;
}

.CollapsiblePanelOpen H4{
color:#333333;
}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
.CollapsiblePanelTab {
color: #CCCCCC;
font-weight:lighter;
margin: 0px;
padding: 2px;
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px 0 15px 0;
	padding: 6px;
	/*border:solid 1px #CCC;*/
	background-position: center top;
	background-repeat:repeat-x;
	background-image: url(images/fond_plan.jpg);
	height:100% !important;
}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	color: #CCCCCC;
	text-decoration: none;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
	background-color: #E8E8E8;
	color: #666;
	font-weight:bold;
	border-bottom: solid 1px #CCC;

}

/* This is an example of how to change the appearance of the panel tab when the
 * CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed
 * whenever the CollapsiblePanel is closed.
 */

.CollapsiblePanelClosed .CollapsiblePanelTab {
 /* background-color: #EFEFEF */
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	/*background-color: #CCC;*/
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	background-color: #E8E8E8;
	color: #666;
}


 /*------------   mise en page par table -----------------*/


#table1 {
width:965px;
	border:0;
	margin: 0 auto;
	padding:0;
	border-collapse:collapse;
	vertical-align:top;
}

#tablebas
{
width:965px;
	border:0;
	margin: 0;
	padding:0;
	border-collapse:collapse;
	vertical-align:top;
}

#table1, #tablebas img{
border:0;
margin: 0;
padding:0;
}


#table1 td, table1 tr, #tablebas td, #tablebas tr {
	padding:0;
	margin:0;
	border-collapse:collapse;
	vertical-align:top;
}

#colonnegauche {
	background-color: white;
	margin:0;
	padding: 0;
	background-position: center top;
	background-repeat:repeat-y;
	background-image: url(images/fond_gauche.jpg);
	}
	
#colonnedroite {
	background-color: white;
	margin:0;
	padding: 0;
	background-position: center top;
	background-repeat:repeat-y;
	background-image: url(./images/fond_droit.jpg);
}

 /*------------   contenus -----------------*/


#contenu {
	margin-right: auto;
	margin-left: auto;

	line-height: 1.3em;
	width: 400px;
	padding: 0px;
	
	}
	
	
	
#contenu .titrerubrique {
	margin-right: auto;
	margin-left: auto;
	width: 400px;
}

#contenu .outils {
	text-align:right;
}
	



#texte {
		margin-top: 100px;
		padding: 15px 20px 15px 15px;
		position: relative;
		left: 5px;
		margin-left: 150px;
		width: 470px;
		line-height: 1.2em;
		font-size: 1em;
		font-family: "Lucida Grande", Verdana, Arial, sans-serif;
	}
	
	
	#texte H2 {
		
		font-size: 2em;
	}

#fond {
		text-align: center;
		background-repeat: no-repeat;
		margin-right: auto;
		margin-left: auto;
		padding: 0px;
		height: 450px;
		background-position: center top;
		width: 100%;
		background-image: url(#CHEMIN{images/bas.jpg});
		}
		
 /*------------   email de rencontre -----------------*/

#formumail input{

border:thin #6633CC dotted;
color:#fff;
background-color:#6600CC;
}


	
 /*------------   videos -----------------*/
	

/*          HACK IE 6                         */

* html #video {
	margin:0;
	padding:28px 0 0 35px;
	height:180px;
	}
	
/*          HACK IE 6                         */

#video {
	margin:0;
	padding:28px 0 0 35px;
	height:180px;
	}
	
	
#video_conteneur {
	background-image:url(images/actu2_06.jpg); 
	background-repeat:no-repeat; 
	background-position:top; 
	width:338px; 
	height:280px;
	
	}
	
	
.video_texte{
	width:215px;
	padding:10px 0 0 35px;
	text-align:center;
	}
	
	 /*------------   region -----------------*/
	 
#video2 {
	padding:2px;
	float:left;
	}
	
#region{
	display:block;
		margin:0;
		padding:145px 0pt 0pt;
		text-align:center;
}

  /*------------   actus  -----------------*/

 .actusdroite{
display:block;
margin:7em  0 0 3em;
}

.actusdroite ul li{
list-style-type:none;
margin:0;
}

/*---- CSS du moteur de recherche actus ---- */

.recherche_actus {
font-size:10px;
background: url(images/recherche_actus.jpg) no-repeat 0px center;
width:230px;
height:50px;
/* float:right;*/
}

.recherche_actus form {
display:block;
padding:15px 0pt 0pt 13px;
clear:both;
}

.bouton_recherche_actus {	
background: url(images/rouage.jpg) no-repeat 0px center;
background-color:transparent;
padding: 4px 3px 3px 3px;
margin:0px;
width:30px;
border: none;
}

.bouton_recherche_actus:hover {
background-color:black;	
background: url(images/rouage.gif) no-repeat 0px center;


}

.recherche_actus strong {
font-size:12px;

float:right;
}

#q_actus{	border: none;
margin:0;
	padding: 1px 0 0 0;
	width: 145px;
	font-size:10px;
	background-color:transparent;
	}

/*---- CSS du moteur de recherche actus nouveaux 2 ---- */

.recherche_actus2 {
font-size:10px;
background: url(images/recherche_actus.jpg) no-repeat 0px center;
width:100%;
height:50px;
margin-left:30px;
/* float:right;*/
}

.recherche_actus2 form {
display:block;
padding:15px 0pt 0pt 13px;
clear:both;
}

.bouton_recherche_actus2 {	
background: url(images/rouage.jpg) no-repeat 0px center;
background-color:transparent;
padding: 4px 3px 3px 3px;
margin:0px;
width:30px;
border: none;
}

.bouton_recherche_actus2:hover {
background-color:black;	
background: url(images/rouage.gif) no-repeat 0px center;


}

.recherche_actus2 strong {
font-size:12px;
float:right;
margin:5px 50px 0 0;
}

/*---- CSS du moteur de recherche actus nouveaux 3 ---- */



.recherche_actus3 {
font-size:10px;
background: url(images/recherche_actus.jpg) no-repeat 0px center;
width:100%;
height:50px;
margin-left:0;
/* float:right;*/
}

.recherche_actus3 form {
display:block;
padding:15px 0pt 0pt 13px;
clear:both;
}

.bouton_recherche_actus3 {	
background: url(images/rouage.jpg) no-repeat 0px center;
background-color:transparent;
padding: 4px 3px 3px 3px;
margin:0px;
width:30px;
border: none;
}

.bouton_recherche_actus3:hover {
background-color:black;	
background: url(images/rouage.gif) no-repeat 0px center;


}

.recherche_actus3 strong {
font-size:12px;
float:right;
margin:0;
}


 
 /*------------   actus : date dans la gelule -----------------*/

.gelule {
display:block;
line-height:10px;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
width:35px;
height:45px;
text-align:center;
margin:0;
padding:4px 2px;
background-image:url(images/date.gif); 
background-repeat:no-repeat; 
float:left; 
font-weight:bold;
}

.gelule_date{
display:block;
color:#fff;	
 }
 

 
/*------------   liste entreprise qui recrute -----------------*/

#recrute { 
margin:5px;
line-height:1em;
}

#recrute p{ 
margin:0px;
}

 #recrute li{ 
list-style-type:none; 
border:3px dashed #CCCCCC; 
padding:12px;
margin:0 0 15px 0;
}
 
#recrute h3 a{
color:#2AB003;
font-weight:bold;
font-variant:small-caps;
font-size:0.8em;
text-decoration:none;
}

#recrute h3 a:hover{
color:#9B0CB3;
background-color:#FFF;
}

#recrute a{
color:#000;
font-weight:normal;
text-decoration:underline;
}

#recrute a:hover{
color:#9B0CB3;
background-color:#FFF;
}

#recrute strong {
display:block;
color:#000;
font-weight:bold;	
}

#recrute span {
display:inline;
color:#9B0CB3;
font-weight:bold;	
}

#recrute small {
display:inline;
color:#CCCCCC;	
}

  /*------------ video wall ----------------------------------------*/


#big-tv {
background-color:transparent; 
position:absolute;
margin:0; 
top:100px; 
left:auto; 
right:auto;
background-image:url(images/television_big.gif);
background-position:top left;
background-repeat:no-repeat;
width:580px;
height:450px;
padding:22px 0 0 70px;
}

#video_conteneur2 {
	background-image:url(images/fonddroit_sanstv.jpg); 
	background-repeat:no-repeat; 
	background-position:top; 
	width:338px; 
	height:350px;
	margin:0; 
	}

  /*------------ sagas ----------------------------------------*/
	
	
.sagadiv {
	float:right; 
	height:150px; 
	width:218px; 
	margin-right:2px; 
	margin-top:62px; 
	padding:0
}

a.sagalien {
	float:left;
	height:35px; 
	width:50px; 
	margin:2px; 
	border:1px solid gray; 
	padding:5px; 
	background-color:#666; 
	color:#FFF;
}

a:hover.sagalien {
	float:left;
	height:35px; 
	width:50px; 
	margin:2px; 
	border:1px solid gray; 
	padding:5px; 
	background-color:#DF37CC; 
	color:#FFF;
	text-decoration:none;
}
	
/*------------ page portrait ----------------------------------------*/
	


.logo_portrait1 {
display:block;
width:210px;
height:210px;
float:left;
margin:0;
padding:0;
text-align:center;
background:url(images/portrait_cadre1.jpg) center top no-repeat;
}

.logo_portrait2 {
display:block;
width:210px;
height:210px;
float:left;
margin:0;
padding:0;
text-align:center;
background:url(images/portrait_cadre2.jpg) center top no-repeat;
}

.logo_portrait3 {
display:block;
width:210px;
height:210px;
float:left;
margin:0;
padding:0;
text-align:center;
background:url(images/portrait_cadre3.jpg) center top no-repeat;
}

.logo_portrait4 {
display:block;
width:210px;
height:210px;
float:left;
margin:0;
padding:0;
text-align:center;
background:url(images/portrait_cadre4.jpg) center top no-repeat;
}

#table1 img.spip_logos{
border:0;
margin: 0;
padding:45px;
}

#table1 span.hoverportrait {
display:none;
}

.entreprises{
display:block;
margin:0 0 0 3em;
width:235px;
}

.entreprises ul li{
list-style-type:none;
margin:0;
}

.boutonstexte{display:none;}

.double_ul{
float:left; 
width:180px;
margin:0;
padding:0;
list-style-type:square;
}

#double{
width:400px;
margin:0;
padding:0 0 0 10px;
}

.encolonne {
display:block;
width:180px;
clear:right;
float:left;
margin:0;
Padding:0;
}

 
  /*------------ TYPOGRAPHIE GENRALE ----------------------------------------*/

 
 html * { font-size: 100.01% }

  /* passage en monospace */
  textarea, pre, tt, code {
	font-family:"Courier New", Courier, monospace;  	
  }

  /* taille de base 12px */
  
  body {
    font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif;
    font-size: 75.00%; 
  }

  h1,h2,h3,h4,h5,h6 { font-weight:bold; margin: 0 0 0.25em 0; color:#AC48BA;}
  h1 { font-size: 200% }                        /* 24px */
  h2 { font-size: 166.67% }                     /* 20px */
  h3 { font-size: 150% }                        /* 18px */
  h4 { font-size: 133.33% }                     /* 16px */
  h5 { font-size: 116.67% }                     /* 14px */
  h6 { font-size: 116.67%; font-style:italic }  /* 14px */

  p { line-height: 1.1em; margin: 0 0 1em 0; }

  /* listes */

  ul, ol, dl { line-height: 1.5em; margin: 0 0 1em 1em }
  li { margin-left: 1.5em; line-height: 1.5em }

  dt { font-weight: bold }
  dd { margin: 0 0 1em 2em }

  /* texte formates*/

  /* cite, blockquote { font-style:italic }
  blockquote { margin: 0 0 1em 1.5em } */
  
  blockquote.spip {
background-color:#FFFFFF;
border:1px solid #AAAAAA;
margin:6px;
padding:5px;
width:100%;
}

.spip_code {
background-color:#F9E8F4;
padding:4px;
margin:6px;
width:100%;
display:block;
}

.spip_cadre {
background-color:#EEEEEE;
border:1px solid #666666;
margin:6px;
padding:5px;
width:100%;
}

div.spip_poesie {
border-left:3px solid #999999;
margin-left:10px;
padding-left:10px;
}


  strong,b { font-weight: bold }
  em,i { font-style:italic }

  pre, code { font-family: monospace; font-size: 1.1em; }

  acronym, abbr {
    letter-spacing: .07em;
    border-bottom: .1em dashed #c00;
    cursor: help;
  }

  /* position de bases */

  .note {background: #dfd; padding: 1em; border-top: 1px #bdb dotted; border-bottom: 1px #bdb dotted;}
  .important {background: #ffd; padding: 1em; border-top: 1px #ddb dotted; border-bottom: 1px #ddb dotted;}
  .warning {background: #fdd; padding: 1em; border-top: 1px #dbb dotted; border-bottom: 1px #dbb dotted;}

  .float_left { float: left; display:inline; margin-right: 1em; margin-bottom: 0.15em;  }
  .float_right { float: right; display:inline; margin-left: 1em; margin-bottom: 0.15em;  }
  .center { text-align:center; margin: 0.5em auto }

  /*  liens */

  a , a:visited {color:#AC48BA; text-decoration:none;}
  a:focus,
  a:hover,
  a:active {color:#DF37CC; text-decoration:underline;}
  
  #topnav a { color: #aac; font-weight: bold; background:transparent; text-decoration:none; }
  #topnav a:focus,
  #topnav a:hover,
  #topnav a:active{ text-decoration:underline; background-color: transparent;}
  
  #footer a { color: #aac; background:transparent; font-weight: bold;}
  #footer a:focus,
  #footer a:hover,
  #footer a:active {color: #fff; background-color: transparent; text-decoration:underline;}

  /* Tables  */

  table { width: auto; border-collapse:collapse; margin-bottom: 0.5em; }
  table.full { width: 100%; }
  table.fixed { table-layout:fixed }

  th,td { padding: 0.5em; }
  thead th { background: #444; color: #fff }
  tbody th { background: #ccc; color: #333 }
  tbody th.sub { background: #ddd; color: #333 }

  /* divers */

  hr {
    color: #fff;
    background:transparent;
    margin: 0 0 0.5em 0;
    padding: 0 0 0.5em 0;
    border:0;
    border-bottom: 1px #000 solid;
  }