﻿.fixed-navbar #header {
    z-index: 10000;
}

.header-link.hide-menu {
    display: none;
}

.top-tab-menu li.active > a,
.top-tab-menu li.active > a:visited,
.top-tab-menu li.active > a:hover,
.current-menu-section-header {
    font-weight: normal;
    color: #555 !important;
}

.top-menu .mobile-navbar.static-navbar {
    position: static;
}

.top-menu .mobile-navbar .navbar-nav,
.top-menu .global-search-mobile {
    border-bottom: none;
}

.top-menu .mobile-navbar .navbar-nav > li {
    height: auto;
}

.top-tab-menu .dropdown-menu a,
.top-tab-menu .dropdown-menu a:hover,
.top-tab-menu .dropdown-menu a:visited,
.top-tab-menu .dropdown-menu a:focus,
.top-tab-menu .sub-nav a,
.top-tab-menu .sub-nav a:hover,
.top-tab-menu .sub-nav a:visited,
.top-tab-menu .sub-nav a:focus {
    color: #555 !important;
    background-color: transparent;
}

.top-tab-menu .dropdown-menu a:hover {
    text-decoration: underline;
}

.mega-mobile-menu-open {
    overflow: hidden;
    position:fixed;
}

.mega-mobile-menu-open .mobile-menu-toggle.mega-menu-mobile-toggle i.pe-7s-menu:before {
    content: "\e681";
}

.top-tab-menu .dropdown-submenu {
    position: relative;
}

@media all and (min-width:769px) {
    .top-tab-menu .dropdown-submenu > a:after {
        display: block;
        content: " ";
        float: right;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #ccc;
        margin-top: 5px;
        margin-right: -10px;
    }

    .top-tab-menu .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -6px;
        margin-left: -1px;
        -webkit-border-radius: 0 6px 6px 6px;
        -moz-border-radius: 0 6px 6px;
        border-radius: 0 6px 6px 6px;
    }
}

.compact-mode-enabled {
    display: none;
}

.compact-mode-disabled {
    display: inline;
}

@media all and (max-width:350px) {
    #header #logo {
        max-width: 170px;
        width: 49%;
    }

    #header #logo img {
        margin-top: 5px;
    }
}

@media all and (max-width:600px) {
    .top-tab-menu .compact-mode-item {
        display: none;
    }
}

