@font-face {
    font-family: 'droid_sansregular';
    src: url('../fonts/DroidSans-webfont.eot');
    src: url('../fonts/DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DroidSans-webfont.woff') format('woff'),
         url('../fonts/DroidSans-webfont.ttf') format('truetype'),
         url('../fonts/DroidSans-webfont.svg#droid_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
    }

@font-face {
    font-family: 'Open Sans Light';
    src: url('../fonts/OpenSans-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }

@font-face {
    font-family: 'Inconsolata';
    src: url('../fonts/Inconsolata-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }

@font-face {
    font-family: 'droid_serifregular';
    src: url('../fonts/DroidSerif.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }

@font-face {
    font-family: 'droid_serifbold';
    src: url('../fonts/DroidSerif-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }

html {
   height: 100%;
   overflow-y: scroll;
   }

body {
   height: 100%;
   background-color: #ffffff;
   font-family: "droid_sansregular","Times New Roman",Arial,Helvetica,Sans-serif;
   color: #444444;
   font-size: 20pt;
   padding: 0px;
   margin: 0px;
   padding-bottom: 3em;
   }

table {
   margin-top: 0.6em;
   }

table:first-child {
   margin-top: 0em;
   }

table.borders {
   border-collapse: collapse;
   border-spacing: 0px;
   }

td {
   font-family: "droid_sansregular",Arial,Helvetica,Sans-serif;
   color: #444444;
   font-size: 20pt;
   padding-left: 1em;
   }

td:first-child {
   padding-left: 0em;
   }

table.borders td {
   border-style: solid;
   border-width: 1px;
   border-color: #999999;
   padding: 0.6em;
   }

div.navButtons {
   float: right;
   }

div.navButtons img {
   width: 50px;
   }

main {
   height: 100%;
   padding-top: 1em;
   padding-left: 1em;
   padding-right: 1em;
   }

.color1 {
   background-color: #0186b1;
   }

.color2 {
   background-color: #f8a823;
   }

.color3 {
   background-color: #8fc048;
   }

.color4 {
   background-color: #e6007b;
   }

div.slideTitle {
   height: 100%;
   width: 100%;
   vertical-align: middle;
   }

div.midScreen {
   float:left;
   height:35%;
   width:100%;
   }

div.slideTitle div.title {
   clear:both;
   font-size: 1.8em;
   margin:auto;
   width:50%;
   border-bottom-style: dotted;
   border-bottom-color: #8fc048;
   border-bottom-width: 2px;
   padding-bottom: 4px;
   }

div.slideTitle div.title span {
   }

div.slideTitle div.subtitle {
   clear:both;
   font-size: 1.4em;
   padding-top: 8px;
   margin:auto;
   width:50%;
   }

div.slideTopTitle {
   padding-top: 0.2em;
   padding-bottom: 0.2em;
   padding-left: 0.8em;
   font-size: 1.4em;
   color: #0186b1;
   }

div.tocTitle {
   position: relative;
   top: -0.6em;
   font-size: 1.4em;
   color: #0186b1;
   }

div.tocTitle span.low {
   color: #AAAAAA;   
   }

div.tocTitle a {
  color: #007fd3;
  }

div.tocTitle img {
   vertical-align: -0.2em;
   height: 1em;
   }

a.currentToc {
   background-color:#EEEEFF;
   }

/* --------------------------------------------------------------------------
** a
** ------------------------------------------------------------------------*/
a:link, a:hover, a:visited, a:active {
  text-decoration: none;
  outline: none;
  color: #007fd3;
  }

/* --------------------------------------------------------------------------
** ul
** ------------------------------------------------------------------------*/
ul {
   margin: 0em;
   padding: 0em;
   margin-top: 0.6em;
   }

ul:first-child {
   padding-top: 0em;
   }

ul li {
   list-style-type: none;
   list-style-position: outside;
   }

ul li.bulletedList {
   background-image: url('../pics/next.png');
   background-repeat: no-repeat;
   background-size: 1em;
   background-position: -0.15em 0.2em;   
   padding-left: 1em;
   margin-top: 0.6em;
   }

ul li.bulletedList:first-child {
   margin-top: 0em;
   }

ul li.hiddenList {
   padding-left: 1em;
   margin-top: 0.6em;
   }

ul li.hiddenList:first-child {
   margin-top: 0em;
   }


/* --------------------------------------------------------------------------
** colonnes/colonne
** ------------------------------------------------------------------------*/
div.colonnes {
   margin-top: 0.6em;
   width: 100%;
   }

div.colonnes:first-child {
   margin-top: 0em;
   }

div.colonne {
  float: left;
  border-style: solid;
  border-width: 1px;
  border-color: #b6c8df;
  }

div.colonneTitre {
  background-color: #b6c8df;
  padding: 8px;
  }

div.colonneBody {
  padding: 8px;
  }

div.clear {
   clear:both;
   }

/* --------------------------------------------------------------------------
** titre
** ------------------------------------------------------------------------*/
div.textTitle {
  margin-top: 1em;
  margin-bottom: 0em;
  color: #0186b1;
  font-size: 1.4em;
  }

div.textTitle:first-child {
  margin-top: 0em;
  }


/* --------------------------------------------------------------------------
** p
** ------------------------------------------------------------------------*/
p {
  margin-top: 0.6em;
  margin-bottom: 0em;
  }

p:first-child {
  margin-top: 0em;
  }

span.code {
   font-family: "Inconsolata", Courier New;
   }

p img {
   vertical-align: -0.2em;
   height: 1em;
   }

/* --------------------------------------------------------------------------
** code or exemple
** ------------------------------------------------------------------------*/
div.code {
   font-family: "Inconsolata", Courier New;
   margin-top: 0.6em;
   }

div.code:first-child {
  margin-top: 0em;
  }

div.code span.element {
/*   color: #8fc048; */
   color: #a89049;
   }


div.codeButtons {
   margin-top: 0.6em;  
   }

div.codeButtons a {
   color:#ffffff;
   padding-left:0.1em;   
   padding-right:0.1em;   
   font-size:0.6em;
   background-color: #8fc048;
   }