/* CSS Document */


/*---------------------GENERAL-----------------------------------------*/
*
{
margin:0;
padding:0;
}


HTML,BODY{
width:100%;
height:100%;
background:url(img/front/bg1.gif) repeat;
}

IMG
{
border:0;
margin:0;
padding:0;
}

#container{
position:relative;
background-color:#FFF;
background-repeat:repeat-y;
width:1000px;
margin:0 auto;
}

/*----------------------------------------------------------------------*/

/*--------------------------TOP-----------------------------------------*/


#topAccueil
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topAccueil.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

#topKolotec
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topKolotec.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

#topPaille
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topPaille.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}



#topConception
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topConception.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

#topConstruction
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topConstruction.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

#topContact
{
position:relative;
top:10px;
left:30px;
width:950px;
height:356px;
background:url(img/front/topContact.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}




#logo
{
position:absolute;
width:438px;
height:87px;
top:125px;
left:521px;
text-align:left;
}

#slogan{
position:absolute;
top:212px;
left:611px;
}

#slogan p{
font:18px Arial, Helvetica, sans-serif;
color:#41321f;
}

/*----------------------------------------------------------------------*/

/*--------------------------MAINBODY------------------------------------*/
#mainBody{
position:relative;
top:10px;
left:30px;
width:980px;
margin-bottom:10px;
}

/*--------------------------MAINPAN - ZONE GAUCHE-------------------------------------*/


#mainPan{
float:left;
margin-top:20px;
width:491px;
margin-bottom:5px;
}

#cadreTop
{
width:491px;
height:29px;
font-size:0;
margin:0;
padding:0;
display:block;
background-image:url(img/front/cadre_top.gif);
background-repeat:no-repeat;
}

#cadreMiddle
{
width:489px;
padding:0;
background:#FFF;
border-left:solid 1px #000;
border-right:solid 1px #000;
text-align:justify;
}

#cadreMiddle table tr td
{
vertical-align:top;
}

#cadreMiddle h1
{
width:380px;
padding-left:10px;
font:24px Arial, Helvetica, sans-serif;
font-weight:bold;
color:#434343;
text-align:left;
}

#cadreMiddle h2
{
width:380px;
padding-left:10px;
font:14px Arial, Helvetica, sans-serif;
font-weight:bold;
color:#535353;
}

#cadreMiddle p
{
width:350px;
padding-left:10px;
font:11px Arial, Helvetica, sans-serif;
font-weight:bold;
color:#7c7c7c;
}

#cadreMiddle ul li{
list-style-type:square;
font:11px Arial, Helvetica, sans-serif;
font-weight:bold;
color:#535353;
margin-left:35px;

}


#cadreBottom
{
width:491px;
height:29px;
font-size:0;
margin:0;
padding:0;
display:block;
background-image:url(img/front/cadre_bottom.gif);
background-repeat:no-repeat;
}



/*--------------------------BOXES - MILIEU-------------------------------------*/

#boxes{
float:left;
margin-top:20px;
margin-left:10px;
width:70px;
height:390px;
}

#boxes ul li{
list-style:none;
margin-bottom:10px;
}


/*--------------------------RIGHTPAN - en haut à droite-------------------------------------*/
#rightPan{
float:left;
width:356px;
height:157px;
margin-top:20px;
margin-left:10px;
background:url(img/front/bg-contact.png) no-repeat;
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

#rightPan p{
width:112px;
height:112px;
padding:20px 20px 20px 20px;
font:12px Arial, Helvetica, sans-serif;
font-weight:bold;
color:#46423a;
text-align:center;
}

#rightPan img{
behavior: url(common/js/IE_PNG_FIX/iepngfix.htc);
}

/*--------------------------MENU - en bas à droite-------------------------------------*/
#menuRight{
float:left;
margin-top:10px;
margin-left:10px;
background:url(img/front/bg-menu.gif) no-repeat;
width:316px;
height:187px;
padding:20px 0 0 40px;
}

#menuRight ul{
width:206px;
height:180px;
padding:0;
margin:0;
list-style:none;
background:transparent url(img/content/menuRight.gif) top left no-repeat;
float:left;
}
#menuRight ul li{
list-style:none;
float:left;
padding:0;
margin:0;
}


#menuRight li a{
display:block;
width:206px;
height:30px;
text-decoration:none;
}

#menuRight li a span{
position:absolute;
left:-5000px;
}
#menuRight li a:hover{
background:transparent url(img/content/menuRight.gif) top left no-repeat;
}

#menuRight a#accueil:hover, #menuRight a#accueilactive:hover {
background-position:-206px 0px;
}


#menuRight a#kolotec:hover, #menuRight a#kolotecactive:hover {
background-position:-206px -30px;
}

#menuRight a#paille:hover, #menuRight a#pailleactive:hover  {
background-position:-206px -60px;
}

#menuRight a#construction:hover, #menuRight a#constructionactive:hover {
background-position:-206px -90px;
}

#menuRight a#contact:hover, #menuRight a#contactactive:hover{
background-position:-206px -120px;
}

#menuRight a#accueilactive{
background:url(img/content/menuRight.gif) -206px 0px no-repeat ;
}

#menuRight a#kolotecactive{
background:url(img/content/menuRight.gif) -206px -30px no-repeat ;
}

#menuRight a#pailleactive{
background:url(img/content/menuRight.gif) -206px -60px no-repeat ;
}


#menuRight a#constructionactive{
background:url(img/content/menuRight.gif) -206px -90px no-repeat ;
}

#menuRight a#contactactive{
background:url(img/content/menuRight.gif) -206px -120px no-repeat ;
}


/*--------------------------FOOTER - pied de page-------------------------------------*/
#footer{
position:relative;
top:20px;
left:30px;
padding-top:20px;
margin:0;
width:948px;
height:200px;
background:url(img/content/bg-footer.gif) no-repeat;
clear:left;
}

#footer p{
text-align:center;
font-weight:bold;
font:12px Arial, Helvetica, sans-serif;
color:#FFF;
}

#footer span{
font:14px Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#footer a{
width:100px;
height:20px;
background:url(img/front/logo_cinethics_site.png) no-repeat;
border:none;
text-decoration:none;
}

/*----------------------------------------lightBox----------------------------------------*/

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }

#lightbox img{ border: none; } 
#overlay img{ border: none; }

#overlay{ background-image: url(img/content/overlay.png); }

* html #overlay{
	background-color: #000;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="img/content/overlay.png", sizingMethod="scale");
	}