/**** main.css copyright (c) Abrahamse 2004 ****/
/* Constants */
/* Color : #005 rgb(0,0,85) */
/* Background-color : #fff */
/* Background-color for menus #ffe rgb(255.255.238) */
/* Dummy selector to guard against the BOM bug */
.ignore
{
}
/* BODY */
body
{
font-family : Arial, Helvetica, sans-serif;
background : #fff url('background.gif') no-repeat top left;
color : #005;
font-size : 100%;
font-weight : normal;
margin : 0;
padding : 0;
padding-top: 2px;
}
/* MARGINS */
div
{
margin : 0 40px 0.5em 40px;
padding : 0 0 0.5em 0;
border-bottom : 1px solid #eef;
}
h1
{
margin : 0 0 0.5em 0;
padding : 1px;
/* without the following line, text would jump around in */
/* other parts of the page when hovering over links */
background-color : transparent;
}
code
{
font-family : Arial, Helvetica, sans-serif;
color:blue
}
p, h2, ul, ol
{
margin : 0 0 0.3em 30px;
padding : 0;
}
p.last
{
margin-bottom : 1em;
}
div .quote
{
margin: 0.5em 6em 0.5em 6em;
border-style:none;
}
/* put a
... section after the end of an anchor */
/* in an
and the text appears below the anchor in */
/* in smaller, different colored font */
/* This marking is used primarily in menus */
ol
{
margin-left : 70px;
margin-right : 70px;
background-color : transparent;
margin-bottom : 0.5em;
}
/* ======================= */
/* UNORDERED LISTS */
/* ======================= */
ul
{
list-style-image : url('arrow-right.gif');
list-style-type : none;
margin-right : 0;
text-indent : -5px;
}
ul li
{
margin-left : 0;
margin-bottom : 0.5em;
}
ul li p
{
font-size : 80%;
margin : 0 1em 0 0;
text-indent : 0;
color : #118;
padding : 0;
background-color:inherit;
}
/* Bullets for other lists */
ul.image-www li { list-style-image : url('arrow-www.gif'); }
ul.image-email li { list-style-image : url('arrow-email.gif'); }
ul.image-loc li { list-style-image : url('arrow-loc.gif'); }
ul.image-right li { list-style-image : url('arrow-right.gif'); }
/* Bullets of single items in mixed lists */
li.image-up { list-style-image : url('arrow-up.gif'); }
li.image-down { list-style-image : url('arrow-down.gif'); }
li.image-www { list-style-image : url('arrow-www.gif'); }
li.image-loc { list-style-image : url('arrow-loc.gif'); }
li.image-email { list-style-image : url('arrow-email.gif'); }
/*
li.image-email { list-style-image : url('arrow-email.gif'); }
li.image-book { list-style-image : url('arrow-book.gif'); }
li.image-right { list-style-image : url('arrow-right.gif'); }
*/
/* lists without links */
ul.no-link
{
list-style-image : url('arrow-list.gif');
text-indent : 0;
}
ul.no-link li p
{
font-size:80%;
}
/* FONT sizes, weights and coloring for headers and some */
/* classed paragraphs */
h1
{
font-size : 111%;
font-weight : bold;
clear : both;
}
h2
{
font-size : 100%;
font-weight : bold;
clear : both;
}
/* back-arrow is used with the "back-to-top" link in faq-like pages */
p.back-arrow
{
text-decoration : none;
margin-top : 1em;
margin-left : 7px;
padding : 1px 1px 1px 22px;
background-position : left center;
background-repeat : no-repeat;
background-image : url('arrow-up.gif');
height : 12px;
}
p.back-arrow a
{
text-decoration : none;
}
/* MAJOR DIVISIONS */
/* Nearly every page contains a #top, #main and #bot section */
/* and many contain a #foot section (between #main and #bot) */
/* and few contain a #comment (between #foot and #bot) */
div#top
{
border : none;
background-color : transparent;
margin-left : 0;
margin-right : 0;
font-size : 100%;
text-align : center;
margin : 0 0 0 0;
padding : 4px 0 4px 0;
}
div#main
{
border-top: 1px solid #eef;
}
/* ======================= */
/* FOOT DIVISION */
/* ======================= */
div#foot
{
font-size : 75%;
}
div#foot ul li p
{
font-size : 100%;
}
div#comment
{
font-size : 75%;
}
div#comment p
{
margin : 0 0 1em 0;
color : #118;
}
div#bot
{
clear:both;
border : none;
font-size : 90%;
margin : 0 0 0 5px;
padding : 0 0 0 0;
}
/* Elements specific to the #main section */
/* A #main section only has one h1, at the top, almost always */
/* containing an anchor pointing back to the parent page, and a */
/* left-pointing arrow in the margin */
div#main h1
{
padding-top : 0.25em;
padding-bottom : 0.25em;
background-repeat : no-repeat;
background-image : url('arrow-left.gif');
margin-left : -22px; /* margin-left + padding-left = -6px */
padding-left : 16px; /* offsets 6px padding around anchors */
background-position : left center;
}
/* A few #mains (e.g., the home page) don't have an anchor or arrow */
div#main h1.icon-none
{
background-image : none;
margin-left : 0;
padding-left : 0;
}
/* ------------------------------------------- */
/* MENUS */
/* ------------------------------------------- */
div.menu
{
padding : 0.5em 0 0.25em 0;
margin : 2px 0 0 -4px;
width : 100%;
background-color : #ffe;
border-bottom : 1px solid #ddf;
border-right : 1px solid #ddf;
border-top : 1px solid #fef;
border-left : 1px solid #fef;
}
div#foot div.menu
{
border-style:none;
background-color:#fff;
}
/* to have two side-by-side menus, make two menus an append the following respectively */
div.left
{
float : left;
width : 49%;
}
div.right
{
float : right;
width : 49%;
}
div#main h2
{
background-color : transparent;
margin-left : -18px;
padding-left : 18px;
}
/* END OF MENUS */
/* TOPIC */
div.topic
{
font-size : 80%;
padding : 0;
margin : 2em 0 2em 0;
border-bottom : none;
}
div.topic ul
{
list-style-image : url('arrow-www.gif');
}
div.topic ul li p
{
font-size:100%;
color:maroon;
}
div.topic h2
{
font-size : 120%;
text-align:center;
}
/* An icon in the left-marge of a paragraph */
p.icon
{
margin-left : -3px; /* sum of these two numbers should add up to */
padding-left : 35px; /* the same sum in the unclassed */
background-position : left top;
background-repeat : no-repeat;
}
.acorn { background-image : url('acorn.gif'); }
.hour { background-image : url('hour.gif'); }
.www { background-image : url('arrow-www.gif'); }
/* IMAGES */
img
{
padding : 0;
margin : 2px;
border : 1px solid;
border-color : #88e #44e #44e #88e;
}
/* HACK */
/* needed after floated images and divs to keep them contained within the containing div */
/* only needed in ie */
div.hack
{
height:0;
clear:both;
border-style:none;
margin:0 0 0 0;
}
/* ANCHORS */
a
{
text-decoration : none;
color : #400;
background-color : transparent;
margin : 0;
padding : 1px 6px 1px 6px;
border : none;
}
a:hover
{
text-decoration: none;
color : #400;
background-color : #eef;
margin : 0;
padding : 0 5px 0 5px;
border-width:1px;
border-style:solid;
border-color : #aaa #111 #111 #aaa;
}
/* INLINE ANCHORS */
p a
{
color : #000;
text-decoration : underline;
padding-left : 1px;
padding-right : 1px;
}
p a:hover
{
padding-left : 0;
padding-right : 0;
}
/* ANCHORS in HEADERS */
h1 a
{
color : #005;
font-weight : bold;
}
/* For a horizontal row of buttons with links */
p.text-buttons
{
font-size:80%;
height:auto;
vertical-align:middle;
text-align:center;
padding:4px 0 4px 0;
margin:2em 0 2em 0;
}
p.text-buttons a
{
height:auto;
padding : 2px 8px 2px 8px;
margin-top:2em;
vertical-align:middle;
text-decoration : none;
border-style:solid;
border-width:1px;
border-color : #aaa #111 #111 #aaa;
}
p.text-buttons a
{
text-decoration : none;
border-color : #aaa #111 #111 #aaa;
}
p.text-buttons a:hover
{
border-color : #111 #aaa #aaa #111;
color:#400;
}
/* IMAGES */
/* Image centered on the page */
img.image-center
{
display : block;
margin-left : auto;
margin-right : auto;
padding-bottom : 4px;
}
/* Image floated in upper left corner */
p.image-left
{
margin-left : 0;
margin-right : 0.5em;
padding-left : 0;
padding-right : 0;
float : left;
padding-bottom : 2px;
clear : both;
}
/* Image floated in upper right corner */
p.image-right
{
margin-left : 8px;
margin-right : 0;
padding-left : 0;
padding-right : 0;
float : right;
padding-bottom : 2px;
}