/*
 ------------------ Top Bar Navigation ------------------
*/
@media all and (max-width: 767px) {
    #header .top-bar ul {
        margin-top: 0px;
        margin-bottom: 0px;
    }
}

/*
 ------------------ Top Bar Navigation - System Nav ------------------
*/
@media all and (max-width: 767px) {
    #header .top-bar ul.system-nav {
        float: left;
    }
}

/*
 ------------------ Top Bar Navigation - Icon Nav ------------------
*/

@media all and (max-width: 767px) {
    #header .top-bar ul.icon-nav {
        float: right;
    }

    #header .top-bar ul.icon-nav li {
        float: left;
    }
}

/*
 ------------------ Header  ------------------
*/
@media all and (max-width: 1920px) {
    .logged-in #header #main-menu-navigation ul.system-nav {
        display: none;
    }

    .logged-in #main > .container .page-header {
        margin: 0px -20px 0px -20px;
    }

    .logged-in #header #header-logo-wrapper {
        width: auto;
        left: 85px;
        z-index: 2;
    }

    .logged-in #header #header-logo-wrapper img {
        margin: 0 0 0 0;
        width: auto;
        max-height: 100%;
    }

    .logged-in #header .top-bar {
        margin: 0 0 0 85px;
    }

    .logged-in #header .header-inner a.navbar-left {
        float: none !important;
        width: 175px;
        display: block;
        margin: 0px auto;
    }

    .logged-in #header .header-inner {
        padding: 10px 20px;
    }
}

@media all and (max-width: 767px) {
    #header .header-mobile-nav-toggle {
        padding: 10px 16px;
    }

    .page-header .page-header-mobile-break:after {
        clear: both;
        content: " ";
        display: block;
    }
}

@media all and (max-width: 600px) {

    #header #header-logo-wrapper {
        width: auto;
        left: 45px;
        z-index: 2;
    }

    #header .top-bar {
        margin: 0 0 0 45px;
    }

    #header .header-inner a.navbar-left {
        float: none !important;
        width: 125px;
        display: block;
        margin: 0px auto;
    }

    #header .header-mobile-nav-toggle {
        padding: 10px 16px;
    }

    #header .header-mobile-nav-toggle.open {
        left: -44px;
    }

    #header .header-mobile-nav-toggle > span {
        display: none;
    }
}

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

    .logged-in #header #header-logo-wrapper {
        left: 45px;
    }

    .logged-in #header .top-bar {
        margin: 0 0 0 35px;
    }
}

/*
 ------------------ Sidebar Navigation ------------------
*/

@media all and (min-width: 1921px) {
    .logged-in #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle {
        display: none;
    }
}

@media all and (max-width: 1920px) {
    .logged-in #header .header-mobile-nav-toggle {
        display: inline-block;
        z-index: 20;
        transition: left 0.3s linear;
        width: 85px;
        text-align: center;
    }

    .logged-in #sidebar-nav-wrapper {
        left: -221px;
        margin: 0px;
        transition: left 0.3s linear;
    }

    .logged-in #sidebar-nav-wrapper.open {
        left: 0px;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li {
        padding: 0px;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li a {
        padding-right: 13px;
        padding-bottom: 10px;
        padding-top: 10px;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle {
        background-color: #333;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle i.fa {
        padding-top: 3px;
        float: right;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle a:hover, #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle a:focus {
        background-color: #444;
    }

    .logged-in #sidebar-nav-wrapper > ul.nav li#main-navbar-toggle a {
        font-weight: bold;
        color: #FFFFFF;
        border: none;
    }
}

@media all and (max-width: 400px) {
    .logged-in #header .header-mobile-nav-toggle {
        width: 45px;
    }
}

/*
 ------------------ Main Container ------------------
*/
@media all and (max-width: 1920px) {
    .logged-in #main {
        border-left: 2px solid #FAF6EF;
        position: relative;
        width: auto;
        padding: 0px 0px 0px 0px;
        z-index: 1;
        transition: 0.3s margin linear;
    }

    .logged-in #main-wrapper #sidebar-nav-wrapper.open ~ #main {
        margin-left: 220px;
    }

    .logged-in #main > .container {
        padding: 0px 20px 45px 20px;
    }
}

@media all and (max-width: 1280px) {
    #main-wrapper #sidebar-nav-wrapper.open ~ #main {
        margin-left: 0;
    }
}

@media all and (max-width: 600px) {
    #main {
        border: none;
        padding: 0px 0px 0px 0px;
    }

    #main > .container {
        padding: 0px 10px 45px 10px;
    }

    #main > .container h1.page-header {
        font-size: 28px;
    }

    .logged-out #sidebar-nav-wrapper {
        display: none;
    }

}

@media all and (max-width: 400px) {
    #main > .container h1.page-header {
        font-size: 20px;
    }

    h1.page-header .header-button-wrap {
        display: block;
        text-align: center;
        margin-top: 3px;
    }

    h1.page-header .header-button-wrap .pull-right {
        display: inline-block;
    }

    #main h1.page-header .search-bar {
        max-width: unset;
        margin: 4px 0;
        width: 100%;
    }
}

/*
 ------------------ Breadcrumb Navigation ------------------
*/
@media all and (max-width: 600px) {
    #main .before-heading > .breadcrumb {
        margin: 0px 0px 15px 37px;
        padding: 10px 15px;
        border-radius: 0px;
    }
}

/*
 ------------------ Mobile device auto zoom fix ------------------
*/

/* prevent iphone from zooming in when filling out a form, like login or application */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    select,
    textarea,
    input,
    input:focus,
    input:hover {
        /* font-size: 16px !important;*/
    }
}