:root {
    --max-blue-1: #F0FFFF;
    --max-blue-2: #89CFF0;
    --max-blue-3: #ADD8E6;
    --max-blue-4: #B6D0E2;
    --max-blue-5: #B6D0E2;
    --max-blue-11: #CAF0F8;
    --max-blue-12: #ADE8F4;
    --max-blue-13: #90E0EF;
    --max-blue-14: #48CAE4;
    --max-blue-15: #00B4D8;
    --max-blue-16: #0096C7;
    --max-blue-17: #0077B6;
    --max-blue-18: #023E8A;
    --max-blue-19: #03045E;
    --max-navy: #000080;
    --bs-body-color: #212529;
    --max-body-bg: : var(--max-blue-11);
    --max-border: var(--max-blue-5);
    --max-selected-tab-bg: #95D5B2;
    --max-dashboard-bg: linear-gradient(180deg,#00FF00, gold);
    --max-dashboard-bg-col: #00FF00;
    --max-job-bg: linear-gradient(180deg, green, #ffffbb);
    --max-job-bg-col: green;
    --max-task-bg: linear-gradient(180deg, #bfbf42, #ffffbb);
    --max-task-bg-col: var(--max-gold-3);
    --max-time-bg: linear-gradient(180deg, #8C78E8, #ffffbb);
    --max-time-bg-col: #8C78E8;
    --max-trans-bg: linear-gradient(180deg, #FCDFEB, #ffffbb);
    --max-trans-bg-col: #FCDFEB;
    --max-doc-bg: linear-gradient(180deg, #FF33CC, #ffffbb);
    --app-border-radius: 35px;
    --max-header-color: balck;
    --max-header-background-color: var(--max-blue-11);
    --max-header-background-image: linear-gradient(180deg, var(--max-blue-16), var(--max-blue-14),var(--max-blue-12),var(--max-blue-12), var(--max-blue-11));
    --bs-body-bg: var(--max-blue-1);
}
.max-card {
    border-radius: 20px;
    background-color: var(--max-blue-11);
    /*    opacity: 80%;*/
    padding: 0px;
    padding-bottom: 20px;
    margin: 20px 20px 50px 20px;
    width: fit-content;
    max-width: 1000px;
    box-shadow: 0px 0px 10px 10px var(--max-blue-15);
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    min-width: 600px;
}



.max-card-header {
    border-style: var(--max-gold-1);
    border-width: 1px 1px 1px 1px;
    border-color: #A1A1A1;
    margin: 5px 5px 30px 5px;
    --e-column-margin-right: 5px;
    --e-column-margin-left: 5px;
    border-radius: 15px;
    color: var(--max-header-color);
    background-color: var(--max-header-background-color);
    background-image: var(--max-header-background-image);
    padding: 10px 50px 10px 50px;
    text-align: center;
    text-align: center;
}

.max-card-body {
    margin: 5px 5px 30px 5px;
    --e-column-margin-right: 5px;
    --e-column-margin-left: 5px;
    padding: 10px;
}