body {
    /* background-color: #8080a0; */
    /* background-color: #6060b0; */
    /* background-color: #F8F8F0; */
    /* background-color: #D8D8D0; */
    /* background-color: #406090; */ 
    /* background-color: #c0c0d0; */

    /* background-color: #FF0000; */
    /* background-color: #00FF00; */
    /* background-color: #0000FF; */

    /* background-color: #FFFF00; */
    /* background-color: #00FFFF; */
    /* background-color: #FF00FF; */

    /* background-color: #FF8800; */
    /* background-color: #00FF88; */
    /* background-color: #8800FF; */

    /* background-color: #D06688; */
    /* background-color: #88D066; */
    /* background-color: #6688D0; */

    /* background-color: #C06698; */
    /* background-color: #98C066; */
    /* background-color: #6698C0; */

    background-color: #c0c0d0; 
    margin:      20px;
    margin-top:  10px;
    /* border:      40px solid #fff; */
    /* border-top:  10px solid #fff; */
    padding:     0px;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    color: #303060; 
}

h1 {
    font-size: "151%";
    padding: 0px;
    /* t r b l */
    margin: 50px 0px 10px 0px;
    text-align: center;
}

h2 {
    font-size: "110%";
    padding: 0px;
    padding-top:    4px;
    padding-bottom: 4px;
    margin: 50px 0px 10px -40px;
    border-top: 3px solid #c0c0d0;
    text-align: left;
    /* width: 80%; */
}

h3 {
    font-size: "105%";
    padding: 0px;
    margin: 40px 0px 5px -35px;
    text-align: left;
    text-decoration: underline;
}

h4, h5, h6 {
    font-size: 100%;
    padding: 0px;
    margin: 30px 0px 8px -30px;
    text-align: left;
}

h5, h6 { font-style: italic; }
h6 { font-weight: normal; }

p { margin:5px 0px 10px 0px; }

/* Links -- plain & hover */


/* Hover -- when the pointer is placed over a link, change its
 * appearance.  This may be the single most useful link attribute to
 * specify as it doesn't interfere with page legibility, but does
 * clearly denote links.
 */


A:link { 
    font-weight: bold !important;
    text-decoration: underline !important; 
    color: #303090; 
}

A:link:hover, A:visited:hover {
    color: #00008b !important;
    /* Yellowish background */
    color: #fff !important;
    background-color: #9090c0 !important;
    text-decoration: underline !important; 
}

/* Active (selected) link.  As "hover" above. */
A:link:active, A:visited:active { 
    color: red !important; 
    background-color: #ffff10 !important;
    text-decoration: underline !important; 
}

A:visited { 
    color: purple !important;
    font-weight: bold !important;
    text-decoration: underline !important; 
}

dt { 
    font-weight:  bold;
    margin-top:  4px;
    margin-left: 1.5em;
}

ol, ul, dl, li, dd, dt {
    /* Zero out padding & margins */
    padding: 0px; margin: 0px;
    /* padding:  2px 0px 2px 0px; */
}

li, dd, dt {
    padding-top:    0px;
    padding-bottom: 2px;
}

caption, .caption {
    font-weight:  bold;
    text-align:   center;
    font-family:  sans-serif;
}

th {
    margin:         3px;
    padding-left:   2px;
    margin-bottom:  4px;
    border-bottom:  1px solid #000;
}



blockquote.cite {
    border-left: 1px solid #0000FF;
    margin:  30px 40px 10px 10px;
    padding-left: 10px;
}



/* Content elements */

.topbar {
    margin:10px 20px 30px 10px;
    background:#e8e8FF; 
    width: 90%;
    text-align: center;
    border: 1px solid #000;
    border-top: 10px solid #303060;
    -moz-border-radius: 5px;
}

#juicebox {
    margin:  20px 8px 40px 0px;
    padding: 0px 6px 4px 6px; 
    background: #f4fff4;  /* Greenish */
    border:     1px solid #000;
    clear:      both;
    border-top: 2px solid #303060;
    -moz-border-radius: 12px;
}

#navbox {
    padding: 4px 12px 4px 6px; 
    float:left;
}

.nav {
    margin:20px 8px 40px 0px;
    padding: 0px 6px 4px 6px; 
    width: 220px;
    background: #e8e8FF; 
    border: 1px solid #000;
    border-top: 2px solid #303060;
    -moz-border-radius: 5px;
}

.hotbox H2, .nav H2, .quotebox H2, div#juicebox h2{
    border-top:     none;
    border-bottom:  none;
    border-left:    none;
    border-right:   none;
    text-align:     center;
    margin:         0px -6px 8px -6px;
    padding:        3px 0px 3px 0px;
    background:     #303060;
    color:          #FFF;
    font-family:    serif;
}

.hotbox H2 A, .nav H2 A, .quotebox H2 A { 
    color: #DDF;
    text-decoration: underline;
}

.hotbox {
    margin:20px 8px 40px 0px;
    padding: 0px 6px 4px 6px; 
    width: 220px;
    background: #FFFFe0;
    border: 1px solid #000;
    border-top: 2px solid #303060;
    -moz-border-radius: 5px;
    }

