@charset "UTF-8";

/* CSS Document */


/*---------------
x->  ADDED: FONTS   <--X
---------------*/

.big {
    font-size: 14px;
    font-weight: 900;
}

.sub-title {
    /* to be used within <h1> tags */
    font-weight: 100;
    font-size: 12px;
}

.action .label {
    /* to be used with table based forms for labels */
    font-weight: 800;
    text-align: right;
    width: 10px;
}

.action tbody td {
    text-align: center;
}

.action tbody td textarea {
    width: 100%;
}

.action tbody td input[text] {
    width: 100%;
}

.action tbody td select {
    width: 100%;
}


/*---------------
x->  ADDED: LOGIN BOX   <--X
---------------*/

.login_page {
    position: relative;
    left: -10%;
}

.login_box {
    border: 1px #A5A397 solid;
    padding: 10px;
    width: 300px;
}


/*---------------
x->  ADDED: FORM INPUTS   <--X
---------------*/

.iTitle {
    font-weight: 800;
    font-size: 12px;
    text-align: right;
    padding-right: 15px;
}

.iField {
    width: 100%;
    border: 1px #A5A397 solid;
}

.iFieldSmall {
    width: 150px;
    border: 1px #A5A397 dashed;
}


/*---------------
X->  GLOBAL  <--X
---------------*/


/* border:0; <-- commented out as it removes borders from input fields as well */

* {
    margin: 0;
    padding: 0;
}

body {
    font-family: arial, verdana, sans-serif;
    color: #000;
    font-size: 62.5%;
}


/*---------------
X-->  TAGS  <---X
---------------*/

a {
    color: #0c4ea6;
    outline: none;
}


/*---------------
X--->  IDs  <---X
---------------*/

#header {
    font-size: 1.2em;
    background: #FFFFFF;
    width: 100%;
    padding-top: 10px;
    margin-bottom: 10px;
}

#logo {
    margin-left: 20px;
}

#navbar {
    background: #ff6d06;
    height: 26px;
    margin-top: 10px;
    color: #FFFFFF;
    clear: both;
}

#navbar a {
    color: #FFFFFF;
    text-decoration: none;
    line-height: 26px;
    font-size: 1em;
    font-weight: bold;
}

#navbar select {
    margin-top: 2px;
    padding: 1px;
    border: 1px solid #999;
}

#sidebar {
    width: 17%;
    float: left;
    height: 400px;
    margin-left: 0.5%;
}

#sidebar a.head {
    background: url(https://recordvo.com/vendors/fmw/img/nav_item.gif) no-repeat 0px 3px #666;
    color: #FFFFFF;
    width: 100%;
    display: block;
    height: 1.8em;
    line-height: 1.8em;
    text-decoration: none;
    margin: 1px 0;
    font-size: 1.1em;
    font-weight: bold;
    text-indent: 18px;
}

#sidebar a.head:hover {
    background: url(https://recordvo.com/vendors/fmw/img/nav_item.gif) no-repeat 0px 3px #999;
    color: #FFFFFF;
}

#sidebar ul#sideba-nav li ul li {
    width: 90%;
    margin: 0 0 1px 5%;
    padding-left: 10px;
    line-height: 20px;
    border-bottom: 1px dotted #CCC;
}

#sidebar ul#sideba-nav li ul li.inactive {
    display: none;
}

#sidebar ul#sideba-nav li ul li.current {
    border-bottom: 1px solid #999;
    background: #CCC;
}

#sidebar ul#sideba-nav li ul li a {
    text-decoration: none;
    color: #333333;
}


#sidebar ul#sideba-nav li ul li a:hover {
    text-decoration: underline;
}

#main h1 div:not(.popper-tooltip) {
    display:inline;
    /* This style causes positioning problems with tooltips ans other blocks */
    /* margin-left:10px; */
}
#main h1 div a{ font-size:12px;}
#main  select{border: 1px solid #999;}

#main {
    margin: 15px 20px 0 19.5%;
}

h1.page_title {
    font-size: 18px;
}

#footer {
    width: 100%;
    border-top: 1px dotted #999;
    height: 40px;
    padding: 10px 0 0 0;
    clear: both;
    text-align: center;
    font-size: 1.1em;
}


/*---------------
X->  CLASSES  <-X
---------------*/

.float-left {
    float: left;
    margin-left: 18px;
}

