/*
 * Color pallette scheme planning/testing...
 *
 * Things we can adjust:
 *
 * r : border-color
 * g : background-color
 * t : color
 * z : font-size
 * b : font-weight     (bold/strong)
 * i : font-style      (emphasized/italic/oblique/slanted)
 * u : text-decoration (underlining/line-thru/overline)
 * c : text-transform  (UPPER, lower, Capit)
 * m : text-variant    (small-caps)
 *
 * Places we want to adjust:
 *
 * heading (section, sub-section, sub-sub-, sub-sub-sub-)
 * lead
 * body
 * sidenote
 * footnote
 *
 * attention
 *    attention-in-a-box
 *    small attention
 *    update
 * topic-of-interest
 * underlined
 * blinking
 * book title, magazine article, web site URL/I
 * to-be-removed
 *
 * level
 *
 * calculation/pattern sample
 * execution sample
 * user entry
 * buffer content
 * used buffer content
 *
 * highlighting 1-6
 *
 * keyword
 * library symbol
 * operator
 * syntax symbol
 * keystroke
 * system name
 * user data
 * programmer defined identifier
 * comments
 *
 * code good
 * code okay
 * code bad
 * code evil
 *
 */

/*
 * Old pallette scheme:
 *
 * all text: black
 * bg body: 40d2ca
 * bg heads: 20b2aa
 * brd heads: 10a29a
 * bg leads: 40d0c9
 * brd leads: 20b2aa
 * bg sides: 40d0c9
 * brd sides: 20b2aa
 * foots: green oblique text
.highlight1 { background-color: #00CF00; }
.highlight2 { background-color: #0000FF; }
.highlight3 { background-color: #CF0000; }
.highlight4 { background-color: #C700C7; }
.highlight5 { background-color: #00C7C7; }
 */

body
{
    font-size: 76%;
}

*
{
    margin: 0px;
    padding: 0px;
    font-size: 1em;
    /* color: currentColor; */
}

select { min-width: 1.5em; }

h1, h2, h3, h4, h5, h6, p, pre, blockquote, body, table, ul, ol, dl,
    label, address, form, fieldset
{
    margin: 1em 2%;  /* tb lr */
}
dt, li, dd, blockquote { margin-left: 2%; }
body, fieldset { padding: .5em; }

/* adjusting for visually impaired viewers (they prefer light text on dark
 * backgrounds to improve contrast)
 */
body, html
{
    /* font-size: 1.2em; */
    text-align: justify;
    color: #ffcc99;
    background-color: #663333; /* saddlebrown;  more of a plum: #996666; */
    font-family: "Veranda", sans-serif;
    font-size-adjust: 0.58;
}

/* make table have a border
 */
.border, table.border td, table.border th
{
    border: thin outset;
}

/* make pre actually pre-formatted!
 */
pre
{
    font-family: "Courier New", Courier, monospace;
    white-space: pre;
}

/* make blockquotes actually block quotes!
blockquote
{
    white-space: pre;
}
...or not... */

/*
 * link colors
 */
a
{
    text-decoration: underline;
}
a:link
{
    color: #add8e6; /* light blue */
}
a:visited
{
    color: #add8e6; /* teal #008080 */
}
a:hover
{
    outline-style: solid;
    outline-color: #add8e6;
}

hr
{
    color: #ffcc99;
    background-color: #ffcc99;
}

/* generally tables should have their empty cells shown */
table
{
    empty-cells: show;
}

/* table headers should be centered in both horizontal and vertical
 * orientations
 */
th, .tabhead
{
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
}

/* table cells should be padded a bit...
 * (.tabhead is for...um...I forgot...)
 */
th, td, .tabhead
{
    padding: .8em;
}

.tabhead
{
    border-style: solid !important;
    border-color: #ffcc33 !important;
    border-top-width: .18em !important;
    border-left-width: .18em !important;
    border-bottom-width: .18em !important;
    border-right-width: .18em !important;
    background-color: #663300 !important; /* plummy: #996666; */
    font-weight: bold !important;
    color: #cccc99 !important;
    font-size: 150% !important;
}

/* list elements should be separated from one another */
li, dd
{
    padding-bottom: 1em;
}

/*
 * list elements that are children of a 'compact' list area shouldn't add the
 * extra padding indicated above...
 */
.compact-list>li
{
    padding-bottom: 0px;
}

/* first child that's a paragraph inside a list item needs no extra
 * padding (because it will abut the bottom padding added above by
 * its ...er...cousin?...um... the previous list element -- or it is
 * the first one and that'd just look silly, too...)
 */
li>p:first-child, dd>p:first-child
{
    padding-top: 0px;
    margin-top: 0px;
}

li li:last-child
{
    padding-bottom: 0px;
}

