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

* CSS @media projection rules (not print or screen)
*
* 1) projection -> slideshow mode (display one slide at-a-time; hide all others)
* 2) screen     -> outline mode (display all slides-at-once on screen) 
* 3) print      -> print (and print preview)
*
* toogle between slideshow/outline mode using t-key
*/

html, body, .presentation { margin: 0; padding: 0; }

.slide { display: none;

  position: absolute;
  top: 0; left: 0; 
  margin: 0;
  padding: 2% 4% 0% 4%;      /* css note: order is => top right bottom left  */
  width: 92%; height: 95%;    /* css note: to get to 100% add padding/border/margin */
  overflow-x: hidden; overflow-y: auto;
  z-index: 2;
}

slide1 { display: block; }

.notes { display: none; } /* handout notes/note (use note? handout? notes? */

/********* format layout block

*
*  .layout
*    > #header
*    > #footer
*    > #controls      (holding navigation controls)
*       > #navLinks
*          > #toggle
*          > #navList
*            > #jumplist
*    > #currentSlide  (e.g. 1/7)
*
*/

.layout { display: block; }

header { position: fixed;

   top: 0; left: 0;
   width: 100%; height: 0.5em;
   z-index: 1;
}

footer { position: fixed;

   top: auto; bottom: 0;
   padding: 1em 0;   /* css note: order is => 1st top,bottom; 2nd right,left */
   width: 100%; height: 1em;
   z-index: 5;

   /* todo: move font-size and font-style to blank.css */    
   font-size: 100%; font-weight: bold; 
}

/* todo: move font-size and font-style to blank.css */

#footer h1 { display: block; margin: 0; padding: 0 1em; font-size: 0.5em; }
#footer h2 { display: block; margin: 0; padding: 0 1em; font-size: 0.5em; font-style: italic; }

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

* format for navigation controls 
*/

controls { position: fixed;

            left: 60%; bottom: 0;
            width: 40%;
            z-index: 100;
            text-align: right;
            font: bold 1.2em Verdana, Helvetica, sans-serif;
          }

#controls :focus { outline: 1px dotted white;}

#controls #navLinks { text-align: right; margin: 0; visibility: hidden; } 

#controls #navLinks a { padding: 0; margin: 0 0.5em; cursor: pointer; border: none; }

#controls #navLinks :link,
#controls #navLinks :visited {text-decoration: none; }

#controls #navList #jumplist { background: white; color: black; }

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

* format for 
* currentSlide block ( e.g. 2/20 )
*/

currentSlide { position: fixed;

  left: 45%; bottom: 1em;
  width: 10%;
  z-index: 10;
  text-align: center;
  font-size: 0.8em;
}

currentSlide :link, currentSlide :visited { text-decoration: none; }