<!--
/********** Begin Core Style Sheet - Do Not Modify!!! **********/
/********** Begin Core Style Sheet - Do Not Modify!!! **********/
html, body {
    width: 100%;
}

body {
    background: #003c79 url(../images_template/bg.gif) no-repeat center center fixed;
    background-size: cover;
    font-family: Arial, Helvetica, sans-serif;
    margin: 36px 0 0 0;
    font-size: 12px;
    font-weight: normal;
    color: #092667;
    border: 0px solid #cccccc;
    line-height: normal;
}

a, a:hover {
    text-decoration: none;
}


#maindiv {
    width: 978px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    border: 0px solid #cccccc;
    background-color: #ffffff;
    font-size: 100%;
    font-weight: normal;
    color: #092667;
}

#header {
    width: 978px; /* should be 978px MAX - set to 984 for design purposes */
    height: 87px;
    border: 0px solid #cccccc;
    box-sizing: initial;
}

    #header span {
        position: absolute;
        width: 978px;
        height: 87px;
        background: #ffffff url(../images_template/header_noaa.gif) no-repeat;
    }

#left-side {
    width: 185px;
    float: left;
    border: 0px solid #cccccc;
    background: #ffffff url(../images_template/searchbar_curve.gif) no-repeat top;
    padding: 57px 12px 0 0;
}

#center {
    width: 584px;
    float: left;
    padding: 0;
    margin: 25px 0;
    border: 0px solid #cccccc;
}

#right-side {
    width: 185px;
    float: right;
    padding-left: 12px;
    border: 0px solid #cccccc;
}

#wide {
    width: 750px;
    float: left;
    padding: 0;
    margin: 25px 0;
    border: 0px solid #cccccc;
}

#ultrawide {
    width: 940px;
    margin: 25px auto;
    border: 0px solid #cccccc;
}

.search {
    width: 978px;
    height: 45px;
    background-color: #00968a;
    clear: both; /* ignored at header */
    position: relative;
}

#footer {
    width: 978px; /* should be 978px MAX - set to 984 for design purposes */
    height: 145px;
    padding: 0;
    margin: 0;
    border: 0px solid #cccccc;
    background-color: #092866;
    position: relative;
}
/********** End Core Style Sheet **********/
/********** End Core Style Sheet **********/


/********** Begin Style Sheet **********/
/********** Begin Style Sheet **********/
#noaa, #right-side span, #footer-divider, #footer-logos, #header, #header span, #noaa-navspace, #noaa-float, #feature-base {
    display: block;
}

.search, .scroller, .footer-links-pad, .footer-links, .feature-main, .contact-info a {
    display: block;
}

.noaa-title, nmfs-title {
    position: absolute;
    top: -1000px;
}

h1 {
    margin: 10px 0 15px 0;
    color: #003c79;
    font-size: 150%;
}

h2, h3, h4, h5, h6 {
    color: #003c79;
    margin: 20px 0 5px 0;
}

h2 {
    font-size: 130%;
}

h3 {
    font-size: 110%;
}

h4 {
    font-size: 100%;
    color: #3069aa;
}

h5 {
    font-size: 100%;
    font-weight: normal;
    color: #3069aa;
    text-decoration: underline;
}

h6 {
    font-size: 100%;
    font-weight: normal;
    color: #3069aa;
}


.sidenav h4 { /* side column titles */
    font-size: 14px;
    padding: 0 8px;
    margin-bottom: 5px;
    margin-top: 0;
    top: -20px;
    position: absolute;
    color: #092667;
}

p {
    margin: 10px 0;
    padding: 0;
}

#center a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #ff0000;
}

    #center a:hover {
        color: #0033ff;
    }

#explore {
    padding: 21px 12px 20px 12px;
    display: block;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #ffe090;
    background-color: #003c79;
}

.inline-list ul {
    text-align: center;
    padding: 0;
    margin: 0;
}

    .inline-list ul li {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 11px;
        font-weight: bold;
        color: #0033CC;
        display: inline;
        border: 0px solid #cccccc;
    }

#noaa-navspace {
    position: absolute;
    width: 978px; /* should be 978px MAX - set to 984 for design purposes */
    padding-top: 36px;
    height: 35px;
    top: -36px;
    background-color: #003c79;
    border: 0px solid #cccccc;
}

