/* ** 'The Register' printer-friendly and e-mail CSS ** ** by Smylers ** ** This file should be invoked for the media types screen and print. This will ** mean that 'Netscape Navigator 4' ignores it completely (because that only ** uses style-sheets of type "screen" exactly, not "screen" and something ** else), so there's no need to worry about issues with that browser. The ** styling in here is deliberately kept simple, to maximise the number of ** e-mail clients and printing engines in which it does something at least ** vaguely sensible. ** ** We always want the standard colours, with no theming here. This style-sheet ** used to use @import url(color/Reg_default) to that effect. Incredibly 'IE' ** treats that as meaning that the page is in someway a security risk and ** refuses to let readers save it to disk! So the colours have been copied and ** pasted in below: if they ever change, then unfortunately they'll now need ** changing here too. */ html { margin: 0; padding: 0; } body { background-color: #FFF; color: black; margin-top: 2ex; margin-bottom: 2ex; padding: 0; font-family: sans-serif; } a:link, .YouAreHere a:visited { color: #00D; } a:visited, .Label { color: #D00; } /* The e-mails' s' widths are constrained to an appropriate number of ems. ** This doesn't work for printer-friendly pages where some of the ads may be ** wider and need to burst out either side. The have an IDs round the main ** part of the article and a class on the headers and footers, so use those ** instead: */ .Furniture, .Print #Article, .Mail { width: 36em; } /* centered within available space; 'IE' ignores setting the margins to auto, ** but does centre a box if it's parent has centred text (even though that is ** only supposed to apply to text) -- so do both, to centre the block in all ** browsers, then un-centre the text inside: */ .Print, .Ad { text-align: center; } .Furniture, .Print #Article, .Mail { text-align: left; } .Furniture, .Print #Article, .Ad, .Mail { margin-left: auto; margin-right: auto; } h1, #Strapline { text-align: center; } h1 { background-color: #F00; color: #FFF; margin: 0 0 0.5ex; } h1 img { border: solid 3px #F00; vertical-align: bottom; } #Strapline { margin: 1ex 0 2ex; padding: 0; } /* For bullet lists (such as those on daily e-mail) don't have the indent for ** the bullet being _quite_ so big as by default, and have a smidgen of space ** between items: */ ul { padding: 0 0 0 1.6em; } li { margin: 0 0 0.3ex; padding: 0; } blockquote { padding: 0; margin: 0 1.6em; } h2 { font-size: 125%; margin: 0 0 0.7ex; padding: 0.5ex 0; /* watermark: */ background: url(/Design/graphics/Reg_default/grey_watermark_top.png) top right no-repeat; border-style: solid none; border-width: 1px; border-color: #DDD; } .Date { margin-bottom: 3ex; } p, .Ad { margin-top: 0; margin-bottom: 1.6ex; } .OrigURL { margin-top: 1.6ex; } /* Don't justify text on printer-friendly version cos having the URLs in the ** middle of paragraphs makes things stretch badly: */ .Mail p { text-align: justify; } @media print { #Body p, #Body li, #Body blockquote { font-family: serif; line-height: 1.25; } } /* Things that may be in the article: */ .Label { padding-right: 0.25em; } td { vertical-align: top; } img { border: none; } h3 { font-size: 100%; margin: 2ex 0 0.8ex; } /* For some reason gecko seems to remove boldness from these elements when ** printing them -- they're fine on screen -- unless this is here: */ b, strong { font-weight: bold; } /* URLs after hyperlinks in printer-friendly pages: */ span.URL { font-size: 90%; } /* URLs under each headline in the daily e-mail: */ div.URL { margin: 0 0 1ex; padding-left: 1em; } div.URL a { text-decoration: none; } div.URL a, div.URL a:visited { color: #666; } /* last, in the hope of overriding anything above with the same specificity: */ a:hover, a:focus, .YouAreHere a:hover, .YouAreHere a:focus { color: #888; } a:active, a:visited:active, .YouAreHere a:active { color: #AAA; }