a.btn-small {
    background-color: #313a5f;
    color: white;
    border: 1px solid #313a5f;
    border-radius: 5px;
    font-size: 12px;
    font-weight: normal;
    padding: 2px 5px;
}
a.btn-small:hover {
    background-color: #CCC;
    color: #666;
}

#infoStaffUpdateListLink i {
    padding: 10px 15px;
    color:  #1f3cce;
    display: block;
    cursor: pointer;
}

#infoStaffUpdateListLink i code.status {
    font-family: $font-family-sans-serif;
    font-size: 13px;
    color: white;
    background-color: green;
    display: inline-block;
    padding: 4px;
    border-radius: 4px;
    vertical-align: calc(50% - 2px);
    margin-left: 5px;
}

#infoStaffUpdateListLink  ul.plainList li {
    margin: 0 0 10px 0;
    padding: 0 0 0 20px;
    border-style: none;
}

#infoStaffUpdateListLink  table.plainList  th {
    padding: 5px;
    text-align: center;
    background-color:#ecf1f2;
    color:#757575;
}

#infoStaffUpdateListLink  table.plainList td {
    padding: 10px;
    text-align: left;
}

#infoStaffUpdateListLink i.close-button {
    color: #8290a1;
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    font-size: 30px;
    position: absolute;
    right: 4px;
    top: 4px;
}
#infoStaffUpdateListLink i.close-button:hover {
    background-color: #ecf1f2;
}

#infoStaffUpdateListDropdown {
}

.ot-header .navbar-nav .nav-item#infoSchoolListLink .dropdown-menu {
    padding: 20px 40px 20px 20px;
}
.ot-header .navbar-nav .nav-item#infoSchoolListLink i.close-button {
    color: #8290a1;
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    font-size: 30px;
    position: absolute;
    right: 4px;
    top: 4px;
}

.showStaffTypeProfile {
     position: relative;    
}
.showStaffTypeProfilePanel.d-none {
    display: none;
}
.showStaffTypeProfilePanel.d-block {
    z-index: 90;
    position: absolute;
    bottom: -200px;
    right: 0;
    width: auto;
    border: 1px solid #333333;
    border-radius: 10px;
    padding: 20px;
    background-color: white;
}

.showStaffTypeProfilePanel .staff-type-list li {
    text-align: left;
    color: #333333;
    margin: 0 0 0 0;
}
.showStaffTypeProfilePanel .role-list {
    margin: 0 0 5px 10px;
}
.showStaffTypeProfilePanel .role-list li {
    text-transform: none;
    font-size: 1.0em;
    font-weight: normal;
    color: #000000;
    margin: 0 0 0 0;
}
.showStaffTypeProfile i.icon-question {
    font-size: 1.20em;
    font-weight: bold;
    position: relative;
    top: 3px;
}
.showStaffTypeProfile .highlight-hover {
    padding: 5px 10px;
    border-radius: 10px;
}
.showStaffTypeProfile .highlight-hover:hover {
    background-color: white;
}


i.delete-table-row.close-button {
    color: #8290a1;
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    font-size: 30px;
}
i.delete-table-row.close-button:hover {
    background-color: #ecf1f2;
}

.table-scroller {
    height: 50vh;
    overflow-y: auto;
}

.plainHorizontal.zero-margin {
    margin: 0;
}

.plainHorizontal.width-set-01 tr th {
    padding: 8px 12px;
    box-sizing: padding-box;
}
.plainHorizontal.width-set-01 tr td {
    padding: 8px 12px;
    box-sizing: padding-box;
}
.plainHorizontal.width-set-01 .c0 {
    width: 10em;
}
.plainHorizontal.width-set-01 .c1 {
    width: 280px;
    position: relative;
}

.plainHorizontal.width-set-01 .c1 cite.row_index {
    display: block;
    position: absolute;
    top: 5px;
    font-size: 10px;
    font-style: normal;
    font-family: monospace;
}

.plainHorizontal.width-set-01 .c2 {
    width: 280px;
}
.plainHorizontal.width-set-01 .c3 {
    width: 100px;
}
.plainHorizontal.width-set-01 .c4 {
    width: 200px;
}
.plainHorizontal.width-set-01 .c5 {
    width: 200px;
}
.plainHorizontal.width-set-01 .c6 {
    width: 250px;
}

.plainHorizontal.width-set-01 .c6 input[type=text] {
 line-height: 1.00;
 border:1px solid #8290a1;
 border-radius: 5px;
 height: auto;
 width: 6em;
 padding: 5px;
 margin-left:0;
 margin-top: 10px;
 font-size: 16px;
 background-color:#fff;
 color:#000;
}


