/*@font-face {
    font-family: 'EEMfontExtraLight';
    src: url('/css/fonts/Sarala/Sarala-Regular.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontLight';
    src: url('/css/fonts/Sarala/Sarala-Regular.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfont';
    src: url('/css/fonts/Sarala/Sarala-Bold.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontBold';
    src: url('/css/fonts/Sarala/Sarala-Bold.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontMono';
    src: url('/css/fonts/JetBrainsMono/JetBrainsMono-Regular.ttf') format('truetype'); 
    font-display: optional; 
}*/

@font-face {
    font-family: 'EEMfontExtraLight';
    src: url('/css/fonts/Rubik/Rubik-Light.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontLight';
    src: url('/css/fonts/Rubik/Rubik-Regular.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfont';
    src: url('/css/fonts/Rubik/Rubik-Medium.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontBold';
    src: url('/css/fonts/Rubik/Rubik-Bold.ttf') format('truetype');
    font-display: optional;
}
@font-face {
    font-family: 'EEMfontMono';
    src: url('/css/fonts/JetBrainsMono/JetBrainsMono-Regular.ttf') format('truetype');
    font-display: optional; 
}

html {
   font-size: 10px;
   height: 100vh;
   height: 100svh;
   min-height: 100vh;
   min-height: 100svh;
}

body { 
    /*height: 100vh;*/
    padding: 0px;
    /*padding-top: env(safe-area-inset-top,0px); 
    padding-bottom: env(safe-area-inset-bottom,0px);
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);*/
    padding-top: env(safe-area-inset-top);
    overflow: hidden; 
    font-family: "EEMfont";
    margin: 0;
    user-select: none;
    -webkit-touch-callout: none;     /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;  /* prevent webkit from resizing text to fit */
    -webkit-user-select: none;       /* prevent copy paste, to allow, change 'none' to 'text' */
    -webkit-tap-highlight-color: transparent;

    height: 100vh;
    height: 100svh; /* svh = small viewport height: always fits visible area, even in browser mode with chrome visible */

    /* touch-action: manipulation; /* removes click delay on mobile ... didnt work */
}

[onClick] {
    cursor: pointer;
}

select,td { font-family: "EEMfont"; }
button,input { font-family: "EEMfont" !important;}

textarea:focus, input:focus{ outline: 0;}

/* Classes */

#ui-bottominfo, #ui-wrapper {

    --ui-base: 35px;
    --h_bottominfo: 90px;
    --phone_h_nag: 70px; 
    --phone_safe-bottom: env(safe-area-inset-bottom,0px); 
    --tablet_h_nag: 90px;
    --desktop_h_nag: var(--ui-base);
    --h_bottomspacer: 0px;

    /* icons */
    --ui-icons_size: 17;
    --ui-icons_size_m3: 17;
    --ui-icons_border: calc(var(--ui-base)/4);

}
#ui-wrapper, .fullscreenOverlay, .ui-basecontainer {
    /* div sizing */    
    --h_top: var(--ui-base);
    --h_bottom: 0px;
    --w_pane_0: 0px;
    --w_pane_1: 0px;
    --w_pane_2: 0px; --h_pane_2: 100%; 
    --w_menu_2: 0px;
    --h_nwjs: 24px; /* if changing this change at fullscreen func aswell */

    --h_overlay: 0px;

    --w_ui-center: calc(100% - var(--w_menu_1) - var(--w_menu_2));
    --h_ui-center: calc(100% - var(--h_top) - var(--h_bottom));
    
    --tablet_w_pane0: 420px;
    --tablet_w_pane1: 420px;
    --tablet_w_pane_0: 0px; --tablet_h_pane_0: 100%;
    --tablet_w_pane_1: 0px; --tablet_h_pane_1: 100%;
    --tablet_w_pane_2: 300px; --tablet_h_pane_2: calc(100% - var(--h_top));
    --tablet_w_menu_1: 11.5rem; --tablet_h_menu_1: 100%; /* var(--ui-base) */
    --tablet_w_menu_2: var(--ui-base); --tablet_h_menu_2: calc(100% - var(--h_top)); /*  - var(--h_bottom) */
    /*--tablet_w_top: calc(100% - var(--tablet_w_menu_1) - var(--tablet_w_menu_2) - var(--w_pane_2));*/
    --tablet_w_top: calc(100% - var(--tablet_w_menu_1) );
    --tablet_w_ui-center: calc(100% - var(--tablet_w_menu_1) - var(--tablet_w_menu_2));
    --tablet_h_ui-center: calc(100% - var(--h_top) - var(--h_bottom));
    --tablet_w_bottom: calc(100% - var(--w_menu_1)); 
    --tablet_w_status: var(--tablet_w_pane0); 

    --phone_h_pane_0: 100%;
    --phone_w_pane_1: 100%; --phone_h_pane_1: 254px;
    --phone_w_menu_1: 100%; --phone_h_menu_1: var(--ui-base);
    --phone_w_menu_2: 100%; --phone_h_menu_2: var(--ui-base);
    --phone_w_top: 100%;
    --phone_w_ui-center: 100%; 
    --phone_h_ui-center: calc(100% - var(--h_top) - var(--phone_h_menu_1));
    --phone_w_bottom: 100%; 
    --phone_w_status: 100%; 

    --w_syncreturn: 200px; --h_syncreturn: 0px;
    --w_status: var(--tablet_w_pane0);
    --h_status: var(--ui-base);/*calc(var(--ui-base)/5*3.5);*/
    --w_top_pane_2: calc(var(--tablet_w_pane_2) + 10px + var(--ui-base)*3);
    
    --overlay_left: 0px;
    --overlay_top: 0px;
    
    --z_ui-menu: 10;
    
    --resizer_h: 0px;
    --h_crft_tree: 0px;
    --h_crft_matree: 0px;

    --lw_multi: 1;

    /* calced ones */
    --leftPanesWidth: max(var(--w_pane_0),var(--w_pane_1));
    
    /* -------------> turn off menu -> bottom turned off -> resize to phone ... */
    
            
}

/* In your global.css file */
@layer utilities {
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
  }
}

a:link {
    text-decoration: none !important;
}

.nope {
    pointer-events: none;
}

[onClick] {
    cursor: pointer;
}

