/*

* Override Pages default styles or create your own styles here

*/
html, body {
    overflow-x: hidden;
}

body, p {
    font-size: 16px;
}

.header {
    /*background-color: #FBCE07;*/
    background-color: white;
}
.header .site-name a {
    font-family: 'Prompt', 'Arial', 'sans-serif';
    color: red;
    /*font-weight: 400;*/
}

.pump-progress-container {
    display: flex;
    height: 1rem;
    /*overflow: hidden;*/
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .25rem;
    margin: 35px 0;
}
.compact .pump-progress-container {
    margin: 18px 0;
}
.pumping-progress {
    /*height: 20px;*/
    position: relative;
    transition: width .35s ease-in-out !important;
}
.pumping-progress-text {
    position: absolute;
    top: -35px;
    bottom: -35px;
    left: 0;
    right: 0;
    color: #222;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    font-size: 20px;
    /*background: red;*/
}
.pumping-progress-text p {
    font-size: 14px;
    padding: 0;
    margin: 0;
    white-space: nowrap;
}
.compact .pumping-progress-text {
    font-size: 0.8rem;
    top: -25px;
    bottom: -25px;
}
.compact .pumping-progress-text p {
    font-size: 12px;
}
.bg-progress-orange {
    background: #F0AD4E;
}
.bg-progress-blue {
    background: #5BC0DE;
}
.bg-grease-level {
    background: #5CB85C;
    transition: all .35s ease-in-out !important;
}
.bg-grease-level-alert {
    background: #D9534F;
}
.grease-level-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 4px;
    width: 20px;
}
.progress-bar-striped {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-size: 1rem 1rem;
}
.grease-level-progress {
    width: 16px;
    min-height: 80px;
    margin-right: 16px;
    float: left;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
    align-items: flex-end;
    -webkit-align-items: flex-end; /* Safari 7.0+ */
    border-radius: .25rem;
}
.compact .grease-level-progress {
    width: 8px;
    min-height: 50px;
    margin-right: 8px;
}
.grease-level-progress .progress-bar {
    width: 100%;
    height: 0;
    -webkit-transition: height 0.6s ease;
    -o-transition: height 0.6s ease;
    transition: height 0.6s ease;
}

.font-family, .font-family *:not(i) {
    font-family: 'Prompt', 'Arial', 'sans-serif' !important;
}
.nvd3-svg text {
    font-family: 'Prompt', 'Arial', 'sans-serif' !important;
}

.dashboard-card {
    font-size: 14px;
}
.compact .dashboard-card {
    font-size: 10px;
}
.dashboard-card-summary-unit {
    color: #888;
    font-size: 11px !important;
}
.dashboard-card-summary-row {
    padding: 12px 0;
}
.dashboard-summary-panel {
    padding-top: 0.25rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 1rem;
}
.compact .dashboard-summary-panel {
    font-size: 0.8rem;
    padding: 0.5rem;
    margin-bottom: 0.4rem !important;
}
.compact .dashboard-summary-panel h5 {
    font-size: 1rem;
    margin: 0;
}
.compact .dashboard-card-summary-row {
    padding: 4px 0;
}
.dashboard-pumping-station-panel {
    padding-bottom: 1rem;
}
.compact .dashboard-pumping-station-panel {
    font-size: 0.8rem;
    padding-bottom: 0.2rem;
}
.compact .dashboard-pumping-station-panel h5 {
    font-size: 1rem;
    padding: 0;
    margin: 0;
}
.text-red {
    color: red;
}
.text-red .dashboard-card-summary-unit{
    color: red;
}
.text-gray-light {
    color: #929292;
}
.text-xs {
    font-size: .75rem;
}
.text-sm {
    font-size: .875rem;
}
.text-base {
    font-size: 1rem;
}
.text-lg {
    font-size: 1.125rem;
}
.text-xl {
    font-size: 1.25rem;
}
.text-2xl {
    font-size: 1.5rem;
}
.text-3xl {
    font-size: 1.875rem;
}
.text-4xl {
    font-size: 2.25rem;
}
.text-5xl {
    font-size: 3rem;
}
.text-6xl {
    font-size: 4rem;
}

