.info_btn{
    background-color: rgba(0, 0, 0, 0.2);
    border: 1px solid transparent;
    color: #000;
    display: inline-block;
    font-size: 15px;
    line-height: 1;
    margin-top: 12px;
    max-width: 374px;
    min-width: 120px;
    outline: 1px dashed transparent;
    overflow: hidden;
    padding: 9px 12px 10px;
    text-align: center;
    vertical-align: bottom;
    white-space: nowrap;
}
.info_btn:focus,.info_btn:hover{ outline:#000 solid 2px; text-decoration:underline;background:rgba(0,0,0,0.3);}

.x-text-shadow-black {
    text-shadow: 0px 1px 30px #000000, 0 1px 4px #000;
}

[data-grid~=pad-20x-fixed] > [data-grid]:not(:last-child) {
    padding-right: 20px
}

/*_____________________   K - P I V O T  _________________________*/
/* See matching JS in the app.js file. */
.k-pivot > .k-pivot-tablist > a {
    font-size: 20px; /* 20px would c-pivot, but 24px is better for accessibility. */
    box-sizing: border-box;
    height: 36px;
    line-height: 36px;
    display: inline-block;
    font-weight: 400;
    white-space: nowrap;
    margin: 0 12px;
    color: black;
    cursor: pointer;
    transition: margin .6s cubic-bezier(.16,1,.29,.99);
}    

.k-pivot>.k-pivot-tablist>a:focus:not(.x-hidden-focus)
{
    outline: transparent;
    background: content-box rgba(0,103,184,.1);
}

.k-pivot>.k-pivot-tablist>a.f-active
{
    position:relative;
    border-bottom:2px solid #0067B8;
}

/*Extra MWF Glyphs*/
/* https://www.microsoft.com/en-us/mwf/getting-started/designing/glyphs */
.c-context-menu > li span.c-glyph:before {
    height: 26px;
}

.c-glyph.glyph-document:before {
    content: "\E7C3";
}

.c-glyph.glyph-person:before {
    content: "\E77B";
}

.c-glyph.glyph-star:before {
    content: "\E734";
}

.c-glyph.glyph-list:before {
    content: "\E8FD";
}

.c-glyph.glyph-refresh:before {
    content: "\E895";
}

.c-glyph.glyph-creditcard:before {
    content: "\E8C7";
}

.c-glyph.glyph-chart:before {
    content: "\F288";
}

/* Kendo -> MWF CSS */
table[role=grid] tr:nth-child(odd):not(:hover),
table[role=treegrid] tr:nth-child(odd):not(:hover) {
    background-color: #f2f2f2
}

.k-header, .k-filter-row {
    color: rgba(0, 0, 0, 0.6) !important;
    font: Segoe UI,SegoeUI,"Helvetica Neue",Helvetica,Arial,sans-serif !important;
    background-color: white !important;
    /*border-right: 0px !important;
    border-left: 0px !important;*/
}

.k-grid-filter.k-state-active {
    background-color: inherit !important;
    color: #0067B8 !important;
}

.k-pager-wrap {
    color: #0067B8 !important;
    background-color: white !important;
}

.k-pager-wrap .k-link:hover {
    color: unset !important;
    background-color: transparent !important;
    border-color: transparent !important;
    text-decoration: underline !important;
}

.k-pager-wrap span.k-label {
    color: black !important;
}

.k-pager-wrap span.k-state-selected {
    border-radius: 0px;
    background: transparent;
    border-color: black;
}

.k-pager-wrap a.k-link.k-pager-nav {
    border-color: transparent !important;
}

.k-pager-wrap .k-state-disabled {
    display: none !important;
}

.k-pager-wrap .k-pager-nav {
    width: fit-content !important;
    overflow: visible !important;
}

.k-pager-wrap .k-pager-nav span {
    width: fit-content !important;
}

.k-pager-numbers > li{
    margin-bottom: 0px;
}

/*Previous*/
.k-pager-wrap span.k-i-arrow-w {
    width: 90px !important;
}

.k-pager-wrap .k-i-arrow-w::before {
    content: "Previous";
    font: 16px/1 Segoe UI !important;
    margin-left: 26px !important;
}

.k-pager-wrap .k-i-arrow-w::after {
    content: "\E76B"; /*"glyph-chevron-left";*/
    font: 16px/1 MWF-MDL2 !important;
    float: left !important;
}
/*Next*/
.k-pager-wrap span.k-i-arrow-e {
    width: 64px !important;
}

.k-pager-wrap .k-i-arrow-e::before {
    content: "Next";
    font: 16px/1 Segoe UI !important;
    margin-left: 6px !important;
}

.k-pager-wrap .k-i-arrow-e::after {
    content: "\E76C"; /*"glyph-chevron-right";*/
    font: 16px/1 MWF-MDL2 !important;
    float: right !important;
}
/*First & Last page*/
.k-pager-wrap a.k-pager-first,
.k-pager-wrap a.k-pager-last {
    display: none;
}

.k-dropdown-wrap {
    background-color: transparent !important;
}

.k-numerictextbox > span > .k-select {
    display: none;
}

.k-numerictextbox > .k-numeric-wrap,
.k-datepicker > .k-picker-wrap {
    padding: 0px;
}

.k-numerictextbox > .k-numeric-wrap > .k-input,
.k-datepicker > .k-picker-wrap > .k-input {
    padding-top: 0.177em;
    padding-bottom: 0.177em;
    padding-right: 1.9em;
    height: 2.004em;
}

.c-progress.f-progress-center {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -2.5em;
    margin-left: -5em;
}

div.kendo-no-data {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: .8;
    background-color: white !important;
    font-size: 2em;
}

div.kendo-no-data p {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.5em;
    margin-left: -3.5em;
    font-size: 24px;
}

.c-table td .c-checkbox .c-label {
    width: 100%;
}

.c-table td .c-checkbox input[type="checkbox"] {
    position: relative !important;
}

td.kendo-grid-actions > div > ul.c-context-menu {
    min-width: 50px;
    padding-right: 15px;
}

td > div.c-action-menu,
td > a.c-action-trigger {
    float: right;
}

td > a.c-action-trigger.c-glyph {
    min-width: 16px;
    display: inline;
    white-space: pre-wrap;
    word-wrap: break-word;
    min-width: 16px;
    padding-right: 0px;
    padding-top: 0px;
}

div.c-table {
    overflow: visible;
}

div.c-table > table {
    table-layout: fixed;
    word-wrap: break-word;
}

div.c-table thead.k-grid-header, tr.k-alt {
    background: white;
}

td button.c-action-trigger {
    margin-top: 0px;
    min-width: 16px;
}

/* kendo icons */
.k-icon.k-filter:before,
.k-icon.k-i-filter:before {
    font-family: "MWF-MDL2";
    content: "\E71C";
}

.k-icon.k-calendar:before,
.k-icon.k-i-calendar:before {
    font-family: "MWF-MDL2";
    content: "\E787";
}

.k-icon.k-i-arrow-n,
.k-icon.k-i-arrow-s {
    display: none;
}

.k-icon.k-i-sort-asc-sm:before {
    font-family: "MWF-MDL2";
    content: "\E74A";
}

.k-icon.k-i-sort-desc-sm:before {
    font-family: "MWF-MDL2";
    content: "\E74B";
}

.k-icon.k-i-arrow-60-up:before {
    font-family: "MWF-MDL2";
    content: "\E70E";
}

.k-icon.k-i-arrow-60-down:before {
    font-family: "MWF-MDL2";
    content: "\E70D";
}
/* END: Kendo -> MWF CSS */