/*****************
Fichier layout.php
3 septembre 2012
*****************/

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

/******************
Structural elements
******************/

body {
	font-family: Verdana, Geneva, sans-serif;
  font-size: 16pt;
}

#container {
	overflow: auto;
	background: url(/include/images/back.jpg);
}

#banner {
	color: #fff;
  font-size: 1.5em;
	text-align: center;
	width: 50%;
	margin: 0 auto;
	height: 200px;
	background:#006633;
	border: double #fff 15px;
	border-radius: 70px;
	line-height: 50px;
}

#banner #title {
	position: relative;
	top: 60px;
	font-size: 25pt;
	text-decoration:underline;
	font-weight: bold;
}

#banner #showdate { /* displays date in banner */
	position: relative;
	top: 60px;
	font-size: 0.6em;
	font-weight:normal;
	text-decoration:none;
}

#template {
	max-width: 60%;
	margin: 0 auto;
}

#template #author { /* displays author and date below the title*/
	text-align:center;
	margin-bottom: 20px;
	font-size: 1.1em;
}

/* Link tags */
#template a { color: #006633; font-style:italic;}
#template a:hover, a:active, a:focus { background-color: #006633; color: #fff; }

#template a.trigger
{
  color: #006633;
  text-decoration: none;
	border-bottom: 5px dotted #006633;
}

#template a.trigger:hover
{
	color: #fff;
	background-color: #006633;
	cursor: pointer;
}

#template a.no_underline { border-bottom: 0px; }


 
#template .title
{
  text-align: center;
  margin-top: 1em;
  margin-bottom: 1em;
  text-decoration: underline;
  font-size: 1.6em;
  font-weight: bold;
  color: #006633;
}

#template .subtitle
{
  text-align: center;
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: 1.5em;
  font-weight: bold;
  color: #006633;
}

#template h1 {
	color: #006633;
	text-align:center;
	font-size:1.7em;
	font-weight:bold;
	text-decoration:underline;
}

div.center {text-align:center;}

#StopnextUntil { display: none; }

#template h2
{
	color: #006633;
	text-decoration:underline;
	font-size:1.3em;
}

#template h3 {
	color: #006633;
	font-size:1.2em;
	text-align:left;
	color: #006633;
}

#template h4 {
	text-align:left;
	color: #006633;
	font-size:1.1em;
}

#template hr
{
  border-bottom: ridge #006633 10px; 
  height: 0;
  width: 80%;
}

#template p.date {
	text-align:right;
  text-decoration:underline;
  font-weight:bold;
}


/***************
Rendu des tables
***************/

#template table {
	border: 0px solid;
  padding: 1px;
	margin: 10px;
}

#template table.framed
{
  border: 5px double #006633;
	border-radius: 0px;
  margin:10px;
}

#template table.tab {
	margin:10px;
	border-spacing: 0px;
  border-collapse: separate;
}

#template table.tab td
{
  font-size: 1em;
  color: #006633;
  background-color: #99ffcc;
  border: 1px solid #006633;
  padding-left: 5px;
}

#template table.tab th
{
  font-size: 1em;
  color: #fff;
  text-align: center;
  background-color: #006633;
  border: 1px solid #fff;
  padding-left: 5px;
}

#template table.index {
	border:hidden;
	padding-bottom: 30px;
	width: 100%;
}

#template table.index th {
  font-size: 1.2em;
  text-align: center;
	padding-right: 5px;
  width: 30%;
  vertical-align: middle;
	background-color: #99ffcc;
	border-radius: 0px;
}

#template table.index td {
	border-left: dotted 5px #000;
	padding-left: 20px;
	font-size: 1em;

}

#template caption
{
  font-weight:bold;
}

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

/* Classes pre & code */

#template code
{
	font-family: "Lucida Console", monospace;
  font-size: 0.9em;
}

#template pre
{
  /*box-sizing: border-box;*/
	overflow: auto; /* can also be scroll */
	white-space: pre-wrap;  /*corrects the width problem associated with very long words in <pre>*/
	word-wrap: break-word;
	max-height: 150px;
	width:90%;
  font-family: "Lucida Console", monospace;
  font-size: 1.0em;
	margin: 0 auto;
	padding-left: 20px;
	background-color:#99ffcc; /*#eee*/
  border: 5px double #006633;
	border-radius: 0px;
}


#template pre.code{
  overflow: auto; /* can also be scroll */
	white-space: pre-wrap;  /*corrects the width problem associated with very long words in <pre>*/
	word-wrap: break-word;
}

#template .codesource {
	text-align: center;
	background-color:#CCC;
	font-weight: bold;
	color:#000;
	font-weight:bold;
	text-decoration:underline;
}

/* jQuery: puts +- sign on code snippets */

#template a.openit, a.closeit {
	position: relative;
	top: 15px;
	left: -5px;
}

#template a.closeit{
	cursor: pointer;
	background: url(../images/minus.jpe) no-repeat 0% 50%;
	padding-right: 30px;
	margin-left: 25px;
}
#template a.openit{
	background: url(../images/plus.jpe) no-repeat 0% 50%;
	cursor: pointer;
	padding-right: 30px;
	margin-left: 25px;
}

/****************************** 
* Implementation of tooltips  *  
******************************/
#arrowup {
  background-image: url(/include/images/tealarrow.gif);
  background-repeat: no-repeat;
  height: 100px;
  width: 100px;
}


