/* CSS Document */

/* CSS Document */
/*###################################################
# CSS de SAS Champion créé par Sébastien LANGOUREAUX
#####################################################*/

/*###################################################
# Les calques en div
#####################################################*/

body { margin: 0; padding: 0; background-color:#6699ff; color: #fff; font: 1.0em "Times New Roman",Times,Arial,Tahoma,serif; text-align:left; overflow:visible; }

/*
#####################################################
# Création des calque fixe
#####################################################
*/

#page { position:absolute; width: 100%; margin: 0px 0px 0px 0px; top:0; left:-1px; overflow:visible; min-width:770px;  }

#ban { margin: 0; padding: 0; width: 100%; overflow:visible; }

#titre_page { margin:0; padding:0; width:100%; overflow:visible; z-index:1; } 

#sous-menu { margin:0; padding:0; overflow:visible;  z-index:1; } 

#resume { margin: 0; padding: 0; width: 100%; overflow:visible; z-index:1;  }

#corp { margin: 0; padding: 0; width: 100%; overflow:visible; z-index:1;  }

#page_bas { margin:0; padding:0; width: 100%; overflow:visible;   z-index:1;}

#menu_bas { margin: 0; padding: 0; width: 100%; overflow:visible; z-index:1; }

/*
#######################################################
# Déninition général
#######################################################
*/

img { border: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0;  }
p { margin: 0; padding: 0; }
input, select, textarea { margin: 0; padding: 0; }
a { margin: 0; padding: 0; text-decoration: none; }
a, a:link, a:visited { color: #000; text-decoration:none; }
a:hover { color: #f00; text-decoration: none; }

/*
########################################################
# Bannière
#######################################################
*/


#ban {
position:absolute;
top:0px;
left:0px;
background-color:#000000;
text-align: left;
z-index:1;
height:80px;
min-width:770px;
}

#ban h1 {
color:#FFFFFF;
font-size:0.0em;
text-align:center;
display:block;
}

#ban_titre {
position:absolute;
left:10.39%;
top:0px;
font-size:2.0em;
color:#3366ff;
font-weight:bolder;
font-family:Arial, Helvetica, sans-serif;
z-index:2; 
}

#ban_img {
position:absolute;
background-image:url(image/ban1.jpg);
width:72px;
height:80px;
top:0px;
left:0px;
z-index:1;
}

#ban_img_logo {
background-image:url(image/logo.gif);
background-repeat:no-repeat;
position:relative;
width:571px;
height:80px;
margin-left:auto;
margin-right:auto;
z-index:1;
}

#ban_slogan {
position:absolute;
left:44.15%;
top:45px;
font-size:1.2em;
color:#FFFFFF;
font-style:italic;
font-weight:bold;
z-index:2;
}

#ban_langue {
position:absolute;
right:0px;
top:0px; 
font-size: 0.9em;
font-weight:bold;
word-spacing:5px;
background-image:url(image/ban2.jpg);
width:191px;
text-align:center;
z-index:2;
}
#ban_langue a, #ban_langue a:link, #ban_langue a:visited {
color:#CCCCCC;
}

#ban_langue a:hover {
color: #FF0000;
text-decoration: none;
}


#ban_menu a, #ban_menu a:link, #ban_menu a:visited {
color: #ffffff;
text-decoration: none;
}

#ban_menu a:hover {
color: #FF0000;
text-decoration: none;
}

/*######################################"
  # Le menu
  ######################################*/

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}

#menu_couleur {
position:absolute;
top:80px;
width:100%;
height:25px;
background-color:#0099FF;
min-width:770px;
z-index:4;
}

#menu_centrer {
position:relative;
margin-left:auto;
margin-right:auto;
width:770px;
z-index:4;
}

#menu {
position:absolute; /* placement du menu, à modifier selon vos besoins */
z-index:100;
width: 770px; /* correction pour Opera */
margin-left:auto;
margin-right:auto;
}

#menu a, #menu a:link, #menu a:visited, #menu a:hover {
text-decoration: none;
}

#menu dl {
float: left;
background-color:#0099FF;

}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
border: 1px solid gray;
margin: 1px;
color:#FFFFFF;

}
#menu dd {
display: none;
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu dt a {
color:#FFFFFF;
}
#menu li a  {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu dt a:hover, #menu dt a:focus {
color:#FFFFFF;
}
#menu li a:hover, #menu li a:focus  {
background: #eee;
}



