/*
 * layout.css
 *
 * Style sheet for CosmicLedger.com
 *
 * Copyright (c) 2005–2009 Magnus Olsson
 *
 * Three-column semi-liquid layout prepared for fixed sidebars.
 * A semi-liquid layout is a cross between a fixed width layout
 * and a regular fully liquid layout. A fixed width layout is
 * suited for one text size only, while a regular liquid layout
 * is best viewed in a window of a particular size. The semi-
 * liquid hybrid adapts to various text sizes while also keeping
 * lines within reasonable lengths for better legibility.
 *
 * NOTE: This stylesheet uses the 'tan hack' in addition to
 * child selectors for dealing with Internet Explorer bugs.
 *
 * LICENCE: You are welcome to borrow from this style sheet and
 * even copy it so long as you give proper credit and include a
 * link to this website.
 */


body {
color: black;
background: white;
}

hr { display: none }


/* * * * * * * * *

 * COMMON/ROOTS. *

 * * * * * * * * */


#page, .root {
width: 100%;
min-width: 720px;
max-width: 57em;
margin: 0 auto;
}

#page {
color: black;
background: #339;
margin-bottom: 1200px;
position: relative;
}

#navbar, #auxbar, #promo, #search, #mark, #rebecca, #access {
position: absolute;
top: 0;
bottom: 0;
}


/* * * * * * * * * * *

 * Children of ROOT. *

 * * * * * * * * * * */


.stuff {
position: relative;
z-index: 1;
}

#body .stuff {
color: #000;
background: #ffc;
margin: 0 17%;
top: auto;
bottom: auto;
}

#head .stuff, #foot .stuff {
color: #ffc;
background: #339;
margin: 0 17%;
}

#head .stuff, #promo .stuff, #search .stuff {
top: 0;
bottom: auto;
}

#head .stuff { height: 7em }

#promo .stuff, #search .stuff {
height: 5.8em;
position: absolute;
}

#foot .stuff, #mark .stuff, #rebecca .stuff {
top: auto;
bottom: 0;
}

#foot .stuff { height: 6em }

#mark .stuff, #rebecca .stuff {
height: 4.8em;
position: absolute;
}

#navbar .stuff, #auxbar .stuff {
position: absolute;
top: 7em;
bottom: 6em;
}

#access .stuff {
margin: 0 14%;
width: 72%;
height: auto;
position: absolute;
top: auto;
bottom: 0;
}


/* * * * * * * * * * * * * * *

 * Children of HEAD & FOOT.  *

 * * * * * * * * * * * * * * */


#head .info { height: 5.8em }

#head .info a {
color: #ffc;
background: transparent;
text-decoration: none;
}

#foot .info { height: 4.8em }

#foot .info a {
color: #f90;
background: transparent;
}

#head #site {
color: #ffc;
background: transparent;
}

#head #site a {
color: #ffc;
background: transparent;
}

#head #slogan {
color: #f90;
background: transparent;
}

.sitebar {
color: #ffc;
background: #f90;
font-family: Rockwell, "Palatino Linotype", Times, serif;
font-weight: bold;
letter-spacing: 1px;
line-height: 1.2em;
height: 1.2em;
position: relative;
}

.sitebar div { font-size: smaller }

.sitebar div * { padding: 0px 5px }

.sitebar a {
color: #609;
background: transparent;
text-decoration: none;
}

.sitebar a:hover {
color: #ffc;
background: transparent;
}

.sitebar i { display: none }

.sitebar b {
font-family: arial, sans-serif;
padding: 0;
border-left: solid 1px #c90;
border-right: solid 1px #cc0;
margin: 0 1px;
}


/* * * * * * * * * * *

 * Children of BODY. *

 * * * * * * * * * * */


#content {
color: black;
background: transparent;
border: dotted 1px #633;
padding: 0.5em 1.25em 1em;
position: relative;
}

* html #content { border: solid 1px #cc9 }  /* IE */

/*
Page navigation
*/

.pagebar {
color: black;
background: transparent;
line-height: 1.25em;
height: 1.25em;
margin: 0 1.25em;
overflow: hidden;
position: relative;
}

.pagebar div { font-size: smaller }

.pagebar b { display: none }

.pagebar a { text-decoration: none }

.pagebar a:hover {
color: #f90;
background: #ffc;
}

