/***** menu CSS *****/

.menu {
  background-color: transparent;
  text-align:center; 
}
.ssmenu {
  background-image: url(../style/arbre.jpg);
  white-space: nowrap;
}
.menu, .ssmenu {
  color:blue;
  font-size:12px;
  font-weight:bold;
  font-family:"MS Sans Serif", sans-serif, Verdana, Arial;
  border: solid 1px #800000;
  padding:1px;
  /* width et margin sont au cas où le javascript est désactivé. */
  width:130px;
  margin:10px;
  z-index: 2;
}
.menu span, .ssmenu span {
  /* C'est pour cacher les ; en fin de <li>, ce qui permet aux synthèse vocales de prendre une pause dans l'élocution */
  display:none;
}
.ssmenu ul, .ssmenu li {
  padding:0;
  margin:5px;
  list-style-type:none;
}
.menu a, .ssmenu a, .menu a:visited, .ssmenu a:visited {
  color:blue;
  padding:2px 1px;
  text-decoration:none;
  /* Ne pas modifier le block, margin et width */
  display:block;
  margin:0px;
  width:100%;
}
html>body .menu a, html>body .menu a:visited, html>body .menu a:hover, html>body .menu a:active,
html>body .ssmenu a, html>body .ssmenu a:visited, html>body .ssmenu a:hover, html>body .ssmenu a:active {
  width:auto;
}
/*
.ssmenu {
  background-color: #fcf9ef;
}*/
.ssmenu ul:hover, .ssmenu a:hover, .ssmenu a:focus, .menu a:hover, .menu a:focus {
  background-color:#fcf9ef;
  color:red;
  text-decoration:none;
}
.ssmenu a:visited, .menu a:visited {
  color: #008000; text-decoration:none;
}
.ssmenu a:link, .menu a:link {
  text-decoration:none;
}
img {
  border:none;
}
.ssmenu img {
  margin-right:2px;
}

/*-------------------------------------------------*/
html,body {
  margin: auto;
  text-align: center;
  background-color: white;
  line-height: 1.5em;
  font-family: Arial,Helvetica,sans-serif;
  list-style-type: decimal;
}

h1 {
  line-height: 1.5em;
  font-size: 250%; 
  font-family: "Times New Roman", Arial, Verdana, Helvetica, Geneva, sans-serif;
  font-variant: small-caps;
  color: navy; 
  text-align: center;
}
h2 { 
  font-size: 180%;
  line-height: 2em; 
  font-family: Arial, Verdana, Helvetica, Geneva, sans-serif;
  color: #bb0000;
  background-color: #f0f0f0;
  border: solid thin #bb0000;
  text-align: center;
}
h3 {
  font-size: 140%;
  font-family: Arial, Verdana, Helvetica, Geneva, sans-serif;
  color: #bb0000;
  background-color: #f0f0f0; 
}
h4 {
  font-size: 100%;
  font-weight:bold;
  color: #0000a0;
}
h5 {
  font-size: 120%;
  font-weight:bold;
  color: #bb0000;
}
h6 {
  font-family: "Times New Roman",Times,serif;
  font-size: 120%;
  font-weight:bold;
  text-align: center;
}
 
.solution {
  font-size: 80%;
  font-family: Arial,Helvetica,sans-serif;
  color: green; 
}

/* HISTOIRE */
.histoire {
    background-color: #b3d9ff;
}
.histoire p,ul,li {
  line-height: 1em;
  list-style-position: outside;
  text-align: justify;
 /* font-family: "Times New Roman",Times,serif;*/
}

/* RECREATION */
.recre {
  background-color: #c1ffd1;
  color: #804000;
  text-align: justify;
}
.auteur {
  padding-left:15px;
  font-style: italic;
}

/* NOTE */
.note {
  padding-left: 15px;
  padding-right: 15px;
  border-left: solid 2px #0000a0;
  line-height: 1.2em;
  font-size: 90%;
  color: #00006f;
}
.note p {
  line-height: 1.2em;
  font-size: 90%;
  color: #00006f;
}

/* NOTEPLUS */
.noteplus {
  padding-left: 15px;
  padding-right: 15px;
  border-left: solid 5px #ff0000;
  border-right: solid 5px #ff0000;
  line-height: 1.2em;
  font-size: 100%;
 /* color: #ff0000;*/
  color: #d90000;
}
.noteplus p {
  line-height: 1.2em;
  font-size: 100%;
}

.symbol {
  font-family: "Times New Roman",Times,serif;
}

.chimie {
  text-align: center;
  font-size: 130%;
}
.chimie  p {
  text-align: center;
  font-size: 130%;
}

.eq {
  line-height: 1.5em;
  text-indent: 2em;
  text-align: left;
  font-family: "Times New Roman",Times,serif;
  font-size: 130%;
}
.eq p {
  text-align: left;
  font-family: "Times New Roman",Times,serif;
  font-size: 130%;
}

.eqplus {
  line-height: 1.5em;
  text-indent: 2em;
  text-align: center;
  font-family: "Times New Roman",Times,serif;
  font-size: 130%;
  font-weight:bold;
  padding: 5px;
  border: solid 1px Red;
  background-color: #f0f0f0;
}