.fullscreenOverlay {
    position:absolute;
    top:0;
    left:0;
    z-index: 99;
    height:calc(100% - var(--h_bottominfo));
    width:100%;
    display:none;
    border: 0;
}

.dataOverlayContainer {
    position:absolute;
    top: var(--ui-base);
    right:calc(var(--w_pane_2) + var(--w_menu_2));
    width: calc(100vw - var(--tablet_w_menu_1) - var(--w_pane_left) - var(--w_pane_2) - var(--w_menu_2));
    z-index: 20;
    max-height: calc(100vh - var(--h_bottominfo) - var(--ui-base));
    display: none;
    border: 0;
    pointer-events: all !important;
    height: var(--h_overlay);
}

.dataOverlay {
    height: 100%;
    width: 100%;
    display: none;
}

.ryden_splash {
    font-family: "EEMfontBold";
    font-size: 13px;
    /*color: #ff8b2c; /*#eec578; #ffd74d;*/
    color: #ff621f;
    /*background-image: -webkit-linear-gradient(  #ff8a2b 40%, #de6501 100% );
    background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;*/
    width: 100%;
    height: 20px;
    font-weight: bold;
    text-align: justify;
    margin-top: 5px;
}
.ryden_splash_bg {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    /*background-image: -webkit-linear-gradient(  #632c00 40%, #a2581a 100% );*/
    /*background-image: url("/img/bg/...");*/
}
.loading {
    font-family: "EEMfontBold";
    font-size: 9px;
    color: #ff621f;/*#555;*/
    letter-spacing: 2px;
    margin-top: 2px;
    margin-left:2px;
    height: 11px;
}
.sublogospan {
    background-color:transparent;
    width:100%;
    height:1px;
    display:inline-block;
}

.ui-basecontainer {
    z-index: 0;
    position:absolute;
    width:100%;
    height:100vh;
    height:100svh;
}
#ui-bottominfo {
    z-index: 1;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5); /*var(--col-yellow);*/
    backdrop-filter: blur(30px);
    height: calc(var(--h_bottominfo) + var(--h_bottomspacer));
    width: 100%;
    pointer-events: all;
}
#ui-wrapper {
    z-index: 1;
    position:relative;
    overflow: hidden;
    width:100%;
    height: calc(100% - var(--h_bottominfo) - var(--h_nwjs)); 
    pointer-events: none;
}
#outer {
    position:relative;
    top:0px;
    height: 100vh;
    height: 100svh;
    overflow: hidden;
    z-index:0;
}
#ui-top {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-ui); /* blue; <------------- dev */
    position: absolute;
    width: var(--w_top); 
    height: var(--h_top);
    left: var(--w_menu_1);
    pointer-events: all;
}
#ui-top_pane_2 {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-ui); /* orange; <------------- dev */
    position: absolute;
    right: 0;
    width: var(--w_top_pane_2);
    height: var(--h_top);   
    text-align: right;
    vertical-align: middle;
    pointer-events: all;
}  
#ui-bottom {
    z-index: calc(var(--z_ui-menu)-2);
    /*background-color: var(--col-ui); /* indianred; <------------- dev */
    position: absolute;
    bottom: 0;
    width: var(--w_bottom);
    height: var(--h_bottom);
    left: var(--w_menu_1);
    pointer-events: all;
}
#ui-status {
    z-index: calc(var(--z_ui-menu) + 15);
    /*background-color: var(--col-main); /* darkgrey; /* <------------- dev */
    position: absolute;
    bottom: 0;
    width: var(--w_status);
    height: var(--h_status);
    left: var(--w_menu_1);
    pointer-events: all;
}
#ui-syncreturn {
    z-index: calc(var(--z_ui-menu) - 1);
    background-color: var(--col-blue); 
    position: absolute;
    border-bottom: 1px solid var(--col-ui);
    /*top: 0;var(--h_top);*/
    /*left: 0;var(--w_menu_1);*/
    width: var(--w_syncreturn);
    display: none;
    pointer-events: all;
}
#ui-menu_1 {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-ui);*/ /* dodgerblue; /* <------------- dev */
    position: absolute;
    width: var(--w_menu_1);
    height: var(--h_menu_1);
    pointer-events: all;
}   
#ui-menu_1_bottom, #ui-menu_2_bottom {
    position: absolute;
    bottom: 0;
    pointer-events: all;
}
#ui-bottom_left {
    position: absolute;
}
#ui-bottom_right {
    position: absolute;
    right: 0;
}
#ui-stats {
    z-index: calc(var(--z_ui-menu) - 1);
    /* background-color: /* red; /* <------------- dev */
    position: absolute;
    /*height: calc(var(--h_top)/5*3);*/
    bottom: calc(var(--h_bottom) + 28px); /*var(--h_top) +*/
    left: calc(var(--w_menu_1) + var(--leftPanesWidth) + 8px);
    /*width: calc(100% - var(--w_menu_1) - var(--w_pane_1) - var(--w_pane_2) - var(--w_menu_2));
    height: 29px;*/

    /*padding-right: calc(var(--ui-icons_border));
    padding-bottom: calc(var(--ui-icons_border) - 5px);
    pointer-events: all;*/
    padding: 2px;

}
#ui-menu_2 {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-ui);*/ /* coral; /* <------------- dev */
    position: absolute;
    right: 0;
    top: var(--h_top);
    width: var(--w_menu_2);
    min-height: var(--h_menu_2);
    pointer-events: all;
}
#ui-menu_3 {
    z-index: calc(var(--z_ui-menu) - 3);
    /* background-color: /* red; /* <------------- dev */
    position: absolute;
    /*height: calc(var(--h_top)/5*3);*/
    bottom: 0px;
    right: calc(var(--w_pane_2) + var(--w_menu_2));
    width: calc(100% - var(--w_menu_1) - var(--leftPanesWidth) - var(--w_pane_2) - var(--w_menu_2));
    height: 29px;
    /*padding-right: calc(var(--ui-icons_border));
    padding-bottom: calc(var(--ui-icons_border) - 5px);
    pointer-events: all;*/
    
}
#ui-menu_4 {
    z-index: calc(var(--z_ui-menu) + 6);
    /* background-color: var(--col-main); /* orestgreen; /* <------------- dev */
    position: absolute;
    bottom: var(--h_bottom);
    left: var(--w_menu_1);
    /*width: var(--w_pane_1);*/
}    
#ui-center {
    position: absolute;
    top: 0px; /*var(--h_top)*/
    left: var(--w_menu_1);
    width: var(--w_ui-center); 
    height: var(--h_ui-center); 
    overflow: hidden;
}
#ui-pane_0 {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-main);*/ /* fuchsia; /* <------------- dev */
    position: absolute;
    width: var(--w_pane_0);
    height: var(--h_pane_0);    
    pointer-events: all;
} 
#ui-pane_1 {
    z-index: calc(var(--z_ui-menu) - 1);
    /*background-color: var(--col-main);  cornflowerblue; /* <------------- dev */
    top: calc(var(--h_syncreturn) ); /* + 1px ? - 1px */
    width: var(--w_pane_1);
    height: var(--h_pane_1);    
    float: var(--overlay_float);
    text-align: left;
} 
#ui-pane_2 {
    z-index: var(--z_ui-menu);
    /*background-color: var(--col-main); /* darksalmon; /* <------------- dev */
    position: absolute;
    top: var(--h_top);
    right: var(--w_menu_2);
    width: 0px;
    height: var(--h_pane_2);
    pointer-events: all;
    box-sizing: border-box;
    text-align: right;
}
#ui-overlay_1 {
    z-index: calc(var(--z_ui-menu) - 1);
    /*background-color: darkkhaki; /* <------------- dev */
    position: absolute;
    left: var(--overlay_left);
    top: calc(var(--overlay_top) + var(--h_syncreturn));
    height: 100%;
    width: 100vw;
}

