﻿


@media only screen and (max-width: 980px) {

    #FnlSubSiteHeader > .SubSiteHeader,
    #FnlSubSiteNavigation ul,
    #FnlSubSitePage > .InnerPage > .PageContainer {
        width: auto;
        max-width: 740px;
    }

    #FnlSubSiteHeader > .Banner > nav > ul {
        left: 165px;
    }

        #FnlSubSiteHeader > .Banner > nav > ul > li {
            margin: 0px 0px 0px 30px;
        }

    .eResources .MultiSearchWrap {
        height: auto;
        padding-bottom: 12px;
    }

    .LibHolidays,
    .LibHours {
        float: none;
        width: auto;
    }

    #SwitchToDesktop {
        display: inline-block;
    }

    #FeatureOuter {
        float: none;
        width: auto;
    }

    #FeatureSlideWrap {
        height: auto;
    }

    .QuickButtonsWrap {
        float: right;
        width: 250px;
        height: 47px;
    }

        .QuickButtonsWrap a.FnlInputButtonLink {
            width: 120px;
            /*float: left;*/
            display: inline-block;
        }

            .QuickButtonsWrap a.FnlInputButtonLink.LinkContactUs {
                height: 46px;
                line-height: 46px;
            }

    .HourInfoWrap {
        margin-left: 0;
        width: 410px;
        height: 16px;
        padding: 16px 20px;
    }

        .HourInfoWrap .OpenStatus {
            width: auto;
            display: inline-block;
        }

            .HourInfoWrap .OpenStatus span {
                display: inline-block;
            }

        .HourInfoWrap a.HoursMoreInfo {
            float: right;
            position: static;
            border: 0;
            background: transparent;
            width: auto;
        }

        .HourInfoWrap .OpenStatusMsg,
        .HourInfoWrap a.HoursMoreInfo {
            padding: 0;
            margin: 0;
            line-height: 14px;
        }

    .MultiSearchWrap {
        margin-bottom: 10px;
    }

    .FeatureRowWrap {
        margin-top: 10px;
    }

    .FeatureAsideWrap.BucketBlock {
        float: none;
        width: auto;
        margin-left: 0;
        margin-top: 10px;
    }

    .TileLinks ul li {
        width: 71px;
        height: 71px;
    }

        .TileLinks ul li a {
            width: 57px;
            height: 57px;
            line-height: 57px;
        }

            .TileLinks ul li a span {
                font-size: 12px;
            }
}
/** END SCREEN MAX 980px **/

@media only screen and (max-width: 760px) {

    #FnlSubSiteHeader > .SubSiteHeader,
    #FnlSubSiteNavigation ul,
    #FnlSubSitePage > .InnerPage > .PageContainer {
        width: auto;
        max-width: 580px;
    }

    .SearchRadioFilters > ul li {
        float: none;
        display: block;
    }

    .MultiSearchWrap fieldset.FnlFieldSet ol.InputFields > li.SearchLinks > a {
        margin: 0 0 5px;
        padding: 0;
        border: 0 !important;
        float: none !important;
        display: block;
    }

    .TwoColBlock > *,
    ul.TwoColList {
        float: none;
        width: auto;
        margin: 0;
    }

    .BucketBlock {
        width: 100%;
    }

    .TileLinks ul li {
        width: 32%;
        height: 96px;
        margin: 0 2% 10px 0;
    }

        .TileLinks ul li:nth-child(3n) {
            margin-right: 0;
        }

        .TileLinks ul li a {
            width: auto;
            height: 82px;
            line-height: 82px;
        }

            .TileLinks ul li a span {
                font-size: 14px;
            }


    .HourInfoWrap {
        width: 295px;
    }

    .QuickButtonsWrap {
        width: 208px;
    }

        .QuickButtonsWrap a.FnlInputButtonLink {
            width: 100px;
        }

    .galleria-info {
        display: none !important;
    }

    #FeatureOuter {
        border: 1px solid #fae2a4;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    #ExternalCaptions {
        display: block;
    }

    .galleria-stage, .galleria-images,
    .galleria-images .galleria-image {
        -webkit-border-bottom-right-radius: 0px !important;
        -webkit-border-bottom-left-radius: 0px !important;
        -moz-border-radius-bottomright: 0px !important;
        -moz-border-radius-bottomleft: 0px !important;
        border-bottom-right-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }

    .galleria-image img {
        -webkit-border-bottom-right-radius: 0px !important;
        -webkit-border-bottom-left-radius: 0px !important;
        -moz-border-radius-bottomright: 0px !important;
        -moz-border-radius-bottomleft: 0px !important;
        border-bottom-right-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }

    .galleria-stage {
        border: 0;
        border-bottom: 1px solid #fae2a4;
    }





    #FnlSubSitePage nav.BreadCrumbs {
        margin-bottom: 15px;
        float: none;
    }

    #FnlSubSitePage .FnlWelcomeMessage {
        float: none;
        padding-left: 0;
        display: inline-block;
    }
}
/** END SCREEN MAX 760px **/

