/* VARIABLES */
:root {
    --frk-dark-red: #990000;
    --frk-dark-green: #009900;
    --frk-dark-blue: #000099;
    --function-color: rgb(87, 157, 201);
    --ajax-color: rgb(201, 87, 144);
    --class-color: rgb(127, 87, 201);
    --app-color: rgb(152, 201, 87);
    --addon-color: rgb(201, 87, 87);
}

/* CLEANING */
body {
    background: #FFF;
}

body:not(.can_scroll_width) {
    overflow-x: hidden;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
p,
blockquote,
th,
td,
table {
    margin: 0;
    padding: 0;
}

body,
div,
table,
input,
textarea,
ul,
li,
td,
label {
    font-family: Verdana;
    font-size: 13px;
    color: #333333;
    box-sizing: border-box;
}

table,
img {
    border: 0px;
}

img {
    vertical-align: top;
}

/* GENERAL */
.hidden {
    display: none !important;
}

.hide {
    display: none;
}

.clear {
    clear: both;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.vertalign {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

h1 {
    padding-bottom: 15px;
}

h2 {
    padding-bottom: 10px;
}

span.na {
    color: #999;
}

[data-slots] {
    font-family: monospace
}

.frkEndpointData {
    display: none !important;
}

/* GENERAL */


.over-shadow-light {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
}

.main-color {
    color: var(--main-color);
}

.flex {
    display: flex;
}

.flex-grow-1 {
    flex-grow: 1;
}

.flex-shrink-auto {
    flex-shrink: 1;
}

.flex.hide-empty>div:empty {
    display: none;
}

.grid {
    display: grid;
}

.wrap {
    flex-wrap: wrap;
}

.flex-row {
    flex-direction: column;
}

.flex-column {
    flex-direction: row;
}

.flex.distribute>div {
    flex: 1 1;
}

.gap-big {
    gap: 30px;
}

.gap {
    gap: 20px;
}

.gap-small {
    gap: 10px;
}

.align-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.align-bottom>div {
    align-self: flex-end;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

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

.padding-bottom {
    padding-bottom: 20px;
}

.margin-left-small {
    margin-left: 10px !important;
}

.margin-left {
    margin-left: 20px !important;
}

.margin-left-big {
    margin-left: 30px !important;
}

.margin-right-small {
    margin-right: 10px !important;
}

.margin-right {
    margin-right: 20px !important;
}

.margin-right-big {
    margin-right: 30px !important;
}


/* MESSAGES */
div.gen_msg {
    position: relative;
    -webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
    background: #EEE;
    padding: 10px 20px 10px 45px;
}

div.gen_msg.tooltip {
    background-color: #FFF;
    font-size: 12px;
    margin-top: 10px;
}

div.gen_msg.green {
    background-color: #DDFFDD;
    color: var(--frk-dark-green);
}

div.gen_msg.red {
    background-color: #FFDDDD;
    color: var(--frk-dark-red);
}

div.gen_msg.white {
    background-color: #FFF;
}

div.gen_msg.yellow {
    background-color: #FFEEDD;
    color: #993300;
}

div.gen_msg.orange {
    background-color: #FFEECC;
    color: #995500;
}

div.gen_msg span.sml {
    font-size: 11px;
    text-transform: uppercase;
}

div.gen_msg .icon {
    fill: #999;
    position: absolute;
    left: 17px;
    top: 50%;
    margin-top: -8px;
    height: 16px;
    width: 16px;
}

div.gen_msg.red .icon {
    fill: var(--frk-dark-red);
}

div.gen_msg.green .icon {
    fill: var(--frk-dark-green);
}

div.gen_msg.yellow .icon {
    fill: #993300;
}

div.gen_msg.orange .icon {
    fill: #995500;
}

div.gen_msg.white .icon {
    fill: #666;
}

div.gen_msg.small {
    font-size: 11px;
    padding: 7px 10px 8px 40px;
}

div.gen_msg.small .icon {
    left: 13px;
}

/* MIDDLEWARE ERROR */
.frkMiddleWareError {
    display: inline-block;
    text-align: left;
    border: 1px solid #F18B27;
    background: #FFF;
}

.frkMiddleWareError th {
    text-align: center;
    background: #F18B27;
    color: #FFF;
    padding: 7px 10px;
    font-size: 16px;
}

.frkMiddleWareError th svg.frk.icon {
    fill: #FFF;
}

.frkMiddleWareError td {
    color: #333;
    padding: 5px 10px;
}

.frkMiddleWareError td:first-child {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
}

/* SIMPLE DIV TABLE */
div.div_stable {
    display: table;
    width: 100%;
}

div.div_stable>div {
    display: table-row;
}

div.div_stable>div>div {
    display: table-cell;
    vertical-align: top;
}

/* GENERIC DIV TABLE */
div.div_table {
    display: table;
    width: 100%;
    margin-bottom: 20px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
}

div.div_table>div {
    display: table-row;
}

div.div_table>div>div {
    display: table-cell;
    vertical-align: middle;
}

div.div_table>div>div:nth-child(odd) {
    background: rgba(0, 0, 0, 0.05);
}

div.div_table>div>div>div {
    padding: 5px 10px;
    text-shadow: 1px 1px #FFF;
}

div.div_table>div>div.center>div {
    text-align: center;
}

div.div_table>div>div.right>div {
    text-align: right;
}

div.div_table>div:nth-child(even) {
    background: #EEE;
}

div.div_table>div:nth-child(odd) {
    background: #FFF;
}

div.div_table>div.header {
    background: #666;
}

div.div_table>div.header>div>div {
    color: #FFF;
    text-shadow: 1px 1px #000;
}

div.div_table div.sml {
    display: inline-block;
    margin-left: 5px;
    font-size: 11px;
}

div.div_table>div.header>div.isord {
    cursor: pointer;
}

div.div_table>div.header>div.ord {
    background-repeat: no-repeat;
    background-position: right center;
    background-color: #333;
}

div.div_table>div.header>div.ord.ASC {
    background-image: url(../common/images/ord_down.png);
}

div.div_table>div.header>div.ord.DESC {
    background-image: url(../common/images/ord_up.png);
}

div.div_table>div.header>div.ord>div {
    padding-right: 25px;
}

div.div_table>div.header>div.isord:hover {
    background-color: #555;
}

div.div_table>div.header>div.ord.right {
    background-position: center left 10px;
}

div.div_table div.ismod {
    cursor: pointer;
}

div.div_table div.ismod:hover {
    background: #DDD;
}

div.div_table div.ismod.modding {
    background: #000;
}

div.div_table div.ismod.modding>div {
    color: #FFF;
    text-shadow: 1px 1px #000;
}

div.div_table div.ismod.modding:hover {
    background-color: #000;
}

div.div_table .label {
    font-weight: bold;
}

.div_table .line>.check {
    text-align: center;
}

.div_table .line>.check .icon {
    width: 18px;
    height: 18px;
    margin-right: 0px;
}

.div_table .line>.check.check_false {
    background: rgba(255, 0, 0, 0.15);
}

.div_table .line>.check.check_false:nth-child(even) {
    background: rgba(255, 0, 0, 0.10);
}

.div_table .line>.check.check_true {
    background: rgba(0, 255, 0, 0.15);
}

.div_table .line>.check.check_true:nth-child(even) {
    background: rgba(0, 255, 0, 0.10);
}

.div_table .line>.check.check_false .icon {
    fill: var(--frk-dark-red);
}

.div_table .line>.check.check_true .icon {
    fill: var(--frk-dark-green);
}

.div_table .line>.check .icon.true {
    display: none;
}

.div_table .line>.check.check_true .icon.true {
    display: inline-block;
}

.div_table .line>.check.check_true .icon.false {
    display: none;
}

.div_table .line>.check.disabled {
    background: transparent;
}

.div_table .line>.check.disabled:nth-child(even) {
    background: transparent;
}

.div_table .line>.check.disabled .icon {
    fill: #BBB;
}

/* GENERIC TABLE */
table.div_table {
    display: table;
    width: 100%;
    margin-bottom: 20px;
    overflow: visible;
    -webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
}

table.div_table tr>div {
    vertical-align: middle;
}

table.div_table tr>th {
    text-align: left;
}

table.div_table tr>td:nth-child(odd) {
    background: rgba(0, 0, 0, 0.05);
}

table.div_table tr>td>div,
table.div_table tr>th>div {
    padding: 5px 10px;
    text-shadow: 1px 1px #FFF;
}

table.div_table tr>td.center>div {
    text-align: center;
}

table.div_table tr>td.right>div {
    text-align: right;
}

table.div_table tr:nth-child(even) {
    background: #EEE;
}

table.div_table tr:nth-child(odd) {
    background: #FFF;
}

table.div_table tr.header {
    background: #666;
}

table.div_table tr.header>td>div {
    color: #FFF;
    text-shadow: 1px 1px #000;
}

table.div_table div.sml {
    display: inline-block;
    margin-left: 5px;
    font-size: 11px;
}

table.div_table tr.total>td>div {
    font-weight: bold;
}

table.div_table tr.header>td.isord {
    cursor: pointer;
}

table.div_table tr.header>td.ord {
    background-repeat: no-repeat;
    background-position: right center;
    background-color: #333;
}

table.div_table tr.header>td.ord.ASC {
    background-image: url(../common/images/ord_down.png);
}

table.div_table tr.header>td.ord.DESC {
    background-image: url(../common/images/ord_up.png);
}

table.div_table tr.header>td.ord>div {
    padding-right: 25px;
}

table.div_table tr.header>td.isord:hover {
    background-color: #555;
}

table.div_table tr.header>td.ord.right {
    background-position: center left 10px;
}

table.div_table .label {
    font-weight: bold;
}

/* GENERIC TABS */
div.gen_tab {
    margin: 0px 15px 15px 0px;
    display: inline-block;
}

div.gen_tab>div {
    display: inline-block;
    height: 34px;
    line-height: 34px;
    font-weight: 700;
    text-transform: uppercase;
}

div.gen_tab>div.title {
    padding-right: 15px;
    font-size: 16px;
}

div.gen_tab>div.tab {
    text-transform: uppercase;
    padding: 0px 15px;
    margin-right: 1px;
    background-color: #EEE;
    text-shadow: 1px 1px #FFF;
    font-weight: 700;
    cursor: pointer;
    font-size: 14px;
}

div.gen_tab>div.tab:not(.selected):hover {
    background-color: #DDD;
}

div.gen_tab>div.tab.selected {
    background-color: #444;
    color: #FFF;
    text-shadow: 1px 1px #000;
}

div.gen_tab>div.label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: bold;
    padding-bottom: 3px;
    height: auto;
    line-height: 14px;
}

div.gen_tab.small>div {
    height: 24px;
    line-height: 24px;
}

div.gen_tab.small>div.title {
    padding-right: 10px;
}

div.gen_tab.small>div.tab {
    padding: 0px 10px;
    font-size: 11px;
}

/* GENERIC SEARCH */
div.gen_search {
    display: inline-block;
    position: relative;
}

div.gen_search>input {
    height: 34px;
    line-height: 34px;
    box-sizing: border-box;
    border: 1px solid #BBB;
    background: #EEE;
    padding: 0px 10px;
    width: 200px;
    font-size: 16px;
}

div.gen_search>input.init {
    color: #999;
}

div.gen_search>div.empty {
    position: absolute;
    right: 10px;
    top: 6px;
    text-align: center;
    height: 20px;
    width: 20px;
    line-height: 20px;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    display: none;
}

div.gen_search>div.show {
    display: inline;
}

.formar div.gen_search>input {
    height: auto;
    line-height: 20px;
}

/* SHADOWS */
.soft_shadow {
    -webkit-box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.25);
}

.over_shadow {
    -webkit-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.5);
}

.med_shadow {
    -webkit-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
}

.sml_shadow {
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
}

/* BASE STRUCT */
html,
body {
    height: 100%;
}

#appWrap {
    height: 100%;
}