#noaa-nav {
    position: absolute;
    width: 800px;
    top: -25px;
    left: 90px;
    border: 0px solid #cccccc;
}

#SWFSCLoginBtn {
    position: absolute;
    top: -30px;
    right: 5px;
}

#noaa-float {
    position: absolute;
    width: 114px;
    height: 355px;
    top: -36px;
    left: 978px;
    border: 0px solid #cccccc;
    background-image: url(/images_template/noaa.gif);
}

#noaa-nav a {
    color: #ffffff;
    text-decoration: none;
    margin: 9px;
    padding: 0;
    font-size: 100%;
}

    #noaa-nav a:hover {
        color: #ffe090;
        text-decoration: none;
    }


/* begin level 5 navigation */
#levelfive-nav {
    width: 554px; /* max width 554 pixels */
    text-align: center;
    padding: 15px;
    border: 0px solid #cccccc;
}

    #levelfive-nav ul li {
        color: #2863a7;
        font-size: 100%;
        margin: 0 6px 0 6px;
    }
/* end level 5 navigation */


.searchfield {
    position: absolute;
    top: 9px;
    left: 250px;
    width: 600px;
    z-index: 9000;
}

.search-title {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #ffffff;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

.search-content {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #666666;
}

#hp-hotissues {
    font-family: Arial, Helvetica, sans-serif;
    margin: 220px 5px 45px 0px;
    font-size: 100%;
    font-weight: normal;
    color: #092667;
}

    #hp-hotissues a {
        font-family: Arial, Helvetica, sans-serif;
        color: #00968a;
        font-weight: normal;
        font-size: 12px;
        text-decoration: none;
        padding: 0;
    }

        #hp-hotissues a:hover {
            color: #2863a7;
            text-decoration: none;
        }

.scroller {
    position: absolute;
    width: 184px;
    height: 34px;
    left: 615px;
    top: 315px;
}

#scroller1 {
    z-index: 9999 !important;
}

#scroller2 {
    z-index: 9998 !important;
}

#scroller3 {
    z-index: 9997 !important;
}

#scroller4 {
    z-index: 9996 !important;
}

#scroller5 {
    z-index: 9995 !important;
}

#scroller6 {
    z-index: 9994 !important;
}


#noaa {
    position: absolute;
    background-image: url('/images_template/noaa.gif');
    top: -4px;
    left: 979px;
    width: 111px;
    height: 321px;
}

.contact-info {
    margin-top: 10px;
}

    .contact-info a {
        background: url('../images_template/button_selected.jpg');
        width: 172px;
        height: 26px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 11px;
        font-weight: bold;
        color: #ffffff;
        text-decoration: none;
        padding: 8px 5px 0 8px;
    }

        .contact-info a:hover {
            color: #ffe090;
        }

.sidenav {
    background-color: #A7DAF5;
    padding: 8px 8px 8px 0;
    margin-bottom: 12px;
    margin-top: 50px;
    position: relative;
}

    .sidenav ul {
        margin-top: 4px;
        margin-bottom: 4px;
    }

        .sidenav ul li {
            color: #2863a7;
            list-style-position: outside;
            list-style-type: square;
            margin-left: -15px;
            font-weight: bold;
            padding: 3px 0;
            font-size: 90%;
        }

            .sidenav ul li a {
                text-decoration: none;
                color: #003c79;
            }

                .sidenav ul li a:hover {
                    color: #2863a7;
                    text-decoration: none;
                }

    .sidenav p {
        padding: 0 10px;
        font-size: 11px;
    }

        .sidenav p a {
            color: #003c79;
        }

.feature {
    margin-top: 10px;
    margin-bottom: 20px;
}

    .feature p {
        color: #000066;
        padding-left: 14px;
        margin-right: 6px;
        font-size: 11px;
    }

    .feature p {
        color: #000066;
        padding: 0 10px;
        font-size: 11px;
    }

        .feature p a {
            color: #1c5ba2;
            font-weight: bold;
            text-decoration: none;
            background: url('/images_template/link_bluedot.gif') repeat-x;
        }

            .feature p a:hover {
                text-decoration: underline;
            }

    .feature ul li {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 11px;
        font-weight: normal;
        color: #092866;
        list-style-position: outside;
        list-style-type: square;
        margin-left: -10px;
    }

