@charset "iso-8859-1";

/*******************************************************************************
*  base.css : 2004-07-08 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  base set of stylesheet rules needed to form the layout, and layout only.
*  color and fonts and such are not handled here.
*******************************************************************************/

#pageWrapper
{
	margin: 0;
	width: auto;
	min-width: 500px;
}
#outerColumnContainer
{
	z-index: 1;
}
#innerColumnContainer
{
	z-index: 2;
	width: 100%;
}
#contentColumn
{
	margin: 0 -1px;		/* without this, boxes stop floating next to 
				   each other */
	width: 100%;
}
#leftColumn, #rightColumn, #contentColumn
{
	float: left;
	position: relative;
	z-index: 10;
	overflow: visible;	/* fix for IE italics bug */
}
#rightColumn
{
	float: right;		/* floating this right allows for the right
				   column block to appear before the content
				   column in the flow of the document. doing
				   this allows for any easy 3 column layout
				   in NN4.

				   There is certainly a lot, in terms of layout
				   'theory' about how the flow of the document
				   should be. I won't get into it here. */
	width: 200px;
	margin: 0 -200px 0 1px;	/* same as in the #leftColumn selector up 
				   above. */
				   
}
#leftColumn
{
	width: 200px;
	margin: 0 1px 0 -200px;	/* like in the #contentColumn selector, without
				   the 1px margin on the opposite side of the 
				   box, boxes stop floating next to each 
				   other */
}
#footer
{
	position: relative;
}
#masthead h1
{
	display: inline;	/* personal preference to keep the header 
				   inline. you could just as easily change 
				   padding and margins to 0. */
				   
}
.clear
{
	clear: both;
}
.hide, #oldBrowserNotice, .ieSixCharDupBug
{
	display: none;		/* hide elements that CSS-targeted browsers 
				   shouldn't show */
}
html>body #innerColumnContainer
{
	border-bottom: 1px solid transparent;	/* help mozilla render borders 
						   and colors. try removing this
						   line And see what happens */
	margin-bottom: -1px;	/* hide that extra 1px being added to the bottom
				   of this column */
}
#contentColumn
{
	border-width: 0;	/* reset value from that in the version 4 
				   stylesheet. this isn't in borders.css because
				   were you to create a print.css and not 
				   include borders.css, then the v4 border would
				   still remain when you print. */
}
/*
	The below block of CSS is invalid, and will invalidate this stylesheet.
	So it is up to you to decide how you want to handle this. The below CSS
	is a fix for IE/Win to help it better handle text that is wider than 
	the available area. It does not handle this as expected, and forces the
	floated elements to start stacking. This is a very undesirable thing.
	Until a CSS-compliant way is devised, this CSS block will have to do.

	So, do you live with invalid CSS? This comes down to a sort of markup
	morals issue. Some people live and die by w3 validation. If it isn't
	valid, it isn't good. Others don't validate at all, rather focusing
	on "real-world" results.

	I think the answer might be somewhere in the middle, but perhaps 
	leaning torwards w3 validation. It's good to work torwards validation.
	Indeed, I think documents should be able to validate against a w3
	or other validator. However there are times where you will find reason
	to explicitly defy the specs and include invalid markup or CSS.

	It is already done once in the markup of this layout, using the name
	attribute of an anchor tag. That attribute is deprecated in XHTML 1
	but without it, backwards compatibility at even the most base level
	is destroyed. So I purposely break the spec in order to provide that
	backwards compatibility. Remove the one line, and it validates fine.

	I am willing to break the markup when I have a good reason. And I think
	this is the same type of situation. IE breaks horribly without this 
	fix. I am willing to include this invalid line of CSS in order to 
	keep IE happy. Using the * html selector, I know that CSS-compliant
	browsers (the ones where validation matters) won't apply this CSS block.
	Pretty much ONLY IE will apply this CSS. I have a reason to break the
	CSS, I am fairly certain of its effect on other browsers (none), and
	so I include it here.

	I could have used the conditional comments that IE supports in it's
	proprietary side of HTML. However that requires _every_ document to
	contain the extra lines necessary to do this. This removes any
	central point of control over at least some of the CSS being
	applied.

	In a template(d) environment, perhaps I would take that alternate route.
	But here, where I'm not in a template(d) environment, I choose to add
	this directly into the CSS.
*/
* html #pageWrapper
{
	word-wrap: break-word;
}

/******************************************************************************/

/*******************************************************************************
*  hnav.css : 2004-06-30 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  responsible for the horizontal navigation elements, one of which is usually
*  placed below the masthead but on top of the columns.
*******************************************************************************/

