
@media screen, projection {

/* Skeleton Styles
----------------------------------
Date:       22 June 2007
Author:     Scott Harwood for ssadesign
Contact:    s.r.harwood@gmail.com

Index:      generic
                tag specific
                header
                secondary navigation
                content
                footer
                forms
                self clearing
            homepage

-----------------------------------*/

/* =generic
-----------------------------------*/

    /* =tag specific
    --------------------*/
    body,html {
        margin:0; padding:0;
    }

    ul, li, dl, dt, dd {
        padding-left: 0.3em;
        margin-left: 0.5em;
    }

    h1,h2,h3,h4,h5,h6 {
        margin:0; padding:0;
    }

    p {
        margin-bottom:1em;
        margin-top:0;
    }


    body {
        text-align:center;
    }

    #page {
        margin:0 auto;
        text-align:left;
        width:800px;
    }


    /* =header
    --------------------*/
    #header ul, #header li, #header dl, #header dt, #header dd {
        margin:0; padding:0;
        float:left;
        list-style-type:none;
    }

    #header h1 {
        width:773px;
        height:120px;
        text-indent:-9999px;
        margin-left:10px;
    }

    #header #nav li {
        float:left;
        margin-bottom:1px;
    }

    #header #nav li a {
        display:block;
        height:2em;
        float:left;
        line-height:2em;
        padding:0 20px;
    }

    /* =secondary navigation
    -------------------------*/
    #secondary-nav {
        float:left;
        width:105px;
        margin:0;
        padding:0;
    }

    #secondary-nav ul, #secondary-nav li, #secondary-nav dl, #secondary-nav dt, #secondary-nav dd {
        margin:0; padding:0;
        list-style-type: none;
    }

    #secondary-nav li a {
        height:1.6em;
        line-height:1.6em;
        display:block;
    }

    #secondary-nav .heading {
        line-height:1.6em;
    }

    /* =content
    -------------------------*/

    #primary {
        width:520px;
        float:left;
        display:block;
        margin-bottom:8px;
    }

    #primary .heading {
        margin-bottom:1em;
    }

    #secondary {
        width:136px;
        float:right;
        padding-right:9px;
    }

    #primary .module {
        float:left;
    }

    .group.triple {
        clear:both;
        margin-bottom:8px;
        position:relative;
        top:8px;
    }

    .group.triple .module {
        width:27%!important;
        margin-left:1px;
        margin-right:8px;
        margin-top:7px;
    }

    .group.triple .module.last {
        margin-right:0;
    }

    /* =footer
    -------------------------*/
    #footer {
        clear:both;
    }

    #footer p {
        margin:0;
        padding:0;
        height:2em;
        line-height:2em;
    }

    /* =forms
    ------------------------*/

    form.login .text-input {
        width:103px;
        height:1.2em;
        margin-top:2px;
    }

    form.login .input-submit {
        width:105px;
        height:18px;
        line-height:20px;
        padding-bottom:2px;
        margin:2px 0;
    }


    * html form.login input {
        width:100px;
    }

    form.login div#username,
    form.login div#password {
        position:relative;
        margin-right:3px;
    }
    label.overlabel-apply {
        position:absolute;
        top:3px;
        left:5px;
        z-index:1;
    }

    /* =self clearing
    -------------------------*/
    #nav:after,
    #primary .group:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

    #nav,
    #primary .group { display: inline-block; }
    * html #nav,
    * html #primary .group { height: 1%; }
    #nav,
    #primary .group { display: block; }


    /* =homepage
    ------------------------*/
    #home #primary .module.first {
        width:220px;
    }

    #home #primary .module.second {
        width:268px;
        height:290px;
        padding:0!important;
        margin-left:8px;
        margin-right:0;
    }

    #home #primary .module.third {
        margin-top:8px;
    }

    #home.nomap #primary .module.first {
        width:524px;
        float:none;
    }


