/* 
    Base styling overrides for a more "Modern" look.

    Be sure to load this last so it can override any styling that is not emphasized with '!important' flags.

*/

html,
body {
    background-color: #edeef0 !important;
    color: #777 !important;
    font-size: 16px;
    padding: 0px;
    margin: 0px;
    height: 100%;   
}

#mainWrapper {
    display: block;
    position: relative;
    background-image: url("../images/greatEDGELogo.png");
    background-size: 350px;
    background-repeat: no-repeat;

    background-position: 48% 35%; /*horizontal pos, vertival pos*/
    background-color: #edeef0 !important;
    min-height: 100vh;

    margin: 0 auto;
    border: none !important;
    border-radius: 0px !important;
    padding-bottom: 0px !important;
    /* padding-left: 80px;
    padding-right: 80px; */
}

#mainContent {
    background-color: #edeef0 !important;
    padding-top: 6em;
    /* top: 10em; */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;

}

@media (max-width: 977px) {
    #mainContent {
        padding-left: 20px;
        padding-right: 20px;
    }
}

#divContentPlaceHolder {
    background-color: inherit !important;
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #00529c !important;
    color: #fff;
    font-weight: 300 !important;
}

.btn-icon {
    background-color: inherit!important;
    border: 0px!important;
}

.panel-heading h1,
.panel-heading h2,
.panel-heading h3,
.panel-heading h4,
.panel-heading h5,
.panel-heading h6,
.panel-heading p,
.panel-heading strong,
.panel-heading span {
    font-size: 1em;
    font-weight: 300 !important;
    margin-top: 0;
    margin-bottom: 0;
}

.panel-body {
    background-color: #fff;
    padding: 30px 20px !important;
    border: none !important;
}

.container-fluid > .panel {
    margin-bottom: 5px!important;
}

.GWPanelBlue {
    background-image: none !important;
    border: none !important;
    padding: 10px 15px;
    margin: 0;
}

.jqx-widget-content-GWTMDark {
    border-color: #a4bed4 !important;
}

#main-router-outlet {
    background-color: inherit !important;
}

footer .footer {
    display: block;
    background-color: #edeef0 !important;
    padding: 5px !important;
    text-align: center;
    width: 100% !important;
}

span.dropdown-toggle {
    cursor: pointer;
}

.dropdown-menu a {
    color: #3f3f3f;
}

.modal .row {
    margin: 0px;
}

.navbar-left {
    margin-top: 4px;
}

.sm-font {
    font-size: 12px;
}

@media (min-width: 768px) {
    #quickLinksContainer {
        position: absolute;
        top: 4px;
        right: 1px;
        z-index: 1001;
    }
}

@media (max-width: 767px) {
    #geNavBar .container-fluid {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    #quickLinksContainer {
        padding-top: 5px;
        border-top: 1px solid #e8e8e8;
    }

    #quickLinksContainer .dropdown-menu {
        display: block;
        position: static;
        background-color: transparent;
        border: 0 none;
        box-shadow: none;
        margin-top: 0;
        position: static;
        width: 100%;
    }
    #quickLinksContainer .dropdown-menu > li > a,
    #quickLinksContainer .dropdown-menu .dropdown-header {
        padding: 5px 15px 5px 25px;
    }
    #quickLinksContainer .dropdown-menu > li > a {
        line-height: 20px;
    }

    #quickLinksContainer a.dropdown-toggle .caret {
        display: none;
    }
    #quickLinksContainer .dropdown a.dropdown-toggle {
        display: none;
    }
}

/* Default styling with inherit background */
.tab-content {
    background-color: inherit !important;
    border: 1px solid #ddd;
    padding: 20px 5px;
    border-top: none;
    overflow-x: hidden;
}

/* Apply a white background with box shadow to make border 'pop' */
.tab-content.secondary {
    background-color: #fff !important;
    box-shadow: 1px 1px 10px #ddd;
}

.nav-tabs > li > a:hover {
    border-color: inherit;
    cursor: pointer;
}

.nav > li > a:focus,
.nav > li > a:hover {
    background-color: #e8e8e8;
    cursor: pointer;
    border-color: #e8e8e8;
}

.nav-tabs > li > a.active,
.nav-tabs > li > a:focus,
.nav-tabs > li > a:hover {
    background-color: inherit;
    color: #888;
    border: none;
}

ul.nav-tabs a.active {
    background-color: #e8e8e8;
    color: white;
}

ul.nav-tabs li a {
    background-color: inherit;
    color: inherit;
}

ul.nav-tabs li {
    font-weight: bold;
    font-size: 1em;
}

/* Light Theme */
.navbar-default {
    background-color: #ebebeb !important;
}

.modal-header {
    background-color: #00529b !important;
    color: #fff !important;
}

.panel {
    border: 1px solid #ccc !important;
    box-shadow: 1px 1px 10px #ddd !important;
}

.panel .panel {
    /* remove box shadow on any nested panels */
    box-shadow: none !important;
}

.panel-heading {
    border: none;
}

.panel-primary .panel-heading {
    background-color: #00529b !important;
    color: #fff !important;
    border: none;
}

.panel-body.grid-container {
    padding: 0px 2px !important;
}

.modal .panel-body {
    padding: 5px 10px !important;
}

.modal .panel {
    box-shadow: none !important;
}

/* GE Blue Theme */
.navbar.navbar-ge-blue {
    background-color: #00529c !important;
    box-shadow: none;
}