.pagebar a:focus, .pagebar a:active {
color: #ffc;
background: teal;
}

.pagebar .previous {
padding: 0 1px;
position: absolute;
left: 0;
right: auto;
}

.pagebar .next {
padding: 0 1px;
position: absolute;
left: auto;
right: 0;
}

.pagebar > .topofpage {
font-weight: bold;
position: absolute;
left: 25%;
right: 25%;
}


/* * * * * * * * * * * * *

 * Children of CONTENT.  *

 * * * * * * * * * * * * */


/*
List of Contents
*/

#loc { padding: 0.3em }

#loc ul * { font-weight: bold }

#loc ul ul * { font-weight: normal }

#loc a {
color: #609;
background: transparent;
text-decoration: none;
padding: 1px 2px;
}

#loc a:hover {
color: #ffc;
background: #609;
}

#loc a:focus, #loc a:active {
color: #ffc;
background: #f00;
}

/* child selectors hidden from ie */

#loc > * { text-align: center }

#loc > ul {
padding: 0;
margin: 0.5em;
}

#loc > ul li, #loc > ul ul {
display: inline;
padding: 0;
margin: 0;
}

#loc > ul li:before {
content: "\2022\a0";
font-family: arial, helvetica, sans-serif;
font-weight: bold;
}

#loc > ul > li:first-child:before { content: '' }

#loc > ul ul li:before { content: "\b7\a0" }


/* * * * * * * * * * * *

 * Children of FRILLS. *

 * * * * * * * * * * * */


#promo .stuff, #search .stuff, #navbar .stuff, #auxbar .stuff, #mark .stuff, #rebecca .stuff {
width: 17%;
position: absolute;
}

#promo .stuff, #search .stuff { border-bottom: solid 1.2em #f90 }

#mark .stuff, #rebecca .stuff { border-top: solid 1.2em #f90 }

#promo .stuff, #navbar .stuff, #mark .stuff {
left: 0;
right: auto;
}

#search .stuff, #auxbar .stuff, #rebecca .stuff {
right: 0;
left: auto;
}

#navbar .stuff, #auxbar .stuff {
color: black;
background: transparent;
overflow: auto;
}


/* * * * * * * * * * * * * * * * *

 * Children of NAVBAR & AUXBAR.  *

 * * * * * * * * * * * * * * * * */


.flexbar h2 { display: none; }

.flexbar .navigation { font-size: smaller }

.flexbar dl {
color: #ccc;
background: transparent;
letter-spacing: 1px;
margin: 0;
}

/*.flexbar dl.context { background: #b22222 }*/

