/* @override http://chickens.screenmatters.com/css/mestyles.css */

/* CSS Document */
/* This rule resets a core set of elements so that they will appear consistent across browsers. Without this rule, content styled with an h1 tag, for example, would appear in different places in Firefox and Internet Explorer because each browser has a different top margin default value. By resetting these values to 0, the elements will initially be rendered in an identical fashion and their properties can be easily defined by the designer in any subsequent rule. */
html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	}

body {
	background-color: #000000;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 14px;
	margin: 0 0 0 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	padding: 0 0 0 0; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
	text-align: center; /* Centers the page content container in IE 5 browsers. */
}

/* structure generale de la page: A conteneur et 2 div gauche  / droite*/
#mainconteneur {
	margin: 0px auto 0 auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	text-align: left; /* Redefines the text alignment defined by the body element. */
	background-image:url(../images/fond-home.jpg);
	background-repeat:no-repeat;
	width:984px;
	height:800px;
}

/* div gauche -- elemtents commun à toute les pages*/

#fondgauche{
	width:600px;
	height:800px;
	float:left;
}

#titre {
	width: 600px;
	height:105px;
	margin-top: 0px;
	float:left;
}

#corps {
	width: 545px;
	height: 505px;
	margin: 175px 0 0 20px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	float: left;
	}
	
/* viewer de la home */
#viewer {
	display:inline;	
	width:479px;
	height:381px;
	margin-left:71px;
	margin-top:315px;
	float:left;
}



/* div droite */

#fond_droit {
	width:384px;
	height:800px;
	float:left;
	margin: 0 0 0 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	padding: 0 0 0 0; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
	
}

#espaceur_droit_home {
	height:106px;
	text-align:right;
}


#espaceur_droit {
	height:70px;
	text-align:right;
}



#viewer_droit {
	margin: 10px 0 0 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	clear:left;
	height: 245px;
	width:309px;

}


#onglets .onglet 
{ 
	
	clear:left; 
  	zoom:1 /* ie */;
	background-color:#308486;
	width: 270px;
	height:150px;
	font-size: 10px;
	line-height: 18px;
	padding: 5px 38px 5px 11px;
	margin-bottom: auto;
	margin-top: 15px;
	margin-left: 50px;
	overflow:auto;
} 

#onglets li 
{
	background-image:url(../images/onglet-societe0901.png);
	margin: 15px auto auto auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left:50px;
	} 

#metiers .metier {
	
	clear:left; 
  	padding:5px; 
  	zoom:1 /* ie */;
	background-color:#9d1e3b;
	width: 270px;
	height:150px;
	font-size: 10px;
	line-height: 18px;
	padding: 5px 38px 5px 11px;
	margin-bottom: auto;
	margin-top: 15px;
	margin-left: 50px;
	overflow:auto;	
} 


#metiers li 
{
	background-image:url(../images/onglet-metier0901.png);
	margin: 15px auto auto auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left:50px;
} 


#autres .autre {
	
	clear:left; 
  	padding:5px; 
  	zoom:1 /* ie */;
	background-color:#bb8a4f;
	width: 270px;
	height:150px;
	font-size: 10px;
	line-height: 18px;
	padding: 5px 38px 5px 11px;
	margin-bottom: auto;
	margin-top: 15px;
	margin-left: 50px;
	overflow:auto;
} 


#autres li 
{
	background-image:url(../images/onglet-autre0901.png);
	margin: 15px auto auto auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left:50px;
} 



div.tabs ul 
{ 
    
  margin:0px; 
  padding:0px;
  height: 21px;
  margin-bottom: 0px;
 	
} 

div.tabs ul li {
	float:left;
	list-style-type:none;
	position:relative;
	width: 108px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight:600;
	background-repeat:no-repeat;
	text-align: center;
	letter-spacing: 1px;
	color: white;
	
}

div.tabs ul li a {

	display: block;
	text-decoration:none;
	color:#FFFFFF;
	padding: 3px 0px;
}

div.tabs ul li.over {

	opacity: 0.6;
	filter: alpha(opacity=60); /* hack opacity pour ie */
}

div.tabs li.ui-tabs-selected 
{ 

	opacity:1;
	ilter: alpha(opacity=100);/* hack opacity pour ie */
	padding: 0px 0px;
	height: 22px;

} 

.ui-tabs-hide { display: none; }


/* div des 3 images titres */
#div_img_societe {
	background-color:#308486; 
	width: 318px;
	height: 32px;
	margin: 0 0 0 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */

	
}


#div_img_metiers {
	background-color:#9d1e3b; 
	width:318px;
	height:32px;
	margin: 0 0 0 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	
}


#div_img_autre {
	background-color:#bb8a4f; 
	width:318px;
	height: 32px;
	margin: 0 0 0 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	
}


/* classe des liens */
a.section {
	color:#FFFFFF;
	text-decoration:none;
}

