/******************/
/* Reset HTML styles  */
/******************/

html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, 
  pre, code, address, variable, form, fieldset, blockquote {
  padding: 0;
  margin: 0;
  font-size: 100%;
  font-weight: normal; }
table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: left; }
img, fieldset { border: 0; }
ol { padding-left: 1.4em; list-style: decimal; }
ul { padding-left: 1.4em; list-style:disc; }
q:before, q:after { content:''; }

/******************/
/* GLOBAL LAYOUT  */
/******************/

body {	font-size:62.5%; 
/*Font-size: 1.0em = 10px when browser default size is 16px*/
	background-color:#ffffff;
	margin-top: 0em;
	font-family:tahoma,arial,sans-serif; 
} 

a:link {color:rgb(0,0,255);}    /* unvisited link */
a:visited {color:rgb(100,0,255);} /* visited link */
a:hover {color:rgb(255,0,0);}   /* mouse over link */
a:active {color:rgb(0,255,0);}  /* selected link */

.container { 
  margin:0 auto; 
  margin-left: auto;
  margin-right:auto;
  width: 72em;
  padding-top:0em;
  padding-left:0em;
  padding-bottom:0em;
  font-size:1.0em;
  background-color:#ffffff;
  }

.header { 
  width:90%; 
  margin-top: 0em;
  margin-left: 1em;
  padding-top: 0.5em;
  padding-left: 0em;
  padding-bottom: 1.5em;
  background-color:#ffffff;
  font-size:1.0em;
  min-height:64px /*Non-IE6*/; 	height:auto !important /*Non-IE6*/;  height:50px /*IE6*/; 
  position:relative;
	}

.navbar {white-space:nowrap /*IE hack*/; 
 float:left; 
 position: relative; 
 left: 0.8em;
 width: 100%;
 background-color:#ffffff;
 margin-top: 0.5em;
 padding-bottom: 0em;
 min-height:2em /*Non-IE6*/; height:auto !important /*Non-IE6*/;  
 height:3em /*IE6*/; } /*Color navigation bar normal mode*/

 .breadcrumb 
 {
 /* display: none; */
 float:left; 
 position: relative; 
 left: 1.5em;
 width: 100%;
 background-color:#ffffff;
 padding-top: 0.5em;
 margin-bottom: -1em;
 font-size:130% !important /*Non-IE6*/; font-size:120% /*IE6*/; 
 }

.breadcrumb div#plusone-div
{
position: absolute;
right: 100em;
}

.content {display:inline; /*Fix IE floating margin bug*/; 
 float:left; 
 width:100%; 
 margin-left: 0em;
 padding-top:0.5em;
 padding-left:0em;
 padding-bottom:0.5em;
 background-color: rgb(255,255,255);
 font-size:130% !important /*Non-IE6*/; font-size:118% /*IE6*/;
 overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;}

.subcontent {display:inline /*Fix IE floating margin bug*/; 
 float:right; width:270px; background-color:rgb(200,200,200); 
 font-size:1.0em; overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;}

.footer 
{
clear:both; 
background-color:rgb(122,255,122); 
width:55em; 
margin-top:0em;
padding-left:0.5em;
padding-top:0.2em; 
padding-bottom:1em; 
font-size:120% !important /*Non-IE6*/; font-size:110% /*IE6*/; 
overflow:visible !important /*Non-IE6*/; overflow:hidden /*IE6*/;
}

.footer p{
 margin-left: 1em;
}

/****************/
/*  HEADER-TOP  */
/****************/

/* SITENAME AND BRIEF DESCRIPTION */
.sitelogo { 
  width:55px; height:64px; float: left;}
	
.sitename {
	width: 100%;
	z-index:1; 
	margin:1px 0 0 64px;
	overflow:hidden;}
	
.sitename h1 { /* big_title style */
	font-family:verdana,arial,sans serif; font-weight:normal; 
	font-size:220% !important /*Non-IE6*/; font-size:200% /*IE6*/;
	position: absolute;	
	top:0; }
	
.sitename h2 { /* sub_title style */
  font-family:verdana,arial,sans serif;
  /* color: #006600; */
  height:1.0em; font-weight:normal; 
  font-size:160% !important /*Non-IE6*/; font-size:145% /*IE6*/;
  position: absolute; top: 2em; }

.sitename h2 span {
  color:#006600; 
}
 
.sitename h3 
{ /* contact */
color:rgb(0,0,0); 
font-family:verdana,arial,sans serif;
height:2em; font-weight:normal; 
font-size:160% !important /*Non-IE6*/; font-size:145% /*IE6*/;
position: absolute; top: 3.8em; 
}