/* element styles */
.mnu_title {
    color: var(--col-txt);
    opacity: 0.8;
    letter-spacing: 1px;
    font-size: 0.95rem;
    text-align: left;
    padding-top:1px;
    padding-left:4px;
    padding-right:4px;
    /*display: none;*/
    /*margin-top: -8px;
    text-align: center;
    margin-bottom: 4px;
    display:none;*/
}
.ui-icon {
    /* opacity: 0.8; */
    width: var(--ui-icons_size); 
    height: var(--ui-icons_size);
    border: solid;
    border-color: transparent;
    border-width: var(--ui-icons_border);
    /* border-color: rgba(255,255,255,0.1); /* <------------- dev */
    /* filter: invert(); /* <------------- dev */
    -webkit-app-region: no-drag; /* E3IO */
    /* margin-bottom: 10px; */
    cursor: pointer !important;
}       
.ui-ico-varia {
    pointer-events: all;
    cursor: pointer !important;
}  
.ui-icon_lr {
    /* opacity: 0.8; */
    width: var(--ui-icons_size); 
    height: var(--ui-icons_size);
    border: solid;
    border-color: transparent;
    border-left-width: var(--ui-icons_border);
    border-right-width: var(--ui-icons_border);
    border-top-width: 2px;
    border-bottom-width: 2px;
    /* border-color: rgba(255,255,255,0.1); /* <------------- dev */
    /* filter: invert(); /* <------------- dev */
    -webkit-app-region: no-drag; /* E3IO */
    cursor: pointer !important;
}
.ui-flex_menu {
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
}
.ui-flex_container {
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.ui-flex_section {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-height: 0;/* FF quirk */
}
.ui-flex_content {
    flex-grow: 1;
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling: touch;
}

.ui-overlay {
    pointer-events:none;
}

.zKBpane {
    width:124px;
    background-color:transparent;
    margin-top:5px;
    overflow:hidden;
    margin-left:5px;
    display:none;
}
.infopane {
    /*background-color: var(--col-main);*/
    display: none;
    height: 100%;
    pointer-events:all;
}
    
.hiddenatstart {
    display: none;
}

.paneopac_main {
    background-color: rgba(0,0,0,0) !important; /* 0.1 */
    /*border-left: 1px dashed var(--col-lines);*/
    pointer-events: none !important;
}
.paneopac {
    background-color: rgba(0,0,0,0) !important; /* 0.1 */
    pointer-events: none !important;
}

#ui-desktopapp {
    z-index: 2;
    position: relative;
    /*background-color: var(--col-ui);*/
    width: 100%;
    text-align: right;
    height: var(--h_nwjs);
    -webkit-app-region: drag;
}


.ss_selections {
    border: 0; 
    width: 100%;
    display: none;
    border-spacing: 0px;
    padding: 0px;
};

.ui-wrapper-overlay {
    z-index:999;
    position: relative;
    background-color: rgba(0,0,0,0.8);
    top:0;
    left:0;
    height:100%;
    width:100%;
    pointer-events: all !important;
    user-select: all !important;
}

/* ----------------------------------------------- OLD CSS ------------------------------------------------ */

/*
.purple { color: #9a41ff; }
.kitty { color: #ffb3e7; }
.blue { color: #519af9; }
.yellow { color: #e3ff00; }
.orange { color: #ffd74d; }
.red { color: #cc3f00; }
.green { color: #3ef598; }
.white { color: #ffffff; }
.lightgrey { color: #999999; }
.darkgrey { color: #444444; }
.black { color: #000000; }
.spaceblue { color: #090C0E; }
*/


.notouch{ pointer-events:none;}

.unselectable {
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari */  
    -khtml-user-select: none; /* Konqueror */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
	user-select: none;
	cursor: default;
}

.selectable_txt {
	user-select: text !important;
	cursor: text !important;
    -webkit-touch-callout: text !important; /* iOS Safari */
}

.interactive {
    pointer-events:all;
}

/* turn on gpu acceleration */
#viewport, .screen, .animated, .spinner { 
	/*-webkit-transform: translate3d(0px,0px,0px);*/
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000; 
    transform: translateZ(0);
    backface-visibility: hidden;
	perspective: 1000;
}

.devONLY {
   display: none;
}

.colorPick_mk_mnu {
    width:14px;
    height:14px;
    display:inline-block;
    margin-top:2px;  
    margin-left:0px;
    margin-right:0px;
    border-radius:7px;
    opacity: 0.3;
}

.colorPick_mk {
    width:14px;
    height:14px;
    display:inline-block;
    margin-top:2px;  
    margin-left:0px;
    margin-right:0px;
    border-radius:7px;
    opacity: 0.3;
    cursor: pointer !important;
}

