*{
font-family:Trebuchet, Arial, Helvetica ;
}

/* le coprs du site general */
body{
background-color:#0c426e;
background-image:url(images/bg.jpg);  
background-repeat:no-repeat;  
background-position:30% 40%;
margin-left:auto;
margin-right:auto;
margin-top: 30px; 
margin-bottom: 20px;    
width:670px;
}
body,h1{
text-align:left;
}

/* bloc qui centre */
#conteneur{i
	width:470px;
	margin-left:50px;
}
h1{
font-size:1.5em;
}
/* L'en-tête */
h2{
font-size:1.1em;
}
#contact{
   float: right;
    color:#EBE1DF;
   position: relative;
	top:5px;
	left: -20px;
	   text-align:right;
}
a:LINK { color: #A5BF36; text-decoration: none }

a:VISITED { color: #A5BF36; text-decoration: none }

a:HOVER { color: #DF6C1C; text-decoration: none}
#en_tete
{
	padding-left:20px;
	padding-top:5px;
   text-align:left;
   width: 432px;
   height: 100px;
   background-color:#472E2E;
   margin-bottom: 10px;
   color:#EBE1DF;
   position: relative;
	top:1px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-topleft: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 3px 3px 4px #354172;
	-webkit-box-shadow: 3px 3px 4px #354172;
	box-shadow: 3px 3px 4px #354172;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

/* lecorps du site */
#contenu{

   background-color:#7E5E54;
   float: left;
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   color: #B3B3B3;
   	-moz-box-shadow: 3px 3px 4px #354172;
	-webkit-box-shadow: 3px 3px 4px #354172;
	box-shadow: 3px 3px 4px #354172;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}


.tab_container {
	border: 1px solid #eeeee0;
	border-top: none;
	overflow: hidden;
	clear: both;
	float: left; width: 100%; height: 100%;
	background-color: #EDE0D1;
}
.tab_content {
	padding: 20px;
	font-size: 0.9em;
}
ul.tabs {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px; /*--Set height of tabs--*/
	border-bottom: 1px solid #eeeee0;
	border-left: 1px solid #eeeee0;
	width: 100%;
}
ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
	border: 1px solid #eeeee0;
	border-left: none;
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
	background-color: #A5BF36;/*--ee7600--*/
	color:#EDC190;
	}
ul.tabs li a {
	font-weight: bold;
	text-decoration: none;
	display: block;
	font-size: 0.9em;
	padding: 0 20px;
	border: 1px solid #eeeee0; /*--Gives the bevel look with a 1px white border inside the list item--*/
	outline: none;
	color: #EDE0D1;
	}
ul.tabs li a:hover {
	background-color: #DF6C1C;
	color: #eeeee0;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
	background-color: #DA551D;
	color: #EDE0D1;
	border-bottom: 1px solid #eeeee0; /*--Makes the active tab look like it's connected with its content--*/
}
#tab1
{
width:400px;
height:300px;
background-color:#EBE1DF;
}

#tab2
{
height:360px;
width:400px;
background-color:#EBE1DF;
}
#tab3
{
color:#da551d;
height:300px;
width:400px;
background-color:#EBE1DF;
}

.zitem {
	width:85px;
	height:85px;	
	border:4px solid #222;	
	margin:5px 5px 5px 0;
	
	/* required to hide the image after resized */
	overflow:hidden;
	
	/* for child absolute position */
	position:relative;
	
	/* display div in line */
	float:left;
}

.zitem .caption {
	width:85px;
	height:30px;
	background:#000;
	color:#fff;
	font-weight:bold;
		
	/* fix it at the bottom */
	position:absolute;
	bottom:-1px; /* fix IE issue */
	left:0;

	/* hide it by default */
	display:none;

	/* opacity setting */
	filter:alpha(opacity=70);    /* ie  */
	-moz-opacity:0.7;    /* old mozilla browser like netscape  */
	-khtml-opacity: 0.7;    /* for really really old safari */  
	opacity: 0.7;    /* css standard, currently it works in most modern browsers like firefox,  */

}

.zitem .caption a {
	text-decoration:none;
	color:#fff;
	font-size:10px;	
	
	/* add spacing and make the whole row clickable*/
	padding:5px;
	display:block;
}

img {
	border:0;
	
	/* allow javascript moves the img position*/
	position:absolute;
}

.clear {
	clear:both;	
}

#tab4
{
height:300px;
width:400px;
background-color:#EBE1DF;
}
#tab5
{
height:300px;
width:400px;
background-color:#EBE1DF;
}
.highlightit img{
border: 3px solid #A5BF36;
}

.highlightit:hover img{
border: 3px solid #DF6C1C;
}

.highlightit:hover{
color: #DF6C1C; /* Dummy definition to overcome IE bug */
}
#blocBottom{
font-weight: bold;
padding: 20px;
text-align:left;
float: left;
height: 30px;
width: 412px;
margin-top:2px;
background-color:#7E6055;
color:#EBE1DF;
position:relative;
top:-15px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
border-radius: 10px;
/*behavior: url(border-radius.htc);
border-radius: 10px;*/
	-moz-box-shadow: 3px 3px 4px #354172;
	-webkit-box-shadow: 3px 3px 4px #354172;
	box-shadow: 3px 3px 4px #354172;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#354172')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
#info{
float: left;
}
#film1{
padding-top: 20px;
text-align:left;
float: left;
color:#da551d;
position:relative;
}
#film2{
padding-top: 20px;
text-align:left;
float: left;
color:#da551d;
position:relative;
}
#text2d{
padding-top: 20px;
text-align:left;
float: left;
color:#da551d;
}
#profil{
text-align:left;
color:#da551d;
}
#cv{
text-align:left;
color:#da551d;
}
#pied_de_page
{	
float:left;
	position: relative;
	left: 90px;
	text-align: center;
   color: #B3B3B3;
   font-size:0.7em;
	}