/*********************************************
	www.liquifit.net
	
	Benjamin Legrand - juillet 2008
**********************************************/


/*
* #00AEEF
*	HTML (default tags)
*/
*{font-family:Arial,Verdana,Helvetiva;font-size:13px;color:#545454;margin:0;padding:0;}
html,body{height:100%;background:#FFF;text-align:center;
	background:#FFF url(img/page.png) repeat-y top center;}

a{color:#0076CC;cursor:pointer;}
a:hover{color:#FFB91D}
a img{border:none;}
ul,ol,dl{}
li{list-style-type:none;}
p{margin:5px 0px;}

h6,h5,h4,h3,h2,h1,#gammes span,dt{font-family:Arial,Helvetica,Garamond,sans-serif;color:#666666;font-weight:bold;}
h1 { font-size: 2em }
h2 { font-size:1.5em;}
h3 { font-size: 1.17em }
h4 { font-size: 0.9em }
h5 { font-size: .83em; line-height: 1.17em }
h6 { font-size: .67em }

h2,dt{
/*background:transparent url(img/smenu_titre.jpg) no-repeat scroll left bottom;*/
border-bottom:1px solid #FFB91D;
font-size:1.5em;
margin-bottom:5px;
margin-top:15px;
padding:5px 10px;}

dt{font-size:1.2em}

dl{margin:0 auto;}
dt{
	clear:both;
}
dd{
	margin-bottom:20px;
}
object{z-index:0;}
#news dl dd img{float:left;margin:0px 10px 10px 0px;}
form{}
fieldset{border:none;}

/*
*	MISE EN PAGE (Layout)
*/
#page{
	width:852px;
	margin:0 auto;
	position:relative;
	background:#FFF url(img/page.png) repeat-y top center;
	text-align:left;
	min-height: 100%;
}
#header{height:140px;background:#FFF url(img/header_new.jpg) no-repeat right top;}
#menu{height:21px;}
#main{position:relative;margin:0px 31px;}
#gammes{}
#content{margin:0 20px;overflow:auto;}
#footer{text-align:center;width:100%;}
#header,#menu,#footer, #goldbar,#logos{margin:0 31px}

/*
*	HEADER
*/
#header{}
#header h1{width:28px;display:none;}
#header p{}



/*
*	GAMMES
*/
#gammes{}
#gammes ul{}
#gammes li	 {
	width:110px;height:110px;position:relative;
	margin-bottom:10px;text-align:center;
	background:transparent url(img/carre.png) no-repeat center center;
}
#gammes li:hover	{
	background:transparent url(img/carre_rollover.png) no-repeat center center;
}
#gammes a	{
	padding:5px 0px 10px 0px;
	display:block;
	text-decoration:none;
	overflow:hidden;
	padding-left:90px;
	}
#gammes a:hover{	}
#gammes span{
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
	display:block;width:107px;
	background:#666666 none repeat scroll 0 0;
	color:#FFFFFF;
	display:block;
	font-size:0.85em;
	padding:2px 0px;
}
#gammes li:hover span{background:#666;}
#gammes img	{border:none;position:absolute;bottom:15px;left:0px;}

/*
*	FOOTER
*/
#footer{margin-top:40px;padding-top:10px;}
#footer p{text-align:center;}
 hr {
 display:block;
 height: 1px;
 margin: 0;
 _margin: -7px 0;
 padding: 0;
 color: #F00;
 background-color: #F00;
 border: 0;
 }

#footer hr{
	border-color			  : #999;
	border-width			  : 0 0 1px;
	border-style			  : solid;
margin:0px 120px;
color:#666666;margin-bottom:15px;}
#footer div p{
	text-align:center;
	color:#666;
	margin:0;
	font-size:10px;
	display:inline;
	padding:10px;}

#footer a{border:none;text-decoration:none;}
/*
*	PAGES (ou différentes zones)
*/

