/* TODO
  http://www.w3.org/QA/Tips/font-size
*/

.invisible {
    /* Reserves space but does not display.
       Unfortunately is not implemented correctly for table rows by
       either IE6 or Opera8.5.  */
	visibility: hidden;
}
.hidden {
 	/* Do not display and do not reserve space. */
	display: none;
}

/* These two rules seem to fix sporadic IE6 misbehavior wrt auto margins
   with no effect on proper rendering by Firefox 1.5 and Opera 8.5.  */
body { text-align: center; } div#container { text-align: left; }

body {
	margin: 0px;
/*        font-family: dante mt;
        font-size: 18px;
*/
	background-color: navy;
}
a:link    { color: rgb(230,0,0);    }
a:active  { color: #ffcc00; }
a:visited { color: navy;   }

div#container {
	width: 800px;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff7e7;
}

div#headlogo {
	text-align: center;
}
div#namelettering {
	width: 100%;
	text-align: center;
}
span.URL, span.email {
	/* Beware Dreamweaver prompting for "mono" which is invalid. */
	font-family: monospace;
}
span.korean { /* Korean words referred to as words. */
	font-style: oblique;
}
img {
	border-width: 0;
	padding: 5px;
}
dt, li.emph {
	font-weight: bold;
}
caption {
	font-weight: bold;
	font-size: larger;
	/* Implemented by Opera 8.5 and Firefox 1.5,
	   but not IE6: caption is too close to table. */
	height: 3.5ex;
}
table.schedule, table#archives, table#officers {
	border-collapse: collapse;
	background-color: silver;
}
table.schedule thead, table#archives thead {
	background-color: #ffcc00;
	/* IE6 and Opera 8.5 do this by default; Firefox 1.5 doesn't. */
	text-align: center;
}
table#officers thead{
	background-color: #ffcc00;
	text-align: left;
}
table.schedule td, table#officers td, table#archives td {
	padding: 4px;
}
table.schedule th, table#officers th, table#archives th {
	padding: 4px;
}
table.schedule tr, table#archives tr, table#officers tr {
    /* IE6 doesn't recognize; Opera 8.5 and Firefox 1.5 do */
	border: 1px solid black;
}
/* For IE, at least border the table itself. */
table.schedule, table#archives, table#officers {
        border: 1px solid black;
}
/* If .invisible worked for table rows, we we could do the following
   and avoid using empirical width value below (in fact avoid need to
   label the columns at all):
  <!-- make last column as wide as other tables by putting
       "Exercise Room" in an invisible row -->
  <tr class="invisible"><td></td><td></td><td>Exercise Room</td></tr>
*/
table.schedule col.location {
	/* Different browsers seem to need different widths before
	   they will render each table row on one line.  Odd behavior here. */
	width: 10em;
}
/* See comments below on centering a column.  Doing same thing here. */
table.schedule td:first-child + td + td { /* third column: location */
	text-align: center;
}
/* IE6 needs this rule to be separate. */
table.schedule col.location {
	text-align: center;
}
/* Temporary cancellation */
tr#summersunday td {
  text-decoration: line-through;
}
.float {
	float: right;
}
div#announcements {
	background: gray;
        border: 1px solid black;
}
div#announcements h1 {
	color: white;
}
div#announcements dt {
        /* Too vibraty with the blue.  Try thinner black.
        /* border: 2px solid rgb(230,0,0); */
        border: 1px solid black;
	background-color:#3366CC;
}
div#announcements dl {
	margin-bottom: 3ex;
}
div#announcements dd {
	color: white;
}
div#footer {
	clear: both;
	margin-top: 2ex;
	border-top: 1px solid black;
}
div#footer table#standard {
	table-layout: fixed;
	width: 100%;
}
/* 
	IE6 implements `text-align' for a column, but it's not in the
	CSS2 standard and Firefox 1.5 and Opera 8.5 do not implement it.
	A complicated CSS2 selector will do the trick, but IE6 doesn't
	implement it, so we need two rules for each column here.
	(Furthermore, IE6 won't work if you combine this selector with
	a comma.)
	
	The `width' setting will apply to all browsers; since we set the
	`table-layout' to fixed, we need to set the width of only the
	first column.
*/
div#footer table#standard col.links {
/* Konqueror 3.3.2 needs 50% for unexplained reasons.
   Firefox 1.5, Opera 8.5, IE6 all OK with 33%. */ 
	width: 33%;
}
div#footer table#standard td:first-child + td { /* second column: contacts */
	text-align: center;
}
/* IE6 needs this rule to be separate. */
div#footer table#standard col.contacts {
	text-align: center;
}
div#footer table#standard td:first-child + td + td { /* third column: copyright */
	text-align: right;
	font-size: smaller;
}
/* IE6 needs this rule to be separate. */
div#footer table#standard col.copyright {
	text-align: right;
	font-size: smaller;
}
ul.jumptable, ul.resources {
  /* display: compact; Not implemented by browsers yet? FireFox JavaScript (!) console gives error */
	background-color: silver;
	border: 1px solid gray;
  /*	list-style-type: circle; */
	list-style-type: disc;
	list-style-position: inside;
	width: 430px;
	margin-left: 5%;
	padding: 6px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: smaller;
}
ul.jumptable:before {
	content: "Jump to:";
}
/* This is how you override a "content" property.  No longer needed because
   I made new class "resources".
ul.resources:before { COMMENT Override ul.jumptable setting.
	content: normal;
}
*/
ul#sabumnims { /* move margin in from jumptable margin */
	margin-left: 10%;
	background-color: #CCCCCC;
}
ul#homepage {
	float: left;
	margin-top: 0px;
	margin-left: 0px;
	/* FIX Rendered height varies by browser, so must find better solution. */
	/* img has attribute height=256 */
	height: 256px;
	font-size: 14px;
}
ul#homepage li { /* spread out to fill vertical space */
	margin-top: 2ex;
}
div.emergency-banner {
	text-align: center;
	background-color: rgb(230,0,0);
	border: 1px solid black;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: smaller;
	margin-top: 1ex;
        padding: 1ex;
	margin-bottom: 1ex;
}
div.emergency-banner a:link { color: #ffcc00;    }
div.login-status {
	padding: 4px;
	margin-top: 1ex;
	border: 1px solid black;
	background-color: #ffcc00;
}
div#error-404, div#constitution h1 {
        text-align: center;
}
div.office-notes, div.office-description {}
div.office-notes {} /* container for office notes */
/* container for introductory paragraphs in notes-header.php maintained by Assistant Instructor */
div.office-notes-intro { background-color: rgb(220,215,255); } 
div.office-notes#title {}
div.office-notes#info {}
div.office-notes#advice {}
div.office-notes#example {}