.tracking-normal {
    letter-spacing: 0;
}
.tracking-wide {
    letter-spacing: 0.025em;
}
.tracking-wider {
    letter-spacing: 0.05em;
}
.tracking-widest {
    letter-spacing: 0.1em;
}
.leading-none {
    line-height: 1;
}
.leading-tight {
    line-height: 1.25;
}
.leading-snug {
    line-height: 1.375;
}
.leading-normal {
    line-height: 1.5;
}
.leading-relaxed {
    line-height: 1.625;
}
.leading-loose {
    line-height: 2;
}

.text-dashboard-green {
    color: #3C763D;
}
.text-dashboard-red {
    color: #A94442;
}
.text-dashboard-orange {
    color: #D96015;
}

.factory-dashboard-link {
    color: #1170bf;
}
.compact .factory-dashboard-link {
    font-size: 0.7rem;
}
.dashboard-pumping-panel {
    background: #FFFFFF;
    border: 2px solid #D0E9C6;
    border-radius: 3px;
    padding: 6px;
    height: 96px;
}
.compact .dashboard-pumping-panel {
    padding: 4px;
    height: 60px;
    font-size: 0.7rem;
}
.dashboard-pumping-panel.pumping-caution {
    border-color: #ebe6be;
    background: #f2f1e2;
}
.dashboard-pumping-panel.pumping-alert {
    border-color: #EBCCCC;
    background: #F2DEDE;
}
.dashboard-pumping-panel-long {
    position: relative;
}
/*.dashboard-pumping-panel-long:before, .dashboard-pumping-panel-long:after {
    content: '';
    width: 3px;
    height: 10px;
    background: #B5B5B5;
    position: absolute;
    top: -10px;
}
.dashboard-pumping-panel-long:before {
    left: 25%;
    left: calc(25% - 3px);
}
.dashboard-pumping-panel-long:after {
    left: 75%;
    left: calc(75% + 3px);
}*/
.dashboard-pumping-panel.high {
    height: 140px;
}
.lube-disabled {
    color: #9a9a9a !important;
    border-color: #ccc;
    background: #ddd !important;
}
.pumping-alert-icon {
    /*box-shadow: 0px 0px 12px rgba(217, 83, 79, 0.7);*/
    position: absolute;
    /* (40-16)/2 */
    top: -12px;
    right: -12px;
}
.pumping-panel-value {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: bold;
}
.compact .pumping-panel-value {
    font-size: 14px;
}


.machine-grease-container {
    padding-right: 8px;
    padding-left: 8px;
}
.machine-grease-container:first-child {
    padding-left: 15px;
}
.machine-grease-container:last-child {
    padding-right: 15px;
}
.machine-grease-image-container {
    margin-top: 50px;
    margin-bottom: 50px;
}
@media (min-width: 720px) {
    .machine-grease-image-container {
        margin-top: 0;
        margin-bottom: 0;
    }
}
/*@media (min-width: 1200px) {*/
    /*.machine-grease-image-container {*/
        /*margin-top: 0;*/
    /*}*/
