/* 

copyright + credits{	
	copyright-CCT : tous droits réservés;
	email: ;
	you-may: take and use elements of this css. however, the unique combination of layout, font styles, colours etc. is copyrighted;
	you-may-not: use any of the graphical elements on this site !important;
	many-thanks: Jean-Philippe Choinière & Michaël Simard for this web site;
} 

*/



/*
===== CONTENTS =====

	last-updated: 31 May 2005;

	1: Universal Reset 
	2: Html and Body
	3: General Layout
	4: Header Stuff
	5: Main Content
	6: Content Style and Layout
	7: Footer

====================
*/

/*
===== 1: universal reset =====
*/

*{
/* set the fonts to a uniform size, including form fields as well as all headings etc. */
	font-size:100%;
	margin:0;
	padding:0;
}


a{color:#913C39;}
a:hover{color:#464646;}

ul {list-style: none;}

.hidden{display:none;}

em{color:#7a5a57;font-style:normal;}

i{color:#913C39;font-style:normal;}


.quote{ /*<blockquote class='quote'>*/
	background:transparent url('../gabarit/quote.gif') top left no-repeat;
	color:#9A4944;
	padding:0 0 0 20px;
	position:relative;		
	text-align:justify;
}

.unquote{ /* <p class='unquote'>*/
	background:transparent url('../gabarit/unquote.gif') bottom right no-repeat;
	padding:0 10px 0 0;
}


/*
===== 2: html and body =====
*/

html{
	min-width:770px;
}

body{
	background-color:#f1ede4;	
	color:#464646;
	font: 75%/150%  "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	margin:0px;	
	/* align ie5 center screen */
	text-align:center;	
}


/*
===== 3: general Layout =====
*/



#top{
	background:#FFF url(../gabarit/layout/bg_top.gif) repeat-x;
	width:100%;	
}

#bottom{
	background:#f1ede4 url(../gabarit/layout/bg_bottom.gif) repeat-x;		
	height:44px;
	padding-top:43px;
	width:100%;	
	z-index:0;
}

.global{
	background: url(skin/gabarit/layout/bg2_center.jpg) 0 0 repeat-y;	
	margin:0px auto 0 auto;	
	position:relative;	
	/* recover from ie5 work around on the body*/
	text-align:left;
	width:744px;
	z-index:0;	
}




/*
===== 4: Header Stuff =====
*/

#header{  
	background:url(../gabarit/layout/header_shadow.jpg) 0 0 no-repeat;	  
    left:0px;   
    height:111px;  
    position:relative;
    padding-top:6px;
    padding-left:11px;
    width:744px;    
}

#header h1 {
	background:  url(../gabarit/header/logo.jpg) no-repeat;	
	height:87px;
	overflow: hidden;
	position:relative;
	width:238px; 	
	text-indent: -32000px;	
}

/* Bannieres des pages */
h1.titres {text-indent: -9999px;overflow: hidden; width:422px; width:100%;  height:156px;}

#nav{	
	height:55px;
	position:absolute;	
	right:10px;
	top:0;	
	
	width:475px;	
}

/*#nav a {position:relative;display: block;height: 56px;border:none;text-decoration:none;}*/
#nav a:hover {background-position: 0 -56px;}
#nav a:active, #nav a.selected {background-position: 0 -112px;}

#nav ul li {float: left;}

#nav  a{
	display: block; 	
	height:56px;		
	position:relative;	
	text-indent:-3000px;	
	text-decoration:none;
}

#langue{ position:absolute; top:75px; right:40px;}

.l_francais a, .l_anglais a{
	display: block; 		
 	height: 41px;
 	position:relative; 	
 	text-indent:-3000px;
 	text-decoration:none; 
 	width: 56px;
}

.l_francais a{background: url(../gabarit/layout/lg_02.jpg) 0 0 no-repeat;}
.l_anglais a{background: url(../gabarit/layout/lg_01.jpg) 0 0 no-repeat;}
.l_francais a:hover, .l_anglais a:hover, .l_francais a:active, .l_anglais a:active{  background-position: 0 -41px;}



/*
===== 5: Main Content =====
*/

.contenu_box{    
    display:block;   
    left:20px;
    padding-left:15px;
    position:relative;
    width:700px;   
}

.contenu_box p, .contenu_box h1 {
    position:relative;
    z-index:50;   
}

#contenu_main{	
	display:block;
	padding-top:30px;	
	position:relative;
	width:744px;	
}
	
#contenu_bottom{
	background:transparent url(../gabarit/layout/bg_centent_bottom.gif) repeat-y;	
	display:block;	
	position:relative;			
	top:20px;
	width:744px;   
}

#contenu_bottom .contenu_box{    
	width:675px; 
	z-index:80;
}



.transition{
	background: transparent url(../gabarit/layout/bg/transition.jpg) no-repeat;
	height: 122px;
	left: -26px;
	position: relative;		
	width: 725px;
	z-index: 15;
}