#content {
    padding: 30px;
}

a {
    text-decoration: none;
}

/* STRUCT LOGIC */
#appWrap.pkey_none #page_title,
#appWrap.pkey_none #trackbar {
    display: none;
}

#user_actions:empty {
    display: none;
}

/* ICON DEFAULT */
.icon.frk {
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
}

.icon.frk:not(.nofill) {
    fill: #333;
}

.icon.frk.nofill {
    fill: none;
}

/* MODE TOGGLER */
#mode_toggler {
    padding: 10px 15px;
    background: #DDD;
    cursor: pointer;
    line-height: 20px;
}

#mode_toggler:hover {
    background: #666;
}

#mode_toggler:hover .icon {
    fill: #FFF;
}

#mode_toggler.absolute {
    bottom: 0px;
    left: 0px;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
}

#mode_toggler div.text {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 20px;
    display: inline-block;
}

#mode_toggler:hover div.text {
    color: #FFF;
    text-shadow: 1px 1px #000;
}

/* APP MENU */
#appStruct>div>div.menu {
    position: relative;
}

#appStruct>div>div.menu>div.remove_scroll {
    padding-bottom: 40px;
}

.app_menu {
    padding-top: 10px;
}

.app_menu.vertical {}

.app_menu.horizontal {}

/* TODO */
.app_menu .item {}

.app_menu .item>a {
    text-decoration: none;
}

.app_menu .item>a>div.label {
    padding: 10px 15px;
    transition: all 0.25s;
    line-height: 16px;
}

.app_menu .item>a>div.label>div.text {
    color: #666;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 16px;
    display: inline-block;
}

.app_menu .icon {
    opacity: 0.5;
}

.app_menu .level.lvl1>.item>a>div.label {
    padding-left: 45px;
}

.app_menu .level.lvl2>.item>a>div.label {
    padding-left: 75px;
}

.app_menu .level.lvl3>.item>a>div.label {
    padding-left: 105px;
}

.app_menu .item.track>a>div.label {
    color: #333;
}

.app_menu .item.track>a>div.label .icon {
    opacity: 1;
}

.app_menu .item.selected>a>div.label {
    background: rgba(0, 0, 0, 0.075);
    box-shadow: inset 0px 10px 5px -10px rgba(0, 0, 0, 0.25), inset 0px -10px 5px -10px rgba(0, 0, 0, 0.25);
}

.app_menu .item.selected>a>div.label>div.text {
    color: #333;
}

.app_menu .item.selected>a>div.label .icon {
    opacity: 1;
}

.app_menu .item:not(.selected)>a>div.label:hover {
    background: rgba(0, 0, 0, 0.075);
    color: #333;
}

.app_menu .item:not(.selected)>a>div.label:hover .icon {
    opacity: 1;
}

.app_menu .item:not(.track, .selected)>.level {
    display: none;
}

.app_menu.showall .level {
    display: block !important;
}

.app_menu .icon.frk {
    width: 16px;
    height: 16px;
}

/* COLLAPSE MENU */
#collapseMenu {
    position: relative;
}

#collapseMenu>div.collapse_wrapper {
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    overflow: hidden;
    width: 100%;
}

#collapseMenu>div.collapse_wrapper>div.collapse_content {
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}

#collapseMenu>div.collapse_static {
    height: 100%;
}

#collapseMenu.collapsed div.text {
    opacity: 0;
    transition: all 0.5s;
}

#collapseMenu.collapsed.expanding div.text {
    opacity: 1;
}

#collapseMenu.collapsed:not(.expanding) .app_menu .level>.item>a>div.label {
    padding-left: 15px !important;
}

#collapseMenu div.locker {
    position: absolute;
    top: 50%;
    margin-top: -20px;
    z-index: 1000;
    border-radius: 100px;
    padding: 10px;
    margin-left: -20px;
    border: 1px solid;
    cursor: pointer;
    display: none;
}

#collapseMenu div.locker>svg {
    width: 16px;
    height: 16px;
    margin: 0px;
    transition: all 0.25s;
}

#collapseMenu div.padder {
    position: absolute;
    width: 50px;
    height: 100%;
    top: 0px;
    left: 48px;
    display: none;
    z-index: 999;
}

/* LOGO DEFAULT */
#appLogo {
    padding: 15px;
    text-align: left;
    box-sizing: border-box;
    height: 100%;
    position: relative;
}

#appLogo>img {
    max-width: 100%;
    max-height: 40px;
    vertical-align: top;
}

/* CURRENT TIME */
#current_time {
    display: inline-block;
}

#current_time>div {
    color: #FFF;
}

#current_time>div.date {
    color: #666;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
}

#current_time>div.time {
    font-size: 21.3px;
    line-height: 21.3px;
    padding-top: 2px;
}

/* TRACKBAR AND PAGE TITLE */
#trackbar a {
    text-decoration: none;
}

#trackbar div {
    color: #FFF;
    font-size: 11px;
    line-height: 14px;
}

#trackbar>div.item {
    display: inline-block;
    opacity: 0.5;
}

#trackbar div.label {
    color: #FFF;
    text-transform: uppercase;
    display: inline-block;
}

#trackbar>div.item::after {
    content: '>';
    padding: 0px 7px;
    display: inline-block;
}

#trackbar>div.item:last-child,
#trackbar>div.item:hover {
    opacity: 1;
}

#trackbar>div.item:last-child::after {
    display: none;
}

#page_title {
    color: #FFF;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 24px;
    padding-top: 5px;
}

