/* Feuille de style pour la charte graphique du site
 * Cette feuille de style est appelée depuis style.css.
 */

/***************** STRUCTURE *****************/
body{
	margin: 15px 0;
	padding: 0;
	text-align: center;
    font: 0.75em Arial, helvetica, sans-serif;
	color:#000;
	background: #FFF;
}
#container{
	position:absolute;
    
    width: 800px;
    height: 702px;
    left: 50%; 
margin-left: -400px; /* moitié de la largeur */
	text-align: left;
	border: 0px solid #000;
}

#copyright{
position:absolute;
left:0px;
bottom:80px;
font-size:0.9em;
}

#copyright-right{
position:absolute;
right:0px;
bottom:80px;
font-size:0.9em;
}

#container2{
	position:absolute;
    left: 50%; 
    width: 872px;
    height: 654px;
    margin-left: -436px; /* moitié de la largeur */
	text-align: left;
}

#bg-1{
	background: url(../images/charte/bgleft.png) no-repeat left top;
	left:0;
	height: 539px;
	width: 436px;
	top:0;
	cursor:pointer;
}

#bg-2{
	position:absolute; 
	right:0;
	background: url(../images/charte/bgright.png) no-repeat right bottom;
	height: 654px;
	width: 436px;
	top:0px;
	cursor:pointer;
}
#liens_gauche{
	position:absolute;
	left:0;
	bottom:0;
}

#liens_droite{
	position:absolute;
	right:0;
	bottom:0;
}


#contact_htdroite{
	position:absolute; 
	text-align:right;
	right:0;
	top:0;
}

#contact_htgauche{
	position:absolute; 
	text-align:right;
	text-align:left;
	left:0;
	top:0;
}

#textebg, #texterightbg{
 /* for IE */
  filter:alpha(opacity=80);
  /* CSS3 standard */
  opacity:0.80;
  /* for Mozilla */
  -moz-opacity:0.80;
position:absolute;
bottom:38px;
left:38px;
}

#texterightbg{
width: 592px;
height: 180px;
}

#textebg{
width: 592px;
height: 170px;
}

#texte{
color:#000;
width: 562px;
height: 160px;
}

#textebon{
color:#000;
width: 567px!important;
width: 562px;
height: 160px;
}

#textebon2{
color:#FFF;
width: 567px!important;
width: 562px;
height: 160px;
}

#texteright{
color:#fff;
width: 562px;
height: 170px;
}

#texte, #texteright{
position:absolute;
bottom:38px;
left:38px;
margin:10px 5px 0px 15px;
}

#textebon{
position:absolute;
top:298px;
left:38px;
padding:10px 15px 0px 15px;
background:url(../images/charte/fd-vert.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/fd-vert.png', sizingMethod='scale');
}

#textebon2{
position:absolute;
top:298px;
left:38px;
padding:10px 15px 0px 15px;
background:url(../images/charte/fd-bleu.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/fd-bleu.png', sizingMethod='scale');
}

#agence_culture #textebg{
height: 270px;
}

#agence_culture #textebon{
position:absolute;
top:188px;
height: 270px;
}


/* MENU RETOUR */

#retour-accueil{
position:absolute;
right:168px;
top:62px;
width:18px;
height:14px;
}
#retour-accueil2{
position:absolute;
left:88px;
top:62px;
width:18px;
height:14px;
}

#retour-accueil3{
position:absolute;
left:318px;
top:61px;
width:18px;
height:14px;
}

#retour-accueil ul, #retour-accueil2 ul, #retour-accueil3 ul  {
list-style-type:none;
list-style-position:outside;
}
#retour-accueil li, #retour-accueil2 li, #retour-accueil3 li  {
float:left;
width:18px;
cursor: pointer;
line-height:14px;
height:14px;
}

#retour-accueil li a, #retour-accueil2 li a, #retour-accueil3 li a    {
display:block;
text-decoration: none;
height:14px;
background:no-repeat scroll left top;
}

#retour-accueil li a span, #retour-accueil2 li a span, #retour-accueil3 li a span{
display:none;
}
#retour-accueil li a.bt1{
	background-image:url(../images/charte/retour-agence.png);
}
#retour-accueil2 li a.bt2{
	background-image:url(../images/charte/retour-metier.png);
}
#retour-accueil3 li a.bt3{
	background-image:url(../images/charte/retour-portfolio.png);
}

#retour-accueil li a:hover,#retour-accueil2 li a:hover,#retour-accueil3 li a:hover{
background-position:left bottom;
}


#textebg{
background-color:#C5C64F;
}

#texterightbg{
background-color:#6A9AAB;
}

#texte_portfoliobg{
 /* for IE */
  filter:alpha(opacity=60);
  /* CSS3 standard */
  opacity:0.60;
  /* for Mozilla */
  -moz-opacity:0.60;