/*}*/
.font-xs {
    font-size: 10px;
}
.dashboard-grease-panel-label-container {
    display: flex;
    justify-content: center;
    margin-top: -30px;
}
.dashboard-grease-panel-label {
    width: auto; border-radius: 4px;
}
.grease-info-container {
    position: absolute;
    width: 72px;
    height: 58px;
}
.compact .grease-info-container {
    height: 126px;
}
.grease-info-container:after {
    position: absolute;
    content: '';
}
.grease-gear-pft {
    top: 0;
    top: calc(36% - 68px);
    left: 0;
    left: calc(45% - 82px);
}
.compact .grease-gear-pft {
    top: calc(36% - 120px);
}
.grease-gear-pft:after {
    width: 46px;
    height: 10px;
    left: 36px;
    bottom: -10px;
    border-bottom: 2px solid #245269;
    border-left: 2px solid #245269;
}
.compact .grease-gear-pft:after {
    bottom: 0;
}
.grease-gear-pfb {
    top: 0;
    top: calc(47% + 10px);
    left: 0;
    left: calc(38% - 82px);
}
.grease-gear-pfb:after {
    width: 46px;
    height: 10px;
    left: 36px;
    top: -10px;
    border-top: 2px solid #245269;
    border-left: 2px solid #245269;
}
.grease-gear-top {
    top: 0;
    top: calc(49% - 122px);
    /*right: 0;*/
    /*right: calc(38% - 72px);*/
    left: calc(62% - 40px);
}
.compact .grease-gear-top {
    top: calc(49% - 162px);
}
.grease-gear-top:after {
    width: 20px;
    height: 46px;
    left: 40px;
    top: 76px;
    border-bottom: 2px solid #245269;
    border-right: 2px solid #245269;
}
.compact .grease-gear-top:after {
    height: 16px;
    top: 152px;
}
.grease-gear-front {
    top: 0;
    top: calc(60% + 58px);
    left: 0;
    left: calc(53% - 56px);
}
.compact .grease-gear-front {
    top: calc(60% + 10px);
}
.grease-gear-front:after {
    width: 20px;
    height: 58px;
    left: 36px;
    top: -58px;
    border-top: 2px solid #245269;
    border-left: 2px solid #245269;
}
.compact .grease-gear-front:after {
    height: 10px;
    top: -10px;
}
.grease-gear-deliver {
    top: 0;
    top: calc(60% + 58px);
    left: 0;
    left: calc(72% - 16px);
}
.compact .grease-gear-deliver {
    top: calc(60% + 10px);
}
.grease-gear-deliver:after {
    width: 20px;
    height: 58px;
    left: 16px;
    top: -58px;
    border-top: 2px solid #245269;
    border-right: 2px solid #245269;
}
.compact .grease-gear-deliver:after {
    height: 10px;
    top: -10px;
}
/* Pintle side */
.grease-pintle-pft {
    top: 0;
    top: calc(36% - 68px);
    right: 0;
    right: calc(45% - 82px);
}
.grease-pintle-pft:after {
    width: 46px;
    height: 10px;
    right: 36px;
    bottom: -10px;
    border-bottom: 2px solid #245269;
    border-right: 2px solid #245269;
}
.grease-pintle-pfb {
    top: 0;
    top: calc(47% + 10px);
    right: 0;
    right: calc(38% - 82px);
}
.grease-pintle-pfb:after {
    width: 46px;
    height: 10px;
    right: 36px;
    top: -10px;
    border-top: 2px solid #245269;
    border-right: 2px solid #245269;
}
.grease-pintle-top {
    top: 0;
    top: calc(49% - 122px);
    /*right: 0;*/
    /*right: calc(38% - 72px);*/
    right: calc(62% - 40px);
}
.grease-pintle-top:after {
    width: 20px;
    height: 46px;
    right: 40px;
    top: 76px;
    border-bottom: 2px solid #245269;
    border-left: 2px solid #245269;
}
.grease-pintle-front {
    top: 0;
    top: calc(60% + 58px);
    right: 0;
    right: calc(53% - 56px);
}
.grease-pintle-front:after {
    width: 20px;
    height: 58px;
    right: 36px;
    top: -58px;
    border-top: 2px solid #245269;
    border-right: 2px solid #245269;
}
.grease-pintle-deliver {
    top: 0;
    top: calc(60% + 58px);
    right: 0;
    right: calc(72% - 16px);
}
.grease-pintle-deliver:after {
    width: 20px;
    height: 58px;
    right: 16px;
    top: -58px;
    border-top: 2px solid #245269;
    border-left: 2px solid #245269;
}