.hnav
{
	white-space: nowrap;
	margin: 0;
	padding: 3px 0 4px 0;
}
.hnav ul span.divider
{
	display: none;
}
* html .hnav/* Hide from IE5/Mac (& IE5.0/Win) */
{
	height: 1%;	/* holly hack to fix a render bug in IE6/Win */
}
* html .HNAV
{
	height: auto;	/* above IE6/Win holly hack breaks IE5/Win when page 
			   length get beyond the point that 1% height is taller 
			   than the text height. IE5/Win does not need this 
			   holly hack so we remove it here */
	padding: 0;	/* IE5/Win will resize #hnav to fit the heights of its
			   inline children that have vertical padding. So this
			   incorrect case selector will remove that padding */
}
.hnav ul
{
	text-align: center;
	list-style-type: none;
	line-height: normal;
	margin: 0;
	padding: 0;
}
.hnav ul li
{
	display: inline;
	white-space: nowrap;
	margin: 0;
}
.hnav ul li a
{
	text-decoration: none;
	margin: 0 -1px 0 0;
	padding: 3px 10px 4px 10px;
	border-left: solid 1px #000;
	border-right: solid 1px #000;
}
* html .HNAV ul li a
{
	width: 1%;	/* holly hack for IE5/Win inline padding. this 
			   hack fixes different rendering bugs in 5.0 and 5.5.
			   Width is used instead of height because if the 
			   document is too long, these elements become very tall
			   and disrupt the look of the document. too wide an 
			   element is better, visually, than too tall. */
}
.hnav ul li a:hover
{
	text-decoration: none;
}

/******************************************************************************/

/*******************************************************************************
*  colors.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  defines background and foreground colors of elements within the layout.
*  sites that want to use different color schemes for different sub-sections
*  of a website need only make different versions of this stylesheet and link
*  or import them as need. The other stylesheets can be shared across the
*  entire site.
*******************************************************************************/

body
{
	background-color: #E63135;
	/*background-color: #FFF;*/
	color: #fff;
}
#outerColumnContainer
{
	border-left-color: #eec;	/* left hand column background color */
	border-right-color: #bb8;	/* right hand column background color */
}
#masthead
{
	background-color: #FFF;
	/*background-color: #E63135; */	/*bandeau en haut*/
	color: #FFF;
	
}
#footer
{
	/*background-color: #E63135;*/
	background-color: #2a64c8;
	color: #fff;
}
#outerColumnContainer, #contentcolumn	/* selector case hack to reset version 4
					   stylesheet setting */
{
	background-color: #fff;		/* this sets the background color on the
					   center column */
	color: #000;
	
}
#leftColumn, #rightColumn, #contentColumn
{
	color: #000;
}
.vnav ul li a
{
	color: #336;
	background-color: #cc9;
}
#rightColumn .vnav ul li a:hover, .vnav ul li a:hover
{
	background-color: #336;
	color: #fff;
}
#rightColumn .vnav ul li a
{
	color: #336;
	background-color: #ddb;
}
.hnav, .hnav ul li a
{
	background-color: #cc9;
	color: #336;
}
.hnav ul li a:hover
{
	background-color: #E63135;
	color: #fff;
}
.hnav ul li.current a
{
	background-color: #E63135;
	color: #fff;
}
.hnav ul li.active a
{
	background-color: #E63135;
	color: #fff;
}


/* ---------- Menu secondaire (niveaux 2 et 3) ---------- */


#in_vmenu {
	margin: 0;
	padding: 0;
	text-align: left;
	font-family: tahoma, helvetica, arial, sans-serif;
	font-size: 110%;
}

#in_vmenu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#in_vmenu li {
	padding-top: 1px;
}

#in_vmenu li.level2 ul {
	display: none;
}

#in_vmenu li.active ul {
	display: block;
}

#in_vmenu li.current ul {
	display: block;
}

#in_vmenu li a {
	display: block;
	color: #fff;
	/*background-color: #885;*/
	background-color:#2a64c8;
	width: 89%;
	padding: 3px 14px 3px 6px;
	text-decoration: none;
	/* border-bottom: 1px solid #fff; */
	font-weight: bold;
}

#in_vmenu li a:hover {
	color: #FFF;
	background-color: #E63135;
}

#in_vmenu li ul li a {
	display: block;
	color: #fff;
	background-color: #cc9;
	width: 89%;
	padding: 3px 6px 3px 14px;
	text-decoration: none;
	/* border-bottom: 1px solid #fff; */
	font-weight: normal;
}


#in_vmenu li.active a {
   	color: #FFF;



}

#in_vmenu li.active li a {
	color: #fff;

}

/*#in_vmenu ul li.active a {
	color: #FFF;
	background-color:#E63135;
}*/

#in_vmenu li li.active a {
	color: #FFF;
	background-color:#E63135;
}