.navbar-ge-blue label {
    color: #fff !important;
}

.navbar-ge-blue .ge-nav-menu * {
    color: #fff !important;
}

.navbar-ge-blue .navbar-brand {
    padding: 7px 15px;
    background-color: #f7f7f7;
    height: 55px !important;
}

body.theme-navbar-ge-blue .modal-header {
    background-color: #00529b !important;
    color: #fff !important;
}

body.theme-navbar-ge-blue .panel {
    border: 1px solid #ccc !important;
}

body.theme-navbar-ge-blue .panel-heading {
    border: none;
}

body.theme-navbar-ge-blue .panel-primary .panel-heading {
    background-color: #00529b !important;
    color: #fff !important;
}

body.theme-navbar-ge-blue .panel-body {
    background-color: #f5f5f5;
}

.navbar-ge-blue .dropdown-toggle {
    color: #fff;
}

body.theme-navbar-ge-blue .navbar-toggle .icon-bar {
    background-color: #fff !important;
}

body.theme-navbar-ge-blue a.link-block {
    color: #f8f8f8;
}

body.theme-navbar-ge-blue a.link-block:hover,
body.theme-navbar-ge-blue a.link-block:focus {
    color: #a08c8c;
}

/* Dark Theme Changes */

.navbar-inverse {
    background-color: #3f3f3f !important;
    box-shadow: none;
}

/* .navbar-inverse * {
    color: #fff !important;
} */

.navbar-inverse input,
.navbar-inverse select,
.navbar-inverse option {
    color: #48494a !important;
}

body.theme-navbar-inverse .panel-heading {
    background-color: #fff !important;
    color: black !important;
    border-bottom: 1px solid #ccc !important;
}

body.theme-navbar-inverse .modal-header {
    background-color: #fff !important;
    color: #48494a !important;
    border-bottom: 1px solid #ccc !important;
}

body.theme-navbar-inverse .modal-body {
    background-color: #fcfcfc !important;
}

body.theme-navbar-inverse .modal .panel-heading {
    background-color: #fff !important;
    color: #48494a;
    border-bottom: 1px solid #ccc !important;
}

body.theme-navbar-inverse .modal .panel-body {
    background-color: #fff !important;
    color: #555;
}

body.theme-navbar-inverse .navbar .dropdown a.dropdown-toggle {
    color: #fff !important;
}

body.theme-bavbar-inverse .panel {
    border-color: #ddd !important;
    box-shadow: 1px 1px 10px #ddd !important;
}

@media (min-width: 767px) {
    body.theme-navbar-inverse .navbar .dropdown .dropdown-menu * {
        color: #48494a !important;
    }
}

@media (min-width: 768px) {
    .navbar-right {
        margin-right: 0px !important;
    }
}

@media (max-width: 768px) {
    body.theme-navbar-ge-blue .navbar .dropdown .dropdown-menu * {
        color: #fff !important;
    }

    body.theme-navbar-ge-blue ul.navbar-nav li a:hover * {
        color: #00529b !important;
    }

    .container-fluid > .navbar-collapse,
    .container-fluid > .navbar-header,
    .container > .navbar-collapse,
    .container > .navbar-header {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }
}

/* MISC */

.btn-ge-grey {
    background-color: #e0e9f5;
    border-color: #ccc;
}

#navbar-menu-collapse {
    overflow-x: hidden;
}

.showCollapsedMenu {
    display: none;
}

.showCollapsedMenu ul.navbar-nav.nav li:first-child {
    border-top: none;
}

.showCollapsedMenu ul.navbar-nav.nav li {
    margin-bottom: 1px;
    border-bottom: 1px solid #000;
    border-top: 1px solid #555;
}

.showCollapsedMenu ul.navbar-nav.nav li:last-child {
    border-bottom: none;
}

.navbar-fixed-bottom .navbar-collapse,
.navbar-fixed-top .navbar-collapse {
    max-height: 90vh !important;
}

.showJQXStandardMenu {
    display: block;
}

.showTextWhenCollapsedMenu {
    display: none;
}

.ge-nav-menu {
    padding-top: 3px;
    margin-left: -30px;
}

@media (max-width: 767px) {
    .showCollapsedMenu {
        display: block;
    }

    .showJQXStandardMenu {
        display: none;
    }

    .showTextWhenCollapsedMenu {
        display: inline-block;
    }
}

@media (max-width: 1199px) {
    .ge-nav-menu {
        margin-left: 0px;
        padding: 0;
    }
}

label {
    font-size: 0.9em;
}

/* JQX Overrides */
.jqx-loader-modal {
    background-color: #efefef !important;
    opacity: 0.2 !important;
}

.navbar .jqx-widget-header {
    border: none !important;
    background: transparent !important;
}

.jqx-menu-popup {
    z-index: 1035 !important;
}

.jqx-autocomplete-loader {
    display: inline-block;
    width: 25px;
    height: 30px;
    padding: 2px;
    background-image: url("../images/loading.gif");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    z-index: 1;
    top: 4px;
}

.break {
    flex-basis: 100%;
    height: 0;
}

.ge-btn-default {
    background-color: #144959!important;
    border-color: #144959!important;
}

.ge-btn-default:hover, .ge-btn-default:active {
    opacity: .7!important;
    background-color: inherit!important;
    border-color: inherit!important;
}

/* Firefox fix for loader not showing */
.jqx-grid div[id^="wrapper"] > :first-child > :first-child {
    z-index: 99999!important;
}