/*
 * super- and sub- scripts should be a little smaller than surrounding text
 */
sup, sub, .super, .subscr
{
    font-size: 50%;
}
.super
{
    vertical-align: super;
}
.subscr
{
    vertical-align: sub;
}

/*
 * padding around all pre's to separate content from borders...
 * and let ones too wide have natural scrolling...
 */
pre
{
    padding: .2em;
    overflow: auto;
}

/*
 * An ...ID... for the announcement header that forms at the top of a page...
 * (it's my first one, you see...*sniff*)
 */
#head-announce
{
    /* nothing special generally...but... */
}

    @media print
    {
        #head-announce { display: none; } /* don't bother to print them! */
    }

/*
 * labels problems involving graphics (like the 214 Java book does)
 */
.javaG
{
    color: #DDA0DD; /* plum */  /* violet: #EE82EE */
}

/*
 * labels problems involving testing (like the 214 Java book does)
 */
.javaT
{
    color: cyan;
}

/*
 * all operators, keywords, programmer defined variables, constants, types,
 * etc. should be in bold monospace.
 *
 * programmer defined items are additionally in italics.
 */
.oper, .keyword, .libsymb, .syntax, .preproc, .comment, .progdef, .keyboard,
    .data, .operlike
{
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 1.1em;
    /* color: currentColor; */
}
.preproc, .comment, .progdef, .data
{
    font-style: italic;
}
.keyboard
{
    border-width: .1em;
    border-spacing: .2em;
    border-style: outset;
    line-height: 1.75em;
}

/* need padding after italicized items or they tend to run over following
 * texts...
 */
em:after { font-size: 30%; content: " "; }
.preproc:after, .comment:after, .progdef:after, .data:after
{
    font-size: 30%;
    content: " ";
}

/* The font-size shift -- font-size:120% -- was truly obnoxious...
 * ...but I'd like some way to highlight these items somehow...
 */
.preproc:hover, .syntax:hover
{
    text-decoration: overline underline;
    outline-style: double;
    outline-color: #ffcc66;
    outline-color: currentColor;
}
.data:hover
{
    text-decoration: overline;
    outline-style: solid;
    outline-color: #ffcc66;
    outline-color: currentColor;
}
.keyword:hover, .oper:hover
{
    text-decoration: underline;
    outline-style: solid;
    outline-color: #ffcc66;
    outline-color: currentColor;
}
.comment:hover, .libsymb:hover
{
    text-decoration: overline underline;
    outline-style: dashed;
    outline-color: #ffcc66;
    outline-color: currentColor;
}

/*
 * highlighting colors for use in examples to point out certain features.
 */
