/* ** talk_slide_list.css ** ** formats Donhost slides used in a talk as a list; should work with all ** browsers, not just those that can display the slideshow view ** ** by Smylers ** ** This file, any image files it links to, and the design produced by rendering ** it are all copyright Smylers or Donhost Ltd 2004. The files may be used to ** view a document which have been distributed with the files. The files may ** also be distributed with such a document which you have permission to ** distribute. The files may not be modified before distribution, and may not ** be appropriated for any other uses, including styling other documents. ** ** However the JavaScript for manipulating the slide show and the style ** directly supporting that may be copied. See slides_navigation.css. */ @import url(Donhost.css); body { margin-top: 2ex; margin-bottom: 8ex; /* The content of the page should be centered horizontally. The way to do ** this is by having auto for the left and right margins. But 'IE' doesn't ** do that. But it does (incorrectly) use the text-align property for ** aligning child blocks (not just the text within them), so do that here, ** for a start: */ text-align: center; } /* For this to work, directly inside we need
(no, ** really): */ .FakeBody { /* Since that centring will be inherited, undo its affect to prevent all the ** text on the page being centred: */ text-align: left; /* Now on this inner block set auto margins, for those browsers which do this ** properly: */ margin: 0 auto; /* Set the width of the 'body'. It'd be better for this to be a maximum, ** rather than exact, width. But 'IE' and at least some versions of ** 'Konqueror' seem to ignore the max-width property. It's probably better to ** have it looking reasonable in all of those than being ideal in 'Mozilla' ** and ridiculous in those. */ width: 44em; } #Logo { float: right; text-align: right; } #Logo a { text-decoration: none; } /* There isn't a splash screen as such, but its content is displayed at the ** top, before the slides: */ #Splash { margin-bottom: 6ex; } /*

is the slide title, immediately followed by the sub-title;

is the ** event, immediately followed by its URL: */ h1, h4 { margin-bottom: 0; } h1 { padding-top: 4.5ex; } /* subtitle: */ h3 { /* This may be omitted, so don't put any bottom margin on it. .Presenter has ** top margin, which will create a space after either the title or the ** subtitle as appropriate: */ margin: 0.8ex 0 0; } .Presenter { margin-top: 3ex; font-weight: bold; font-size: larger; } a:visited { color: #9C30AC; } .Slide { /* Slides generally have a 4ex vertical gap between them, but only 2ex ** between a slide and some following associated notes: */ margin: 4ex 2.2em 2ex; border: solid 1px #CCC; padding: 1.5ex 1em 1ex 3em; } /* slide title: */ h2 { border-width: 1px; } /* bullets & numbers (just the symbols, not the text of bullet points): */ li:before, li:-moz-list-bullet, li:-moz-list-number { color: #09D; font-weight: bold; } .ImageParagraph { text-align: center; } pre { font-size: 90%; } dfn, em { font-style: normal; } em > em { font-style: italic; } .Notes { font-size: 90%; } /* so that the

becomes the parent box for the .SlideNumber absolute ** positioning: */ h2 { position: relative; } .SlideNumber { position: absolute; /* Specifying the gap between the right edge of this block and the left edge ** of its parent (for right-aligned text) seems hard, so instead give this ** block a fixed width so that the distance can be specified between the left ** of each block: */ left: -3.4em; top: 0; width: 3em; text-align: right; color: #5AA1D5; }