/* COMPLEMENT */
.comp {
  color: black;
  background-color: #ffc5a8;
  text-align: justify;
}

/* EXEMPLE */
.exemple {
  margin-left: 15px;
  margin-right: 15px;
  padding-left: 15px;
  padding-right: 15px;
  border: 2px solid gray;
}

/* FIGURE */
.figure {
  position: relative;
  left: 7px;
  width: 650px;
  padding-top: 10px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 10px;
  color: #0000a0;
  background-color: #f0f0f0;
  border: solid thin #0000ff;
  font-family: Helvetica,sans-serif;
  line-height: 1.2em; 
}
.figure p+img {
  text-align: center;
}
.figure img {
  border: solid thin #0000ff;
}
.figure p{
  padding-right: 40px;
  text-align: justify;
  line-height: 1.2em;
  font-family: Helvetica,sans-serif;
  font-size: 90%;
}
.figure .chimie {
  text-align: center;
}
.fig {
  text-decoration: underline;
  font-weight: bold;
}

.retenir {
  margin-left: 15px;
  margin-right: 15px;
  padding-left: 15px;
  padding-right: 15px;
  font-size: 120%;
  border: solid 2px red;
}
.retenir ul {
  line-height: 1em;
}


/* TITRE */
.top {
  text-align: center;
  color: #003300;
}
#fond_droit {
  position: fixed;
  top: 0px;
  left: 990px;
  background-position: left top;
  background-image: url(../style/arbre.jpg); background-repeat: repeat-y; background-attachment: fixed; 
  width: 140px;
  height: 900px;
  padding: 10px;
}
/* MENU */
#fond_menu {
  position: fixed;
  top: 0px;
  left: 0;
  /* background-color: transparent; */ 
  background-position: left top;
  background-image: url(../style/arbre.jpg); background-repeat: repeat-y; background-attachment: fixed; 
  width: 140px;
  height: 1200px;
  padding: 10px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 90%;
  line-height: 1.2em;
  z-index: 1; 
}
#fond_menu ul {
  list-style-position: outside;
  list-style-type: none; 
  text-indent: 0px;
}
#fond_menu li,a,p {
  list-style-type: none; 
  line-height: 1em;
  text-indent: 0px; 
  list-style-position: outside;
  /*text-align: left;*/
  font-family: Arial,Helvetica,sans-serif;
  background-color: transparent;
}
#fond_menu .accueil {
  height: 700px;
}

a:link {color: blue;   text-decoration: underline;} 
a:visited {color:   #008000;  text-decoration: underline; } 
a:hover {color:red; text-decoration:none;}
#fond_menu a:link {color: blue;   text-decoration: none; }
#fond_menu a:visited {color:   #008000;  text-decoration: none; }
#fond_menu a:hover {color:red; text-decoration:none;}
 
.nav {
  font-size: 90%;
  font-family: Arial,Helvetica,sans-serif;
  text-align: center;
  color: navy; 
  background-color: transparent;
  border: solid 1px #800000;
}
.nav ul {
  background-color: transparent;
}
.nav a {
  line-height: 1.5em;
}

.titremenu {
  text-align: center;
  color: #800000;
  font-size: large;
  font-weight:bold;
}

.capital {
  font-variant: small-caps;
}

/* PAGE */
#page {
  position: absolute;

  width: 750px;
  top: 20px;
  left: 175px;
  right: 1em; 
  text-align: justify; 
  line-height: 1.5em;
  color: black;
  background-color: #ffffd9;
  padding-left: 10px;
  padding-right: 10px;
  /* z-index: 1; */ 
}
#page p,td {
  text-indent: 15px;
  line-height: 1.5em;
}
#page th {
  font-weight:bold;
  text-align: center; 
}
#page ul li {
  line-height: 1em;
  font-size: 100%;
  font-family: Arial,Helvetica,sans-serif;
  color: black; 
  text-align: justify;
  list-style-type: none;
  list-style-position: outside;
}
#page ol li {
  line-height: 1em;
  font-size: 100%;
  font-family: Arial,Helvetica,sans-serif;
  color: black; 
  text-align: justify;
  list-style-type: decimal;
  list-style-position: outside;
}

/* COLONNES */
#colonne1 {
  float: left;
  width: 45%;
  padding-left: 10px;
}
#colonne2 {
  float: right;
  width: 45%;
  padding-right: 10px;
}
#entete {
  width: 100%;
}
#pied {
  clear: both;
  position: relative;
  width: 680px;
  bottom: 5px;  left: 0px;
  text-align: center;
}

/* SA */
.sa {
  margin-left: 80px;
  margin-right: 80px;
  height: auto;  width: auto;
  border: solid 5px #0e0ef1;
  background-image: url(Sa3.gif); background-repeat: no-repeat;
  background-position: 20px center;
  color: #0000a0;
  text-align: center;
}
.lsa {
  border-left: solid 4px #ff0000;
  border-right: solid 4px #ff0000;
}