/* Modified style sheet to accompany DocEng'04 article in hypertext format Cascading Style Sheet version 2 File: base.css */ /* The template uses a blue background and a modern (or serif) font for the body, a sans-serif font for heading, and a simulated handwriting font for marginal notes and annotations. Other fonts that you might prefer for the body are Optima or Skia but they are not as common in WWW browsers as Georgia and Times New Roman. I prefer to read with only the Skia font and a background of #ffffcc (very pale yellow) but I think the blue is more conventional. Also, I didn't want to violate the convention of blue links being unvisited, and I find blue text on a yellow background quite distracting. I like the convention of using sans-serif fonts for headings and, much though I adore Copperplate, Arial is very readable and frequently available. */ body {font-family: Palatino, Georgia, "Lucidia Bright", "Times New Roman", serif; background-color: #9cc; color: black; quotes:'\2018' '\2019' '\201C' '\201D'} h1, h2, h3, h4, h5, h6, dt.head, strong.head, dl.meta dt, dt dfn /* note exception below for dt dfn inside div#gloss */ {font-family: Arial, Helvetica, "Copperplate", "Trebuchet MS", sans-serif} .centre, h1, h2.sect, span.caption, p.caption {margin-left:auto; margin-right:auto; text-align:center} .centrebox {margin-left:auto; margin-right:auto; margin-top:1.2ex; border: thin groove #699} .left {float:left} .right {float:right} .noCSS {display:none} ul.single {list-style-type:none} ul.none {list-style-type:none} hr {clear:both} pre, code {font-family:'Andale mono', 'OCR A Tribute Com', monospace; font-size:small} pre {color:#630} caption {text-indent:0; text-align:left} /* nested lists */ ol {list-style: decimal} ol ol {list-style: upper-alpha} ol ol ol {list-style: lower-roman} ol ol ol ol {list-style: lower-alpha} /* miscellaneous effects */ p.smaller {font-size: smaller} /* volume numbers in citations */ span.vol {font-weight: bold} dt a span.citelabel {font-weight: bold} /* class="revise" text needing revision */ .revise {background-color:#fcc; border: medium dotted #f69;} /* why did I ever use bold? */ b {background-color: #f39} ol.alpha {list-style: lower-alpha} ol.arabic {list-style: decimal} li.empty {list-style-type: none} /* li class="empty" can be used to space out navigation lists */ span.stat {font-style:italic} h2 img {vertical-align:middle; border:0} /* footnote-like marks and text */ sup.fn {color: #60c; font-weight:bold} span.fn {background-color: #ccf;} /* subheads */ div.sub {margin-left:10%; margin-right:10%} /* marginal-notes */ div.marginal, p.marginal, a.marginal, span.marginal {border:thin solid #693; background:#ff6} div.example, p.example, a.example {background-color:#99c; border:thin #369 solid} div.example, div.marginal, div#gloss, p.example, p.marginal, a.example, a.marginal, span.marginal, div#gloss dl dt dfn, dd.annote {font-family:'Papyrus', 'Lucidia Handwriting', 'Apple Chancery', 'Chalkboard', 'Comic Sans MS', cursive} div.example, div.marginal, div#gloss, p.example, p.marginal, a.example, a.marginal, span.marginal, dd.annote {font-size: smaller} div#gloss {width:45ex; margin-left:auto; margin-right:auto; border:thin groove #633; background:#cfc} div.marginal, p.marginal, span.marginal {font-size:small;} div.marginal, p.marginal {clear:right;float:right; width:6.7em; margin-top:auto; margin-bottom:auto; padding:.5em; margin-left: .9em} div#medgloss dt {font-style: oblique; font-variant: small-caps} div#medgloss dt:first-child {font-style: normal; font-variant: normal} p.title {text-align:center; margin-left:auto; margin-right:auto; font-weight:bold} span.title {font-weight:bold; font-style: normal; font-variant: normal} dd.annote {text-align:right; width:90%; float:right; padding-top:.25ex; padding-right:.35ex; padding-left:.25ex; margin-left: 1.5ex} /* NB: the font for dd.annote is the same as for p.marginal those fonts are defined together above */ dt.postann, dd.annote + dt {clear:both} /* Discourse level `disco' is short for discourse, i.e. the meta-content */ div.disco > h2, div.disco > h3, div.disco > h4, div.disco > h5, div.disco > h6 {color: #030; background-color: #699} div.disco {color: #033; border-color: #699; background-color: #9c9} div.disco {width: 90%; border-style: solid; border-left-width: medium; border-right-width: medium; border-bottom-width: thin; border-top-width: 0} div.disco>p {padding-left: .7em} /* anchors (part 1 of 2)*/ a:target {border:medium #9c0 dotted; background-color: #cf9; color: black} a.non:target {border:inherit; background-color:inherit; color: inherit} /* There are some links that should not be highlighted when they are targets. Use class="non" for them */ a:link, a:visited {font-weight: bold} a.off-site, a.citation {font-weight: normal} /* Links to documents that are not part of the current article should not be highlighted. You might want to include graphics to show that they are special. See for example the images at http://users.cs.dal.ca/~jamie/Icons/readme.shtml */ /* anchors (part 2 of 2) Dynamic Screen Effects for XHTML Friends Network (XFN) and Citations */ a.XFNperson {text-decoration:none; color:inherit; font-weight:inherit} a.citation, span.citation {text-decoration:none; border-bottom:none; color:inherit} @media screen{ /* XFN & Citation Links should only be visible when the mouse focus is in their containing box By default they are not decorated as links */ /* XHTML Friends Network (XFN) */ p:hover a.XFNperson, ul:hover li a.XFNperson {text-decoration:underline; color:blue} /* Citations are either anchors or spans the spans are used when the link is only in one part, perhaps the year, but the rest should be highlighted to show context cites in headings are always on cites within lists require special processing because of deficient parsing in Netscape 7.1 */ h1 a.citation, h1 span.citation, h2 a.citation, h2 span.citation, h3 a.citation, h3 span.citation, h4 a.citation, h4 span.citation, h5 a.citation, h5 span.citation, h6 a.citation, h6 span.citation, li.hascite:hover a.citation, li.hascite:hover span.citation, pre:hover a.citation, pre:hover span.citation, dt:hover a.citation, dt:hover span.citation, dd:hover a.citation, dd:hover span.citation, p:hover a.citation, p:hover span.citation {border-bottom:thin dotted blue} span:hover a.citation, pre:hover a.citation, h1 a.citation, h2 a.citation, h3 a.citation, h4 a.citation, h5 a.citation, h6 a.citation, dt:hover a.citation, dd:hover a.citation, li.hascite:hover a.citation, p:hover a.citation {color:blue} } /* end of screen only section */ /* navigation links (general) */ /* class="nav" links are meant to stand out like signposts color:#fc6 is a pale-ish orange that you might want to try for highlighting instead (perhaps as border-bottom for links, or for an entire span when the current paragraph is rolled-into */ p.nav, div.nav, span.nav, div.navbox ul ul, li.navhead {background-color:#cff} p.nav, div.nav {color:black} ul.nav {list-style-type:none; padding-left:0} /* start & end of section navigation lists */ /* I am indebted to Eric Meyer for showing me how to format the `plus sign' navigation lists with CSS. I learned a lot about CSS containers from this example. */ h2.sect {clear:both} p.skipper {float:left;font-size:small} p.sizer {height:.1px; font-size:0; line-height:.1px} div.navbox {margin:0 auto;padding:0 0.5em} div.navbox + * {clear:both} /* Windoze IE doesn't obey this */ #skipto, .IEbug6 {clear:both} /* Workaround Windoze IE */ h4#botnavhead {margin-top:2em} div.navbox p {clear:both;margin:0;padding:0} ul.navbox {float:left; margin:0; padding:0; list-style-type:none} li.navhead {font-weight:bold; text-align:center} li.navhead li {font-weight:normal;text-align:left;text-indent:-1.5em} div.navbox, ul.navbox {width: 35em} ul.navbox>li, h4.navbox {width: 17.25em} h4.navbox {text-align:center; margin:auto; margin-bottom:0; padding-bottom:0; padding-left:0; padding-right:0} ul.navbox>li.top, ul.navbox>li.alt {margin: 0 8em} ul.navbox>li {float:left; border:thin #039 solid} ul.navbox>li.top {border-bottom: none; padding-bottom: .5em} ul.navbox>li.prev {border-right: thin solid} ul.navbox>li.next {border-left: none} ul.navbox>li.prev, ul.navbox>li.next {border-bottom: thin solid; border-top: thin solid; padding-bottom: .5em} ul.navbox>li.alt {border-top: none; padding: .5em 0} ul.navbox>li ul {list-style:none inside; text-align:center;margin-left:auto;margin-right:auto} ul.navbox>li ul li {list-style:none inside; text-align:center;margin-left:auto;margin-right:auto} /* screenshots and labels */ img.label {height:1.6ex; width:1.6ex} img.fig {width:609px; height:370px; border:outset medium #063} img.red {border: thin red dashed} /* validation stickers in footer */ p#valid a img {border:0} p#valid {float:left} /* EOF */