/* OPTIONS */
#options {
    position: absolute;
    top: 50%;
    right: 30px;
    margin-top: -15px;
}

#options>div {
    display: inline-block;
    vertical-align: top;
}

/* LANGUAGE SWITCHER */
#language_switcher {
    background: #444;
    margin-left: 10px;
}

#language_switcher>div {
    cursor: pointer;
    height: 30px;
    line-height: 30px;
    width: 30px;
    text-align: center;
    color: #FFF;
    display: inline-block;
    text-transform: uppercase;
    font-size: 12px;
}

#language_switcher>div:hover:not(.selected) {
    background: #666;
}

#language_switcher>div.selected {
    cursor: default;
    font-weight: bold;
    color: #333;
    background: #FFF;
}

/* THEME SWITCHER */
#theme_switcher {
    margin-left: 10px;
    position: relative;
}

#theme_switcher:empty {
    display: none;
}

#theme_switcher>div.current {
    height: 30px;
    width: 30px;
    background: #444;
    padding: 7px;
    cursor: pointer;
}

#theme_switcher:hover>div.current {
    background: #666;
}

#theme_switcher>div.current>svg {
    height: 16px;
    width: 16px;
    fill: #FFF;
}

#theme_switcher>div.choices {
    display: none;
    position: absolute;
    right: 0px;
    top: 100%;
    padding-top: 5px;
    z-index: 999;
}

#theme_switcher:hover>div.choices {
    display: block;
}

#theme_switcher:hover>div.choices>div {
    padding: 10px 15px;
    white-space: nowrap;
    background: #DDD;
    cursor: pointer;
    border-top: 1px solid #BBB;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 20px;
}

#theme_switcher:hover>div.choices>div:hover {
    color: #FFF;
    text-shadow: 1px 1px #000;
    background: #666;
}

#theme_switcher:hover>div.choices>div:first-child {
    border-top: 0px;
}

#theme_switcher:hover>div.choices>div:hover>.icon {
    fill: #FFF;
}

/* NOTIFICATIONS */

#notification_info>div.current {
    height: 30px;
    width: 30px;
    background: #444;
    padding: 7px;
    cursor: pointer;
}

#notification_info>div.current>svg {
    height: 16px;
    width: 16px;
    fill: white;
}

#notification_count {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    width: 16px;
    height: 16px;
    background: red;
    border-radius: 8px;
    position: relative;
    left: 13px;
    top: -7px;
    font-size: 10px;
    font-weight: bold;
}

#notification_panel {
    display: none;
    position: absolute;
    z-index: 999;
    right: calc(100% - 30px);
    padding-top: 5px;
    width: 400px;
}

#notification_panel>.notification_list {
    max-height: 500px;
}

#notification_info:hover>#notification_panel {
    display: block;
}

#notification_mass_action {
    background: white;
    text-align: center;
    padding: 10px;
}

.noNotifications {
    background: rgba(250, 250, 250, 255);
    padding: 15px;
    pointer-events: none;
    color: #888;
    text-align: center;
}

/* HELPDESK TOGGLE */
#helpdesk {
    margin-left: 10px;
    position: relative;
}

#helpdesk:empty {
    display: none;
}

#helpdesk>div {
    height: 30px;
    width: 30px;
    background: #444;
    padding: 7px 6px;
    cursor: pointer;
}

#helpdesk:hover>div {
    background: #666;
}

#helpdesk>div>svg {
    height: 16px;
    width: 16px;
    fill: #FFF;
}

#helpdesk>div.toggled {
    background: #FFF;
}

#helpdesk>div.toggled>svg {
    fill: #333;
}

/* SCROLLER */
.scroller.width {
    overflow-x: hidden;
}

.scroller.width.scrollx {
    overflow-x: scroll;
}

.scroller.height {
    overflow-y: hidden;
}

.scroller.height.scrolly {
    overflow-y: scroll;
}

.scroller.remove_scroll {
    height: auto !important;
    overflow: auto;
}

/* SCROLLBARS */

/* CONNECTIVITY */
#connectZone {
    text-align: center;
}

#connectZone>div.wrap {
    display: inline-block;
    text-align: left;
    background: #F5F5F5;
    padding: 20px 30px;
    border-radius: 5px;
}

#connectZone .mcui-button {
    text-align: center;
    display: block;
    padding: 0px 15px;
}

#frkLocalConnectBtn {
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    margin-bottom: 0px;
}

.formar #connectZone .mcui-button {
    margin-bottom: 10px;
}

.formar #frkLocalConnectBtn {
    padding: 0px 10px !important;
    margin-bottom: 0px !important;
}

#connectZone label {
    padding-bottom: 5px;
}

#connectZone input {
    min-width: 230px;
    width: 100%;
    padding: 10px;
}

#connectZone div.option {
    margin: 0px 0px 15px 0px;
    font-size: 12px;
}

#connectZone div.option:last-child {
    margin-bottom: 0px;
}

#connectZone .local-form-zone .title {
    text-align: center;
    font-size: 18px;
    padding-bottom: 15px;
}

#connectZone .local-form-zone .desc {
    width: 230px;
    padding-bottom: 15px;
    font-size: 12px;
    color: #999;
}

#connectZone div.response {
    width: 230px;
    padding-bottom: 15px;
}

#connectZone div.response:empty {
    display: none;
}

#connectZone .gen_msg {
    font-size: 12px;
}

#connectZone .local-form-zone .mcui-button:last-child {
    margin-bottom: 0px;
}

#connectZone .mcui-button.return {
    margin: 15px 0px 0px 0px;
}

#frkConnectivityResponse {
    display: none;
}

#brandingZone {
    text-align: center;
    padding-top: 30px;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
}

#brandingZone img {
    margin-top: 10px;
    height: 70px;
}

#frkUserActions {
    margin-left: 10px;
    position: relative;
    box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.25);
}

#frkUserActions>div.icon {
    height: 30px;
    width: 30px;
    background: #444;
    padding: 7px;
    cursor: pointer;
}

#frkUserActions:hover>div.icon {
    background: #666;
}

#frkUserActions>div.icon>svg {
    height: 16px;
    width: 16px;
    fill: #FFF;
}

#frkUserActions>div.options {
    display: none;
    position: absolute;
    right: 0px;
    top: 100%;
    padding-top: 5px;
    z-index: 9999;
}

#frkUserActions>div.options>div {
    padding: 10px 15px;
    white-space: nowrap;
    background: #DDD;
    border-top: 1px solid #BBB;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 20px;
}

#frkUserActions>div.options>div:not(.info):hover {
    color: #FFF;
    text-shadow: 1px 1px #000;
    background: #666;
    cursor: pointer;
}

#frkUserActions>div.options>div:first-child {
    border-top: 0px;
}

#frkUserActions>div.options>div:hover>.icon {
    fill: #FFF;
}

#frkUserActions>div.options>div.info {
    padding: 3px 15px;
    text-align: right;
}

#frkUserActions>div.options>div.info>div>div {
    font-size: 11px;
}

#frkUserActions>div.options>div.info>div>div>div {
    opacity: 0.3;
    font-size: 11px;
}

#frkUserActions>div.options>div.info>div>div>div:first-child {
    padding-right: 5px;
}

#frkUserActions>div.options>div.info>div>div.label {
    font-weight: bold;
    opacity: 0.5;
}

#frkUserActions>div.options>div.info>div>div .ms {
    margin-left: 3px;
    font-size: 10px;
}

#frkUserActions>div.options>div.info>div>div {
    display: flex;
    justify-content: space-between;
}

#frkUserActions:hover>div.options {
    display: block;
}

#user_tab {
    padding: 10px 15px;
    line-height: 16px;
    white-space: nowrap;
}

#user_tab .icon {
    width: 16px;
    height: 16px;
    fill: #999;
}

#user_tab div.text {
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    display: inline-block;
}

/* TOOLTIPS */
#frkTooltip {
    z-index: 9999999;
    position: absolute;
    border-radius: 5px;
    background: #FFF;
    margin-top: 15px;
    transform: scale(0.85);
    max-width: 200px;
    box-sizing: border-box;
    text-align: center;
    border: 2px solid #BBB;
}

#frkTooltip.fromModal {
    position: fixed;
}

#frkTooltip>div.wrap {
    position: relative;
    padding: 5px 7px;
    color: #333;
    font-size: 12px;
}

#frkTooltip>div.wrap>div.arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #BBB;
    top: -10px;
    left: 50%;
    margin-left: -10px;
}

#frkTooltip>div.wrap>div.arrow.bottom {
    border-bottom: none;
    border-top: 10px solid #FFF;
    top: 100%;
}