a.section:hover {
	color:#FFFFFF;
	text-decoration:none;
}

a.suite {
	color:#f6b900;
	text-decoration:none;
}

a.suite:hover {
	color:#f6b900;
	text-decoration:none;
}

/* gabarit 2  page societe*/


#mainconteneur_societe {
	margin: 10px auto 0 auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	text-align: left; /* Redefines the text alignment defined by the body element. */
	width: 70em;
	background-image:url(../images/fond-cigare-societe.jpg);
	background-repeat:no-repeat;
	width:984px;
	height:800px;
}



/* div conteur de gauche */
#gabarit2_soc .gab_soc {
	
	clear:left; 
  	padding: 10px 10px 0px 20px; 
  	zoom:1 /* ie */;
	background-color:#308486;
	width: 458px;
	height: 430px;
	margin: 30px 0px 0px 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	line-height: 19px;
	font-size: 11px;
	overflow:auto;
	
} 

/* menu onglet en li, images de fond, position et alignement */
#gabarit2_soc li 
{
	background-image:url(../images/onglet2-societe0901.png);
	margin: 30px 2px auto 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left: 50px;
	list-style: none;
} 

/* comportement des onglets avec opacité  */

div.tabs1 ul 
{ 
    
  margin:0px; 
  padding:0px;
  height: 37px;
  margin-bottom: 0;
  
	
} 

div.tabs1 ul li {
	
	float:left;
	list-style-type:none;
	margin: 0px 0px 0px 0px;
	position:relative;
	width: 163px;
	padding: 3px 0px 0px;
	color:#FFFFFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:800;
	opacity:0.4;	
	filter: alpha(opacity=40);
	background-repeat:no-repeat;
	text-align: center;
	height: 32px;
	letter-spacing: 2px;
	text-indent: 0;
}

div.tabs1 ul li a {

	display: block;
	width: 97%;
	text-decoration:none;
	color:#FFFFFF;
	height: 100%;
	padding: 10px 0px 8px;
	
}

div.tabs1 ul li.over {

	opacity: 0.6;
	filter: alpha(opacity=60);/* hack opacity pour ie */
}

div.tabs1 li.ui-tabs-selected 
{ 

	opacity:1;
	filter: alpha(opacity=100);/* hack opacity pour ie */
	padding: 3px 0px 0px;
	height: 34px;
}



/* zone des 5 associes  */ 
#gabarit2_assoc .gab_asso {
	clear:left;
	padding: 0 30px 20px 4px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	zoom:1 /* ie */;
	background-color:#308486;
	font-size: 11px;
	line-height: 19px;
	height: 255px;
	overflow:auto;

} 

#gabarit2_assoc_texte {
	padding: 10px;
}


#gabarit2_assoc li 
{
	margin: 0 auto 0px 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left:0px;
	bottom: 0;
	top:0px;
	right:0px;
} 



#gabarit2_assoc li#marylin {
background: url(../images/CCProd-website-DA-v2-9-6_08.png) ;
background-repeat:no-repeat;
height:116px;
width:90px;


}

#gabarit2_assoc li#deup {
background: url(../images/CCProd-website-DA-v2-9-6_09.png) ;
height:116px;
width:90px;
background-repeat:no-repeat;


}

#gabarit2_assoc li#renaud {
background: url(../images/CCProd-website-DA-v2-9-6_10.png) ;
height:116px;
width:85px;
background-repeat:no-repeat;

}

#gabarit2_assoc li#eric {
background: url(../images/CCProd-website-DA-v2-9-6_11.png) ;
height:116px;
width:88px;
background-repeat:no-repeat;

}

#gabarit2_assoc li#norbert {
background: url(../images/CCProd-website-DA-v2-9-6_12.png) ;
height:116px;
width:90px;
background-repeat:no-repeat;

}

/* cette div est assessible uniquement via un lien sur la home */
#gabarit2_assoc li#reseaux {
background: none;
height: 116px;
width:1px;
}

/* onglets des associes */ 
div.tabs2 ul 
{ 
    
  margin:0px; 
  padding:0px;
  height: 115px;
  margin-bottom: 0px;
	
} 
div.tabs2 ul li {

	width: 88px;
	height: 115px;
	padding-bottom: 0;
}

.nom_associes {
	padding: 0px 0px 20px;
	font-size: 19px;
	color: #fff4e6;
	font-weight: bold;
	font-variant: small-caps;
	text-transform: lowercase;
	letter-spacing: 4px;
}

.titre_associes {
	color:#eee4d7;
	font: italic 10px "Trebuchet MS", "Lucida Grande", Verdana, Helvetica, Arial;
	display:block;
	padding:5px 0 5px 0; 

}

.texte_associes {
	line-height: 22px;
	font-size:11px;
	color:#FFFFFF;
	display:block;
	padding:5px 0 5px 0; 
}

.img_associes {
	display:block;
	height:273px;
	float:left;
	padding: 6px 9px 5px 0;
}

