@import "../a.css";
@import "table.css";
@import "text-layout.css";


html
{
    background-color: #EEE;
    color: #000;
    font-family: sans-serif;
}


a
{
    color: #0000E0;
}



/** - deprecated -----------------------
  */
.deprecated
{
    color: #B00000;
}



/** - disabled-link --------------------
  */
span.disabled-link
{
    color: #808080;
}



/** - field-form -----------------------
  */
table.field-form
{
}


table.field-form td
{
    padding-bottom: 0.1em;
    vertical-align: baseline;
}


table.field-form td.description
{
    color: #808080;
    font-size: 0.8em;
    padding-bottom: 0.8em;
}


table.field-form td.description a
{
    color: #7070C0;
}


table.field-form td.label
{
    white-space: nowrap;
}


/** Inset from right, generally so that descriptions on other rows overhang a little
  * to the right.
  */
table.field-form td.right-padded
{
    padding-right: 2cm;
}



/** - h --------------------------------
  */
h1, h2, h3, h4
{
    letter-spacing: 0.02em;
    margin-bottom: 0.3em;
}


div.sub-h1
{
    color: #808080;
    font-size: 0.8em;
    font-weight: bold;
 /* margin-left: 0.3em; */
 /* margin-top: 0.1em; */
    margin-bottom: 1em;
}



/** - logo-footer ----------------------
  */
.logo-footer
{
    clear: both;
    text-align:right;
}


    .logo-footer.center
    {
        text-align:center;
    }


    .logo-footer.left
    {
        text-align:left;
    }


.logo-footer a
{
    color: #808080;
}


.logo-footer a img.icon /* see also a.css */
{
    padding: 4px;
}


.logo-footer img
{
    vertical-align: middle;
}


.logo-footer .logo
{
    margin-left: 0.7em;
}


    .logo-footer.center .logo, .logo-footer.left .logo
    {
        margin-right: 0.7em;
    }


    .logo-footer.left .logo
    {
        margin-left: 0;
    }



/** - navHead --------------------------
  *
  * FIX by removing to separate .css file and pulling it into the component's template
  * with a <w:head> tag.  See a/count/WC_PageNavMap.html for example.
  */
div#navHead
{
    font-size: 0.8em;
    text-align: right;
}


div#navHead a
{
    text-decoration: none;
}


div#navHead span.section.right
{
    margin-left: 1em;
}


div#navHead span.section.right span.navControl
{
    margin-left: 0.4em;
}


.navControl, .navControl a
{
    color: #808080;
}


    .navControl a:hover
    {
        color: #000;
    }


    .navControl span.disabled-link
    {
        color: #000;
        cursor: default; /* instead of text */
    }



/** - navPath --------------------------
  *
  * FIX by removing to separate .css file and pulling it into the component's template
  * with a <w:head> tag.  See a/count/WC_PageNavMap.html for example.
  */
form.navPath
{
    margin-top: 10px; margin-bottom: 10px;
    white-space: nowrap;
}


form.navPath, form.navVoter
{
    margin-left: 1.5em;
}


form.navPath a
{
    margin-left: 0.7em;
    text-decoration: none;
}



/** - navPile --------------------------
  *
  * FIX by removing to separate .css file and pulling it into the component's template
  * with a <w:head> tag.  See a/count/WC_PageNavMap.html for example.
  */
div.navPile
{
    padding-top: 0.5em;

    /**  Left aligned, and indented.
      */
 /* margin-left: 1em; */

    /** Centered, and somewhat left shifted.  But then it moves with visibility of
      * vertical scroll bar.
      */
 /* margin-right: 10%;
    text-align: center; */
}


div.navPile a
{
    text-decoration: none;
}


/** Padding the bottom of each li.span causes the bars to overlap each other (Firefox
  * and IE).  Overlap increases with depth of padding.  It looks good, so long as the
  * tabs are opaque.
  */
div.navPile ul
{
    font-weight: bold;
 /* list-style-type: none; */  /* redundant with display:inline */
    margin: 0; margin-bottom: 5px; /* reduce the overlap, slightly */
    padding: 0;
    white-space: nowrap;
}


div.navPile ul li
{
    display: inline;
    margin: 0;
    padding: 0;
}


    div.navPile ul li.enabled.off
    {
        cursor: pointer;
    }