/**************ACCUEIL**************/
#welcomeText{overflow:auto;padding:10px;}
#welcomeText img{float:left;padding:10px;border-right:1px #CCC solid; margin-right:10px;}
#welcomeText p{}
#flash{height:300px;}
#home #news{float:left;width:375px;}
#home #gammes{float:right;width:360px;}
#home #news h3,#home #gammes h3{
	padding:5px;margin:15px 0px;
	-moz-border-radius:4px;-webkit-border-radius:4px;
	background:transparent url(img/barre_titre.jpg) repeat-x left bottom;color:#666666;
}
/*
#home #news h3, #home #gammes h3 {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:0;
-moz-border-radius-topleft:0;
-moz-border-radius-topright:10px;
background:#36AEE2 none repeat scroll 0 0;
color:#FFFFFF;
margin:15px 0;
padding:5px 10px;}
/**************NEWS**************/
#news .rss{
	height:16px;
	padding:4px 0px 4px 28px;
	background:url(img/rss.png) no-repeat left center;
	vertical-align:middle;display:inline-block;}
#news h4,#news dt{
	/*background:transparent url(img/smenu_news.jpg) no-repeat left bottom;*/
	padding:2px 10px 4px 10px;margin-bottom:5px;
	}
	#news h4 a{color:#666666;text-decoration:none; border-bottom:1px solid #FFB91D;}
#news ul li{margin:10px 0px;overflow:auto;}
#news dl{margin:20px auto;}
#news span.date{color:#999;font-weight:normal;font-size:11px;text-align:right;}
#news dd{text-align:justify;margin-bottom:100px;}
#news ul li img{float:left;margin:0px 5px 5px 0px;}
#news ul li div{text-align:justify;margin-bottom:10px;}
#news_link{font-size:10px;}
/**************GAMMES***************/
#products_gammes li{
	float:left;
	width:110px;height:130px;
	margin:0px 5px 10px 5px;text-align:center;}
#products_gammes a{padding:5px 0px 10px 0px;display:block;text-decoration:none;}

/**************PRODUITS*************/
.product{overflow:auto;width:750px;
  min-height:200px;
  height:auto !important;
  height:200px}


table
{
cellspacing:0;
cellpadding:0;
border-collapse: collapse;
border:1px solid lightgrey;
width:560px;
font-family:verdana;
}
th,td{text-align:center;width:20px;font-size:12px;vertical-align:top;}
thead{border-bottom:1px solid lightgrey}