#frkTooltip>div.wrap>div.arrow:before {
    content: ' ';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 10px solid #FFF;
    position: absolute;
    margin-left: -8px;
    margin-top: 2px;
}

#frkTooltip>div.wrap>div.arrow.bottom:before {
    border-bottom: none;
    border-top: 10px solid #FFF;
    margin-top: -12px;
}

#frkTooltip.fadein {
    transform: scale(1);
}

/* TEMP NOTICE */
#frkTempNotice {
    position: fixed;
    z-index: 99999999;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
}

#frkTempNotice>div.content {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    text-align: left;
    background-color: #FFEECC;
    max-width: 300px;
    border: 1px solid #995500;
    font-weight: bold;
}

#frkTempNotice>div.content>div.wrap {
    position: relative;
    padding: 15px 15px 15px 45px;
    font-size: 13px;
    color: #333 !important;
}

#frkTempNotice>div.content>div.wrap .icon {
    position: absolute;
    left: 15px;
    top: 50%;
    margin-top: -10px;
    fill: #995500;
}

/* TABLE PAGING */
.frk_tblpager {
    text-align: center;
    background: #FFF;
    border-top: 1px solid #BBB;
}

.frk_tblpager .mcui-button {
    padding: 3px 5px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    margin: 5px;
}

.frk_tblpager .mcui-button>svg {
    margin: 0px;
    height: 16px;
    width: 16px;
    fill: #666;
}

.formar .frk_tblpager .mcui-button>svg {
    height: 14px;
    width: 14px;
}

.frk_tblpager .mcui-button.next {
    padding: 3px 4px 3px 6px;
}

.frk_tblpager .mcui-button.back {
    padding: 3px 6px 3px 4px;
}

.frk_tblpager .text {
    display: inline-block;
    vertical-align: top;
    line-height: 24px;
    margin: 5px;
}

/* STICKY HEADERS */
.sticky_header {
    position: absolute;
    z-index: 10;
    display: none;
}

.sticky_header * {
    box-sizing: border-box;
}

.sticky_header.toggled {
    display: block;
}

/**************/
/* MY ACCOUNT */
/**************/
#frkMyAccountFormZone>div {
    margin-bottom: 30px;
    padding: 15px;
    background: #F5F5F5;
}

#frkMyAccountFormCommit {
    margin-bottom: 0px;
}

#frkMyAccountError {
    margin-top: 10px;
    margin-bottom: 10px;
}

#frkMyAccountError:empty {
    display: none;
}

#frkMyAccountLoader {
    display: none;
}

#frkMyAccountResponse {
    display: none;
}

#frkMyAccountDone {
    display: none;
}

/************/
/* HELPDESK */
/************/

/* help.request */
#frkHelpRequestNewZone>div {
    margin-bottom: 30px;
    padding: 15px;
    background: #F5F5F5;
}

#frkHelpRequestNewCommit {
    margin-bottom: 0px;
}

#frkHelpRequestNewBtn,
#frkHelpRequestNewCommit,
#frkHelpRequestBackBtn,
#frkHelpRequestAddComment,
#frkHelpRequestAddCommentCommit {
    display: block;
    text-align: center;
}

#frkHelpRequestNewBtn,
#frkHelpRequestBackBtn {
    margin-bottom: 30px;
}

#frkHelpRequestAddComment,
#frkHelpRequestNewMessageZone {
    margin-top: 20px;
}

#frkHelpRequestNewZone,
#frkHelpRequestNewMessageZone {
    display: none;
}

#frkHelpRequestMessageResponse {
    padding-top: 20px;
}

#frkHelpRequestMessageResponse:empty {
    display: none;
}

#frkHelpRequestNewZone #frkHelpRequestFrm {
    padding-bottom: 10px;
}

#frkHelpRequestNewMessageZone #frkHelpRequestMessageFrm {
    padding-bottom: 10px;
}

#appRequestsList {}

#appRequestsList>div.ticket {
    display: table;
    width: 100%;
    overflow: hidden;
    border-radius: 5px;
    background: #F5F5F5;
    opacity: 0.8;
    border: 1px solid #DDD;
    margin-bottom: 10px;
}

#appRequestsList>div.ticket:last-child {
    margin-bottom: 0px;
}

#appRequestsList>div.ticket:hover {
    opacity: 1;
    cursor: pointer;
    border-color: #CCC;
}

#appRequestsList>div.ticket.open {}

#appRequestsList>div.ticket.closed {}

#appRequestsList>div.ticket>div {
    display: table-row;
}

#appRequestsList>div.ticket>div>div {
    display: table-cell;
    padding: 5px 10px;
    vertical-align: middle;
    color: #333;
}

#appRequestsList>div.ticket>div>div>label {
    display: block;
    font-size: 10px;
    text-transform: uppercase;
    font-weight: bold;
    color: #333;
}

#appRequestsList>div.ticket>div>div.num {
    font-size: 12px;
}

#appRequestsList>div.ticket>div>div.date {
    font-size: 12px;
}

#appRequestsList>div.ticket>div>div.subject {
    font-weight: bold;
    width: 100%;
}

#appRequestsList>div.ticket>div>div:not(.subject) {
    white-space: nowrap;
}

#appRequestsList>div.ticket>div>div.status {
    text-transform: uppercase;
    font-weight: bold;
    color: #BBB;
    font-size: 16px;
    text-align: right;
}

#appRequestsList>div.ticket:hover>div>div.status {
    color: #666;
}

#appRequestsList>div.ticket.open {
    background: #FFF5DD;
    border-color: #EEDD66;
}

#appRequestsList>div.ticket.open:hover {
    border-color: #DDCC55;
}

#appRequestsList>div.ticket.open>div>div.status {
    color: #BB9966;
}

#appRequestsList>div.ticket.open:hover>div>div.status {
    color: #995500;
}

#frkHelpRequestDetails {}

#frkHelpRequestDetails>div.title {
    width: 100%;
    overflow: hidden;
    border-radius: 5px;
    background: #F5F5F5;
    border: 1px solid #DDD;
    margin-bottom: 5px;
}

#frkHelpRequestDetails>div.description {
    width: 100%;
    border-radius: 5px;
    background: #F5F5F5;
    border: 1px solid #DDD;
    margin-bottom: 20px;
}

#frkHelpRequestDetails>div.description>div {
    color: #333;
    padding: 7px 10px 7px 10px;
}

#frkHelpRequestDetails>div.description>.attachments {
    display: block !important;
    padding: 7px 10px 7px 10px;
    background: rgba(0, 0, 0, 0.05);
}

#frkHelpRequestDetails>div.description>.attachments:empty {
    display: none !important;
}

#frkHelpRequestDetails>div.description>.subject {
    padding: 7px 10px 7px 10px;
    background: rgba(0, 0, 0, 0.05);
    font-weight: bold;
}

#frkHelpRequestDetails>div.description>.description_text {}

#frkHelpRequestDetails>div.description>.attachments>div.attachment {
    display: inline-block;
    margin-right: 15px;
    line-height: 16px;
}

#frkHelpRequestDetails>div.description>.attachments>div.attachment>svg {
    margin-right: 5px;
}

#frkHelpRequestDetails>div.title>div>div {
    padding: 10px 10px;
    vertical-align: middle;
    color: #333;
}

#frkHelpRequestDetails>div.title>div>div.num {
    font-size: 12px;
}

#frkHelpRequestDetails>div.title>div>div.subject {
    width: 100%;
    font-weight: bold;
}

#frkHelpRequestDetails>div.title>div>div.status {
    text-transform: uppercase;
    font-weight: bold;
    color: #BBB;
    font-size: 16px;
    text-align: right;
}

#frkHelpRequestDetails>div.title>div>div.status>div.mcui-button {
    margin: 0px 5px 0px 0px;
}

#frkHelpRequestDetails>div.title>div>div:not(.subject) {
    white-space: nowrap;
}

#frkHelpRequestDetails.open>div.title {
    background: #FFF5DD;
    border-color: #EEDD66;
}

#frkHelpRequestDetails.open>div.title>div>div.status {
    color: #BB9966;
}

#frkHelpRequestDetails>div.comments {}

#frkHelpRequestDetails>div.comments>div.comment {
    overflow: hidden;
    border-radius: 5px;
    margin-bottom: 20px;
    background: #F5F5FF;
    border: 1px solid #DDF;
}

#frkHelpRequestDetails>div.comments>div.comment>div.content {
    padding: 7px 10px 10px 10px;
    color: #333;
}

#frkHelpRequestDetails>div.comments>div.comment>div.date {
    text-align: right;
    font-size: 11px;
    padding: 0px 10px 10px 10px;
    color: #666;
}

#frkHelpRequestDetails>div.comments>div.comment>div.author {
    font-size: 12px;
    padding: 7px 10px 7px 10px;
    color: #666;
    background: rgba(0, 0, 0, 0.05);
}

