html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main
{
    display: block;
}

body
{
    line-height: 1;
}

.nav-menu .selected {
    color: #f26422!important;
}

.site-logo {
    width: 16em !important;
    height: 3.5em !important;
    margin-top: -1em!important;
    margin-left: -.5em!important;
}
ol, ul
{
    list-style: none;
}

blockquote, q
{
    quotes: none;
}

    blockquote:before, blockquote:after
    {
        content: "";
        content: none;
    }

    q:before, q:after
    {
        content: "";
        content: none;
    }

table
{
    border-collapse: collapse;
    border-spacing: 0;
}

.visuallyhidden
{
    background: #000;
    font-size: 1.5rem;
    color: #FFF;
    text-decoration: none;
    padding: .625em;
    position: absolute;
    top: 0;
    left: -999999px;
}

    .visuallyhidden:link, .visuallyhidden:visited
    {
        color: #FFF;
    }

    .visuallyhidden:hover, .visuallyhidden:focus
    {
        visibility: visible;
        background: #666;
        text-decoration: underline;
        left: 0;
    }

.colorful
{
    display: none;
}

.contrasty
{
    display: block;
}

body
{
    font-family: Helvetica, verdana, sans-serif;
}

h1, h2, h3, h4, h5, h6
{
    font-weight: bold;
    margin: 0 0 .8em 0;
}

    h1 small, h2 small, h3 small, h4 small, h5 small, h6 small
    {
        margin-top: .1em;
        font-size: 80%;
        display: block;
    }

h1
{
    font-size: 2rem;
    color: #41556d;
}

    h1 small
    {
        color: #6d5941;
    }

h2
{
    font-size: 1.8rem;
    color: #41556d;
}

    h2 small
    {
        color: #6d5941;
    }

h3
{
    font-size: 1.6rem;
    color: #41556d;
}

    h3 small
    {
        color: #6d5941;
    }

h4
{
    font-size: 1.4rem;
    color: #41556d;
}

    h4 small
    {
        color: #6d5941;
    }

h5
{
    font-size: 1.2rem;
    color: #41556d;
}

    h5 small
    {
        color: #6d5941;
    }

h6
{
    font-size: 1rem;
    color: #41556d;
}

    h6 small
    {
        color: #6d5941;
    }

p
{
    font-size: 1rem;
    color: #000;
    line-height: 1.8;
    margin-bottom: .8em;
}

ul
{
    list-style: disc;
    font-size: 1rem;
    color: #000;
    line-height: 1.8;
    margin-bottom: 1em;
    padding-left: 2em;
}

ol
{
    list-style: decimal;
    font-size: 1rem;
    color: #000;
    line-height: 1.8;
    margin-bottom: 1em;
    padding-left: 2em;
}

table
{
    width: 100%;
    border-collapse: collapse;
    font-size: 1rem;
    margin-bottom: 1em;
}

    table caption
    {
        margin-bottom: .5em;
        font-style: italic;
    }

    table th, table td
    {
        padding: .5em;
        text-align: left;
    }

    table th
    {
        color: #FFF;
        font-weight: bold;
        background: #41556d;
    }

        table th[class*="col"]
        {
            float: none;
        }

    table tr
    {
        border-bottom: solid 1px #e4e4e4;
    }

        table tr:hover, table tr:focus
        {
            background: #e4e4e4;
        }

        table tr:nth-child(even)
        {
            background: #F1F1F1;
        }

.title-links a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
{
    text-decoration: none;
}

    .title-links a:link, h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link, .title-links a:visited, h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited
    {
        color: #41556d;
    }

    .title-links a:hover, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, .title-links a:focus, h1 a:focus, h2 a:focus, h3 a:focus, h4 a:focus, h5 a:focus, h6 a:focus
    {
        color: #2e3c4d;
        text-decoration: underline;
    }

.paragraph-links a, p a, ul a, ol a, table a
{
    text-decoration: underline;
}

    .paragraph-links a svg, p a svg, ul a svg, ol a svg, table a svg
    {
        padding-right: .3125em;
        vertical-align: middle;
    }

    .paragraph-links a:link, p a:link, ul a:link, ol a:link, table a:link, .paragraph-links a:visited, p a:visited, ul a:visited, ol a:visited, table a:visited
    {
        color: #41556d;
    }

        .paragraph-links a:link svg, p a:link svg, ul a:link svg, ol a:link svg, table a:link svg, .paragraph-links a:visited svg, p a:visited svg, ul a:visited svg, ol a:visited svg, table a:visited svg
        {
            fill: #000;
        }

    .paragraph-links a:hover, p a:hover, ul a:hover, ol a:hover, table a:hover, .paragraph-links a:focus, p a:focus, ul a:focus, ol a:focus, table a:focus
    {
        color: #FFF;
        background: #41556d;
    }

        .paragraph-links a:hover svg, p a:hover svg, ul a:hover svg, ol a:hover svg, table a:hover svg, .paragraph-links a:focus svg, p a:focus svg, ul a:focus svg, ol a:focus svg, table a:focus svg
        {
            fill: #fff;
        }

