﻿.main-body {
    margin-top: 75px;
}

.grid-container {
    display: grid;
    grid-template-columns: 3fr 150px;
    grid-gap: 7px;
}

.config-chart-grid {
    display: grid;
    grid-template-columns: 1fr 30px;
}

.fixed-chart-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 7px;
    /*    width: 28%;
    min-width: 260px;*/
    /*float: left;*/
    /* margin-top: 5px;
    margin-right: 1%;*/
}

.fixed-chart-div {
    height: 200px;
    text-align: center;
    background-color:#f8f9fa;
}

.config-chart-div {
    height: 270px;
    text-align: center;
}

    


    .astk {
        color: red;
        text-align: right;
        padding-right: 2px;
    }

.page-header {
    font-weight: bold;
    font-size: 1.2em;
    font-family: sans-serif;
    color: #7c7979;
}

.left-sidebar {
    position: absolute;
    background-color: #232b2d;
    width: 250px;
    left: -250px;
    top: 65px;
    z-index: 1001;
    height: auto;
    color: #80969c;
    -webkit-transition: 500ms ease;
    -moz-transition: 500ms ease;
    -o-transition: 500ms ease;
    -ms-transition: 500ms ease;
    transition: 500ms ease;
    opacity: 0.85;
}

.left-sidebar-active {
    left: 0;
}

.ham-bars {
    position: absolute;
    left: 260px;
    top: 10px;
    margin-right: 10px;
    cursor: pointer;
    color: var(--charcoal-black);
    display: block;
}

a.ham-bars,
a.ham-bars:hover,
a.ham-bars:focus {
    color: #232b2d;
}

a {
    color: #337ab7;
    text-decoration: none;
}

    a:hover,
    a:focus {
        color: #2a6496;
        text-decoration: underline;
        outline: 0;
    }

    a:focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }



ul,
ol {
    margin-top: 0;
    margin-bottom: 10px;
}

.navbar {
    padding: 0;
    margin: 0;
    background: linear-gradient(90deg,#CBB98F, #96c6ea);
    background-size: 100% 100%;
    animation: gradient 300ms ease infinite;
    height: 65px;
}

.navbar-height {
    height: 65px;
}

.filler-line {
    background-color: gold;
    height: 3px;
}

.header-title {
    font-weight: 600;
    font-size: 1.2em;
    font-family: Verdana;
    color: var(--subheader-gray);
}

.env-title {
    color: red;
    margin-left: 7px;
}



.marg-left-7 {
    margin-left: 7px;
}

.subheader3-bold {
    font-family: Tahoma;
    font-size: .9em;
    font-weight: bold;
    color: #7c7979;
    display: inline-block;
}

.required {
    background-color: gold;
}

.Disabled {
    background: #b9b9b9 !important;
    cursor: not-allowed;
    width: 100% !important;
    min-width: 100% !important;
}


.astrk::before {
    content: "*";
    color: red;
    margin-right: 2px;
}

.nav-header-ow, .nav-header-ow > a {
    background-color: gold;
    color: #2b2a2a;
    font-weight: bold;
}

.marg-top-ow {
    margin-top: 1px;
}

.nav-header-ow-disabled {
    background-color: #c5c896;
}

    .nav-header-ow-disabled > a.a-disabled {
        pointer-events: none;
        cursor: default;
        color: dimgray;
    }

.border-bottom-2px {
    border-bottom: 2px solid var(--gold);
}

.border-top-2px {
    border-top: 2px solid var(--gold);
}

.border-top-1px {
    border-top: 1px solid var(--subheader-gray)
}


.sub-header {
    font-family: Verdana;
    color: var(--subheader-gray);
}

.page-title {
    font-size: var(--font20);
    color: var(--subheader-gray);
    font-family: var(--font-primary);
}

.link:hover {
    text-decoration: underline
}

.ui-dialog-titlebar {
    background: linear-gradient(90deg,#CBB98F, #96c6ea);
    background-size: 100% 100%;
    animation: gradient 300ms ease infinite;
}

.fa-cloud-arrow-up {
    cursor: pointer;
}

    .fa-cloud-arrow-up:hover {
        color: var(--charcoal-black);
    }

.ui-dialog-buttons {
    color: var(--a-blue);
    text-decoration: none;
}

    .ui-dialog-buttons:hover {
        color: var(--a-hover-blue);
        text-decoration: none;
        outline: 0;
    }