.plainHorizontal.width-set-02 .c0 {
    width: 20%;
}
.plainHorizontal.width-set-02 .c1 {
    width: 20%;
}
.plainHorizontal.width-set-02 .c2 {
    width: 5%;
}
.plainHorizontal.width-set-02 .c3 {
    width: auto;
}
.plainHorizontal.width-set-02 .c4 {
    width: 20%;
}

.dynamic-filtering-parent input.dynamic-filtering {
    padding: 5px;
    margin: 0;
    width: 15em;
    background-color: white;
}
label.dynamic-filtering {
    font-size: 1.5em;
    font-weight: bold;
}

#download-list {
    color: #1f3cce;
    background-color: white;
    padding: 10px;
    border: none;
    border-radius: 10px;
}
#download-list:hover {
    color: white;
    background-color: #1f3cce;
}
#download-list * {
    font-size: 125%;
    display: inline-block;
    color: inherit;
    background-color: transparent;
    border: none;
    margin: 0;
    padding: 0;
}
#download-list input {
    font-weight: normal;
}

.use-nav-sub-menus .nav.hide-sub-menus li:nth-child(n+2) {
    display: none;
}

.use-nav-sub-menus .nav[class$="-sub-menus"] li:first-child {
    position: relative;
}
.use-nav-sub-menus .nav[class$="-sub-menus"] li:first-child:hover {
    background-color: #F0F0F0;
}

.use-nav-sub-menus .nav[class$="-sub-menus"] li:first-child::after {
    position: absolute;
    top: calc(50% - 9px);
    right: 6px;
    font-size: 14px;
    line-height: 18px;
    display: inline-block;
    width: 18px;
    height: 18px;
    text-align: center;
    border-radius: 50%;
    color: black;
}
.use-nav-sub-menus .nav[class$="hide-sub-menus"] li:first-child::after {
    content: "\25BC";
}
.use-nav-sub-menus .nav[class$="show-sub-menus"] li:first-child::after {
    content: "\25B2";
}

cite.hidden {
    display: none;
}
mark.status {
    font-size: small;
    display: inline-block;
    margin-top: 5px;
    padding: 2px 5px;
    border-radius: 5px;
    background-color: #F0F0F0;
    color: black;
}

.update-ext-id span {
    position: relative;
}
.update-ext-id span.marker::after {
    position: absolute;
    bottom: 10px;
    right: 0px;
    font-size: 18px;
    line-height: 24px;
    display: inline-block;
    width: 24px;
    height: 24px;
    text-align: center;
    border-radius: 50%;
}
.update-ext-id span.marker.done::after {
    color: white;
    background-color: green;
    content: "\2713";
}
.update-ext-id button {
    padding: 7px 5px;
    border: 1px solid gray;
    border-radius: 5px;
    margin: 0 5px;
}
button.hideable {
    display: none;
}
.update-ext-id:hover button.hideable {
    display: inline;
}
.update-ext-id:hover button.editor {
    display: none;
}
.nowrap {
    white-space: nowrap;
}

.input-wrapper {
    position: relative;
}
.input-wrapper .clear-button {
    position: absolute;
    top: 1px;
    right: 1px;
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: none;
}
.selectize-dropdown-content {
    max-height: 401px;
}

.filter .bm-20 {
    margin-bottom: 20px;
    flex: 0 0 100%;
    text-align: right;
    max-width: none;
}
/*
.filter .bm-20 input {
    color: white;
    background-color: #313a5f;
}
*/

 .white-msg-panel {
    background-color: white;
    color: black;
    padding: 10px;
    border-radius: 10px;
}
 .white-msg-panel p {
    color: black;
}

/* OT Tech Support pop-up notice*/
div.ot-tech-support {
    font-style: normal;
    text-decoration: underline dotted;
    position: relative;
    display: inline-block;
    padding: 2px;
    border-radius: 5px;
}
div.ot-tech-support div.inside {
    display: none;
    padding: 5px 10px;
    border-radius: 10px;
    position: absolute;
    bottom: 80%;
    left: 100%;
    width: 20em;
    border: 1px solid #F0F0F0;
    background-color: white;
    z-index: 10;
    line-height: 1.5;
}
div.ot-tech-support div.inside h3 {
    margin: 0;
    font-size: 1.00em;
    color: #C0C0C0;
}
div.ot-tech-support div.inside p {
    margin: 0;
}
div.ot-tech-support:hover {
    background-color: #F0F0F0;
}
div.ot-tech-support div.inside .close {
    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    background-color: #F0F0F0;
    color: #1f3cce;
    font-size: 18px;
    line-height: 20px;
    height: 20px;
    width: 20px;
    text-align: center;
}
div.ot-tech-support div.inside .close:hover {
    background-color: #E0E0E0;
}