table td:hover, table td:focus
{
    background: #41556d;
    color: #FFF;
}

    table td:hover a, table td:focus a
    {
        display: block;
        color: #FFF;
    }

nav ul
{
    list-style: none;
}

.container
{
    overflow: hidden;
}

.transformer
{
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    transition: .3s;
}

    .transformer:after
    {
        content: " ";
        display: block;
        clear: both;
    }

    .transformer.is-open
    {
        transform: translate3d(-16.25em, 0, 0);
    }

        .transformer.is-open .off-canvas, .transformer.is-open .site-cover
        {
            display: block;
        }

.site-cover
{
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background: #000;
    background: rgba(0,0,0,0.8);
    display: none;
    cursor: pointer;
    -webkit-transition: .1s;
    -moz-transition: .1s;
    transition: .1s;
}

.off-canvas
{
    display: none;
    position: absolute;
    width: 16.25em;
    right: -16.25em;
    top: 0;
    bottom: 0;
    background: #41556d;
    z-index: 10000;
}

    .off-canvas ul
    {
        width: 100%;
        margin: 0;
        padding: 0;
        float: left;
    }

        .off-canvas ul li
        {
            width: 100%;
            display: block;
            border-bottom: solid 1px #546e8d;
        }

            .off-canvas ul li:first-child
            {
                border-top: solid 1px #546e8d;
            }

            .off-canvas ul li a
            {
                padding: .625em .9375em;
                text-decoration: none;
                display: block;
                color: #FFF;
                -webkit-transition: .3s;
                -moz-transition: .3s;
                transition: .3s;
            }

                .off-canvas ul li a svg
                {
                    fill: #FFF;
                    vertical-align: middle;
                    text-align: right;
                }

                .off-canvas ul li a:hover, .off-canvas ul li a:focus
                {
                    text-decoration: underline;
                    background: #2e3c4d;
                    border-left-color: #FFF;
                }

                    .off-canvas ul li a:hover svg, .off-canvas ul li a:focus svg
                    {
                        fill: #FFF;
                    }

    .off-canvas .nav-item > a.open
    {
        border-left: solid 10px #cc0000;
        text-decoration: underline;
    }

    .off-canvas .sub-nav
    {
        display: none;
    }

        .off-canvas .sub-nav li
        {
            display: block;
            float: none;
        }

        .off-canvas .sub-nav.open
        {
            display: block;
            background: #4b617d;
        }

            .off-canvas .sub-nav.open .nav-item--mobile
            {
                font-weight: bold;
                display: block;
            }

    .off-canvas .menu-toggle
    {
        display: block;
        color: #FFF;
        background: #2e3c4d;
        padding: 1.25em .9375em;
        text-decoration: none;
        -webkit-transition: .3s;
        -moz-transition: .3s;
        transition: .3s;
    }

        .off-canvas .menu-toggle svg
        {
            fill: #FFF;
            padding-right: .3125em;
            vertical-align: middle;
        }

        .off-canvas .menu-toggle:hover, .off-canvas .menu-toggle:focus
        {
            text-decoration: underline;
            background: #1b232d;
        }

    .off-canvas a
    {
        border-left: solid 10px #37495d;
    }

header .nav-menu
{
    margin: 1.5625em 0 0 0;
    padding: 0;
    clear: left;
    float: left;
    position: relative;
}

    header .nav-menu a
    {
        font-size: 1.5rem;
        font-weight: bold;
        text-decoration: none;
        padding: .3125em;
    }

        header .nav-menu a svg
        {
            text-align: right;
            vertical-align: middle;
        }

        header .nav-menu a:link, header .nav-menu a:visited
        {
            color: #41556d;
            -webkit-transition: .1s;
            -moz-transition: .1s;
            transition: .1s;
        }

            header .nav-menu a:link svg, header .nav-menu a:visited svg
            {
                fill: #41556d;
            }

        header .nav-menu a:hover, header .nav-menu a:focus, header .nav-menu a.open
        {
            color: #f15a29;
            background: none;
            text-decoration: underline;
        }

            header .nav-menu a:hover svg, header .nav-menu a:focus svg, header .nav-menu a.open svg
            {
                fill: #f15a29;
            }

@media screen and (max-width: 399px) and (min-width: 300px) {
    ul li span {
        min-width: 100px !important;
    }

    .socialmedia li{
        margin: 5px!important;
    }

    .ShortForecast {
        margin: .3em !important;
        font-size: .9em;
    }
}



