/* Responsive CSS For all Bootstrap Breakpoints */

/* Tablet & Mobile Devices ----------- */
@media
only screen and (max-width : 991px) {
    .subnav-wrapper {
	    position: relative;
	    margin-bottom: 20px;
	    display: inline-block;
    }
    .subnav-wrapper .trigger {
	    padding: 5px 43px 5px 13px;
	    color: #FFF;
	    position: relative;
	    cursor: pointer;
    }
    .subnav-wrapper .trigger:after {
	    position: absolute;
	    content: "\f107";
	    font-family: fontAwesome;
	    top: 3px;
	    right: 13px;
	    opacity: 0.6;
    }
    .subnav-wrapper .subnav {
	    display: none;
	    width: 100%;
	    position: absolute;
	    z-index: 100;
	    top: 100%;
	    border: none;
	    padding: 10px 0 0 0;
    }
    .subnav-wrapper .subnav > li.title {
	    margin: 0;
	    /*border-bottom: 2px solid #4d291b;*/
	    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+50,0.35+100 */
        background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.15) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.15) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.15) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }
    .subnav-wrapper .subnav > li.title > a {
	    color: #FFF;
	    text-transform: none;
	    font-weight: normal;
    }
}

/* XS - Extra Small Devices ----------- */
@media
only screen and (max-width : 767px) {
    /* Styles */
    #wrapper > .container { padding: 0; overflow-x: hidden; margin: 0; }
    .mobile-menu-button { font-size: 21px; color: #009297; position: relative; margin-top: -5px; }
    .mobile-menu-button:hover, .mobile-menu-button:focus, .mobile-menu-button:active { text-decoration: none; color: inherit; }

    #fws-logo { top: 35px; }
    #fws-logo img { width: 54px; }
    #site_header > section.top-bar { padding: 5px 15px !important; }
    #site_header .top-bar .search-form .form-control { max-width: 145px; }
    #site_header .top-bar .search-form .checkbox, #site_header .top-bar .search-form .form-group { display: inline-block; margin: 0; }
    #site_header .top-bar .organisation, #site_header .branding { padding-left: 80px !important; }
    #site_header .branding { padding-top: 10px; padding-bottom: 10px; }
    #site_header .branding .refuge h2 a { font-size: 22px; display: block; }
    #site_header .branding .refuge span { font-size: 12px; }

    .navbar:after, .navbar .navbar-nav > li.visit:after { display: none; }
    .navbar .navbar-nav { margin: 0; }
    .navbar .navbar-nav > li { padding: 10px 0; text-align: center; }
    .navbar .navbar-nav > li > a { line-height: 1; padding: 0; }
    .navbar .navbar-nav > li.visit { padding: 0; }
    .navbar .navbar-nav > li.visit > a { line-height: 30px; background: none; /*background-color: transparent; background-image: url(/images/layout/visit.png); background-repeat: no-repeat; background-position: center 10px !important; background-size: 20px 20px;*/ padding: 5px 0; color: #FFF !important; }
    .navbar .navbar-nav > li.visit > a:before { display: inline-block; content: ""; width: 20px; height: 20px; background-color: transparent; background-image: url(/nwrs/images/icons/visit.png); background-repeat: no-repeat; background-size: 20px 20px; position: relative; margin: -5px 5px 0 0; vertical-align: middle; }
    .navbar .navbar-nav > li:after,.navbar .navbar-nav > li.visit > a:after {
	    display: block;
	    position: absolute;
	    z-index: 1;
	    content: "";
	    width: 100%;
	    height: 100%;
	    left: 0;
	    top: 0;
	    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.3) 100%); /* FF3.6-15 */
	    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
	    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      pointer-events: none;
    }

    .navbar-nav > li > .dropdown-menu { width: 100%; min-width: 1px; position: relative; float: none; }
    .dropdown-menu .container-fluid, .dropdown-menu ul { padding: 0; text-align: center; }
    .dropdown-menu ul > li:last-child { border-bottom: solid 1px #179398; }
    .dropdown-menu > li > div > div > div:last-child > ul > li:last-child { border-bottom: none; }

    .navbar { display: none; }
    .home .navbar { padding-right: 0; position: relative; display: block; }
    .home-banner .banner-text { display: none; }

    #site_footer .footer-top ul { text-align: center; }
    #site_footer .footer-top ul > li:nth-child(1), #site_footer .footer-top ul > li:nth-child(2), #site_footer .footer-top ul > li:nth-child(3) { display: block; margin: 0 0 5px 0; padding: 0; border: none; }
    #site_footer .footer-bot { text-align: center; }
    #site_footer .footer-bot .bot-left { position: relative; left: 0; margin-bottom: 10px; }
    #site_footer .footer-bot .bot-left img { width: auto; float: none !important; margin: 0 10px; }
    #site_footer .footer-bot .bot-mid {	padding-left: 15px; }
    #site_footer .footer-bot h5 { margin: 5px 0; }
    #site_footer .footer-bot ul > li { margin: 5px 10px; }
    #site_footer .footer-bot .bot-right img { float: none; margin: 10px 0 0 0; }

    .main-content { padding-left: 15px; padding-right: 15px; }
    .body-content { padding-bottom: 0; }

    /*body:not(.home) .sidebar-top > li.follow-us, body:not(.home) .home .sidebar-top > li.follow-us { background: none; padding-top: 0; }*/
    .home .what-we-do, .home .featured-pages, .what-we-do, .featured-pages { background-image: none; padding-top: 0; padding-bottom: 0; }
    .what-we-do h3, .featured-pages h3 {
	    cursor: pointer;
	    background-image: url(/nwrs/images/layout/rightNav_devider.jpg);
        background-position: top center;
        background-repeat: no-repeat;
        background-size: 100% auto;
        padding-top: 18px;
	    padding-left: 45px;
	    padding-bottom: 15px;
	    margin-bottom: 0;
	    font-size: 12px;
	    color: #00787c;
	    position: relative;
    }
    .what-we-do h3:before, .featured-pages h3:before, .events-side h3:before {
	    display: inline-block;
	    position: absolute;
	    top: 15px;
	    left: 10px;
	    content: "\f13a";
	    font-family: fontAwesome;
	    font-size: 21px;
	    line-height: 1;
    }
    .what-we-do > ul, .featured-pages > ul {
	    display: none;
	    padding-bottom: 10px;
    }
    .what-we-do > ul > li, .featured-pages > ul > li {
        margin: 0 0 7px 0;
        padding: 0 0 0 45px;
    }
    .what-we-do > ul > li:last-child, .featured-pages > ul > li:last-child {
        margin-bottom: 0;
        padding-bottom: 7px;
    }
    .events-side h3 {
	    cursor: pointer;
	    background-image: url(/nwrs/images/layout/rightEvents_top.jpg);
        background-position: top center;
        background-repeat: no-repeat;
        background-size: 100% auto;
        padding-top: 18px;
	    padding-left: 67px;
	    padding-bottom: 15px;
	    margin-bottom: 0;
	    font-size: 12px;
	    color: #00787c;
	    position: relative;
    }
    .events-side h3:before {
	    left: 32px;
    }
    .events-side-list {
	    display: none;
    }
    .sidebar-promo {
	    display: none;
    }
    .sidebar .print-share {
	    padding-top: 20px;
	    padding-bottom: 20px;
	    background: none;
    }
    .events { margin-top: 0; }
    .media-banner {
	    margin-left: -15px;
	    margin-right: -15px;
    }
    .media-banner > .banner-text {
	    position: relative;
	    top: 100%;
    }
    .media-banner > .banner-text .media-link-list {
	    border-left: none;
	    border-top: solid 1px #515151;
	    padding: 10px 0 0 0;
    }
    .media-banner > .banner-text .media-link-list > li {
	    display: inline-block;
	    margin: 0 10px 0 0;
	    width: auto;
    }
    .map {
        padding-left: 15px;
        padding-right: 15px;
    }
    .page-photo-credits, .last-updated {
        position: relative;
        padding: 15px 15px 0 15px;
    }
    .subnav-wrapper { min-height: 1px !important; background: none !important; }
}

/* SM - Small Devices ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 991px) {
    /* Styles */
    #wrapper > .container { padding: 0 10px; overflow-x: hidden; }
    .home .navbar { padding-right: 0; width: 100%; bottom: 5%; }
    .dropdown-menu { min-width: 517px; }
    .home-banner .banner-text { top: 5%; }
    .sidebar-wrapper { padding-left: 25px; }
    #site_footer .footer-top ul > li { margin-right: 7px; padding-right: 7px; }
    #site_footer .footer-top ul > li > a { font-size: 14px; }
    #site_footer .footer-bot h5 { margin-right: 15px; }
    #site_footer .footer-bot .bot-right img { width: 32px; }
    #site_footer .footer-bot .bot-right h5 { margin-top: 1px; }
    .media-banner > .banner-text .media-link-list > li { width: 100%; }
    .subnav-wrapper { min-height: 1px !important; background: none !important; }
}

/* MD - Medium Devices ----------- */
@media only screen
and (min-width : 992px)
and (max-width : 1199px) {
    /* Styles */
    .main-content { padding-right: 35px; padding-left: 10px; }
    .subnav-wrapper .trigger { display: none; }
    .subnav-wrapper .subnav { display: block !important; }
    .dropdown-menu { min-width: 729px; }
}

/* LG - Large Devices */
@media
only screen and (min-width : 1200px) {
    /* Styles */
    .main-content { padding-right: 35px; padding-left: 10px; }
    .subnav-wrapper .trigger { display: none; }
    .subnav-wrapper .subnav { display: block !important; }
    .dropdown-menu { min-width: 751px; }
}

.navbar .navbar-nav > li.alerts { background: #92160d; }
.navbar .navbar-nav > li.alerts.hover > a { color: #FFF; opacity: 0.4; }