/* 
#256273    Background dark blue
#3B9AB5    Header aqua 
#457585    Visted link
#CBD5DF    Blue grey (sidebar highlight)
*/
/* ****************** BODY ****************** */
body {
    background-color:#256273;
    color:#000;
    text-align:center;
    font-size:18px;
    font-family:"Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}

a:link    {color:#3B9AB5;text-decoration:none;}
a:visited    {color:#457585;text-decoration:none;}
a:hover    {text-decoration:underline;}
a:focus    {text-decoration:underline;}
a:active    {color:#FF0000;text-decoration:underline;}

/* ****************** PAGE LAYOUT ****************** */

.page {
    text-align:left;
    width:65em;
    margin:0 auto;
    padding:0.5em;
    background-color:#FFF;
    background-image:url(images/pagetop.gif);
    background-repeat:repeat-x;
    position:relative;
}
#main_content {
    display:flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: stretch;
}

#sideBar {
    min-width:12em;
    border-right:1px solid #000;
    padding:0 0 0em 1em;
    font-size:0.9em;
}
#content_column {
    position: relative;
    padding:0 0 40px 14px;
    background-image:url(images/bigblue.gif);
    background-repeat:repeat-y;
    background-position:50% 1em;
    flex-grow:2;
}

#pageHeader {
	display:block;
}
#content {
display:block;
    padding:0 2em 1.5em 2em;
}
#pageFooter {
    position: absolute;
    bottom:0;
    left:14px;
    padding:0.6em 0 0 14px;
    border-top:1px solid #000;
    text-align:center;
    text-indent:0;
    line-height:1.2em;
    width:95%;
}


/* ****************** SIDEBAR MENU ****************** */

#sideBar ul {
    margin: 1.5em 0 0 0;
    padding:0;
}
#sideBar li ul {
    margin:0;
}
#sideBar li {
    margin:0.2em 0 1.5em 0;
    list-style:none;
    font-weight:bold;
}
#sideBar li  {
    color:#3B9AB5;
}
#sideBar li li {
    font-weight:normal;
    margin:0.5em 0 0.5em 1em;
    margin-left:1em;
    background-image:url(images/bullet2.gif);
    background-repeat:no-repeat;
    background-position:0 50%;
    padding-left:20px;
}
#sideBar li a {
    color:#000;
    text-decoration:none;
    padding:0 1px;
}
#sideBar li a:hover {
    color:#000;
    background-color:#CBD5DF;
}


/* ****************** HEADER ****************** */

h1 {    font-size:0.7em;
    margin:0;
    color:#3B9AB5;
    text-align:right;
    padding-bottom:0.3em;
    border-bottom:1px solid #000;
    margin-bottom:1em;
}
h2    {
    font-size:1.8em;
    margin:0.5em 0 1em 0;
    color:#3B9AB5;
    text-align:center;
}


/* ****************** CONTENT ****************** */

#content {
    font-size:0.9em;
    line-height:1.3em;
}
h3    {
    font-size:1.3em;
    margin:2em 0 0.2em 0;
    color:#3B9AB5;
    text-indent:-0.5em;
    padding:6px 0 7px 45px;
    background-image:url(images/h2.gif);
    background-repeat:no-repeat;
}
h4    {
    font-size:1em;
    margin:2em 0 0 0;
    font-weight:bold;
    color:#1D4D5A;
}

#content p {
    margin:1em 0 1em 0;
    text-indent:3em;
}
#content p.nin {
    text-indent:0em;
}
#content p.example {
    margin:1.5em 0 1.5em 5em;
    text-indent:0;
}
#content dfn, #content abbr {
    font-style:normal;
    font-size:100%;
    cursor:help;
    border-width:0;
}
#content dfn:hover, #content abbr:hover {
    background-color:#CBD5DF;
}
#content a {text-decoration:underline;}

#content ul, #content ol {
    padding:0;
    margin:1em 1em 1em 3.5em;
}
#content ul li, #content ol li {
    padding:0;
    margin:1em 0 1em 0;
}
#content a.topLink {
    display:block;
    margin:2em auto 0 auto;
    width:8em;
    text-align:center;
    text-decoration:none;
}
#content a.topLink:hover {text-decoration:underline;}


#content #bottomLink {
    margin:2em auto 0 auto;
    width:16em;
    text-align:center;
    line-height:2em;
}
#content #bottomLink a {
    display:block;
    margin:0 auto 4px auto;
    width:8em;
    text-align:center;
    text-decoration:none;
}
#content #bottomLink a:hover {text-decoration:underline;}
#content #bottomLink .nextLastLink {display:inline !important;padding:0 1.5em}


