@charset "utf-8";
viewport {
    zoom: 1.0;
    width: device-width;
}

@media screen {
    body {
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
        font-size: 1em;
        background-color: #f5f5dc;
        color: #112a46;
    }

    #banner, #siteFooter {
        clear: both;
        text-align: center;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 2em;
    }

    a:link {
        text-decoration: none;
    }

    a:focus, a:hover {
        font-weight: bold;
        text-decoration: underline;
    }

    a:active {
        font-style: italic;
    }

    a:visited {
        text-decoration: none;
    }
}

@media screen and (max-width:980px) {
    body {
        font-size: 2em;
    }

    #mainNav {
        float: left;
        margin: 10px 0 0 0;
        padding: 0;
    }

    #menu li {
        float: left;
        list-style-type: none;
        text-decoration: none;
        margin: 0 0 0 20px;
        padding: 0;
        position: relative;
    }

    /* specify class found under identifier, so that list items get 
    properly spaced out when revealed. */
    #menu .zone {
        display: none;
        list-style-type: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #d1d1a9;
        padding: 0;
    }

    #menu .zone li {
        float: none;
        margin-bottom: 20px;
    }

    #menu li:hover > .zone, #menu li:focus > .zone, #menu li:active > .zone {
        display: block;
    }

    #mainNav, main {
        clear: both;
    }

    main {
        margin-top: 20px;
    }
}

@media screen and (min-width:981px) {
    #mainNav {
        float: left;
        clear: left;
        width: 20%;
    }

    main {
        float: right;
        clear: right;
        width: 75%;
        background-color: #d1d1a9;
    }

    #menu {
        list-style-type: none;
    }

    .zone {
        list-style-type: none;
        margin-left: 0;
        margin-bottom: 20px;
        padding-left: 0;
        padding-bottom: 20px;
        border-radius: 5px;
        background-color: #d1d1a9;
    }

    .zone li {
        margin-bottom: 20px;
    }

    .arrow {
        display: none;
    }
}

@media print {
    #mainNav, #banner {
        display: none;
    }

    body {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 1em;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    }

    /* display link target on printed page. */
    a:link:after, a:visited:after { 
        display:inline-block; 
        margin-left:5px; 
        font-style:normal; 
        content: " (" attr(href) ")"; 
    }

    article header a:link:after, article header a:visited:after { 
        content:normal;
    }
 
 
    a:link, a:visited {
        font-weight:bold;
        color:#520;
    }

    /* display abbreviation and acronym meanings on printed page, if page uses the respective abbr and 
    acronym tags. */ 
    abbr:after { 
        content: " (" attr(title) ")"; 
    }
}