.productReference{color:#FFB91D;font-weight:bolder;width:80px}

.image{display:block;float:left;width:180px;text-align:left;height:180px;position:relative}
.productImage, .productSchema{float:left;clear:none;display:block;width:75px;height:75px;padding:5px;border:1px lightgrey solid;outline:none}
.productImage img , .productSchema img{width:75px;height:75px;}
.productImage{margin-right:6px}

#imageHover{position:absolute;z-index:22;left:0;}
#imageHover{width:152px;height:152px;}
#imageHover a{width:150px;height:150px;display:block;border:1px lightgrey solid;padding:14px;background:#FFF;}
#imageHover a img{width:150px;height:150px;}

.product table{float:right;}
.product h3{
	clear:both;
	margin:15px 0px ;
	font-size:16px;
	background:transparent url(img/smenu_ref.jpg) repeat-y scroll right bottom;
	}
.product h3 span{color:#FFB91D;margin-right:10px;font-size:16px;}
.blue{color:#0099FF;margin-right:10px}

.productIntro h3, #free h3, #free dt
{	
	/*background:transparent url(img/smenu_news.jpg) no-repeat scroll left bottom;*/
	border-bottom:1px solid #FFB91D;
	margin-top:10px;
	margin-bottom:20px;
	padding:2px 10px;
}

/**************COMPANY**************/

/**************LITERATURE***********/
#literature{}
/**************TECHNICAL************/
/*** COMPLEMENTARY PRODUCTS ********/
.complementaryProductsBloc{overflow:auto;}
.complementaryProductsBloc ul li{background:transparent url(/jahia/webdav/site/liquifit/shared/images/list.gif) no-repeat left 3px;padding-left:15px;line-height:1.5em}
.complementaryProductsBloc ul{margin-left:150px;}
.complementaryProductsBloc img{background:#000;width:150px;display:block;float:left;}
/************** COMPATIBILITY ************/
.compatibilityLegend{margin-top:30px;}
.compatibilityLegend li{float:left;text-align:center;width:180px;}
table.compatibilityTable
{
	border:1px solid lightgrey;border-collapse:collapse;
	width:355px;float:left;margin-right:5px;
}
.compatibilityTable th
{
	border:1px solid lightgrey;
	text-align:center;
	color:#000;
}
.compatibilityTable td
{
	border:1px solid lightgrey;
	text-align:left;
	height:19px;
}
td.compatTitle, th.compatTitle
{
	text-align:left;
	padding-left:5px;
	width:185px;
}
td.compatImg,th.compatImg
{
	width:60px;
}

/**************CONTACT**************/
#contact form div{position:relative;margin-top:10px;}
#contact fieldset { width:25em;padding:0.5em 1em; }
#contact label { position:relative;width:15em; display:block;margin:15px 0em;clear:both;}
#contact label input ,#contact label textarea {position:absolute;left:100%;top:0px;width:28em; } 
#contact input{}
#contact textarea{}
#contact input.submit{width:7em;}
.required{color:red;}
.labelTextarea{}
.labelRequired{margin-top:150px;text-align:center;}
.labelRequired >span{float:left}
#contact{margin:20px 0px; height:300px}
#selectCountryForm{
	margin-top:30px;padding-bottom:10px;
}
#contactIntroAndForm div p{color:#1573B8;padding:20px 0px;text-align:center;font-style:italic;}

/*********** COMMON STYLES ***********/
.left{text-align:left}
.right{text-align:right;}
.center{margin:0 auto;text-align:center;}
.nostyle{margin:0;padding:0;border:none;color:#000;background:#FFF;}
.wrapper{overflow:auto;}




/*
*	MENU*****************************************************************************************************************
*/


#menu .flags
{
	float:right !important;
	right:9px;
}
#menu .flags #lang_link
{
	border-top:0px !important;

	
}



/*--NAVIGATION BAR--*/
#menu ul.nav_haut {
	margin:0px;
	width: 800px;
	float: left;
	//border-left:1px solid #CCC;
}
#menu h2.NavTitle {
	display: none;
}
#menu ul.nav_haut li {
	float: left;
	position: relative;
	/*antai*/
	/*padding:0px 10px 0px 10px;*/
}
#menu ul.nav_haut li a  {
	display: block;

text-decoration:none;
	display: block;
	height: 16px;
	font-weight: bolder;
	font-size:11px;
	/*antai*/
	color:#666666;
	
}
/*ul.nav_haut li a:hover{text-decoration:none;}*/

#menu ul.nav_haut li a {
display:block;
	border-top:1px solid #FFF;
 	border-right:1px solid #CCC;
	padding:2px 0px;
	z-index:1001;
		padding-left:10px;
	padding-right:10px;
}
	
/*antai*/
#menu ul.nav_haut li div.actionMenuContainer a {
	display: inline;
}
/*antai*/

/*antai*/
#menu ul.nav_haut li a.Invisible {
	display:none;
}
#menu ul.nav_haut li a.InvisibleEdit {

}
/*end antai*/
ul.nav_haut li.Active ul {
	display: block;
}

#menu ul.nav_haut li.Trigger ul {
	display: none;
}

#menu ul.nav_haut li.Trigger a {
	background-position: top;
}
#menu ul.nav_haut li.Hidden ul {
	display: none;
}
#menu ul.nav_haut li.Hidden a {
	background-position: bottom;
}
#menu ul.nav_haut li.Active {
	text-decoration: none;
	color:#000;
}

#menu ul.nav_haut a:hover
{
	border-top: 1px solid #CCC;
	
	background-color:#F2F2F2;
	z-index: 1002;
}
#menu ul.nav_haut li.Active a
{
	border-top: 1px solid #CCC;
	border-bottom:1px solid #CCC;
	background-color:#F2F2F2;
	z-index: 1002;
}
/*----------*/
#menu ul.nav_haut li ul {
	position: absolute;
	top: 19px;
	left:-1px;
	border:solid #CCCCCC 1px;
	z-index: 1001;
	width: 225px;
}
#menu ul.nav_haut li.Active ul {
	
}
#menu ul.nav_haut li ul li a {
	display: block;
	width: 200px;
	padding: 1px 5px 4px 20px;
	border-top: 1px solid #FFF;
	font-size: 0.82em;
	color: #666;
	background: #F2F2F2;
	height: auto !important;
}

#menu ul.nav_haut li ul li a:hover {
	background: url(img/btn-green3.gif) #ffffff no-repeat 8px center;
	color:#444;
}