div.office-description {} /* container for office description */
div.office-description#title {}
div.office-description#prerequisites {}
div.office-description#objectives {}
div.office-description#policies {}

/* FIX push to the right */
span#cookie-notice {
    font-size: small;
}
table.terminology {
	border-collapse: collapse;
	background-color: silver;
        /* FIX kludge */
        width: 150%;
}
table.terminology tr {
    /* IE6 doesn't recognize; Opera 8.5 and Firefox 1.5 do */
	border: 1px solid black;
}
table.terminology th {
	padding: 6px;
}
table.terminology td.notes {
        font-size: small;
}

/* These are containers for sequences of individual policies, i.e., the pages
after the intro paragraphs. */
div.policies-draft div.policy {
    background-color: #99bb99;
}
div.policies-draft div.policy h3:after {
    content: " [draft]";
}
div.policies-proposed div.policy {
    background-color: #99aadd;
}
div.policies-proposed div.policy h3:after {
    content: " [proposed]";
}
div.policies div.policy {
    background-color: #ddaaaa;
}

/* An individual policy block, including draft and proposed policies (though may
want to separate these out). */
div.policy {
    border: 1px solid black;
    margin-top: 1ex;
    padding: 3px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
}

div.sidebar {
  /* display: compact; Not implemented by browsers yet? FireFox JavaScript (!) console gives error */
	background-color: silver;
	border: 1px solid gray;
	width: 75%;
	margin-left: auto;
	margin-right: auto;
	padding: 6px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
/*	font-weight: bold; */
	font-size: smaller;
}

div.editable-block {
	border: 1px solid black;
        padding: 7px;
        background-color: #aaccdd;
}
ol#join-overview { list-style-type: upper-alpha; }
ol#join-overview ol { list-style-type: decimal; }
ol#join-overview ol ol { list-style-type: lower-alpha; }

dl#join-summary { font-size: smaller; }

object#test, iframe#test {
    width: 100%;
    height: 1000px;
}

div.edit-entry {
    border: 1px solid black;
    background-color: #99aadd;
    padding: 5px;
    font-size: x-small;
}

div#homehistory, .emphatic {
	background-color: rgb(255,220,215);
	border: 1px solid gray;
        margin-bottom: 2ex;
	padding: 10px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}

/* 
When IE supports the <q> tag, revise the web pages to use them.  IE6 also won't obey
q:before { content: open-quote; }
*/