.float-right {
    float: right;
    margin-right: 18px;
    text-align: right;
    margin-bottom: 10px;
}

.float-right input[type="checkbox"] {
    position: relative;
    bottom: -3px;
}

.float-right a.btn {
    top: -2px;
}


/* otherwise the button is too low */

.formbox {
    width: 47%;
    min-height: 200px;
    float: left;
    margin-right: 2%;
    margin-bottom: 22px;
}

.statbox {
    width: 47%;
    border: 1px solid #CCCCCC;
    min-height: 200px;
    float: left;
    margin-right: 2%;
    margin-bottom: 22px;
}

.statbox h2 {
    color: #FFFFFF;
    background: #666666;
    padding: 3px;
    text-indent: 5px;
    font-size: 1.5em;
}

.statbox p {
    margin: 5px;
}

.stattable {
    width: 98%;
    float: left;
    min-width: 760px;
    border: 1px solid #CCC;
}

.stattablebox {
    text-align: right;
    line-height: 2em;
    width: 100%;
    margin-bottom: 5px;
}

.stattable .btn {
    /* Small vertical margin so buttons don't touch on small screens */
    margin: 2px 5px 2px 0;
}

div.statbox table.stattablebox tr td {
    border: 0;
}

.statbox a {
    padding-left: 5px;
}

.mute {
    font-size: smaller;
    color: #999999;
    font-weight: normal;
}

.header_filter {
    font-size: 14px;
    font-weight: 800;
    margin-right: 5px;
    padding-left: 14px;
    line-height: 1.9em;
}

.noborder {
    border: 0;
}

.absleft {
    position: absolute;
    left: 0;
    top: 0;
}

.absright {
    position: absolute;
    right: 0;
    top: 0;
}


/* Errors and Warnings */
/* Styling of error/success messages */
.messages-wrapper {
    width: 80%;
    margin: 15px 0 0 19.5%
}

.messages-wrapper>div {
    width: 98%;
    min-width: 760px
}

.messages-wrapper>div .success,
.messages-wrapper>div .error,
.messages-wrapper>div .warning,
.messages-wrapper>div .info {
    width: auto;
    margin: 5px 0
}