.grease-info-top {
    height: 29px;
    background: #D9EDF7;
    border-radius: 2px 2px 0px 0px;
    border: 1px solid #BCDFF1;
    border-bottom: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #245269;
}
.grease-info-top.simple {
    background: white;
    border-color: #B5B5B5;
}
.grease-info-top-detail {
    height: 40px;
    display: block;
}
.grease-info-top.temp-alert {
    color: red;
    background: #F2DEDE;
    border: 1px solid #EBCCCC;
}
.grease-info-bottom {
    height: 29px;
    background: white;
    border-radius: 0px 0px 2px 2px;
    border: 1px solid #B5B5B5;
    display: flex;
}
.grease-info-bottom > div {
    width: 33.33%;
    font-size: 13px;
}
.grease-info-bottom > div:nth-child(2) {
    border-right: 1px solid #B5B5B5;
    border-left: 1px solid #B5B5B5;
}
.grease-info-bottom.simple > div {
    width: 50%;
}
.grease-info-bottom.simple > div:nth-child(2) {
    border-right: none;
}
.grease-info-bottom-detail {
    height: 36px;
}
.grease-info-bottom .temp-alert {
    color: red;
    background: #F2DEDE;
    border: 1px solid #EBCCCC;
}

.time-selector {
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.07);
    box-sizing: border-box;
    padding: 6px 14px;
    height: 38px;
    cursor: pointer;
}
.time-selector.time-selected {
    background: #FFC000;
}
.time-selector:hover:not(.time-disabled):not(.time-selected) {
    background: #ffec9f;
}
.time-selector.time-disabled {
    background: #ddd;
    color: #444;
    cursor: not-allowed;
}