.flexbar dl.series { background: #f60 }

.flexbar dl ul {
list-style-type: none;
border-color: #0A2A54 #3B7CB3 #3B7CB3 #0A2A54;
}

.flexbar dl.series ul {
border-color: #cc4411 #ffa933 #ff9911 #cc5522;
}

/* Terms */

.flexbar dt { overflow: hidden }

.flexbar dt * {
display: block;
text-transform: uppercase;
padding: 2px 7px;
margin: 0;
}

* html .flexbar dt * { height: 1% }  /* IE */

.flexbar dt a {
color: #fc9;
background: #630;
text-decoration: none;
}

.flexbar dt a:visited {	
color: #ffc;
background: #930;
}

.flexbar dt a:hover {
color: #fc3;
background: #551100;
}

.flexbar dt span {
color: #ffd700;
background: #006;
}

/* Definitions */

.flexbar dd {
padding: 0;
margin: 0;
overflow: hidden;
}

.flexbar dd ul,
.flexbar dd ul li
{
padding: 0;
margin: 0;
}

.flexbar dd ul * {
display: block;
letter-spacing: 1px;
padding: 5px 7px;
margin: 0;
}

* html .flexbar li * { height: 1% }  /* IE */

.flexbar dd li * {
border: solid 1px;
border-color: #3B7CB3 #0A2A54 #0A2A54 #3B7CB3;
}

.flexbar dl dd a {
color: #fcc;
background: transparent;
text-decoration: none;
}

.flexbar dl dd a:visited {
color: #fc9;
background: transparent;
}

.flexbar dl.series dd a:visited {
color: #fc9;
background: transparent;
}

.flexbar dl dd a:hover {
color: #ffc;
background: transparent;
border-color: #0A2A54 #3B7CB3 #3B7CB3 #0A2A54;
}

/*
.flexbar dl.context dd a {
color: #dd9;
background: transparent;
border-color: #d44 #944 #900 #d66;
}

.flexbar dl.context dd a:hover {
color: #ffc;
background: transparent;
border-color: #900 #d44 #d44 #933;
}
*/

.flexbar dl.series dd a {
color: #ffc;
background: transparent;
border-color: #ff9933 #cc4411 #cc4400 #ff9933;
}

.flexbar dl.series dd a:hover {
color: #ffc;
background: transparent;
border-color: #cc4411 #ff9933 #ff9933 #cc4411;
}

.flexbar dl.series dd span {
color: #633;
background: #ffc;
border-color: #ffc;
}

.flexbar dl dd a:active,
.flexbar dl dd a:focus
{
color: #ffc;
background: #ff0000;
border-color: #4f0000 #ff6666 #ff6666 #4f0000;
}

.flexbar dl.series dd a:active,
.flexbar dl.series dd a:focus
{
color: #ffc;
background: #990000;
border-color: #4f0000 #cf0000 #cf0000 #4f0000;
}

/*
Long definition lists
*/

.flexbar dl.long dd {
line-height: 1.7em;
text-align: center;
padding: 0;
margin: 0;
overflow: hidden;
}

* html .flexbar dl.long dd { line-height: 1.3em }  /* IE */

.flexbar dl.long ul {
padding: 5px 7px;
border-style: solid;
border-width: 1px;
}

.flexbar dl.long ul * {
display: inline;
padding: 0px;
margin: 0;
}

.flexbar dl.long li * {
display: inline-block;
width: 1em;
letter-spacing: 0;
text-align: center;
padding: 0px 4px;
margin: 0;
}

.flexbar dl.long li span {
background: #ffc;
border-style: solid;
border-width: 1px;
border-color: #4f0000 #ff0000 #ff0000 #4f0000;
}


/* * * * * * * * * * * * * * * *

 * Children of PROMO & SEARCH. *

 * * * * * * * * * * * * * * * */


#promo p, #search p { text-align: center }

/*
Promo
*/

#promo p {
margin-top: 1em;
}

#promo a {
display: block;
margin-top: 1em;
}

#promo a:hover {
color: black;
background: transparent;
}

#promo small {
display: block;
visibility: hidden;
color: #339;
background: transparent;
font-size: 75%;
margin: -3.5em 0.5em 0;
}

#promo p:hover small {
color: #ccc;
background: transparent;
visibility: visible;
}

/*
Search
*/

#search p {
margin-top: 0.5em;
}

#search fieldset {
text-align: center;
padding: 0;
border: none;
margin: 0.5em 0.1em;
}

#search legend { display: none; }

#search label {
display: block;
color: #fcc;
background: transparent;
font-size: 80%;
font-variant: small-caps;
letter-spacing: 1px;
padding: 3px;
}

#search label:hover { color: #ffc }

/* Query entryfield */

#search input.entryfield {
color: #999;
background: #ccf;
font-size: 85%;
width: 85%;
padding: 2px 1px;
border:	1px solid #9097A2;
}

#search input.entryfield:hover {
color: #333;
background: #ffc;
}

#search input.entryfield:focus {
color: #000;
background: #fff;
}

/* Submit button */

#search input.pushbutton {
display: block;
color: #fcc;
background: transparent;
font-size: 80%;
width: 4.5em;
padding: 0;
border: solid 1px;
border-color: #3B7CB3 #0A2A54 #0A2A54 #3B7CB3;
margin: 4px auto;
}

#search input.pushbutton:hover { color: #ffc }

#search input.pushbutton:active {
color: #ffc;
border-color: #0A2A54 #3B7CB3 #3B7CB3 #0A2A54;
}


/*
 * Printed version only
 */


@media print {
#head { display: none }
#foot .stuff {
width: 100%;
padding: 0;
border: none;
margin: 0;
position: fixed;
z-index: 1;
}
#head .info {
padding-bottom: 0.3em;
border-bottom: solid 1px blue;
}
#foot .info {
padding-top: 0.5em;
border-top: solid 1px blue;
}
#standard { display: none }
#body .stuff {
padding-bottom: 7em;
margin: 0;
}
#content { border: none }
}