.quotebox {
    margin: 20px 8px 40px 0px;
    padding: 0px 6px 4px 6px; 
    width: 220px;
    background: #FFFFE0;
    border: 1px solid #000;
    border-top: 2px solid #303060;
    -moz-border-radius: 5px;
    }

/* Sidebar within content, right flush */
.sidebar {
    float:        right; 
    width:        258px;
    border:       1px solid #000;
    background:   #fff;
    font-size:    small; 
    font-family:  sans-serif;
    margin:       4px  -12px 4px 8px;
    /* padding:      0px 8px 10px 12px; */
    padding-top:    -30px;
    padding-right:   -6px;
    padding-bottom:   6px;
    padding-left:    12px;
    overflow:     hidden;
}

div#topcontent h2, div#content h2 {
    width: 80%;
}

.sidebar H2, .sidebar H3, .sidebar H4, .sidebar H5, .sidebar H6 {
  /*  Dark.  Let's go with light for now.
    border-top:     solid 1px #303060;
    border-bottom:  solid 1px #303060;
   */
    border-top:     solid 1px #c0c0d0;
    border-bottom:  solid 1px #c0c0d0;
    #c0c0d0;
    border-left:    none;
    border-right:   none;
    text-align:     left;
    margin:         20px 6px 8px -8px;
    padding:        2px 16px 2px 2px;
    font-family:    serif;
    text-decoration: none;
}

.nav H3, .nav H4, .nav H5, .nav H6 {
  /*  Dark.  Let's go with light for now.
    border-top:     solid 1px #303060;
    border-bottom:  solid 1px #303060;
   */
    border-top:     solid 1px #c0c0d0;
    border-bottom:  solid 1px #c0c0d0;
    #c0c0d0;
    border-left:    none;
    border-right:   none;
    text-align:     left;
    margin:         20px 6px 8px 4px;
    padding:        2px 16px 2px 2px;
    font-family:    serif;
    text-decoration: none;
}

dt, .sidebar dt { margin: 8px 4px 0px 8px; }
dd, .sidebar dd { margin: 0px 4px 2px 16px; }

ul .hotbox li, ul .nav li, ul .sidebar li {
    list-style:     none;
    margin-left:    2em;
    list-style-position: outside;
}


div#content li {
    list-style-position:  outside;
    margin-left:    2em;
}

  #searchbox {
    float:right;
    }

  #search {
    margin:8px 8px 8px 8px;
    padding: 4px 6px 4px 6px; 
    text-align: right;
    background: #cff;
    border: 1px solid #000;
    border-top: 2px solid #303060;
    -moz-border-radius: 5px;
    }

  #topcontent {
    margin: 10px 0px 45px 8px;
    /* background: #ffffff;  */
    background-color: #F8F8F0;
    padding: 8px 16px 8px 18px;
    border: 1px solid #000;
    border-top: 10px solid #303060;
    -moz-border-radius: 12px;
    }

  #content {
    margin: 25px 0px 52px 130px;
    /* background: #ffffff; */
    /* background-color: #8080a0; */
    background-color: #F8F8F0;
    padding: 8px 16px 8px 60px;
    border: 1px solid #000;
    border-top: 10px solid #303060;
    -moz-border-radius: 12px;
    }


/* Navigation links w/ on-hover action */

#navcontainer { /* No width spec */ }

#navcontainer ul
{
    margin-left:     -10;
    padding-left:    0;
    list-style-type: none;
    font-family:     sans-serif;
    font-size:       small;
    border-bottom:  1px solid #000; 
}

#navcontainer li {
    margin-left:   10px;
    padding-top:    2px;
    padding-bottom: 2px;
    border-top:     1px solid #000;
    /* border-bottom:  1px solid #000; */
    /* padding:        0px 2px 2px 2px; */
}

#navcontainer a
{
    display:          block;
    padding:          0px;
    color:            #303090; !important;
    background-color: #e8e8FF  !important; 
    border-left:      2px transparent none !important; 
}

#navcontainer a:link, #navlist a:visited
{
    color:            #303090 !important;
    text-decoration:  none    !important;
    border-left:      2px transparent none !important; 
}

#navcontainer a:hover
{
    color:            #fff !important;
    background-color: #9090c0 !important;
    background-color: #303060 !important;
    border-left:      2px solid #303060 !important; 
}

#navcontainer a:active {
    color:            #000 !important;
    background-color: #F8F8F0 !important; 
    border-left:      2px solid #F8F8F0 !important; 
}


#navlist li a#current
{
    background: white;
}

/* Drop-shadow for images 
 * http://www.alistapart.com/articles/cssdropshadows/
 */


.img-shadow {
    float:left;
    background: url(http://linuxmafia.com/~karsten/Images/shadowAlpha.png) no-repeat bottom right !important;
    background: url(http://linuxmafia.com/~karsten/Images/shadow.gif) no-repeat bottom right;
    margin: 10px 0 0 10px !important;
    margin: 10px 0 0 5px;
}

.img-shadow img {
    display: block;
    position: relative;
    background-color: #fff; 
    border: 1px solid #a9a9a9; 
    margin: -6px 6px 6px -6px;
    padding: 4px;
}


