/*******************/
/* Top-most header */
/*******************/

#nal_header-back {
    margin-top: -.5em;
    padding-top: 0;

    background: none repeat scroll 0 0 #fff;
}

#nal_header:after,
#footer_first:after,
#footer_second:after,
#footer:after {
    clear: both;
}
#nal_header:before,
#nal_header:after,
#footer_first:before,
#footer_first:after,
#footer_second:before,
#footer_second:after,
#footer:before,
#footer:after {
    display: table;

    content: '';
}

#nal_header {
    width: 100%;
    margin-top: .5em;
    padding-right: 0 !important;
    padding-left: 0 !important;
    background-color: #FFFFFF;
}

@media only screen and (min-width: 768px) and (max-width: 959px) {

    #nal_header {
        width: 95%;
        margin-left: 1%;
    }

    #sub-links, #sub-links a {
	border: none !important;
	background-color:#4f544f !important;
	color:#f2f2f2 !important;
   }


    #nal_header div {
        margin-bottom:5px;
    }

    header #advanced-form > p:nth-child(2),
    #site-title,
    #nal-logos,
    #search-container,
    #sub-nav-container,
    #header_logo_site_info,
    .header__secondary-menu {
        float: none !important;
        clear: both;

        width: 95%;

        text-align: left;
    }


}
@media only screen and (max-width: 767px) {
    #nal_header {
        width: 95%;
        margin-left: 1%;
    }

    #sub-links, #sub-links a {
	border: none !important;
	background-color:#4f544f !important;
	color:#f2f2f2 !important;
   }

    #nal_header div {
        margin-bottom:5px;
    }

    header #advanced-form > p:nth-child(2),
    #site-title,
    #nal-logos,
    #search-container,
    #sub-nav-container,
    #header_logo_site_info,
    .header__secondary-menu {
        float: none !important;
        clear: both;

        width: 95%;

        text-align: left;
    }

    header  #advanced-search {
        margin-left: -2em;
    }

    .breadcrumbs, #site-title {
        margin-left: 12px;
        margin-right: 12px;
    }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
    #nal_header {
        width: 95%;
        margin-left: 1%;
    }

    #sub-links, #sub-links a {
	border: none !important;
	background-color:#4f544f !important;
	color:#f2f2f2 !important;
   }

    #nal_header div {
        margin-bottom:5px;
    }

    .header__logo-image {
        margin-top:10px;
    }

    header #advanced-form > p:nth-child(2),
    #site-title,
    #nal-logos,
    #search-container,
    #sub-nav-container,
    #header_logo_site_info,
    .header__secondary-menu {
        float: none !important;
        clear: both;

        width: 95%;

        text-align: left;
    }

    header  #advanced-search {
        margin-left: -2em;
    }


    .breadcrumbs, #site-title {
        margin-left: 12px;
        margin-right: 12px;
    }
}


@media only screen and (max-width: 640px) {
    #nal_header {
        width: 95%;
        margin-left: 1%;
    }

    #sub-links, #sub-links a {
	border: none !important;
	background-color:##4f544f !important;
	color:#f2f2f2 !important;
   }

    #nal_header div {
        margin-bottom:5px;
    }

    .header__logo-image {
        margin-top:10px;
    }

    header #advanced-form > p:nth-child(2),
    #site-title,
    #nal-logos,
    #search-container,
    #sub-nav-container,
    #header_logo_site_info,
    .header__secondary-menu {
        float: none !important;
        clear: both;

        width: 95%;

        text-align: left;
    }

    header  #advanced-search {
        margin-left: -2em;
    }

    .breadcrumbs, #site-title {
        margin-left: 12px;
        margin-right: 12px;
    }
}


.header__logo-image {
    float: left;

    padding: 15px;

    vertical-align: bottom;
}

.header__name-and-slogan {
    margin-top: .625em;
}


.header__site-name {
    font-family: Helvetica, Arial;
    font-size: 16pt;
    font-weight: bold;
    font-variant: normal;
    line-height: 1em;

    margin-top: 0;
    padding-top: 30px;
    float: left;
    letter-spacing: 0;

    color: #5c5c5c !important;
}

.header__site-link:link,
.header__site-link:visited {
    text-decoration: none;

    color: #000;
}

.header__site-slogan a,
.header__site-slogan a:hover,
.header__site-slogan a:focus {
    text-decoration: none;
        color: #000;
}

.header__site-slogan
 {
    font-family: Helvetica, Arial;
    font-size: 14pt;
    font-weight: bold;
    font-variant: normal;
    line-height: 1.2em;
    float:left;
    margin: 0;
    padding-top: 10px;
    color: #000 !important;
}

.header__site-link:link,
.header__site-link:visited {
    text-decoration: none;

    color: #000;
}

#sub-links {
	font-family: 'Merriweather',Helvetica,Arial,sans-serif;
    font-size: 80%;

    float: right;

    max-width: 415px;

    text-align: justify;

    color: #f2f2f2;
    border: 2px solid #4f544f;
    background-color: #4f544f;
}



#sub-links li a {
    text-decoration: none;
    padding: 0px 0.15em;
    color: #fff;
}

#sub-links > ul > li {
    display: inline-block;

    width: auto;
    padding: 0 15px;

    border-right: 1px solid #fff;
}

#sub-links > ul > li:last-child {
    border-right: medium none;
}

@media only screen and (max-width: 640px) {
    #sub-links > ul > li {
        padding: 0 3px;
    }
}


#ask:after {
    content: ' a Question';
    padding-right:0.15em;
}

#contact:after {
    content: ' Us';
}

#visit:after {
    content: ' the Library';
}

.header__secondary-menu {
    float: right;
}

#sub-nav-container {
    font-family: Fjalla One;
    font-size: 1.1em;

    margin-top: .25em;

    text-align: right;
}

.clearfix:after {
    display: block;
    visibility: hidden;
    clear: both;

    height: 0;

    content: '.';
}

#sub-nav-container #sub-links ul {
    margin: 0;
    padding: 0;

    list-style: none outside none;
}

ul.inline {
    display: inline;

    padding: 0;
}

ul.inline li {
    display: inline;

    padding: 0 1em 0 0;

    list-style-type: none;
}