/***************** BODY *****************/
*{
/*---on passe toutes les marges à 0---*/
margin:0;
padding:0;
}
body,html{
height:100%;
/*---permet de changer la couleur de la barre de scroll dans IE (déconseillé)
scrollbar-base-color:#7d8a2e;
---*/
}
body{
background:#2b2b2b url(../images/charte/bg-body.jpg) top center no-repeat;
}
/***************** CONTAINER *****************/
#container{
position:relative;
height:auto;
width:990px;
margin:0 auto;
background:#2b2b2b url(../images/charte/bg-container.gif) top left repeat-y;

}

#containerAbsolute{
position:absolute;
width:990px;
height:550px;
left:50%;
top:50%;
margin-left:-495px;
margin-top:-275px;
background:#2b2b2b url(../images/charte/portfolio-design-container.jpg) center center no-repeat;
}

/***************** HEADER *****************/
	
#header{
float:left;
width:990px;
height:300px;
display:block;
outline:none;
z-index:0;
}

#upline p{
position:absolute;
width:600px;
top:5px;
left:50%;
margin-left:-200px;
font:11px Arial, Helvetica, sans-serif;
color:#ccc;
}
/***************** DIAPO *****************/
#diapo{
width:750px;
height:430px;
padding-left:200px;
}

/***************** MENU TOP *****************/
#menuTop{
position:relative;
float:left;
z-index:100;
width:799px;
padding-left:191px;
height:77px;
background:url(../images/charte/bg-menuTop.jpg) top left no-repeat;
list-style:none;
}
#menuTop li{
position:relative;
float:left;
}
#menuTop a{
text-decoration:none;
font:bold 12px/30px Verdana, Arial, Helvetica, sans-serif;
color:#fff;
text-align:center;
text-transform:none;
display:block;
height:77px;
overflow:hidden;
}

#menuTop li a span {display:none;}

#menuTop li.bt1 a {width:159px;}
#menuTop li.bt2 a {width:160px;}
#menuTop li.bt3 a {width:160px;}
#menuTop li.bt4 a {width:160px;}
#menuTop li.bt5 a {width:160px;}

#menuTop li.bt1 a {background:url(../images/charte/bt-01.gif) top left no-repeat;}
#menuTop li.bt2 a {background:url(../images/charte/bt-02.gif) top left no-repeat;}
#menuTop li.bt3 a {background:url(../images/charte/bt-03.gif) top left no-repeat;}
#menuTop li.bt4 a {background:url(../images/charte/bt-04.gif) top left no-repeat;}
#menuTop li.bt5 a {background:url(../images/charte/bt-05.gif) top left no-repeat;}


#container #menuTop li a:hover,
#container #menuTop a.trigered{
background-position:bottom left;
color:black;
}


/***************** SOUS MENU *****************/
#menuTop li ul{
list-style:none;
position:absolute;
top:-6000px;
left:0;
background:#000;
border:solid #ef9200;
border-width:1px 0 0 0;
}
#menuTop li li{
float:none;
}
#container #menuTop li li a{
background:#333;
position:relative;
height:30px;
font:14px/30px Arial, Helvetica, sans-serif;
text-transform:none;
color:#fff;
text-decoration:none;
border:solid #666;
border-width:0 0 1px 0;
}

#container #menuTop li li a:hover{
color:#F90;}


/***************** CONTENU *****************/

#videobox_fond {
	float:left;
	width:990px;
	height:407px;
	background:url(../images/charte/bg-videobox.jpg) top left no-repeat;
	}	
	
#videobox, #bandeau-contact {
	width:745px;
	height:313px;
	margin:50px 0 0 217px;
	z-index:0;
	/*obligatoire si il y a un flash (firefox)*/
	display:block;
	outline:0;
	}
	
	
#bandeau-promo, #bandeau-design, #bandeau-films, #bandeau-photo, #bandeau-events, #bandeau-booking {
	width:799px;
	height:380px;
	margin-left:191px;
	z-index:0;
	/*obligatoire si il y a un flash (firefox)*/
	display:block;
	outline:0;
	}

#contenu{
position:relative;
float:left;
width:710px;
margin:0 10px 0 190px !important;
margin:0 10px 0 0px;
padding:0 20px  0 50px !important;
padding:0 20px  0 230px;
/*border:1px solid white;*/
}

#contenu p{
	font:14px Arial, Helvetica, sans-serif;
	color:#FFF;
	}

/****************************************** Bloc Part ******************************************/
#col1 #total-part {
	width:670px;
	height:auto;
	float:left;
	}
	
	
#col1 #bloc-part {
	float:left;
	width:200px;
	height:135px;
	margin:25px 10px 0 8px;
	text-align:center;
	}

#col1 #bloc-part a{
font:13px Arial, Helvetica, sans-serif;
	}
	
#pubpart {
width:468px;
height:60px;
}

/****************************************** Fiche band ******************************************/

#col1 #fiche-band {
	width:450px;
	height:auto;
	}

#col1 #fiche-band #logo{
	float:left;
	width:200px;
	height:100px;
	text-align:right;
	padding-right:15px;
	}