.feature-main {
    position: absolute;
    width: 200px;
    height: 152px;
    left: 197px;
    top: 132px;
}

#feature-base {
    position: absolute;
    width: 584px;
    height: 217px;
    left: 197px;
    top: 132px;
    z-index: 1;
    background-color: #2863a7;
    border: 0px none #ffffff;
}

.blue {
    background-color: #a7daf5;
}
/* sidenav bg colors */
.green {
    background-color: #00d4c3;
}
/* sidenav bg colors */

.search-field {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    vertical-align: middle;
    padding: 3px;
    margin: 0;
}

.radio-button {
    vertical-align: middle;
    padding-right: 2px;
}

.button-go {
    vertical-align: middle;
    margin-right: 10px;
}

#search-curve {
    position: absolute;
    left: -53px;
    top: 36px;
    width: 400px;
    height: 15px;
    z-index: 10;
}

#center a, #wide a, #ultrawide a {
    font-family: Arial, Helvetica, sans-serif;
    color: #00968a;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none;
}

    #center a:hover, #wide a:hover, #ultrawide a:hover {
        color: #00968a;
        text-decoration: underline;
    }

#wide p, #ultrawide p {
    font-family: Arial, Helvetica, sans-serif;
    color: #092667;
    font-weight: normal;
    font-size: 12px;
}

#footer a:hover {
    color: #ffe090;
}

#footer-spacer {
    width: 35px;
    display: block;
    float: left;
}

.footer-links-pad {
    float: left;
    width: auto;
    height: auto;
    padding: 0 10px 10px 0px;
    min-width: 110px;
}

.footer-links {
    float: left;
    width: auto;
    height: auto;
    padding: 0 10px 10px 20px;
}

#footer1, #footer2 {
    display: inline-block;
    width: 380px;
    margin-left: 50px;
}

#footer2 {
    width: 200px;
}

    .footer h4, #footer1 h4, #footer2 h4 {
        font-size: 100%;
        color: #a7daf5;
        padding: 0;
        margin: 15px 0 0 8px;
    }

#footer ul {
    list-style: none;
    padding: 10px 8px;
    margin: 0;
}

#footer a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: normal;
    color: #ffffff;
    text-decoration: none;
}

    #footer a:hover {
        color: #ffe090;
    }

#footer-divider, #footer-spacer, #footer-logos, .footer-links-pad, .footer-links {
    border: 1px solid #092866; /* blend in color #092866 */
}

#footer-divider {
    float: left;
    width: 18px;
    height: auto;
    padding: 30px 0 10px 0;
}

#footer-logos {
    float: right; /* float right if footer column 1 is used */
    width: auto;
    text-align: left;
    padding-right: 50px;
}
/********** End Style Sheet **********/
/********** End Style Sheet **********/

/********** Begin Added Style Sheet **********/
/********** Begin Added Style Sheet **********/
.announcement {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000;
    font-weight: bold;
}

a.announcement:visited {
    color: #999;
}
/********** End Added Style Sheet **********/
/********** End Added Style Sheet **********/

/********** Begin Section 508 Style Sheet **********/
/********** Begin Section 508 Style Sheet **********/
.skip a, .skip a:hover, .skip a:visited {
    position: absolute;
    left: 0px;
    top: -1000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

    .skip a:active, .skip a:focus {
        position: static;
        width: auto;
        height: auto;
    }
/********** End Section 508 Style Sheet **********/
/********** End Section 508 Style Sheet **********/

/********** New Editions ************************/
.image_box {
    width: 300px;
    padding: 10px;
    border: 1px solid #ddd;
    float: right;
    margin: 0 0 10px 20px;
}

    .image_box img {
        display: block;
    }

    .image_box span {
        text-align: center;
        font-size: 75%;
    }


.headerStreachArea {
    display: none;
}

#footer, #header, #noaa-navspace {
    width: auto;
}

#noaa-navspace {
    background-color: white;
}

    #noaa-navspace img {
        padding-right: 0;
    }

#noaa-nav a {
    color: #003C79;
}

    #noaa-nav a:hover {
        color: #0079F3;
    }