/* * Basic defaults. * * Two fonts: * - Georgia with extra line spacing for most text. * - Small Verdana elsewhere. * * No spacing on standard block elements unless I say so. * * Most text is black on white. * Links are blue (stonger and underlined on hover). * Headings are reddish brown, and italic until

. * * No frames/borders/spacing on images unless I say so. */ /* Normal body font */ body { font: 10pt/18pt georgia,serif; } /* Basic spacing */ p, div, body, html { margin: 0px; padding: 0px; } /* Links */ a { color: #302090; text-decoration: none; } a:hover { color: #5020D0; text-decoration: underline; } /* Headings */ h1, h2, h3, h4, h5 { color: #904020; padding: 0; margin: 0; margin-bottom: 0.5em; letter-spacing: 1px; text-align: left; } /* Don't let links in headers change the text colour unless we're hovering */ h1 > a { color: #904020; } h2 > a { color: #904020; } h3 > a { color: #904020; } h4 > a { color: #904020; } h5 > a { color: #904020; } h1 > a:hover { color: #C04020; } h2 > a:hover { color: #C04020; } h3 > a:hover { color: #C04020; } h4 > a:hover { color: #C04020; } h5 > a:hover { color: #C04020; } /* Individual headings */ h1 { } h1 { font: italic normal 15pt georgia,serif; } h2 { font: italic normal 12pt georgia,serif; } h3 { font: normal 11pt georgia,serif; margin-bottom: 0.3em; } h4 { font: normal 10pt georgia,serif; margin-bottom: 0.2em; } /* Image defaults */ img { border: 0; margin: 0; padding: 0; } /* Form controls */ input.submit { display: none; } input.textbox { width: 100%; } /* * Now the overall page structure. * * There are three top-level divs within : * - page-header: contains the

plus introductory blurb * - page-content: includes main content, plus both aux panels * - page-footer: a one-line footer * * Almost everything goes on inside #page-content. */ body { padding: 1em; margin: 0em; } div#page-header { } div#page-footer { text-align: center; } div#page-content { padding-left: 2em; padding-right: 0em; } /* Indent the header (text) content on both sides */ div#page-header-content { margin-left: 2em; margin-right: 2em; } /* * Almost everything goes on inside the main page-content div. * There should be three
s: * * - cont-feature: a left-floated inset paragraph in italics * - cont-aux: a right-floated long panel in Verdana * - cont-main-content: the main content of the page (e.g. event feed) */ /* * The cont-feature div is just a block of text * highlighted in larger red italic Verdana. */ div#cont-feature { float: left; width: 15em; color: #A03010; margin: 1em; margin-top: 0; margin-bottom: 0; padding: 1em; } div#cont-feature p { font: italic 10pt/22pt georgia,serif; text-align: center; } /* * The cont-aux div contains a series of anonymous sub-divs, * each started by an . Things are a little bit more complicated * to get the spacing just so, especially for the lists. * * Essentially, this is a right-floated vertical panel * with a different background, with text in a different font. */ div#cont-aux { float: right; width: 11em; margin: 0em; margin-left: 2em; padding: 1em; background: #ffffd0; } div#cont-aux div { font: 10px/15px verdana, sans-serif; margin: 0em; margin-bottom: 2em; padding: 0em; } div#cont-aux p { margin-bottom: 0.5em; } div#cont-aux ul { margin: 0em; padding: 0em; padding-left: 1em; } div#cont-aux li { margin: 0em; margin-bottom: 0.2em; margin-left: 0.4em; padding: 0em; } /* An inline image (at the start of a line) */ img#xml-icon { float: left; padding: 0; margin: 0; margin-right: 0.5em; } /* Four validator icons */ div#validator-icons { text-align: center; } /* * The primary content of the page (e.g. the feed of events * goes into cont-main-content. */ div.cont-main-content { } /* * feed-item is the top-level div for each event. * feed-item-desc contains everything except the inset date & price. */ div.feed-item { margin: 1em; margin-bottom: 2em; padding: 0em; } div.feed-item-desc { margin: 0em; padding: 0em; min-height: 75px; } div.feed-item-text { text-align: justify; } div.feed-item-date-and-price { float: right; text-align: right; font: 10px/14px verdana,sans-serif; } /* feed-item-buy is a sticking out (right) buy button */ div.feed-item-buy { float: right; border-left: 1px dotted blue; margin: 0; margin-left: 1em; margin-right: -1em; padding: 0; padding-left: 0.5em; font-family: verdana,sans-serif; } /* Inset event image */ div.feed-item-img { float: left; margin: 0; margin-right: 0.5em; } div.feed-item-foot { text-align: center; font: 10px verdana,sans-serif; margin: 0; margin-top: 0.5em; padding: 0; }