/* 2009 - 2010 (c) | ez-css.org
* ez-start-3B ::  version 1.0 (03142010)
*
* Three columns with header and footer, main content (middle column) comes last. 
*
*
* You should replace the following rule with your own reset or base styles sheet
* visit: http://carsonified.com/blog/design/setting-rather-than-resetting-default-styling
*/

/*
* {
margin: 0;
padding: 0;
}
*/
html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, font, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td { 
margin:0px; 
padding:0px; 
}


/*
* To set the width of the main wrapper
* Using percentage makes this layout fluid
* min and max-width are not supported in IE 5/6 
*/

#wrapper {
width: 850px;
/*min-width: 850px;
max-width: 1200px;*/
}

/*
* You can use this wrapper for the faux-column technique
* Check http://www.alistapart.com/articles/fauxcolumns/
*/

#body {
margin: 10px 0;
padding: 10px 0;
/*border-bottom: 1px solid #555;*/
/*border-top: 1px solid #555;*/

}

/*
* These elements needs a width
*/

#aside,
.aside {padding-top:20px}

/*
* Unlike the two sidebars, this element does *not* need a width
*/

#article {
padding:0 25px;
}

/**********************************************************************************
Below this comment are the core rules, there should be no need to edit any of them
**********************************************************************************
*
* auto-centering in IE 5
* we reset this value in the next rule so content is left aligned. 
*/

body {
	text-align: center;
	background-color:#FEF767;
	}

/* 
* margin "auto" is to center this element (we set the width in a separate rule near the top of this styles sheet).
* "text-align" is to reset the declaration from "body".
* "inline:block" is to create a block-formatting context (the "width" does that in IE).
*/

#wrapper {
margin-right: auto;
margin-left: auto;
text-align: left;
display: inline-block;
}

/*
* this is the clearfix method
* we rely on this to contain floats in "stand-alone" modules 
*/

#header:after,
#body:after,
#footer:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/*
* hacks for IE
* "min-height" triggers "hasLayout" in IE 7, 
* "height" is the trigger for IE 5 and 6.
*/

#header,
#body,
#article,
#footer {
min-height: 0;
}    

* html #header,
* html #body,
* html #article,
* html #footer {height: 1%;}  

/*
* this element must create a new block formatting context.
   	* by default, we rely on "overflow:hidden", but if this creates an issue with your design, then apply to this element one of the following rules 
* ez-oa
* ez-dt 
* ez-it
* ez-tc
* ez-ib
*/

#article {overflow: hidden;}

/*
* rules to apply to the middle column if the styling above (overflow:hidden) creates issues with your design
*/

.ez-oa {overflow: visible; overflow: auto;}
.ez-dt {overflow: visible; display: table;}
.ez-it {overflow: visible; display: inline-table;}
.ez-tc {overflow: visible; display: table-cell;}
.ez-ib {overflow: visible; display: inline-block;}

/* 
* 1st column
*/

#aside {
float : left;
font-variant : small-caps;
text-decoration : none;
color : #ec3d24;
}

/* 
* 3rd column
*/

.aside {float: right;}

/**********************************************************************************
***   The above are core rules, there should be no need to edit any of them    ***
**********************************************************************************/

/* TYPOGRAPHY */	
body{
	font: normal 12px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
	/*color : #666;*/
       color : #2E6598;
}
p {margin: 10px 0 10px 0;text-align:justify;}

h1 {
  font: normal 35px/45px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin:0 0 10px 0;
  padding:0 0 15px 0;
  color: #D20000;
}
	
h2 {
  font: normal 27px/40px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #D20000;
}
	
h3 {
  font: normal 23px/40px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #D20000;
}



h4 {
  font: normal 19px/40px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #D20000;
}
	
h5 {
  font: bold 15px/20px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #D20000;
}
	
h6 {
  font: bold 13px/20px 'Lucida Grande','Lucida Sans Unicode', arial,Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #D20000;
}

/*
img{
	padding : 0.5em;
}
*/