@media all and (max-width:768px) {
    .wclc-app-image-replacement {
        content:url(../img/wclcHeader-img-only.png);
        width: 112px !important;
        height: 103px !important;
    }

    .top-tab-menu.mega-mobile-navbar {
        position: absolute;
        top:57px;
        background-color: #fff;
        width: 100%;
    }

    .top-tab-menu .dropdown-menu a,
    .top-tab-menu .dropdown-menu a:hover,
    .top-tab-menu .dropdown-menu a:visited,
    .top-tab-menu .dropdown-menu a:focus,
    .top-tab-menu .sub-nav a,
    .top-tab-menu .sub-nav a:hover,
    .top-tab-menu .sub-nav a:visited,
    .top-tab-menu .sub-nav a:focus {
        color: #555 !important;
        text-decoration: none;
    }

    .mega-menu-mobile-toggle {
        display: block;
    }

    /*.header-link {
        float: none;
        border-bottom: solid 1px #ddd;
    }*/

    .top-tab-menu .navbar-nav {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .top-tab-menu .navbar-nav > li, .navbar-nav > li > a {
        height: auto !important;
    }
    
    .small-logo {
        display: none;
    }
    /*.top-menu .mobile-menu {
        display: none;
    }*/

    .top-menu .mobile-menu .mobile-menu-toggle {
        display: none;
    }

    .top-tab-menu.navbar-left {
        /*display: block;*/
    }

    .top-tab-menu.navbar-left,
    .top-tab-menu .nav.navbar-nav,
    .top-tab-menu .nav.navbar-nav > .dropdown {
        float: none !important;
    }

    .top-tab-menu .container {
        width: auto;
    }

    .top-tab-menu .dropdown .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        height: auto !important;
    }

    .navbar-left.top-tab-menu.show-top-mobile-menu {
        display: block;
    }

    .mega-menu-content .mega-menu-block {
        width: 100% !important;
    }

    .top-tab-menu .nav.navbar-nav {
        overflow-y: auto;
        max-height: 400px;
        margin: 0px;
    }

    .top-tab-menu .navbar-nav > li > a:before,
    .top-tab-menu .sub-nav > a.mega-section-header:before,
    .top-tab-menu .dropdown-submenu > a.dropdown-toggle:before
    {
        font-family: 'FontAwesome';
        content: "\f105";
        float: right;
        font-size: 16px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .top-tab-menu .navbar-nav > li.open > a:before,
    .top-tab-menu .sub-nav.open > a.mega-section-header:before,
    .top-tab-menu .dropdown-submenu.open > a.dropdown-toggle:before {
        content: "\f107";
    }

    .top-tab-menu li.dropdown-submenu > a {
        padding-right: 0px;
    }

    .top-tab-menu li.dropdown-submenu > .dropdown-menu li a {
        padding-left: 40px;
    }

    .sub-nav-menu {
        display: none;
    }

    .sub-nav.open > .sub-nav-menu {
        display: block;
    }

    .top-tab-menu > ul > li > a, 
    .top-tab-menu > ul > li > a:visited, 
    .top-tab-menu > ul > li > a:hover {
        padding: 15px 10px !important;
    }

    /* for the static positioned menu */
    /*.top-tab-menu > ul > li:not(:first-child),*/
    .top-menu #mobile-collapse-help ul > li:not(:first-child) {
        border-top: solid 1px #ddd;
    }

    /* for the absolute positioned menu */
    .top-tab-menu > ul > li {
        border-bottom: solid 1px #ddd;
    }

    .top-tab-menu > ul > li.dropdown.open > a,
    .top-tab-menu > ul > li.dropdown.open > a:visited,
    .top-tab-menu > ul > li.dropdown.open > a:active,
    .top-tab-menu > ul > li.dropdown.open > a:focus,
    .top-tab-menu > ul > li.dropdown.open > a:hover {
        border-bottom: solid 1px #ddd;
    }

    .top-tab-menu div.sub-nav {
        padding: 0px;
    }

    .top-tab-menu div.sub-nav a.mega-section-header {
        display: block;
        width: auto;
        padding: 10px 5px;
        padding-left: 30px;

        text-decoration: none;
    }

    .top-tab-menu div.sub-nav:not(:first-child) a.mega-section-header {
        border-top:  solid 1px #ddd;
    }

    .top-tab-menu div.sub-nav.open a.mega-section-header {
        border-bottom:  solid 1px #ddd;
    }

    .top-tab-menu ul.dropdown-menu {
        padding: 0px;
    }

    .top-tab-menu div.sub-nav .sub-nav-menu > li > a {
        display: block;
        padding: 10px 5px;
        padding-left: 50px;
    }

    .top-tab-menu div.sub-nav .sub-nav-menu > li > a:hover
    {
       background-color: #f5f5f5;
    }

    .top-tab-menu a.top-menu-toggle {
        font-weight: bold !important;
    }

    .top-tab-menu .navbar-nav li.dropdown > a.top-menu-toggle,
    .top-tab-menu .navbar-nav li.dropdown:not(.open) > a.top-menu-toggle:hover {
        background-color: #f5f5f5 !important;
    }

    .top-tab-menu .navbar-nav li.dropdown.open > a.top-menu-toggle,
    .top-tab-menu .navbar-nav li.dropdown.open > a.top-menu-toggle:visited {
        background-color: #85ce2f !important; /* Link color */
        background-color: #8cc63f !important; /* Logo Green text color */
        color: #fff !important;
    }

    .top-tab-menu .navbar-nav a.mega-section-header {
        font-weight: bold;
    }

    .top-tab-menu .sub-nav.open a.mega-section-header, 
    .top-tab-menu .navbar-nav a.mega-section-header:hover {
        background-color: #f5f5f5;
    }
}