/* Skin Styles
----------------------------------
Date:       22 June 2007
Author:     Scott Harwood for ssadesign
Contact:    s.r.harwood@gmail.com

Index:      tag specific
            header
            secondary-nav
            content
            forms
            footer

-----------------------------------*/


    /* =tag specific
    ------------------*/
    body {
        background:#fff;
    }

    a, a:visited {
        color:#3d8bbb;
        text-decoration:underline;
    }

    a:hover {
        color:#059fc5;
    }

    strong em {
        color:#0065A4;
        font-style:normal;
    }

    #page {
        background:url(/images/bg-page.gif) 0 100% repeat-x;
        overflow:hidden;
    }

    /* =header
    --------------------*/
    #header {
        padding-bottom:20px;
        background:#fff;
    }

    #header h1 {
        background:#fff url(/images/text-sailDB.gif) 0 0 no-repeat;
    }

    #header #nav {
        background:url(/images/bg-primary-nav.gif) 0 100% repeat-x;
        padding-left:10px;
    }

    #header #nav li {
        border:1px solid #7f9faf;
    }

    #header #nav li a {
        font-weight:bold;
        color:#002b54;
        text-decoration:none;
        background:#fff url(/images/bg-nav.gif) 0 100% repeat-x;
        text-transform:uppercase;
        font-size:0.9em;
    }

    #header #nav li.active a,
    #header #nav a:hover {
        background-image:url(/images/bg-nav-active.gif) ;
    }

    /* =secondary-nav
    -------------------*/
    #secondary-nav {
        padding-left:10px;
    }

    #secondary-nav li,
    #secondary-nav .login {
        background:#fff;
        padding-bottom:2px;
    }

    #secondary-nav .login {
        padding:0;
        margin:0;
    }

    #secondary-nav li a {
        background:#8bd3f5;
        border:1px solid #20abcd;
        font-weight:bold;
        color:#002b54;
        text-decoration:none;
        padding:2px 3px;
    }

    #secondary-nav li a:hover {
        background:#fff url(/images/bg-nav.gif) 0 100% repeat-x;
    }

    #secondary-nav .heading {
        padding:2px 3px;
        border:1px solid #20abcd;
        background:#5cc2db;
        color:#fff;
        text-transform:uppercase;
    }

    #secondary-nav .signup {
        padding:5px;
        text-align:center;
    }

    #secondary-nav .signup a {
        text-decoration:none;
    }

    #secondary-nav .signup a strong {
        text-transform:uppercase;
        color:#fff;
        text-decoration:none;
    }

    #secondary-nav .signup a:hover strong {
        color:#059fc5;
    }

    /* =content
    ----------------*/
    #primary {
        padding:0 0 0 9px;
        color:#002b54;
    }

    #primary .module {
        background:#fff;
        border:1px solid #7db2d1;
        padding:10px;
    }

    /*
    #primary .group.triple {
        background:url(/images/bg-triple-faux-col.gif) 0 100% no-repeat;
    }
    */

    #primary .group .module {
        /* border:none; */
        border:1px solid #7db2d1;
        margin-top:0;
        background:#fff;
    }

    .module .heading {
        color:#0065A4;
    }

    #secondary .module {
        border:1px solid #0065A4;
        padding:5px;
        margin-bottom:8px;
    }

    #secondary .module .heading {
        color:#008591;
    }


    .group .module .heading {
        color:#008591;
    }

    #secondary .module .sub-heading {
        color:#008591;
    }

    #secondary p {
        margin:1em 0;
    }

    dl.dates {
        margin:1em 0;
        padding:0;
    }

    dl.dates dt {
        color:#0166a6;
        font-weight:bold;
        margin:0;
        padding:0;
    }

    dl.dates dd {
        margin:0 1em;
        padding: 0;
    }

    #secondary .module.register {
        border:none;
        color:#8F8100;
    }

    #secondary .module.register .heading {
        color:#002B54;
        margin-bottom:1em;
    }

    #secondary .module.register .sub-heading {
        color:#006951;
        margin-bottom:1em;
    }

    /* =forms
    ------------------*/
    label.overlabel,
    label.overlabel-apply {
        color:#999;
    }

    .text-input {
        border:1px solid #059fc5;
    }

    .input-submit {
        color:#FDEE1E;
        border:0;
        background:#5cc2db;
        text-align:center;
        text-transform:uppercase;
        border:1px solid #00a0c6;
        font-weight:bold;
    }

    /* =footer
    --------------------*/
    #footer {
        background:#002b54;
        padding:0 10px;
    }

    #footer p {
        color:#fff;
        text-align:right;
    }


/* =typography
-----------------------------------
default : 10px
1.2em   : 12px
1.1em   : 11px
1em     : 10px
0.9em   : 9px
-----------------------------------*/
/*
    html {
        font-size:100%;
    }
*/
    body {
        font-family:Arial, Helvetica, Verdana, sans-serif;
    }

    #secondary-nav, #nav, #footer {
        font-size: 9px;
    }

    #primary, #secondary {
        font-size: 11px;
    }

    h1,h2,h3,h4,h5,h6 {
        font-size:1em;
    }

    .module .heading {
        font-size:1.2em;
    }

    p.error {
        font-weight : bold;
        border: solid;
        background-color: yellow;
        padding: 5px;
    }

    p.success {
        font-weight : bold;
        border: solid;
        background-color: #00FF00;
        padding: 5px;
    }

    #primary .module .heading {
        font-size:1.2em;
    }

    #secondary .module .heading,
    #secondary .module .sub-heading {
        font-size:1em;
    }

    #secondary  .module.register {
        font-size:1.1em;
    }

    #secondary .module.register .heading {
        font-size:1.1em;
    }

    .input-submit {
        font-size:1em;
    }
}

@media print {
    /* =hide content
    ----------------------*/
    #nav,
    #secondary-nav {
        display:none;
    }

    /* formatting
    ---------------------*/
    dt,dd {display:inline;}
    dt {clear:left; font-weight:bold;}

    /* =fonts
    ---------------------*/
    body {
        font-family:"Times New Roman", Times, serif;
        font-size:10pt;
    }
}