div.navPile ul li span.left, div.navPile ul li span.right
{
    background-repeat: no-repeat;
    padding-top: 4px;
}


    div.navPile ul li.on span.left,
    div.navPile ul li.on span.right
    {
        background-image: url('../navTab-on.png');
        padding-bottom: 8px; /* li.off.span border+padding */
    }


        div.navPile ul.pile-trailer li.on span.left,
        div.navPile ul.pile-trailer li.on span.right
        {
            padding-bottom: 4px; /* slightly less on bottom bar */
        }


    div.navPile ul li.off span.left,
    div.navPile ul li.off span.right
    {
        background-image: url('../navTab-off.png');
    }


        div.navPile ul li.enabled.off:hover span.left,
        div.navPile ul li.enabled.off:hover span.right
        {
            background-image: url('../navTab-off-hover.png');
        }


    div.navPile ul li.off span.left,
    div.navPile ul li.off span.right,
    div.navPile ul li span.inter
    {
        padding-bottom: 6px; /* cf. li.on.span padding */
        border-bottom: solid 2px #AAA; /* cf. li.on.span padding */
    }


        div.navPile ul.pile-trailer li.off span.left,
        div.navPile ul.pile-trailer li.off span.right,
        div.navPile ul.pile-trailer li span.inter
        {
            padding-bottom: 2px; /* slightly less on bottom bar */
        }


    div.navPile ul li span.inter.bar-leader, div.navPile ul li span.inter.bar-trailer
    {
        padding-left: 0.5em; /* extra bottom border, leading and trailing the bar */
    }


        div.navPile ul.indented li span.inter.bar-leader
        {
            padding-left: 2.5em; /* extra indentation for alternate bars */
        }


div.navPile ul li span.left
{
    padding-left: 0.20em; /* at least enough to include rounded left corner of tab image */
}


div.navPile ul li span.right
{
    background-position: 100% 0; /* right side of image, aligned right */
    padding-right: 0.30em;
}


    div.navPile ul li.off span.right a, div.navPile ul li.on span.right span.disabled-link
    {
        color: #000;
    }



/** - navVoter -------------------------
  *
  * FIX by removing to separate .css file and pulling it into the component's template
  * with a <w:head> tag.  See a/count/WC_PageNavMap.html for example.
  */
form.navVoter /* see also rule: form.navPath, form.navVoter */
{
    /** Leaving margin-bottom unset allows overlap with lower tabs; except on IE7, which
      * assigns a large default margin.  But any overlap would be reversed on IE7, with
      * the tabs on bottom, and there'd be no way to correct it, because IE7 ignores the
      * z-index property.  So either leave it unset, or set it large enough to prevent
      * overlap.
      */
    margin-top: 14px; margin-bottom: 8px;
    white-space: nowrap;
}


    form.navVoter input.email
    {
     /* padding-bottom: 5px; */ /* clear of overlapping tabs, below */
    }


    form.navVoter td
    {
        margin-left: 1em;
        vertical-align: top;
    }


    form.navVoter td.submitQualifier
    {
        padding-top: 0.3em;
        padding-left: 0.5em;
    }



/** - pageNav --------------------------
  *
  * FIX by removing to separate .css file and pulling it into the component's template
  * with a <w:head> tag.  See a/count/WC_PageNavMap.html for example.
  */
div.pageNav
{
    color: #808080;
    font-size: 0.8em;
    padding-top: 0.5em; padding-bottom: 0.6em; /* extra room for padding of a, span.disabled-link */
    text-align: right;
}


    div.pageNav a, div.pageNav span.disabled-link
    {
        padding: 0.2em; /* cf. div.pageNav */
    }


        div.pageNav a:hover
        {
            background-color: #F4F4F4;
            outline: medium solid #F4F4F4;
            color: #000;
        }


        div.pageNav span.disabled-link
        {
            background-color: #EAEAEA;
        }


        div.pageNav span.prefix
        {
            margin-right: 0.7em;
        }


        div.pageNav span.suffix
        {
            margin-left: 0.7em;
        }



/** - subdued --------------------------
  */
.subdued
{
    color: #808080;
}


    a.subdued, .subdued a
    {
        color: #7070C0;
    }