position:absolute;
width: 242px;
height: 150px;
bottom:275px;
left:400px;
background-color:#916F44;
}

#texte_portfolio{
position:absolute;
width: 232px;
height: 140px;
bottom:275px;
left:400px;
color:#fff;
margin:10px 5px 0px 5px;
}

#portfolio_menu{
position:absolute;
width: 120px;
height: 350px;
bottom:100px;
left:0px;
line-height:1.4em;
text-align:right;
}


#portfolio_video{
position:absolute;
width: 376px;
height: 300px;
bottom:105px;
left:136px;
color: #fff;
}

#portfolio_comment{
position:absolute;
width: 396px;
height: 80px;
bottom:10px;
left:138px;
color: #fff;
}

#equipe{
position:absolute;
width: 460px;
height: 372px;
bottom:45px;
left:29px;
text-align:justify;
}

#listing_equipe{
position:absolute;
width: 168px;
height: 372px;
bottom:45px;
left:500px;
border-left: 2px solid #833341;
}

#metier_accueil, #metier_action, #metier_production, #metier_conseil, #portfolio_print , #portfolio_accueil, #portfolio_photovideo{
	position:absolute; 
	width: 672px;
    height: 506px;
	right:0;
	top:95px;	
}
#metier_accueil{
	background-image:url(../images/charte/bg_metier_accueil.jpg);
}

#metier_action{
	background-image:url(../images/charte/bg_metier_action.jpg);
}

#metier_production{
	background-image:url(../images/charte/bg_metier_production.jpg);
}

#metier_conseil{
	background-image:url(../images/charte/bg_metier_conseil.jpg);
}

#metier_accueil h1, #metier_action h1, #metier_production h1, #metier_conseil h1{
float:right;
margin-right:42px;
margin-top:30px;
width:330px;
height:77px;
background:url(../images/charte/titre_metier.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/titre_metier.png', sizingMethod='scale');
}

#metier_accueil h1 span, #metier_action h1 span, #metier_production h1 span, #metier_conseil h1 span{
display:none;
}

#portfolio_print{
background-color:#916F44;
}

#portfolio_accueil{
	background-image:url(../images/charte/bg_portfolio_accueil.jpg);
}

#portfolio_photovideo{
background-color:#000;
}

#portfolio_print h1, #portfolio_accueil h1, #portfolio_photovideo h1, #portfolio_photo h1{
margin-left:431px;
width:212px;
height:32px;
margin-top:30px;
background:url(../images/charte/titre_portfolio.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/titre_portfolio.png', sizingMethod='scale');
}

#portfolio_print h1 span, #portfolio_accueil h1 span, #portfolio_photovideo h1 span, #portfolio_photo h1 span{
display:none;
}

#agence_accueil, #agence_culture, #agence_equipe, #references, #agence_zoom{
	position:absolute; 
	width: 672px;
    height: 506px;
	left:0;
	top:95px;	
}

#agence_accueil h1, #agence_culture h1, #agence_equipe h1, #agence_zoom h1{
margin-left:29px;
width:155px;
height:32px;
margin-top:30px;
background:url(../images/charte/titre_agence.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/titre_agence.png', sizingMethod='scale');
}

#agence_accueil h1 span, #agence_culture h1 span, #agence_equipe h1 span, #agence_zoom h1 span{
display:none;
}

#galerie_references{
width:475px;
margin:20px auto;
}

#galerie_references img{
border:0;
margin-right:10px;
margin-bottom:10px;
}

#references h1{
margin-left:33px;
width:253px;
height:43px;
margin-top:30px;
background:url(../images/charte/titre_reference.png) repeat-y scroll center top;
_background:url();
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/charte/titre_reference.png', sizingMethod='scale');
}

#references h1 span, #references h1 span, #references h1 span, #references h1 span{
display:none;
}

#menu_agence, #menu_metier, #menu_portfolio, #menu_reference, #menu_reference2, #menu_metiertest, #menu_metiernew{
	position:absolute; 
	width: 237px;
    height: 166px;
	z-index:99999;
}

#menu_agence{
	right:6px;
	bottom:13px;		
}

#menu_portfolio{
	left:4px;
	top:7px;	
}

#menu_reference{
	right:6px;
	top:7px;	
}
#menu_reference2{
	left:0px;
	bottom:0px;	
}
#menu_metier{
	left:3px;
	bottom:13px;			
}

#menu_metiernew{
	right:6px;
	top:7px;				
}

#menu_metiertest2{
	left:3px;
	top:523px;			
}

#agence_accueil{
	background-image:url(../images/charte/bg_agence_accueil.jpg);
}