/*
###########################################################
# Index
###########################################################
*/
#index_haut {
position:absolute;
top:105px;
left:0px;
width:100%;
height:460px;
min-width:770px;
background-color:#33ccff;
z-index:1;
}

#index {
position:relative;
/*min-width:770px;*/
width:770px;
height:550px;
margin-left:auto;
margin-right:auto;
background-image:url(image/font_index.jpg);
background-repeat:no-repeat;
z-index:3;
}

#index_texte1 {
position:absolute;
top:10px;
left:10px;
font-size:1.3em;
color:#FFFFFF;
font-weight:bold;
z-index:3;
}

#index_texte_agri {
position:absolute;
top:60px;
left:260px;
font-size:1.2em;
color:#1919B3;
font-style:italic;
font-weight:bold;
}

#index_texte_fer {
position:absolute;
top:140px;
left:465px;
font-size:1.2em;
color:#1919B3;
font-style:italic;
font-weight:bold;
}

#index_texte_ind {
position:absolute;
top:220px;
left:650px;
font-size:1.2em;
color:#1919B3;
font-style:italic;
font-weight:bold;
}

#index_texte2 {
position:absolute;
top:320px;
left:80px;
font-size:1.3em;
color:#FFFFFF;
font-weight:bold;
font-style:italic;
} 

#index_texte3 {
position:absolute;
top:290px;
left:750px;
font-size:1.2em;
color:#1919B3;
font-style:italic;
font-weight:bold;
}

#index_texte4 {
position:absolute;
top:400px;
left:250px;
font-size:1.4em;
color:#1E79E8;
letter-spacing:3px;
font-weight:bolder;
}

#index_image_agri{
position:absolute;
left:70px;
top:60px;
border-style:inset;
border-width:2px; 
text-align:left; 
width:138px;
z-index:104;
}

#index_image_fer {
position:absolute;
top:140px;
left:340px;
border-style:inset;
border-width:2px;
text-align:left; 
width:100px;
}

#index_image_ind {
position:absolute;
top:220px;
left:530px;
border-style:inset;
border-width:2px;
width:90px;
}


#corp_index {
position:absolute;
top:565px;
left:0px;
width:100%;
height:65px;
background-color:#33ccff;
min-width:770px;
text-align:left;
z-index:1;
}

#corp_index_selection {
position:relative;
margin-left:auto;
margin-right:auto;
width:770px;
}

/* menu du milieu de la page d'index*/
#corp_index_selection li {
display:block;
width:154px;
height:30px;
vertical-align:middle;
text-align:center;
float:left;
overflow:hidden;
background-color:#33ccff;
}

#corp_index_selection a:link, #corp_index_selection a:visited {
text-decoration:underline;
color:#1919B3;
font-size:1.2em;
font-style:italic;
}

#corp_index_selection a:hover {
color:#1E79E8;
}

#corp_index_selection h2 {
color:#000000;
font-weight:bold;
font-size:0.9em;
padding-top:3px;
padding-left:10px;
}

#index_slogan {
position:absolute;
top:630px;
left:0px;
width:100%;
height:75px;
background-color:#33ccff;
min-width:770px;
z-index:40;
}

#index_slogan_centrer {
position:relative;
margin-left:auto;
margin-right:auto;
width:770px;
height:50px;
background-image:url(image/clera.jpg);
background-repeat:no-repeat;
border-style:inset;
border-width:2px;
}

#index_ban_bas {
position:absolute;
top:635px;
left:0px;
width:100%;
height:40px;
}

#page_bas_texte1 {
 margin-left:45px;
 font-size:1.2em;
 font-weight:bolder;
 font-style:italic;
 float:left;
}

#page_bas_texte2 { 
 margin-top:10px;
 font-size:1.1em;
 font-weight:bold;
 font-style:italic;
 float:left;
}

#page_bas_texte3 {
 margin-top:23px;
 margin-bottom:6px;
 color:#FFFFFF;
 font-size:1.1em;
 font-weight:bold;
 font-style:italic;
}



/*
########################################
# Activité
########################################
*/

/*Titre de la page*/

#titre_parent {
position:absolute;
top:100px;
left:0px;
width:100%;
min-width:770px;
height:60px;
background-image:url(image/titre_font.jpg);
background-repeat:repeat;
z-index:1;
border-bottom-color:#0066FF;
border-bottom-style:outset;
border-bottom-width:3px;
}


#titre_fille {
position:relative;
width:400px;
height:30px;
margin-top:15px;
margin-left:auto;
margin-right:auto;
font-size:1.6em;
font-weight:bolder;
color:#0066FF;
text-align:center;
border-color:#00CCFF;
border-style:inset;
border-width:3px;
background-color:#00CCFF;
font-weight:bolder;
}