/* Pumping detail dashboard */
.side-pipe {
    position: relative;
}
.side-pipe:after {
    content: '';
    z-index: 0;
    width: 30px;
    height: 4px;
    background-color: #B5B5B5;
    position: absolute;
    top: 50%;
    left: 100%;
}
.down-pipe {
    position: relative;
}
.down-pipe:after {
    position: absolute;
    content: '';
    z-index: 0;
    width: 4px;
    height: 45px;
    background-color: #B5B5B5;
    left: calc(50% - 2px);
    bottom: -45px;
}
.grease-stock-panel {
    position: relative;
    z-index: 2;
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    box-shadow: 0px 10px 24px rgba(0, 0, 0, 0.06);
    border-radius: 4px;
}
.grease-stock-line {
    position: absolute;
    content: '';
    z-index: 0;
    width: 100%;
    height: 4px;
    background-color: #B5B5B5;
    top: 25px;
    left: calc(-25% - 6px);
}
.pumping_detail_panel {
    background: #DFF0D8;
    border: 1px solid #D0E9C6;

    /* Box Shadow */
    box-shadow: 0px 10px 24px rgba(0, 0, 0, 0.06);
    border-radius: 4px;

    text-align: center;
    transition: background-color .35s ease-in-out;
    min-height: 136px;
}
.pumping_detail_panel.pumping-caution{
    background: #f2f1e2;
    border: 1px solid #ebe6be;
}
.pumping_detail_panel.pumping-alert{
    background: #F2DEDE;
    border: 1px solid #EBCCCC;
}
.pumping_detail_panel .title {
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pumping_detail_panel .pumping-panel-value {
    color: #3C763D;
}
.pumping_detail_panel.pumping-caution .pumping-panel-value {
    color: #d97d44;
}
.pumping_detail_panel.pumping-alert .pumping-panel-value {
    color: #A94442;
}
.grease-level-text {
    font-size: 20px;
    position: absolute;
    left: 40px;
    transition: bottom .35s ease-in-out;
}
.grease-level-text:after {
    position: absolute;
    content: '';
    border: 1px solid #B5B5B5;
    width: 20px;
    left: -24px;
    top: 50%;
}
.white-card {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    box-sizing: border-box;
    border-radius: 4px;
}
.leakage-item {
    background: #F2DEDE;
    border: 1px solid #EBCCCC;
    border-radius: 2px;
    padding: 5px;
    text-transform: uppercase;
    margin-bottom: 6px;
    font-weight: bold;
    font-size: 0.75rem;
    color: #A94442;
    text-align: center;
    letter-spacing: 0.025em;
}
.grease-table-left-head {
    line-height: 1.42857143 !important;
    padding: 15px 10px !important;
    vertical-align: center !important;
    text-align: right;
    font-size: 14px;
    background-color: #f0f0f0;
    min-width: 145px;
}
.grease-table thead th {
    text-align: center;
    font-size: 14px !important;
    color: #495057 !important;
}
.grease-table tr {
    vertical-align: center;
}
.table tbody tr td {
    padding: 15px 10px;
    text-align: center;
}
.table-cell-align-right {
    text-align: right !important;
    font-feature-settings: "tnum";
}

.table.table-striped tbody tr td {
    background: #F9F9F9 !important;
}
/* end Pumping detail dashboard */

/* Machine detail dashboard */
.machine-detail-panel {
    width: 675px;
}
.machine-detail-panel-shaft {
    font-weight: bold;
    position: absolute;
    width: 60px;
    padding: 4px 10px;
    border-radius: 2px;
    text-align: center;
    min-height: 33px;
}
.machine-detail-panel-shaft-gear-pft {
    top: 30%;
    left: 35%;
    background: #D9EDF7;
    border: 1px solid #BCDFF1;
}
.machine-detail-panel-shaft-gear-pfb {
    top: 42%;
    left: 25%;
    background: #FCF8E3;
    border: 1px solid #FAF2CC;
}
.machine-detail-panel-shaft-gear-top {
    top: 42%;
    left: 52%;
    background: #ECEEEF;
    border: 1px solid #B5B5B5;
}
.machine-detail-panel-shaft-gear-front {
    top: 55%;
    left: 42%;
    background: #FEECDC;
    border: 1px solid #F9D3B2;
}
.machine-detail-panel-shaft-gear-deliver {
    top: 55%;
    left: 63%;
    background: #F8EDFC;
    border: 1px solid #EDCDF9;
}
.machine-detail-panel-shaft-pintle-pft {
    top: 30%;
    right: 35%;
    background: #D9EDF7;
    border: 1px solid #BCDFF1;
}
.machine-detail-panel-shaft-pintle-pfb {
    top: 42%;
    right: 25%;
    background: #FCF8E3;
    border: 1px solid #FAF2CC;
}
.machine-detail-panel-shaft-pintle-top {
    top: 42%;
    right: 52%;
    background: #ECEEEF;
    border: 1px solid #B5B5B5;
}
.machine-detail-panel-shaft-pintle-front {
    top: 55%;
    right: 42%;
    background: #FEECDC;
    border: 1px solid #F9D3B2;
}
.machine-detail-panel-shaft-pintle-deliver {
    top: 55%;
    right: 63%;
    background: #F8EDFC;
    border: 1px solid #EDCDF9;
}

.shaft-table thead th {
    text-align: center;
    font-size: 14px !important;
    color: #495057 !important;
}
.shaft-table tbody tr td {
    min-width: 70px;
}
.shaft-table-left-head {
    line-height: 1.42857143 !important;
    padding: 15px 10px !important;
    vertical-align: center !important;
    text-align: right;
    font-size: 14px;
    background-color: #f0f0f0;
    min-width: 220px;
}
.table-border-right {
    border-right: 2px solid #DFDFDF;
}
.table-cell-green {
    background: #DFF0D8 !important;
}
.table-cell-red {
    background: #F2DEDE !important;
}
.table-cell-pft {
    background: #D9EDF7 !important;
}
.table-cell-pfb {
    background: #FCF8E3 !important;
}
.table-cell-front {
    background: #FEECDC !important;
}
.table-cell-top {
    background: #ECEEEF !important;
}
.table-cell-deliver {
    background: #F8EDFC !important;
}
.table-scroll {
    overflow:auto;
    margin-top:20px;
}
.table-scroll table {
    width:100%;
}
/*.table-scroll table thead th .text {*/
    /*position:absolute;*/
    /*top:-20px;*/
    /*z-index:2;*/
    /*height:20px;*/
    /*width:35%;*/
    /*border:1px solid red;*/
/*}*/
/* end Machine detail dashboard */

/* Sugar man input */
.pumping-station-panel-input {
    padding-right: 12px !important;
}
input.no-spinner[type=number]::-webkit-inner-spin-button,
input.no-spinner[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input.no-spinner[type=number] {
    -moz-appearance:textfield; /* Firefox */
}
input.table-input {
    width: 50px !important;
}
select.table-input {
    width: 50px !important;
    background: transparent;
    border-radius: 4px;
}

@media (min-width: 1200px) {
    #nav-logo {
        width: 70px;
    }
    nav.page-sidebar.minimize {
        transform: translate3d(-40px, 0px, 0px) !important;
    }
    nav.page-sidebar.minimize ~ .page-container .page-content-wrapper .content {
        padding-left: 0;
    }
    nav.page-sidebar.minimize ~ .page-container .page-content-wrapper .footer {
        left: 0;
    }
}

body.menu-behind .header .brand {
    width: 60px;
    padding-left: 0;
}
.login-wrapper .bg-caption {
    width: 100%;
    /*margin: 0 -9999rem 1rem;*/
    /* add back negative margin value */
    /*padding: 1rem 9999rem;*/
    /*width: 100%;*/
    background-color: rgba(255,255,255,0.4);
}

.page-sidebar .sidebar-menu .menu-items li > a {
    width: 75%;
}

.table.border thead tr th {
    border: 1px solid rgba(225, 225, 225, 0.7);
}

.table.border tbody tr td {
    border: 1px solid rgba(225, 225, 225, 0.7);
}

.control-label {
    font-weight: bold !important;
}
.nav-tabs-simple > li > a {
    z-index: 2;
}
.nav-tabs-simple > li > a.active, .nav-tabs-simple > li > a:hover, .nav-tabs-simple > li > a.active:hover {
    background-color: #FFC000 !important;
}

.nav-tabs-simple > li > a:after {
    background-color: transparent;
}

.machine-input-block {
    background-image: url("http://localhost/smbar/public/assets/img/machine.jpg"), url("/assets/img/machine.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 361px;
    height: 266px;
    /*position: absolute;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*min-height: 300px;*/
}

.machine-input-block .top {
    position: relative;
    top:120px;
    left: 175px;
    width: 40px;
}
.machine-input-block .front {
    position: relative;
    top:150px;
    left: 98px;
    width: 40px;
}
.machine-input-block .deliver {
    position: relative;
    top:150px;
    left: 115px;
    width: 40px;
}
.machine-input-block .pft {
    position: relative;
    top: 70px;
    left: -20px;
    width: 40px;
}
.machine-input-block .pfb {
    position: relative;
    top: 110px;
    left: -80px;
    width: 40px;
}

.machine-input-block .status-abnormal {
    border: 10px solid red;
}
.machine-input-block .status-normal {
    border: 10px solid green;
}

.machine-input-block .top-status {
    display: inline-block;
    position: relative;
    top: 108px;
    left: 170px;
    border-radius: 100px;
    height:45px;
    width:45px;
}
.machine-input-block .front-status {
    display: inline-block;
    position: relative;
    top: 141px;
    left: 90px;
    border-radius: 100px;
    height:45px;
    width:45px;
}
.machine-input-block .deliver-status {
    display: inline-block;
    position: relative;
    top: 141px;
    left: 99px;
    border-radius: 100px;
    height:45px;
    width:45px;
}
.machine-input-block .PFT-status {
    display: inline-block;
    position: relative;
    top: 65px;
    left: -28px;
    border-radius: 100px;
    height:35px;
    width:35px;
}
.machine-input-block .PFB-status {
    display: inline-block;
    position: relative;
    top: 100px;
    left: -92px;
    border-radius: 100px;
    height:35px;
    width:35px;
}
@keyframes blinker {
    50% { opacity: 0; }
}
.machine-input-block .active {
    border: 10px solid #FFC000;
    animation: blinker 1s linear infinite;
}

.main-header {
    margin: 0 -9999rem 1rem;
    /* add back negative margin value */
    padding: 1rem 9999rem;
    /*width: 100%;*/
    background-color: #FFC000;
    font-weight: bold !important;
    /*color: red;*/
}
.jumbotron {
    margin-bottom: 0;
}
.nav-tabs ~ .tab-content {
    overflow: inherit !important;
}
.sub-header {
    margin: 0.5rem -9999rem;
    /* add back negative margin value */
    padding: 0.5rem 9999rem;
    background-color: grey;
    color: white;
}
.sub-sub-header {
    margin: 0.5rem -9999rem;
    /* add back negative margin value */
    padding: 0.5rem 9999rem;
    background-color: lightgray;
    color: black;
}
