/************ General Presentation **************/

/* All colors */
/* The global dark blue : #2E8FC6 */
/* The blue of the title : #1C5B9E */

body,

	html {
		margin:0;
		padding:0;
		background:#BABAAB;
		color:#000;
		font: small "Trebuchet MS",Verdana,Arial,Sans-serif;
		font-size: 10pt
	}


/* Comon colors to headers */
h1, h2, h3, p.color
{
color: #1C5B9E; 
}


/* Specific */

h1
{
  font-weight:normal;
  /* Leave some space on top and bottom */
  padding-top:10px;
  padding-bottom:20px;
  margin:0;
  font-size: 20pt;
  /* Allways start correctly */
  clear:left;
}

h2
{
font-size:large;
}

h3
{
  margin-top:20px;
  margin-bottom:0px;
  font-size:medium;
  background-color: #FFFFFF;
}

p.color
{
  margin-top:5px;
  margin-bottom:5px;
font-size:10pt;
background-color: #FFFFFF;
}

/* A Pseudo style to separe to paragraphes */
br.space
{
  clear:left;
 /* line-height:60px; */
}


/* Global Style of lists */
ul
{
   list-style-image: url("images/Theme/bullet10x10.png");
 /* in case image not understood */
 list-style-type: circle ;
}


/* Style for big event titles */
.event
{
font-family: Verdana Black, Arial Black;
font-size: x-large;
text-align: center;
}


/************* Control of block level elements ************/

p {
text-align:justify;
}

/* Common header for every pages , it is unique so it is an id */


#header {
		background:#A3CFEC;
		height: 70px;
		vertical-align: bottom;
		padding: 10px 0px 0px 10px;
		color: white;
		font-size: 40px;
		font-weight: bold;
		border-bottom: solid 1px white;
	}
	
/* A trick found in http://phrogz.net/CSS/vertical-align/index.html */
/* Othewise, vertical align is not possible automatically */
	
#header span {
padding-top:10px;
}
/* Image ar the header are reduced and put on the left */

#header img {
/* to correct the 10px of padding vertically and have a full sized image */
/* WARNING remove all widh in the HMTL source for the image to avoid distortion */
text-align:right;
height: 70px;
position: relative;
top:-5px;
float: right;
}

#nav {
  background:#2E8FC6;
  padding: 5px 5px 5px 10px;
  color: white;
  border-bottom: solid 1px white;
  /* Because image in the header are float right */
  /* this is mandatory for forcing menu item to be below images */
  clear:both;
}

/* Special definition for navgation in the text */

ul.nav {
list-style-type: none;
}

a.nav {
  background:#2E8FC6;
  color: white;
  width=100px;
  border-bottom: solid 1px white;
}

a.nav:link {color: white; text-decoration:none}
a.nav:visited {color: white; text-decoration:none}
a.nav:hover {color: #1C5B9E; font-weight:bold;}
a.nav:active {color: #FF0000;}

/* Global link apearance */
	
a:link {color: #000000;font-weight:bold; }
a:visited {color: #000000;font-weight:bold;}
a:hover {color: #1C5B9E; font-weight:bold;}
a:active {color: #FF0000;}

/* Special link */
h2 a:link {color: #1C5B9E ;font-weight:bold; }
h2 a:visited {color: #1C5B9E;font-weight:bold;}


/* Special behavior of link in the navigate top bar */

#nav a {padding-left: 0px;}
#nav a:link {color: white; text-decoration:none}
#nav a:visited {color: white; text-decoration:none}
#nav a:hover {color: #2E8FC6; background-color: #A3CFEC}
#nav a:active {color: red; background-color: #A3CFEC}



/* To use on the image menu item */
.img_menu_item
{
border: 0px solid ; width: 140px; height: 46px;
}

/* The div that wrap the all page */
#wrap
{
border-left: 15px solid #2E8FC6;
border-right: 15px solid #2E8FC6;
background: #A3CFEC;
margin: 0 auto;
}

/* Special for the bend image script */
/* For the case javascript is disable */
/* zero opacity and non display is not applied to the first img */
/* The syntax img + img means to apply if the previous is img */
.blend img + img {
  /* Different syntax opacity for all navigators */
  opacity: 0;
  -moz-opacity: 0;
  -khtml-opacity:0;
  filter: alpha(opacity=0);
  /* Important : images are not displayed yet */
  /* Othewise the page is artifically too big */
  display:none;
}

/* Left block part */

#leftBlock {
	background:#A0E3F3;
	float:right;
	width:200px;
	height: 600px;
	position:relative;
/* all start at 10px */
padding-left: 0px;
	}
	
#leftBlock img {
position: relative;
left: 0px;
}

/* Global page content */
#content
{
/* To align everithing inside to the top menu */
padding-left: 10px;
/* the size of the left block + 10 */
padding-right: 220px;
padding-bottom: 200px;
background:#FFFFFF; 
/*		float:left; */
/*		width:750px; */
/* To avoid content goes under the menu */
/* margin-left: 150px; */
/* font-family: Verdana, Arial, Helvetica, sans-serif;*/
/* font-family: Arial,Helvetica,sans-serif; ; */
}


#contentFull
{
/* To align everithing inside to the top menu */
padding-left: 10px;
/* the size of the left block + 10 */
padding-right: 10px;
padding-bottom: 200px;
background:#FFFFFF; 
}



/* Special case for publication page */
/* Used only to redefine <li> with more space and no change in the source */
/* Only change <div id="content"> to <div id="content_publication"> */
#content_publication
{
/* To align everithing inside to the top menu */
padding-left: 10px;
/* the size of the left block + 10 */
padding-right: 220px; 
padding-bottom: 200px;
background:#FFFFFF; 
}

#content_publication li 
{
/*background:#FFFFD8; */
margin-bottom: 4pt;
}

/* Some formats */


/* A image at left and a description */

img.leftFloat {
  float:left;
  margin-right:10px;
}


p.imageDescr {
  margin-left: 10px;
}

#footer {
		background:#F0F0F0;
		clear:both;
		text-align: center;
		padding: 5px;
		font-size: 11px;
		margin-bottom: 20px;
	}


/* Style for description : dt dl */

dl.table-display
{
/*width: 41.1em;*/
margin: 2em 0;
padding: 0;
}

.table-display dt
{
width: 7em;
float: left;
clear: left;
margin: 0 0 0 0;
padding: 0.5em;
border-top: 1px solid #999;
/*border-bottom: 1px solid #999;*/
font-weight: bold;
}

/* hack de commentaire avec un antislash pour ie5 mac \*/
/*dt { clear: both; }
/* end hack */

.table-display dd
{
/*float: left;
clear: right;*/
/*width: 24em;* 
/*width: 100%;*/
margin: 0 0 0 0;
padding: .5em;
border-top: 1px solid #999;
}



/* Boutons from http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html */

.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

a.button {
    background: transparent url('image/bg_button_a.gif') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 24px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
}

a.button span {
    background: transparent url('image/bg_button_span.gif') no-repeat;
    display: block;
    line-height: 14px;
    padding: 5px 0 5px 18px;
}

a.button:active {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.button:active span {
    background-position: bottom left;
    padding: 6px 0 4px 18px; /* push text down 1px */
}