/*
CSS MEDIA TYPES
++ all
        Suitable for all devices.
-- aural
        Intended for speech synthesizers. See the section on aural style sheets for details.
-- braille
        Intended for braille tactile feedback devices.
-- embossed
        Intended for paged braille printers.
++ handheld
        Intended for handheld devices (typically small screen, monochrome, limited bandwidth).
++ print
        Intended for paged, opaque material and for documents viewed on screen in print preview mode. Please consult the section on paged media for information about formatting issues that are specific to paged media.
++ projection
        Intended for projected presentations, for example projectors or print to transparencies. Please consult the section on paged media for information about formatting issues that are specific to paged media.
++ screen
        Intended primarily for color computer screens.
++ tty
        Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.
++ tv
        Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).
*/

/* Basic styling for all visual media */
@media all {
    body {
        background-color: #fff;
        color: #000;
        font-size: 78%;
    }
    html>body {
        font-size: 12.5px;
    }     
    p {
        font-size: 1em;
        line-height: 1.5em;
        margin: 0 0 1.5em 0;
    }
    input, select, table, textarea {
        font-family: inherit;
        font-size: inherit;
        font-weight: inherit;
    }
    body, div, dl, dt, dd, ul, ol, li, 
    /* h1, h2, h3, h4, h5, h6, */
    pre, form, fieldset, p, blockquote, th, td {
        margin:0;
        padding:0;
    } 

    /*
    h1 {
        line-height: 1em;
        font-size: 1.5em;
        margin: 0 0 1em 0;
    }
    h2 {
        font-size: 1.1667em;
        line-height: 1.286em;
        margin: 1.929em 0 0.643em 0;
    }
    */
}

/* Set up the base fonts for the various media */
@media handheld, print, projection, screen {
    /* For the majority of visual media */
    body {
        font-size: 83%;
        font-family: Georgia, "Times New Roman", Times, serif;
    }
    h1, h2, h3, h4, h5, h6 {
        font-family: "Times New Roman", Times, serif !important;
    }
}

@media tv {
    /* For lo-res media */
    body {
        font-family: "Times New Roman", Times, serif;
    }
}

@media tty {
    /* For terminal and fixed-font media */
    body {
        font-family: "Courier New", Courier, mono;
    }
}

/* Visual styling for all visual media */
@media handheld, print, projection, screen, tv {
    blockquote {
        margin: 1em 0;
        padding: 0 30px 1em 30px;
    }
    cite {
        display: block;
        font-style: italic;
    }
    dd {
        margin-bottom: 1em;
    }
    dt {
        font-weight: bold;
    }
    form {
        margin: 0;
        padding: 0;
    }
    h1 {
        /* Note the only H1 (in the header) is hidden, so it really doesn't matter */
        font-size: 210%;
    }
    h3, h4, h5, h6 {
        margin: 0;
    }
    h2 {
        /* These header sizes aren't in descending order, but rather based to the design */
        font-size: 200%;
    }
    h3 {
        font-size: 192%;
    }
    h4 {
        font-size: 136%;
    }
    h5 {
        font-size: 110%;
    }
    h6 {
        font-size: 100%;
    }
    img, a img {
        border: 0px;
    }
    label {
        padding: 0.2em 0.3em 0.3em 0;
    }
    p {
        margin: 0 0 1em 0;
    }
    ol, ul {
        line-height: 1.5em;
        margin: 1.2em 0 1.2em 2em;
    }
    ul li, ol li {
        margin-bottom: 0.2em;
    }
    table.dataForm {
        width: 100%;
    }
    table.dataForm th {
        font-weight: bold;
        padding: 0 0.5em;
        text-align: center;
    }
    table.dataForm tr.headerRow {
    }
    table.dataForm tr.lineItem1 {
        background-color: #fff;
    }
    table.dataForm tr.lineItem2 {
        background-color: #e7e7e7;
    }
    table.dataForm tr.lineItemAlt1 {
        background-color: #fff;
    }
    table.dataForm tr.lineItemAlt2 {
        background-color: #e7e7e7;
    }
    table.dataSet {
        border: 1px solid #dcdcdc;
        border-collapse: collapse;
        margin-left: -1px;
        width: 100%;
    }
    table.dataSet td  {
        border: 1px solid #dcdcdc;
        border-collapse: collapse;
        padding: 0.25em;
    }
    table.dataSet th {
        border: 1px solid #dcdcdc;
        border-collapse: collapse;
        font-weight: bold;
        padding: 0.25em;
    }
    table.dataSet tr.blankLine td {
        border-bottom: 1px solid white;
        border-left: 1px solid white;
        border-right: 1px solid white;
        font-size: 1px;
    }
    table.dataSet tr.groupRow {
        background-color: #acccfa;
        color: #000;
        font-weight: bold;
        text-align: left;
    }
    table.dataSet tr.groupRow a {
        color: #000000 !important;
    }
    table.dataSet tr.headerRow {
        background-color: #fff;
        color: #000;
        font-weight: bold;
        text-align: center;
    }
    table.dataSet tr.headerRow a {
        color: #000000 !important;
    }
    table.dataSet tr.lineItem1 {
        background-color: #fff;
    }
    table.dataSet tr.lineItem2 {
        background-color: #e7e7e7;
    }
    table.dataSet tr.lineItemAlt1 {
        background-color: #fff;
    }
    table.dataSet tr.lineItemAlt2 {
        background-color: #e7e7e7;
    }
    table.dataSet tr.optionsRow {
    }
    table.dataSet tr.optionsRow input {
    }
    table.dataSet tr.optionsRow select {
    }
    table.dataSet tr.recordsetError {
        text-align: center;
    }
    table.dataSet tr.recordsetPaging {
        text-align: center;
    }
    .debug_box {
        border: 1px solid #999; 
        background-color: #f7f7f7; 
        color: #000; 
        overflow: auto; 
        width: auto; 
        text-align: left; 
        padding: 1em;
    }
    .define {
        border-bottom: 1px dashed #333;
        cursor: help;
    }
    .error {
        color: #ff0300;
    }
    .error a {
        color: #ff0300 !important;
        text-decoration: underline !important;
    }
    .fieldnote,
    .footnote {
        font-size: 80%;
        color: #555555;
        margin: 0;
    }
    .hidden {
        display: none;
    }
    .highlight {
        background-color: #ffffe0;
        border-bottom: 1px solid #ffff7a;
        color: #000;
        padding: 0 0.3em;
    }
    .notice {
        border: 1px solid #000;
        background-color: #ffffe0;
        padding: 0.5em;
        text-align: justify;
        margin-bottom: 1em;
    }
    .req {
        font-weight: bold;
    }
    .xx-large {
        font-size: 200%;
    }
    .x-large {
        font-size: 125%;
    }
    .large {
        font-size: 110%;
    }
    .normal {
        font-size: 100%;
        font-style: none;
        font-variant: none;
        font-weight: normal;
        text-decoration: none;
    }
    .small {
        font-size: 85%;
    }
    .x-small {
        font-size: 68%;
    }
}

/* Aditional visual styling for non-print visual media */
@media handheld, projection, screen, tv {
    a, a:link {
        color: #004a80;
        text-decoration: none;
    }
    a:hover {
        color: #004a80;
        text-decoration: underline;
    }
    a:visited {
        color: #004a80;
    }
    a:active {
        /* not specified */
    }
    .define {
        border-bottom: 1px dashed #333;
        cursor: help;
    }
    .not-for-screen, .print-only {
        display: none;
    }
    .readonly {
        /* specify color in layout.css (mark "!important") */
        cursor: default !important;
    }
    .req {
        /* specify color in layout.css */
    }
}