#frkHelpRequestDetails>div.comments>div.comment.tech {
    background: #F5FFF5;
    border-color: #DFD;
}

#frkHelpRequestDetails.closed #frkRequestCloseStatusBtn {
    display: none;
}

#frkHelpRequestDetails div.attachments {
    display: inline-flex !important;
    align-items: flex-end;
    padding: 2px 2px;
    flex-wrap: wrap;
}

#frkHelpRequestDetails a.thumbnail {
    margin-left: 0px;
    border: 1px solid #C0C0C0;
    ;
    border-radius: 4px;
    padding: 10px;
    margin-top: 10px;
    background: rgba(255, 255, 255, 1);
}

#frkHelpRequestDetails a.thumbnail:hover {
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

#frkHelpRequestDetails a.thumbnail>img {
    max-width: 250px;
    max-height: 250px;
}

#frkHelpRequestDetails div.comment div.author>div.attachment {
    display: inline-block;
    margin-right: 15px;
    line-height: 16px;
}

#frkHelpRequestDetails div.comment div.author>div.attachment>svg {
    margin-right: 5px;
}

#frkHelpRequestFrm .mcui-select .options {
    width: 100% !important;
}

#frkHelpRequestFrm textarea,
#frkHelpRequestFrm input,
#frkHelpRequestFrm .mcui-select .holder {
    background: #FFF;
}

/*******/
/* FAQ */
/*******/
#frkFaqSearchField {
    padding-top: 17px;
}

#frkFaqList>div.faq {
    margin-bottom: 15px;
    opacity: 0.8;
}

#frkFaqList>div.faq>div {
    padding: 10px 15px;
    border: 3px solid #BBB;
    border-radius: 10px;
}

#frkFaqList>div.faq>div.question {
    background: #F5F5F5;
    font-size: 16px;
    cursor: pointer;
    font-weight: bold;
}

#frkFaqList>div.faq>div.answer {
    display: none;
    border-top: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

#frkFaqList>div.faq.toggled>div.question {
    border-bottom: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

#frkFaqList>div.faq.toggled {
    opacity: 1;
}

#frkFaqList>div.faq:hover {
    opacity: 1;
}

#frkFaqNoResult {
    display: none;
}

/**********/
/* GUIDES */
/**********/
.guide_start_btn {
    margin: 10px 0px 0px 0px;
    display: block;
    text-align: center;
}

.frk_instruction {
    z-index: 9999998;
    position: absolute;
    border-radius: 5px;
    background: #FFF;
    margin-top: 15px;
    transform: scale(0.85);
    max-width: 200px;
    box-sizing: border-box;
    text-align: center;
    dislay: none;
}

.frk_instruction>div.wrap {
    position: relative;
    padding: 5px 7px;
    color: #333;
    font-size: 12px;
}

.frk_instruction>div.wrap>div.arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #FFF;
    top: -10px;
    left: 50%;
    margin-left: -10px;
}

.frk_instruction>div.wrap>div.arrow.bottom {
    border-bottom: none;
    border-top: 10px solid #FFF;
    top: 100%;
}

.frk_instruction.fadein {
    transform: scale(1);
}

.frk_instruction div.opt {
    font-size: 10px;
    color: #FFF;
    background: #999;
    line-height: 10px;
    text-transform: uppercase;
    display: inline-block;
    padding: 2px 3px;
    margin-right: 5px;
}

#frkGuideCurtain {
    z-index: 9999997;
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.frk_clickbox {
    z-index: 9999999;
    position: absolute;
    cursor: pointer;
    box-sizing: border-box;
    border: 3px solid #EEDD66;
}

.frk_clickbox:hover {
    border: 3px solid #99DD99;
}

.frk_inputbox {
    z-index: 9999999;
    position: absolute;
    box-sizing: border-box;
}

#guideInputBox {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
}

#frkGuideOptions {
    z-index: 99999999;
    position: absolute;
    top: 0px;
    left: 50%;
}

#frkGuideOptions {}

#frkGuideOptions div.wrap {
    background: #555;
    padding: 8px;
    overflow: hidden;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border: 3px solid #999;
    border-top: 0px;
}

#frkGuideOptions div.mcui-button {
    padding: 0px 7px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    margin: 0px;
}

/**************/
/* Admin zone */
/**************/

/* access.groups */
#frkGroupZoneChooser>div.cmenu {
    display: inline-block;
    vertical-align: top;
}

#frkGroupZoneChooser>div.cmenu>div.label {
    line-height: 16px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 500;
    padding: 5px;
}

#frkGroupZoneChooser>div.cmenu>div.label .icon {
    height: 16px;
    width: 16px;
    vertical-align: middle;
}

#frkGroupZoneChooser>div.cmenu>div.cpages {
    padding: 5px 0px 0px 5px;
}

#frkGroupZoneChooser>div.cmenu>div.cpages>div.cpage {
    display: inline-block;
    vertical-align: top;
    margin: 0px 5px 5px 0px;
    padding: 5px 10px 5px 30px;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: center left 5px;
    background-image: url(../common/images/ffront_abad.png);
    cursor: pointer;
    border: 1px solid #BBB;
    background-color: #DDD;
    border-radius: 5px;
    text-shadow: 1px 1px #fff;
}

#frkGroupZoneChooser>div.cmenu>div.cpages>div.cpage.selected {
    background-image: url(../common/images/ffront_agood.png);
}

#frkGroupZoneChooser>div.cmenu>div.cpages>div.cpage:hover {
    background-color: #CCC;
}

/* access.logs */
#appWrap.pkey_actionlogs #fmanListTbl .line.rec div.action,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry div.master_action {
    background: rgba(255, 240, 200, 0.5);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec div.action>div,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry div.master_action>div {
    color: #996600;
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_add div.action,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_add div.master_action {
    background: rgba(200, 255, 200, 0.5);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_add div.action>div,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_add div.master_action>div {
    color: var(--frk-dark-green);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_rem div.action,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_rem div.master_action {
    background: rgba(255, 200, 200, 0.5);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_rem div.action>div,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_rem div.master_action>div {
    color: var(--frk-dark-red);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_mail div.action,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_mail div.master_action {
    background: rgba(200, 200, 255, 0.5);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_mail div.action>div,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_mail div.master_action>div {
    color: var(--frk-dark-blue);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_toggle div.action,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_toggle div.master_action {
    background: rgba(239, 200, 255, 0.5);
}

#appWrap.pkey_actionlogs #fmanListTbl .line.rec.action_toggle div.action>div,
#appWrap.pkey_actionlogs #crudsterListOutputZone .entry.action_toggle div.master_action>div {
    color: #750099;
}

#appWrap.pkey_actionlogs textarea#message,
#crudsterRecordForm_message {
    height: 300px;
}

#appWrap.pkey_actionlogs .field.full {
    padding-bottom: 15px;
}

#appWrap.pkey_actionlogs #fmanListTbl .line.is_error div.action>div:after {
    content: 'ERR.';
    vertical-align: middle;
    margin-left: 5px;
    font-size: 11px;
    line-height: 11px;
    padding: 1px 3px;
    background: #FFDDDD;
    color: var(--frk-dark-red);
    border: 1px solid var(--frk-dark-red);
}

#frkLogsMore.crudster,
#frkUserKeyZone.crudster,
#frkUserAPIZone.crudster {
    background: rgba(0, 0, 0, 0.05);
}

#frkLogsMore.crudster,
#frkUserAPIZone.crudster {
    margin-top: 20px;
}

#frkLogsMore.crudster>div.title,
#frkUserKeyZone.crudster>div.title,
#frkUserAPIZone.crudster>div.title {
    padding: 10px 20px;
    font-size: 16px;
    background: rgba(0, 0, 0, 0.05);
    font-weight: bold;
}

#frkLogsMore.crudster>div.content,
#frkUserKeyZone.crudster>div.content,
#frkUserAPIZone.crudster>div.content {
    padding: 20px 0px 0px 20px;
}

#frkLogsMore.crudster>div.content>div.field,
#frkUserKeyZone.crudster>div.content>div.field,
#frkUserAPIZone.crudster>div.content>div.field {
    margin: 0px 20px 20px 0px;
}

#frkLogsMore.crudster>div.content>div.field:not(.full),
#frkUserKeyZone.crudster>div.content>div.field:not(.full),
#frkUserAPIZone.crudster>div.content>div.field:not(.full) {
    display: inline-block;
}

#frkLogsMore div.part {
    border-bottom: 1px solid #BBB;
    padding-bottom: 2px;
    margin-bottom: 2px;
    font-weight: bold;
}