#content dl.standard {
    margin:0 0 2em 2.5em;
}
#content dl.standard dt {
    margin:1.5em 0 0 0;
    font-weight:bold;
    color:#2A6F87;
}
#content dl.standard dd p {
    text-indent:0;
    margin:1em 0 0 0;
}
#content dl.standard dd p.example {
    text-indent:0;
    margin:1em 0 0 2em;
}
#content ul.linkList {margin:1em 0 1em 5em;}
#content ul.linkList li {margin:0;}
#content ul.linkList li a {text-decoration:none;}
#content ul.linkList li a:hover {text-decoration:underline;}

#content ul.linkLine     {margin:0;list-style:none;padding:0;text-align:center;}
#content ul.linkLine li {
    margin:0;
    list-style:none;
    padding:0;
    display:inline;
    padding:0 5px;
}
#content ul.linkLine li a {text-decoration:none;}
#content ul.linkLine li a:hover {text-decoration:underline;}

/* ****************** FOOTER ****************** */

#pageFooter p {
    margin:0;
    font-size:0.7em;
}

/* ***************** DICTIONARY ************** */
.dictionary {
    margin:2em 2em 1em 2em;
    line-height:1.2em;
}
.dictionary dt {
    margin-bottom:0.5em;
    font-weight:600;
    clear:right;
}
.dictionary dd {
    margin-bottom:1.5em;
}
.dictionary img {
    border:1px solid black;
    margin:0 0 0.5em 0.5em;    
}
.dictionary img.pullUp {
    margin-top:-1em;
}

/* ***************** PHRASEBOOK ************** */

.phraseBook {
    margin:2em 2em 1em 2em;
    line-height:1.2em;
}
.phraseBook dt {
    margin-bottom:0;
    font-weight:600;
    clear:right;
    float:left;
    width:21em;
}
.phraseBook dt.sub {
    width:19em;
    padding-left:2em;
}
.phraseBook dd {
    margin-bottom:2em;
    margin-left:22em;
    width:22em;
}
.phraseBook dd.sub {
    width:20em;
    padding-left:2em;
}

/* ****************** ZURVAR ****************** */

code {
    font-size:1em;
    font-family:"Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
    font-style:italic;
    color:rgb(48,112,139);
}
code.IPA {
    font-style:normal;
    color:#A00;
}
code b,code strong {
    font-style:normal;
}

/* ****************** FOOT NOTES ****************** */


small {
    cursor:default;
    font-size:1em;
    color:#3B9AB5;
}
small span {
    display:    block;
    position:    absolute;
    top:        inherit;
    left:        -999em;
    font-size:    0.9em;
    width:    15.5em;
    margin-top:-1.5em;
    margin-left:-17.7em;
    padding:    0.2em 0.5em;
    border:    1px solid #000;
    text-align:left;
    text-indent:0;
    font-weight:normal;
    line-height:120%;
}
* html small span 
{
    width:17.7em;
}
small:hover, small.sfHover 
{
    background-color:#3B9AB5;
    color:#FFF;
}
small:hover span, small.sfhover span 
{
    background-color:rgb(196,221,229);
    color:#000;
    left:auto;
}

.phraseBook dt small span         {margin-left:-20em;}
.phraseBook dt.sub small span {margin-left:-22em;}
.phraseBook dd small span         {margin-left:-44.5em;}
.phraseBook dd.sub small span {margin-left:-46.5em;}
#content ul li small span         {margin-left:-21.5em;}

.example small span     {margin-left:-23em;}



/* ****************** PAGE SPECIFIC CSS ****************** */

/* Homepage */

#page_introduction #homeBox {
    float:right;
    display:inline;
    margin:0 0 0.5em 0.5em;
    border:2px solid #3B9AB5;
    text-align:center;
    padding:10px;
    font-size:95%;
    width:130px;
    background-color:#FFF;
}
#page_introduction #homeBox img {margin:0 0 0.5em 0;}

#page_introduction #mapBox {
    position:relative;
    margin:2em auto 0 auto;
    width:618px;
    border:1px solid #000;
    text-align:center;
    background-color:rgb(59,154,181);
    font-weight:bold;
    color:#FFF;
    padding-top:4px;
    font-size:16px;
}
#page_introduction .mapName {
    display:block;
    position:absolute;
    color:#000;
    font-size:11px;
    line-height:11px;
    font-weight:normal;
    z-index:3;
    text-decoration:none !important;
    padding:2px 3px;
    border:1px solid transparent;
}
#page_introduction .mapName:hover {
    color:#FFF;
    background-color:rgb(59,154,181);
    border-color:#000;
    text-decoration:none;
}
#page_introduction .flagBox {
    position:absolute;
    top:35px;
    right:5px;
    width:140px;
    height:120px;
    border:1px solid #000;
    background-color:#FFF;
    color:#000;
    padding:4px;
    text-align:center;
    font-weight:normal;
    font-size:11px;
    line-height:1.2em;
    z-index:4;
    visibility:hidden;
}
#page_introduction .flagBox img {
    border:1px solid black;
    margin-bottom:4px;
}
#page_introduction #boatWrapper {
    margin-top:4px;
    border-top:1px solid #000;
    width:618px;
    height:308px;
    position:relative;
}

