html, body {
    font-family: 'Lato', sans-serif;
}

html {
    min-height: 100vh;
}

body {
    min-height: 100vh;
}

.bodyInner {
    background-color: rgba(33, 33, 33, 0.8);
}

.baseContainer {
    background-color: rgba(93, 155, 69, 1) !important;
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
}

.baseContainerInner {
    background-color: rgba(7, 7, 7, 0.25);
}

.card, .card > .card-body {
    border-radius: 5px;
}

.border-radius-0 {
    border-radius: 0 !important;
}

.btn-default {
    background-color: #1574c4;
    color: #efefef;
    font-size: 0.85rem;
    text-transform: uppercase;
}

.text-default {
    color: #1574c4;
}

.text-greenlight {
    color: rgb(93, 155, 69);
}

.bg-greenlight {
    background-color: rgba(128, 204, 40, 0.2);
}

.bg-defaultlight {
    background-color: rgba(17, 82, 138, 0.2);
}

.text-greendark {
    color: rgb(29, 94, 11);
}

.btn-default:hover {
    background-color: rgba(17, 82, 138, 1);
    color: #ffffff;
}

a {
    color: #1574c4;
}

a:hover {
    color: #11528a;
}



.adminNavigationContainer {
    border: 1px solid rgba(93, 155, 69, 1);
    background-color: rgba(93, 155, 69, 0.1);
    border-radius: 1rem;
}

.accountNavigation {

}

.accountNavigationItem {
    margin-bottom: 0.35rem;
    filter: drop-shadow(2px 5px 4px rgba(50, 50, 50, 0.3));
}


.hoverable:hover {
    transition-duration: 200ms;
    filter: drop-shadow(2px 5px 4px rgba(50, 50, 50, 0.3));
}

.accountLink {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background-color: rgba(248, 249, 250, 1);
    border: 1px solid rgba(221, 53, 69, 0);
    border-radius: 0.65rem;
    transition-duration: 300ms;
    font-size: 0.85rem;
    color: #1a1e21;
    text-decoration: none !important;
}

.accountNavigationContainer .accountLink:hover {
    border: 1px solid rgba(93, 155, 69, 1);
    background-color: rgba(93, 155, 69, 0.15);
    color: rgba(93, 155, 69, 1);
}

.adminNavigationContainer .accountLink:hover {
    border: 1px solid rgba(93, 155, 69, 1);
    background-color: rgba(93, 155, 69, 0.15);
    color: rgba(93, 155, 69, 1);
}

.adminTitle {
    color: rgb(46, 61, 43);
}

.adminBorder {
    border-color: rgba(93, 155, 69, 1);
}

.accountLinkTitle {
    font-weight: bold;
}

.accountLinkIcon {
    
}

.accountBanner {
    padding: 8rem 1.5rem 2rem 1.5rem;
    background-color: rgba(93, 155, 69, 0.15);
    font-weight: bold;
    color: rgb(256, 256, 256);
    background: url(/img/accountBannerBg.webp) no-repeat center center;
    background-size: cover;
    filter: drop-shadow(2px 5px 4px rgba(50, 50, 50, 0.3));
}

.accountBanner .title, .adminBanner .title {
    color: rgb(141, 220, 110);
    font-weight: lighter;
    letter-spacing: 0.2rem;
}

.adminBanner {
    padding: 8rem 1.5rem 2rem 1.5rem;
    font-weight: bold;
    color: rgb(256, 256, 256);
    background: url(/img/adminBannerBg.webp) no-repeat center center;
    background-size: cover;
    filter: drop-shadow(2px 5px 4px rgba(50, 50, 50, 0.3));
}

.accountNavigationContainer .accountNavigationItem:hover .accountLinkIcon {
    color: rgba(93, 155, 69, 1);
}

.adminNavigationContainer .accountNavigationItem:hover .accountLinkIcon {
    color: rgba(93, 155, 69, 1);
}

.accountNavigationContainer .accountLink.active {
    background-color: rgba(93, 155, 69, 1) !important;
    color: #ffffff;
}

.accountNavigationContainer .accountLink.active .accountLinkIcon {
    color: #ffffff;
}

.adminNavigationContainer .accountLink.active {
    background-color: rgba(93, 155, 69, 1) !important;
    color: #ffffff;
}

.adminNavigationContainer .accountLink.active .accountLinkIcon {
    color: #ffffff;
}

.bg-lightgreen {
    background-color: rgba(93, 155, 69, 1);
}

.bg-lightgreen .title {
     color: rgb(255, 255, 255); 
    /*color: rgb(29, 94, 11);*/
    font-weight: bold;
}

.bg-lightgreen .subtitle {
    color: rgb(46, 61, 43);
    font-weight: bold;
    font-size: 0.8rem;
}

.bg-lightgreen .badge {
    color: rgb(255, 255, 255);
    background-color: rgb(29, 94, 11);
    font-size: 0.65rem;
    text-transform: uppercase;
}

.metro-button {
    height: 220px;
    line-height: 25px;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 5px;
}

.center{
    box-sizing: border-box;
}

.card.hoverable:hover, a.hoverable:hover {
    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.2));
}

.card.hoverable-sm:hover, a.hoverable-sm:hover {
    filter: drop-shadow(3px 3px 6px rgba(0, 0, 0, 0.2));
}

.userHeader {
    padding-left: 0px !important;
}

.nav-item>a:hover {
    background-color: var(--primary-bg-color);
    color: #ffffff;
}

/*code to change background color*/
.navbar-nav>.active>a {
    background-color: var(--primary-bg-color);
    color: #ffffff;
}

#egggif {position: absolute; top: 33%; left: 33%; display: none; z-index: 1 }

.nav-tabs {
    border-color: var(--primary-bg-color);
}

.nav-tabs > li > .nav-link.active {
    background-color: var(--primary-bg-color);
    color: #ffffff;
}

.align-text-center {
    text-align: center;
    vertical-align: middle;
}

ol.listbracket  {
    counter-reset: list;
}
ol.listbracket  > li {
    list-style-position: outside;
    display: table;
    counter-increment: list;
}
ol.listbracket  > li:before {
    content: counter(list, decimal) ") ";
    display: table-cell;
    padding-right: 0rem;
}

ol.listalphabracketal  {
    counter-reset: alpha;
}
ol.listalphabracketal  > li {
    list-style-position: outside;
    display: table;
    counter-increment: alpha;
}
ol.listalphabracketal  > li:before {
    content: counter(alpha, lower-alpha) ") ";
    display: table-cell;
    padding-right: 0rem;
}

.popover, .tooltip {
    z-index: 1060 !important;
}

.flexrow {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex !important;
    text-align: center;
}
.flexrow > div {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

thead input {
    width: 100%;
}

tbody select {
    width: 100%;
}

.PLPCard {
    height: 83dvh;
    overflow-x: auto;
    overflow-y: auto;
}

.btn-group {
    position: inherit !important;
}