#frkLogsMore div.subpart {
    font-weight: bold;
    padding-bottom: 2px;
}

/* access.access */
#frkAdminAccessTbl .acol {
    white-space: nowrap;
}

#frkAdminAccessTbl .acol>div {
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    width: 50%;
    vertical-align: top;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 16px;
    padding: 7px 10px;
}

#frkAdminAccessTbl .acol>div .icon {
    display: none;
    width: 16px;
    height: 16px;
}

#frkAdminAccessTbl .acol>div.true .icon.true,
#frkAdminAccessTbl .acol>div.false .icon.false {
    display: inline-block;
}

#frkAdminAccessTbl .acol>div.true {
    color: var(--frk-dark-green);
    background: rgba(0, 255, 0, 0.15);
}

#frkAdminAccessTbl .acol>div.true:nth-child(even) {
    background: rgba(0, 255, 0, 0.10);
}

#frkAdminAccessTbl .acol>div.true .icon.true {
    fill: var(--frk-dark-green);
}

#frkAdminAccessTbl .acol>div.false {
    color: var(--frk-dark-red);
    background: rgba(255, 0, 0, 0.15);
}

#frkAdminAccessTbl .acol>div.false:nth-child(even) {
    background: rgba(255, 0, 0, 0.10);
}

#frkAdminAccessTbl .acol>div.false .icon.false {
    fill: var(--frk-dark-red);
}

#frkAdminAccessTbl .acol>div:hover {
    padding: 6px 9px;
}

#frkAdminAccessTbl .acol>div.false:hover {
    border: 1px inset var(--frk-dark-red);
}

#frkAdminAccessTbl .acol>div.true:hover {
    border: 1px inset var(--frk-dark-green);
}

#frkAdminAccessResponse {
    padding-bottom: 15px;
}

#frkAdminAccessResponse:empty {
    display: none;
}

/* access.users */
#frkUserExternalLink,
#frkUserAPIZone .api_key {
    cursor: pointer;
    border: 1px solid #FFF;
    font-size: 12px;
}

#frkUserExternalLink:hover,
#frkUserAPIZone .api_key:hover {
    border-color: #666;
}

/* log.files */
#frkLogFileOutput {
    overflow-y: scroll;
    box-sizing: border-box;
    border: 1px solid #BBB;
    background: #F5F5F5;
    padding: 15px;
}

#frkLogFileOutput>div.wrap {
    font-family: 'Courier New', Courier, monospace;
    font-size: 12px;
    line-height: 18px;
}

/***********/
/* API Doc */
/***********/
body.api_doc {
    background: #F5F5F5;
}

#frkAPIDocs {
    padding: 30px;
}

#frkAPIDocs .scope {
    margin-bottom: 15px;
}

#frkAPIDocs .scope>div.header {
    width: 100%;
    cursor: pointer;
    background: #DDFFDD;
    border: 3px solid #99DD99;
    border-radius: 10px;
    opacity: 0.8;
}

#frkAPIDocs .scope>div.header>div>div {
    color: #006600;
}

#frkAPIDocs .scope>div.header>div>div.id {
    font-size: 16px;
    font-weight: bold;
}

#frkAPIDocs .scope>div.header>div>div.id>div.system {
    display: none;
}

#frkAPIDocs .scope.system>div.header {
    background: #DDDDFF;
    border-color: #9999DD;
}

#frkAPIDocs .scope.system>div.header>div>div {
    color: #000066;
}

#frkAPIDocs .scope.instructions>div.header {
    background: #FFDDDD;
    border-color: #DD9999;
}

#frkAPIDocs .scope.instructions>div.header>div>div {
    color: #660000;
}

#frkAPIDocs .scope>div.header>div>div.id>div.get {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(0, 0, 100, 0.25);
    color: #FFF;
    border: 1px solid #000099;
}

#frkAPIDocs .scope>div.header>div>div.id>div.post {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(0, 100, 0, 0.25);
    color: #FFF;
    border: 1px solid #2d9047;
}

#frkAPIDocs .scope>div.header>div>div.id>div.put {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: #F18B27;
    color: #FFF;
    border: 1px solid #F67D06;
}

#frkAPIDocs .scope>div.header>div>div.id>div.delete {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(100, 0, 0, 0.25);
    color: #FFF;
    border: 1px solid #b62918;
}

#frkAPIDocs .scope.system>div.header>div>div.id>div.system {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(0, 0, 100, 0.25);
    color: #FFF;
    border: 1px solid #009900;
}

#frkAPIDocs .scope>div.header>div>div {
    padding: 10px 15px;
    vertical-align: middle;
}

#frkAPIDocs .scope>div.header>div>div.desc {
    text-align: right;
}

#frkAPIDocs .scope>div.details {
    display: none;
    background: #FFF;
    overflow: hidden;
}

#frkAPIDocs .scope.toggled>div.header {
    border-bottom: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

#frkAPIDocs .scope:hover>div.header,
#frkAPIDocs .scope.toggled>div.header {
    opacity: 1;
}

#frkAPIDocs .scope>div.details {
    border: 3px solid #99DD99;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top: 0px;
}

#frkAPIDocs .scope.system>div.details {
    border-color: #9999DD;
}

#frkAPIDocs .scope.instructions>div.details {
    border-color: #FF9999;
}

#frkAPIDocs .scope>div.details>div.url {
    padding: 10px 15px;
    color: #999;
    font-size: 12px;
}

#frkAPIDocs .scope>div.details>div.title,
#frkAPIDocs .scope>div.details div.test_response div.title {
    padding: 5px 15px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    background: rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid #CCC;
    border-top: 1px solid #CCC;
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
}

#frkAPIDocs .scope>div.details>div.fields {
    width: initial;
    margin: 5px 0px;
}

#frkAPIDocs .scope>div.details>div.fields>div.field {}

#frkAPIDocs .scope>div.details>div.fields>div.field>div {
    padding: 5px 15px;
    font-size: 12px;
    vertical-align: middle;
}

#frkAPIDocs .scope>div.details>div.fields>div.field>div.fkey {
    font-weight: bold;
}

#frkAPIDocs .scope>div.details>div.fields>div.field>div.fkey>div.option {
    display: none;
}

#frkAPIDocs .scope>div.details>div.fields>div.field.option>div.fkey>div.option {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(100, 100, 0, 0.25);
    color: #666600;
    border: 1px solid #666600;
}

#frkAPIDocs .scope>div.details>div.fields>div.field input,
#frkAPIDocs .scope>div.details>div.fields>div.field input:focus {
    padding: 2px 3px !important;
    box-sizing: border-box !important;
    border: 1px solid #BBB !important;
    font-size: 12px;
    line-height: 12px;
}

#frkAPIDocs .scope>div.details>div.test_url {
    opacity: 0.8;
}

#frkAPIDocs .scope>div.details>div.test_url:hover {
    opacity: 1;
    cursor: pointer;
}

#frkAPIDocs .scope>div.details>div.test_url:empty {
    display: none;
}

#frkAPIDocs .scope.instructions>div.details {
    padding: 10px 15px;
}

#frkAPIDocs .scope>div.details>div.code_block {
    border: 1px solid #DD9999;
    background: #FFDDDD;
    padding: 10px;
    color: #660000;
    font-size: 12px;
    margin-bottom: 10px;
}

#frkAPIDocs .scope>div.details>div.stitle {
    padding-bottom: 5px;
    font-weight: bold;
}

#frkAPIDocs .scope>div.details>div.text {
    padding-bottom: 10px;
}

#frkAPIDocs .scope>div.details>div:last-child {
    padding-bottom: 0px;
}

#frkAPIDocs .scope>div.details div.try_btn {
    margin: 0px 0px 0px 0px;
    height: 25px;
    line-height: 24px;
    font-size: 12px;
    padding: 0px 5px;
    display: none;
}

#frkAPIDocs .scope>div.details div.test_response .response {
    padding: 10px 15px;
}

#frkAPIDocs .scope>div.details div.test_response .response>pre {
    white-space: break-spaces;
}

#frkAPIDocs .scope>div.details div.test_response div.title div.status_code.success {
    display: inline-block;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(0, 100, 0, 0.25);
    color: #FFF;
    border: 1px solid #2d9047;
}

#frkAPIDocs .scope>div.details div.test_response div.title div.status_code.error {
    display: inline-block;
    font-size: 11px;
    line-height: 11px;
    text-transform: uppercase;
    padding: 3px 5px;
    background: rgba(100, 0, 0, 0.25);
    color: #FFF;
    border: 1px solid #b62918;
}


/* FILE UPLOADER CONTROL */
.frk_uploader {
    display: inline-block;
}

.frk_uploader form,
.frk_uploader .form {
    display: none;
}

.frk_uploader.no_drop .dropper {
    display: none;
}