.colorPick_mk_sector {
    width: 10px;
    height: 10px;
    display:inline-block;
    margin-top:4px;
    margin-left:0px;
    margin-right:0px;
    border-width: 2.5px;
    border-style: solid;
    opacity: 0.3;
    cursor: pointer !important;
}

.colorPick_mk_map {
    width: 10px;
    height: 10px;
    display:inline-block;
    margin-top:4px;
    margin-left:0px;
    margin-right:0px;
    border-width: 2.5px;
    border-style: solid;
    opacity: 0.3;
    cursor: pointer !important;
}

.fleets {
    pointer-events: none;
}
.measures {
    pointer-events: none;
}

.mk_sector {
    pointer-events: none;
}
.sb_sector {
    pointer-events: none;
}

.mk_coords {
    font-weight: bold;
}
.sb_coords {
    font-weight: bold;
}

.uihand {
    cursor: pointer;
}

.colorPick_mk_small {
    width:9px;
    height:9px;
    /*padding: 0 1px 0 1px;*/
    display:inline-block;
    border-radius:4.5px;
    opacity: 1;
    cursor: pointer;
}


.cP_selected {
    opacity: 1;
}
.srchrow {
    line-height:1.45rem;
    padding-top:0.1rem;
}
.rou-sortable-placeholder { 
    /*height: 1.5em; */
    height:4px;
    background-color: var(--col-drag-outline);
    /*border-color: var(--col-drag-outline);*/
    margin-bottom:12px;
}
.ui-sortable-placeholder { 
    width: 25% !important;

}
.routeLi {
    vertical-align: top;
    display: inline-block;
    width: 100%;
}

.hoverbg {
    backdrop-filter: blur(5px);
    background-color:rgba(0,0,0,0.5);
    /*box-shadow: 0 0 10px 8px rgba(0,0,0,0.6);*/
}

.hoverbg:hover {
    background-color:rgba(0,0,0,0.6);
    /*box-shadow: 0 0 10px 8px rgba(0,0,0,0.7);*/
}

.cursor_copy {
    cursor: url('/img/icon/svg/copy_cursor.svg') 0 0, auto !important;
}

.hoverow {
    background-color:rgba(0,0,0,0);
}
.hoverow:hover {
    background-color:var(--col-tabsub-bg);
}

.hoverow_rent {
    background-color:rgba(0,0,0,0);
}
.hoverow_rent:hover {
    background-color: var(--col-rent_list-rgba);
}

/* ------------------------------- SA */

.numo {
    opacity: 0.55; 
}

.ticker_xs {
    font-size: 1.2rem !important;
    padding: 7px 4px;
    color: var(--col-txt)
}

/* ------------------------- CRAFT */


.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

/*@media (min-width: 501px) {
    .flex-item {
        flex: 25%;
        min-width: 260px;
        max-width: 430px;
        margin-right:18px;
    }
}
@media (max-width: 500px) {
    .mlist_table {width:100% }
    .flex-item {
        flex: 100%;
        min-width: 100%;
        max-width: 100%;
        margin-right:18px;
    }
}*/