/* gabarit 3  page metiers*/

#mainconteneur_metiers {
	margin: 10px auto 0 auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	text-align: left; /* Redefines the text alignment defined by the body element. */
	width: 70em;
	background-image:url(../images/fond-tube-metier.png);
	background-repeat:no-repeat;
	width: 984px;
	height: 800px;
} 
	

/* div de gauche */
#gabarit3_left .gab3_left {
clear: left;
padding: 10px 40px 20px;
zoom: 1 /* ie */;
background-color: #9d1e3b;
width: 409px;
height: 405px;
margin: 30px auto auto 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
line-height: 19px;
font-size: 11px;
overflow:auto;
} 

#gabarit3_left li {
background-image: url(../images/CCProd-website-DA-v2-9-9_10.png);
margin: 30px 2px auto 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
left: 50px;
}

/* onglet cine  tv */
#gabarit3_cine .gab3_cine {
	clear:left; 
	zoom:1 /* ie */;
	background-color:#548385;
	width: 469px;
	height: 405px;
	margin: 0px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	line-height: 19px;
	font-size: 11px;
	padding: 0;
} 

#gabarit3_cine_texte {
	padding: 10px 10px 20px;	

}


#gabarit3_cine li 
{
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	background:none;
	width: 120px;
	margin: 9px auto auto 0;
} 


#gabarit3_cine li a:hover{
	color: #ffc370;
	text-decoration: none ;
}



div.tabs300 ul 
{ 
    
  margin:0px; 
  padding: 0px 5px 10px 0px;
  height: 40px;
} 

div.tabs300 ul li {
	
	float:left;

	list-style-type:none;
  
	margin: 0px 0px 0px 0px;
	
	position:relative;
	width: 160px;
	
	padding: 0px 0;
	
	

	opacity:0.4;	
	filter: alpha(opacity=40);
	background-repeat:no-repeat;
	
	text-align: left;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: orange;
	font-size: 10px;
	height: 40px;
}

div.tabs300 ul li a {

	display: block;
	width: 97%;
	color: orange;
	height: 100%;
	padding: 5px 0px;
	
}

div.tabs300 ul li.over {
	opacity:0.6;
	filter: alpha(opacity=60);
}

div.tabs300 li.ui-tabs-selected 
{ 

	opacity:1;
	filter: alpha(opacity=100);
	padding: 0px 0px;
	height: 40px;

}


#gabarit3_corpo .gab3_corpo {
	clear:left;
	padding: 0px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	zoom:1 /* ie */;
	background-color:#548385;
	width: 469px;
	margin: 0px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	line-height: 19px;
	font-size: 11px;
	height: 405px;
} 

#gabarit3_corpo_texte {
	padding: 10px 10px 20px;	
	
}


#gabarit3_corpo li 
{
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;;
	background:none;
	width: 120px;
	margin: 9px auto auto 0;
} 


#gabarit3_corpo li a:hover{ 
	color: #ffc370;
	text-decoration: none ;
	}
        
div.tabs301 ul 
{ 
    
  margin:0px; 
  padding: 0px 5px 10px 0px;
  height: 40px;
} 

div.tabs301 ul li {
	
	float:left;

	list-style-type:none;
  
	margin: 0px 0px 0px 0px;
	
	position:relative;
	width: 160px;
	
	padding: 0px 0;
	
	

	opacity:0.4;	
	filter: alpha(opacity=40);
	background-repeat:no-repeat;
	
	text-align: left;
	text-transform: uppercase;
	color: orange;
	font-size: 10px;
	letter-spacing: 2px;
	height: 40px;
}

div.tabs301 ul li a {

	display: block;
	width:97%;
	text-decoration:none;
	color: orange;
	height: 100%;
	padding: 5px 0px;
	
}

div.tabs301 ul li.over {

	opacity: 0.6;
	filter: alpha(opacity=60);
	
}

div.tabs301 li.ui-tabs-selected 
{ 

	opacity:1;
	filter: alpha(opacity=100);
	padding: 0px 0px;
	height: 40px;

} 

/* gabarit 400 page nide de poule*/

#mainconteneur_poule {
	margin: 10px auto 0 auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	text-align: left; /* Redefines the text alignment defined by the body element. */
	width: 70em;
	background-image:url(../images/fond-dentifrice-niddepoule.png);
	background-repeat:no-repeat;
	width:984px;
	height:800px;
}



#gabarit4_left .gab4_left {
	
	clear:left; 
  	padding: 10px 40px 20px; 
  	zoom:1 /* ie */;
	background-color:#bb8a4f;
	width: 409px;
	height: 405px;
	margin: 30px auto auto 50px; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	line-height: 19px;
	font-size: 11px;
	overflow:auto;
	
} 


#gabarit4_left li 
{
	background-image:url(../images/CCProd-website-DA-v2-9-9_10_1.png);
	margin: 30px 2px auto 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
	left:50px;
}