.frk_uploader .dropper {
    border: 3px dashed #DDD;
    color: #BBB;
    padding: 20px;
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
}

.frk_uploader .dropper.over {
    border-color: #999;
    background: #EEE;
    color: #868686;
}

.frk_uploader .button {
    display: inline-block;
    margin-top: 10px;
}

.frk_uploader .button svg {
    margin-right: 0px;
}

.frk_uploader.no_drop .button.browse-button {
    margin-top: 0px;
}

.frk_uploader .html {
    display: none;
}

.frk_uploader .queue {
    display: block;
}

.frk_uploader .queue:empty {
    display: none;
}

.frk_uploader .queue:not(:empty) {
    background: rgba(0, 0, 0, 0.05);
    margin-top: 10px;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
}

.frk_uploader .queue>div.file {
    position: relative;
    transition: all 0.25s;
    cursor: default;
}

.frk_uploader .queue>div.file:hover {
    background: rgba(0, 0, 0, 0.05);
}

.frk_uploader .queue>div.file>div {
    display: inline-block;
}

.frk_uploader .queue>div.file>div.label {
    padding: 2px 7px;
    color: #BBB;
    font-size: 14px;
    line-height: 26px;
}

.frk_uploader .queue>div.file>div.size {
    padding-right: 5px;
    font-size: 11px;
}

.frk_uploader .queue>div.file>div.size:before {
    content: "(";
}

.frk_uploader .queue>div.file>div.size:after {
    content: ")";
}

.frk_uploader .queue>div.file>div.size:empty {
    display: none;
}

.frk_uploader .queue>div.file>div.progress {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0%;
    height: 100%;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
}

.frk_uploader .queue>div.file>div.progress>div.wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

.frk_uploader .queue>div.file>div.progress>div.wrapper>div.bar {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 3px;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
}

.frk_uploader .queue>div.file>div.decorations {
    white-space: nowrap;
    padding-right: 30px;
}

.frk_uploader .queue>div.file.present>div.label {
    color: #333;
}

.frk_uploader .queue>div.file.current>div.label {
    color: #333;
}

.frk_uploader .queue>div.file.uploaded>div.label {
    color: #333;
}

.frk_uploader .queue>div.file.uploaded>div.progress {
    display: none;
}

.frk_uploader .queue>div.file.current>div.decorations>div.frk-small-loader {
    display: none;
}

.frk_uploader .queue>div.file>div.decorations>div.frk-small-loader {
    display: none;
}

.frk_uploader .queue>div.file.current>div.decorations>div.frk-small-loader {
    display: inline-block;
}

.frk_uploader .queue>div.file>div.decorations>svg {
    display: none;
    width: 14px;
    height: 14px;
    margin-right: 5px;
    vertical-align: middle;
    opacity: 0.5;
}

.frk_uploader .queue>div.file>div.decorations>svg.success {
    fill: var(--frk-dark-green);
}

.frk_uploader .queue>div.file>div.decorations>svg.fail {
    fill: var(--frk-dark-red);
}

.frk_uploader .queue>div.file.success>div.decorations>svg.success {
    display: inline-block;
}

.frk_uploader .queue>div.file.fail>div.decorations>svg.fail {
    display: inline-block;
}

.frk_uploader .queue>div.file div.removeButton {
    opacity: 0;
    padding: 3px 7px 0px 7px !important;
    width: 26px;
    text-align: center;
    transition: all 0.25s;
    position: absolute;
    top: 2px;
    right: 2px;
    margin-bottom: 0px;
    height: 26px;
}

.frk_uploader .queue>div.file div.removeButton:hover {
    padding-bottom: 2px !important;
}

.frk_uploader .queue>div.file:not(.current).present:hover div.removeButton,
.frk_uploader .queue>div.file:not(.current).uploaded:hover div.removeButton {
    display: inline-block;
    opacity: 1;
}

.frk_uploader .queue>div.file.present>div.label:hover,
.frk_uploader .queue>div.file.uploaded>div.label:hover {
    cursor: pointer;
    color: var(--highlight);
    text-decoration: underline;
}

.frk_uploader .open-button {
    margin-bottom: 0px;
}

.frk_uploader .browse-button {
    margin-bottom: 0px;
    margin-left: 5px;
}

.formar .frk_uploader .queue>div.file div.removeButton {
    height: auto;
    width: 24px;
}

.formar .frk_uploader .browse-button:hover {
    height: 31px;
}

.frk_uploader.no_drop .open-button {
    margin-top: 0px;
}

.frk_uploader.inline div.break {
    display: none;
}

.frk_uploader.inline div.queue {
    margin-top: 0px;
    margin-left: 5px;
    vertical-align: top;
}

#frkFileBrowserTable .used {
    opacity: 0.5;
}

#frkFileBrowserTable .line:not(.used):hover {
    cursor: pointer;
    background: #EEE;
}

#frkFileBrowserTable .line:not(.used):hover>div>div,
#frkFileBrowserTable .line:not(.used):hover>div>div * {
    color: var(--highlight);
}

.formar #frkToolButtons .mcui-button {
    margin-bottom: 15px;
}

/*/////////////
// TELEMETRY //
/////////////*/
#frkTelemetryOutput {
    width: 100%;
    height: 1px;
    border-spacing: 0px;
}

#frkTelemetryOutput tr.event:not(.type_load)>td:first-child {
    padding-left: 30px;
}

#frkTelemetryOutput tr>td label {
    font-size: 11px;
    text-transform: uppercase;
    opacity: 0.5;
    padding-bottom: 0px;
    color: #333;
}

#frkTelemetryOutput tr>td {
    padding: 3.5px 0px;
}

#frkTelemetryOutput tr>td>div {
    line-height: 14px;
    box-sizing: border-box;
    height: 100%;
    padding: 5px 10px;
    background: rgba(0, 0, 0, 0.05);
    cursor: pointer;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

#frkTelemetryOutput tr>td:last-child>div {
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

#frkTelemetryOutput tr>td:first-child>div {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
}

#frkTelemetryOutput tr>td>div>div {
    line-height: 14px;
}

#frkTelemetryOutput tr>td>div>div>div {
    padding-top: 3px;
}

#frkTelemetryOutput tr>td.type>div {
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
    text-align: left;
}

#frkTelemetryOutput tr:not(.type_blur):not(.type_focus)>td.type div {
    color: #FFF;
}

#frkTelemetryOutput tr>td:last-child>div {
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}

#frkTelemetryOutput tr>td.type>div>div {
    font-weight: bold;
    font-size: 16px;
    line-height: 16px;
    text-transform: uppercase;
}

#frkTelemetryOutput tr>td.details svg {
    margin: 0px 5px;
    height: 14px;
    width: 14px;
}

#frkTelemetryOutput tr>td.details div {
    font-size: 12px;
    line-height: 14px;
}

#frkTelemetryOutput tr>td.details>div>div>div.info {
    display: inline-block;
    vertical-align: top;
}

#frkTelemetryOutput tr>td.details>div>div>div.info:not(:last-child) {
    margin-right: 10px;
}

#frkTelemetryOutput tr>td.details>div>div>div.expand {
    display: none;
}

#frkTelemetryOutput tr>td.details pre {
    word-break: break-all !important;
    white-space: pre-line;
}

#frkTelemetryOutput tr>td:not(.details) div {
    white-space: nowrap;
}

#frkTelemetryOutput tr.type_load>td.type>div {
    background: var(--class-color);
}

#frkTelemetryOutput tr.type_load>td>div {
    border-color: var(--class-color);
}

#frkTelemetryOutput tr.type_click>td.type>div {
    background: var(--ajax-color);
}

#frkTelemetryOutput tr.type_click>td>div {
    border-color: var(--ajax-color);
}

#frkTelemetryOutput tr.type_call>td.type>div {
    background: var(--function-color);
}

#frkTelemetryOutput tr.type_call>td>div {
    border-color: var(--function-color);
}

#frkTelemetryOutput tr.type_input>td.type>div {
    background: var(--highlight);
}

#frkTelemetryOutput tr.type_input>td>div {
    border-color: var(--highlight);
}

#frkTelemetryOutput tr.type_focus>td.type div {
    color: var(--app-color);
}

#frkTelemetryOutput tr.type_focus>td>div {
    border-color: var(--app-color);
}

#frkTelemetryOutput tr.type_blur>td.type div {
    color: var(--addon-color);
}

#frkTelemetryOutput tr.type_blur>td>div {
    border-color: var(--addon-color);
}

#frkTelemetryOutput span.parents {
    opacity: 0.5;
}

#frkTelemetryOutput pre.value {
    display: inline-block;
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.3);
    padding: 2px 3px;
}

