body
	{
		height:100%;
		width:100%;
		background:#000000;
		background-image:url("http://www.hempe.be/site/theme/bord2.jpg");
		background-repeat: repeat-y;
		color:#777777;
		font-family:arial, helvetica, tahoma;
		font-size:1em;
		margin:0px;
		padding:0px;
	}

a
	{
		color:#aaaaaa;
		text-decoration:none;
		background:#none;
	}
a:hover
	{
		color:#ffffff;
		text-decoration:none;
		background:#none;
		position:relative;
	}

span.memo
	{
		display:none;
	}

a:hover span.memo
	{
	margin-left:5px;
	margin-top: 15px;
	position:absolute;
	left:10px;
	top:20px;
	display:block;
	font-family:arial, verdana;
	width:10em;
	border:2px ridge red;
	background:#600000;
	color:white;
	font-weight:bold;
	padding:3px;
	-moz-opacity:0.7; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.7; /* firefox ... */
	filter:alpha(opacity=70); /* pour IE */
	}


a.vignette img
	{
	border:2px groove silver;
	-moz-opacity:0.5; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.5; /* firefox ... */
	filter:alpha(opacity=50); /* pour IE */
	}
		
a.vignette:hover img
	{
	border:3px ridge white;
	-moz-opacity:1; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 1; /* firefox ... */
	filter:alpha(opacity=100); /* pour IE */
	}	

a.vignette2 img
	{
	border:2px groove silver;
	-moz-opacity:0.5; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.5; /* firefox ... */
	filter:alpha(opacity=50); /* pour IE */
	}
		
a.vignette2:hover img
	{
	border:3px ridge red;
	-moz-opacity:1; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 1; /* firefox ... */
	filter:alpha(opacity=100); /* pour IE */
	}	



a.affich img
	
	{

	-moz-opacity:1; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 1; /* firefox ... */
	filter:alpha(opacity=100); /* pour IE */
	border:none;
	}	

a.affich:hover img
	
	{
	-moz-opacity:0.4; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.4; /* firefox ... */
	filter:alpha(opacity=40); /* pour IE */
	
	}	


h1
	{
		color:#cccccc;
		font-size:20px;
	}
	
h2
	{
		color:#aaaaaa;
		font-size:16px;
	}


#contenant
	{
		
		
		position:relative;
		width:860px;
		padding:15px;
		margin:15px;
		background:#252525;
		border:1px #444444 solid;
		overflow:auto;
	}

.cgauche
	{
		
	
		background:#424242;
		width:200px;
		float:left;
		padding:7px;
		vertical-align:top;
		margin:2px;
		border:1px #999999 solid;
	}
	

.cdroite
	{
	
	
		background:#424242;
		width:600px;
		float:right;
		padding:7px;
		margin:2px;
		border:1px #999999 solid;
	}
	

.bouton
	{
	font-size:0.8em;
	padding:10px;
	border:3px outset white;
	background:url("http://www.hempe.be/site/theme/gris1.jpg");
	color:gray;
	}

.bouton:hover
	{
	border:3px inset white;
	background:url("http://www.hempe.be/site/theme/metal.jpg");
	color:white;
	}				
	
.boutonbb
	{
	width:100px;
	height:40px;
	padding:3px;
	line-height:40px;
	font-size:14px;
	
	border:3px outset white;
	
	background:url("http://www.hempe.be/site/theme/gris1.jpg");
	color:gray;
	}

.boutonbb:hover
	{
	border:3px inset white;
	background:url("http://www.hempe.be/site/theme/metal.jpg");
	color:white;
	}				

.cellule
	{
	text-align:center;
	vertical-align:middle;
	height:200px;
	width:160px;}
	
	
/* ------------STYLES POUR site B&B site ---------------	 */
div#titrebb
{
position:absolute;
display:block;
top:0px;
left:300px;
width:780px;
height:120px;
background:url("http://www.hempe.be/site/theme/bb/titrebb2.png");
}

div#un
{

float:left;
position:relative;
display:block;
width:80px;
border:none;
padding:0px;
text-align:center;
}

div#un img
{
	-moz-opacity:0.5; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.5; /* firefox ... */
	filter:alpha(opacity=50); /* pour IE */
	border:2px white solid;
}

div#un:hover
{
    /*border: solid 1px #ffffff;*/
    color:red;
    border:none;
    text-decoration:none;
}
div#un:hover img
{
	-moz-opacity:1; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 1; /* firefox ... */
	filter:alpha(opacity=100); /* pour IE */
}
div#appercu
{
	position: absolute;
    top: 0px;
    left: 300px;
    padding: 0px;
}

div#appercu
{
    display: none;
}

div#un:hover + div#appercu
{
    display: block;

}

	
div#cadre1
{
position:absolute;
display:block;
padding:0px;
top:0px;
left:30px;
width:250px;
text-align:center;
}	


div#cadre2
{
position:absolute;
display:block;
top:200px;
left:30px;
width:250px;
height:600px;
text-align:left;

}	




/* ------------STYLES POUR site Oeil numerique ---------------	 */
div#titreon1
{
position:absolute;
display:block;
top:0px;
left:300px;
width:135px;
height:10px;
background:#000000;
}
div#titreon2
{
position:absolute;
display:block;
top:0px;
left:440px;
width:380px;
height:100px;
background-image:url('../theme/on/titreon.png');
background-repeat:no-repeat;
}
div#vigon
{

float:right;
position:relative;
display:block;
width:80px;
border:none;
padding:0px;
text-align:center;
border:0;
}

div#vigon img
{
	-moz-opacity:0.5; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 0.5; /* firefox ... */
	filter:alpha(opacity=50); /* pour IE */
}

div#vigon:hover
{
    /*border: solid 1px #ffffff;*/
    color:red;
    border:none;
    text-decoration:none;
}
div#vigon:hover img
{
	-moz-opacity:1; /* Mozilla 1.6 et +  et une partie des navigateurs Gecko */
	opacity: 1; /* firefox ... */
	filter:alpha(opacity=100); /* pour IE */
}


div#vigon:hover + div#appercu
{
    display: block;

}