.sitename h3 a {
 text-decoration: underline;
} 

.sitename h3 span {
  color:#006600; 
}
	
.sitename a{
  text-decoration:none;
	color:rgb(0,0,255);}

.sitename a:hover {
	text-decoration:none;}
	
/********************/
/*  NAVIGATION BAR  */
/********************/

/* MAIN MENU */
.navbar ul {
  list-style-type:none; 
  margin-left:-1.35em; 
  margin-top:0.5em; }

.navbar ul li {
 float:left; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; }
	
.navbar ul li a {
	float:none !important /*Non-IE6*/; float:left /*IE-6*/; 
	display:block; 
	text-decoration: none;
	font-size:180% !important /*Non-IE6*/; font-size:162% /*IE6*/; 
	line-height:1.2em; 
	margin-right: 0.8em;
	padding:0.2em 0.5em 0.2em 0.5em; 
	border:solid 0.1em rgb(0,0,0);
	color:rgb(0,0,255); 
	background-color:rgb(255,255,100); 
	text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px; }

.navbar li.index a { background-color: #F08084; color: #000000; }
.navbar li.courses a { background-color: #FFA84D; color: #000000; }
.navbar li.contents a { background-color: #FAFA00; color: #000000; }
.navbar li.contact a { background-color: #ADFF2F; color: #000000; }
.navbar li.feedback a { background-color: #00FFFF; color: #000000; }
.navbar li.faq a { background-color: #7BE099; color: #000000; }
.navbar li.login a { background-color: #00FFFF; color: #000000; }
.navbar li.about a { background-color: #39BDFF; color: #000000; }
	
/* SUBMENU (Non-IE6 hovering) */
.navbar ul li:hover {position:relative;} /*Sylvain IE hack*/
.navbar ul li:hover a {
  color: rgb(0,0,255);
  background-color: rgb(255,255,255); 
  text-decoration: underline;} /*Color main cells hovering mode*/
.navbar ul li:hover a:visited { color: rgb(100,0,255);} 
.navbar ul li:hover a:active { color: rgb(0,255,0);} 

.navbar ul li:hover ul {
  display:block; width:9.0em; position:absolute; 
  z-index:1000; top:3.0em; margin-top:0.1em; left:0; 
  padding:0px 16px 0px 16px; border-top:solid 1px rgb(215,215,215);
	text-decoration: underline;
	}
.navbar ul li:hover ul li a {
  white-space:normal; display:block; width:9.0em; height:auto; 
	line-height:1.3em; margin-left:-17px; padding:4px 16px 4px 16px; 
	border-right:solid 1px rgb(215,215,215); 
	border-left:solid 1px rgb(215,215,215); 
	border-bottom: solid 1px rgb(215,215,215); 
	font-weight:normal; color:rgb(100,100,100);
	text-decoration: underline;
	} /*Color subcells normal mode*/
.navbar ul li:hover ul li a:hover {
	text-decoration: underline;} /*Color subcells hovering mode*/

/* SUBMENU (IE6 hovering) */

/************/
/*  CONTENT */
/************/

.content h1 { 
	margin-top:1.5em; 
	margin-left:1em;
	margin-bottom:0.5em; 
	font-size: 160%; }

.content h2 { 
	margin-top:1.5em; 
	margin-left:1em; 
	margin-bottom:0.5em; 
	font-size: 140%; }

.content h2#top {
	margin-left: 0.6em;
	}
  
.content h3 { 
  	margin-top:1.5em; 
	margin-left:1.2em; 
	margin-bottom:0em; 
	font-size: 125%; }

.content h4 { 
  margin-top:1.5em; 
  margin-left:1.3em; 
  margin-bottom:-0.5em; 
  font-size: 110%; }

.content ul li {
  line-height: 140%;
}

.content ul li img {
  position: relative;
  top: 2px;
}

.content img#tda{
 padding-top: 1em;
 padding-left: 1.5em;
 margin-bottom: -1em;
}

.content .margin-bottom-one { 
  margin-bottom:1cm; 
}

.content .hr {
	width:100%; 
	height:1px;
	background:gray;
	margin-top:1cm;
}

.content hr.thick {
	width:100%; 
	height:2px;
	background:gray;
	margin-top:1cm;
}

.content a.courses 
{ 
display: inline-block;
 background-color: #FFA84D; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content a.contents
{ 
display: inline-block;
 background-color: #FAFA00; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content a.success
{ 
display: inline-block;
 background-color: #FAFA00; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content a.contact 
{ 
display: inline-block;
 background-color: #ADFF2F; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content a.login
{ 
display: inline-block;
 background-color: #00FFFF; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content a.tutorials
{ 
display: inline-block;
 background-color: #00FFFF; 
 color: #000000; 
 padding:0em 0.5em 0.2em 0.5em; 
 text-align:center;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content p { margin-left: 1.5em; }

.content .big_ul { 
	font-size: 125%; 
	margin-left: -0.2em; 
	list-style-type: none;
}

.content  ol.margin-1 { margin-left:-1.3em;}

.content ul.circle{ 
 list-style-type: circle; 
 margin-left:-1.2em;
 }

.content ul.paper{ 
 list-style-type: none; 
 margin-left: -1em;
 margin-bottom: 1em; }

.content ul.paper li{ 
margin-top:0.2em; }

.content ul.empty li{ 
 list-style-type: none;
 margin-top:1em; 
 margin-left:0.2em;}

.content ul.none{ 
 	list-style-type: none; 
 	margin-left: 1.5em; }

.content ul.none li{ 
 	margin-top: 1.5em; }

ol.numbers{
	margin-left: -1.4em; 
	list-style: decimal;
}
	
.content div.clear {
 clear: both;
 }

.content div.column { 
  float:left;   
  margin-left:-0.4em;
  margin-right: 1em;
}
 
.content div.version p {
  margin-top: 0.5em; 
  }
 
.content div.version { 
  width: 16.8em;
  margin-top:1em;
  padding: 0.2em;
  padding-top: 0em;
  border: 4px solid rgb(0,255,0); 
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.content fieldset.contact {
margin-top: 0em;
}

.content fieldset.contact p {
margin-left: 0.8em;
}

.content fieldset.contact label {
margin-left: 0em;
}

p { margin-top:1em; 
   line-height:1.2em; }
   
pre { font-size: 120%; } 
  
.content ul.info{ 
 	list-style-type: none; 
	margin-bottom: 0.5em;
}

.content ul.info li{ 
 	margin-top: 0.5em; 
}
 
.content ul.topics {
 margin-bottom:1cm;
}	

.content ul.topics li { 
 list-style-type: none; 
 margin-left:-1.5em;
 margin-top:0.5em;
 } 
  
table.papers{
	margin-top:1em;
	margin-bottom:2em;
	margin-left:1.5em; 
}

table.borders{
	border: 1pt;
	margin-top: 1em;
    margin-left: 1.5em; 
}

table.people{
	margin-top: 0.5em;
    margin-left: 1.5em; 
}

table.people tr{
	margin-top: 1.5em;
	padding-top: 2em;
}

.image{
display: inline-block;
float: none;
/*white-space:nowrap; */
}

table.papers tr{
	margin-top: 1em;
	padding-top: 1.5em;
}

td.image{ 
	padding: 0.5em 1em 0 0;
}
   
td.pictures{ 
	white-space:nowrap; /* all pictures in one row */
	margin-left: 0.5em;
}
   
.content li { margin-top:1em; line-height:1.2; }

/* CONTAINER (NO BOXES) */
.content-1col-nobox {width:676px; background-color:rgb(255,255,255);}

.content-2col-nobox-leftcolumn {display:inline; float:left; width:337px; border-right:solid 1px rgb(215,215,215) /*Use this statement if left column is longer than the right column. Activate by removing "xx_" from property name*/; background-color:rgb(255,255,255);}

.content-2col-nobox-rightcolumn {display:inline; float:right; width:337px; border-left:solid 1px rgb(215,215,215)/*Use this statement if right columnn is longer than the left column. De-activate by adding "xx_" to propery name*/; background-color:rgb(255,255,255);}

/* CONTAINER (BOXES) */
.content-1col-box {width:676px; background-color:transparent;}

.content-2col-box-leftcolumn {display:inline; float:left; width:333px; background-color:transparent;}

.content-2col-box-rightcolumn {display:inline; float:right; width:333px;  background-color:transparent;}

.content-2col-box {width:333px; background-color:rgb(255,255,255);}

/***************/
/* SUBCONTENT  */
/***************/

div.question { 
  /* font-style: italic; */
	font-size: 110%; 
	padding-bottom: 0.5em; }
	
span.display_block{ display: block; }

.subcontent-box {width:270px; float:right; background-color:rgb(255,255,255);}

/************/
/*  FOOTER  */
.footer p {clear:both; line-height:100%; text-align:left; 
 color:rgb(0,0,0); font-weight:normal; font-size:1.0em;}
/************/
.footer p.credits {clear:both; font-weight:normal;}
.footer a, .footer a:visited {text-decoration:underline; color:rgb(0,0,0);}
.footer a:hover {text-decoration:none; color:rgb(0,0,0);}