@media only screen and (max-width: 600px) {
    /********************************************************************************** 
        GENERAL 
        switch to single column everything
        everything stacks
        secondary nav moves to the bottom of the page
        remove background images and colors
    **********************************************************************************/
    #FnlSubSitePage > .InnerPage {
        background: #ffffff none;
    }

        #FnlSubSitePage > .InnerPage > .PageContainer {
            margin: 0;
            padding-top: 0;
            padding-left: 0;
            background: transparent none;
        }


        #FnlSubSitePage > .InnerPage #FnlSubSiteMain {
            background: transparent none;
            display: block;
            height: auto;
            box-sizing: border-box;
        }

    #FnlSubSiteSideBar {
        position: relative;
        width: 100%;
        float: none;
        min-height: 330px;
        margin: 0;
        padding: 0;
        background: none;
        display: block;
        min-width: unset;
        height: auto;
    }

        #FnlSubSiteSideBar > div.QuickLinksNav {
            width: 100%;
        }


    .MultiSearchWrap fieldset.FnlFieldSet ol.InputFields > li.SearchLinks > a {
        margin: 0 0 5px;
        padding: 0;
        border: 0;
    }



    #FnlSubSiteHeader {
        background: transparent url("../Media/Images/MobiSubSiteHeader.png") repeat-x left top;
    }

        #FnlSubSiteHeader > .Banner {
            background: transparent url("../Media/Images/MobiBannerBg.png") no-repeat left top;
        }

            #FnlSubSiteHeader > .Banner > nav {
                display: none;
            }

            #FnlSubSiteHeader > .Banner a.NciLogo {
                left: 12px;
            }

            #FnlSubSiteHeader > .Banner a.NcifLogo {
                position: absolute;
                top: 12px;
                right: 12px;
                width: auto;
                height: auto;
                background: transparent none;
                padding: 0;
            }

        #FnlSubSiteHeader > .SubSiteHeader {
            min-height: 48px;
        }

            #FnlSubSiteHeader > .SubSiteHeader > a.LogoLink {
                display: inline-block;
                position: relative;
                float: left;
                height: 47px;
                width: 72px;
                margin-right: 10px;
                background: transparent url("../Media/Images/MobiBanner.png") no-repeat left top;
            }

            #FnlSubSiteHeader > .SubSiteHeader > h1 {
                padding-top: 11px;
                margin-top: 0px;
                font-size: 21px;
            }

            #FnlSubSiteHeader > .SubSiteHeader > h2 a {
                display: none;
            }

            #FnlSubSiteHeader > .SubSiteHeader > a > img {
                position: absolute;
                left: -9000px;
            }

    #FnlSubSiteSideBar nav.SideNavigation > ul > li {
        border-top: none;
    }

    #FnlSubSiteSideNavigation {
        height: auto;
        overflow: auto;
        display: none;
        background: #E6EBEE;
        margin: 0;
    }


    #FnlSubSiteSideBar nav.SideNavigation > ul {
        margin: 0;
    }

    #FnlSubSiteSideNavigation ul > li {
        display: block;
        margin: 0;
        padding: 0;
        border-right: 0;
        border-bottom: 1px solid #c8d3da;
        border-top: none;
        overflow: auto;
        word-spacing: -5px;
        zoom: 1;
    }

    #FnlSubSiteSideBar {
        min-height: 0;
    }

        #FnlSubSiteSideBar nav.SideNavigation > ul > li.Alternate {
            background: none;
        }

    #FnlSubSiteSideNavigation ul > li > a {
        display: block;
        height: 16px;
        padding: 6px 8px 6px 8px;
        color: #595B70;
        text-decoration: none;
        word-spacing: 0px;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
    }

        #FnlSubSiteSideNavigation ul > li > a:hover {
            background: #cde1e8;
        }

    #FnlSubSiteSideNavigation ul > li:first-child > a,
    #FnlSubSiteSideNavigation ul > li:first-child > a:first-child {
        border: 0;
    }

    #FnlSubSiteHeader > .SubSiteHeader > #BannerBtns {
        display: block !important;
        position: absolute;
        right: 12px;
        top: 10px;
    }

    .RowWrap #QuickButtonsWrap {
        display: none;
    }

    #BannerBtns .QuickButtonsWrap {
        height: auto;
        width: auto;
        margin: 0;
    }

        #BannerBtns .QuickButtonsWrap a.FnlInputButtonLink,
        #BannerBtns > a#MainMenuToggleBtn {
            text-indent: -9000px;
            padding: 0;
            display: block;
            text-align: center;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            margin: 0 5px 0 0;
            float: right;
        }

    #BannerBtns > a#MainMenuToggleBtn {
        height: 26px;
        width: 26px;
        margin: 0;
        border: 1px solid #00597B;
        background-image: linear-gradient(to bottom, #4c8aa2, #196988);
        background-color: #196988;
        background-repeat: repeat;
        background-attachment: scroll;
        filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#4c8aa2', endColorstr='#196988', gradientType='0');
    }

        #BannerBtns > a#MainMenuToggleBtn:hover {
            background-image: linear-gradient(to bottom, #327a95, #00597b);
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#327a95', endColorstr='#00597b', gradientType='0');
        }

        #BannerBtns > a#MainMenuToggleBtn:active {
            background-image: linear-gradient(to bottom, #00597b, #327a95);
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#00597b', endColorstr='#327a95', gradientType='0');
        }

        #BannerBtns > a#MainMenuToggleBtn span {
            display: block;
            height: 100%;
            width: 100%;
            background: transparent url('../Media/Images/Icons/ChickletIcons.png') no-repeat center 5px;
        }

    .QuickButtonsWrap a.FnlInputButtonLink.LinkContactUs {
        background-position: 0% 0%;
        border: 1px solid #b6cdd7;
        color: #5384a2;
        margin: 0 0 10px 0;
        background-image: linear-gradient(to bottom, #e6f2f7, #cde2ec);
        background-color: #d6e8f1;
        background-repeat: repeat;
        background-attachment: scroll;
        filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#e6f2f7', endColorstr='#cde2ec', gradientType='0');
        line-height: 24px;
        height: 26px;
        width: 26px;
        text-indent: -9000px;
    }

        .QuickButtonsWrap a.FnlInputButtonLink.LinkContactUs:hover {
            background-position: 0% 0%;
            background-image: linear-gradient(to bottom, #d9e8ef, #c3dae6);
            background-color: #c7dae3;
            background-repeat: repeat;
            background-attachment: scroll;
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#d9e8ef', endColorstr='#c3dae6', gradientType='0');
        }

        .QuickButtonsWrap a.FnlInputButtonLink.LinkContactUs:active {
            background-position: 0% 0%;
            background-image: linear-gradient(to bottom, #c4d7e0, #c3dae6);
            background-color: #c4d7e0;
            background-repeat: repeat;
            background-attachment: scroll;
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#c4d7e0', endColorstr='#c3dae6', gradientType='0');
        }

        .QuickButtonsWrap a.FnlInputButtonLink.LinkContactUs span:first-child {
            display: block;
            height: 100%;
            width: 100%;
            background: transparent url('../Media/Images/Icons/ChickletIcons.png') no-repeat center -95px;
        }

    .QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount {
        background-position: 0% 0%;
        border: 1px solid #1a6388;
        color: #ffffff;
        background-image: linear-gradient(to bottom, #358cb7, #02689a);
        background-color: #1675a5;
        background-repeat: repeat;
        background-attachment: scroll;
        filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#358cb7', endColorstr='#02689a', gradientType='0');
        line-height: 1em;
        padding: 8px 0 10px;
        height: 26px;
        width: 26px;
        text-indent: -9000px;
    }


        .QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount:hover {
            background-position: 0% 0%;
            background-image: linear-gradient(to bottom, #2e7fa7, #005f8f);
            background-color: #086c9d;
            background-repeat: repeat;
            background-attachment: scroll;
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#2e7fa7', endColorstr='#2e7fa7', gradientType='0');
        }

        .QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount:active {
            background-position: 0% 0%;
            background-image: linear-gradient(to bottom, #277196, #005f8f);
            background-color: #096391;
            background-repeat: repeat;
            background-attachment: scroll;
            filter: progId:DXImageTransform.Microsoft.gradient(startColorstr='#277196', endColorstr='#005f8f', gradientType='0');
        }

        .QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount span:first-child {
            display: block;
            height: 100%;
            width: 100%;
            background: transparent url('../Media/Images/Icons/ChickletIcons.png') no-repeat center -47px;
        }

    /*.QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount span {
				display: block;
			}

				.QuickButtonsWrap a.FnlInputButtonLink.LinkMyAccount span.MyAccountText {
					font-size: 10px;
				}*/
    .HourInfoWrap {
        width: auto;
        float: none;
        padding: 8px;
    }
}
/** END SCREEN MAX 600px **/

/**START SCREEN MAX 465*/

@media only screen and (max-width:400px) {

    .ActionItems .LastAction {
        float: none;
        margin-top: 15px;
    }
}
/**END SCREEN MAX 465*/