/***********************************/
#pageWrapper, #innerColumnContainer, #masthead, #footer, .hnav
{
	border-color: #000;
}

/******************************************************************************/

/*******************************************************************************
*  gutters.css : 2004-07-06 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  handles the whitespace between and within elements; such as margins and 
*  padding.
*******************************************************************************/

body
{
	margin: 0;
	padding: 2em;		/* remove this padding if you want the layout to
				   stretch from edge to edge of the viewport. */
}
p, h1, h2, h3, h4, h5, h6
{
	margin: 1em 0;		/* specifically define this for Opera's sake,
				   and also for better consistency across 
				   all platforms  */
}
.inside
{
	padding: 0 1.5em;	/* this padding is applied to every major box 
				   within the layout for a uniform gutter 
				   between borders 

				   _NOTE_: a small glitch in IE seems to appear
				   if this class has vertical padding applied
				   to it. so in cases where you want to add 
				   vert padding, use the parent element. margin
				   values here don't work because .inside has
				   a key role in border generation */
}
#leftColumn, #centerColumn, #rightColumn, #masthead
{
	padding-top: 0.5em;
	padding-bottom: 0.5em;	/* this is the vert padding talked about in the
				   previous selector. */
}
#masthead, #footer
{
	padding: 1em;
}
.vnav
{
	margin: 1em 0;
}
html>body #footer
{
	padding-bottom: 1.01em;	/* this is to fix a bug in mozilla that results
				   in a 1px line of white below the footer when
				   the document gets very long. extremely long
				   documents may generate the bug again. if
				   you experience that, increasing this value
				   may help. i think this is related to moz's
				   off-by-one troubles as the bug does not
				   occur in any other browser */
}
/******************************************************************************/

/*******************************************************************************
*  borders.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  this stylesheet defines any and all borders that are rendered on the layou.
*  this includes the left and right-hand borders of the #outerColumnContainer
*  element which are used as the backgrounds for the left and right columns.
*******************************************************************************/

#pageWrapper
{
	border-style: solid;	/* explicitly defined within eact selector in 
				   case you want change border styles (to mix 
				   it up) between elements */
	border-width: 0 1px;	/* puts a border on the left and right sides of
				   the page. #masthead and #footer will handle 
				   the top and bottom borders */
}
#outerColumnContainer
{
	border-style: solid;
	border-width: 0 200px;	/* sets the width of the borders used to create
				   the left and right columns' background 
				   color. */
}
#innerColumnContainer
{
	border-style: solid;
	border-width: 0 1px;	/* puts borders between center and the side 
				   columns. */
	margin: 0 -1px;		/* for IE's sake, we must compensate for the
				   extra 2px generated by the side borders */
}
#masthead
{
	border-style: solid;
	border-width: 1px 0;	/* handles the top of the layout's border and the
				   bottom of the masthead section */
}
.hnav
{
	border-style: solid;
	border-width: 0 0 1px 0;
}
#footer
{
	border-style: solid;
	border-width: 1px 0;	/* handles the top of the footer section and 
				   the bottom of the entire layout */
}

/******************************************************************************/

/*******************************************************************************
*  fonts.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  handles the font type (family), sizes, line-height, alignment, and any other
*  properties relating to fonts - with the exception of color.
*
*  Perhaps font color declarations should be in this file as well. 
*  However, certain CSS validators (hello w3!) will complain if colors
*  and background colors are not declared in the same selector or
*  at least within the same stylesheet. So font colors, including links,
*  are defined in colors.css.
*******************************************************************************/

body
{
	font-family: arial, helvetica, sans-serif;
	font-size: 100.1%;	/* font sizing approach recommended by Dave 
				   Silvester on the css-discuss list. "the 
				   .1 is important." */
}
#pageWrapper
{
	font-size: 80%;
}
#footer
{
	text-align: center;
}
/* :root is an invalid pseudo class but mozilla knows it */
:root code
{
	font-size: 120%;	/* monospace fonts are typically smaller that 
				   'normal' fonts under Mozilla. */
}

/*
	Time to try and get all the heading elements to the same size 
	regardless of browser. (IE seems to put them a big bigger
	than Mozilla, typically.)
*/
h1
{
	font-size: 210%;
	color: #2a64c8;
	/*border-bottom: solid 2px #ff7f00;*/
	border-bottom: solid 2px #E63135
	
}
h2
{
	font-size: 180%;

}
h3
{

	font-size: 140%;
	color: #2a64c8;
	font-family:Comic Sans MS;

}
h4
{
	font-size: 126%;
}
h5
{
	font-size: 110%;
}
h6
{
	font-size: 100%;
}

/******************************************************************************/