div.dsn_msg.error {
    background: url(https://recordvo.com/vendors/fmw/img/icn_delete.gif) no-repeat 3px 4px #FFFFDD;
    border-top: 2px solid #FF5A00;
    border-bottom: 2px solid #FF5A00;
}

div.dsn_msg.warning {
    background: url(https://recordvo.com/vendors/fmw/img/icn_warning.gif) no-repeat 3px 4px #FFFFEF;
    border-top: 1px solid #FFCC00;
    border-bottom: 1px solid #FFCC00;
}

div.dsn_msg.success {
    background: url(https://recordvo.com/vendors/fmw/img/icn_tick.gif) no-repeat 3px 4px #FFFFEF;
    border-top: 1px solid #81CA76;
    border-bottom: 1px solid #81CA76;
}

div.dsn_msg.info {
    background: url(https://recordvo.com/vendors/fmw/img/icn_info.gif) no-repeat 3px 4px #EFFFFF;
    border-top: 1px solid #639ed5;
    border-bottom: 1px solid #639ed5;
}

div.dsn_msg {
    padding: 5px 25px;
    margin: 5px 0 5px 0;
    width: 97%;
    font-weight: bold;
    font-size: 1.1em;
}
div.dsn_msg hr {
    margin: 5px 0;
}
div.dsn_msg div,
div.dsn_msg p {
    margin-bottom: 15px;
    font-weight: normal;
}
div.dsn_msg ul,
div.dsn_msg ol {
    font-weight: normal;
    margin: 5px 0;
}
div.dsn_msg li {
    margin-left: 20px;
    margin-bottom: 5px;
}

/*-----------
X-> FORMS <-X
-----------*/

.formbox form {
    border: 1px solid #CCCCCC;
    background: #F9F9F9;
    padding: 5px 20px 20px 20px;
}

.formbox label {
    width: 100%;
    display: block;
    text-align: right;
    height: 30px;
    line-height: 30px;
}

.formbox input {
    border: 1px solid #CCCCCC;
    height: 17px;
    margin: 3px 0 0 10px;
}

.formbox textarea {
    border: 1px solid #CCCCCC;
    margin-left: 10px;
}

.formbox hr {
    display: block;
    clear: both;
    color: #CCC;
    background: #CCC;
    margin: 10px 0;
    height: 1px;
}

.formbox td {
    vertical-align: top;
}

a.btn,
.btn {
    background: url(https://recordvo.com/vendors/fmw/img/btn_bg.gif) repeat-x;
    display: inline-block;
    margin-right: 5px;
    border: none;
    top: -1px;
    position: relative;
    height: 17px;
    padding: 0 10px;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    line-height: 17px;
    color: #666;
    text-decoration: none;
    cursor: pointer;
}


/* used on the login page */

.widest a.btn,
.widest .btn {
    width: 100%;
}

.formbox td.submit a.btn {
    float: right;
    margin-left: 20px;
}


/*-----------------
X-> QUICK STATS	<-X
-----------------*/

table.quickstats {
    font-size: 1.3em;
    border: 1px solid #CCCCCC;
    border-bottom: 0px;
    margin-bottom: 0;
    border-top: 3px #666666 solid;
    vertical-align: top;
    border-right: 0;
}


/* help text icon - used for a links with empty anchor */

a.help_icon {
    background: url(https://recordvo.com/vendors/fmw/img/help.gif) no-repeat;
    display: inline-block;
    text-decoration: none;
    overflow: hidden;
    text-indent: -9999px;
    width: 15px;
    height: 15px;
    margin-left: -4px;
    margin-bottom: -3px;
}


/* same deal, but within stats table */

table.quickstats td a.help_icon {
    width: 15px;
    height: 15px;
    display: block;
    float: right;
}

table.quickstats td {
    padding: 5px 20px 3px 10px;
    border: 1px solid #CCCCCC;
    border-top: 0px;
    vertical-align: top;
    text-align: center;
    overflow: visible;
    width: 16%;
    border-left: 0;
}


/*-------------------------------------
X->   ELITE ZEBRA TABLES (v.2.0)	<-X
-------------------------------------*/

table.striped {
    border-spacing: 0px;
    text-align: center;
    line-height: 1.6em;
    /* changed from 2em */
}

* html table.striped {
    border-collapse: collapse;
}

table.striped > tfoot > tr > td,
table.striped > tbody > tr > td {
    font-family: "lucida grande", verdana, sans-serif;
    font-size: 8pt;
    padding: 3px 8px;
    background: #fff;
    width: 16%;
}

table.stripped tr.highlighted {
    color: orange;
    font-weight: 800;
}

table.striped tr td a.btn {
    top: 0px;
}

table.striped > thead > tr > td,
table.striped > thead > tr > th {
    color: #333;
    background-color: #E5E5E5;
    font-weight: bold;
    font-family: "lucida grande", verdana, sans-serif;
    font-size: 8pt;
    padding: 3px 8px;
}

table.striped > thead > tr > td a.btn {
    font-weight: normal;
}

table.striped > tbody > tr > td,
table.striped > thead > tr > th {
    border-left: 1px solid #D9D9D9;
    border-bottom: 1px solid #D9D9D9;
}

table.selectable > tbody > tr {
    cursor: pointer;
}

table.selectable > tbody > tr.disabled {
    font-style: italic;
    color: #999;
    cursor: default;
}

table.striped > tbody > tr.even > td {
    background: #F9F9F9;
    border-bottom: 1px solid #D9D9D9;
}

table.striped > tbody > tr.selected > td {
    background: #3d80df;
    color: #ffffff;
    border-left: 1px solid #346DBE;
    border-bottom: 1px solid #7DAAEA;
}

table.striped > tbody > tr.ruled > td {
    color: #000;
    background-color: #C6E3FF;
    /*font-weight: bold; */
    /*border-color: #3292FC; */
    border-left: 1px solid #D9D9D9;
}

table.striped > tbody:nth-child(odd) > tr > td {
    background: #F9F9F9;
}
table.striped > tbody:nth-child(even) > tr > td {
    background: #FFF;
}
/* Opera fix */

head:first-child+body table.striped > tbody > tr.ruled > td {
    background-color: #C6E3FF;
}

table.striped tr.selected a {
    background-color: inherit;
    color: #DDDDDD;
}

.stripe_button {
    padding: 3px;
    border: 1px solid #666;
    background-color: #C6E3FF;
    cursor: pointer;
}

table a.header {
    background-color: inherit;
    color: #333;
    font-weight: bold;
    display: block;
}

table a.header:hover {
    background-color: inherit;
    color: #999;
}

table span.sortarrow {
    background-color: inherit;
    color: #CCC;
    text-decoration: none;
}


/*.col1{ width:40%; text-align:left;}*/

.col2 {
    width: 75%;
    text-align: left;
}

table.striped > thead > tr.status-bar > td,
table.striped > tfoot > tr.status-bar > td {
    text-align: right;
    background-color: #e5e5e5;
    line-height: 1.6em;
    font-weight: normal;
}

table.striped > thead > tr.status-bar > td a,
table.striped > tfoot > tr.status-bar > td a {
    display: inline-block;
    margin: 0 0 0 5px;
    vertical-align: middle;
}

table.striped > thead > tr.status-bar > td select,
table.striped > tfoot > tr.status-bar > td select {
    height: 16px;
}
table.striped > thead > tr.status-bar > td {
    /* padding-top: 10px; */
    border-bottom: 1px solid #D9D9D9;
}


.filter_controls {
    line-height: 25px;
}

.filter_controls a:hover i.fa,
.filter_controls a:hover i.fas {
    opacity: 0.8;
}

.filter_controls select {
    font-size: 0.9em;
    border: 1px solid #999;
}


/* Sortable links */

table.striped thead tr td a {
    color: #666;
    text-decoration: underline;
}

table.striped thead tr td a.btn {
    text-decoration: none;
}

table.striped thead tr td a:hover {
    color: #000;
}


/* ----- add selectors here for font sizing ----- */

#JT_close_left,
#JT_close_right {
    font-size: 1.1em;
}

#JT_copy p,
#JT_copy ul {
    font-size: 1.1em;
}


/*---------------
x->  JTIP   <--X
---------------*/

#JT_arrow_left {
    background-image: url(https://recordvo.com/vendors/fmw/img/arrow_left.gif);
    background-repeat: no-repeat;
    background-position: left top;
    position: absolute;
    z-index: 101;
    left: -12px;
    height: 23px;
    width: 10px;
    top: -3px;
}

#JT_arrow_right {
    background-image: url(https://recordvo.com/vendors/fmw/img/arrow_right.gif);
    background-repeat: no-repeat;
    background-position: left top;
    position: absolute;
    z-index: 101;
    height: 23px;
    width: 11px;
    top: -2px;
}

#JT {
    position: absolute;
    z-index: 100;
    border: 2px solid #CCCCCC;
    background-color: #fff;
}

#JT_copy {
    padding: 10px 10px 10px 10px;
    color: #333333;
}

#JT_close_left {
    background-color: #CCCCCC;
    text-align: left;
    padding-left: 8px;
    padding-bottom: 5px;
    padding-top: 2px;
    font-weight: bold;
}

#JT_close_right {
    background-color: #CCCCCC;
    text-align: left;
    padding-left: 8px;
    padding-bottom: 5px;
    padding-top: 2px;
    font-weight: bold;
}