#titre_fille h2{
font-size:1.0em;
font-weight:bolder;
color:#0066FF;
text-align:center;
}

/* Corp Activité */
#activite {
position:absolute;
top:160px;
left:0;
width:100%;
min-width:770px;
background-color:#00CCFF;
}

#activite_fille {
position:relative;
width:758px;
height:630px;
margin-top:10px;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
background-image:url(image/font_ecran3.jpg);
}

#activite_foto {
position:absolute;
top:20px;
left:20px;
width:auto;
height:auto;
border-color:#0066FF;
border-style:groove;
border-width:2px;
}

#corp_act_droite {
position:absolute;
top:10px;
right:20px;
font-size:0.9em;
color:#000000;
width:290px;
}

#corp_act_bas {
position:absolute;
top:330px;
left:175px;
color:#0000FF;
width:400px;
border-color:#00CCFF;
border-style:inset;
border-width:3px;
padding: 5px 5px 5px 5px;
background-color:#00CCFF;
}


#corp_act_droite a:link, #corp_act_droite a:visited {color:#000099; font-weight:bold; }
#corp_act_droite a:hover {color:#FF0000; }

#corp_act_droite h3 {
color:#003366;
font-weight:bolder;
font-size:1.1em;
text-align:center;
}

#corp_act2 {
margin-left:20px;
width:587px;
margin-top:7px;
margin-bottom:5px;
float:left;
padding:5px 5px 5px 5px;
border-width:1px;
text-align:center;
}

#corp_act_illu {
float:left;
clear:left;
margin-top:40px;
margin-left:30px;
}

#activite_baniere_bas {
position:absolute;
top:742px;
left:0px;
width:100%;
height:40px;
}


/*
########################################
# Tonneau ébavurage
########################################
*/

#tonneau {
position:absolute;
top:160px;
left:0;
width:100%;
min-width:770px;
background-color:#00CCFF;
}


#tonneau-presentation {
position:relative;
width:770px;
height:550px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
margin-bottom:20px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
/*background-image:url(image/font_ecran6.jpg);*/
/*z-index:50;*/
text-align:center;
}


#tonneau-presentation-texte {
position:absolute;
top:350px;
left:25px;
color:#000099;
font-size:1.0em;
font-style:italic;
/*font-weight:bolder;*/
text-align:justify;
width:700px;
border-color:#00CCFF;
border-style:inset;
border-width:3px;
padding: 5px 5px 5px 5px;
background-color:#00CCFF;
}

#tonneau-presentation-bas {
 position:relative;
 margin-top:30px;
 margin-right:auto;
 margin-left:auto;
 margin-bottom:20px;
 background:url(image/ban_clera.jpg) no-repeat;
 width:770px;
 height:70px;
 border-color:#00CCFF;
 border-style:outset;
 border-width:3px;
}

#tonneau-presentation-ban {
position:absolute;
top:625px;
width:100%;
height:40px;
}


/********************************************************************
 * Tonneau ebavurage gamme                                          *
 ********************************************************************/
 
#tonneau-gamme-page {
position:absolute;
top:160px;
left:0px;
width:100%;
height:545px;
min-width:770px;
background-color:#00CCFF;
}

#tonneau-gamme-centre {
position:relative;
margin-left:auto;
margin-right:auto;
width:770px;
height:500px;
}

#tonneau-gamme-cadre-gauche {
position:absolute;
top:-10px;
left:-25px;
width:280px;
height:520px;
background-image:url(image/cadre-tonneau-gamme.jpg);
background-position:center;
border-color:#00CCFF;
}

#tonneau-gamme-cadre-droite {
position:absolute;
top:-10px;
right:-25px;
width:280px;
height:520px;
background-image:url(image/cadre-tonneau-gamme.jpg);
background-position:center;
border-color:#00CCFF;
}

#tonneau-gamme-cadre-titre {
position:relative;
margin-top:35px;
margin-left:auto;
margin-right:auto;
color:#000099;
text-align:center;
font-size:1.1em;
font-weight:bolder;
}

#tonneau-gamme-cadre-image {
position:absolute;
top:90px;
left:72px;
width:127px;
height:200px;
}

#tonneau-gamme-cadre-centre {
position:absolute;
top:24px;
left:230px;
width:310px;
height:410px;
border-color:#00CCFF;
border-style:inset;
border-width:3px;
z-index:2;
}