#frkTelemetryOutput tr.expanded>td.details>div>div>div:not(.info) {
    display: block;
}

#frkTelemetryOutput tr.hovering {
    filter: brightness(1.1);
}

#frkTelemetryTabs {
    display: none;
    text-align: right;
    margin-right: 0px;
}

#frkTelemetryTabs svg {
    margin-top: 9px;
}

#frkTelemetryDefaultZone {
    display: none;
}

/*////////////////////
// PAGING COMPONENT //
////////////////////*/
.frkPagingComponent {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 15px;
}

.frkPagingComponent div.status {
    line-height: 30px;
    margin-right: 10px;
}

.frkPagingComponent div.selector {
    line-height: 30px;
}

.frkPagingComponent div.selector>div {
    display: inline-block;
    border-radius: 100px;
    font-size: 14px;
    text-align: center;
    width: 30px;
    height: 30px;
    transition: all 0.3s;
}

.frkPagingComponent div.selector>div:not(:first-child) {
    margin-left: 5px;
}

.frkPagingComponent div.selector>div.nav svg {
    margin: 0px;
    width: 14px;
    height: 14px;
    margin-top: 8px;
}

.frkPagingComponent div.selector>div:not(.current):not(.disabled) {
    cursor: pointer;
}

.frkPagingComponent div.selector>div.disabled {
    opacity: 0.5;
}

.frkPagingComponent div.selector>div.page.current {
    background: rgba(0, 0, 0, 0.1) !important;
    font-weight: bold;
}

.frkPagingComponent div.selector>div:not(.disabled):hover {
    background: rgba(0, 0, 0, 0.05);
}

.frkPagingComponent div.field {
    margin: 0px;
}

.frkPagingComponent div.sizeSelector {
    white-space: nowrap;
}

.frkPagingComponent div.sizeSelector label,
.frkPagingComponent div.sizeSelector .mcui-select {
    display: inline-block;
    vertical-align: middle;
}

.frkPagingComponent.showPaging_1 div.sizeSelector {
    margin-right: 20px;
}

.frkPagingComponent div.sizeSelector label {
    padding-bottom: 0px;
    margin-right: 10px;
    font-size: 14px;
}

.mcui-form.formar .frkPagingComponent div.frkPageSizeSelector>div.holder,
.frkPagingComponent div.frkPageSizeSelector>div.holder,
.mcui-form.formar .frkPagingComponent div.frkPageSizeSelector>div.options,
.frkPagingComponent div.frkPageSizeSelector>div.options {
    width: 80px !important;
    min-width: 80px;
}

.mcui-form.formar .frkPagingComponent div.frkPageSizeSelector>div.holder>div.selected,
.frkPagingComponent div.frkPageSizeSelector>div.holder>div.selected {
    width: 50px !important;
    min-width: 80px;
}

.frkPagingComponent div.status {
    white-space: nowrap;
    font-size: 14px;
}

/*////////////////////
// PERIOD COMPONENT //
////////////////////*/
.frkPeriodComponent {
    display: inline-block;
    border-radius: 10px;
    padding: 5px;
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.frkPeriodComponent svg {
    margin-right: 0px !important;
}

.frkPeriodComponent svg {
    opacity: 0.5
}

.frkPeriodComponent .back svg {
    margin-left: -2px !important;
}

.frkPeriodComponent .next svg {
    margin-right: -2px !important;
}

.frkPeriodComponent>div {
    display: inline-block;
    vertical-align: middle;
}

.frkPeriodComponent>div.label {
    padding: 0px 10px;
}

.frkPeriodComponent .mcui-button.small:hover:not(:disabled) {
    padding-bottom: 2px !important;
}

.frkPeriodComponent .mcui-button.small:hover svg {
    opacity: 1;
}

.frkPeriodComponent .mcui-button.small:active:not(:disabled) {
    padding-bottom: 0px !important;
}

.frkPeriodComponent div.mcui-datecontrol {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    margin-right: 10px !important;
    margin-left: 0px !important;
    margin-top: 0px !important;
}

.frkPeriodComponent div.mcui-datecontrol:last-child {
    display: none;
}

.frkPeriodComponent .calendar_date {
    display: none;
}

/*///////////////////////////////
//                             //
//     LEGACY, to convert      //
//                             //
///////////////////////////////*/

.results {
    background: #eaeaea;
    height: 41px;
}

.restext {
    float: left;
    font-size: 11px;
    color: #666;
    margin: 14px 0px 0px 20px;
}

.pagenums {
    float: right;
    margin: 10px 20px 0px 0px;
}

.pnum {
    float: left;
    height: 21px;
    width: 20px;
    text-align: center;
    background: #cecece;
    color: #2e2e2e;
    line-height: 18px;
    font-weight: bold;
    font-size: 11px;
    margin-left: 3px;
    cursor: pointer;
}

.pnum:hover {
    background: #FFF;
    color: #666;
}

.pnumsel {
    background: #FFF;
    color: #666;
    cursor: default;
}

.rpgsel {
    height: 24px;
    margin-left: 5px;
    line-height: 24px;
    border: 0px;
    font-size: 14px;
    text-shadow: 1px 1px #FFF;
    font-weight: bold;
    box-sizing: border-box;
    background: #DDD;
    color: #333;
    border-radius: 5px;
}

div.results {
    background: #FFF;
    margin-top: 1px;
}

div.results>div.restext {
    margin-top: 11px;
    margin-left: 10px;
}

div.results>div.pagenums {
    margin-right: 10px;
}

div.results>div.pagenums>div.pnum {
    line-height: 20px;
}

div.results>div.pagenums>div.pnum:hover {
    background: #DDD;
}

div.results>div.pagenums>div.pnum.pnumsel {
    background: #666;
    color: #FFF;
}

/*/////////////
// SNACKBARS //
/////////////*/
#frkSnackBarContainer {
    position: fixed;
    bottom: 10px;
    right: 20px;
    z-index: 9999999999;
}

#frkSnackBarContainer>div.snack {
    visibility: hidden;
    background-color: #333;
    margin-bottom: 10px;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 10px 15px;
    z-index: 1;
    right: 0px;
    bottom: 20px;
    font-size: 17px;
    border-bottom: 3px solid #666;
    cursor: pointer;
    line-height: 20px;
}

#frkSnackBarContainer>div.snack.success {
    background-color: #3cae5a;
    border-color: #1d692d;
}

#frkSnackBarContainer>div.snack.error {
    background-color: #FF6666;
    border-color: #AA3333;
}

#frkSnackBarContainer>div.snack.yellow {
    background-color: #e6b15f;
    border-color: #9e712d;
}

#frkSnackBarContainer>div.snack>svg.icon.frk {
    fill: #FFF;
}

#frkSnackBarContainer>div.snack.show {
    visibility: visible;
    -webkit-animation: snackfadein 0.5s;
    animation: snackfadein 0.5s;
}

.frkSnack {
    display: none;
}

@-webkit-keyframes snackfadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

@keyframes snackfadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

/* FMANAGER */
div.mcui-button.ftopbtn {
    float: right;
    padding: 0px 10px;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    margin-left: 20px;
}

div.mcui-button.ftopbtn.yellow {
    color: #333;
    text-shadow: 1px 1px #FFF;
}

.formar div.mcui-button.ftopbtn {
    height: auto;
    line-height: 20px;
    font-size: 15px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.formar div.mcui-button.ftopbtn:hover {
    line-height: 18px;
}

.formar div.mcui-button.ftopbtn:active {
    margin-bottom: 17px;
}

/*////////////////////////////
//                          //
//      MEDIA QUERIES       //
//                          //
////////////////////////////*/

#appStruct.mobiled>div>div {
    display: block;
    width: auto !important;
}

#appStruct.mobiled #mode_toggler {
    display: none;
}

#appStruct.mobiled>div>div.menu {
    border-bottom: 1px solid #555;
    filter: brightness(1.1);
}

#appStruct.mobiled .content .theader {
    padding-left: 13px;
}

#appStruct.mobiled>div>div.content>div:not(#header) {
    height: auto !important;
}

#mobileToggler {
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -25px;
    padding: 10px;
}

#mobileToggler>svg {
    width: 30px;
    height: 30px;
    margin-right: 0px;
    fill: #666;
}

#mobileToggler:hover>svg {
    fill: #FFF;
}

#mobileToggler:hover {
    cursor: pointer;
}

#mobileOverlay {
    z-index: 99999999;
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: #FFF;
    display: none;
}

#mobileOverlay .theader {
    background: #222;
}

#header.collapse {
    height: auto !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

#header.collapse>div {
    display: block;
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    bottom: auto;
    margin: 0px;
    transform: none;
}

#header.collapse>div#options {
    margin-top: 20px;
}

@media (max-width: 800px) {}