.transition h2{
	height:28px;
	left:0;
	position:absolute;
	text-indent: -9999px;
	top:85px;
}


/*
===== 5: Content Style and Layout =====
*/

.note{
	background:transparent url(../gabarit/layout/note_bg.gif) 0 0 repeat-x;
	display:block;
	padding: 20px 4px 0px 10px;
 	position:relative;	
 	height:125px;
 	min-height:125px;
}

div[class] .note{height:auto;}

.note .side{
 	background: url(../gabarit/layout/note_side.gif) 0 0 repeat-x;
 	height:51px;
 	position:absolute;
 	right:0;
 	top:0;
 	width:45px;
}
.note h3{margin:0 0 5px 0;}

.note ul{
    position:relative;
	font: 90%/150%  "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	margin-left:15px;	
	z-index:50;
}

.note ul li{
	background: transparent url('../gabarit/bullet_arrow_left.gif') top left no-repeat;
	padding:0 0 6px 14px;	
}




.card{
	clear:both;
	background:transparent url(../gabarit/layout/card_bg.gif) 0 0 repeat-x;
	display:block;	
	padding:5px 5px 20px 10px;
	position:relative;
}

* html .card{padding:5px 5px 5px 5px;}

.card:hover .side, * html .card .side{
 	background: url(../gabarit/layout/card_side.gif) 0 0 repeat-x;
 	height:44px;
 	position:absolute;
 	right:0;
 	top:0;
 	width:56px;
}

.card img{float:left;}


.card b{
	font: 90%/150%  "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	list-style-image:url('../gabarit/bullet_red.gif');	
	margin-left:15px;	
}

.card h2{margin:10px 0 10px 0;}



.internal_menu{
	background:transparent url('../gabarit/layout/internal_menu_bg.jpg') top left no-repeat;
	height:157px;	
    position:relative;   
    width:402px;   
    padding-bottom:20px;
    z-index:70;
}

.internal_menu_top{
	background:transparent url('../gabarit/layout/internal_menu_top_bg.jpg') top left no-repeat;
    height:65px;
    left:-25px;
	margin-bottom:-25px;
	padding-top: 18px;
	position:relative;  
	top:-18px;
	width:650px;
	z-index:50;
}

.internal_menu ul {
	left:20px;
	position:relative;
	top:25px;	
}

.internal_menu_top ul {
	left:22px;
	position:relative;   

}

.internal_menu ul li {
    background:transparent url('../gabarit/bullet_arrow_left.gif') top left no-repeat;
    margin-bottom:10px;

}
.internal_menu_top ul li {
	background:transparent url('../gabarit/bullet_arrow_left.gif') top left no-repeat;
	float:left;
	margin-right: 26px;
}

* html .internal_menu ul li { background-position: 2px 0;}
* html .internal_menu_top ul { margin-left:10px; padding-left:5px;padding-right:5px;}

.internal_menu ul li a {
	color:#555;
	cursor:pointer;	
	font-size:11px;	
	margin-left:15px;
	display:block;
}

.internal_menu_top ul li a {	
	color: #555;
	cursor: pointer;
	font-size: 11px;
	margin-left:15px;

}

.internal_menu ul li a:hover, .internal_menu_top ul li a:hover{
	color: #000;
	text-decoration: underline;
}

.internal_menu ul li a:active, .internal_menu_top ul li a:active{
	color:#000;
	font-weight:bold;
}

.internal_menu ul li a:active{
	color:#000;
	font-weight:bold;
	padding-right:0px;
}

.internal_menu ul li .selected{
	font-weight: bold;
	background: transparent url('../gabarit/bullet_arrow_left_s.gif') no-repeat;
	background-position: bottom left;
	color: #4B4B4B;	
	display: block;
	width: 354px;	
}

.internal_menu_top ul li .selected{
	color: #4B4B4B;
	font-weight: bold;	

}



/*
===== 7: footer =====
*/


#footer_bg{
	background: url(../gabarit/layout/footer_shadow.gif) no-repeat;
	bottom: -1px;
	height: 102px;
	margin-left: -9px;
	position: absolute;
	width: 744px;
}

#footer{
	background:#fff;	
	display:block;
	height:2em;
	margin: auto 10px auto 9px;
    position:relative;
	width:724px;	
}

#footer p {	
	color:#777;    
	font-size:80%;	
	height:2em;
	left:0px;
	margin: 5px 0 0 0;
	overflow:hidden;
	padding:0 25px 0 25px;   
    position:relative;
    z-index:12;
}

#footer .copy{
	display:block; 	 	
 	float:left;
 	text-align:left;
}

#footer .w3c{   
	display:block;
	padding-top:2px;
 	position:relative; 
 	text-align:right;
 	
}

#footer p:hover {font-size:80%;}