#agence_culture{
	background-image:url(../images/charte/bg_agence_culture.jpg);
}

#agence_equipe{
	background-color:#C5C64F;
}

#references{
	background-color:#3B3041;
}

#agence_zoom{
background-image:url(../images/charte/bg_agence_zoom.jpg);
}

#references{
background-color:#3B3041;
}

p {
margin:0 0 1em 0;
}

h1, h1.droite{
color:#fff;
margin-left:10px;
font-size:3.2em;
}

h1.droite{
text-align:right;
}

h2, h2.droite{

margin-left:10px;
margin-top:0px;
letter-spacing: 0.1em;
}

h2{
color:#833341;
}

h2.droite{
color:#fff;
}

h3{
color:#833341;
margin-left:10px;
margin-top:30px;
letter-spacing: 0.1em;
}

.titre{
color:#833341;
margin-left:0px;
font-size:1.5em;

}
.gras{
font-weight:bold;
}


a:link{
font-weight:bold; color:#000; text-decoration:none;
}
a:visited{
font-weight:bold; color:#000; text-decoration:none;
}
a:hover{
font-weight:bold; color:#000; text-decoration:underline;
}

a:link.liens{
color:#833341; text-decoration:none;
}
a:visited.liens{
color:#833341; text-decoration:none;
}
a:hover.liens{
color:#000; text-decoration:underline;
}

a:link.equipe{
color:#000; text-decoration:none;
display:block;
margin:0 0 0 10px;
letter-spacing: 0.1em;
}
a:visited.equipe{
color:#000; text-decoration:none;
display:block;
margin:0 0 0 10px;
letter-spacing: 0.1em;
}
a:hover.equipe{
color:#000; text-decoration:underline;
display:block;
margin:0 0 0 10px;
letter-spacing: 0.1em;
}

#portfolio_menu a:link, #portfolio_menu a:visited{
font-weight:bold; color:#AC9775; text-decoration:none;
}
#portfolio_menu a:hover, #portfolio_menu a:active{
font-weight:bold;
color:#000;
text-decoration:none;
}

#portfolio_menu .encours{
font-weight:bold; color:#000; text-decoration:none;
}



/**********************************************
menu */

ul#menu {
position:absolute;
list-style-type: none;
left:0px;
top:63px;
width:402px;
height:23px;
list-style-type:none;
list-style-position:outside;
margin: 0 0 -5px -5px;
padding:0;
}


ul#menu li{
float: left;
margin: 0 5px;
width:124px;
height:23px;
line-height:23px;
cursor: pointer;
}

ul#menu li a {
text-decoration: none;
display:block;
height:23px;
background:no-repeat scroll left bottom;
}
ul#menu li a span {
display:none;
}


#menu li a.btculture{
	background-image:url(../images/charte/btculture.png);
	width:124px;
}
#menu li a.btequipe{
	background-image:url(../images/charte/btequipe.png);
	width:124px;
}
#menu li a.btzoom{
	background-image:url(../images/charte/btzoom.png);
	width:124px;
}


ul#menu li a:hover{
background-position:left top;
}

#menu li#encours a{
background-position:left top;
}

ul#menu a span {
display:none;
}


ul#menuright {
position:absolute;
right:0px;
top:63px;
padding:0;
height:23px;
list-style-type:none;
list-style-position:outside;
margin: 0 0 -5px -5px;
}


ul#menuright li{
float: left;
margin: 0 5px;
width:124px;
height:23px;
line-height:23px;
cursor: pointer;
}

ul#menuright li a {
text-decoration: none;
display:block;
height:23px;
background:no-repeat scroll left bottom;
}
ul#menuright li a span {
display:none;
}

#menuright li#encours a{
background-position:left top;
}

#menuright li a.btconseil{
	background-image:url(../images/charte/btconseil.png);
	width:124px;
}
#menuright li a.btproduction{
	background-image:url(../images/charte/btproduction.png);
	width:124px;
}
#menuright li a.btaction{
	background-image:url(../images/charte/btaction.png);
	width:124px;
}
#menuright li a.btphoto{
	background-image:url(../images/charte/btphoto.png);
	width:124px;
}
#menuright li a.btvideo{
	background-image:url(../images/charte/btvideo.png);
	width:124px;
}
#menuright li a.btprint{
	background-image:url(../images/charte/btprint.png);
	width:124px;
}

ul#menuright li a:hover{
background-position:left top;
}


#texte_portfolio{
width:230px;
}

/************* Images ********************************/
.imageright {
	float: right;
	margin:0em 0em 1em 1em;
	border:none;

}
.imageleft {
	float:left;
	margin:0em 1em 1em 0em;
	border:none;
	/*padding-top: 20px;*/
}

img{
border:0;
}