

/***** Tags *****/

html { font-size: 1.00em; /*overflow: hidden;*/ }

body
{
/*
    overflow: hidden;
*/
    background-color: #ffffff;
    color: #333366;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0 0 5em 0;
}

div.bg
{
    position: fixed; left: 0; right: 0; top: 0; bottom: 0;
}


            div#bg1
            {
            background-image: url( '../bg/?id=6&size=' );
            background-repeat: no-repeat;
            background-position: 50% 50%;
            background-attachment: fixed;
            }


/*
.header, .footer { background-image: url( '../png/?c=ffffff' ); }
*/



h1 { font-size: 1.15em; margin: 0; text-align: center; }
h2 { font-size: 0.7em; padding: 0 0.5em; margin: 0.5em; text-align: center }
p { font-size: 0.7em; margin: 0em; }

div.blurb { text-align: center; padding: 0.5em 0; margin: 0.2em auto; border: outset 2px #ccccff; width: 30em; background-image: url( '../png/?c=ffffff' ); }
div.blurb > p { margin: 0.5em 0.5em; }

/***** Forms and controls *****/

div.form
{
    position: fixed; top: 8em; left: 0; right: 0;
    padding: 0em;
    /* background-image: url( '../png/?c=ffffff' ); */
    width: 38em;
    margin: 0 auto;
    padding: 0.2em 0.6em;
    border: outset 2px #ccccff;
    background-color: #ffffff;
}

body.ie7 div.form { margin: 0 20%; width: auto; }

form
{
    padding: 0;
    margin: 0.5em auto;
    background-color: #ffffff;
    border: outset 2px #ccccff;
}

form h2
{
    padding: 0;
    margin: 0;
    color: #333366;
    background-image: url( '../png/?c=ccccff' );
}

form div
{
    padding: 0.2em;
    /* background-image: url( '../png/?c=ffffff' ); */
    background-color: #ffffff;
    color: #333366;
}

form table
{
    border-collapse: collapse;
    margin: 0 auto;
}

form table td { text-align: left; padding: 0.1em 0.5em; }

form > p { /*color: #333366;*/ text-align: center; }

input[type='text'], input[type='password'], select
{
    background-color: #ffffff;
    color: #333366;

    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    width: 20em;

    border-style: outset;
    border-width: 2px;
    border-color: #ccccff;
}

input[type='submit'], button
{
    background-color: #ccccff;
    color: #333366;

    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    padding: 0.3em 2em;

    border-style: outset;
    border-width: 2px;
    border-color: #ccccff;
}

input[name='url'] { width: 30em; }
input[name='name'] { width: 20em; }
select[name='boxwidth'] { width: 6em; }
select[name='fontsize'] { width: 6em; }
select[name='borderwidth'] { width: 6em; }
select[name='borderstyle'] { width: 6em; }

/*****/

a img { border: none; }

a { text-decoration: none; }

p a { color: #333366; }
p a:visited { color: #333366; }
p a:active { color: #333366; }

p a.old { color: #999999; }
p a.old:visited { color: #999999; }
p a.old:active { color: #999999; }

p a:hover { color: #000000;  }

h1 a { color: #333366; }
h1 a:visited { color: #333366; }
h1 a:active { color #333366; }
h1 a:hover { color: #000000;  }

h2 a { color: #333366; }
h2 a:visited { color: #333366; }
h2 a:active { color: #333366; }
h2 a:hover { color: #ffffff;  }

/***** Tables and divs *****/

div.page
{
    position: absolute; top: 0; left: 0; right: 0;
    padding-bottom: 3em;
    margin: 0 0 8em 0;
    /*overflow: auto;*/
}

div.header
{
    position: relative;
    text-align: center;
}

div.footer
{
    position: fixed;
    bottom: 0em;
    width: 100%;
}

div.footer > div
{
    visibility: hidden;
    text-align: center;
    background-image: url( '../png/?c=ffffff' );
    padding-top: 0.5em;
}

div.footer > div p { padding: 0em 0; }

div.footer:hover > div { visibility: visible; }

div.footer > div > table { border-collapse: collapse; margin: 0 auto; }
div.footer > div > table td { padding: 0 1em; }
address
{
    font-size: 0.7em;
    color: #999999;
    font-style: normal;
    padding: 0.5em;
    text-align: center;
    background-image: url( '../png/?c=ffffff' );
}

address a { color: #999999; }
address a:hover { color: #000000; }

div.column
{
    vertical-align: top;
    display: inline-block;
    text-align: left;
}

div.category
{
    width: 10.0em;
    margin: 0.1em;
    border: outset #ccccff 2px;
}

div.category div.links
{
    background-image: url( '../png/?c=ffffff' ); padding: 0.2em 0.4em;
}

div.category p, div.rss p { color: #333366; margin: 0.05em 0; }

div.category p a { color: #333366; }
div.category p a:visited { color: #333366; }
div.category p a:active { color: #333366; }
div.category p a.old { color: #999999; }
div.category p a:hover { color: #000000; }

div.category h2, div.rss h2
{
    margin: 0;
    background-image: url( '../png/?c=ccccff' ); color: #333366;
    padding: 0 0 1px 0;
    border-bottom: outset 2px #ccccff;
}

div.rss
{
    text-align: left; 
    border: outset #ccccff 2px;
    background-image: url( '../png/?c=ffffff' ); color: #333366;
    width: 18em;
    display: inline-block;
    vertical-align: top;
    margin: 0.3em;
    max-height: 10em;
    overflow: auto;
}

div.rss > div
{
    margin: 0.2em 0.5em;
}

.center { text-align: center; }
.right { text-align: right; }

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

.cdrop, .ccoldrop { /*border: dashed 1px red;*/ /*overflow: hidden;*/ }

.cdrop { height: 0.3em; vertical-align: top; }
.cdrop.over { background-color: #333366; border: none; }

.ccoldrop { width: 0.1em; display: inline-block; padding: 0.1em; margin: 0; height: 300px; vertical-align: top; }
.ccoldrop.over { background-color: #333366; }

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

div.links p.dropdownmenu { visibility: hidden; text-align: right; margin: 0; /*border-top: solid 2px #ddddff;*/ }
div.links p.dropdownmenu a { color: #999999; }
div.links p.dropdownmenu a:hover { color: #000000; }
div.links:hover p.dropdownmenu { visibility: visible; }

.dropdownmenu { border-top: solid 1px transparent; }
.dropdownmenu.over { border-top: solid 1px #333366;  }

.link { position: relative; padding-right: 2em; white-space: normal; }
.link .linkedit
{
    color: #999999;
    visibility: hidden;
    position: absolute; right: 0; top: 0;
    text-align: right; vertical-align: top;
}
.link .linkedit a { color: #999999; }
.link .linkedit a:hover { color: #000000; }
.link:hover .linkedit { visibility: visible; }

.link { border-top: solid 1px transparent; }
.link.over { border-top: solid 1px #333366;  }

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

div.help
{
    background-image: url( '../png/?c=ffffff' );
    color: #333366;
    font-size: 1.4em;
    text-align: center;
    margin: 1em 15%; padding: 0.5em;
    border: outset #ffffff 2px;
}

div.help h1 { margin: 0; }

div.help p { margin: 1em 0; }

/***** iPhone *****/
@media only screen and (max-device-width: 480px)
{
    div.header, div.footer, div.category
    {
        font-size: 200%;
    }

    div.category
    {
        font-size: 300%;
    }
}

/********** IE7 Tables **********/

body.ie7 table.layout { border-collapse: collapse; margin: 0 auto; }
body.ie7 table.layout td { padding: 0; }
body.ie7 table.layout .ccoldrop { width: 0.3em; }

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