@media screen and (max-width: 476px) and (min-width: 400px) {
    ul li span {
        min-width: 125px !important;
    }

    .ShortForecast {
        margin: .3em !important;
        font-size: .9em;
    }
}

@media screen and (max-width: 629px) and (min-width: 477px) {
    ul li span {
        min-width: 175px !important;
    }
}

@media screen and (max-width: 767px) and (min-width: 630px) {
    ul li span {
        min-width: 220px !important;
    }
}

@media screen and (max-width: 899px) and (min-width: 768px) {
    ul li span {
        min-width: 80px !important;
    }
}

@media screen and (max-width: 990px) and (min-width: 900px) {
    ul li span {
        min-width: 110px !important;
    }
}

@media screen and (max-width: 1163px) and (min-width: 991px) {
    ul li span {
        min-width: 125px !important;
    }
    .ShortForecast {
        margin: .3em !important;
        font-size: .9em;
    }
}


    @media screen and (max-width: 56.875em) {
        header .nav-menu {
            width: 100%;
            margin-top: 1.25em;
            float: left;
        }
    }

    @media screen and (max-width: 46.875em) {
        header .nav-menu a {
            font-size: 1rem;
        }

    }


    header .nav-item {
        margin-right: .3125em;
        float: left;
    }

        header .nav-item > a {
            position: relative;
        }

            header .nav-item > a.open {
                background: #EEE;
                text-decoration: underline;
            }

    header .sub-nav {
        position: absolute;
        display: none;
        top: 1.8em;
        width: 15.625em;
        padding: 0;
        background: #EEE;
    }

        header .sub-nav li {
            display: block;
            float: none;
        }

            header .sub-nav li.nav-item--mobile {
                display: none;
            }

        header .sub-nav.open {
            display: block;
        }

        header .sub-nav a {
            display: block;
        }

            header .sub-nav a:hover, header .sub-nav a:focus {
                color: #FFF;
                background: #6d5941;
            }

    @media screen and (max-width: 46.875em) {
        header .sub-nav {
            top: 1.8em;
        }
    }

    header .menu-toggle {
        display: none;
        float: right;
        font-size: 1.1rem;
        font-weight: bold;
        text-decoration: none;
        padding: .5em;
        border: solid 1px #41556d;
    }

        header .menu-toggle:before {
            content: '\2261';
            margin-right: .3125em;
            vertical-align: .0625em;
        }

        header .menu-toggle:link, header .menu-toggle:visited {
            color: #41556d;
        }

        header .menu-toggle:hover, header .menu-toggle:focus {
            color: #FFF;
            background: #2e3c4d;
        }

    @media screen and (max-width: 42.4375em) {
        header .menu-toggle {
            display: block;
        }
    }

    @media screen and (max-width: 20em) {
        header .menu-toggle {
            font-size: 1.5rem;
            padding: .625em;
            position: absolute;
            right: 0;
        }

            header .menu-toggle span {
                display: none;
                font-size: 0;
                letter-spacing: 0;
            }

            header .menu-toggle:before {
                margin-right: 0;
                vertical-align: 0;
            }
    }

    aside .side-nav .sub-nav {
        border-top: solid 5px #FFF;
    }

        aside .side-nav .sub-nav a {
            background: #6d5941;
            color: #FFF;
            -webkit-transition: .2s;
            -moz-transition: .2s;
            transition: .2s;
        }

            aside .side-nav .sub-nav a:hover, aside .side-nav .sub-nav a:focus {
                background: #41556d;
            }

        aside .side-nav .sub-nav ul li a {
            background: none;
            color: #41556d;
        }

            aside .side-nav .sub-nav ul li a:hover, aside .side-nav .sub-nav ul li a:focus {
                background: #41556d;
                color: #FFF;
            }

    footer nav ul {
        margin: 0;
        padding: 0;
        float: left;
    }

        footer nav ul li {
            margin-right: 1em;
            float: left;
        }

        footer nav ul strong {
            font-weight: bold;
        }

    footer nav.displayblock {
        width: 15%;
        float: left;
    }

        footer nav.displayblock li {
            display: block;
            float: none;
        }

    @media screen and (max-width: 48em) {
        footer nav.displayblock {
            width: 25%;
        }
    }

    @media screen and (max-width: 40em) {
        footer nav.displayblock {
            width: 100%;
            margin-bottom: .625em;
        }

            footer nav.displayblock li {
                float: left;
            }
    }

    footer a {
        text-decoration: none;
    }

        footer a:link, footer a:visited {
            color: #FFF;
        }

        footer a:hover, footer a:focus {
            color: #e6e6e6;
            text-decoration: underline;
        }

    @media screen and (max-width: 40em) {
        footer nav li {
            width: 100%;
            margin-right: 0;
        }
    }

    .col1 {
        width: 1%;
        float: left;
    }

    .col2 {
        width: 2%;
        float: left;
    }

    .col3 {
        width: 3%;
        float: left;
    }

    .col4 {
        width: 4%;
        float: left;
    }

    .col5 {
        width: 5%;
        float: left;
    }

    .col6 {
        width: 6%;
        float: left;
    }

    .col7 {
        width: 7%;
        float: left;
    }

    .col8 {
        width: 8%;
        float: left;
    }

    .col9 {
        width: 9%;
        float: left;
    }

    .col10 {
        width: 10%;
        float: left;
    }

    .col11 {
        width: 11%;
        float: left;
    }

    .col12 {
        width: 12%;
        float: left;
    }

    .col13 {
        width: 13%;
        float: left;
    }

    .col14 {
        width: 14%;
        float: left;
    }

    .col15 {
        width: 15%;
        float: left;
    }

    .col16 {
        width: 16%;
        float: left;
    }

    .col17 {
        width: 17%;
        float: left;
    }

    .col18 {
        width: 18%;
        float: left;
    }

    .col19 {
        width: 19%;
        float: left;
    }

    .col20 {
        width: 20%;
        float: left;
    }

    .col21 {
        width: 21%;
        float: left;
    }

    .col22 {
        width: 22%;
        float: left;
    }

    .col23 {
        width: 23%;
        float: left;
    }

    .col24 {
        width: 24%;
        float: left;
    }

    .col25 {
        width: 25%;
        float: left;
    }

    .col26 {
        width: 26%;
        float: left;
    }

    .col27 {
        width: 27%;
        float: left;
    }

    .col28 {
        width: 28%;
        float: left;
    }

    .col29 {
        width: 29%;
        float: left;
    }

    .col30 {
        width: 30%;
        float: left;
    }

    .col31 {
        width: 31%;
        float: left;
    }

    .col32 {
        width: 32%;
        float: left;
    }

    .col33 {
        width: 33%;
        float: left;
    }

    .col34 {
        width: 34%;
        float: left;
    }

    .col35 {
        width: 35%;
        float: left;
    }

    .col36 {
        width: 36%;
        float: left;
    }

    .col37 {
        width: 37%;
        float: left;
    }

    .col38 {
        width: 38%;
        float: left;
    }

    .col39 {
        width: 39%;
        float: left;
    }

    .col40 {
        width: 40%;
        float: left;
    }

    .col41 {
        width: 41%;
        float: left;
    }

    .col42 {
        width: 42%;
        float: left;
    }

    .col43 {
        width: 43%;
        float: left;
    }

    .col44 {
        width: 44%;
        float: left;
    }

    .col45 {
        width: 45%;
        float: left;
    }

    .col46 {
        width: 46%;
        float: left;
    }

    .col47 {
        width: 47%;
        float: left;
    }

    .col48 {
        width: 48%;
        float: left;
    }

    .col49 {
        width: 49%;
        float: left;
    }

    .col50 {
        width: 50%;
        float: left;
    }

    .col51 {
        width: 51%;
        float: left;
    }

    .col52 {
        width: 52%;
        float: left;
    }

    .col53 {
        width: 53%;
        float: left;
    }

    .col54 {
        width: 54%;
        float: left;
    }

    .col55 {
        width: 55%;
        float: left;
    }

    .col56 {
        width: 56%;
        float: left;
    }

    .col57 {
        width: 57%;
        float: left;
    }

    .col58 {
        width: 58%;
        float: left;
    }

    .col59 {
        width: 59%;
        float: left;
    }

    .col60 {
        width: 60%;
        float: left;
    }

    .col61 {
        width: 61%;
        float: left;
    }

    .col62 {
        width: 62%;
        float: left;
    }

    .col63 {
        width: 63%;
        float: left;
    }

    .col64 {
        width: 64%;
        float: left;
    }

    .col65 {
        width: 65%;
        float: left;
    }

    .col66 {
        width: 66%;
        float: left;
    }

    .col67 {
        width: 67%;
        float: left;
    }

    .col68 {
        width: 68%;
        float: left;
    }

    .col69 {
        width: 69%;
        float: left;
    }

    .col70 {
        width: 70%;
        float: left;
    }

    .col71 {
        width: 71%;
        float: left;
    }

    .col72 {
        width: 72%;
        float: left;
    }

    .col73 {
        width: 73%;
        float: left;
    }

    .col74 {
        width: 74%;
        float: left;
    }

    .col75 {
        width: 75%;
        float: left;
    }

    .col76 {
        width: 76%;
        float: left;
    }

    .col77 {
        width: 77%;
        float: left;
    }

    .col78 {
        width: 78%;
        float: left;
    }

    .col79 {
        width: 79%;
        float: left;
    }

    .col80 {
        width: 80%;
        float: left;
    }

    .col81 {
        width: 81%;
        float: left;
    }

    .col82 {
        width: 82%;
        float: left;
    }

    .col83 {
        width: 83%;
        float: left;
    }

    .col84 {
        width: 84%;
        float: left;
    }

    .col85 {
        width: 85%;
        float: left;
    }

    .col86 {
        width: 86%;
        float: left;
    }

    .col87 {
        width: 87%;
        float: left;
    }

    .col88 {
        width: 88%;
        float: left;
    }

    .col89 {
        width: 89%;
        float: left;
    }

    .col90 {
        width: 90%;
        float: left;
    }

    .col91 {
        width: 91%;
        float: left;
    }

    .col92 {
        width: 92%;
        float: left;
    }

    .col93 {
        width: 93%;
        float: left;
    }

    .col94 {
        width: 94%;
        float: left;
    }

    .col95 {
        width: 95%;
        float: left;
    }

    .col96 {
        width: 96%;
        float: left;
    }

    .col97 {
        width: 97%;
        float: left;
    }

    .col98 {
        width: 98%;
        float: left;
    }

    .col99 {
        width: 99%;
        float: left;
    }

    .col100 {
        width: 100%;
        float: left;
    }

    #site {
        width: 100%;
        margin: 0;
        padding: 0;
        float: left;
    }

    header, main, footer {
        width: 100%;
        outline: none;
        float: left;
    }

    img {
        float: left;
        margin: .625em;
    }

        img.banner {
            width: 100%;
            margin-bottom: 1.25em;
            clear: both;
        }

    .viewport {
        max-width: 80em;
        margin-left: auto;
        margin-right: auto;
        margin-top: 2em;
    }

        .viewport:after {
            content: " ";
            display: block;
            clear: both;
        }

    .content {
        padding-left: .625em;
        padding-right: .625em;
    }

    .content-block {
        margin-bottom: 3em;
        float: left;
    }

        .content-block .content-block {
            margin-bottom: 0;
        }

        .content-block.col25 {
            width: 21.73913%;
            float: left;
        }

            .content-block.col25.last {
                width: 21.73913%;
                float: right;
            }

    @media screen and (max-width: 48em) {
        .content-block.col25 {
            width: 47.82609%;
            float: left;
            margin-bottom: 3em;
        }

            .content-block.col25:nth-child(even) {
                width: 47.82609%;
                float: right;
            }
    }

    @media screen and (max-width: 40em) {
        .content-block.col25 {
            width: 100%;
            margin-left: 0;
            margin-right: 0;
        }

            .content-block.col25:nth-child(even) {
                width: 100%;
                margin-left: 0;
                margin-right: 0;
            }
    }

    .content-block.col40 {
        width: 39.13043%;
        float: left;
    }

        .content-block.col40.last {
            width: 39.13043%;
            float: right;
        }

    @media screen and (max-width: 48em) {
        .content-block.col40 {
            width: 100%;
        }

            .content-block.col40.last {
                width: 100%;
            }
    }

    .content-block.col50 {
        width: 47.82609%;
        float: left;
    }

        .content-block.col50.last {
            width: 47.82609%;
            float: right;
        }

    @media screen and (max-width: 40em) {
        .content-block.col50 {
            width: 100%;
            margin-left: 0;
            margin-right: 0;
        }

            .content-block.col50.last {
                width: 100%;
                float: left;
                margin-left: 0;
                margin-right: 0;
            }
    }

    .content-block.col60 {
        width: 56.52174%;
        float: left;
    }

        .content-block.col60.last {
            width: 56.52174%;
            float: right;
        }

    @media screen and (max-width: 48em) {
        .content-block.col60 {
            width: 100%;
            margin-bottom: 1.5em;
        }
    }

    .content-block.col75 {
        width: 73.91304%;
        float: left;
    }

    @media screen and (max-width: 48em) {
        .content-block.col75 {
            width: 100%;
            float: left;
            margin-left: 0;
            margin-right: 0;
        }
    }

    aside.content-block .content-block {
        width: 100%;
        margin-bottom: 3em;
        background: #F1F1F1;
        float: left;
    }

    aside .side-nav h4 {
        padding: .3125em .3125em;
        margin-left: 0;
        margin-bottom: 0;
        background: #37495d;
        color: #FFF;
    }

        aside .side-nav h4 a {
            color: #FFF;
            margin: 0;
            padding: 0;
        }

            aside .side-nav h4 a:hover, aside .side-nav h4 a:focus {
                text-decoration: underline;
            }

    aside .side-nav ul {
        width: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    aside .side-nav a {
        padding: .3125em .625em;
        display: block;
        -webkit-transition: .2s;
        -moz-transition: .2s;
        transition: .2s;
    }

    @media screen and (max-width: 48em) {
        aside.content-block.col25:nth-child(even) {
            width: 100%;
        }
    }

    footer {
        background: #41556d;
        padding-top: 2em;
        padding-bottom: 2em;
    }

        footer p {
            color: #FFF;
        }

        footer .viewport {
            margin-top: 1em;
            margin-bottom: 0;
        }

    @media print {
        section, div {
            width: 100%;
        }

        header, footer {
            display: none;
        }
    }

    .branding, .site-logo, .host-logo a {
        max-width: 100%;
        text-indent: -999999px;
        float: left;
    }

    .site-logo {
        width: 32em;
        height: 6.875em;
        background: url("../layout/img/TexMesonet_logo.svg");
        background-size: cover;
        margin: .5em;
    }

    @media screen and (max-width: 64em) {
        .site-logo {
            width: 25.6em;
            height: 5.5em;
        }
    }

    @media screen and (max-width: 48em) {
        .site-logo {
            margin-bottom: 1em;
        }
    }

    @media screen and (max-width: 30em) {
        .site-logo {
            width: 16em;
            height: 3.4375em;
        }
    }

    @media screen and (max-width: 20em) {
        .site-logo {
            width: 11.2em;
            height: 2.40625em;
        }
    }

    .host-logo {
        width: 100%;
        float: right;
    }

        .host-logo a {
            margin: .9375em;
            float: right;
        }

    @media screen and (max-width: 20em) {
        .host-logo a {
            float: left;
        }
    }


    .host-logo #twdb-logo {
        width: 7.2em;
        height: 2em;
        background: url("../layout/img/TWDB_logo_rev.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

        .host-logo #twdb-logo:hover, .host-logo #twdb-logo:focus {
            width: 7.2em;
            height: 2em;
            background: url("../layout/img/TWDB_logo_rev.svg");
            background-size: contain;
            background-repeat: no-repeat;
        }

    .host-logo #texas-flood-logo {
        width: 12.875em;
        height: 2em;
        background: url("../layout/img/TexasFlood_logo_rev.svg");
        background-size: cover;
    }

        .host-logo #texas-flood-logo:hover, .host-logo #texas-flood-logo:focus {
            width: 12.875em;
            height: 2em;
            background: url("../layout/img/TexasFlood_logo_rev.svg");
            background-size: cover;
        }

    .host-logo #wdi-logo {
        width: 7.194em;
        height: 2em;
        background: url("../layout/img/WaterDataInteractive_logo.svg");
        background-size: cover;
    }

        .host-logo #wdi-logo:hover, .host-logo #wdi-logo:focus {
            width: 7.194em;
            height: 2em;
            background: url("../layout/img/WaterDataInteractive_logo.svg");
            background-size: cover;
        }

    svg {
        display: none;
    }

        svg.icon {
            display: inline-block;
            width: 1em;
            height: 1em;
        }

        svg.icon-social-facebook, svg.icon-social-x, svg.icon-social-youtube, svg.icon-social-linkedIn, svg.icon-social-instagram {
            width: 2em;
            height: 2em;
        }

    img.banner {
        width: 100%;
        display: block;
        float: left;
        clear: both;
    }

    img.floatleft {
        margin: .625em .625em .625em 0;
        float: left;
    }

    img.floatright {
        margin: .625em 0 .625em .625em;
        float: right;
    }

    .socialmedia {
        list-style: none;
        margin: 0;
        padding: 0;
        float: left;
    }

        .socialmedia li {
            margin: .625em;
            position: relative;
            float: left;
        }

            .socialmedia li:first-child {
                margin-left: 0;
            }

            .socialmedia li .sr-only {
                display: none;
            }

            .socialmedia li a {
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
                filter: alpha(opacity=80);
                -moz-opacity: .8;
                -khtml-opacity: .8;
                opacity: .8;
                -webkit-transition: .2s;
                -moz-transition: .2s;
                transition: .2s;
                display: block;
                float: left;
            }

                .socialmedia li a:hover, .socialmedia li a:focus {
                    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
                    filter: alpha(opacity=100);
                    -moz-opacity: 1;
                    -khtml-opacity: 1;
                    opacity: 1;
                    background: transparent;
                }

    header .socialmedia {
        float: right;
    }

    @media screen and (max-width: 50em) {
        header .socialmedia {
            float: left;
            margin-left: 40px;
        }
    }

    footer .socialmedia {
        width: 100%;
        float: left;
    }

        footer .socialmedia a {
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
            filter: alpha(opacity=100);
            -moz-opacity: 1;
            -khtml-opacity: 1;
            opacity: 1;
        }

    #meso-map-viewer {
        width: 100%;
        display: block;
        text-decoration: none;
        float: left;
    }

        #meso-map-viewer img {
            margin: 0;
            padding: 0;
            max-width: 100%;
        }

    #meso-weather-status {
        width: 100%;
        float: left;
        margin-left: 0;
        margin-right: 0;
        background: #5275a0;
        float: left;
    }

        #meso-weather-status h3 {
            color: #FFF;
            font-size: 1.3rem;
            margin: .625em;
            float: left;
        }

            #meso-weather-status h3 small {
                color: #FFF;
                display: block;
                margin-top: .625em;
                font-weight: 400;
                font-size: 70%;
            }

                #meso-weather-status h3 small span {
                    border-right: solid 1px #FFF;
                    padding-left: 5px;
                    padding-right: 10px;
                }

                    #meso-weather-status h3 small span:first-child {
                        padding-left: 0;
                    }

                    #meso-weather-status h3 small span:last-child {
                        border-right: none;
                        padding-right: 0;
                    }

        #meso-weather-status .search-button {
            float: right;
            display: block;
            text-decoration: none;
            background: #f15a29;
            padding: 1.875em .625em;
            color: #FFF;
            -webkit-transition: .2s;
            -moz-transition: .2s;
            transition: .2s;
        }

            #meso-weather-status .search-button:hover, #meso-weather-status .search-button:focus {
                background: #d9400e;
            }

    @media screen and (max-width: 74.375em) {
        #meso-weather-status h3 {
            font-size: 1.1rem;
        }
    }

    @media screen and (max-width: 65.625em) {
        #meso-weather-status .search-button {
            padding: 1.5625em .3125em;
        }
    }

    @media screen and (max-width: 48em) {
        #meso-weather-status h3 {
            font-size: 1.4rem;
        }

        #meso-weather-status .search-button {
            padding: 1.875em .625em;
        }

    }

    @media screen and (max-width: 30em) {
        #meso-weather-status h3 {
            width: 100%;
            font-size: 1rem;
        }

            #meso-weather-status h3 small {
                font-size: 90%;
            }

        #meso-weather-status .search-button {
            float: left;
            padding: .5em .9375em;
            margin: .625em;
        }

    }

    @media screen and (max-width: 20em) {
        #meso-weather-status h3 small span {
            display: block;
            border-right: 0;
            padding: 0;
            margin-bottom: .5em;
        }
    }

    #meso-weather-forecast {
        width: 100%;
        float: left;
        margin-left: 0;
        margin-right: 0;
        background: #41556d;
        text-align: center;
        float: left;
    }

        #meso-weather-forecast ul {
            font-size: .8rem;
            list-style: none;
            color: #FFF;
            margin: 0;
            padding: 0;
            float: left;
        }

            #meso-weather-forecast ul li {
                width: 30.43478%;
                float: left;
                margin: .5em;
                line-height: 1.5;
                float: left;
            }

                #meso-weather-forecast ul li img {
                    margin: 0;
                    float: none !important;
                }

                #meso-weather-forecast ul li span {
                    display: block;
                    float: none;
                    text-align: center;
                    min-width: 150px;
                }

                #meso-weather-forecast ul li strong {
                    font-weight: bold;
                    display: block;
                }

        #meso-weather-forecast .more-forecast {
            padding: .1875em;
            margin: .5em;
            line-height: 0;
            display: inline-block;
            text-decoration: none;
            background: #5275a0;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            border-radius: 50%;
            -webkit-transition: .2s;
            -moz-transition: .2s;
            transition: .2s;
        }

            #meso-weather-forecast .more-forecast svg {
                width: 1.5625em;
                height: 1.5625em;
                display: cover;
                fill: #FFF;
            }

            #meso-weather-forecast .more-forecast:hover, #meso-weather-forecast .more-forecast:focus {
                background: #d9400e;
            }

    @media screen and (max-width: 64em) {
        #meso-weather-forecast ul li {
            margin: .3125em;
        }
        .site-navigation, .highlight-section {
            width: 98% !important;
        }
    }

    @media screen and (max-width: 48em) {
        #meso-weather-forecast ul li {
            margin: .5em;
        }
        .site-navigation, .highlight-section {
            width: 95% !important;
        }
    }

    @media screen and (max-width: 20em) {
        #meso-weather-forecast ul li {
            width: 100%;
            float: left;
            margin-left: 0;
            margin-right: 0;
            margin-bottom: .625em;
            text-align: left;
        }

            #meso-weather-forecast ul li img {
                float: left !important;
            }

            #meso-weather-forecast ul li span {
                padding-top: .125em;
                padding-right: .5em;
            }

        .site-navigation, .highlight-section {
            width: 95% !important;
        }

    }

    #meso-quicklinks {
        margin-top: 1.25em;
    }

        #meso-quicklinks ul {
            list-style: none;
            margin: 0;
            padding: 0;
            float: left;
        }

            #meso-quicklinks ul li {
                width: 47.82609%;
                float: left;
                margin-bottom: 1.25em;
                overflow: hidden;
                float: left;
            }

                #meso-quicklinks ul li:nth-child(even) {
                    width: 47.82609%;
                    float: right;
                    margin-bottom: 1.25em;
                }

                #meso-quicklinks ul li a {
                    width: 100%;
                    text-decoration: none;
                    float: left;
                    position: relative;
                }

                    #meso-quicklinks ul li a img {
                        width: 100%;
                        margin: 0;
                        padding: 0;
                        float: left;
                        -webkit-transition: 1s;
                        -moz-transition: 1s;
                        transition: 1s;
                    }

                    #meso-quicklinks ul li a span {
                        width: 100%;
                        color: #FFF;
                        background: #5275a0;
                        padding: .3125em;
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        -webkit-transition: .1s;
                        -moz-transition: .1s;
                        transition: .1s;
                    }

                    #meso-quicklinks ul li a:hover, #meso-quicklinks ul li a:focus {
                        text-decoration: underline;
                    }

                        #meso-quicklinks ul li a:hover img, #meso-quicklinks ul li a:focus img {
                            -moz-transform: scale(1.5);
                            -webkit-transform: scale(1.5);
                            transform: scale(1.5);
                        }

                        #meso-quicklinks ul li a:hover span, #meso-quicklinks ul li a:focus span {
                            background: #41556d;
                            visibility: visible;
                        }

    @media screen and (max-width: 30em) {
        #meso-quicklinks ul li {
            width: 100%;
            float: left;
            margin-left: 0;
            margin-right: 0;
        }

            #meso-quicklinks ul li:nth-child(even) {
                width: 100%;
                float: left;
                margin-left: 0;
                margin-right: 0;
            }


        .site-navigation, .highlight-section {
            width: 95% !important;
        }
    }

    @-moz-document url-prefix() {
        svg .icon;

{
    width: .625em;
    height: .9375em;
}

svg.icon.icon-external-file
{
    background: url("../img/symbols/external-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-pdf-file
{
    background: url("../img/symbols/pdf-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-powerpoint-file
{
    background: url("../img/symbols/powerpoint-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-word-file
{
    background: url("../img/symbols/word-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-excel-file
{
    background: url("../img/symbols/excel-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-xml-file
{
    background: url("../img/symbols/xml-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-zip-file
{
    background: url("../img/symbols/zip-file.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-cancel-circle
{
    background: url("../img/symbols/cancel-circle.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-arrow-down
{
    background: url("../img/symbols/arrow-down.svg") no-repeat 0 0;
    background-size: cover;
}

svg.icon.icon-social-facebook
{
    background: url("../img/symbols/social-facebook.svg") no-repeat 0 0;
    background-size: cover;
    width: 2em;
    height: 2.3em;
    margin-right: 0;
}

svg.icon.icon-social-x
{
    background: url("../img/symbols/social-twitter.svg") no-repeat 0 0;
    background-size: cover;
    width: 2em;
    height: 2.3em;
    margin-right: 0;
}

svg.icon.icon-social-linkedIn
{
    background: url("../img/symbols/social-linkedIn.svg") no-repeat 0 0;
    background-size: cover;
    width: 2em;
    height: 2.3em;
    margin-right: 0;
}

svg.icon.icon-social-youtube
{
    background: url("../img/symbols/social-youtube.svg") no-repeat 0 0;
    background-size: cover;
    width: 2em;
    height: 2.3em;
    margin-right: 0;
}

svg.icon.icon-social-instagram
{
    background: url("../img/symbols/social-instagram.svg") no-repeat 0 0;
    background-size: cover;
    width: 2em;
    height: 2.3em;
    margin-right: 0;
}

}
/*# sourceMappingURL=style.css.map */
.site-navigation .nav-menu li
{
    display: inline;
}

#DataRefreshed, #ClickToEnter {
    padding: 10px;
    margin-top: 0px !important;
    color: white;
    background-color: #2e3c4d !important;
    cursor: pointer;
}

.pull-right{
    float: right;
}

#DataRefreshed{
    text-align: center;
}


.highlight-section {
    text-align: center;
    color: #41556D;
    background-color: #eeeeee;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 0;
    margin-left: 10px;
    margin-right: -10px;
    font-size:.9em;
}

    .highlight-section a {
        color: #41556D;
        font-weight: 600;        
    }
    .highlight-section h5 a {
        color: #41556D;
        font-weight: 600;
        text-decoration: none;
    }

