﻿:root {
    --l2-white: #FFFFFF;
    --l2-rare: #989898;
    --l2-medium-rare: #548BA9;
    --l2-medium: #003C5C;
    --l2-medium-well: #01293E;
    --l2-well: #0A1115;
    --l2-light-rare: #6ca4c3;
    outline: none;
}

.border-L2 {
    border-color: var(--l2-medium-rare) !important;
}

/* when using responsive design, rows would expand to the left & right edges of the screen.  This adds the margins back in. */
.row {
    margin-right: 0;
    margin-left: 0;
}

.rowSkinny {
    font-size: 5pt;
}

/* add shading to navbar */
.navbar {
    border-radius: 0;
    border: 0;
    min-height: 0;
    /*-webkit-box-shadow: 0 -10px 8px -10px #808080 inset, 0 10px 8px -10px #808080 inset;
    -moz-box-shadow: 0 -10px 8px -10px #808080 inset, 0 10px 8px -10px #808080 inset;
    box-shadow: 0 -10px 8px -10px #808080 inset, 0 10px 8px -10px #808080 inset; */
}

/* change font color to white for main level links */
.navbar-dark .brand, .navbar-dark .nav > li > a {
    color: #fff;
    text-decoration: none;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
    padding-right: 20px;
}

/* move menu items to far left of navbar */
.navbar-collapse {
    padding-left: 0;
}

/* change dropdown menu links to white text, no decoration */
.navbar-dark .navbar-nav .nav-link {
    color: #fff;
    text-decoration: none;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 20px;
}

    /* remove a link hover color on dropdown menu*/
    .navbar-dark .navbar-nav .nav-link:hover {
        color: #fff;
    }

/* expand navbar dropdowns on hover for larger screens */
@media (min-width: 980px) {
    .dropdown:hover .dropdown-menu {
        display: block;
    }
}

/* increase font weight for navbar */
.nav {
    font-weight: 700;
}

/* change the appearance of the menu dropdown items*/
.dropdown-items-nav-menu {
    color: #fff;
    text-decoration: none;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
    padding-right: 20px;
    font-size: smaller;
}

.dropdown-item:hover {
    background-color: slategray;
    text-decoration: none;
    color: #fff;
}

/* change the padding to decrease the size of the navbar */
.navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
}

/* modify the body of the page */
body {
    /*padding-top: 1.5em;*/
    font-family: 'Open Sans', sans-serif;
    background: #333;
    background-image: url("../images/bg.png");
    background-repeat: repeat-x;
    font-size: small;
}

/* modify header appearance - header.png is main image */
.header {
    background-image: url('../images/header.png');
    background-repeat: no-repeat;
    /*min-height: 104px;*/
    margin-left: -15px;
    margin-right: -15px;
    color: #fff;
    font-weight: bold;
}

/* add header repeat - headerbg.png is right-most color-match of header.png*/
.headerrepeat {
    background-image: url('../images/headerbg.png');
    background-repeat: repeat-x;
}

/* change background colors of table headings */
.table-background th {
    background-color: var(--l2-medium);
    color: #fff;
}

/* change the table hover row color */
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: var(--l2-medium-rare);
}

/* change table row to pointer icon for clickable rows */
.clickableRows > tbody > tr:hover {
    cursor: pointer;
}

/* change the card background color */
.card-body {
    background-color: ghostwhite;
}

/* change the card header text and background color */
.card-header {
    background-color: var(--l2-medium-rare);
    color: #fff;
    font-size: small;
    font-weight: bold;
    padding: 0.5rem;
}

.card-light-header {
    background-color: var(--l2-light-rare);
    color: #fff;
    font-size: small;
    font-weight: bold;
    padding: 0.3rem;
}

.card-light-header-formControl {
    background-color: var(--l2-light-rare);
    color: #fff;
    font-size: small;
    font-weight: bold;
    padding: 0.3rem;
}

/*change link appearance (used in card headers)*/
.a {
    text-decoration: none;
    border-bottom: none;
    color: white;
}

a:hover {
    text-decoration: none;
    border-bottom: none;
    color: white;
}

a.d-block {
    text-decoration: none;
    border-bottom: none;
    color: white;
}

.a-licensing {
    text-decoration: none;
    border-bottom: none;
}

    .a-licensing:hover {
        text-decoration: none;
        border-bottom: none;
        color: darkblue;
    }

    .a-licensing.d-block {
        text-decoration: none;
        border-bottom: none;
        color: darkblue;
    }

/* toggle the expand/collapse card header icon */
.card-header .oi {
    transition: .3s transform ease-in-out;
}

.card-header .collapsed .oi {
    transform: rotate(90deg);
}

/* set text size to small (for stack trace textarea) */
.smallText {
    font-size: small;
}

.smallText7rem {
    font-size: 0.7rem;
}

/* floats custom content added to jquery.datatables toolbar to the left*/
.toolbar {
    float: left;
}

/* align and bold text in a label associated with a checkbox */
.checkAlign {
    padding-top: 3px;
    font-weight: bold;
}
.reviewed{
    width:58px;
}
.prodReviewed{
    width:143px;
}
/* text-size for datatable search filtering in dropdowns */
.searchText {
    font-size: small;
    width: 100%;
    color: black;
}

    .searchText option {
        background-color: black;
        color: white;
        font-size: smaller;
    }