.highlight1 { background-color: #336600; }
.highlight2 { background-color: #993300; }
.highlight3 { background-color: #333333; }
.highlight4 { background-color: #003366; }
.highlight5 { background-color: #6600ff; }
.highlight6 { background-color: #f03333; }

/*
 * columns...*shrug*
 */
.multicol
{
    -moz-column-count: 2;
    -moz-column-gap: 3em;
    -moz-column-rule: none;
    column-count: 2;
    column-gap: 3em;
    column-rule: none;
}

/*
 * in-paragraph lists...
 */
.in-para-li, ul.in-para-li li
{
    display: inline;
}
ul.in-para-li, ul.in-para-li li
{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
ul.in-para-li li:before
{
    content: ", ";
}
ul.in-para-li li:first-child:before
{
    content:  " ";
}

/*
 * styles for headings:
 *     chapters, sections, sub-sections, sub-sub-sections...
 */
    .chap, .sect, .sub, .subsub, .subsubsub
    {
        padding-top: .25em;
        padding-bottom: .25em;
        padding-right: .25em;
        padding-left: .25em;
        margin-top: .5em;
        margin-bottom: 0px;
        margin-right: auto;
        margin-left: auto;
        border-style: solid;
        border-color: #ffcc33;
        background-color: #663300; /* plummy: #996666; */
        font-weight: bold;
        color: #cccc99;
    }
    /*
     * these border changes don't seem to work when I chain them
     * together like I'm supposed to...or was that just the 'quirks
     * mode' crap?
     */
    .chap
    {
        border-top: none;
        border-left: none;
        border-bottom: none;
        border-right: none;
        font-size: 225%;
    }
    .sect
    {
        border-top-width: .18em;
        border-left: none;
        border-bottom: none;
        border-right: none;
        font-size: 200%;
    }
    .sub
    {
        border-top-width: .18em;
        border-left-width: .18em;
        border-bottom: none;
        border-right: none;
        font-size: 175%;
    }
    .subsub
    {
        border-top-width: .18em;
        border-left-width: .18em;
        border-bottom-width: .18em;
        border-right: none;
        font-size: 150%;
    }
    .subsubsub
    {
        border-top-width: .18em;
        border-left-width: .18em;
        border-bottom-width: .18em;
        border-right-width: .18em;
        font-size: 125%;
    }
/* end heading styles */

/* floating styles */
    h1, h2, h3, h4, h5, h6, hr { clear: both; }
    .barrier
    {
        clear: both;
        border-width: 0px;
        padding: 0px;
        margin: 0px;
        height: 0px;
        overflow: hidden;
    }

    .lead
    {
        padding-top: .5em;
        padding-bottom: .5em;
        padding-right: .5em;
        padding-left: .5em;
        margin-top: .5em;
        margin-bottom: .5em;
        margin-right: .5em;
        margin-left: .5em;
        border-width: .18em;
        border-style: solid;
        border-color: #ffcc33;
        background-color: #336600;
        color: #ffcc99;
        font-size: 110%;
        float: left;
    }

    .footnote { color: green; font-style: oblique; }

    .sidenote
    {
        padding-top: .5em;
        padding-bottom: .5em;
        padding-right: .5em;
        padding-left: .5em;
        margin-top: .5em;
        margin-bottom: .5em;
        margin-right: .5em;
        margin-left: .5em;
        border-width: .18em;
        border-style: solid;
        border-color: #ffcc33;
        background-color: #663300; /* plummy: #996666; */
        color: #cccc99;
        font-size: 80%;
        width: 30%;
        float: right;
    }
/* end floating styles */

/* example code markup */
    .good, .okaybut, .bad, .verybad { border: solid; border-color: #ffcc33; }
    .good { background-color: #336600; }
    .okaybut { background-color: /*yellow; #ddaa00; orange;*/ #ff7f00; }
    .bad { background-color: #ff6666; }
    .verybad { text-decoration: line-through; color: #ff6666; }

    @media print
    {
        .good { color: #336600; }
        .okaybut { color: yellow; }
        .bad { color: #ff6666; }
    }
/* end example code markup */

/* execution markup */
    /* .sample { background-color: #552222; } */
    .user, .buffused, .sample-exec, .sample-calc, .sample-pat, .sample-pattern,
    .sample-code
    {
        background-color: #552222;
    }
    .user, .buffused { color: #66CCFF; }
    .buffused { text-decoration: line-through; }
    .sample-exec, .sample-calc, .sample-pat, .sample-pattern, .sample-code
    {
        border-color: #ffcc33;
    }
    .sample-exec, .sample-calc { border: solid; }
    .sample-pat, .sample-pattern, .sample-code { border: dashed; }
/* end execution markup */

/* assignment markup */
    .topic { font-size: 110%; font-weight: bolder; }

    .blank { line-height: 3em; }

    .right { float: right; }
    .answer { color: #663333; }
    .answer-blank { line-height: 2em; color: #663333; white-space: nowrap; border-bottom: solid; border-width: 2px; border-color: #ffcc99; }
    .answer-blank-code { line-height: 2em; color: #552222; white-space: nowrap; border-bottom: solid; border-width: 2px; border-color: #ffcc99; }

    .level { text-decoration: underline; color: #9966FF; }

    .tfhead:after { content: "<table><tbody>"; }
    .truefalse:before { content: "<tr><th>TRUE</th><th>&nbsp;</th><th>FALSE</th><th>&nbsp;</th><td>"; }
    .truefalse:after { content: "</td></tr>"; }
    .tftail:after { content: "</tbody></table>"; }
    .tfbox { vertical-align: text-top; }
    .TRUE:after { width: 8%; font-weight: bold; padding: 1em; content: "TRUE"; }
    .FALSE:after { width: 8%; font-weight: bold; padding: 1em; content: "FALSE"; }
    .tfchoice { width: 8%; font-weight: bold; padding: 1em; }
    .tfitem { vertical-align: middle; width: 90%; }
/* end assignment markup */

/* web markup */
    .nowrap, .nobreak { white-space: nowrap; }

    .update { color: #FF0000; font-size: 125%; }
    .attention { color: #32CD32; /* #F00070; */ font-size: 125%; }
    .sm-atten { color: #32CD32; /* #F00070; */ font-size: 75%; }
    .attenbox, .atten-box
    {
        border-style: solid;
        border-top-width: .2em;
        border-bottom-width: .2em;
        border-right-width: .2em;
        border-left-width: .2em;
        border-color: #32CD32; /* #F00070; */
        font-size: 125%;
    }
    .uline, .bktit { text-decoration: underline; }
    .bktit { font-style: italic; }
    .sout, .sthru, .xout, .strike, .remov { text-decoration: line-through; }
    .blink { text-decoration: blink; }

    .no-print { /* nothing special normally, but... */ }

    @media print
    {
        .no-print { display: none; }
    }
/* end web markup */