Chris@0: /* The following styles size, place, and layer the slide components. Chris@0: Edit these if you want to change the overall slide layout. Chris@0: The commented lines can be uncommented (and modified, if necessary) Chris@0: to help you with the rearrangement process. */ Chris@0: Chris@0: /* target = 1024x768 */ Chris@0: Chris@0: div#header, div#footer, .slide {width: 100%; top: 0; left: 0;} Chris@0: div#header {top: 0; height: 3em; z-index: 1;} Chris@0: div#footer {top: auto; bottom: 0; height: 2.5em; z-index: 5;} Chris@0: .slide {top: 0; width: 92%; padding: 3.5em 4% 4%; z-index: 2; list-style: none;} Chris@0: div#controls {left: 50%; bottom: 0; width: 50%; z-index: 100;} Chris@0: div#controls form {position: absolute; bottom: 0; right: 0; width: 100%; Chris@0: margin: 0;} Chris@0: #currentSlide {position: absolute; width: 10%; left: 45%; bottom: 1em; z-index: 10;} Chris@0: html>body #currentSlide {position: fixed;} Chris@0: Chris@0: /* Chris@0: div#header {background: #FCC;} Chris@0: div#footer {background: #CCF;} Chris@0: div#controls {background: #BBD;} Chris@0: div#currentSlide {background: #FFC;} Chris@0: */