/**********************************************************************************
				MENU
**********************************************************************************/

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.menu {width:648px; height:32px; position:relative; z-index:100;border-right:0px solid #585752; font-family:arial, sans-serif; padding-left:200px}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:746px; w\idth:745px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
.menu ul ul {width:129px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:129px;position:relative;text-align:center}
/* style the links for the top level */
.menu a, .menu a:visited {display:block;font-size:12px;text-decoration:none; color:#fff; width:128px; height:30px; border:1px solid #585752; border-width:0px 0 0px 0px; background:#ec3d24; padding-left:0px; line-height:29px; font-weight:bold;}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:129px; w\idth:128px;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#d4d8bd url(http://www.cssplay.co.uk/menus/breadcrumbs/grey-arrow.gif) no-repeat 130px center;}
/* style the second level hover */
.menu ul ul a.drop:hover{background:#c9ba65 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
.menu ul ul :hover > a.drop {background:#c9ba65 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#e2dfa8;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#b2ab9b;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden; position:absolute;height:0;top:31px;left:0; width:129px;border-top:1px solid #000;}
/* another hack for IE5.5 */
* html .menu ul ul {top:30px;t\op:31px;}

/* position the third level flyout menu */
.menu ul ul ul{left:129px; top:-1px; width:129px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-129px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:#e5e1d6; color:#000; height:auto; line-height:1em; padding:5px 10px; width:128px;border-width:0 1px 1px 1px;}
/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:130px;w\idth:128px;}

/* style the top level hover */
/*.menu a:hover, .menu ul ul a:hover{color:#000; background:#fcd6a7;}
.menu :hover > a, .menu ul ul :hover > a {color:#000; background:#fcd6a7;}
*/
.menu a:hover, .menu ul ul a:hover{color:#000; background:#f4ab34;}
.menu :hover > a, .menu ul ul :hover > a {color:#000; background:#f4ab34;}


/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible;}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}

/******************************************************************************************
 * le breadcrumb
*******************************************************************************************/

#breadcrumb li { 
display : inline;
padding : 0 0.5em; 
}
#breadcrumb ul {
list-style-type : none; 
}


/* -- pour affichage mimetype -- */
a[href$=".pdf"]  {
    background: url(../../images/mime/pdf.png) top left no-repeat;
    padding-left:16px;
}
a[href$=".doc"]  {
    background: url(../../images/mime/doc.png) top left no-repeat;
    padding-left:16px;
}
a[href$=".xls"]  {
    background: url(../../images/mime/xls.png) top left no-repeat;
    padding-left:16px;
}


/******************************************************************************************
 * le header
*******************************************************************************************/
#header{
	 background: transparent url(images/logo_metassi-header.png) left top no-repeat;
	height:143px;
/*	border:1px solid red;*/
padding-bottom : 20px;
}

#header .tagline{
	text-align:center;
	padding-left:200px;
	vertical-align:middle;
	height:143px;
	/*display:table-cell;*/
	/*border:1px solid green;*/
	/* background: transparent url(images/haut.jpg) right top no-repeat;*/

}

#footer{
	text-align:center;
}

.smallEditOn{
	font-size:10px;
	font-style:italic;
	font-weight:normal;
}

/*menu de droite*/
.menu_aside{
width:180px; position:relative; z-index:100;font-family:arial, sans-serif;
font-variant:normal;text-align:right
}

.menu_aside ul {padding:0;margin:0;list-style-type:none;width:128px}

.menu_aside a, .menu_aside a:visited {display:block;font-size:12px;text-decoration:none; color:#fff; height:30px; border:1px solid #585752; border-width:0px 0 0px 0px; background:#ec3d24; padding:2px; line-height:29px; font-weight:bold;margin-bottom:2px;padding-right:10px}

.menu_aside a:hover, .menu_aside ul ul a:hover{color:#000; background:#f4ab34;}
.menu_aside :hover > a, .menu_aside ul ul :hover > a {color:#000; background:#f4ab34;}