#JT_copy p {
    margin: 3px 0;
}

#JT_copy img {
    padding: 1px;
    border: 1px solid #CCCCCC;
}

.jTip {
    cursor: help;
}


/*
without this, help icon gets smushed against preceding text
using .help_icon instead of .jTip since it is more likely
to survive potential future renames

!important seems to only be needed when using dsn_help() within page_table_newLink()
*/

.help_icon {
    margin-left: 3px !important;
}


/* added way later */

div pre {
    font-size: 12px;
}

.widest {
    width: 100%;
}

.problem {
    color: red;
}

.stattable td.name {
    font-weight: 800;
    text-align: left;
    padding-left: 15px;
}

#sideba-nav {
    list-style-type: none;
}

.emphasis {
    font-size: +1;
    font-weight: 800;
}

a.new_item {
    color: green;
    font-weight: 100;
    font-size: 12px;
    line-height: 32px;
    text-decoration: none;
}

#users_list table.striped tr td {
    padding: 3px 0px;
}

#fmw_menu_item_favorite>ul {
    display: block !important;
}

#navbar {
    position: relative;
    z-index: 9;
}

.stattablebox-container {
    overflow-x: hidden;
    overflow-y: inherit;
    max-height: 75vh;
}

.stattablebox-container .stattablebox>tbody>tr>td .mute {
    width: 75px;
    white-space: nowrap;
    overflow: hidden;
    padding: 5px;
    text-overflow: ellipsis;
}