#tonneau-gamme-cadre-centre-gauche {
position:absolute;
width:150px;
height:400px;
top:5px;
left:5px;
border-right-color:#0000FF;
border-right-style:dotted;
border-right-width:1px;
}

#tonneau-gamme-cadre-centre-gauche H1 {
text-align:center;
color:#0000FF;
font-size:1.2em;
font-weight:bold;
}

#tonneau-gamme-cadre-centre-gauche li {
list-style-type:disc;
list-style-position:outside;
margin-left:30px;
margin-top:10px;
color:#0000FF;
}

#tonneau-gamme-cadre-centre-gauche ul {
display:block;
margin-top:40px;
}



#tonneau-gamme-cadre-centre-droite {
position:absolute;
width:150px;
height:400px;
top:5px;
left:155px;
}

#tonneau-gamme-cadre-centre-droite H1 {
text-align:center;
color:#0000FF;
font-size:1.2em;
font-weight:bold;
}

#tonneau-gamme-cadre-centre-droite li {
list-style-type:disc;
list-style-position:outside;
margin-left:30px;
margin-top:10px;
color:#0000FF;
}

#tonneau-gamme-cadre-centre-droite ul {
display:block;
margin-top:40px;
}

#tonneau-gamme-cadre-droite-texte {
position:absolute;
top:60px;
left:45px;
width:180px;
height:400px;
color:#000000;
overflow:hidden;
}

#tonneau-gamme-banniere-bas {
position:absolute;
width:100%;
height:20px;
left:0px;
top:632px;
}

/**********************************************
 * Tonneau doc
 **********************************************/
 
#tonneau-doc-page {
position:absolute;
top:160px;
left:0px;
width:100%;
min-width:770px;
height:600px;
background-color:#00CCFF;
}

#tonneau-doc-centre {
position:relative;
margin-left:auto;
margin-right:auto;
margin-top:30px;
width:600px;
height:590px;
font-size:1.3em;
}

#tonneau-doc-banniere-bas {
position:absolute;
width:100%;
height:20px;
left:0px;
top:690px;
}

/****************************************
 * Plan d'accès
 ****************************************/
 
#plan-acces-page {
position:absolute;
min-width:770px;
width:100%;
height:564px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#plan-acces-centre {
position:relative;
margin-top:50px;
width:770px;
height:433px;
margin-left:auto;
margin-right:auto;
background-image:url(image/font_ecran4.jpg);
border-color:#00CCFF;
border-style:inset;
border-width:4px;
}

#plan-acces-image {
position:absolute;
top:0px;
left:0px;
width:400px;
height:328px;
}

#plan-acces-texte {
position:absolute;
top:0px;
left:420px;
width:350px;
color:#FFFFFF;
font-size:1em;
}

#plan-acces-banniere-bas {
position:absolute;
width:100%;
height:20px;
left:0px;
top:632px;
}

/******************************************************************************
 * Parc Machine
 ******************************************************************************/
#parc-machine-page {
position:absolute;
min-width:770px;
width:100%;
height:562px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#parc-machine-centre {
position:relative;
margin-top:50px;
width:770px;
height:433px;;
margin-left:auto;
margin-right:auto;
background-image:url(image/font_ecran6.jpg);
border-color:#00CCFF;
border-style:inset;
border-width:4px;
}

#parc-machine-text {
position:absolute;
top:20px;
left:20px;
color:#0000FF;
font-size:1.0em;
}

#parc-machine-text a, a:link {
color:#0000FF;
text-decoration:underline;
}

#parc-machine-text a:hover {
color:#FF0000;
}

#parc-machine-text h3{
color:#000000;
font-weight:bolder;
font-size:1.2em;
margin-left:40px;
display:block;
margin-bottom:15px;
font-weight:bold;
}

#parc-machine-text h3 a, #parc-machine-text h3 a:link{
color:#000000;
}

#parc-machine-text h3 a:hover {
color:#FF0000;
}

#parc-machine-text ul {
margin-left:10px;
}

#parc-machine-text li {
list-style:disc;
margin-left:20px;
}

#parc-machine-image {
position:absolute;
right:10px;
top:10px;
border-color:#00FFFF;
border-style:outset;
border-width:2px;
width:auto;
height:auto;
}

#parc-machine-banniere-bas {
position:absolute;
top:650px;
left:0px;
width:100%;
height:20px;
}

/********************************************************************
 * Présentation de l'entreprise
 ********************************************************************/