/* Glossary */

#page_glossary .map {
            float:right;
            display:inline;
            border:1px solid #000;
            text-align:center;
            padding:4px 0 0 0;
            background-color:rgb(59,154,181);
            color:#FFF;
            font-weight:bold;
        }
#page_glossary .map img {
            display:block;
            margin:4px 0 0 0;
            border-width:1px 0 0 0;
        }


/* Names */

#page_names table {
            margin:1em;
            border:1px solid #000;
            border-collapse:collapse;
        }
#page_names th {
            border:1px solid #000;
            color:#FFF;
            background-color:rgb(67,128,145);
            padding:0.3em 0.4em;
            font-size:0.9em;
}
#page_names td {
            border:1px solid #000;
            text-align:center;
            padding:0.3em 0.4em;
            font-size:0.9em;
        }

/* Planets */

#page_planets .planetImage {
    border-width:0px;
    float:left;
    margin:0 8px 8px 0;
}

/* Grammar 01 and 02 */

#page_grammar_part_1 table, #page_grammar_part_2 table {
    margin:1.5em auto 1em auto;
    border:1px solid #000;
    border-collapse:collapse;
}
#page_grammar_part_1 th, #page_grammar_part_2 th {
    border:1px solid #000;
    color:#FFF;
    background-color:rgb(67,128,145);
    padding:4px 6px;
}
#page_grammar_part_1 th code, #page_grammar_part_2 th code { color:#FFF;}
#page_grammar_part_1 td, #page_grammar_part_2 td {
    border:1px solid #000;
    text-align:center;
    padding:2px 4px;
}

/* Grammar 03 */

#page_grammar_part_3 table {
            margin:0;
            border:1px solid #000;
            border-collapse:collapse;
        }
#page_grammar_part_3 table.left {
            float:left;
            margin-right:1em;
        }
#page_grammar_part_3 th {
            border:1px solid #000;
            color:#FFF;
            background-color:rgb(67,128,145);
            padding:4px 6px;
        }
#page_grammar_part_3 th code {
            color:#FFF;
        }
#page_grammar_part_3 td {
            border:1px solid #000;
            text-align:center;
            padding:2px 4px;
            width:6em;
        }
#page_grammar_part_3 .tableHolder {
            width:32em;
            height:14.5em;
            margin:1.5em auto;
        }

/* Grammar 04 */

#page_grammar_part_4 table {
            margin:0 auto;
            border:1px solid #000;
            border-collapse:collapse;
        }
#page_grammar_part_4 th {
            border:1px solid #000;
            color:#FFF;
            background-color:rgb(67,128,145);
            padding:4px 6px;
        }
#page_grammar_part_4 th code {
            color:#FFF;
        }
#page_grammar_part_4 td {
            border:1px solid #000;
            text-align:center;
            padding:2px 4px;
            width:7em;
        }


/* numbers */

#page_numerals #numberTable {
            width:609px;
            height:430px;
            margin:1em auto;
        }
#page_numerals table {
            margin:3px 0 3px 15px;
            border:1px solid #000;
            border-collapse:collapse;
            width:188px;
            float:left;
        }
#page_numerals th {
            font-size:0.9em;
            border:1px solid #000;
            text-align:center;
            padding:4px;
            background-color:#438091;
            color:#FFF;
        }
#page_numerals td {
            font-size:0.9em;
            border:1px solid #000;
            text-align:center;
            padding:2px 4px;
        }
#page_numerals #numerals {
            width:220px;
            margin:1em auto 0 auto;
            height:80px;
        }
#page_numerals #numerals div {
            float:left;
            padding:10px;
            text-align:center;
            font-size:1.5em;
        }
#page_numerals #numerals div img{
            padding-bottom:0.5em;
        }
#page_numerals .demoNumber img {vertical-align:middle;}

/* Oksos and Orthography */

#page_oksos table, #page_orthography table {
            margin:1.5em auto 1em auto;
            border:1px solid #000;
            border-collapse:collapse;
        }
#page_oksos th, #page_orthography th  {
            border:1px solid #000;
            color:#FFF;
            background-color:rgb(67,128,145);
            padding:4px 6px;
        }
#page_oksos td, #page_orthography td {
            border:1px solid #000;
            text-align:center;
            padding:2px 4px;
        }

/* punctuation */

#page_punctuation .rightColumn {
            float:right;
            margin:0 0 1em 1em;
            min-width:6em;
        }
#page_punctuation .rightColumn div {
            border:1px solid #1B7A95;
            text-align:center;
            margin:0 0 0.5em 0;
            padding:3px;
            font-size:0.9em;
            color:#1B7A95;
        }
#page_punctuation .rightColumn div img {
            display:block;
            margin:0 auto;
        }