/*
    Make muted text right below page title a bit more readable
*/

#main>.mute {
    font-size: 11px;
}


/*
    Without this, muted text right below page title
    has list items that are too far to the left
*/

#main>.mute>ul {
    padding-left: 10px;
}

.ui-icon.ui-icon-arrowthick-2-n-s:before {
    display: inline;
    content: "=";
}

.ui-sortable-helper {
    max-height: 40px;
    min-height: 20px;
    display: block;
    overflow: hidden;
}

.ui-sortable>tr.ui-sortable-handle>td {
    cursor: pointer;
}

.ui-button {
    height: 22px;
}

.cke_contents.cke_reset {
    min-height: 260px !important;
}

.add-note .cke_contents.cke_reset {
    height: 295px !important;
}

.note_info {
    max-height: 35px;
    overflow-y: auto;
}

.ui-accordion .ui-accordion-header {
    padding: unset;
}

.ui-accordion-header-icon {
    display: none;
}

.ui-accordion .ui-accordion-content {
    padding: 1em 1em 1em 0;
}
.datepicker {
    /* dates like 09/28/2020 or 03/05/2008 can not properly fit into 70px */
    max-width: 83px;
    text-align: center;
}
.datetimepicker {
    /* 140 was not enought on FF with 10/20/2023 12:00 am value */
    /* 141 was still clipping right edge of `m` in `12 pm`, and with 142 clipping was gone but right padding seemed smaller than the left one */
    max-width: 144px;
    text-align: center;
}


/* Tooltip styles */

.tooltip-container { display: inline-block; }

.popper-tooltip-wrapper { position: relative; }

.popper-tooltip {
    background: #333;
    color: white;
    font-weight: normal;
    padding: 10px;
    font-size: 13px;
    line-height: 16px;
    text-align: left;
    border-radius: 4px;
    display: none;
    z-index: 1100;
    max-width: 300px;
    position: relative;
    margin: 0;
    white-space: normal;
}

.popper-tooltip ul {
    padding-left: 20px;
}
.popper-tooltip a {
    color: #B8E6FF !important;
    text-decoration: underline !important;
}

.popper-tooltip.active {
    display: block !important;
}

.popper-tooltip .arrow {
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    pointer-events: none; /* allow mouse clicks to pass through tooltip arrow div */
}

.popper-tooltip .arrow::before {
    position: absolute;
    content: "";
    border-color: transparent;
    border-style: solid;
    top: 0;
    left: 0;
}
.popper-tooltip[data-popper-placement^=bottom] .arrow {
    top: -6px;
}
.popper-tooltip[data-popper-placement^=bottom] .arrow::before {
    border-width: 0 8px 10px;
    border-bottom-color: #333;
}

.popper-tooltip[data-popper-placement^=top] .arrow {
    bottom: -12px;
}
.popper-tooltip[data-popper-placement^=top] .arrow::before {
  border-width: 10px 8px 0;
  border-top-color: #333;
}

.popper-tooltip[data-popper-placement^=left] .arrow {
    right: -12px;
}
.popper-tooltip[data-popper-placement^=left] .arrow::before {
    border-width: 8px 0 8px 10px;
  border-left-color: #333;
}

.popper-tooltip[data-popper-placement^=right] .arrow {
    left: -6px;
}
.popper-tooltip[data-popper-placement^=right] .arrow::before {
    border-width: 8px 10px 8px 0;
    border-right-color: #333;
}


.ui-accordion .ui-accordion-content li>a {
    overflow: hidden;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 10px;
    vertical-align: middle;
    max-width: 100%;
}
.ui-accordion .ui-accordion-content li.has-counter>a {
    max-width: calc(100% - 22px);
}

input:not([type=checkbox]),
input:not([type=radio]),
input:not([type=submit]),
input:not([type=button]),
select,
textarea {
    box-sizing: border-box;
    padding: 1px 2px;
}

table.menu-config tr:hover td {
    background: #E6E6E6;
}
table.menu-config tr:hover input {
    color: #000;
}

table.menu-config input[disabled]{
    pointer-events: none;
}

/* Notes styles */
.note-wrapper {
    display: inline-block;
    vertical-align: middle;
}
.note-edit-icon, .note-add-icon {
    text-decoration: none;
    cursor: pointer;
    font-size: large;
}
.note-add-icon { color:gray; }
.note-edit-icon { color:green; }