#col1 #fiche-band #lien{
	float:left;
	width:210px;
	height:75px;
	border-left:1px solid #666;
	padding-left:15px;
	}
	
#col1 #fiche-band #bio{
	float:left;
	display:block;
	width:410px;
	border:1px solid #666;
	padding:0 15px;
	background:#222;
	}
	
#col1 #fiche-band a{
font:13px Arial, Helvetica, sans-serif;
	}
	
	
#col1 #part-categorie-corporate {
	float:left;
	width:440px;
	} 
	
#col1 #part-categorie-artistes {
	float:left;
	width:240px;
	margin-top:-30px;
	} 


#galerie-flyers {
	margin-left:-25px;
	/*obligatoire si il y a un flash (firefox)*/
	display:block;
	outline:0;
	}
	
#galerie-design{
	width:668px;
	height:419px;
	margin:auto;
	margin-top:65px;
		/*obligatoire si il y a un flash (firefox)*/
	display:block;
	outline:0;
}

#projet-design{
	width:668px;
	height:419px;
	margin:auto;
	margin-top:65px;
		/*obligatoire si il y a un flash (firefox)*/
	display:block;
	outline:0;
}
	
/***************** BOUTONS COL 3 *****************/

#pub {
margin-left:25px;
width:200px;
height:200px;
}
a.btn-myspace {
display:block;
width:243px;
height:117px;
background:url(../images/charte/btn-myspace.jpg) top left no-repeat;
}
a.btn-facebook {
display:block;
width:243px;
height:134px;
background:url(../images/charte/btn-facebook.jpg) top left no-repeat;
}
a.btn-wordpress {
display:block;
width:243px;
height:116px;
background:url(../images/charte/btn-wordpress.jpg) top left no-repeat;
}
a.btn-devis {
display:block;
width:243px;
height:126px;
background:url(../images/charte/btn-devis.jpg) top left no-repeat;
}
a.btn-plaquette{
display:block;
width:243px;
height:130px;
background:url(../images/charte/btn-plaquette.jpg) top left no-repeat;
}

a.btn-myspace:hover,
a.btn-facebook:hover,
a.btn-wordpress:hover,
a.btn-devis:hover,
a.btn-plaquette:hover {
	background-position:top right;
	}

/***************** FORM *****************/

#col2 #formulaire{
	width:300px;
	margin:0;
	padding:0;
	}
	
	
#col2 #formulaire fieldset{
	border:none;
	margin:0;
	padding:0;

	}
	
#col2 #formulaire h2 {
	margin-top:10px;	
/*	border:1px solid red;*/
	}
	
#col2 #formulaire li{
	line-height:25px;
/*	border:1px solid red;*/
	}
	
#col2 #formulaire ul{
	list-style:none;
	margin:0px;
/*	border:1px solid red;*/
	}	
	
#col2 #formulaire label, 
#col2 #formulaire input,
#col2 #formulaire textarea
{	
	display:block;
	width:280px;
/*	border:1px solid red;*/
	}
#col2 #formulaire select{
	background:#333;
	color:#F90;
	border:1px solid #666;
	}

#col2 #formulaire input 
{color:#F90;
background:#333 url(../images/charte/champ-form.gif) top left no-repeat;
width:269px;
height:21px;
border:none;
padding:3px 5px 0px 8px;
	}
	
#col2 #formulaire textarea{
color:#F90;
background:#333 url(../images/charte/champ-txt-form.gif) top left no-repeat;
width:269px;
height:97px;
border:none;
padding:8px 5px 5px 8px;
	}
		
#col2 #formulaire input.reset, #col2 #formulaire input.envoyer{
	display:inline;
	width:77px;
	background:none;
/*	border:1px solid red;*/
	}
	
	

/*form input.reset{
	background:url(../images/charte/bt-reset.gif) top left no-repeat;
	width:77px;
	height:25px;
	border:none;
	}

	
form input.envoyer{
	background:url(../images/charte/bt-envoyer.gif) top left no-repeat;
	width:77px;
	height:25px;
	border:none;
	}*/


/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer{
clear:both;
}
#clearFooter{
height:10px;/*--- = à la hauteur du footer ---*/
}

/***************** FOOTER *****************/
#footer{
position:relative;
width:990px;
height:187px;
margin:-187px auto;
clear:both;
background:url(../images/charte/bg-footer.jpg) top left no-repeat;
/*border:1px solid red;*/
}
#footer #footer-cols{
	margin:0 0 0 200px;
	padding-top:80px;
	}
#footer h2 {
font:20px Arial, Helvetica, sans-serif;	
	}

#footer p{
font:12px/30px Arial, Helvetica, sans-serif;
color:#fff;
text-align:center;
clear:left;
padding:20px 0 0 170px;
line-height:15px;
}

#footer ul {
	border-left:1px solid #ccc;
	padding:0 0 0 10px;
	font:11px Arial, Helvetica, sans-serif;
	float:left;
	list-style:none;
	margin:0 10px 0 10px;
	}

#footer a:link, #footer a:visited{
text-decoration:none;
color:#fff;
}
#footer a:hover, #footer a:active{
text-decoration:underline;
color:#999;
}