#tooltip {
	display: block;
	position: absolute;
	border: 5px double #006633;
	border-radius: 0px;
	color: #006633;
	padding: 15px;
	opacity: 1.0;
	fontSize: 16pt;
	background-color: #99ffcc;
	zIndex: 3000;
}

form.framed
{
  border: #006633 double 5px;
	border-radius: ;
  margin: 100px;
	width: 40%;
	text-align: center;
	margin: 0 auto;
  background-color: #99ffcc;
}

/* code adapted from http://code-tricks.com/awesome-blockquote-styling-with-css/ */
blockquote, div.frame, p.summary, p.notebox, blockquote.mail, blockquote.notes, div#summary{
  display:block;
	width: 80%;
  background: #99ffcc;
  padding: 15px 45px 15px 60px;
  margin: 0 auto;
  position: relative;
  border: 5px double #006633;
	border-radius: 0px;
  
  /*Font*/
  font-size: 1.0em;
  line-height: 1.2;
  color: #000;
  text-align: justify;
}

blockquote::before{
  content: "\201C"; /*Unicode for Left Double Quote*/
  
  /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
  
  /*Positioning*/
  position: absolute;
  left: 10px;
  top:5px;
}

blockquote.mail::before{
  content: "\0040"; /*Unicode for Left Double Quote*/
  
  /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
  
  /*Positioning*/
  position: absolute;
  left: 10px;
  top:5px;
}

blockquote.note::before{
  content: "!"; 
  
  /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
  
  /*Positioning*/
  position: absolute;
  left: 10px;
  top:5px;
}

blockquote.question::before{
  content: "?"; 
  
  /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
  
  /*Positioning*/
  position: absolute;
  left: 10px;
  top:5px;
}


blockquote::after{
  /*Reset to make sure*/
  content: "";
}

blockquote a{
  text-decoration: none;
  background-color: ;
  cursor: pointer;
  padding: 0 3px;
  color: #c76c0c;
}

blockquote cite {
	color: #000;
	font-size: 1.0em;
	display: block;
	margin-top: 5px;
}
 
blockquote cite:before {
	content: "\2014 \2009";
}

blockquote a:hover{
 color: #666;
}

blockquote em{
  font-style: italic;
}

blockquote#summary::before {
	content: "Résumé";
	  /*Positioning*/
  position: absolute;
  left: 40%;
  top:5px;
  
    /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
}

p.notebox:first-line
{
	font-weight: bold;
  font-size: 1.2em;
}

p.summary::before {
	content: "\03A3";
	  /*Positioning*/
  position: absolute;
  left: 5px;
  top:5px;
  
    /*Font*/
  font-family: Georgia, serif;
  font-size: 40px;
  font-weight: bold;
  color: #006633;
}

p.summary::after{
  /*Reset to make sure*/
  content: "";
}

p.notebox::before {
	content: url(/images/exclamation.png);
	  /*Positioning*/
  position: absolute;
  left: 5px;
  top:5px;
}

p.notebox::after{
  /*Reset to make sure*/
  content: "";
}

#theme {
	position:fixed;
	top: 50%;
	left: 10px;
	margin: 0 auto;
  color: #006633  background-color: #99ffcc;
	border: 5px double #006633;
  border-radius: 0px;
	text-align:center;
	width: 300px;
}

/*****************************
* Implementation of the menu *
*****************************/

#menus {
	position:fixed;
	top: 50px;
	left: 0px;
	color: #fff;
	background-color: #006633;
	max-width: 250px;
	font-size: 1.0em;
	overflow:auto;
	border:  15px double;
}

#menu {
	position: fixed;
	top: 20px;
	left: 20px;
	color:#fff;
	background-color: #006633;
	width: 100px;
	font-size: 2.0em;
	text-align:center;
	border-radius: 70px;
	border: double #fff 15px;
	height: 100px;
	line-height: 100px;
}

#menus ul 
{
	list-style-type:none;
	margin:0;
	padding:0;
}
 
#menus li
{
	margin: 10px;
}
 
#menus a 
{ 
	text-decoration:none; 
}

#menus a:link, #menus a:visited, a:hover, #menus a:active, #menus a:focus 
{ 
	color: #99ffcc;
} 

#menus a .indent
{
	text-indent: 10px;
}

/************************************************ 
Implementation of images for parent nodes in menu
************************************************/

#nav li.parent 
{
	font-size:1.0em;
	font-weight: bold;
}

#nav li.child
{
	padding-left:10px;
	font-size: 0.8em;
	font-weight:normal;
	color:yellow;
	text-align:left;
}

#nav ul.sub > li.child:first-child
{
	margin-top: 15px;
}

#nav li.parent a.closeit::before{
	position: relative;
  content: "\25B2";
  color: #fff;
}

#nav li.parent a.openit::before{
	position: relative;
  content: "\25BC";
  color: #fff;
}

/*************
Other elements
*************/

.centered {
	margin:0 auto;
}
.full
{
	background-color: #000;
	width: 100%;
	height: 5px;
}

.red
{
	color: red;
}

#template p{
	text-align:justify;
}

#underconstruction
{
	position: fixed;
	top: 20px;
	right: 20px;
}

.yellow
{
	background-color: yellow;
}
 .greek {
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}