/* Select 2 styles */
.dsn-search-enhanced + .select2-container.select2-container--default .select2-selection__rendered li:after {
    font-family: "Font Awesome 5 Pro";
    top:0;
    left:-15px;
    content: "\f002";
    position: relative;
}
.dsn-search-enhanced {
    width: 150px;
}

.versions-wrapper table.diff-html td {
    border: none;
}

.versions-wrapper table.diff-html tbody.change.change-del td.old,
.versions-wrapper table.diff-html del {
    text-decoration: none;
    background-color: #FF726E;
}

.versions-wrapper table.diff-html tbody.change.change-ins td.new,
.versions-wrapper table.diff-html ins {
    text-decoration: none;
    background-color: #68F96E;
}

/* Menu search input */
.menu-search {
    position: relative;
    margin: 0 0 10px 0;
}
.menu-search .menu-search-input {
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 15px;
    padding: 1px 25px;
    border: 1px solid #6B6B6B;
    border-radius: 5px;
}
.menu-search .menu-search-icon,
.menu-search .menu-search-clear {
    position: absolute;
    top: 0;
    font-size: 15px;
    height: 30px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.menu-search .menu-search-icon {
    left: 5px;
}
.menu-search .menu-search-clear {
    right: 5px;
    cursor: pointer;
    display: none;
}
.menu-search .menu-search-icon i,
.menu-search .menu-search-clear i {
    color: #3980C3;
}
#sideba-nav li.search-hidden {
    display: none;
}

/*
    Visual Feedback for Auto-Saving Inputs

    Input stays green after AJAX is finished for ~2 seconds as afterall it will be green in 99% of all cases and
    thus drawing too much attention to an input when it works as expected is not needed. On the other hand,
    flashing for both red (on error) and yellow (while AJAX is in progress) seems to be very appropriate
    (former alerts that the inputs have not been saved at all, latter will be barely noticable except when
    AJAX takes a while e.g. due to slow network).
*/
.auto-save.save-progress {
    animation: 0.2s linear 0s infinite alternate pulse_yellow_shadow;
}
.auto-save.save-success {
    animation: 2s linear 0s 1 alternate pulse_green_shadow;
}
.auto-save.save-error {
    animation: 0.5s ease-out 0s 5 alternate pulse_red_shadow;
    box-shadow: 0 0 2px 2px rgba(255, 0, 0, 0.5);
}

@keyframes pulse_yellow_shadow { from { box-shadow: 0 0 5px 5px rgba(230, 255, 2, 0.5); } to { box-shadow: 0 0 0 0 rgba(230, 255, 2, 0.5); }  }
@keyframes pulse_green_shadow { from { box-shadow: 0 0 5px 5px rgba(172, 255, 47, 0.8); } to { box-shadow: 0 0 0 0 rgba(173, 255, 47, 0.5); }  }
@keyframes pulse_red_shadow { from { box-shadow: 0 0 5px 5px rgba(255, 0, 0, 0.5); } to { box-shadow: 0 0 1px 1px rgba(255, 0, 0, 0.5); }  }

.dsn-tooltip u {
    text-decoration-style: dotted;
}

.dsn-tabs {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-end;
    padding-bottom: 2px;
}

.dsn-tabs > li {
    border: 1px solid #869DAB;
    border-bottom: none;
    border-radius: 3px 3px 0 0;
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(236,234,226,1) 100%);
    cursor: pointer;
    padding: 3px 10px;
    margin: 2px 3px 0 3px;
}

.dsn-tabs > li.active {
    font-weight: bold;
    text-decoration: underline;
    padding-bottom: 5px;
}

.history-icon {
    display: inline-block;
}

.page-table-editable .cell-editor {
    position: relative;
    display: inline-block;
}
.page-table-editable .cell-editor-input {
    padding-right: 40px;
}

.page-table-editable .cell-edit-btn,
.page-table-editable .cell-save-btn,
.page-table-editable .cell-cancel-btn {
    cursor: pointer;
}
.page-table-editable .cell-save-btn,
.page-table-editable .cell-cancel-btn {
    font-size: 1.5em;
    border: none;
    background: none;
    height: 22px;
    position: absolute;
    top: 0;
}
.page-table-editable .cell-save-btn {
    color: green;
    right: 20px;
}
.page-table-editable .cell-cancel-btn {
    color: red;
    right: 2px;
}