/* --- HTML Element Styles --- */
body {
    margin: 5px;
    background-color: White;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
}

a:link, a:visited {
    color: #007AC7; /* #1D6CA9; #1C4899;*/
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.ai-page__header {
    align-items: baseline;
    background-color: var(--white);
    border-bottom: 1px solid var(--border);
}

.ai-page__body--hasSidePanel .ai-page__body-content {
    flex-basis: 70%;
}
.ai-toolbar ~ .ai-filter,
.ai-toolbar ~ .ai-page__body-content {
    min-height: calc(100% - 3rem);
    max-height: calc(100% - 3rem);
}

.ai-toolbar .ai-button-group:not(:first-child) {
    border-left: 1px solid var(--border);
    padding-left: 1rem;
}

.ai-button {
    color: var(--black);
}

h4.required::after {
    color: #ea1c2b;
    content: '*';
    margin-left: 0.25rem;
}

.ai-box {
    background-color: var(--white);
    border: 1px solid var(--border);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-radius: var(--border-radius);
    box-sizing: border-box;
    display: flex;
    position: relative;
    padding: 0.5rem;
    margin: 1rem 0;
    flex: 0 1 auto;
    width: fit-content;
}

.ai-column__header {
    font-size: var(--md);
    margin-top: var(--space-md);
    padding-left: var(--space-sm);
}

h3 {
    font-family: Arial, Sans-Serif;
    font-size: 18px;
    font-weight: normal;
    margin: 0 0 15px;
}

    h3.noMargin {
        margin: 0;
    }

    h3.smallMargin-bottom {
        margin: 0 0 5px;
    }

h4 {
    margin: 20px 0 5px;
    font-weight: 500;
    font-size: 11px;
}

    h4.noTopMargin {
        margin: 0 0 5px;
    }

h5 {
    margin: 5px 0 5px;
    font-family: Verdana, Arial, Sans-Serif;
    font-weight: 700;
    font-size: 13px;
}

ul {
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 20px;
}

li {
    margin-top: 2px;
    margin-bottom: 2px;
}

/* Available action list */
.availableActions__header {
    border-bottom: 1px solid #bcbcbc;
    font-weight: 700;
    padding-bottom: 0.25rem;
}

.availableActions {
    list-style-type: none;
    margin: 0.5rem 0;
    padding: 0;
}

.availableActions > li {
    padding: 0.25rem 0.5rem 0.25rem 0;
}


/* Dropdown menu from a button */
.actionMenu {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #000; /* For IE < 8 */
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    margin: 0;
    max-width: 15rem;
    min-width: 10rem;
    outline: medium none;
    padding: 0 0 6px;
    position: absolute;
    right: 0;
    z-index: 300;
}

.actionMenu li:not(:first-of-type) {
    border-top: 1px solid #bcbcbc;
}

.actionMenu a {
    display: block;
    font-weight: bold;
    padding: 8px 10px;
    text-decoration: none;
    text-align: left;
}

.actionMenu a:hover {
    background-color: #eee;
}



/*Vertically centers an input 
with the label associated to it*/
input.verticalAlign {
    vertical-align: middle;
    position: relative;
    top: -1px;
}

/* Remove button (input submit) padding in FF */
input::-moz-focus-inner, button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/* --- UL and LI for list with no bullets --- */
ul.noBullets, ol.noBullets {
    margin: 0;
    padding: 0;
    list-style-type: none;
    overflow: auto;
}

ul.noBullets, ol.noBullets li {
    margin: 0;
    padding: 0;
}

ul.noBulletsWithSpacing {
    margin: 10px 0;
    padding: 0;
    list-style-type: none;
}

ul.noBulletsWithSpacing li {
    margin: 0;
    padding: 4px;
}

ul.noBulletsWithSpacing li.lessSpace {
    margin: 0;
    padding: 1px;
}

ul.noBulletsWithSpacing li.moreSpace {
    margin: 0;
    padding: 10px;
}

/* --- UL, LI and Div for horizontal list --- */
ul.horizontal {
    margin: 0;
    padding: 0;
    list-style-type: none;
    overflow: auto;
}

ul.horizontal li {
    margin: 0;
    padding: 0;
}

div.horizontalFloat {
    float: left;
}

/* --- Divs for properly spacing elements --- */
div.standardSpacing {
    margin: 5px 0 10px 0;
    padding: 5px 0;
}

div.largeSpacing {
    margin: 20px 0 20px 0;
    padding: 5px 0;
}

div.topSpacing {
    margin: 20px 0 0 0;
    padding: 5px 0;
}

div.tableWithAddNewLink, div.tableWithAddNewButton {
    position: relative;
    float: left;
}

div.addNewLink {
    position: absolute;
    top: 0;
    right: 0;
}

div.tableWithAddNewLink div table {
    margin: 20px 0 0 0;
}

div.tableWithAddNewButton div table {
    margin: 40px 0 0 0;
}

.commentBox {
    padding: 15px 0 0;
}

/* --- Classes for layout purposes --- */
.buttonContainer {
    padding: 20px 0 0 15px;
    clear: left;
}

.buttonContainerNoIndent {
    padding: 20px 0 0 0;
    clear: left;
}

/* --- Make negative numbers red --- */
.negativeNumber {
    color: Red;
}

/* --- HTML Element Styles --- */


/* --- Page Content Styles --- */
.pageBody {
    padding: 1rem;
    color: black;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
}

.pageBody TABLE {
    color: black;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
}

.pageBody .pageHeading {
    color: black;
    font-family: Arial, Sans-Serif;
    font-size: 18px;
    font-weight: normal;
}

.pageBody .pageSubHeading {
    color: black;
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 13px;
    font-weight: normal;
}

.pageBody .pageText {
    color: black;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
}

.errorText {
    color: Red;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 12px;
    font-weight: bold;
}

label.error {
    width: auto;
    margin-left: 2px;
    color: #BA0000;
    font-weight: bold;
}
/* --- Page Content Styles --- */


/* ---ASP.NET Control Styles --- */
/* Ref: http://www.cssbuttongenerator.com/ */
.btn {
    -moz-box-shadow: inset 0px 1px 0px 0px #19A4FA; /* #97c4fe */
    -webkit-box-shadow: inset 0px 1px 0px 0px #19A4FA;
    box-shadow: inset 0px 1px 0px 0px #19A4FA;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #007AC7), color-stop(1, #005B94) );
    background: -moz-linear-gradient( center top, #007AC7 5%, #005B94 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007AC7', endColorstr='#005B94');
    background-color: #007AC7;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #337fed;
    display: inline-block;
    color: #ffffff !important;
    font-weight: bold;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    padding: 4px 20px;
    text-decoration: none !important;
    text-shadow: 1px 1px 0px #1570cd;
    cursor: pointer;
    overflow: visible; /* Fix IE bug (IE6, 7 and quirks mode) */
}

.btn:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005B94), color-stop(1, #007AC7) );
    background: -moz-linear-gradient( center top, #005B94 5%, #007AC7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#005B94', endColorstr='#007AC7');
    background-color: #005B94;
}

.btn:active {
    position: relative;
    top: 1px;
}

/*
a.btn
{
background-color: #1C4899; 
color: white !important;
border-style: none;
padding: 2px 5px 2px 5px;
font-family: Tahoma, Arial, Helvetica, Sans-Serif;
font-size: 11px;
font-weight: normal;
font-style:	normal;
text-decoration: none !important;
}
*/

.cbo {
    background-color: #FFFFE5;
    color: black;
    border: solid 1px black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
}

.cboWithRightMargin {
    background-color: #FFFFE5;
    color: black;
    border: solid 1px black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    margin: 0 15px 0 0;
}

.chk {
    color: black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
}

.lbl {
    color: black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
}

.lnk {
    color: #1D6CA9;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: bold;
    font-style: normal;
}

.rdo {
    color: black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
}

.txt {
    padding-left: 2px;
    border: solid 1px #000000;
    background-color: #FFFFE5; /* #F9FAE8; */
    color: black;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
}

.grid {
    border: solid 1px black;
    border-collapse: collapse;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
}

.grid TD {
    padding: 2px 4px 2px 4px;
    border: solid 1px black;
}

.grid .gridHeader TD {
    background: #005B94;
    /* background: #2C57A5 url(images/cellpic.gif); */
    /* background-color: #1C4899; */
    color: white;
    /* border: solid 1px black; */
}

.grid .gridHeader th {
    background-color: #005B94 !important;
    color: white;
    padding: 2px 4px;
    border: solid 1px black;
}

.grid .gridHeader A:link, .grid .gridHeader A:visited {
    color: #F9FAE8;
    text-decoration: underline;
}

.grid .gridHeader A:hover {
    text-decoration: underline;
}

.grid .gridItem TD {
    background-color: white;
    color: black;
}

.grid .gridAltItem TD {
    background-color: #EFEFEF;
    color: black;
}

.grid tr.gridItem:hover td, .grid tr.gridAltItem:hover td {
    background-color: #FF9645;
    color: #007AC7;
    /*background-color: #FAB84C;
    color: #1C4899;*/
}

.grid .gridFooter TD {
    background-color: white;
    color: black;
}

.grid .gridPager TD {
    background: #005B94;
    /* background: #2C57A5 url(images/cellpic.gif); */
    color: white;
    font-weight: bold;
    text-align: right;
}

.grid .gridPager A:link, .grid .gridPager A:visited {
    color: #d8d8d8;
    text-decoration: none;
}

.grid .gridPager A:hover {
    text-decoration: underline;
}
/* ---ASP.NET Control Styles --- */


/* --- Template-Only Styles --- */
.rosterAppsLogo {
    background: url(Template/Images/arcos-rosterapps-small.png) no-repeat left center transparent;
    height: 39px;
    width: 313px;
}

.rosterAppsLogo-reverse {
    background: url(Template/Images/arcos-rosterapps-reverse.png) no-repeat left center transparent;
    height: 39px;
    width: 313px;
}

.rosterAppsLogo.rosterAppsLogo--centered,
.rosterAppsLogo-reverse.rosterAppsLogo--centered {
    background-position-x: center;
    width: inherit;
}

.rosterAppsLogo.rosterAppsLogo--sm,
.rosterAppsLogo-reverse.rosterAppsLogo--sm {
    background-size: 200px;
}

.ai-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #ffffff;
    border: 1px solid #a8aeb2;
    border-left-color: #dcddde;
    border-top-color: #dcddde;
    border-radius: 0.25rem;
    box-shadow: 0 0 0 rgba(34, 34, 34, .3);
    display: inline-flex;
    flex-flow: row nowrap;
    justify-items: center;
    line-height: 1.25;
    outline: none;
    padding: .25rem .5rem;
    margin: 0 .5rem;
    transition: all 150ms linear;
    z-index: 1;
}

a.ai-button:hover,
a.ai-button:link,
a.ai-button:visited {
    color: #222222;
    text-decoration: none;
}

.ai-button:focus {
    outline: 1px solid #67c7c7;
}

.ai-button:hover {
    box-shadow: 0.25rem 0.25rem 0.5rem rgba(34, 34, 34, .3);
    cursor: pointer;
    z-index: 10;
}

.ai-button:active {
    box-shadow: 0.15rem 0.15rem 0.25em rgba(34, 34, 34, .7)
}

.ai-environment {
    color: #fff;
    display: inline-flex;
    padding: 0.25rem 0.5rem;
}

.ai-environment::before {
    display: inline-block;
}

.ai-environment--BACKUP {
    background-color: #7c878e;
}

.ai-environment--DEV {
    background-color: #e4002b;
}

.ai-environment--PAS {
    background-color: #64ccc9;
}

.ai-environment--QA, .ai-environment--QAHA {
    background-color: #ff671f;
}

.ai-environment--ALPHA, .ai-environment--ALPHAHA {
    background-color: #7108a3;
}


.ai-environment--BACKUP::before {
    content: 'BACKUP';
}

.ai-environment--DEV::before {
    content: 'DEV';
}

.ai-environment--PAS::before {
    content: 'PAS';
}

.ai-environment--QA::before, .ai-environment--QAHA::before {
    content: 'QA';
}

.ai-environment--ALPHA::before, .ai-environment--ALPHAHA::before {
    content: 'ALPHA';
}

.error--background {
    background-color: #faccd5;
    color: #222222;
}

.info--background {
    background-color: #cce4f4;
    color: #222222;
}

.success--background {
    background-color: #b2dfca;
    color: #222222;
}

.warning--background {
    background-color: #faeabb;
    color: #222222;
}

.ai-icon::before {
    display: inline-block;
    font-family: FontAwesome, sans-serif;
    text-align: center;
    width: 1rem;
    transition: color 150ms linear;
}

.ai-icon--close::before {
    content: '\f00d';
}

.ai-icon--error::before {
    content: '\f06a';
    position: relative;
    z-index: 1;
}

.ai-icon--info::before {
    content: '\f05a';
    position: relative;
    z-index: 1;
}

.ai-icon--success::before {
    content: '\f058';
    background-color: #009451;
    position: relative;
    z-index: 1;
}

.ai-icon--warning::before {
    content: '\f071';
    color: #f0bb1d;
    z-index: 1;
}

.ai-icon--display::before {
    content: '\f1de';
}

.ai-icon--history::before {
    content: '\f1da'
}

.ai-list {
    display: flex;
    flex-flow: column;
    list-style: none;
    margin: 0;
    padding: 0;
}

.ai-list__item {
    display: flex;
    flex-flow: row wrap;
    padding: .5rem 0;
}

.ai-alert-list.ai-list {
    margin: 0;
}

.ai-alert.ai-list__item {
    flex-wrap: nowrap;
    padding: 0;
    position: absolute;
    transition: transform 150ms ease-out;
    width: 100%;
    z-index: 5;
    align-items: center;
}

.ai-alert.ai-list__item.ai-alert--closing {
    transform: scaleY(0);
}

.ai-alert.ai-list__item.ai-alert--static {
    position: static;
}

.ai-alert.ai-list__item:not(:first-child) {
    border-top: 0;
}

.pageBody > .ai-alert.ai-list {
    margin: -1rem -1rem 1rem -1rem;
}

.ai-alert__icon {
    padding: 0.5rem;
}

.ai-alert__icon.ai-icon::before {
    margin: 0;
}

.ai-alert__icon.ai-icon--error {
    background-color: #e4002b;
}

.ai-alert__icon.ai-icon--error::before {
    color: #ffffff;
}

.ai-alert__icon.ai-icon--info {
    background-color: #007ac7;
}

.ai-alert__icon.ai-icon--info::before {
    color: #ffffff;
}

.ai-alert__icon.ai-icon--success {
    background-color: #009451;
}

.ai-alert__icon.ai-icon--success::before {
    color: #ffffff;
}

.ai-alert__icon.ai-icon--warning {
    background-color: #f0bb1d;
}

    .ai-alert__icon.ai-icon--warning::before {
        color: #222222;
    }

.ai-button--icon-only.ai-icon--close {
    margin: 0 .5rem 0 0;
    width: auto;
    padding: 0 .3rem;
}

.ai-button--icon-only.ai-icon--close::before {
    margin: 0;
    width: auto;
}

.ai-button--icon-only.ai-icon--close:hover {
    background-color: #ffffff;
}

.ai-button.ai-alert__close:hover {
    background-color: #ffffff;
}

.ai-alert__body {
    display: flex;
    flex: 1 0 auto;
    flex-flow: column;
    padding: 0 .5rem;
}

.ai-alert__close {
    background-color: transparent;
    border-color: transparent;
    margin: -.35rem 0 0 0;
}

.ai-alert__message {
    font-size: 0.889rem;
    line-height: 1.15;
}

.pageHeaderTable {
    border: 0px;
    width: 100%;
    white-space: nowrap;
    border-collapse: collapse;
    border-spacing: 0;
}

.titleLine {
    border-bottom: white 1px solid;
    color: white;
    /* The font-size styling was added so that legacy DOCTYPE 
pages display fonts in the correct size. 
This is not needed for HTML 5 pages */
    font-size: 11px;
}

    /*.titleLine TABLE
{
color: #FFFFFF;
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px;
font-weight: normal;
}*/

.titleLine td {
    padding: 0 0.5rem 0 0.75rem;
    background-color: #009451;
    height: 1.25rem;
    color: var(--white);
}

.titleLine .ai-environment {
    border-top-right-radius: 0.35rem;
    margin-right: -0.75rem;
}

.titleLine .ai-environment:only-child {
    float: right;
    margin-right: -0.5rem;
}

.titleLine td:first-child {
    border-top-left-radius: 0.35rem;
}

.titleLine td:last-child {
    border-top-right-radius: 0.35rem;
}

.logout ul.noBullets {
    display: inline-flex;
}

.logout ul.noBullets li {
    display: inline-block;
    margin: 0 8.5px;
}

.titleLine td.logout {
    padding-right: 12px;
    text-align: right;
}

.titleLine .logout A:link, .titleLine .logout A:visited {
    color: #EDEEF0;
    text-decoration: none;
}

.titleLine .logout a::after {
    content: '';
    padding: 0;
}

.titleLine .logout A:hover {
    text-decoration: underline;
}

.secondaryLine {
    background-color: #C5D4DE;
    /* The font-size styling was added so that legacy DOCTYPE 
pages display fonts in the correct size. 
This is not needed for HTML 5 pages */
    font-size: 11px;
}

.headerLogo {
    padding: 5px 50px 12px 5px;
    height: 33px;
    width: 180px;
}

.spacerLine {
    padding: 0;
}

.spacerLine div {
    background-color: #009451;
    height: 10px;
}

.secondaryLine .tabLine {
    padding: 0;
}

.bottomLine {
    padding: 0px;
    height: 1px;
    border-bottom: #808080 1px solid;
}

.feedback {
    text-align: right;
    padding-right: 10px;
    /*padding-right: 10px;
font-family: Tahoma, Arial, Sans-Serif;
font-size: 11px;
font-weight: normal;*/
}

.feedback A:link, .feedback A:visited {
    color: #3E4147;
    text-decoration: none;
}

.feedback A:hover {
    text-decoration: underline;
}

.roleSwitcher {
    align-items: baseline;
    color: black;
    display: flex;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 11px;
    font-weight: normal;
}

.roleSwitcher > select {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

.pageFooterTable {
    width: 100%;
    border-spacing: 1px;
    margin-top: .5rem;
}

.pageFooterTable .bottomLine {
    padding-bottom: 1px;
}

.preFooter {
    border: 0px;
}

.preFooter td {
    background-color: #009451;
    height: 1.25rem;
    border-bottom-left-radius: 0.35rem;
    border-bottom-right-radius: 0.35rem;
    padding: 0;
}

.preFooter .ai-environment:first-child {
    border-bottom-left-radius: 0.35rem;
}

.footer td {
    padding: 5px 10px 0px 10px;
    color: #B0B0B0;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 10px;
    text-decoration: none;
}

.footer td a::after {
    content: '';
    padding: 0;
}

.footerLink, A.footerLink:link, A.footerLink:visited {
    color: #B0B0B0;
    font-family: Tahoma, Arial, Sans-Serif;
    font-size: 10px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
}

A.footerLink:hover {
    text-decoration: underline;
}
/* --- Template-Only Styles --- */


/* --- Tab Control Styles --- */
.tabControl {
    color: White;
    font-family: Arial, Sans-Serif;
    font-size: 11px;
    margin: 0 0 0 50px;
    padding: 0;
    list-style-type: none;
    overflow: auto;
}

.tabControl li {
    float: left;
    margin: 0 2px 0 0;
    padding: 0;
}

.tabControl li a {
    display: block;
    padding: 5px 10px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-decoration: none;
}

.tabControl .tabTextOn {
    background-color: #009451;
}

.tabControl .tabTextOff {
    background-color: #005B94;
}

.tabControl a:link, .tabControl a:visited {
    color: White;
    text-decoration: none;
}

.tabControl a.tabTextOn:hover {
    text-decoration: none;
}

.tabControl a.tabTextOff:hover {
    background-color: #007AC7;
    text-decoration: none;
}

.tabControl .tabOn {
    border-bottom: 1px solid #009451;
    font-weight: bold;
}

.tabControl .tabOff {
    border-bottom: 1px solid white;
    font-weight: normal;
}

.tabControl .tabNotification {
    background-color: #B02734;
}

/* --- Tab Control Styles --- */

/* Additions for jquery-ui styling
** - Added class for retrieving white icons (.ui-icon-white)  [Originally added to 1.8.16 on 01-25-2012] TLS
** - Added class so ui-icon in RosterApps dialogs is blue and floats [Originally added to 1.8.16 on 06-28-2012] TLS
** - Added class for retrieving green icons (.ui-icon-green)  [Added to 1.9.2 on 05-13-2013] TLS
** - Added class for retrieving red icons (.ui-icon-red)  [Added to 1.9.2 on 05-13-2013] TLS */

/* Different Colored Icons (Added by TLS) */
.ui-icon-white {
    width: 16px;
    height: 16px;
    background-image: url(/Styles/images/ui-icons_ffffff_256x240.png) !important;
}

.ui-icon-green {
    width: 16px;
    height: 16px;
    background-image: url(/Styles/images/ui-icons_03C03C_256x240.png) !important;
}

.ui-icon-red {
    width: 16px;
    height: 16px;
    background-image: url(/Styles/images/ui-icons_cc0000_256x240.png) !important;
}

/* Schedule Dialogs (Added by TLS) */
.dialogIcon .ui-icon {
    float: left;
    margin-right: .3em;
    background-image: url(/Styles/images/ui-icons_005b94_256x240.png) !important;
}

/* Limit profile image size */
.profileImage {
    width: 15em;
}

.no-display {
    display: none;
}

.no-float {
    float: none;
}

.top-padding {
    padding-top: 10px;
}

.pad-t-b {
    padding: 5px 0;
}

.pre-ie7-overflow-border {
    height: 215px;
    overflow: auto;
    border: solid 1px black;
    padding: 0px 20px 5px 0px;
    margin: 5px 0 0 0;
}

.width-100-pct {
    width: 100%;
}

/* Sticky Header for table */
.wrapper {
    max-height: 400px;
    position: relative;
    overflow-y: auto;
    border: solid 1px black;
    background-color: #808080;
    display: inline-block;
    margin-top: 5px;
}

.m-top3 {
    margin-top: 3px;
}

.pad-l-0 {
    padding-left: 0 !important;
}

.history__list.ai-list.ai-card .ai-list__item {
    padding: .5rem 1rem;
}

.btn-group__filter {
    padding: 0 1rem !important;
}

.end-button {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--border);
}

.end-button button {
    border-radius: 0;
    border: 0;
    box-shadow: none !important;
    margin: 0;
    padding: 1rem;
    width: 100%;
}

.ai-box.set-list__item {
    padding: 0;
    display: flex;
    flex-flow: row wrap;
}

.set-list__num {
    font-size: var(--sm);
    display: flex;
    padding: 0.5rem;
}

.set-list__info {
    padding: 0.5rem 1rem;
    display: flex;
    flex-flow: column nowrap;
    flex: 1 1 20rem;
}

.set-list__info .set-list__desc {
    color: grey;
    font-size: var(--sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.set-list__create {
    flex: 1 1 20rem;
}

.set-list__create.ai-label-value__pair,
.set-list__active.ai-label-value__pair {
    padding: .5rem 1rem;
}

.ui-text-medium {
    font-size: 0.85rem !important;
}

.ui-custom-buttonset label {
    padding: .4em 1em;
    font-weight: normal;
}

.ui-custom-buttonset span {
    display: none;
}

/* Do NOT add any css below this point */

/* Additional ai-styles.min.css classes not in old ai-stylse.min.css */

/*Landing pages with only links styling*/

.ai-nav__column {
    display: flex;
    flex-flow: column nowrap;
    min-width: 15rem;
}

.ai-nav__column:not(:last-child) {
    margin-right: var(--space-xl);
}

.ai-nav__header {
    font-size: var(--md);
    border-bottom: 2px solid var(--dkRed);
    padding: var(--space-sm) var(--space-md);
    margin-bottom: var(--space-md);
    font-weight: 700;
}

.ai-nav-list,
.ai-list.ai-nav-list {
    margin: 0;
}

.ai-nav-list__item,
.ai-list__item.ai-nav-list__item {
    padding: var(--space-md);
}