@media all and (min-width:769px) {
    .mega-menu .collapse.top-tab-menu .nav.navbar-nav {
        height: auto !important;
        max-height: 10000px;
    }

    .top-tab-menu .dropdown.mega-menu-fullwidth > .dropdown-menu {
        overflow-y: auto;
        overflow-x: hidden;
    }

    /* fixes resize from the narrow screen */
    #header .top-menu {
        height: 56px;
    }

    .collapse.navbar-left.top-tab-menu {
        display: block !important;
    }

    .header-link.hide-menu {
        display: none;
    }

    /*.top-tab-menu .dropdown:hover .dropdown-menu {
        display: block;
        margin-top: 0;
    }*/

    .top-tab-menu .dropdown.mega-menu-fullwidth {
        position: static;
    }

    .top-tab-menu .dropdown.mega-menu-fullwidth  > li {
        display: block;
    }

    .top-tab-menu .dropdown.mega-menu-fullwidth .dropdown-menu {
        /*left: 1px;
        right: 1px;
            overflow: hidden;
        float: none;*/
        left: 1px;
        right: auto;
    }

    .mega-menu-content {
        padding-top: 20px;
    }

    .mega-menu-content .row {
        padding-bottom: 20px;
        padding-left: 20px;
    }

    /*.top-tab-menu ul.dropdown-menu li > a,
    .top-tab-menu ul.dropdown-menu li > a:active,
    .top-tab-menu ul.dropdown-menu li > a:visited,
    .top-tab-menu ul.dropdown-menu li > a:hover {
        color: #1a80ba !important;
    }*/

    .mega-menu-content ul li {
        display: block;
        padding-bottom: 5px;
    }

        .mega-menu-content.setup .mega-menu-block.general-block {
            width: 15% !important;
        }

        .mega-menu-content.setup .mega-menu-block.appointments-block,
        .mega-menu-content.setup .mega-menu-block.settings-block,
        .mega-menu-content.setup .mega-menu-block.advanced-block {
            width: 25% !important;
        }

        .mega-menu-content.setup .mega-menu-block.make-ups-demos-drop-ins-block {
            width: 35% !important;
        }

    .mega-menu-content.website .general-block {
        width: 13% !important;
    }

    .mega-menu-content.website .built-in-pages-block {
        width: 30% !important;
    }

    .mega-menu-content.website .vaults-block,
    .mega-menu-content.website .community-block,
    .mega-menu-content.website .settings-block {
        width: 18% !important;
    }

    .mega-menu-content.website ul.built-in-pages-list {
      -webkit-column-count: 2;
         -moz-column-count: 2;
              column-count: 2;

        min-height: 170px;
    }

    .mega-menu-content ul.built-in-pages li {
        -webkit-column-break-inside: avoid;
        page-break-inside: avoid;
        break-inside: avoid-column;
        display: table; 
        padding: 0px;
        width: 100%;
    }

    .mega-menu-content.setup .mega-menu-block {
        min-height: 180px;
    }

    .mega-menu-content.manage .mega-menu-block {
        min-height: 180px;
    }

    .mega-menu-content.manage .mega-menu-block.generate-fees-block li,
    .mega-menu-content.communications .mega-menu-block.settings-block li {
        white-space: nowrap;
    }

    .top-tab-menu a.mega-section-header,
    .top-tab-menu a.mega-section-header:visited,
    .top-tab-menu a.mega-section-header:active,
    .top-tab-menu a.mega-section-header:hover {
        display: block;
        padding-bottom: 5px;
        text-transform: uppercase;
        font-weight: bold;
        text-decoration: none;
    }
}

@media all and (min-width: 1000px) {
    .mega-menu-content.setup .mega-menu-block.general-block,
    .mega-menu-content.setup .mega-menu-block.appointments-block,
    .mega-menu-content.setup .mega-menu-block.settings-block,
    .mega-menu-content.setup .mega-menu-block.store-block,
    .mega-menu-content.setup .mega-menu-block.advanced-block {
        width: 15% !important;
    }

    .mega-menu-content.setup .mega-menu-block.make-ups-demos-drop-ins-block {
        width: 22% !important;
    }
}

@media (min-width: 992px) {
    .mega-menu-content .container {
        width: auto;
        min-width: 970px;
    }
}

@media (min-width: 1200px) {
    .mega-menu-content .container {
        width: auto;
        min-width: 1170px;
    }
}

@media all and (min-width: 769px) and (max-width: 1025px) {
    .mega-menu-content.setup .mega-menu-block.general-block {
        width: 15% !important;
    }

    .mega-menu-content.setup .mega-menu-block.settings-block {
        min-width: 165px;
        widthx: 170px !important;
    }

    .mega-menu-content.website .community-block {
        width: 25% !important;
    }

    .mega-menu-content.website .general-block,
    .mega-menu-content.website .vaults-block,
    .mega-menu-content.website .settings-block {
        width: 25% !important;
    }

    .mega-menu-content.website .built-in-pages-block {
        width: 500px !important;
    }

    .mega-menu-content.website ul.built-in-pages-list {
        -webkit-column-count: 3;
           -moz-column-count: 3;
                column-count: 3;
    }

    .mega-menu-content.manage .mega-menu-block {
        width: 25% !important;
    }

    .mega-menu-content.communications .mega-menu-block {
        width: 25% !important;
    }

    .mega-menu-content.reports .mega-menu-block {
        width: 25% !important;
    }
}

@media all and (min-width:1100px) {
    .top-tab-menu .dropdown.mega-menu-fullwidth .dropdown-menu {
        /*left: 0;*/
        /*right: auto;*/
    }
}