/* modify bootstrap for ag-Grid to fit the whole card body, column, and container widths */
.gridCard {
    padding: 0px 0px 0px 0px;
    font-size: 9pt;
}

.gridCol {
    padding: 0px 0px 0px 0px;
}

.wideCol {
    padding-left: 5px;
    padding-right: 5px;
}

.wideContainer {
    padding-left: 0px;
    padding-right: 0px;
}

/* edit button color updates */
.btn-edit {
    background-color: darkgrey;
}

/* xs button changes */
.btn-group-xs > .btn, .btn-xs {
    padding: .20rem .4rem;
    font-size: .8rem;
    line-height: .5;
    border-radius: .2rem;
}

.btn-group-xs > .btn, .btn-xs-addButton {
    padding: .10rem .1rem;
    font-size: .8rem;
    line-height: .5;
    border-radius: .2rem;
}

/* smaller sized alert div */
.smallAlertDiv {
    padding: 0px;
}

/* add to make dropdown button menu separator black instead of very light grey */
.blackSeparator {
    border-top-color: black;
}

/* use smaller text in button class */
.smallButtonText {
    font-size: small;
}

/* adjust badge sizing */
.badgeFix {
    display: inline;
}

/* make input group prepend width fixed */
.fixedPrepend {
    display: block;
    width: 25%;
}

.fixedPrepend50 {
    display: block;
    width: 50%;
}

.fixedPrepend42 {
    display: block;
    width: 42%;
}

/* remove button padding */
.smallButtonPadding {
    padding: 0.1rem;
}

.point7remFont {
    font-size: 0.7rem !important;
}

.border-darkfadeGreen {
    border-color: #5a8565;
}

.bg-darkfadeGreen {
    background-color: #5a8565;
}

.border-darkfadeRed {
    border-color: #9c4b4b;
}

.bg-darkfadeRed {
    background-color: #9c4b4b;
}

.bg-lightFadeGreen {
    background-color: #dce8d8;
}

.bg-darkFadeGreenHeader {
    background-color: #3b5742;
}

/* L2 button */
.L2Btn {
    color: var(--l2-white);
    background-color: var(--l2-medium);
    border-color: var(--l2-medium-well);
}

    .L2Btn:hover {
        color: var(--l2-white);
        filter: brightness(120%);
    }

/* L2 normal sized modal */
.L2ModalDialog {
    width: 30vw;
    max-width: 30vw;
    margin: 2.5vh auto;
    height: 75vh;
    max-height: 75vh;
}

    .L2ModalDialog .modal-body {
        max-height: 88vh;
        /*overflow-y: auto;*/
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2ModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

/* L2 full screen modal */
.L2FullScreenModalDialog {
    width: 80vw;
    max-width: 80vw;
    margin: 2.5vh auto;
    height: 95vh;
    max-height: 95vh;
}

    .L2FullScreenModalDialog .modal-body {
        max-height: 88vh;
        overflow-y: auto;
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2FullScreenModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

/* L2 medium sized modal */
.L2MediumModalDialog {
    width: 40vw;
    max-width: 40vw;
    margin: 2.5vh auto;
    height: 75vh;
    max-height: 75vh;
}

    .L2MediumModalDialog .modal-body {
        max-height: 88vh;
        /*overflow-y: auto;*/
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2MediumModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

/*L2 medium wide sized modal */
.L2WideMediumModalDialog {
    width: 70vw;
    max-width: 70vw;
    margin: 2.5vh auto;
    height: 75vh;
    max-height: 75vh;
}

    .L2WideMediumModalDialog .modal-body {
        max-height: 88vh;
        overflow-y: auto;
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2WideMediumModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

/*L2 half screen modal */
.L2HalfScreenModalDialog {
    width: 50vw;
    max-width: 50vw;
    margin: 2.5vh auto;
    max-height: 95vh;
}

    .L2HalfScreenModalDialog .modal-body {
        max-height: 88vh;
        overflow-y: auto;
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2HalfScreenModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

/* L2 very wide modal */
.L2VeryWideModalDialog {
    width: 95vw;
    max-width: 95vw;
    margin: 2.5vh auto;
    height: 95vh;
    max-height: 95vh;
}

    .L2VeryWideModalDialog .modal-body {
        max-height: 88vh;
        overflow-y: auto;
        margin-bottom: 1vh;
        background-color: whitesmoke;
    }

    .L2VeryWideModalDialog .modal-header {
        font-weight: bold;
        color: #fff;
        padding: 0.5rem;
        background-color: var(--l2-medium-rare);
    }

.LoaderWheel {
    margin: auto;
    padding: 10vh 10vw;
    display: block;
}

.artworkBG {
    background-color: #bae3e6;
}

.digitizingBG {
    background-color: #b9d9b2;
}

.licensingBG {
    background-color: #c6b2d9;
}

.licensingMaintBG {
    background-color: #d68378;
}

.artworkUtilityBG {
    background-color: #e0b68b;
}

.sewoutBG {
    background-color: #e6e1b1;
}

.fontSize100Pct {
    font-size: 100%;
}