.mlist_table {margin-bottom:12px;} /*background-color:rgba(0,0,0,0.8);*/
.mlist { font-size:1.1rem;color:#fbfbfb;vertical-align: middle;line-height: 32px; }
.mlist_txt { 
    font-size:1.15rem;
    color:#fbfbfb;
    vertical-align: middle;
    text-align: left !important;
    user-select:text !important;
    white-space:nowrap;
    padding: 3px 8px 3px 3px;
}
.mlist_val { 
    font-size:1.1rem;
    color:#fbfbfb;
    vertical-align: middle;
    text-align: right !important;
    user-select:text !important;
    white-space:nowrap;
    padding: 3px 3px 3px 8px;
    letter-spacing: 0.5px;
}
.mlist_txt_hl { 
    font-size:1.1rem;
    color:#fbfbfb;
    vertical-align: middle;
    text-align: left !important;
    user-select:text !important;
    white-space:nowrap;
    padding: 3px 8px 3px 3px;
}
.mlist_val_hl { 
    font-size:1.1rem;
    color:#fbfbfb;
    vertical-align: middle;
    text-align: right !important;
    user-select:text !important;
    white-space:nowrap;
    padding: 3px 3px 3px 8px;
    letter-spacing: 0.5px;
}
.line_bottom { 
    border-bottom: 1px solid #444 !important;
    padding-bottom:4px;
}
.line_top { 
    border-top: 1px solid #444;
    padding-top:3px;
}

ul { list-style: none none; margin: 0; padding: 0; display: block; color: var(--col-txt)}

.items li { margin: 8px 0px; font-size: 12px; }
.items li.current span { text-shadow: 0px 0px 8px #79cef4; }
.items li span { white-space: nowrap; cursor: pointer; padding: 1px 4px; }

#crft_canvas { z-index: 1; display: block; position: absolute; left: 0; top: calc(var(--ui-base) + 10px); background-color:transparent; } /*calc(var(--ui-base) + 0px)*/
#crft_tree { z-index: 2; border-collapse: collapse; position: relative; left: 0; top: 0; max-width: 1200px;}
#list { z-index: 3; border-collapse: collapse; position: relative; left: 0; top: 0; }

option { 
    background-color: #18171f;
    color: #fbfbfb;
}

optgroup { 
    background-color: #18171f  !important;
    color: rgb(255, 190, 77) !important;
}

.outer_td {
    vertical-align: middle;
}

.tr_hover {
    background-color:rgba(0,0,0,0);
}

.tr_hover:hover {
    /*background-color: rgb(70, 59, 48, .3);*/
    background-color: var(--col-tabsub-bg);
}

.craft_duration {
    color: #00ccbe;
    font-size: 1.1rem;
}

.crft_container {
    display: flex;
    flex-flow: row;
    height: 100%;
}
.crft_side {
    flex: 2;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 272px; /* was 224 */
    min-width: 272px;
    max-width: 272px;
    max-height:100%;
}
.crft_side_mobile {
    overflow-y: scroll;
    overflow-x: hidden;
    width: 100%;
}
.crft_content {
    flex: 10;
    overflow: scroll;
    max-height:100%;
}

.tree_side {
    flex: 2;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 248px; /* was 224 */
    min-width: 248px;
    max-width: 248px;
    max-height:100%;
}
.tree_content {
    flex: 10;
    overflow: scroll;
    max-height:100%;
}


/* ------------------------------- */

.helpTip_icon {
    filter: invert(30%) grayscale(100%) brightness(80%) sepia(100%) hue-rotate(137deg) saturate(400%) contrast(2);
    padding-right:2px;
    padding-left:2px;
    vertical-align:-26%;
}
.helpTip_icon_mm {
    filter: invert(30%) grayscale(100%) brightness(80%) sepia(100%) hue-rotate(137deg) saturate(400%) contrast(2);
}
.helpSpacer {
    width:1px !important;
    padding:0 !important;
}

.refdisclaimer {
    color:rgba(90, 200, 250, 0.9);
    background-color:rgba(90, 200, 250,0.1);
    border: 1px solid rgba(90, 200, 250,0.5);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    /*float: right;*/
    margin: 5px 0px 12px 0px;
    cursor: help;
}

.help {
    cursor: help;
    border-bottom: 1px dotted var(--col-txt-2);
}

.helpcur {
    cursor: help;
}

.explanation {
    color:rgba(var(--col-cmd),  0.9);
    background-color:rgb(1255, 215, 77, 0.1);
    /*  border: 1px solid rgba(var(--col-cmd),  0.5);*/
    border-radius: 1px;
    font-size: 1rem;
    padding: 4px 4px 4px 4px;
    cursor: pointer;
    margin: 0px 0px 0px 0px;
    letter-spacing:0.2px;
    line-height: 1.1rem;
    width: calc(100% - 12px);
}


/* rental commands */
.cmd_color-rental-disabled {
    color:rgba(var(--col-cmd-rent_own),  0.4) !important; 
    background-color: rgba(var(--col-cmd-rent_own),  0.08) !important;
    border-color: rgba(var(--col-cmd-rent_own),  0.2) !important;
}
.cmd_color-rental {
    color:rgba(var(--col-cmd-rent_own), 0.9) !important;
    background-color:rgba(var(--col-cmd-rent_own), 0.1) !important;
    border-color: rgba(var(--col-cmd-rent_own), 0.5) !important;
}
.cmd_color-rental_btn {
    color:rgba(var(--col-cmd-rent_own), 0.9) !important;
    background-color:rgba(var(--col-cmd-rent_own), 0.1) !important;
    border-color: rgba(var(--col-cmd-rent_own), 0.5) !important;
}
.cmd_color-rental_btn:hover {
    color:rgba(var(--col-cmd-rent_own), 1) !important;
    background-color:rgba(var(--col-cmd-rent_own), 0.2) !important;
    border-color: rgba(var(--col-cmd-rent_own), 0.6) !important;
}

.cmd_color-rental_borrowed-disabled {
    color:rgba(var(--col-cmd-rent_borrowed),  0.4); 
    background-color: rgba(var(--col-cmd-rent_borrowed),  0.08) !important;
    border-color: rgba(var(--col-cmd-rent_borrowed),  0.2) !important;
}
.cmd_color-rental_borrowed {
    color:rgba(var(--col-cmd-rent_borrowed), 0.9) !important;
    background-color:rgba(var(--col-cmd-rent_borrowed), 0.1) !important;
    border-color: rgba(var(--col-cmd-rent_borrowed), 0.5) !important;
}
.cmd_color-rental_borrowed_btn {
    color:rgba(var(--col-cmd-rent_borrowed), 0.9) !important;
    background-color:rgba(var(--col-cmd-rent_borrowed), 0.1) !important;
    border-color: rgba(var(--col-cmd-rent_borrowed), 0.5) !important;
}
.cmd_color-rental_borrowed:hover {
    color:rgba(var(--col-cmd-rent_borrowed), 1) !important;
    background-color:rgba(var(--col-cmd-rent_borrowed), 0.2) !important;
    border-color: rgba(var(--col-cmd-rent_borrowed), 0.6) !important;
}


.inpt_cmd_simple_dash-rental {
    border-bottom: 1px dashed rgba(var(--col-cmd-rent_own),  0.5) !important;
}
input.inpt_cmd_simple_dash-rental::placeholder {
    color: rgba(var(--col-cmd-rent_own),  0.5);
    font-size: 0.9rem;
}
.inpt_cmd_simple_dash-rental_borrowed {
    border-bottom: 1px dashed rgba(var(--col-cmd-rent_borrowed),  0.5) !important;
}
input.inpt_cmd_simple_dash-rental_borrowed::placeholder {
    color: rgba(var(--col-cmd-rent_borrowed),  0.5);
    font-size: 0.9rem;
}

/* game commands */
.btn_cmd_simple_todo {
    color:rgba(var(--col-cmd),  0.9);
    background-color:rgb(1255, 215, 77, 0.1);
    border: 1px solid rgba(var(--col-cmd),  0.5);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 4px;
    letter-spacing:0.2px;
    white-space: nowrap;
    opacity: 0.2;
    text-transform: uppercase;
    vertical-align: 11%;
}
.btn_cmd_simple_left {
    border-radius: 2px 0px 0px 2px !important;
}
.btn_cmd_simple_middle {
    border-left: 0px !important;
    border-right: 0px !important;
    border-radius: 0px !important;
    margin: 0px 0px 0px 0px !important;
    text-align: center !important;
}
.btn_cmd_simple_right {
    border-left: 0px !important;
    border-radius: 0px 2px 2px 0px !important;
    margin: 0px 0px 0px 0px !important;
}
.btn_cmd_simple_right2 {
    border-radius: 0px 2px 2px 0px !important;
    margin: 0px 0px 0px 0px !important;
}
.btn_cmd_simple_bottomdash {
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
    color:rgba(var(--col-cmd),  1) !important;
}

.btn_cmd_simple_bottomdash_leftclose {
    border-left: 1px solid rgba(var(--col-cmd),  0.5) !important;
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
    border-radius: 0px 2px 2px 0px !important;
    color:rgba(var(--col-cmd),  1) !important;
}
.btn_cmd_simple_bottomdash_rightclose {
    border-right: 1px solid rgba(var(--col-cmd),  0.5) !important;
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
    border-radius: 0px 2px 2px 0px !important;
    color:rgba(var(--col-cmd),  1) !important;
}

.btn_cmd_simple_bottomdash {
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
    color:rgba(var(--col-cmd),  1) !important;
}


.inpt_cmd_simple_solid {
    border-bottom: 1px solid rgba(var(--col-cmd),  0.5) !important;
}

.inpt_cmd_simple_dash {
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
}

input.inpt_cmd_simple_dash::placeholder {
  color: rgba(var(--col-cmd),  0.5);
  font-size: 0.9rem;
}

.inpt_cmd_simple_sel {
    font-family: "EEMfont" !important;
	font-size: 0.9rem;
    font-weight: normal;
	color: rgba(var(--col-cmd),  0.9);
	letter-spacing:0.3px;
    text-align: center;
    background-color:rgba(var(--col-cmd),  0.1);
    /*background: transparent;*/
    border:0;
    text-transform: none;
    border-radius: 0px;
    border-bottom: 1px;
    border-color: var(--col-btn-drk-border);
    border-bottom: 1px dashed rgba(var(--col-cmd),  0.5) !important;
    padding: 1x 1px 1px 1px;
    opacity: 0.6;
}
.cmd_simple {
    color:rgba(var(--col-cmd),  0.9);
    background-color:rgba(var(--col-cmd),  0.1);
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    letter-spacing:0.3px;
    white-space: nowrap;
    opacity: 0.6;
    text-transform: uppercase;
    vertical-align: 11%;
    text-align: center;
    border: 0px;
}
.btn_cmd_simple {
    color:rgba(var(--col-cmd), 0.9);
    background-color: rgba(var(--col-cmd), 0.1);
    border: 1px solid rgba(var(--col-cmd), 0.5);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 4px;
    letter-spacing:0.3px;
    white-space: nowrap;
    opacity: 0.7;
    text-transform: uppercase;
    vertical-align: 11%;
    backdrop-filter: blur(10px);
}
.btn_cmd_simple:hover {
    color:rgba(var(--col-cmd),  1.0);
    background-color:rgba(var(--col-cmd),  0.2);
    border: 1px solid rgba(var(--col-cmd),  0.6);
}
.btn_cmd_simple_disabled {
    opacity: 0.3;
    color:rgba(var(--col-cmd),  0.8); 
    background-color: rgba(var(--col-cmd),  0.1);
    border: 1px solid rgba(var(--col-cmd),  0.5);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 4px;
    letter-spacing:0.2px;
    white-space: nowrap;
    cursor: help;
    text-transform: uppercase;
    vertical-align: 11%;
    
}
.btn_cmd_simple_red {
    color:rgba(236, 121, 7, 0.8);
    background-color:rgb(236, 121, 7, 0.1);
    border: 1px solid rgb(236, 121, 7, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 4px;
    letter-spacing:0.2px;
    white-space: nowrap;
    cursor: help;
    text-transform: uppercase;
    vertical-align: 11%;
    backdrop-filter: blur(10px);
}
.btn_cmd_simple_red:hover {
    color:rgba(236, 121, 7, 1);
    background-color:rgb(236, 121, 7, 0.2);
    border: 1px solid rgb(236, 121, 7, 0.6);
}
.btn_export {
    color:rgb(193, 240, 5, 0.9);
    background-color:rgb(193, 240, 5, 0.1);
    border: 1px solid rgb(193, 240, 5, 0.5);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    float: right;
    cursor: pointer;
    margin: 0px 0px 0px 6px;
    letter-spacing:0.2px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_export:hover {
    color:rgb(193, 240, 5, 1);
    background-color:rgb(193, 240, 5, 0.2);
    border: 1px solid rgb(193, 240, 5, 0.6);
}
.btn_clear {
    color:rgba(236, 121, 7, 0.8);
    background-color:rgb(236, 121, 7, 0.1);
    border: 1px solid rgb(236, 121, 7, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    float: right;
    cursor: pointer;
    margin: 0px 0px 0px 6px;
    letter-spacing:0.2px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_clear:hover {
    color:rgba(236, 121, 7, 0.9);
    background-color:rgb(236, 121, 7, 0.2);
    border: 1px solid rgb(236, 121, 7, 0.5);
}
.btn_interact_left {
    color:rgba(207, 228, 236, 0.7);
    background-color:rgb(207, 228, 236, 0.1);
    border: 1px solid rgb(207, 228, 236, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 3px;
    letter-spacing:0.2px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_interact_left:hover {
    color:rgba(207, 228, 236, 0.8);
    background-color:rgb(207, 228, 236, 0.2);
    border: 1px solid rgb(207, 228, 236, 0.5);
}
.btn_clear_left {
    color:rgba(236, 121, 7, 0.8);
    background-color:rgb(236, 121, 7, 0.1);
    border: 1px solid rgb(236, 121, 7, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 3px 0px 3px;
    letter-spacing:0.2px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_clear_left:hover {
    color:rgba(236, 121, 7, 0.9);
    background-color:rgb(236, 121, 7, 0.2);
    border: 1px solid rgb(236, 121, 7, 0.5);
}
.btn_add {
    color:rgba(180, 180, 180, 0.8);
    background-color:rgb(180, 180, 180, 0.1);
    border: 1px solid rgb(180, 180, 180, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 0px 0px 6px;
    letter-spacing:0.2px;
    white-space: nowrap;
}
.btn_add:hover {
    color:rgba(180, 180, 180, 0.9);
    background-color:rgb(180, 180, 180, 0.2);
    border: 1px solid rgb(180, 180, 180, 0.5);
}
.btn_clear_white {
    color:rgba(180, 180, 180, 0.8);
    background-color:rgb(180, 180, 180, 0.1);
    border: 1px solid rgb(180, 180, 180, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    float: right;
    cursor: pointer;
    margin: 0px 0px 0px 6px;
    letter-spacing:0.2px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_clear_white:hover {
    color:rgba(180, 180, 180, 0.9);
    background-color:rgb(180, 180, 180, 0.2);
    border: 1px solid rgb(180, 180, 180, 0.5);
}
.btn_clear_white_left {
    color:rgba(180, 180, 180, 0.8);
    background-color:rgb(180, 180, 180, 0.1);
    border: 1px solid rgb(180, 180, 180, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 3px 0px 0px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_clear_white_left:hover {
    color:rgba(180, 180, 180, 0.9);
    background-color:rgb(180, 180, 180, 0.2);
    border: 1px solid rgb(180, 180, 180, 0.5);
}
.btn_clear_red_left {
    color:rgb(255, 126, 134, 0.8);
    background-color:rgb(255, 126, 134, 0.1);
    border: 1px solid rgb(255, 126, 134, 0.4);
    border-radius: 3px;
    font-size: 0.9rem;
    padding: 0px 3px 0px 3px;
    cursor: pointer;
    margin: 0px 3px 0px 0px;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}
.btn_clear_red_left:hover {
    color:rgba(255, 126, 134, 0.9);
    background-color:rgb(255, 126, 134, 0.2);
    border: 1px solid rgb(255, 126, 134, 0.5);
}
.wallet_btn {
    background-color:rgba(0, 0, 0,0.4);
    /*border: 1px solid rgba(90, 200, 250,0.5);*/
    border-radius: 8px;
    padding: 4px 4px 4px 4px;
    margin: 0px 0px 0px 6px;
    cursor: pointer;
}

#salogo {
    margin-bottom:10px;
}

/* datatables */
.td_data {
    white-space: nowrap;
    color: var(--col-txt);
    font-size: 1.05rem;
    font-family: 'EEMfont';
    letter-spacing:0.6px;
    /*padding: 10px 27px 10px 0px!important;*/
}

.ta_right {
    text-align:right;
}
.ta_left {
    text-align: left;
}

.dataTables_scrollHeadInner .td_data {
    /*padding: 10px 27px 10px 0px !important;*/
    border-bottom-width: 1px !important;
}

.dataTables_scrollHeadInner thead tr{
    border-bottom: 1px solid rgb(89, 91, 94) !important;
}

table.dataTable.row-border > tbody > tr:first-child > th,
table.dataTable.row-border > tbody > tr:first-child > td, table.dataTable.display > tbody > tr:first-child > th,
table.dataTable.display > tbody > tr:first-child > td {
  border-top: none !important;
}

.dt_hoverRow {
    box-shadow: inset 0 0 0 9999px rgba(var(--col-dt-over),0.8);
}
.dt_hoverRow_first {
    box-shadow: inset 0 0 0 9999px rgba(var(--col-dt-alt), 0.6) !important;
}

.hoverRow:hover {
    box-shadow: inset 0 0 0 9999px rgba(var(--col-dt-over),0.8);
}
.pad_top {
    padding-top: 4px !important;
}
.pad_bottom {
    /*padding-top: 2px;*/
    padding-bottom: 3px !important;
}

/* overlay tables */
.typeName {
    font-weight: bold;
    white-space: nowrap;
    color: var(--col-currency) !important;
}
.typeNameDimmed {
    font-weight: bold;
    white-space: nowrap;
    color: #499ec6 !important;
}

.marketPrice {
    white-space: nowrap;
    color: var(--col-currency) !important;
}

/* togglebuttons */

.connectButton {
    display: table-cell;
    /*min-width: 50px;*/
    font-weight: normal;
    font-size: 0.95rem;
    /*background-color: rgba(251, 251, 251,0);*/
    background-color: black;
    text-align: center;
    vertical-align: middle;
    padding: 6px 10px 6px 10px;
    /*margin-top:6px;
    margin-left: 1px;
    margin-bottom: 5px;*/
    cursor: pointer;
    text-transform: uppercase;
    color: var(--col-exit) !important;
    /*opacity: 0.8;*/
    letter-spacing: 1px;
    height: var(--ui-base);
    /*transition: background-color 0.2s ease-in-out;*/
    /*transition: all 150ms ease-in-out 0s;*/
}

.toggleButton {
    display: table-cell;
    /*min-width: 50px;*/
    font-weight: normal;
    font-size: 0.95rem;
    /*background-color: rgba(251, 251, 251,0);*/
    text-align: center;
    vertical-align: middle;
    padding: 6px 10px 6px 10px;
    /*margin-top:6px;
    margin-left: 1px;
    margin-bottom: 5px;*/
    cursor: pointer;
    text-transform: uppercase;
    color: var(--col-txt) !important;
    /*opacity: 0.8;*/
    letter-spacing: 1px;
    height: var(--ui-base);
    /*transition: background-color 0.2s ease-in-out;*/
    /*transition: all 150ms ease-in-out 0s;*/
}

.toggleButton:hover {
    background-color: rgb(251, 251, 251,0.12);
    /*box-shadow: inset 0 0 10px #000;*/
    /*background-color: #0041B2;*/
    /*filter:invert(1);*/
}
.mnu_row {
    background-color: rgb(251, 251, 251,0);
    /*transition: all 150ms ease-in-out 0s;*/
    /*transition: background-color 0.2s ease-in-out;*/
    /*background-color: #0041B2;*/
    /*filter:invert(1);*/
}
.mnu_row:hover {
    background-color: rgb(251, 251, 251,0.12);
    /*box-shadow: inset 0 0 10px #000;*/
    /*background-color: #0041B2;*/
    /*filter:invert(1);*/
}

.toggleButton_hl {
    color: #111;
    display: inline-block;
    min-width: 36px;
    background-color: rgb(0, 0, 0, 0.05);
    text-align: center;
    vertical-align: 11%;
    padding: 1px 8px 1px 8px;
    /*margin-top:6px;*/
    margin-left: 1px;
    /*margin-bottom: 5px;*/
    cursor: pointer;
    border: 1px solid rgb(33, 37, 41, 0.15);
    font-size: 1.081rem;
    opacity: 1.0;
    border-radius: 3px;
}

.toggleButton_ui:hover {
    background-color: rgba(255, 255, 255, 0.3);
    color: #EEE;
    /*border: 1px solid rgb(33, 37, 41, 0.3) !important;*/
}

.toggleButton_ui {
    color: #BBB;
    display: inline-block;
    min-width: 40px;
    background-color: rgba(255, 255, 255, 0.15);
    text-align: center;
    vertical-align: 11%;
    padding: 1px 8px 1px 8px;
    /*margin-top:6px;*/
    margin-left: 1px;
    /*margin-bottom: 5px;*/
    cursor: pointer;
    border: 1px solid rgb(255, 255, 255, 0.1);
    font-size: 1.081rem;
    opacity: 1.0;
    border-radius: 3px;
}

.toggleButton_hl:hover {
    background-color: rgb(0, 0, 0, 0.1);
    color: #000;
    border: 1px solid rgb(33, 37, 41, 0.3) !important;
}

.toggleButton_star {
    opacity: 0.4;
    width: 10px;
    height: 10px;
    padding-top:1px;
    filter: invert(1);
    border-radius: 3px;
}
.toggleButton_star_off {
    opacity: 0.2;
}
.toggleButton_star_on {
    opacity: 1.0;
}

.toggleButton_category_c {
    color: #111;
    display: inline-block;
    background-color: transparent;
    text-align: left !important;
    vertical-align: 11%;
    padding: 1px 2px 1px 8px;
    margin-left: 1px;
    cursor: default;
    border: 1px solid transparent;
    height: 12px;
    font-size:1.081rem;
    opacity:0.7;
}

.toggleButton_hl_c {
    color: #111;
    display: inline-block;
    /*min-width: 25px;*/
    font-size: 1.081rem;
    background-color: rgb(0, 0, 0, 0.05); /*rgba(255, 255, 255, 0.15);*/
    text-align: center;
    vertical-align: 11%;
    padding: 1px 8px 1px 8px;
    /*margin-top:6px;*/
    margin-left: 1px;
    /*margin-bottom: 5px;*/
    cursor: pointer;
    border: 1px solid rgb(33, 37, 41, 0.15);
    opacity: 1.0;
    border-radius: 3px;
}

.toggleButton_hl_c:hover {
    background-color: rgb(0, 0, 0, 0.1);
    color: #000;
    border: 1px solid rgb(33, 37, 41, 0.3) !important;
}

.toggleButton_hl_c_s {
    color: #111;
    display: inline-block;
    /*min-width: 25px;*/
    font-size: 0.9rem;
    height: 11px;
    line-height: 11px;
    background-color: rgb(0, 0, 0, 0.05); /*rgba(255, 255, 255, 0.15);*/
    text-align: center;
    vertical-align: 16%;
    padding: 0px 8 0px 8px;
    /*margin-top:6px;*/
    margin-left: 1px;
    /*margin-bottom: 5px;*/
    cursor: pointer;
    border: 1px solid rgb(33, 37, 41, 0.15);
    opacity: 1.0;
    border-radius: 3px;
}

.toggleButton_hl_c_s:hover {
    background-color: rgb(0, 0, 0, 0.1);
    color: #000;
    border: 1px solid rgb(33, 37, 41, 0.3) !important;
}


.toggleButton_hl_on {
    background-color: var(--col-orange); /*rgb(33, 37, 41, 0.2) !important;*/
    color: #000 !important;
    border: 1px solid rgb(33, 37, 41, 0.5) !important;
    border-radius: 3px;
}

.toggleButton_hl_on:hover {
    background-color: var(--col-orange) !important;/*rgb(33, 37, 41, 0.2) !important;*/
}

.starred_mnu {
    opacity: 0.4;
    width: 14px;
    height: 14px;
    filter: invert(1);
    padding-right: 4px;
}
.starred_off {
    width: 14px;
    height: 14px;
    opacity: 0.2;
    padding-right: 4px;
}
.starred_on {
    width: 14px;
    height: 14px;
    opacity: 1.0;
    padding-right: 4px;
}

.dataTables_filter {
    display: none;
}

.dataTables_filter label {
  font-size: 1rem;
}

.dataTables_filter input {
    width: 220px;
    height: 2.0rem;
    font-family: "EEMfont";
    font-size: 1.20rem;
    font-weight: normal;
    color: var(--col-main);
    letter-spacing:0.1px;
    text-align: center;
    background-color:  var(--col-bg-inpt);
    border:0;
    text-transform: uppercase;
    border-radius: 0px;
}

.dt_searchInput {
    color: #111;
    display: inline-block;
    min-width: 40px;
    background-color: rgb(0, 0, 0, 0.05);;
    text-align: left;
    vertical-align: 11%;
    padding: 1px 10px 2px 10px;
    margin-right: 6px;
    cursor: text;
    border: 0px;
    border-bottom: 1px dashed rgb(33, 37, 41, 0.3) !important;
    font-size: 1.1rem;
    opacity: 1.0;
    width: 100px;
    border-radius: 3px;
}
.dt_searchInput_w {
    color: #eee;
    display: inline-block;
    background-color: rgb(0, 0, 0, 0.05);;
    text-align: left;
    vertical-align: 11%;
    padding: 1px 8px 2px 8px;
    cursor: text;
    border: 0px;
    font-size: 0.9rem;
    opacity: 1.0;
    border-radius: 3px;
}

.ops_set {
    color: #111;
    display: inline-block;
    min-width: 40px;
    background-color: rgb(0, 0, 0, 0.05);;
    text-align: right;
    vertical-align: 11%;
    padding: 1px 8px 2px 8px;
    /*margin-right: 12px;*/
    cursor: text;
    border: 0px;
    border-bottom: 1px dashed rgb(33, 37, 41, 0.3) !important;
    font-size: 1.1rem;
    opacity: 1.0;
    width: 60px;
    border-radius: 3px;/*2px 2px 0px 0px;*/
}

.dataTables_empty {
    text-align: left !important;
    color: var(--col-txt);
    font-size: 1.0rem;
}

.curr_totals { 
    color:var(--col-currency);
}

.dragable {
    z-index: 9999;
}

.neontxt {
    color: var(--col-neon-yellow) !important;
}

.currcol_0 {
    color: var(--col-curr-sol) !important;
}
.currcol_1 {
    color: var(--col-curr-usdc) !important;
}
.currcol_2 {
    color: var(--col-curr-atlas) !important;
}

.headline1 {
    font-size: 1.7rem;
    font-weight: bold;
}

.headline2 {
    font-size: 1.5rem;
    font-weight: bold;
}

.headline3 {
    font-size: 1.3rem;
    font-weight: bold;
}

.headline4 {
    font-size: 1.15rem;
    font-weight: bold;
}

tr.ui-sortable-helper {
    cursor: grabbing !important;
}