#entreprise-page {
position:absolute;
min-width:770px;
width:100%;
height:640px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#entreprise-centre {
position:relative;
margin-top:50px;
width:760px;
height:538px;;
margin-left:auto;
margin-right:auto;
background-image:url(image/font_entreprise.jpg);
background-repeat:no-repeat;
border-color:#00CCFF;
border-style:inset;
border-width:4px;
color:#000000;
padding:5px 5px 5px 5px;
}

#entreprise-centre h3 {
position:absolute;
display:block;
top:230px;
left:80px;
color:#0000FF;
font-size:1.2em;
font-weight:bolder;
}

#entreprise-centre li {
color:#003399;
font-size:1.0em;
list-style-image:url(image/puce.gif);
margin-left:40px;
margin-top:15px;
}

#entreprise-banniere-bas {
position:absolute;
top:720px;
left:0px;
width:100%;
height:20px;
}

/************************************************
 * Offres d'emploi
 ************************************************/

#emploi-page {
position:absolute;
min-width:770px;
width:100%;
height:620px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#emploi-centre {
	position:relative;
	margin-top:50px;
	width:770px;
	height:504px;
	margin-left:auto;
	margin-right:auto;
	background-image:url(image/font-emploi.jpg);
	background-repeat:repeat-y;
	border-color:#00CCFF;
	border-style:inset;
	border-width:4px;
	color:#000000;
	overflow:scroll;
	background-color: #FF0000;
}

#emploi-centre a:visited {
color:#000000;
text-decoration:underline;
}

#emploi-banniere-bas {
position:absolute;
top:690px;
left:0px;
width:100%;
height:20px;
}

/******************************************************
 * Espace client
 ******************************************************/
 
#client-page {
position:absolute;
min-width:770px;
width:100%;
height:520px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#client-centre {
	position:relative;
	margin-top:50px;
	width:770px;
	height:400px;
	margin-left:auto;
	margin-right:auto;
	background-image:url(image/font_client.jpg);
	background-repeat:no-repeat;
	border-color:#00CCFF;
	border-style:inset;
	border-width:4px;
	color:#000000;
}

#client_auth {
position:relative;
top:185px;
left:10px;
color:#000033;
font-size:1.0em;
font-weight:bold;
}

#client-banniere-bas {
position:absolute;
top:592px;
left:0px;
width:100%;
height:20px;
}


/******************************************************************
 * Contacts
 ******************************************************************/

#contacts-page {
position:absolute;
min-width:770px;
width:100%;
height:710px;
background-color:#00CCFF;
top:160px;
left:0px;
}

#contacts-centre {
	position:relative;
	margin-top:50px;
	width:770px;
	height:620px;
	margin-left:auto;
	margin-right:auto;
	background-image:url(image/font_contact.jpg);
	background-repeat:no-repeat;
	border-color:#00CCFF;
	border-style:inset;
	border-width:4px;
	color:#000000;
}

#contact-christian {
position:absolute;
top:5px;
left:250px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-alain {
position:absolute;
top:130px;
left:80px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-gerard {
position:absolute;
top:130px;
right:80px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-celine {
position:absolute;
top:255px;
left:5px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-aurore {
position:absolute;
top:255px;
right:5px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-josette {
position:absolute;
top:380px;
left:80px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-beatrice {
position:absolute;
top:380px;
right:80px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}

#contact-michel {
position:absolute;
top:505px;
left:250px;
width:296px;
height:100px;
border-color:#00CCFF;
border-style:outset;
border-width:3px;
color:#FFFFFF;
}



#contact_banniere_bas {
position:absolute;
top:792px;
left:0px;
width:100%;
height:20px;
}

/*
##############################################################
# Menu_bas
##############################################################
*/

#menu_bas {
 position:absolute;
 top:70px;
 width:100%;
 height:20px;
 background-color:#000000;
 border-color:#CCCCCC;
 border-top-style:ridge;
 border-width:2px;
 font-size:0.8em;
 letter-spacing:2px;
 color:#FFFFFF;
 word-spacing:2px;
}

#menu_bas_centrer {
 position:relative;
 margin-top:2px;
 width:736px;
 min-width:770px;
 margin-left:auto;
 margin-right:auto;
}

#menu_bas_gauche {
 position:absolute;
 left:0px;
 width:350px;
}

#menu_bas_droite {
 position:absolute;
 right:0px;
 width:488px;
}
 
 
#menu_bas a:link, #menu_bas a:visited { color:#FFFFFF; text-decoration:none; }
#menu_bas a:hover { color:#FFFFFF; text-decoration:underline; }