/* // ----------------------------------------------------------------------------------------------------------------------
// SECURITY CLASSIFICATION: UNCLASSIFIED
// ----------------------------------------------------------------------------------------------------------------------
// Distribution statement B: Distribution authorized to U.S. government Agencies only, based on critical technology and
// proprietary information, as of 08/20/2012. Other requests shall be referred to the Program Executive Office for C4I
// (PEO C41), attn: PEO C4I SIBR Technology Manager, 4301 Pacific Highway, San Diego, CA 92110
// ----------------------------------------------------------------------------------------------------------------------
// WARNING: This document contains technical data whose export is restricted by the Arms Export Control Act (Title 22,
// U.S.C., sec 2751, et seq.) or the Export Administration Act of 1979, as amended, Title 50, U.S.C., App. 2401 e seq.
// Violation of these export laws are subject to severe criminal penalties. Disseminate in accordance with the
// provisions of DoD directive 5230.25
// ----------------------------------------------------------------------------------------------------------------------
// Restricted Data Rights
// Contract No. N00039-20-D-0008
// Fuse Integration, Inc.
// 4863 Shawline Street #D San Diego, CA 92111
// The Government's rights to use, modify, reproduce, release, perform, display, or disclose this software are restricted
// by paragraph (b)(3) of the Rights in Noncommercial Technical Data and Computer Software - Small Business Innovation
// Research (SBIR) Program clause contained in the above identified contract. Any reproduction of computer software or
// portions thereof marked with this legend must also reproduce the markings. Any person, other than the Government, who
// has been provided access to such data must promptly notify the above named Contractor.
// ---------------------------------------------------------------------------------------------------------------------- */


@import './react-library.css';
@import './theme.css';

/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

/* Set variables */

:root {
    --grey: #555555;
    --green: #63E131;
    --red: #e13131;
    --yellow: #ffdd00;
    --orange: #ff7700;
    --blue: #0077ff;
    --white: #ffffff;
}

/* Page Styling */

::selection {
    background: #333333;
    color: #ccff00;
}

::-moz-selection {
    background: #333333;
    color: #ccff00;
}

/* REMOVE BUTTON ACTIVE HIGHLIGHT */
:focus {
    outline: none;
}

::-moz-focus-inner {
    border: 0;
}

/*STYLE SCROLLBAR IE*/
body {
    scrollbar-face-color: var(--grey);
    scrollbar-shadow-color: #2D2C4D;
    scrollbar-highlight-color: #333333;
    scrollbar-3dlight-color: #1f1f1f;
    scrollbar-darkshadow-color: #111111;
    scrollbar-track-color: #1f1f1f;
    scrollbar-arrow-color: #010101;
}

/*STYLE WEBKIT SCROLLBAR*/
::-webkit-scrollbar {
    background: rgba(0, 0, 0, 0);
    width: 10px;
}

::-webkit-scrollbar-button {
    background: rgba(0, 0, 0, 0);
    display: none;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0);
}

::-webkit-scrollbar-track-piece {
    background: rgba(0, 0, 0, 0);
}

::-webkit-scrollbar-thumb {
    background: var(--grey);
}

::-webkit-scrollbar-corner {
    display: none;
}

::-webkit-resizer {}

#loading {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 99998;
    overflow: hidden;
    background: url('../img/transparent_black_50.png');
    color: #fff;

}

#loadingImg {
    z-index: 99999;
    height: 20px;
    width: 40px;
    position: relative;
}

#loadingImg svg {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: rotation 3s infinite linear;
}

#loadingImg svg polygon {
    transform: translate(-8%, 5%);
}

#loadingText {
    top: 50%;
    left: 0;
    z-index: 99999;
    text-align: center;
    font-family: 16px;
    font-weight: bold;
}

#loading-container {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    flex-direction: row;
    font-size: 25px;
    text-align: center;
}

.loadingGroup {
    position: Absolute;
    width: 100%;
    height: 20px;
    top: 50%;
    margin-top: -10px;
    text-align: center;
    background: #2E2E2E url('../img/groupLoading.gif') no-repeat center center;
}

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

body {
    font-family: Arial, sans-serif !important;
    font-size: 14px;
    color: #333333;
}

#container {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    z-index: -1;
    background: #222222;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzIyMjIyMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMTAxMDEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #222222 0%, #010101 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #222222), color-stop(100%, #010101));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #222222 0%, #010101 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #222222 0%, #010101 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #222222 0%, #010101 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #222222 0%, #010101 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#222222', endColorstr='#010101', GradientType=0);
    /* IE6-8 */
    overflow-y: auto;
    overflow-x: hidden;
}

#contentWrap {
    z-index: 0;
    height: 100%;
    width: 100%;
    top: 63px;
    bottom: 18px;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

#contentWrap.historyOpen {
    top: 88px;
}

#windowWrap {
    position: absolute;
    z-index: 1;
    width: 100%;
    top: 55px;
    bottom: 18px;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

/* Navigation Bar Styles */
.logo img {
    display: block;
    width: auto;
    padding: 5px 0px 4px 0px;
}

#fixedNav {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: #313131;
    color: #fff;
    border-bottom: 1px solid #474747;
}

#fixedNav>*:first-child {
    justify-content: flex-start;
    margin-left: 15px;
}

#logon_fixedNav>*:first-child {
    justify-content: flex-start;
}

#logon_fixedNav>*:last-child {
    justify-content: flex-end;
}

#logon_fixedNav {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #313131;
    color: #fff;
}

#logon_fixedNav>* {
    flex: 2 1 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 15px;
}

#t3Logo {
    display: flex;
    justify-content: flex-start;

}

#t3Logo img {
    height: 32px;
}

#brandStatement {
    align-items: center;
    color: #bbb;
    font-size: 14px;
    font-style: italic;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px
}

#brandStatement img {
    height: 34px;
}


#notification_button {
    width: 15px;
}

#notification_button.empty {
    display: none;
}

#notification {
    float: left;
    min-height: 35px;
    height: 35px;
    line-height: 35px;
    padding-right: 20px;
    font-size: 10px;
    width: 16em;
    overflow: hidden;
    margin-left: 29px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#notification {
    background: url('../img/icon_notification_green.png') no-repeat left 14px;
}

#notification.empty {
    display: none;
    background: url('../img/icon_notification_white.png') no-repeat right 14px;
}

#notification.open {
    height: auto;
    background-color: #353535;
}

#notification li {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #353535;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 10px;
    padding-right: 10px;
    border-bottom: 1px solid #2C2C2C;
}


#notification li:nth-child(odd) {
    background-color: #3a3a3a;
}

#notification img {
    padding-right: 10px;
}

#notification span:hover {
    color: #FFF;
    text-decoration: underline !important;
    background: #353535;
}

#notificationCounter {
    margin-left: 12px;
}

#fixedNav li:hover {
    color: #FFF;
    background: #353535;
}

#fixedNav li.active {
    background: #282828;
}

#fixedNav li:active {
    color: #898989;
    background: #222;
}

#navMenu {
    display: flex;
    justify-content: space-between;
    margin-right: 15px;
    z-index: 99999;
    cursor: pointer;
}

#navMenu li {
    height: 45px;
    line-height: 45px;
    font-size: 16px;
    color: #bbb;
    transition: all .2s linear;
    padding: 0 15px
}

@media (max-width: 1500px) {
    /* #navMenu li{
        padding: 0 10px;
        font-size: 16px;
    } */
}

#navMenu #loginName {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

#loginName ul {
    background: #313131;
    right: 0;
    top: 63px;
    position: absolute;
    z-index: 99999;
    color: #CACACA;
    display: none;
}

#loginName:hover ul {
    display: block;
}

#loginName li {
    padding: 0 30px;
}

#loginName span {
    display: inline-block;
    max-width: 15ex;
    overflow: hidden;
    text-overflow: ellipsis;
}

i.arrow {
    position: relative;
    right: 5px;
    border-left: solid #bbb;
    border-top: solid transparent;
    border-bottom: solid transparent;
    border-width: 5px;
    display: inline-block;
    transition: transform .2s linear;
}

#navMenu label i.arrow {
    transform: rotate(0deg);
}

#loginName:hover i.arrow {
    transform: rotate(90deg);
    border-left: solid 5px #fff;
}

#time {
    position: absolute;
    cursor: default;
}

#time,
#logon_time {
    font-size: 16px;
    color: #fff;
    width: 100%;
    text-align: center;
    font-family: Arial;
    flex: 0 0 80px;
}


/**
 * Chat window and components
 */
.chat {
    width: 420px;
    background: #2E2E2E;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    border: 1px solid #282828;
    position: absolute;
    left: 100px;
    top: 125px;
    z-index: 998;
}

.chatHeader {
    padding: 0px 0px 0px 10px;
    height: 30px;
    background: url('../img/black_gradient.jpg') repeat;
    border-bottom: 1px solid #000000;
    box-shadow: 0 1px 0 #424242;
    -webkit-box-shadow: 0 1px 0 #424242;
    -moz-box-shadow: 0 1px 0 #424242;
    -o-box-shadow: 0 1px 0 #424242;
    cursor: url(../img/openhand.cur), default;

}

.chatHeader .text {
    line-height: 30px;
    font-weight: bold;
    font-size: 11px;
    text-align: left;
    color: #fff;
}

.chat.hidden {
    visibility: hidden;
}

.chat .input {
    margin: 10px;
    margin-top: 12px;
    width: 270px;
    border-radius: 3px;
    padding: 6px 0 6px 6px;
    background: #202020;
    border: 1px solid #1D1D1D;
    color: #DADADA;
    box-sizing: content-box;
}

.chat .submit {
    text-align: center;
    margin: 10px;
    width: 100px;
    float: right;
    background: #242424;
    text-decoration: none;
    line-height: 30px;
    border: 1px solid #242424;
    border-radius: 3px;
    color: #fff;
    font-size: 11px;
    transition: background-color .5s;
    cursor: pointer;
}

.chat .submit:hover {
    background: var(--green);
    color: #333;
    border-color: black;
}

.chat .chat-scroll {
    height: 400px;
    width: 420px;
    padding: 10px;
}

.chat .jspContainer {
    width: 420px !important;
}

.chat .jspPane {
    width: 420px !important;
    padding: 0 !important;
}

.chat .jspVerticalBar {
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
}

.chat .messages {
    background-color: #424242;
    font-size: 12px;
    width: 420px;
}

.chat .messages li {
    width: 370px;
    float: left;
    margin-bottom: 5px;
    margin-right: 15px;
    padding: 5px;
    border: 1px solid #333333;
    border-radius: 5px;
    word-wrap: break-word;

}

.chat .messages li.owner {
    float: right;
    background-color: #3e3e3e
}

.chat .messages .username {
    color: #e0861b;
    padding: 5px;
}

.chat .messages .timestamp {
    color: #888888;
    font-size: 10px;
    padding: 5px;
}

.chat .messages .message {
    color: white;
    padding: 5px;
}

.chat.ui-draggable-dragging .chatHeader {
    cursor: url(../img/closedhand.cur), default;
}

/* History Styling */
.historyContainer {
    z-index: 9000;
    width: 100%;
    height: 35px;
    position: relative;
    top: 0px;
    background: #313131;
    display: none;
    font-size: 12px;
}

.historyWindow {
    padding-right: 40px;
}

.historyContainer .vis-time-axis .vis-text {
    color: #DADADA;
}

.historyContainer .vis-panel .vis-custom-time {
    z-index: 2;
}

.historyLoading {
    background: url('../img/groupLoading.gif') no-repeat center center;
    height: 16px;
    width: 16px;
    position: absolute;
    right: 5px;
    top: 0px;
    margin: 8px;
}


/* Google Maps Styling */

#map_canvas {
    height: 100%;
    width: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    margin: 0 auto;
    background: #252525;
    z-index: 0;
}

/* Ship Group Styling */

.shipGroup {
    width: 910px;
    height: 300px;
    overflow: hidden;
    background: #2e2e2e;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    border: 1px solid #282828;
    position: absolute;
    left: 40px;
    top: 200px;
    bottom: initial;
    z-index: 998;
    min-height: 30px;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    user-select: none;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
}

.shipGroup::selection {
    background: transparent;
}

.shipGroupMinimize,
.shipGroupMaximize {
    font-size: 18px;
}

.minimized {
    overflow: hidden;
}

.shipGroupHeader {
    color: #fff;
    background: #191919;
    font-size: 14px;
    padding: 0 113px 0 32px;
    height: 30px;
    border-bottom: 1px solid #000000;
    box-shadow: 0 1px 0 #424242;
    -webkit-box-shadow: 0 1px 0 #424242;
    -moz-box-shadow: 0 1px 0 #424242;
    -o-box-shadow: 0 1px 0 #424242;
    cursor: url(../img/openhand.cur), default;
}

.shipGroupName {
    color: #fff;
    line-height: 30px;
    font-weight: bold;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
}

.shipGroupNameInput {
    color: #fff;
    width: 280px;
    margin-top: 2px;
    border-radius: 3px;
    padding: 3px 0 5px 3px;
    display: inline-block;
    background: #333;
    border: 1px solid #222;
    font-size: 12px;
    font-weight: bold;
}

.shipGroupOwnerName {
    color: #fff;
    height: 30px;
    display: inline-block;
    float: right;
    border-left: 1px solid #2C2C2C;
    line-height: 30px;
    text-align: center;
    transition: all .25s;
    font-size: 11px;
    padding: 0 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
}

.shipGroupCreated {
    color: #fff;
    height: 30px;
    display: none;
    float: right;
    border-left: 1px solid #2C2C2C;
    line-height: 30px;
    text-align: center;
    transition: all .25s;
    font-size: 11px;
    padding: 0 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
}

.saveLoadingImg {
    background: url('../img/ajax-loader.gif') no-repeat center center !important;
}

.groupHeaderButton {
    color: #fff;
    min-width: 30px;
    height: 30px;
    display: inline-block;
    float: right;
    border-left: 1px solid #2C2C2C;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    font-size: 11px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: background-color .25s;
    -webkit-transition: background-color .25s;
    -moz-webkit-transition: background-color .25s;
}

.groupHeaderButton:hover {
    background-color: #535353;
}

.zuluClock:hover {
    background-color: None;
}

.groupHeaderButton.shipGroupCompare {
    background: url('../img/icons_button_view_white.svg') center center no-repeat;
    background-size: 18px 21px;
}

.groupHeaderButton.shipGroupMinimize {
    background-image: url("../img/icons_button_expand.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    transform: rotate(180deg);
    border-left: none;
    border-right: 1px solid #2C2C2C;
}

.groupHeaderButton.shipGroupMaximize {
    background: url('../img/icons_button_expand.svg') center center no-repeat;
    background-size: 15px 15px;
}

.groupHeaderButton.shipGroupClose {
    background: url('../img/icons_button_close.svg') center center no-repeat;
    background-size: 13px 13px;
}

.groupHeaderButton.shipGroupSave {
    background: url('../img/icons_button_ok_grey.svg') center center no-repeat;
    background-size: 17px 15px;
}


.groupHeaderButton.shipGroupSave.activateSave {
    background: url('../img/icons_button_ok_white.svg') center center no-repeat;
    background-size: 17px 15px;
}

.groupHeaderButton.shipGroupDelete {
    background: url('../img/icons_button_delete_white.svg') center center no-repeat;
    background-size: 21px 17px;
}

.groupHeaderButton.shipGroupCompare.deactivateShowGroupCompare {
    background: url('../img/icons_button_view_grey.svg') center center no-repeat;
    background-size: 18px 21px;
}

.groupHeaderButton.shipGroupDelete.deactivateDelete {
    background: url('../img/icons_button_delete_grey.svg') center center no-repeat;
    background-size: 21px 17px;
}

.groupHeaderButton.shipGroupCompare:hover {
    background: #535353 url('../img/icons_button_view_white.svg') center center no-repeat;
    background-size: 18px 21px;
}

.groupHeaderButton.shipGroupMinimize:hover {
    background-image: url("../img/icons_button_expand.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    transform: rotate(180deg);
}


.groupHeaderButton.shipGroupMaximize:hover {
    background: #535353 url('../img/icons_button_expand.svg') center center no-repeat;
    background-size: 15px 15px;
}

.groupHeaderButton.shipGroupClose:hover {
    background: #535353 url('../img/icons_button_close.svg') center center no-repeat;
    background-size: 13px 13px;
}

.groupHeaderButton.shipGroupSave:hover {
    background: url('../img/icons_button_ok_grey.svg') center center no-repeat;
    background-size: 17px 15px;
}

.groupHeaderButton.shipGroupSave.activateSave:hover {
    background: #535353 url('../img/icons_button_ok_white.svg') center center no-repeat;
    background-size: 17px 15px;

}

.groupHeaderButton.shipGroupDelete:hover {
    background: #535353 url('../img/icons_button_delete_white.svg') center center no-repeat;
    background-size: 21px 17px;
}

.groupHeaderButton.shipGroupDelete.deactivateDelete:hover {
    background: #535353 url('../img/icons_button_delete_white.svg') center center no-repeat;
    background-size: 21px 17px;
}

.groupHeaderButton.shipGroupCompare.deactivateShowGroupCompare:hover {
    background: #535353 url('../img/icons_button_view_grey.svg') center center no-repeat;
    background-size: 18px 21px;
}

.shipGroupSave,
.shipGroupSitRep,
.sitRepSave,
.shipGroupDelete,
.sitRepCopy {
    min-width: 30px;
}

.shipGroupSitRep {
    padding: 0 5px;
}

.shipSitRepStatus {
    display: none;
    /* will get set to inline-flex in code */
    flex-direction: column;
    justify-content: space-between;
    align-content: center;
    height: 23px;
    min-width: 20px;
    padding: 4px 3px 4px 3px;
    cursor: default;
    border-left-width: 0px;
}

.shipGroupSitRepIndicatorText {
    height: 10px;
    font-size: 8px;
    line-height: 8px;
}

.sitRep .shipSitRepStatus {
    border-left-width: 1px;
}

.shipSitRepStatus:hover {
    background-color: rgba(0, 0, 0, 0);
}

.shipGroupSitRepIndicator {
    position: relative;
    color: rgb(255, 255, 255) !important;
    text-align: center;
    height: 14px;
    font-size: 12px;
    line-height: 12px;
    font-weight: bold;
}

.shipGroupSitRepIndicator.error {
    color: #C32;
}

.newSitRepCount {
    min-width: 0px !important;
    border: none;
    color: rgb(103, 228, 29);
    font-size: 11px;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: bold;
}

.newSitRepCount:empty {
    padding: 0px;
}

.shipGroupSitRepSelect {
    min-width: 20px !important;
    border: none;
    width: 20px;
    background: #202020;
    font-size: 11px;
    outline: none;
    font-family: "Courier New", Courier, monospace;
}

.shipGroupSitRepSelect:hover {
    background: #535353;
}

.shipGroupDrop {
    margin: 0 auto;
    height: 100%;
    overflow-x: hidden !important;
}

.shipGroupLabels {
    background: #2E2E2E;
    position: absolute;
    z-index: 99999;
    top: 31px;
    left: 0;
    display: block;
    width: 100%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
    user-select: none;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    cursor: default;
    font-size: 0;
}

.shipGroupLabelsChit {
    cursor: pointer;
    margin-left: 2px;
    padding-right: 11px;
    width: 167px;

}

.shipGroupLabelsChit li {
    display: inline-block;
    width: 17px !important;
    line-height: 25px !important;
    font-weight: normal !important;
    margin-right: 5px;
    text-align: center;
    font-size: 9px;
    color: #7A7A7A;
    padding-top: 5px;
}

.topIssuesTable {
    background-color: #2e2e2e;
    overflow: hidden;
}

.topIssuesTable th {
    border-bottom: 1px solid #707070;
}

.topIssuesTable .L22header {
    padding-left: 2px;
}

.topIssuesTable tr {
    height: 36px !important;
}

.topIssuesTable td {
    border-right: 1px solid #363636;
    border-left: 1px solid #363636;
}

.topIssuesTable .fieldHeader {
    width: 55px;
}

.topIssuesTable .shipIdCol {
    width: 55px;
    text-align: left !important;
    padding-left: 10px !important;
}

.topIssuesTable .chitCol {
    width: 160px;
}

.topIssuesTable .noBorderCol {
    border: none;
}

.topIssuesTable .chitCol .chit {
    padding-right: 9px;
}

.topIssuesTable .buttonCol {
    padding-left: 5px !important;
    text-align: left !important;
    line-height: 6px;
    border: none;
    width: 60px;
}

.topIssuesTable .width60 {
    width: 60px !important;
}

.topIssuesTable .width100 {
    width: 100px !important;
}

.topIssuesTable .dlrp {
    width: 88px !important;
}

.topIssuesTable .DLRPLat {
    height: 24px;
    line-height: 24px;
    width: 88px;
    display: block;
}

.topIssuesTable .DLRPLong {
    height: 11px;
    line-height: 0px;
    width: 88px;
    display: block;
}

.topIssuesTable #L22 {
    text-align: right;
    margin-right: 8px;
}

.topIssuesTable .activeLink {
    position: absolute;
    bottom: 1px;
    margin-left: 2.5px;
}

.shipGroupItems {
    padding: 0;
    width: 100%;
    display: block;
    overflow-x: hidden !important;
    overflow-y: hidden;
    margin-top: 25px;
}

.shipGroupItems li {
    display: inline-block;
    float: left;
    color: #DADADA;
}

.shipGroupItems li .shipname {
    color: var(--white);
}

.shipGroupItems li .shipname.old {
    text-decoration: line-through;
    color: #969696;
}

.button.shipItemConfiguration {
    background: transparent url('../img/icons_button_view_white.svg') center center no-repeat;
    background-size: 13px 13px;
    width: 20px;
    right: 50px;
    margin-right: 3px;
}

.button.shipItemConfiguration:hover {
    background: #888 url('../img/icons_button_view_white.svg') center center no-repeat;
    background-size: 13px 13px;
}

.shipItemClose {
    position: absolute;
    background: url('../img/icons_button_delete_white.svg') center center no-repeat !important;
    background-size: 10px 10px !important;
}

.shipItemClose:hover {
    position: absolute;
    background: #888 url('../img/icons_button_delete_white.svg') center center no-repeat !important;
    background-size: 10px 10px !important;
}

.shipGroupItems li ul li {
    margin-right: 3px;
}

.shipGroupItems>li {
    width: 100%;
}

.shipGroupItems li:last-child {
    margin-right: 0;
}

.shipGroupItems ul {
    line-height: 37px;
    font-size: 12px;
    padding: 0 10px;
    height: 37px;
    clear: both;
    display: block;
    background: #3C3C3C;
    list-style-type: none;
}

.shipGroupItems>li:nth-child(even) ul {
    background: #3A3A3A !important;
}

/* SitRep List Syling */
.sitRep {
    width: 420px;
    height: 500px;
    background: #2E2E2E;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    border: 1px solid #282828;
    position: absolute;
    left: 100px;
    top: 200px;
    z-index: 998;
}

.sitRep.ui-draggable-dragging .sitRepHeader {
    cursor: url(../img/closedhand.cur), default;
}

.sitRepHeader {
    padding: 0 113px 0 32px;
    height: 30px;
    background: #191919;
    border-bottom: 1px solid #000000;
    box-shadow: 0 1px 0 #424242;
    -webkit-box-shadow: 0 1px 0 #424242;
    -moz-box-shadow: 0 1px 0 #424242;
    -o-box-shadow: 0 1px 0 #424242;
    cursor: url(../img/openhand.cur), default;
}

.pushButton {
    border: inset;
    border-top: solid 2px;
    border-left: solid 2px;
    border-bottom: solid 2px;
    border-right: solid 2px;
}

.pushButton.off {
    border-top: solid 1px #777;
    border-left: solid 1px #777;
    border-bottom: solid 1px #222;
    border-right: solid 1px #222;
}

.pushButton.on {
    background-color: rgb(36, 36, 36);
    border-top: solid 1px #222;
    border-left: solid 1px #222;
    border-bottom: solid 1px #777;
    border-right: solid 1px #777;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
}

.sitRepViewMode {
    background: url('../img/icons_button_edit_white.svg') center center no-repeat;
    background-size: 14px 14px;
    min-width: 22px !important;
    height: 22px !important;
    margin: 2px;
    margin-top: 3px;
}

.sitRepErrorSwitch {
    background: url('../img/icons_button_view-errors_white.svg') center center no-repeat;
    background-size: 14px 14px;
    /*  setting svg size */
    min-width: 22px !important;
    height: 22px !important;
    margin: 2px;
    margin-top: 3px;
}

.sitRepCopy {
    background: url('../img/icons_button_copy_white.svg') center center no-repeat;
    background-size: 14px 14px;
    min-width: 22px !important;
    height: 22px !important;
    margin: 2px;
    margin-top: 3px;
}

.sitRepSave {
    background: url('../img/icons_button_ok_grey.svg') center center no-repeat;
    background-size: 14px 14px;
    min-width: 22px !important;
    height: 22px !important;
    margin: 2px;
    margin-top: 3px;
}

.sitRepSave.activateSave {
    background: url('../img/icons_button_ok_white.svg') center center no-repeat;
    background-size: 17px 15px;
}

.sitRepSave.activateSave:hover {
    background: #535353 url('../img/icons_button_ok_white.svg') center center no-repeat;
    background-size: 17px 15px;
}

.sitRepCheck {
    background: url('../img/icons_button_check-document_grey.svg') center center no-repeat;
    background-size: 14px 14px;
    min-width: 22px !important;
    height: 22px !important;
    margin: 2px;
    margin-top: 3px;
}

.sitRepCheck.activateCheck {
    background: url('../img/icons_button_check-document_white.svg') center center no-repeat;
    background-size: 14px 14px;
}

/*
There is issue with screen bigger than  1280 x 1024 for some screen.
.sitRepContainer{
    overflow: hidden;
} */

.sitRepCopyContainer {
    position: absolute;
    top: 32px;
    bottom: 6px;
    left: 0px;
    right: 6px;
}

/*.sitRepCopyContainer textarea{
    width: 100%;
    height: 100%;
}*/


.sitRepName {
    line-height: 30px;
    font-weight: bold;
    font-size: 11px;
    text-align: left;
    color: #fff;
}

.sitRepClose {
    background: url('../img/icons_button_close.svg') center center no-repeat;
    background-size: 13px 13px;
}

.sitRepInfoHeader {
    background-color: rgb(36, 36, 36);
    border: solid 1px #222;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -o-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    margin-top: 4px;
    padding: 5px;
    width: 98%;
    margin-left: 1%;
    box-sizing: border-box;
    list-style-type: none;
    font-weight: bold;
    text-align: center;
    color: #fff;
    text-align: left;
}

.sitRepInfoHeader .label {
    display: inline-block;
    text-align: left;
    font-size: 11px;
    width: 100px;

}

.sitRepInfoHeader .value {
    text-align: left;
    font-size: 11px;
}

.sitRepErrorInfoHeader {
    background-color: rgb(36, 36, 36);
    border: solid 1px #222;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    -o-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    margin-top: 4px;
    padding: 5px;
    width: 98%;
    margin-left: 1%;
    box-sizing: border-box;
    list-style-type: none;
    font-weight: bold;
    text-align: center;
    color: #fff;
}

.sitRepItems {
    padding: 0;
    width: 420px;
    height: 100%;
    display: block;
    /*    overflow-x: hidden!important;*/
    /*    overflow-y: auto; */
}

.sitRepLine:hover {
    border-color: #fff;
}

.sitRepLine,
.sitRepLineSection {
    border: 1px solid #252525;
    margin-top: 4px;
    padding: 5px;
    width: 98%;
    margin-left: 1%;
    box-sizing: border-box;
    background: #3C3C3C;
    box-shadow: inset 0 1px 0px #4B4B4B;
    -webkit-box-shadow: inset 0 1px 0px #4B4B4B;
    -moz-box-shadow: inset 0 1px 0px #4B4B4B;
    -o-box-shadow: inset 0 1px 0px #4B4B4B;
    list-style-type: none;
}

.sitRepLine .sitRepLabel {
    margin: 5px 0 0 5px;
    font-size: 12px;
    height: 20px;
    color: #dadada;
    width: 90%;
    float: left;
}

.sitRepShipList {
    font-size: 12px;
    margin-top: 5px;
    margin-right: 5px;
    text-align: right;
    color: var(--red);
    float: left;
    height: 20px;
    width: 3%;

}

.sitRepErrorList {
    margin: 5px;
    color: #dadada;
    font-size: 12px;
    line-height: 16px;
}

.sitRepErrorList ul {
    list-style: disc;
    list-style-position: inside;
    margin: 0;
}

.sitRepWarningsList {
    margin: 5px;
    color: #dadada;
    font-size: 12px;
    line-height: 16px;
}

.sitRepWarningsList ul {
    list-style: disc;
    list-style-position: inside;
    margin: 0;
}

.sitRepLine .sitRepLineIndicator {
    width: 8px;
    height: 8px;
    position: relative;
    top: 5px;
    border-radius: 3px;
    float: left;
    border: 1px solid #a1a3a5;
}

.sitRepLineIndicator_green {
    background: var(--green) !important;
    border-color: var(--green) !important;
}

.sitRepLineIndicator_red {
    background: #C32 !important;
    border-color: #C32 !important;
}

.sitRepLineIndicator_yellow {
    background: #FFFF00 !important;
    border-color: #FFFF00 !important;
}

.sitRepCollapse {
    cursor: pointer;
    border-radius: 3px;
    padding: 3px;
    background-color: #4D4D4D;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.sitRepLineSection .sitRepLabel {
    text-align: center;
    margin: 5px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

.sitRepInputWrap {
    margin: 0 10px 0 5px;
}

.sitRepLine textarea {
    min-height: 20px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    border-radius: 3px;
    background: rgb(36, 36, 36);
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    border: 1px solid #181818;
    color: #dadada;
    transition: border .25s;
    text-transform: uppercase;
}

.sitRepLine textarea:disabled {
    min-height: 20px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    /* border-radius: 3px; */
    /* background: rgb(36, 36, 36); */
    /* box-shadow: inset 0 2px 5px rgba(0,0,0,0.25); */
    /* border: 1px solid #181818; */
    box-shadow: none;
    background: none;
    color: #dadada;
    transition: border .25s;
    text-transform: uppercase;
}

.sitRepInputError {
    border-color: #C32 !important;
    color: #C32 !important;
}

.sitRepLine textarea:focus {
    border: 1px solid #5E5C5C;
}

.sitRepLine {
    position: relative;
}

.sitRepErrorMaster {
    position: absolute;
    top: -60px;
    margin: 0 auto;
    background: #1E1E1E;
    border-radius: 2px;
    border: 1px solid #fff;
    text-align: left;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
    color: #FFF;
    font-size: 14px;
    padding: 10px 15px;
    width: 370px;
    display: block;
    z-index: 9999999;
    left: 7px;
    overflow: visible;
    pointer-events: none;
}

.sitRepErrorMessage {
    position: absolute;
    top: -60px;
    margin: 0 auto;
    background: #1E1E1E;
    border-radius: 2px;
    border: 1px solid #fff;
    text-align: left;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
    color: #FFF;
    font-size: 13px;
    padding: 10px 15px;
    width: 370px;
    display: block;
    z-index: 9999999;
    left: 7px;
    overflow: visible;
    pointer-events: none;
}

.sitRepErrors {
    color: #C32;
    font-size: 12px;
    display: inline-block;
    overflow: hidden;
}

.sitRepErrors ul li {
    margin-top: 3px;
    font-weight: bold;
}

.sitRepWarnings {
    color: #ffff00;
    font-size: 12px;
    display: inline-block;
    overflow: hidden;
}

.sitRepWarnings ul li {
    margin-top: 3px;
    font-weight: bold;
}

.expandIndicator {
    float: right;
    margin-right: 1px;
    background-color: #3C3C3C;
    width: 15px;
    height: 15px;
    border-radius: 7px;
    text-align: center;
    color: white;
}

/*.sitRepItems li:last-child {
    margin-right: 0;
}*/

/*.sitRepItems li {
    line-height: 35px;
    font-size: 12px;
    height: 35px;
    display: block;
    margin: 1px auto 0 auto;
    border: 1px solid #252525;
    border-radius: 3px;
    padding-right: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    background: #3C3C3C;
    box-shadow: inset 0 1px 0px #4B4B4B;
    -webkit-box-shadow: inset 0 1px 0px #4B4B4B;
    -moz-box-shadow: inset 0 1px 0px #4B4B4B;
    -o-box-shadow: inset 0 1px 0px #4B4B4B;
    list-style-type: none;
    position: relative;
}*/
/*
.sitRepItems li .sitRepLineField {
    width: 195px;
    margin-left: 10px;
}

.sitRepItems li.sitRepLineSection {
    text-align: center;
    font-weight: bold;
    font-size: 11px;
    color: #FFA300;
    text-shadow: 0 1px 0 #222;
}

.sitRepItems li .sitrepInputLabelled {
    height: 24px;
    width: 150px;
    border-radius: 3px;
    margin-left: 25px;
    padding: 0 0 0 10px;
    background: rgb(36, 36, 36);
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.25);
    border: 1px solid #181818;
    color: #dadada;
    right: 40px;
    top: 5px;
    position: relative;
    transition: border .25s;
}

.sitRepItems li .sitrepInputUnlabelled {
    height: 24px;
    border-radius: 3px;
    background: rgb(36, 36, 36);
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.25);
    border: 1px solid #181818;
    color: #dadada;
    left: 25px;
    right: 40px;
    top: 5px;
    position: relative;
    transition: border .25s;
}


.sitRepItems li input:focus {
    border: 1px solid #5E5C5C;
}
*/

/* Full Ships List Styling */
#fixedList {
    background: none !important;
    pointer-events: none;
    height: 500px;
    width: 275px;
    position: absolute;
    top: 125px;
    right: 0;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    z-index: 99999;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#fixedListWrap {
    pointer-events: all;
    background: #2E2E2E;
    position: absolute;
    border: 1px solid #282828;
}

.fixedListAnimate {
    right: 0;
    -webkit-transition: transform 0.5s ease-in-out;
    -moz-transition: transform 0.5s ease-in-out;
    -o-transition: transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out;
}

.fixedListAnimate.right {
    transform: translate(295px, 0);
}

#fixedListWrap.popped {
    left: auto;
    right: auto;
}

#fixedListHeader {
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    font-weight: 100;
    background: #2E2E2E;
    text-align: center;
    color: #DADADA;
    border-bottom: 1px solid #1A1A1A;
}

#shipListWrap {
    border-top: 1px solid #3A3A3A;
}

#shipListToggleShips {
    width: 104.5px;
    display: inline-block;
    height: 28px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    border-right: 1px solid #282828;
    border-bottom: 2px solid #2E2E2E;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
}

#shipListToggleGroups {
    width: 104.5px;
    display: inline-block;
    height: 28px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    border-bottom: 2px solid #2E2E2E;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
}

#shipListToggleShips.shipListToggleOff:hover,
#shipListToggleGroups.shipListToggleOff:hover {
    background: #333 !important;
    border-bottom: 2px solid #333 !important;
}

#shipListToggleShips.shipListToggleOn:hover,
#shipListToggleGroups.shipListToggleOn:hover {
    background: #333 !important;
}

#shipListToggle .shipListToggleOn {
    color: #fff;
    border-bottom: 2px solid #fff !important;
}

#shipListToggle .shipListToggleOff {
    background: #2E2E2E;
    color: #bbb;
}

#listSearch {
    width: 240px;
    margin: 0 auto;
    padding: 10px 0;
    height: 30px;
}

#listSearch input[type="search"] {
    border-radius: 3px;
    width: 232px;
    padding: 6px 0 6px 6px;
    background: #202020 url('../img/searchbar.png') center right no-repeat;
    border: 1px solid #1D1D1D;
    color: #DADADA;
    transition: all .5s;
    box-sizing: content-box;
}

#listSearch input[type="search"]:focus {
    border: 1px solid #fff;
    color: #fff;
}

#listSearch input[type="search"]::-webkit-input-placeholder {
    color: #5C5C5C;
}

#listSearch input[type="search"]:-moz-placeholder {
    /* Firefox 18- */
    color: #5C5C5C;
}

#listSearch input[type="search"]::-moz-placeholder {
    /* Firefox 19+ */
    color: #5C5C5C;
}

#listSearch input[type="search"]:-ms-input-placeholder {
    color: #5C5C5C;
}

#fixedListItemsWrapper .scroll-pane {
    height: 397px;
    width: 275px;
}

#fixedListItems2Wrapper .scroll-pane {
    height: 347px;
    width: 275px;
}

#fixedListItems,
#fixedListItems2 {
    width: 100%;
    margin: 0 auto;
}

.dragging {
    width: 300px !important;
    line-height: 35px;
    font-size: 12px;
    width: 300px !important;
    padding: 0 5px;
    height: 35px;
    clear: both;
    color: #DADADA;
    display: block;
    margin: 1px auto 0 auto;
    background: #3C3C3C;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 4px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid #111;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 0px #4B4B4B;
    -moz-box-shadow: inset 0 1px 0px #4B4B4B;
    -o-box-shadow: inset 0 1px 0px #4B4B4B;
    list-style-type: none;
    cursor: url(../img/closedhand.cur), default;
}

#fixedListItems2 ul {
    line-height: 35px;
    font-size: 12px;
    width: 94%;
    padding: 0 2.5%;
    height: 35px;
    clear: both;
    color: #A8A8A8;
    display: block;
    background-color: #3C3C3C;
    list-style-type: none;
}

#fixedListItems div {
    transition: all .25s;
    border-left: 2px solid #3C3C3C;
    cursor: url(../img/openhand.cur), default;
    overflow: hidden;
}

#fixedListItems .chits {
    transition: none;
}

.shipCompareShipHeaderTitle .chits {
    position: absolute;
    width: 130px;
    height: 35px;
    right: 9px;
    top: 25px !important;
}

.shipGrouper .chits {
    margin-left: 8px;
}

.chits {
    background-image: url(../img/chitsprite.png);
    background-repeat: no-repeat;
    transition: none;
}

.shipGrouper .chits {
    width: 133px;
    height: 35px;
    float: left;
}

#fixedListItems2 li ul {
    cursor: pointer;
    transition: all .25s;
    border-left: 2px solid #3C3C3C;
}

#fixedListItems2 li:nth-child(even) ul {
    background-color: #3A3A3A;
}

#fixedListItems div:nth-child(even) {
    background-color: #3A3A3A;
}

#fixedListItems div:hover,
#fixedListItems2 li ul:hover {
    /*color: #FFF!important;*/
    font-weight: bold;
    border-left: 2px solid #fff;
}

#fixedListItems2 div:active {
    background: #363636;
}

.openedGroup {
    border-left: 2px solid #fff !important;
}

#fixedListItems div,
#fixedListItems2 ul li,
.dragging li,
.dragging div {
    display: inline-block;
    float: left;
    margin-right: 2px;
}

#fixedListItems div:last-child,
#fixedListItems ul li:last-child {
    margin-right: 0;
}

.inner li {
    width: 10% !important;
    display: inline-block !important;
    list-style-type: none !important;
    float: left;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#fixedListHandle {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    border-right: 1px solid #282828;
    cursor: pointer;
}

.closedIcon {
    background: #2E2E2E url('../img/close.png') center no-repeat;
    left: 0px;
}

#fixedListDragHandle {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    border-right: 1px solid #282828;
    cursor: url(../img/openhand.cur), default;
}

#fixedList.ui-draggable-dragging #fixedListDragHandle {
    cursor: url(../img/closedhand.cur), default;
}

.dragIcon {
    background: #2E2E2E url('../img/drag_icon.png') center no-repeat;
    left: 0px;
}

.shipGroupItems .button {
    margin-top: 8px;
}

.openIcon {
    background: #2E2E2E url('../img/open.png') 8px center no-repeat;
    left: -31px;
    border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px;
    -webkit-border-radius: 3px 0 0 3px;
    -o-border-radius: 3px 0 0 3px;
    border: 1px solid #282828;
    border-right: none;
    border-bottom: 1px solid #282828;
    box-shadow: inset 0 1px 0 #3A3A3A, 0 1px 1px rgba(0, 0, 0, 0.43);
    -webkit-box-shadow: inset 0 1px 0 #3A3A3A, 0 1px 1px rgba(0, 0, 0, 0.43);
    -moz-box-shadow: inset 0 1px 0 #3A3A3A, 0 1px 1px rgba(0, 0, 0, 0.43);
    -o-box-shadow: inset 0 1px 0 #3A3A3A, 0 1px 1px rgba(0, 0, 0, 0.43);
}

#popButton {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: auto;
    right: 0;
    cursor: pointer;
    border-left: 1px solid #282828;
}

.pop {
    background: #2E2E2E url('../img/pop.png') center no-repeat;
}

.pin {
    background: #2E2E2E url('../img/pin.png') center no-repeat;
}

.stick {
    top: 100px !important;
    left: auto !important;
    right: 0 !important;
}

/* Append Items Additional Styling */
.items {
    overflow: hidden;
    line-height: 35px;
    font-size: 12px;
    width: 89%;
    padding: 0 5%;
    height: 35px;
    clear: both;
    display: block;
    margin: 10px 0;
    border: 1px solid #282828;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    background: url('../img/transparent_black_15.png') repeat;
    box-shadow: inset 0 1px 3px #3A3A3A;
    -webkit-box-shadow: inset 0 1px 3px #3A3A3A;
    -moz-box-shadow: inset 0 1px 3px #3A3A3A;
    -o-box-shadow: inset 0 1px 3px #3A3A3A;
    list-style-type: none;
}

.button {
    padding: 0 !important;
    background: #696969;
    color: #FFF;
    font-size: 8px;
    height: 20px;
    cursor: pointer;
    width: 20px;
    text-align: center;
    line-height: 10px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #2B2B2B;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: 0px;
}

.button:hover {
    background: #e23434;
    text-decoration: none;
}

.button:active {
    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    background: #e23434;
    border: solid 1px #203E5F;
}

#modalOverlay {
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    background: url('../img/transparent.png') repeat;
}

#modalWrap {
    display: none;
    width: 700px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin-top: -300px;
    margin-left: -350px;
    position: absolute;
    background: #2E2E2E;
    z-index: 9999998;
    text-align: center;
    border-radius: 3px;
}

#modalWrap.patch {
    display: none;
    width: 85%;
    height: 90%;
    top: 5%;
    left: 7%;
    margin-top: 0;
    margin-left: 0;
    position: absolute;
    background: #2E2E2E;
    z-index: 9999998;
    text-align: center;
    border-radius: 3px;
}

#adminModal {
    text-align: center;
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    z-index: 9999999;
    color: #dadada;
}

#about-content {
    margin-bottom: 10px;
}

#aboutModal {
    overflow: hidden;
    text-align: center;
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    z-index: 9999999;
    color: #dadada;
    max-height: 100%;
    max-width: 100%;
}

#aboutModalContent {
    text-align: left;
    margin-left: 30px;
    margin-right: 30px;
}

#helpModal {
    text-align: left;
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    z-index: 9999999;
    color: #dadada;
}

#patchModal {
    text-align: left;
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    z-index: 9999999;
    color: #dadada;
}

.modalTitle {
    text-align: center;
    width: 100%;
    height: 45px;
    font-size: 11px;
    font-weight: bold;
    line-height: 30px;
    color: #fff;
    background: url('../img/black_gradient.jpg') center repeat;
    border-bottom: 1px solid #1A1A1A;
    display: block;
    border-radius: 3px 3px 0 0;
}

.modalContent {
    width: 100%;
    border-top: 1px solid #3a3a3a;
    display: block;
}

#helpModal .modalContent {
    overflow: scroll;
    padding: 5px;
    width: 690px;
    height: 560px;
}

#patchModal .modalClose {
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 5px;
    top: 5px;
    text-align: center;
    line-height: 18px;
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
}

#patchModal .modalClose img {
    height: 10px;
    width: 10px;
}


#patchModal .modalContent {
    padding: 5px;
    width: 100%;
    box-sizing: border-box;
    height: 95%;
    position: relative;
    display: flex;
    flex-direction: column;
}


#addNewGroup {
    width: 100%;
    margin: 0 auto;
    padding: 10px 0 20px 0;
    height: 30px;
    text-align: center;
    color: var(--white);
    bottom: 0;
}

#addNewGroupButton {
    width: 198px;
    height: 30px;
    display: block;
    margin: 0 auto;
    background: #242424;
    text-decoration: none;
    line-height: 30px;
    border: 1px solid #242424;
    border-radius: 3px;
    color: #fff;
    font-size: 11px;
    transition: all .5s;
    cursor: pointer;
}

#addNewGroupButton:hover {
    border: 1px solid #fff !important;
}

#notificationBar {
    display: block;
    width: 360px;
    height: 35px;
    position: absolute;
    top: 40px;
    z-index: 999999;
    position: absolute;
    right: 0px;
}

.notificationMessage {
    background-color: rgb(204, 51, 34);
    color: #333333;
    font-size: 15px;
    width: 360px;
    min-height: 22px;
    line-height: 22px;
    padding: 7px 10px 7px 10px;
    margin-bottom: 4px;
    display: block;
    float: right;
    clear: both;
}

.animateFade-enter {
    opacity: 0;
    transition: 600ms linear;
}

.animateFade-enter.animateFade-enter-active {
    opacity: 1;
}

.animateFade-exit {
    opacity: 1;
}

.animateFade-exit.animateFade-exit-active {
    opacity: 0;
    transition: 1400ms ease-out;
}

.animateFade-exit-done {
    opacity: 0;
}

#errormsg {
    top: 70px;
    background-color: #C32;
    z-index: 9999;
    width: 100%;
    height: 35px;
    line-height: 35px;
    text-align: center;
    position: absolute;
}

.leaflet-control-fuselayer {
    background: #2C2C2C url('../img/layers_white.svg') center no-repeat;
    background-size: 13px 13px;
    border-radius: 4px;
    border: 1px solid #111;
    box-shadow: inset 0 1px 0 #3C3C3C;
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
    position: absolute;
    z-index: 1;
}

.leaflet-control-fuselayer ul {
    display: none;
}

.leaflet-control-fuselayer:hover {
    background: #2C2C2C;
    width: auto;
    height: auto;
}

.leaflet-control-fuselayer:hover ul {
    display: block;
}

.leaflet-control-fuselayer ul .mapStyleMenuHeader {
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    border-bottom: 1px solid #343434;
    cursor: default !important;
}

.leaflet-control-fuselayer ul .mapStyleMenuHeader:hover {
    color: #fff;
}

.leaflet-control-fuselayer ul li {
    font-size: 9px;
    color: #bbb;
    text-align: center;
    padding: 0 10px;
    cursor: pointer;
}

.leaflet-control-fuselayer ul li:hover {
    color: #fff;
}

.leaflet-control-fuselayer ul li.activeStyle {
    background: url('../img/active.svg') 4px center no-repeat;
    background-size: 4px 4px;
}

#mapStyleWarningWrap {
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    background: url('../img/transparent.png') repeat;
}

#mapStyleWarningHeader {
    text-align: center;
    height: 40px;
    line-height: 40px;
    color: orange;
    font-weight: bold;
    border-bottom: 1px solid #333;
}

#mapStyleWarning {
    position: absolute;
    height: 130px;
    width: 500px;
    top: 50%;
    margin-top: -65px;
    left: 50%;
    margin-left: -250px;
    text-align: center;
    background: #2E2E2E;
    z-index: 99999999;
    border-radius: 3px;
    color: #FFF;
}

#mapStyleWarningText {
    border-top: 1px solid #3A3A3A;
    padding: 20px 10px;
    font-size: 10px;
}

.mapStyleButton {
    border: 1px solid #1D1D1D;
    color: #aaa;
    padding: 5px 0;
    width: 55px;
    text-align: center;
    position: absolute;
    border-radius: 3px;
    cursor: pointer;
    transition: .25s;
}

.mapStyleButton:hover {
    color: #fff;
    border-color: #fff;
}

#mapStyleYes {
    right: 180px;
}

#mapStyleNo {
    left: 180px;
}

#fixedListItemsWrapper #shipChitNames {
    margin-left: 6.5px;
}

#fixedListItemsWrapper #shipChitNames .shipGroupLabelsChit ul {
    height: 20px;
    color: #f3f3f3;
    margin-left: 3px;
    display: inline-block;
}


#fixedListItemsWrapper #shipChitNames ul {
    height: 20px;
    color: #A8A8A8;
    margin-left: 8px;
    line-height: 20px;
    display: block;
    cursor: default;
}

#fixedListItemsWrapper #shipChitNames ul li {
    font-family: "Lucida Console", Monaco, monospace !important;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    float: left;
    width: 15px;
    margin-right: 5px;
    text-align: center;
    font-size: 8px;
}

#shipChitNames {
    width: 100%;
}

#shipChitNames .shipGroupLabelsChit ul {
    height: 20px;
    color: #f3f3f3;
    margin-left: 0;
    display: inline-block;
}


#shipChitNames ul {
    height: 27px;
    color: #f3f3f3;
    display: inline-block;
}

#shipChitNames ul.shipGroupLabelsChit li {
    cursor: pointer;
}

#shipChitNames ul li {
    font-family: "Lucida Console", Monaco, monospace !important;
    display: inline-block;
    height: 27px;
    line-height: 27px;
    margin-right: 3px;
    margin-left: 3px;
    font-size: 8px;
}

.droppableHighlight {
    border: 1px dashed #00FD51;
}

.droppableHover {
    border: 1px dashed #00FD51;
}

.dropppableContains {
    border: 1px dashed #C32;
}


#errorMessage {
    width: 100%;
    margin: 0 auto;
    height: 50px;
    background: #f73b3b;
    color: #fff;
    text-align: center;
    line-height: 50px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9999;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.53);

}

#errorMessageClose {
    height: 30px;
    width: 30px;
    text-align: center;
    border-radius: 3px;
    display: inline-block;
    border: 1px solid #a71a1a;
    line-height: 30px;
    top: 10px;
    cursor: pointer;
    position: absolute;
    right: 50px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
    transition: background .3s;
    z-index: 9999;
}

#errorMessageClose:hover {
    background: #fd1919;
    transition: all .3s;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.1);
}

#errorMessageClose:active {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5);
    transition: none;
}

.shipGroup.ui-draggable-dragging .shipGroupHeader {
    cursor: url(../img/closedhand.cur), default;
}

.ui-resizable-s {
    cursor: s-resize;
    height: 5px;
    width: 10%;
    bottom: 0;
    left: 50%;
    margin-left: -5%;
    background: #696969;
}

.ui-resizable-e {
    cursor: s-resize;
    height: 10%;
    width: 1px;
    right: 0;
    top: 50%;
    margin-top: -5%;
    border-right: 3px solid #FFA300;
    box-shadow: inset 1px 1px 0 #FFE000;
}

.ui-resizable-handle {
    position: absolute;
    font-size: 0.1px;
    display: block;
}

#groupAlert {
    position: absolute;
    top: 50%;
    left: 10%;
    margin-top: -15px;
    line-height: 30px;
    height: 30px;
    width: 80%;
    text-align: center;
    border-radius: 3px;
    font-size: 11px;
    z-index: 999999;
}

.alertOverlay {
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 99999;
    background: url('../img/transparent_black_50.png') repeat;
}

#groupAlert.alertGreen {
    background: var(--green);
    color: #192D3B;
}

#groupAlert.alertRed {
    background: #FF6C59;
    color: #192D3B;
}

#sitRepAlert {
    position: absolute;
    top: 50%;
    margin-top: -15px;
    line-height: 30px;
    height: 30px;
    left: 10%;
    width: 80%;
    text-align: center;
    border-radius: 3px;
    font-size: 11px;
    z-index: 999999;
    display: block;
}

#sitRepAlert.alertGreen {
    background: #53ef7c;
    color: #192D3B;
}

#sitRepAlert.alertRed {
    background: #FF6C59;
    color: #192D3B;
}

.sitRepSavePopup {
    font-size: 12px !important;
    position: absolute;
    font-size: 14px;
    top: 25%;
    margin-top: -15px;
    line-height: 30px;
    height: 215px;
    left: 10%;
    width: 80%;
    text-align: center;
    border-radius: 3px;
    z-index: 999999;
    display: block;
    background: #3C3C3C;
}

.sitRepSavePopup input {
    resize: none;
    margin-right: 10px;
    height: 14px;
    min-height: 15px;
    width: 30%;
    min-width: 30%;
    max-width: 30%;
    border-radius: 3px;
    background: rgb(36, 36, 36);
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
    border: 1px solid #181818;
    color: #dadada;
    transition: border .25s;
    text-transform: uppercase;
    position: relative;
    /*top:6px;*/
}

.sitRepSavePopup input::-webkit-input-placeholder {
    color: #434343;
}

.sitRepSavePopup input:-moz-placeholder {
    /* Firefox 18- */
    color: #434343;
}

.sitRepSavePopup input::-moz-placeholder {
    /* Firefox 19+ */
    color: #434343;
}

.sitRepSavePopup input:-ms-input-placeholder {
    color: #434343;
}

.sitRepSavePopup input:focus {
    border: 1px solid #FFA300;
}

.sitRepSavePopup input:hover {
    border: 1px solid #FFA300;
}

.sitRepSavePopup .msg {
    color: #FFA300;
    margin-top: 10px;
    margin-bottom: 10px;
}

.sitRepSavePopup .info {
    color: #FFA300;
    text-align: left;
    border: 1px solid #252525;
    margin: 0px auto;
    padding-left: 15px;
    padding-right: 15px;
    width: 90%;
    box-sizing: border-box;
    background: #3C3C3C;
    box-shadow: inset 0 1px 0px #4B4B4B;
    -webkit-box-shadow: inset 0 1px 0px #4B4B4B;
    -moz-box-shadow: inset 0 1px 0px #4B4B4B;
    -o-box-shadow: inset 0 1px 0px #4B4B4B;
}

.sitRepSavePopup .info .value {
    color: white;
    font-size: 12px;
}

.sitRepSaveButtons {
    width: 100%;
    margin-top: 20px;
}

.sitRepSaveButton {
    padding-right: 40px;
    padding-left: 40px;
    height: 30px;
    display: inline-block;
    /*margin-top: 30px;*/
    margin-left: 10px;
    margin-right: 10px;
    background: #242424;
    text-decoration: none;
    line-height: 30px;
    border: 1px solid #242424;
    border-radius: 3px;
    color: #FFA300;
    font-size: 11px;
    transition: all .5s;
    cursor: pointer;
}

.sitRepSaveButton.cancel:hover {
    background: #e23434;
    color: #333;
    border-color: black;
}

.sitRepSaveButton.confirm:hover {
    background: var(--green);
    color: #333;
    border-color: black;
}


.shipGroupItems .shipname {
    height: 37px;
    width: 100px;
    line-height: 37px;
    border-right: 1px solid #303030;
}

#fixedListItems .shipname,
.dragging.shipname {
    padding-left: 130px;
    color: var(--white);
}

#fixedListItems .shipname.old {
    color: #969696;
    text-decoration: line-through;
}

.groupname {
    font-size: 12px;
    margin-left: 10px;
    text-overflow: ellipsis;
    width: 240px;
    overflow: hidden;
    white-space: nowrap;
    color: #bbb;
}

.shipGroupItems .chit {
    cursor: pointer;
}

.shipGroupItems .chit0 {
    margin-left: 5px !important;
}

.shipGroupItems .chit5 {
    margin-right: 5px !important;
}

.currentIssue {
    margin-right: 3px !important;
}

.topIssue {
    height: 35px;
    border-right: 1px solid #363636;
    border-left: 1px solid #363636;
    line-height: 35px;
    text-align: center;
    font-size: 10px;
    cursor: default;
    margin-right: 0px !important;
}

.topIssue0 {
    margin-left: 10px;
}

.topIssuesDiv {
    height: 400px;
}

.italic {
    font-style: italic;
}

div.topIssuesDiv li.bold {
    font-weight: bold;
    color: #DADADA;
}

.greyed {
    color: #777 !important;
}

.shipGroupItems li.topIssue_0_0 {
    color: #777;
}

#currentLatLng {
    position: absolute;
    bottom: 25px;
    width: 210px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    left: 50%;
    margin-left: -90px;
    z-index: 999;
    font-size: 11px;
    background: url('../img/transparent_black_50.png') repeat;
    border-radius: 2px;
    color: var(--white);
    border: 1px solid #000000;
}

#mapCenterIndicator {
    width: 14px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -7px;
    margin-top: -7px;
    background: url('../img/icons_lat-long-crosshairs.svg') center no-repeat;
    background-size: 14px 14px;
    z-index: 10;
}

.popUp {
    /* height: 75px; */
    line-height: 35px;
    font-size: 16px;
    color: #fff;
    float: left;
    width: 206px !important;
}

.radarPopUp {
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    float: left;
    width: 206px !important;
}

.radarPopUpClose {
    position: absolute;
    top: 5px;
    right: 6px;
    height: 12px;
    width: 11px;
    background: url('../img/close_icon_white.png') center center no-repeat;
    cursor: pointer;
}

.popUpConfigurationTool {
    position: absolute;
    top: 6px;
    right: 24px;
    height: 11px;
    width: 11px;
    background: url('../img/popup_compare_icon.png') center center no-repeat;
    cursor: pointer;
}

.popUpConfigurationTool:hover {
    background: url('../img/popup_compare_dark_icon.png') center center no-repeat;
}

.popupChit {
    float: left;
    margin-left: 5px;
}

.popupChit li {
    margin-left: 5px;
}

.gm-style-iw {
    height: 75px !important;
    width: 206px !important;
    margin-left: -10px;
    overflow: hidden !important;
    top: 22px !important;
}

.gm-style-iw>div {
    height: 100% !important;
    width: 206px !important;
    overflow: hidden !important;
}

.infoWindowWrapWrap {
    height: 60px !important;
    width: 206px !important;
    margin-left: 12px;
    margin-top: 20px !important;
}

.infoWindowWrap {
    height: 60px !important;
    width: 206px !important;
    top: 10px !important;
}

.infoWindowBackground {
    background: #2e2e2e !important;
    border-radius: 4px !important;
    width: 206px !important;
    height: 75px !important;
    top: 10px !important;
}

.infoWindowBackgroundTrans {
    width: 206px !important;
    height: 78px !important;
    top: 10px !important;
}

#popUpStatusWrap {
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 0;
    text-align: right;
    border-top: 1px solid #707070;
}

.popUpButton {
    display: inline-block;
    padding: 0 8px;
    height: 28px;
    line-height: 28px;
    font-size: 14px;
    min-width: 25px;
    background: #313131;
    color: #bbbbbb;
    border: 1px solid white;
    border-radius: 5px;
    transition: all .5s;
    margin: 10px 3.5px;
    text-align: center;
    cursor: pointer;
}

#popUpIU {
    font-size: 10px;
    width: 40px;
    display: inline-block;
    text-align: center;
    height: 100%;
    float: left;
    margin-left: 5px;
}

#popUpIU.old {
    text-decoration: line-through;
    color: #969696;
}

#popUpTrigraph {
    font-size: 10px;
    width: 40px;
    display: inline-block;
    text-align: center;
    height: 100%;
    float: left;
}

#popUpTrigraph.old {
    text-decoration: line-through;
    color: #969696;
}

#popUpChicklet {
    width: 120px;
    overflow: hidden;
    display: inline-block;
    text-align: center;
    position: absolute;
    margin-top: -7px;
    right: 16px;
}

#popUpChicklet div.chits {
    height: 25px;
}

.popUpChickletLabels {
    width: 140px !important;
    position: absolute;
    height: 20px;
    line-height: 20px;
    top: 27px !important;
    left: 73px;
    color: #797979 !important;
}

.popUpChickletLabels li {
    font-family: "Lucida Console", Monaco, monospace !important;
    display: inline-block;
    height: 20px;
    line-height: 16px;
    float: left;
    width: 15px;
    margin-right: 5px;
    text-align: center;
    font-size: 7px;
}

.infoWindowCaretWrap {
    top: 75px !important;
    border-top-color: #2e2e2e !important;
    left: 103px !important;
}

.infoWindowCaretTrans {
    left: 103px !important;
    top: 83px !important;
}

.infoWindowCaret {
    background: #2e2e2e !important;
}

.popupClose {
    top: 25px !important;
    right: 6px !important;
    background: #2e2e2e url('../img/closePopup.png') center no-repeat;
}

.noIssue {
    display: none !important;
}

.popUpName {
    font-size: 12px !important;
    font-weight: bold !important;
    width: 80%;
    display: block;
    height: 25px;
    line-height: 25px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: var(--white);
}

.popUpName.old {
    text-decoration: line-through;
    color: #969696;

}

.popUpTime.old {
    color: #FF0000;
}


.activeLabel {
    color: var(--white) !important;
    font-weight: bold !important;
}

.issuesLabelWrap {
    display: inline-block;
    height: 27px !important;
    line-height: 25px;
}

#shipChitNames .issuesLabelWrap li {
    display: inline-block;
    height: 27px !important;
    margin-right: 0px !important;
    line-height: 27px;
    font-weight: normal !important;
    font-size: 9px !important;
    font-family: Arial, sans-serif !important;
}

#shipChitNames .issuesLabelWrap .issueLabel6 {
    margin-right: 0 !important;
    width: 82px !important;
}


input[type="time"]::-ms-clear {
    display: none !important;
}

input[type="search"]::-webkit-search-cancel-button {
    display: none !important;
}

.shipname {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 120px;
    color: #fff;
}

.shipname.old {
    text-decoration: line-through;
    color: #A8A8A8;
}

.markerLabel {
    font-family: "Lucida Console", Monaco, monospace !important;
    color: #FFA300;
}

#mapCenterIndicatorWrap {
    display: none;
}

#mapCenterIndicatorV {
    width: 1px;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -1px;
    background: #bbb;
    top: 0;
}

#mapCenterIndicatorH {
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    background: #bbb;
}

.minimized .shipGroupCompare,
.minimized .shipGroupSitRepSelect,
.minimized .shipGroupSave,
.minimized .shipGroupDelete,
.minimized .shipGroupSitRep,
.minimized .shipGroupOwnerName,
.minimized .scroll-pane,
.minimized .shipGroupLabels {
    display: none;
}

.minimized {
    float: left;
    position: absolute;
    width: 250px !important;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.minimized .shipGroupName {
    line-height: 30px;
    font-weight: bold;
    width: 140px;
    display: block;
    font-size: 13px;
    overflow: hidden;
    text-align: left;
    color: #fff;
    text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.minimized .shipGroupHeader {
    padding: 0 0 0 15px;
    height: 30px;
    background: url('../img/black_gradient.jpg') repeat;
    border-bottom: 1px solid #000;
    box-shadow: 0 1px 0 #424242;
    -webkit-box-shadow: 0 1px 0 #424242;
    -moz-box-shadow: 0 1px 0 #424242;
    -o-box-shadow: 0 1px 0 #424242;
    cursor: pointer;
}

.topIssueTime {
    height: 24px;
    line-height: 24px;
    width: 68px;
    display: block;
}

.topIssueTimeSource {
    height: 11px;
    line-height: 0px;
    width: 68px;
    display: block;
}

/* SHIP COMPARE STYLING */
#shipCompareModalWrap {
    width: 100%;
    height: 100%;
    background: url('../img/transparent_black_50.png');
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    display: none;
}

.shipCompareChickletLabels {
    position: absolute;
    top: 34px;
    right: 40px;
    color: #DADADA;
    font-size: 8px;
    line-height: 1em;
    font-family: "Lucida Console", Monaco, monospace !important;
}

.shipCompareChickletLabels .chit.above {
    margin-left: 6px;
    padding-top: 1.5em;
    width: 15px;
    transform: translateX(-50%);
    text-align: center;
}

.show {
    display: block !important;
}

#shipCompareHeader {
    width: 100%;
    margin: 0 auto;
    height: 55px;
    line-height: 55px;
    display: block;
    background: rgba(25, 25, 25, 1);
    text-align: left;
    font-size: 12px;
    color: #CACACA;
    font-weight: 100;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    position: absolute;
    transition: background .5s;
    z-index: 9999;
}

#shipCompareShipWrap {
    display: block;
    padding-left: 10px;
    padding-right: 5px;
    height: 80%;
    overflow-y: hidden;
    overflow-x: auto;
    position: absolute;
    top: 118px;
    z-index: 1;
    white-space: nowrap;
    padding-bottom: 10px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(155, 155, 155, 0.5);
    border-radius: 20px;
    border: transparent;
}

.shipCompareShip {
    width: 418px;
    margin-right: 15px;
    display: inline-block;
    position: relative;
    height: 100%;
    background: #313131;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    position: relative;
    border-radius: 0 0 5px 5px;
}

#shipCompareHeaderText {
    font-size: 12px;
    text-transform: uppercase;
    display: inline-block;
    font-weight: bold;
}

.shipCompareShipHeader {
    background: rgb(25, 25, 25);
    position: relative;
    height: 65px;
    color: #FFF;
    font-size: 0;
    cursor: auto;
    vertical-align: middle;
}

.thisShipIU {
    width: 225px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    position: absolute;
    top: 24px;
    font-size: 17px;
    line-height: 20px;
    color: #fff;
}

.thisShipIU.old {
    text-decoration: line-through;
    color: #969696;
}

.short {
    max-width: 144px;
}

.chit.above::before,
.chit.before::before,
.chit.center::before {
    content: "";
    width: 14px;
    height: 14px;
    display: block;
    border-radius: 20%;
}

.chit.plusOn::after {
    content: "+";
    color: var(--green);
    background-color: transparent;
    font-size: 26px;
    font-weight: 525;
    line-height: 30px;
}

.chit.plusOff::after {
    content: "+";
    color: var(--grey);
    background-color: transparent;
    font-size: 26px;
    font-weight: 525;
    line-height: 30px;
}

.chit.A::before {
    content: "A";
    color: var(--green);
    background-color: transparent;
    font-size: 18px;
    line-height: 13px;
    margin-right: 5px;
    font-weight: 525;
}

.chit.B::before {
    content: "B";
    color: var(--green);
    background-color: transparent;
    font-size: 18px;
    line-height: 13px;
    margin-right: 5px;
    font-weight: 525;
}

.chit.center::before {
    transform: translateX(50%);
}

.chit.before::before {
    display: inline-block;
    vertical-align: text-bottom;
}

.chit.marginRight::before {
    margin-right: 15px;
}

.chit.below::after,
.chit.after::after {
    content: "";
    width: 14px;
    height: 14px;
    display: block;
    border-radius: 20%;
}

.chit.circle::before,
.chit.circle::after {
    border-radius: 50%;
}

.chit.after::after {
    display: inline-block;
    vertical-align: text-bottom;
}

.chit.above,
.chit.below {
    position: relative;
    display: inline-block;
}

.chit.above {
    padding-top: 1em;
}

.chit.above::before {
    position: absolute;
    right: 50%;
    top: -1em;
    transform: translateX(50%);
}

.chit.below {
    padding-bottom: 1em;
}

.chit.below::after {
    position: absolute;
    left: 50%;
    bottom: 0px;
    transform: translateX(-50%);
}

.chit.color0::before,
.chit.color0::after {
    background: var(--grey);
}

.chit.color1::before,
.chit.color1::after {
    background: var(--green);
}

.chit.color2::before,
.chit.color2::after {
    background: var(--red);
}

.chit.color3::before,
.chit.color3::after {
    background: var(--yellow);
}

.chit.color4::before,
.chit.color4::after {
    background: var(--orange);
}

.chit.color5::before,
.chit.color5::after {
    background: var(--blue);
}

.grey {
    stroke: var(--grey);
}

.grey::before,
.grey::after {
    background: var(--grey);
    color: var(--grey);
    stroke: var(--grey);
}

.green {
    stroke: var(--green);
}

.green::before,
.green::after {
    background: var(--green);
    color: var(--green);
    stroke: var(--green);
}

.red {
    stroke: var(--red);
}

.red::before,
.red::after {
    background: var(--red);
    color: var(--red);
    stroke: var(--red);
}

.yellow {
    stroke: var(--yellow);
}

.yellow::before,
.yellow::after {
    background: var(--yellow);
    color: var(--yellow);
    stroke: var(--yellow);
}

.orange {
    stroke: var(--orange);
}

.orange::before,
.orange::after {
    background: var(--orange);
    color: var(--orange);
    stroke: var(--orange);
}

.blue {
    stroke: var(--blue);
}

.blue::before,
.blue::after {
    background: var(--blue);
    color: var(--blue);
    stroke: var(--blue);
}

.white {
    stroke: #fff;
}

.white::before,
.white::after {
    background: #fff;
    color: #fff;
    stroke: #fff;
}

.greyText {
    color: var(--grey);
}

.greenText {
    color: var(--green);
}

.redText {
    color: var(--red);
}

.yellowText {
    color: var(--yellow);
}

.orangeText {
    color: var(--orange);
}

.blueText {
    color: var(--blue);
}

.whiteText {
    color: #fff;
}

.alignCenter {
    text-align: center !important;
}

.shipCompareShipContent {
    overflow-x: hidden;
    overflow-y: auto;
    white-space: normal;
    box-sizing: border-box;
    padding: 10px 15px 3px 10px;
    text-align: justify;
    font-size: 14px;
    width: 100%;
    padding: 10px;
}

.shipCompareShipContent h1 {
    color: var(--white);
    font-size: 16px;
    padding: 10px 0;
}

.topIssueContainter {
    overflow-y: auto;
    display: inline-block;
}

.accordion {
    margin-bottom: 3px;
    display: block;
    overflow: hidden;
    font-size: 12px;
}

.accordion h1 {
    position: relative;
    width: 100%;
    color: #bbbbbb;
    background: #191919;
    padding: 0 10px;
    height: 40px;
    line-height: 40px;
    display: block;
    font-weight: bold;
    font-size: 16px;
    cursor: pointer;
}

.accordion.expanded h1 {
    color: #fff;
}

.accordion h1::after {
    content: "";
    border: 7px solid transparent;
    border-top: 7px solid #bbbbbb;
    position: absolute;
    right: 30px;
    top: calc(50% - 3.5px);
}

.accordion.expanded h1::after {
    border-top-color: transparent;
    border-bottom-color: white;
    top: calc(50% - 10px);
}

.accordion .arrowDown::after {
    content: "";
    border: 7px solid transparent;
    border-top: 7px solid #bbbbbb;
    position: absolute;
    right: 30px;
    top: calc(50% - 3.5px);
}

.accordion .arrowUp::after {
    content: "";
    border: 7px solid transparent;
    border-top: 7px solid #bbbbbb;
    position: absolute;
    right: 30px;
    border-top-color: transparent;
    border-bottom-color: white;
    top: calc(50% - 10px);
}


.accordion .section {
    border-top: 1px solid #707070;
    background: #252525;
    height: 100%;
}

.accordion .section h2 {
    color: #fff;
    background: #202020;
    width: 100%;
    font-size: 14px;
    margin: 0;
    padding: 10px 10px 5px;
}

.accordion h2 {
    position: relative;
    color: white;
    font-size: 16px;
    font-weight: 100 !important;
    padding: 16px 0 5px 10px;
    background: #252525;
}

.accordion .subHeader {
    position: relative;
    color: #bbb;
    font-size: 10px;
    font-weight: 100 !important;
    padding: 16px 0 5px 10px;
    background: #252525;
}

.accordion .rows li .greenText {
    color: var(--green)
}

.accordion .rows li .yellowText {
    color: var(--yellow);
}

.accordion .greenText {
    color: var(--green)
}

.accordion .yellowText {
    color: var(--yellow);
}

/* .accordion h2::after {
    content: "";
    position: absolute;
    right: 25px;
    bottom: 7px;
    width: 16px;
    height: 16px;
    background: url(../img/icon_info.svg);
    border-radius: 8px;
} */

.accordion h2.noHelp::after {
    content: none;
    display: none;
}

.accordion .halfTable {
    width: 50%;
    display: inline-table;
}

.accordion .displayInline {
    display: inline;
}

.accordion .tableBorderRight {
    border-right: 1px solid #707070;
}

.accordion .tableBorderBottom {
    border-bottom: 1px solid #707070;
}

.subTabs {
    display: flex;
    width: 100%;
}

.nnConfigBoxes {
    width: 10%;
    line-height: 12px;
}

.nnConfigBoxes .chit.before::before {
    margin-right: 3px;
}

.subTabs li {
    white-space: nowrap;
    font-size: 12px;
    color: #bbb;
    border: 1px solid #707070;
    border-radius: 5px;
    /* height: 20px; */
    /* min-width: 40px; */
    margin: 3px;
    padding: 5px;
    cursor: pointer;
}

.subTabs li:hover {
    color: #fff;
}

.subTabs li.active {
    color: #fff;
    border: 1px solid #fff;
}

.accordion .rows li {
    background: #252525;
    display: flex;
    padding: 0 10px;
    padding: 9px 10px;
    cursor: default;
}

li.thickRows {
    height: 60px !important;
}

.thickRows .labelAbove span {
    display: inline-block;
}

.accordion .rows:not(.noEven) li:nth-child(even) {
    background: #202020;
}

.accordion .rows li:hover,
.accordion .rows:not(.noEven) li:nth-child(even):hover {
    background: #4D4D4D;
}

.accordion .rows li span {
    width: calc(50% - 10px);
    color: #bbb;
    white-space: nowrap;
}

.accordion .rows li span+span {
    color: #fff;
    line-height: 1em;
}

.accordion .flexRow {
    display: flex;
    padding: 0 10px;
    justify-content: space-between;
    background: #252525;
    color: #fff;
    display: flex;
    height: 30px;
    line-height: 30px;
    cursor: default;
}

.accordion .shipCompareNavDropdown {
    margin-top: 5px;
    margin-right: auto;
    margin-left: 10px;
    height: 20px;
    width: 240px;
    border: 1px solid #909090;
    background: #252525;
}

.accordion .section .data {
    display: block;
    color: #fff;
    padding: 10px;
    font-family: monospace;
    background: #252525;
}

.accordion .section .gyroInUse li .gyroInUseValue {
    padding-left: 120px;
}

.accordion .boxes .box {
    display: block;
    outline: 1px solid #444;
    background: #202020;
    width: calc(33.33% - 22px);
    margin: 5px;
    padding: 6px;
    color: #bbb;
    font-size: 12px;
}

.accordion .boxes .flexItem {
    display: block;
    outline: 1px solid #444;
    background: #202020;
    margin: 5px;
    padding: 6px;
    color: #bbb;
    font-size: 12px;
    flex: 1
}

.noBuffer {
    padding: unset !important;
    margin: unset !important;
}

.accordion .boxes {
    display: flex;
    flex-wrap: wrap;
    margin: 0 10px 10px;
    justify-content: left;
}

.accordion .onOff {
    position: relative;
    display: inline-block;
    margin-left: 2px;
}

.accordion .onOff::before,
.accordion .onOff::after {
    content: "";
    position: relative;
    display: block;
    border-radius: 50%;
    background: rgba(125, 125, 125, .5);
    width: 5px;
    height: 5px;
}

.accordion .onOff.off::after {
    background: var(--red);
}

.accordion .onOff.on::before {
    background: var(--green);
}

/* cross-selecting tables */
.accordion table {
    overflow: hidden;
    width: 100%;
}

.accordion table.fixed {
    table-layout: fixed
}

.accordion table.grid td,
.accordion table.grid th {
    border: 1px solid #202020;
}

.accordion table td.dark,
.accordion table th.dark {
    background: #191919;
}

.accordion table th {
    color: #bbb;
}

.accordion table.small th,
.accordion table.small td {
    font-size: 11px;
    padding: 0 1px;
}

.accordion .greyText tr {
    color: #555;
}

.accordion .whiteText {
    color: #fff !important;
}

.accordion tr {
    /*background: #202020;*/
    color: #fff;
    height: 30px;
    line-height: 12px;
    font-size: 12px;
    /*border-left: 10px solid transparent;  workaround for lack of padding in table elements */
    /*border-right: 10px solid transparent;  workaround for lack of padding in table elements */
    cursor: default;
    background: #202020;
}

.accordion table tr:nth-child(odd) {
    background: #252525;
}

.accordion table thead tr:nth-child(1) {
    background: #202020;
}

.accordion td,
.accordion th {
    position: relative;
    text-align: center;
    vertical-align: middle;
    padding: 0 10px;
}

.accordion td.rightAlign,
.accordion th.rightAlign {
    position: relative;
    text-align: right;
    vertical-align: middle;
}

.accordion td.centerAlign,
.accordion th.centerAlign {
    position: relative;
    text-align: center;
    vertical-align: middle;
}

.accordion td.leftAlign,
.accordion th.leftAlign {
    position: relative;
    text-align: left;
    vertical-align: middle;
}

.accordion tbody.leftAlign tr td {
    position: relative;
    text-align: left;
    vertical-align: middle;
}

.accordion tbody.rightAlign tr td {
    position: relative;
    text-align: right;
    vertical-align: middle;
}

.accordion tbody tr:hover {
    background-color: #4d4d4d;
}

.accordion td.hover:not(.noHover),
.accordion th.hover:not(.noHover) {
    background-color: #4d4d4d;
    /*outline: 1px solid black;*/
}

.accordion tbody .bottomBorder {
    border-bottom: 1.5px solid white;
}

.accordion tbody .topBorder {
    border-top: 1.5px solid white;
}

.accordion svg {
    margin: 10px;
}

.accordion g .font {
    font-size: 18px;
    fill: #000;
    text-anchor: middle;
    alignment-baseline: central;
}

.accordion g .font.wire {
    font-size: 15px;
    fill: #bbb;
}

.accordion g .line {
    stroke-width: 10;
    fill: none;
}

.accordion g .box {
    fill: #bbb;
}

.accordion .leftHeader {
    position: relative;
    text-align: left;
    vertical-align: middle;
    color: #bbb;
}

.accordion .expandedRow {
    padding-left: 0;
    padding-right: 0;
    text-align: left;
}

.shipCompareShip .shipCompareShipContentSection {
    height: 40px;
    width: 356px;
    padding: 0 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 40px;
    color: #fff;
    background: #333 url('../img/caret.png') 350px center no-repeat;
    cursor: pointer;
    margin-bottom: 10px;
    display: block;
}

.shipCompareShip .shipCompareShipContentSection ul.shipCompareShipContentSectionUL {
    display: block;
}

.shipCompareShip .shipCompareShipContentSection.expanded {
    background: #333 url('../img/caret2.png') 350px 17px no-repeat;
}

.shipCompareShipContentSectionUL {
    font-size: 12px;
    color: #9C9C9C;
    overflow: hidden;
}

.shipCompareShipContentSectionLI {
    display: inline-block;
    width: 356px;
    height: 30px;
    line-height: 30px;
    float: left;
    padding: 0 10px;
    cursor: default;
}

.shipCompareShipContentSectionLI.shorter {
    width: 345px;
    background: #393939 !important;
}

li.STJ_Performance_tableContentRow,
li.unit_tableContentRow,
li.tableContentRow,
li.link16_unit_tableContentRow {
    user-select: text !important;
    -webkit-user-select: text !important;
    /* Chrome all / Safari all */
    -moz-user-select: text !important;
    /* Firefox all */
    -ms-user-select: text !important;
    /* IE 10+ */
}

ul.filter_tableContent li {
    user-select: text !important;
    -webkit-user-select: text !important;
    /* Chrome all / Safari all */
    -moz-user-select: text !important;
    /* Firefox all */
    -ms-user-select: text !important;
    /* IE 10+ */
}

ul.shipCompareShipContentSectionUL li.shipCompareShipContentSectionLI span {
    user-select: text !important;
    -webkit-user-select: text !important;
    /* Chrome all / Safari all */
    -moz-user-select: text !important;
    /* Firefox all */
    -ms-user-select: text !important;
    /* IE 10+ */
}

.shipCompareShipContentSectionLI:hover {
    background: #4D4D4D !important;
}

.shipCompareShip .shipCompareShipContentSubSection {
    height: 40px;
    width: 336px;
    padding: 0 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 40px;
    color: #fff;
    border: 1px solid #1D1D1D;
    box-shadow: inset 0 1px 0 #424242;
    background: #393939 url('../img/caret.png') 330px center no-repeat;
    cursor: pointer;
    margin: 10px;
    border-radius: 3px;
    display: block;
}

.shipCompareShip .shipCompareShipContentSubSection.expanded {
    background: #393939 url('../img/caret2.png') 330px 17px no-repeat;
    width: 356px !important;
}

.unitGroup {
    display: inline-block;
    width: 376px;
    float: center;
    cursor: default;
    background: #252525 !important;
    padding-top: 5px;
    border: none !important;
}

.unitGroupIU {
    width: 376px;
    height: 30px;
    line-height: 30px;
    background: #393939;
    margin-bottom: 1px;
    border-top: 1px solid #494949;
    border-bottom: 1px solid #494949;
    font-size: 14px;
}

.unitGroupIUTitle {
    padding-left: 10px;
    display: inline-block;
}

.unitGroupIUData {
    text-align: left;
    display: inline-block;
    font-weight: bold;
    color: #fff;
}

.unitGroupContent3Wrap {
    width: 100%;
    display: block;
    height: 40px;
    text-align: left;
    background: #333;
}

.unitGroupContent3 {
    height: 40px;
    width: 124px;
    display: inline-block;
    text-align: center;
    float: left;
    border-right: 1px solid #202020;
    border-left: 1px solid #373737;
}

.unitGroupContent3.unitGroupContentStart {
    border-left: none !important;
}

.unitGroupContent3.unitGroupContentEnd {
    border-right: none !important;
}


.unitGroupContent3Title {
    display: block;
    width: 100%;
    height: 20px;
    line-height: 25px;
}

.unitGroupContent3Data {
    display: block;
    width: 100%;
    height: 20px;
    line-height: 20px;
    font-size: 13px;
    color: #FFF;
    font-weight: bold;
}

.cSLI2 {

    width: 168px !important;
}

.cSLI2 .shipCompareLITitle {
    float: left;
    width: 50%;
}

.cSLI2 .shipCompareLIData {
    float: left;
    display: inline-block;
    text-transform: uppercase;
}

.shipCompareLITitle {
    font-size: 11px;
    color: #A0A0A0;
    display: inline-block;
    width: 46%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 30px;
    line-height: 30px;
    vertical-align: top;
}

.shipCompareLIData {
    color: #fff;
    height: 30px;
    line-height: 30px;
    vertical-align: top;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    width: 53%;
    display: inline-block;
}

#shipCompareHeader.hidden {
    background: rgba(25, 25, 25, .5);
}

#shipCompareHeader.hidden .shipCompareNavButton {
    opacity: 0;
    visibility: hidden;
}

.shipCompareNavButton,
.shipCompareNavDropdown {
    display: inline-block;
    padding: 0 10px;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    min-width: 25px;
    background: #313131;
    color: #bbbbbb;
    border: 1px solid transparent;
    border-radius: 5px;
    transition: all .5s;
    margin: 10px 3.5px;
    text-align: center;
    cursor: pointer;
}

.shipCompareNavDropdown {
    width: 220px;
    height: 34px;
}

@media (max-width: 1445px) {
    .shipCompareNavDropdown {
        width: 180px;
    }

    .shipCompareNavButton,
    .shipCompareNavDropdown {
        padding: 0 5px;
        min-width: 25px;
        margin: 10px 2px;
    }
}

@media (max-width: 1365px) {

    .shipCompareNavButton,
    .shipCompareNavDropdown {
        margin: 10px 1px;
        padding: 0 2px;
    }
}

@media (max-width: 1225px) {
    .shipCompareNavDropdown {
        width: 100px;
    }

    .shipCompareNavButton,
    .shipCompareNavDropdown {
        margin: 10px 1px;
        padding: 0 2px;
    }
}

@media (max-width: 1060px) {
    .left~.left {
        margin-left: 1px !important;
    }
}

@media (max-width: 950px) {
    #shipCompareGroupSelect {
        display: none;
    }
}

@media (max-width: 850px) {
    #shipCompareShipSelect {
        display: none;
    }
}

@media (max-width: 650px) {
    #time {
        display: none;
    }
}



.right~.right {
    margin-right: 7.5px;
}

.right {
    float: right;
    margin-right: 20px;
}

#shipCompareHeader .left~.left {
    margin-left: 3.5px;
}

#shipCompareHeader .left {
    float: left;
    margin-left: 10px;
}

.shipCompareNavButton:hover,
.shipCompareNavDropdown select:hover {
    color: #fff;
    background: #353535;
}


.even {
    background: #2E2E2E !important;
    border-top: 1px solid #272727 !important;
}

.odd {
    border-top: 1px solid #3D3D3D !important;
}

.shipCompareSectionTitle {
    font-weight: bold;
    font-size: 16px;
    display: block;
}

.expanded .shipCompareSectionTitle {
    padding: 0 10px;
    height: 40px;
    line-height: 40px;
    display: block;
    font-weight: bold;
    font-size: 16px;
}

.shipCompareShipContentSubSection.expanded .shipCompareSectionTitle {
    padding: 0 20px;
}

/*.expanded {
    overflow: inherit;
    height: auto!important;
    border: none;
    width: 376px!important;
    padding: 0!important;
}
*/
.shipCompareShip.ui-sortable-helper .shipCompareShipHeaderTitle {
    cursor: url(../img/closedhand.cur), default;
}

.shipCompareShipHeaderTitle {
    width: 360px;
    display: inline-block;
    font-size: 20px;
    line-height: 40px;
    padding: 10px 20px 5px 20px;
    cursor: url(../img/openhand.cur), default;
}

.shipCompareShipHeaderTabWrap {
    width: 400px !important;
    display: block;
    height: 68px;
    padding: 8px 0;
    background: #1D1D1D;
    border-top: 1px solid #010101;
}

.shipCompareShipHeaderTabWrap ul {
    width: 392px;
    margin-left: 4px;
    height: 32px;
    line-height: 32px;
}

.shipCompareShipHeaderTabWrap li {
    float: left !important;
    display: inline-block !important;
    font-size: 10px;
    border: 1px solid #4e4e4e;
    height: 30px;
    text-align: center;
    border-radius: 3px;
    width: 60px;
    margin-left: 4px;
    transition: all .25s ease-in;
    font-size: 10px;
    font-weight: bold;
}

.shipCompareShipHeaderTabWrap li:hover {
    border: 1px solid #6D6D6D;
}

.shipCompareShipHeaderTabWrap li.lower {
    margin-top: 4px;
}

.shipCompareStatusTab,
.shipCompareLinkMTJTab {
    margin-left: 0 !important;
}

#shipCompareShipWrap .shipCompareStatusTabSplit1 {
    display: block;
    height: 20px;
    line-height: 20px;
}

#shipCompareShipWrap .shipCompareStatusTabSplit2 {
    height: 10px;
    line-height: 0 !important;
    display: block;
}

.section7 {
    margin-bottom: 20px;
}

.shipCompareShipExpired {
    color: #bbb;
    position: absolute;
    top: -1px;
    left: 0;
    height: 20px;
    line-height: 20px;
    width: 345px;
    padding: 2px 20px;
    font-size: 10px;
    display: block;
}

.shipCompareShipClose {
    display: block;
    position: absolute;
    top: 21px;
    right: 5px;
    color: white;
    font-size: 30px;
    line-height: 15px;
    background-color: #444;
    border-radius: 12px;
    height: 24px;
    width: 24px;
    line-height: 24px;
    text-align: center;
}

.visibleTab {
    color: #fff;
    border-color: #fff;
}

.shipCompareLIHead {
    width: 100%;
    font-weight: bold;
    font-size: 16px;
    color: orange;
}

.shipCompareLISubHead {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 14px;
    font-weight: 100 !important;
}

.shipCompareNNSelectTitle {
    width: 374px;
    border: 1px solid #4e4e4e;
    border-bottom: 0;
    height: 20px;
    line-height: 20px;
    vertical-align: bottom;
    text-align: center;
}

.shipCompareNNSelect {
    width: 47px;
    height: 20px;
    border: 1px solid #4e4e4e;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: inline-block;
    line-height: 20px;
    padding-left: 19px;
    position: relative;
    float: left;
}

.clearBoth {
    clear: both;
}

.shipCompareNNSelect.selected {
    border-color: orange !important;
}

.leafletShipMarker {
    display: block;
    width: 65px !important;
    height: 24px !important;
    margin: 0 2px 0 auto;
    background: url('../img/ship_marker_grey.png') left center no-repeat;
    color: #969696;
    font-size: 11px;
    font-family: Arial, sans-serif;
    padding-left: 25px;
    line-height: 24px;
    text-decoration: line-through;
    opacity: .75;
}

.leafletShipMarker.recentMarker {
    background: url('../img/ship_marker_white.png') left center no-repeat;
    text-decoration: none;
    color: var(--white);
    opacity: 1;
}

/*SCROLL.CSS*/

.jspContainer {
    overflow: hidden;
    position: relative;
}

.jspPane {
    position: absolute;
}

.jspVerticalBar {
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
}

.jspHorizontalBar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 16px;
}

.jspHorizontalBar .jspCap {
    float: left;
}

.jspTrack {
    position: relative;
    background-color: #424242;
}

.jspDrag {
    background: #696969;
    position: relative;
    top: 0;
    left: 0;
    cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag {
    float: left;
    height: 100%;
}

.jspArrow {
    background: #50506d;
    text-indent: -20000px;
    display: block;
    cursor: pointer;
    margin: 0;
    padding: 0;
}

.jspArrow.jspDisabled {
    cursor: default;
    background: #80808d;
}

.jspVerticalBar .jspArrow {
    height: 16px;
}

.jspHorizontalBar .jspArrow {
    width: 10px;
    float: left;
    height: 100%;
}

.scroll-pane {
    width: 100%;
    overflow: hidden;
}

.jspVerticalBar .jspArrow:focus {
    outline: none;
}

.jspCorner {
    background: #eeeef4;
    float: left;
    height: 100%;
}

* html .jspCorner {
    margin: 0 -3px 0 0;
}

.shipGroup .jspContainer {
    min-height: 264px;
}

.shipGroup .jspPane {
    width: 910px !important;
}

/* This makes the sorting stuff not weird */
.ui-sortable-placeholder {
    display: inline-block;
    height: 1px;
}


/*LEAFLET.CSS*/


.leaflet-map-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-pane,
.leaflet-tile-container,
.leaflet-overlay-pane,
.leaflet-shadow-pane,
.leaflet-marker-pane,
.leaflet-popup-pane,
.leaflet-overlay-pane svg,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
    position: absolute;
    left: 0;
    top: 0;
}

.leaflet-container {
    overflow: hidden;
    -ms-touch-action: none;
    cursor: 0;
    background: #ddd;
    outline: 0;
}

.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}

.leaflet-container img {
    max-width: none !important;
}

.leaflet-container img.leaflet-image-layer {
    max-width: 15000px !important;
}

.leaflet-tile {
    filter: inherit;
    visibility: hidden;
}

.leaflet-tile-loaded {
    visibility: inherit;
}

.leaflet-zoom-box {
    width: 0;
    height: 0;
    border: 2px dotted #38f;
    background: rgba(255, 255, 255, 0.5);
}

.leaflet-overlay-pane svg {
    -moz-user-select: none;
}

.leaflet-tile-pane {
    z-index: 2;
}

.leaflet-objects-pane {
    z-index: 3;
}

.leaflet-overlay-pane {
    z-index: 4;
}

.leaflet-shadow-pane {
    z-index: 5;
}

.leaflet-marker-pane {
    z-index: 6;
}

.leaflet-popup-pane {
    z-index: 7;
}

.leaflet-vml-shape {
    width: 1px;
    height: 1px;
}

.lvml {
    behavior: url(#default#VML);
    display: inline-block;
    position: absolute;
}

.leaflet-control {
    position: relative;
    z-index: 7;
    pointer-events: auto;
}

.leaflet-top,
.leaflet-bottom {
    position: absolute;
    z-index: 1000;
    pointer-events: none;
}

.leaflet-top {
    top: 50px;
}

.leaflet-right {
    right: 0;
}

.leaflet-bottom {
    bottom: 0;
}

.leaflet-left {
    left: 0;
}

.leaflet-right .leaflet-control {
    float: right;
    margin-right: 10px;
}

.leaflet-top .leaflet-control {
    margin-top: 10px;
}

.leaflet-bottom .leaflet-control {
    margin-bottom: 10px;
}

.leaflet-left .leaflet-control {
    margin-left: 10px;
}

.leaflet-fade-anim .leaflet-tile,
.leaflet-fade-anim .leaflet-popup {
    opacity: 0;
    -webkit-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    transition: opacity .2s linear;
}

.leaflet-fade-anim .leaflet-tile-loaded,
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
    opacity: 1;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    -webkit-transition: 0 .25s cubic-bezier(0, 0, 0.25, 1);
    -moz-transition: 0 .25s cubic-bezier(0, 0, 0.25, 1);
    -o-transition: 0 .25s cubic-bezier(0, 0, 0.25, 1);
    transition: transform .25s cubic-bezier(0, 0, 0.25, 1);
}

.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile,
.leaflet-touching .leaflet-zoom-animated {
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
}

.leaflet-zoom-anim .leaflet-zoom-hide {
    visibility: hidden;
}

.leaflet-clickable {
    cursor: pointer;
}

.leaflet-popup-pane,
.leaflet-control {
    cursor: auto;
}

.leaflet-dragging .leaflet-container,
.leaflet-dragging .leaflet-clickable {
    cursor: 0;
}

.leaflet-container a {
    color: #0078A8;
}

.leaflet-container a.leaflet-active {
    outline: 2px solid orange;
}

.leaflet-bar {
    background-color: #242424;
    border: 1px solid #111;
    box-shadow: inset 0 1px 0 #3A3A3A;
    border-radius: 4px;
}

.leaflet-bar a {
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
}

.leaflet-bar a,
.leaflet-bar a:hover {
    background-color: #2C2C2C;
    border-bottom: 1px solid #1B1B1B;
    box-shadow: inset 0 1px 0 #3C3C3C;
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
    color: #B1B1B1;
}

.leaflet-control-zoom {
    width: 26px;
}

.leaflet-bar a,
.leaflet-control-fuselayer-toggle {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: block;
}

.leaflet-bar a:hover {
    background-color: #3A3A3A;
    color: #FFF !important;
}

.leaflet-bar a:active {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.62);
    background: #252525;
    color: #666 !important;
}

.leaflet-bar a:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.leaflet-bar a:last-child {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom: none;
}

.leaflet-bar a.leaflet-disabled {
    cursor: default;
    color: #bbb;
}

.leaflet-touch .leaflet-bar a {
    width: 30px;
    height: 30px;
    line-height: 30px;
}

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
    font: bold 18px 'Lucida Console', Monaco, monospace;
    text-indent: 1px;
}

.leaflet-control-zoom-out {
    font-size: 20px;
}

.leaflet-touch .leaflet-control-zoom-in {
    font-size: 22px;
}

.leaflet-touch .leaflet-control-zoom-out {
    font-size: 24px;
}

.leaflet-control-fuselayer-toggle {
    background-image: url(../img/layers.png);
    border-radius: 4px;
    border: 1px solid #111;
    background-color: #2C2C2C;
    box-shadow: inset 0 1px 0 #3C3C3C;
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
}

.leaflet-retina .leaflet-control-fuselayer-toggle {
    background-image: url(../img/layers-2x.png);
    background-size: 26px 26px;
}

.leaflet-touch .leaflet-control-fuselayer-toggle {
    width: 44px;
    height: 44px;
}

.leaflet-control-fuselayer-expanded .leaflet-control-fuselayer-list {
    display: block;
    position: relative;
}

.leaflet-control-fuselayer-expanded {
    color: #FFF;
}

.leaflet-control-fuselayer-expanded .leaflet-control-fuselayer-overlays,
.leaflet-control-fuselayer-separator,
.leaflet-control-fuselayer-expanded .leaflet-control-fuselayer-toggle {
    display: none !important;
}

.leaflet-control-fuselayer-expanded .jspCap,
.leaflet-control-fuselayer-expanded.leaflet-control-fuselayer .leaflet-control-fuselayer-list {
    display: block !important;
}

.leaflet-control-fuselayer-selector {
    display: none;
}

.leaflet-control-fuselayer-separator {
    height: 0;
    border-top: 1px solid #ddd;
    margin: 5px -10px 5px -6px;
}

.leaflet-container .leaflet-control-attribution {
    background: rgba(255, 255, 255, 0.7);
    margin: 0;
}

.leaflet-control-attribution,
.leaflet-control-scale-line {
    color: #333;
    padding: 0 5px;
}

.leaflet-control-attribution a {
    text-decoration: none;
}

.leaflet-control-attribution a:hover {
    text-decoration: underline;
}

.leaflet-container .leaflet-control-attribution,
.leaflet-container .leaflet-control-scale {
    font-size: 11px;
}

.leaflet-left .leaflet-control-scale {
    margin-left: 5px;
}

.leaflet-bottom .leaflet-control-scale {
    margin-bottom: 5px;
}

.leaflet-control-scale-line {
    border-top: none;
    line-height: 1.1;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    padding: 2px 5px 1px;
    background: url('../img/transparent_black_50.png') repeat;
    color: #FFF;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

.leaflet-control-scale-line:not(:first-child) {
    border-top: 1px solid #fff;
    border-bottom: none;
    border-bottom: none;
    margin-top: -1px;
}

.leaflet-control-scale-line:not(:first-child):not(:last-child) {
    border-bottom: 1px solid orange;
}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-fuselayer,
.leaflet-touch .leaflet-bar {
    box-shadow: none;
}

.leaflet-touch .leaflet-control-fuselayer,
.leaflet-touch .leaflet-bar {
    border: 2px solid rgba(0, 0, 0, 0.2);
    background-clip: padding-box;
}

.leaflet-popup {
    position: absolute;
    text-align: center;
}

.leaflet-popup-content-wrapper {
    text-align: left;
    border-radius: 3px;
    padding: 1px;
}

.leaflet-popup-content {
    line-height: 1.4;
    height: 169px;
    margin: 5px 10px;
}

.leaflet-popup-content p {
    margin: 18px 0;
}

.leaflet-popup-tip-container {
    width: 40px;
    height: 20px;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
}

.leaflet-popup-tip {
    width: 17px;
    height: 17px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    margin: -10px auto 0;
    padding: 1px;
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
    background: #242424;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
}

.leaflet-container a.leaflet-popup-close-button {
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    width: 18px;
    height: 14px;
    font: 16px/14px Tahoma, Verdana, sans-serif;
    color: #c3c3c3;
    text-decoration: none;
    font-weight: 700;
    background: transparent;
    padding: 4px 4px 0 0;
}

.leaflet-container a.leaflet-popup-close-button:hover {
    color: #999;
}

.leaflet-popup-scrolled {
    overflow: auto;
    /* border-bottom:1px solid #ddd;
  border-top:1px solid #ddd; */
}

.leaflet-oldie .leaflet-popup-content-wrapper {
    zoom: 1;
}

.leaflet-oldie .leaflet-popup-tip {
    width: 24px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
    margin: 0 auto;
}

.leaflet-oldie .leaflet-popup-tip-container {
    margin-top: -1px;
}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-fuselayer,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
    border: 1px solid #111;
}

.leaflet-div-icon {
    background: rgb(255, 255, 255);
    border: 1px solid orange;
    border-radius: 8px;
}

.jspCap,
.leaflet-control-fuselayer .leaflet-control-fuselayer-list,
.leaflet-control-fuselayer-expanded .leaflet-control-fuselayer-toggle {
    display: none;
}

.leaflet-control-fuselayer label {
    display: block;
    padding: 10px 20px;
    font-size: 11px;
    border: 1px solid #000;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.12);
    border-radius: 3px;
    background: #2C2C2C;
}

.leaflet-control-fuselayer label:nth-child(1) {
    border-radius: 3px 3px 0 0;
}

.leaflet-control-fuselayer label:nth-child(2) {
    border-radius: 0 0 3px 3px;
}

.leaflet-control-fuselayer label:hover {
    color: orange;
    border: 1px solid orange;
}

/* STYLE EQUIPMENT STATUS */

#shipCompareShipWrap #shipStatusBox {
    width: 356px;
    margin: 10px auto;
    font-size: 0;
    display: block;
    position: relative;
    height: 56px;
}

#shipCompareShipWrap #shipStatusBoxSingle {
    width: 356px;
    margin: 10px auto;
    font-size: 0;
    display: block;
    position: relative;
    height: 27px;
}

#shipCompareShipWrap #shipStatus9Box {
    width: 356px;
    height: 143px;
    height: 46px;
    margin: 0 auto 10px auto;
    font-size: 0;
    display: block;
}

#shipCompareShipWrap #shipStatus10Box {
    width: 356px;
    height: 30px;
    margin: 0 auto 10px auto;
    font-size: 0;
    display: block;
}

#shipCompareShipWrap #shipStatusBTRStatus {
    width: 356px;
    height: 135px;
    margin: 0 auto 10px auto;
    font-size: 0;
    display: block;
}

#shipCompareShipWrap #shipStatus3Box {
    width: 356px;
    margin: 0 auto 10px auto;
    font-size: 0;
    display: block;
}

#shipStatus3Box .ForwardingStatusDataPU {
    border: 1px solid #1e1e1e;
    background: #333;
    height: 25px;
    text-align: center;
    font-size: 11px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    color: #dadada;
    padding-left: 7px;
    display: block;
    text-align: left;
    position: relative;
    line-height: 25px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    margin: 0 auto;
}

#shipCompareShipWrap .shipStatusBoxItem {
    border: 1px solid #1e1e1e;
    display: inline-block;
    background: #333;
    height: 25px;
    margin-right: 1px;
    margin-bottom: 1px;
    font-size: 11px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    color: #dadada;
    width: 108px;
    padding-left: 7px;
    text-align: left;
    position: relative;
    line-height: 25px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    float: left;
}

#shipCompareShipWrap .shipStatusBoxItem .cpuValue {
    font-weight: bold;
    color: #fff;
}

#shipCompareShipWrap .shipStatusBoxItem.bottomBox {
    margin-bottom: 0px !important;
}

#shipStatus9Box .shipStatusBoxIndicator {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 8px;
    right: 8px;
    background: var(--red);
    border-radius: 3px;
}

#shipStatus9Box .BTRStatusBoxIndicator {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 8px;
    right: 8px;
    background: #5B5B5B;
    border-radius: 3px;
}

#shipStatus9Box .BTRStatusBoxItem {
    border: 1px solid #1e1e1e;
    background: #333;
    height: 25px;
    text-align: center;
    font-size: 11px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    color: #dadada;
    padding-left: 7px;
    display: block;
    text-align: left;
    position: relative;
    line-height: 25px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    margin: 0 auto;
    cursor: pointer;
}

#shipStatus10Box .BTRStatusBoxItem {
    border: 1px solid #1e1e1e;
    background: #333;
    height: 25px;
    text-align: center;
    font-size: 11px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    color: #dadada;
    padding-left: 7px;
    display: block;
    text-align: left;
    position: relative;
    line-height: 25px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    margin: 0 auto;
    cursor: pointer;
}

#shipStatus9Box .BTRStatusBoxItemLast {
    margin-bottom: 10px !important;
}

#shipStatusBTRStatus .shipStatusBoxIndicator {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 8px;
    right: 8px;
    background: var(--red);
    border-radius: 3px;
}

#shipStatusBTRStatus .BTRStatusBoxIndicator {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 8px;
    right: 8px;
    background: #5B5B5B;
    border-radius: 3px;
}

#shipStatusBTRStatus .BTRStatusBoxItem {
    border: 1px solid #1e1e1e;
    background: #333;
    height: 25px;
    text-align: center;
    font-size: 11px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    color: #dadada;
    padding-left: 7px;
    display: block;
    text-align: left;
    position: relative;
    line-height: 25px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    margin: 0 auto;
    cursor: pointer;
}

#shipStatusBTRStatus .BTRStatusBoxItemLast {
    margin-bottom: 10px !important;
}

.BTRStatusTitle {
    width: 346px;
    padding-left: 10px;
    margin: 0 auto 10px auto;
    font-size: 14px;
    display: block;
    position: relative;
    height: 30px;
    line-height: 30px;
    color: #FFF;
}

.configTitle {
    width: 356px;
    margin: 0 auto 10px auto;
    font-size: 14px;
    display: block;
    position: relative;
    height: 30px;
    line-height: 30px;
    color: #FFF;
}

.BTRStatusMessage {
    position: absolute;
    top: -85px;
    margin: 0 auto;
    background: #1E1E1E;
    border-radius: 2px;
    border: 1px solid #fff;
    text-align: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
    color: #FFF;
    font-size: 12px;
    padding: 6px 10px;
    width: 344px;
    display: block;
    z-index: 999999;
    left: -7px;
}

.BTRPatchTitle {
    width: 346px;
    padding-left: 10px;
    margin: 0 auto 10px auto;
    font-size: 14px;
    display: block;
    position: relative;
    height: 30px;
    line-height: 30px;
    color: #FFF;
}

.equipmentStatusWrap {
    width: 356px;
    height: 531px;
    display: block;
    font-family: arial;
    font-size: 11px;
    position: relative;
    border-radius: 3px;
    left: 50%;
    margin-left: -178px;
}

.equipmentStatusWrap .eSBox {
    border: 1px solid #111;
    background: #424242;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjNDI0MjQyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzMxMzEzMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(-45deg, #424242 0%, #313131 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #424242), color-stop(100%, #313131));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(-45deg, #424242 0%, #313131 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(-45deg, #424242 0%, #313131 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(-45deg, #424242 0%, #313131 100%);
    /* IE10+ */
    background: linear-gradient(135deg, #424242 0%, #313131 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#424242', endColorstr='#313131', GradientType=1);
    /* IE6-8 fallback on horizontal gradient */
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.2);
    color: #fff;
    border-radius: 3px;
    transition: all .35s;
    -webkit-transition: all .35s;
    cursor: default;
    text-align: center;
    position: absolute;
}

#eSRadio1 {
    width: 48px;
    height: 40px;
    line-height: 40px;
    left: 0;
    top: 297px;
}

#eSRadio2 {
    width: 48px;
    height: 40px;
    line-height: 40px;
    left: 0;
    top: 349px;
}

#eSRadio3 {
    width: 48px;
    height: 40px;
    line-height: 40px;
    left: 0;
    top: 402px;
}

#eSRadio4 {
    width: 48px;
    height: 40px;
    line-height: 40px;
    left: 0;
    top: 454px;
}

#eSjtids {
    width: 48px;
    height: 30px;
    line-height: 30px;
    left: 70px;
    top: 0px;
}

#eSKG40 {
    width: 48px;
    height: 30px;
    line-height: 30px;
    left: 70px;
    top: 100px;
}

#eSCTDS {
    width: 48px;
    height: 275px;
    line-height: 275px;
    left: 70px;
    bottom: 0px;
}

#eSKG84 {
    width: 40px;
    height: 60px;
    line-height: 60px;
    left: 140px;
    top: 210px;
}

#eSISNS {
    width: 40px;
    height: 60px;
    line-height: 60px;
    left: 140px;
    top: 340px;
}

#eSABSwitch {
    width: 65px;
    height: 50px;
    line-height: 50px;
    left: 163px;
    top: 130px;
}

#eSMLIU {
    width: 40px;
    height: 190px;
    line-height: 190px;
    left: 210px;
    top: 210px;
}

#eSTOD {
    width: 40px;
    height: 60px;
    line-height: 60px;
    left: 210px;
    top: 420px;
}

#eSC2PRehost {
    width: 50px;
    height: 180px;
    left: 270px;
    top: 0;
}

#eSC2PRehostFirstSpan {
    display: block;
    height: 95px;
    line-height: 180px;
}

#eSCDLMS {
    width: 50px;
    height: 270px;
    left: 270px;
    bottom: 0;
}

#eSCDLMS span,
#eSCDS span,
#eSNGP span,
#eSORTS span,
#eSOPER span,
#eSBTR span {
    position: absolute;
    display: block;
    top: 50%;
    margin-top: -25px;
    left: 50%;
    margin-left: -4px;
    line-height: 10px;
}

#eSCDS {
    width: 20px;
    height: 85px;
    right: 0;
    top: 0;
}

#eSNGP {
    width: 20px;
    height: 85px;
    right: 0;
    top: 95px;
}

#eSORTS {
    width: 20px;
    height: 85px;
    right: 0;
    top: 260px;
}

#eSOPER {
    width: 20px;
    height: 85px;
    right: 0;
    top: 360px;
}

#eSBTR {
    width: 20px;
    height: 70px;
    right: 0;
    top: 459px;
}

#eSHMILabel {
    font-size: 12px;
    text-align: center;
    position: absolute;
    color: #FFF;
    right: 82px;
    top: 192px;
}

#eSTacticalLabel {
    font-size: 12px;
    text-align: center;
    position: absolute;
    color: #FFF;
    right: -2px;
    top: 192px;
}

/* COLOR BARS */
.equipmentStatusWrap .eSBar {
    transition: all .25s;
    position: absolute;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5), inset 0px 1px 0px rgba(255, 255, 255, 0.22);
}

.cmp_CDLMS_Equipment_Status_Link4ARadio_to_Link4ADTS {
    width: 30px;
    height: 10px;
    left: 45px;
    top: 60px;
}

.cmp_CDLMS_Equipment_Status_CSDTS_to_Radio1 {
    width: 30px;
    height: 10px;
    left: 45px;
    top: 314px;
}

.cmp_CDLMS_Equipment_Status_CSDTS_to_Radio2 {
    width: 30px;
    height: 10px;
    left: 45px;
    top: 366px;
}

.cmp_CDLMS_Equipment_Status_CSDTS_to_Radio3 {
    width: 30px;
    height: 10px;
    left: 45px;
    top: 418px;
}

.cmp_CDLMS_Equipment_Status_CSDTS_to_Radio4 {
    width: 30px;
    height: 10px;
    left: 45px;
    top: 470px;
}

.cmp_CDLMS_Equipment_Status_JTIDS_to_C2PRehost {
    width: 150px;
    height: 10px;
    left: 120px;
    top: 10px;
}

.cmp_CDLMS_Equipment_Status_Link4ADTS_to_C2PRehost {
    width: 150px;
    height: 10px;
    left: 120px;
    top: 60px;
}

.cmp_CDLMS_Equipment_Status_KG40_to_C2PRehost {
    width: 150px;
    height: 10px;
    left: 120px;
    top: 110px;
}

.cmp_CDLMS_Equipment_Status_KG40_to_CSDTS {
    width: 10px;
    height: 130px;
    left: 90px;
    top: 130px;
}

.cmp_CDLMS_Equipment_Status_TOD_to_CSDTS {
    width: 120px;
    height: 10px;
    left: 120px;
    top: 445px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_CSDTS {
    width: 150px;
    height: 10px;
    left: 120px;
    top: 500px;
}

.cmp_CDLMS_Equipment_Status_ABSwitch_to_KG84 {
    width: 10px;
    height: 35px;
    left: 168px;
    top: 178px;
}

.cmp_CDLMS_Equipment_Status_ABSwitch_to_MLIU {
    width: 10px;
    height: 35px;
    left: 215px;
    top: 178px;
}

.cmp_CDLMS_Equipment_Status_KG84_to_MLIU {
    width: 50px;
    height: 10px;
    left: 170px;
    top: 235px;
}

.cmp_CDLMS_Equipment_Status_MLIU_to_ISNS {
    width: 50px;
    height: 10px;
    left: 170px;
    top: 365px;
}

.cmp_CDLMS_Equipment_Status_MLIU_to_TOD {
    width: 10px;
    height: 35px;
    left: 227px;
    top: 395px;
}

.cmp_CDLMS_Equipment_Status_MLIU_to_CDLMS {
    width: 30px;
    height: 10px;
    left: 250px;
    top: 302px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_TOD {
    width: 30px;
    height: 10px;
    left: 250px;
    top: 445px;
}

.cmp_CDLMS_Equipment_Status_ABSwitch_to_C2PRehost {
    width: 60px;
    height: 10px;
    left: 230px;
    top: 152px;
}

.cmp_CDLMS_Equipment_Status_CDS_to_C2PRehost {
    width: 30px;
    height: 10px;
    left: 310px;
    top: 42px;
}

.cmp_CDLMS_Equipment_Status_NGP_to_C2PRehost {
    width: 30px;
    height: 10px;
    left: 310px;
    top: 132px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_C2PRehost_HMI {
    width: 10px;
    height: 100px;
    left: 280px;
    top: 172px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_C2PRehost_Tactical {
    width: 10px;
    height: 100px;
    left: 300px;
    top: 172px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_ORTS {
    width: 30px;
    height: 10px;
    left: 310px;
    top: 302px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_OPER_ADS {
    width: 30px;
    height: 10px;
    left: 310px;
    top: 400px;
}

.cmp_CDLMS_Equipment_Status_CDLMS_to_BTR {
    width: 30px;
    height: 10px;
    left: 310px;
    top: 490px;
}

/* TABLE STYLING */
.tableWrapper {
    width: 376px;
    height: auto;
    display: block;
}

ul.tableHeader {
    height: 30px;
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

ul.tableHeader li.tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 73px;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    text-align: center;
}

ul.tableHeader .tableHeaderTitleTop {
    display: block;
    height: 10px;
    line-height: 18px;
}

ul.tableHeader .tableHeaderTitleBottom {
    display: block;
    height: 20px;
    line-height: 20px;
}

ul.tableHeader li.tableHeaderTitle.tableHeaderTitleStart {
    border-left: 1px none !important;
}

ul.tableHeader li.tableHeaderTitle.tableHeaderTitleEnd {
    border-right: 1px none !important;
}

ul.tableContent {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    position: relative;
    height: 315px;
}

ul.tableContent li.tableContentRow {
    height: 20px;
    line-height: 20px;
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 74px;
    border-right: 1px solid #191919;
    text-align: center;
    border-bottom: 1px solid #202020;
    float: left;
}

ul.tableContent li.tableContentRow.tableContentRowEnd {
    border-right: none !important;
    width: 75px !important;
}

ul.tableContent li.tableContentRow.tableContentRowBottom {
    border-bottom: none !important;
}

ul.tableContent li.tableContentRow.tableContentRowOdd {
    background: #2C2C2C;
}

ul.tableContent li.tableContentRow.tableContentRowEven {}

ul.tableContent li.tableContentRow.tableContentRowFirst {
    border-right: 1px solid #191919 !important;
    background: #232323;
    border-top: 1px solid #373737;
    height: 19px !important;
}

ul.tableContent_STGC {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    position: relative;
    height: 22px;
}

ul.tableContent_STGC li.tableContentRow {
    height: 20px;
    line-height: 20px;
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 74px;
    border-right: 1px solid #191919 !important;
    text-align: center;
    border-bottom: 1px solid #202020;
    float: left;
}

ul.tableContent_STGC li.tableContentRow.tableContentRowEnd {
    border-right: none !important;
    width: 75px !important;
}

ul.tableContent_STGC li.tableContentRow.tableContentRowBottom {
    border-bottom: none !important;
}

ul.tableContent_STGC li.tableContentRow.tableContentRowOdd {
    background: #2C2C2C;
}

ul.tableContent_STGC li.tableContentRowFirst {
    border-right: 1px solid #191919 !important;
    background: #232323;
    border-top: 1px solid #373737;
    height: 19px !important;
}

.highlight {
    background: var(--grey) !important;
    color: #fff !important;
}

ul.unit_tableContent {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    position: relative;
    height: 105px;
}

ul.unit_tableHeader {
    height: 30px;
    font-size: 0px;
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

ul.unit_tableHeader li.unit_tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 100%;
    text-align: center;
    line-height: 30px;
}

ul.unit_tableContent li.unit_tableContentRow {
    height: 20px;
    line-height: 20px;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 123.33px;
    border-right: 1px solid #454545;
    text-align: center;
    border-bottom: 1px solid #202020;
    float: left;
}

ul.unit_tableContent li.unit_tableContentRow.unit_tableContentRowEnd {
    border-right: none !important;
}

ul.unit_tableContent li.unit_tableContentRow.unit_tableContentRowBottom {
    border-bottom: none !important;
}

ul.link16_unit_tableContent {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    position: relative;
    height: 105px;
}

.link16_unit_tableHeader_2 {
    height: 30px;
    width: 187px;
    border-right: 1px solid #232323;
    font-size: 0px;
    font-weight: bold;
    display: inline-block;
    padding: 0;
    font-size: 11px;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    vertical-align: top;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

.link16_unit_tableHeader_4 {
    height: 30px;
    width: 93px;
    border-right: 1px solid #232323;
    font-size: 0px;
    padding: 0;
    display: inline-block;
    vertical-align: top;
    font-size: 11px;
    background: #5C5C5C;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5C5C5C), color-stop(100%, #333));
    background: -webkit-linear-gradient(top, #5C5C5C 0%, #333 100%);
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    background: linear-gradient(to bottom, #5C5C5C 0%, #333 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

.link16_unit_tableHeader {
    height: 30px;
}


ul.link16_unit_tableHeader li.link16_unit_tableHeaderTitle {
    font-size: 0px;
    display: inline-block;
    color: #fff;
    width: 100%;
    text-align: center;
    line-height: 30px;
    vertical-align: top;
}

ul.link16_unit_tableContent li.link16_unit_tableContentRow {
    height: 20px;
    line-height: 20px;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 93px;
    border-right: 1px solid #232323;
    border-bottom: 1px solid #202020;
    float: left;
    text-align: center;
}

.link16_unit_tableHeader_2RowEnd {
    border-right: none !important;
    width: 188px;
}

.link16_unit_tableHeader_4RowEnd {
    border-right: none !important;
    width: 94px;
}

ul.link16_unit_tableContent li.link16_unit_tableContentRow.link16_unit_tableContentRowEnd {
    border-right: none !important;
    width: 94px;
}

ul.link16_unit_tableContent li.link16_unit_tableContentRow.link16_unit_tableContentRowBottom {
    border-bottom: none !important;
}

table.L22,
table.L22_NU {
    width: 100%;
    text-align: center;
}

table.L22 tr {
    height: 20px;
}

table.L22_NU tr {
    cursor: default;
}

table.L22 tr td {
    vertical-align: middle;
}

table.L22 tr.header {
    height: 30px;
    font-weight: bold;
    background: #5c5c5c;
    /* Old browsers */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
    font-size: 10px;
    color: #fff;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    line-height: 30px;
    cursor: default;
}

table.L22 tr.headerLong1 {
    height: 30px;
    font-weight: bold;
    background: #5c5c5c;
    /* Old browsers */
    background: url(data:image/svg+xml;base64,Cjw/eG1sIHZlcnNpb249MS4wID8+CjxzdmcgeG1sbnM9aHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcgd2lkdGg9MTAwJSBoZWlnaHQ9MTAwJSB2aWV3Qm94PTAgMCAxIDEgcHJlc2VydmVBc3BlY3RSYXRpbz1ub25lPgogIDxsaW5lYXJHcmFkaWVudCBpZD1ncmFkLXVjZ2ctZ2VuZXJhdGVkIGdyYWRpZW50VW5pdHM9dXNlclNwYWNlT25Vc2UgeDE9MCUgeTE9MCUgeDI9MCUgeTI9MTAwJT4KICAgIDxzdG9wIG9mZnNldD0wJSBzdG9wLWNvbG9yPSM1YzVjNWMgc3RvcC1vcGFjaXR5PTEvPgogICAgPHN0b3Agb2Zmc2V0PTEwMCUgc3RvcC1jb2xvcj0jNDg0ODQ4IHN0b3Atb3BhY2l0eT0xLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9MCB5PTAgd2lkdGg9MSBoZWlnaHQ9MSBmaWxsPXVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkgLz4KPC9zdmc+Cgo=);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #484848 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #484848));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #484848 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #484848 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #484848 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #484848 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#484848', GradientType=0);
    /* IE6-8 */
    z-index: 2;
    font-size: 10px;
    color: #fff;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    line-height: 30px;
    cursor: default;
}

table.L22 tr.headerLong1 .doubleRow {
    background: #5c5c5c;
    /* Old browsers */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

table.L22 tr.headerLong2 {
    height: 30px;
    font-weight: bold;
    background: #5c5c5c;
    /* Old browsers */
    background: url(data:image/svg+xml;base64,Cjw/eG1sIHZlcnNpb249MS4wID8+CjxzdmcgeG1sbnM9aHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcgd2lkdGg9MTAwJSBoZWlnaHQ9MTAwJSB2aWV3Qm94PTAgMCAxIDEgcHJlc2VydmVBc3BlY3RSYXRpbz1ub25lPgogIDxsaW5lYXJHcmFkaWVudCBpZD1ncmFkLXVjZ2ctZ2VuZXJhdGVkIGdyYWRpZW50VW5pdHM9dXNlclNwYWNlT25Vc2UgeDE9MCUgeTE9MCUgeDI9MCUgeTI9MTAwJT4KICAgIDxzdG9wIG9mZnNldD0wJSBzdG9wLWNvbG9yPSM0ODQ4NDggc3RvcC1vcGFjaXR5PTEvPgogICAgPHN0b3Agb2Zmc2V0PTEwMCUgc3RvcC1jb2xvcj0jMzMzMzMzIHN0b3Atb3BhY2l0eT0xLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9MCB5PTAgd2lkdGg9MSBoZWlnaHQ9MSBmaWxsPXVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkgLz4KPC9zdmc+Cg==);
    background: -moz-linear-gradient(top, #484848 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #484848), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #484848 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #484848 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #484848 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #484848 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#484848', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
    font-size: 10px;
    color: #fff;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    line-height: 30px;
    cursor: default;
}

table.L22.L22_SN_Rotate tr {
    height: 60px;
}

table.L22.L22_SN_Rotate tr {
    height: 60px;
}

table.L22 tr td.NU_Status {
    width: 34px;
}

table.L22 .rotate {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    position: relative;
}

table.L22 .rotate div {
    width: 60px;
    transform: rotate(-90deg);
    transform-origin: left top;
    text-align: center;
    position: absolute;
    top: 100%;
    left: 0;
    height: 30px;
    line-height: 30px;
}

table.L22 .statusGreen {
    color: #333;
    background-color: green;
}

table.L22 .statusYellow {
    color: #333;
    background-color: yellow;
}

table.L22 .statusOrange {
    color: #333;
    background-color: orange;
}

table.L22 .statusRed {
    color: #333;
    background-color: red;
}

table.L22 tr.expanded td {
    border-bottom: 1px orange solid;
    border-top: 1px orange solid;
    z-index: 3;
}

table.L22 tr.expanded td.first {
    border-left: 1px orange solid;
}

table.L22 tr.expanded td.last {
    border-right: 1px orange solid;
}

table.L22 tr.odd {
    background: #2C2C2C;
}

table.L22 th.first,
table.L22 td.first {
    border-left: none;
}

table.L22 th.last,
table.L22 td.last {
    border-right: none;
}

table.L22 td {
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    line-height: 20px;
    font-size: 9px;
    color: #AAA;
    /*border-right: 1px solid #454545;*/
    /*border-bottom: 1px solid #202020;*/
    border-top: 1px solid #222;
}

/*table.L22 tr.NU_table_row {
    padding-bottom: 10px;
}*/

/*td.NU_table_row {
    border: 0!important;
    border: 1px orange solid;
    padding: 0;
    margin: 0;
}

td.NU_table_row table tr{
    border-left: 1px orange solid!important;
    border-right: 1px orange solid!important;
}
*/

table.L22 div.MASN_NU_back {
    border: 1px orange solid;
    border-radius: 5px;
    width: 50%;
    margin-left: 25%;
    margin-top: 5px;
    margin-bottom: 5px;
}

.animateExpand-enter {
    opacity: 0;
    transition: 200ms;
}

.animateExpand-enter.animateExpand-enter-active {
    opacity: 1;
}

.animateExpand-exit {
    opacity: 1;
    transition: 300ms;
}

.animateExpand-exit.animateExpand-exit-active {
    opacity: 0;
}

table.L22.L22_FMS {
    cursor: default;
}

ul.filter_tableContent {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    margin-left: 10px;
    position: relative;
}

ul.filter_tableHeader {
    height: 30px;
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

ul.filter_tableHeader li.filter_tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 100%;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    text-align: center;
    line-height: 30px;
}

ul.filter_tableContent li.filter_tableContentRow {
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 95%;
    padding: 0 5% 0 0;
    height: 25px;
    line-height: 25px;
    text-align: left;
    border-bottom: 1px solid #202020;
}

ul.alert_tableHeader {
    height: 30px;
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

.filter_control_link {
    width: 29px;
    display: inline-block;
    font-size: 11px;
    color: #FFF;
    text-align: center;
    vertical-align: top;
}

ul.alert_tableHeader li.alert_tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 100%;
    text-align: center;
    line-height: 30px;
}

.control_tableHeader_1 {
    width: 30px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.control_tableHeader_2 {
    width: 282px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.alert_tableHeader_1 {
    width: 59px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.alert_tableHeader_2 {
    width: 185px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.alert_tableHeader_3 {
    width: 59px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.alert_tableHeader_4 {
    width: 29px;
    border-right: 1px solid #232323;
    display: inline-block;
    float: left;
}

.alert_tableHeader_5 {
    width: 40px;
    display: inline-block;
    float: left;
}

.STJ_Config_TableWrapper {
    display: inline-block;
    vertical-align: top;
}

ul.STJ_Performance_tableHeader {
    height: 30px;
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    background: #5c5c5c;
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVjNWM1YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #333333));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c5c5c 0%, #333333 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #5c5c5c 0%, #333333 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5c5c5c', endColorstr='#333333', GradientType=0);
    /* IE6-8 */
    position: relative;
    z-index: 2;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.58);
}

ul.STJ_Performance_tableHeader li.STJ_Performance_tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 92px;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #222;
    text-align: center;
    line-height: 30px;
}

ul.STJ_Performance_tableHeader li.STJ_Performance_tableHeaderTitle.STJ_Performance_tableHeaderTitleStart {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 92px;
    border-right: 1px solid #222;
    border-left: none;
    text-align: center;
    line-height: 30px;
}

ul.STJ_Performance_tableHeader li.STJ_Performance_tableHeaderTitle.STJ_Performance_tableHeaderTitleEnd {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 92px;
    border-left: 1px solid #4d4d4d;
    border-right: none;
    text-align: center;
    line-height: 30px;
}

ul.STJ_Performance_tableContent {
    font-size: 0px;
    font-weight: bold;
    padding: 0;
    position: relative;
}

ul.STJ_Performance_tableContent li.STJ_Performance_tableContentRow {
    height: 20px;
    line-height: 20px;
    font-size: 9px;
    display: inline-block;
    color: #AAA;
    width: 92.75px;
    border-right: 1px solid #454545;
    text-align: center;
    border-bottom: 1px solid #202020;
    float: left;
}

ul.STJ_Performance_tableContent li.STJ_Performance_tableContentRow.STJ_Performance_tableContentRowEnd {
    border-right: none !important;
}

.STJ_Performance_odd {
    background: #2C2C2C;
}

.STJ_Performance_tableContentRowStart {
    border-right: 1px solid #191919 !important;
    background: #232323;
    border-top: 1px solid #373737;
    height: 19px !important;
}

.STJ_Performance_tableHeaderTitleTop {
    display: block;
    height: 10px;
    line-height: 18px;
}

.STJ_Performance_tableHeaderTitleBottom {
    display: block;
    height: 20px;
    line-height: 20px;
}

.shipCompareShipTime {
    position: absolute;
    left: 20px;
    font-size: 10px;
    line-height: 15px;
    top: 43px;
    color: #fff;
}

.shipCompareShipTime.old {
    text-decoration: line-through;
    color: #969696;
}

.alert_source {
    height: 50px;
    width: 59px;
    line-height: 50px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    float: left;
    border-right: 1px solid #191919;
    border-bottom: 1px solid #333;
}

.alert_description {
    height: 40px;
    padding: 10px 5px 0 5px;
    width: 175px;
    line-height: 14px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    float: left;
    border-right: 1px solid #191919;
    border-bottom: 1px solid #333;
    word-wrap: break-word;
}

.alert_time {
    height: 50px;
    width: 59px;
    line-height: 50px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    float: left;
    border-bottom: 1px solid #333;
    border-right: 1px solid #191919;
}

.alert_pri {
    height: 50px;
    width: 29px;
    line-height: 50px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    float: left;
    border-bottom: 1px solid #333;
    border-right: 1px solid #191919;
}

.alert_rcvd {
    height: 50px;
    width: 40px;
    line-height: 50px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    float: left;
    border-bottom: 1px solid #333;
}

.alert_odd {
    background: #2c2c2c;
}

.DX_row:hover {
    border: 1px solid orange;
}

.DX_row {
    height: 62px;
    width: 376px;
    margin-bottom: 8px;
    box-sizing: border-box;
    border: 1px solid #2c2c2c;
}

.DX_row:hover {
    border: 1px solid orange;
    box-sizing: border-box;

}

.DX_row div.DX_Name {
    height: 60px;
    width: 184px;
    padding-left: 10px;
    line-height: 26px;
    display: inline-block;
    color: #dadada;
    font-size: 12px;
    text-align: left;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #2C2C2C;
    user-select: text !important;
    -webkit-user-select: text !important;
    /* Chrome all / Safari all */
    -moz-user-select: text !important;
    /* Firefox all */
    -ms-user-select: text !important;
    /* IE 10+ */
}

.DX_row div.DX_Error {
    height: 60px;
    width: 364px;
    padding-left: 10px;
    line-height: 26px;
    display: inline-block;
    color: #dadada;
    font-size: 12px;
    text-align: left;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #2C2C2C;
    user-select: text !important;
    -webkit-user-select: text !important;
    /* Chrome all / Safari all */
    -moz-user-select: text !important;
    /* Firefox all */
    -ms-user-select: text !important;
    /* IE 10+ */
}

.DX_Progress {
    height: 8px;
    width: 125px;
    color: #dadada;
    font-size: 10px;
    text-align: left;
    position: relative;
    background: grey;
    border-radius: 4px;
    margin-left: 10px;
    bottom: 25px;
}

.DX_row div .DX_Progress div {
    user-select: none !important;
    -webkit-user-select: none !important;
    /* Chrome all / Safari all */
    -moz-user-select: none !important;
    /* Firefox all */
    -ms-user-select: none !important;
    /* IE 10+ */
}

.DX_Progress_Fill {
    height: 100%;
    width: 0;
    border-radius: 4px;
    background: #60D930;
    transition: all .1s ease-in;
}

.DX_Progress.done .DX_Progress_Fill {
    width: 100%;
}

.DX_Progress_Text {
    font-size: 12px;
    color: #dadada;
    display: block;
    position: relative;
    right: -126px;
    top: -61px;
    width: 64px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}

.DX_Progress_Time {
    font-size: 9px;
    color: #dadada;
    display: block;
    position: relative;
    right: 0;
    top: 4px;
    width: 125px;
    text-align: left;
}

.DX_File_Size {
    font-size: 9px;
    color: #dadada;
    display: block;
    position: relative;
    right: -1px;
    top: -28px;
    width: 125px;
    text-align: left;
}

.DX_Request {
    height: 60px;
    width: 86px;
    line-height: 70px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: right;
    word-wrap: break-word;
    position: relative;
    background: #2c2c2c;
}

.DX_Button {
    border: 1px solid #AFAFAF;
    color: #AFAFAF;
}

.DX_Button:hover {
    color: orange;
    border: 1px solid orange;
}

.DX_Button.disabled,
.DX_Button.disabled:hover {
    border: 1px solid grey !important;
    color: grey !important;
    cursor: default !important;
}

.DX_Button.complete,
.DX_Button.complete:hover {
    color: var(--green) !important;
    border: 1px solid var(--green) !important;
    cursor: default !important;
}

.DX_Request_Button {
    width: 78px;
    height: 30px;
    line-height: 30px;
    margin: 15px 0;
    border-radius: 3px;
    cursor: pointer;
    transition: all .15s ease-in;
    font-size: 9px;
    display: inline-block;
    text-decoration: none;
    text-align: center;
    vertical-align: top;
}

.DX_Request_Button.requesting {
    color: orange;
    border: 1px solid orange;
}

.DX_Download {
    height: 60px;
    width: 94px;
    line-height: 70px;
    display: inline-block;
    color: #dadada;
    font-size: 10px;
    text-align: center;
    word-wrap: break-word;
    position: relative;
    background: #2c2c2c;
}

.DX_Download_Button {
    width: 78px;
    height: 30px;
    line-height: 30px;
    margin: 15px 0;
    border-radius: 3px;
    cursor: pointer;
    transition: all .15s ease-in;
    font-size: 9px;
    display: inline-block;
    text-decoration: none;
    vertical-align: top;
}

.DX_Download_Button:hover {
    color: orange;
    border: 1px solid orange;
}

.filter_control_link {
    width: 29px;
    display: inline-block;
    font-size: 11px;
    color: #FFF;
    text-align: center;
    vertical-align: top;
}

ul.alert_tableHeader li.alert_tableHeaderTitle {
    font-size: 10px;
    display: inline-block;
    color: #fff;
    width: 100%;
    text-align: center;
    line-height: 30px;
}

.DX_odd {
    background: #2c2c2c;
}

.modalContent span {
    width: 90%;
    height: 30px;
    line-height: 30px;
    display: block;
    padding: 0 5%;
    font-size: 16px;
    color: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.modalContent ul {
    position: relative;
    width: 100%;
    z-index: 0;
}

.trigraphListItem {
    width: 70%;
    padding: 0 5%;
    margin: 0 auto;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    background: #333;
}

.forwardingStatus {
    width: 356px;
    height: 240px;
    margin: 10px auto;
    font-size: 0;
    display: block;
    position: relative;
}

.forwardingStatus li {
    width: 56px;
    margin-top: 1px;
    margin-right: 1px;
    border: 1px solid #1E1E1E;
    background: #333;
    display: inline-block;
    height: 35px;
    line-height: 35px;
    font-size: 11px;
    vertical-align: top;
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    float: left;
    color: #dadada;
    border-radius: 3px;
    -webkit-border-radius: 3px;
}

.forwardingStatusData td {
    background-position: center;
    background-repeat: no-repeat;
}

.accordion .arrow_both {
    background-image: url(../img/icon_bidirectionalArrow.svg);
    background-size: 60%;
}

.accordion .arrow_up {
    background-image: url(../img/icon_upArrow.svg);
    background-size: 32%;
}

.forwardingStatus li.forwardingStatusData {
    letter-spacing: 1px;
}

.forwardingStatus li.forwardingStatusLabel {
    font-size: 11px;
    color: #fff;
    background: none;
    font-weight: bold;
    border: none;
    width: 58px;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

.forwardingStatus li.forwardingStatusEnd {
    margin-right: 0px;
}

.forwardingStatus li.forwardingSTatusBlank {
    background: none !important;
    border: none !important;
    width: 58px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

.topIssueDFLabel {
    width: 51px;
    display: inline-block;
    height: 27px;
    line-height: 27px;
    font-size: 9px;
    vertical-align: top;
    color: #FFF;
    text-align: center;
}

.topIssueDF {
    width: 50px;
    display: inline-block;
    height: 35px;
    line-height: 35px;
    font-size: 10px;
    vertical-align: top;
    color: #FFF;
    text-align: center;
    font-size: 10px;
    border-left: 1px solid #363636;
}

.detailsButton {
    display: inline-block;
    padding: 2px 0;
    width: 35px;
    text-align: center;
    border: 1px solid #3D3D3D;
    color: #bbbbbb;
    background: #313131;
    border-radius: 3px;
    font-size: 9px;
    margin-top: 5px;
    line-height: 12px;
    float: right;
    transition: all .25s;
    -webkit-transition: all .25s;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
}

.detailsButton:hover {
    color: #fff;
    border-color: #fff;
}

.detailsControlButton {
    display: inline-block;
    padding: 2px 0;
    text-align: center;
    border: 1px solid #3D3D3D;
    color: #bbbbbb;
    background: #313131;
    border-radius: 3px;
    font-size: 9px;
    width: 50%;
    margin-top: 5px;
    margin-left: 27.5%;
    line-height: 12px;
    transition: all .25s;
    -webkit-transition: all .25s;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.detailsControlButton:hover {
    color: #fff;
    border-color: #fff;
}

.filter_tableContentRow {
    transition: all .5s ease-in;
    -webkit-transition: all .5s ease-in;
    overflow: hidden;
}

.filter_tableContentRow.hideFilterDetails {}

li.filter_tableContentRow.showFilterDetails {
    height: 905px !important;
}

li.filter_tableContentRow.showFilterControlDetails {
    height: auto !important;
}

.filterControlDetail {
    width: 276px;
    display: inline-block;
}

.filterDetail {
    color: #FFF;
}

.filterDetailWrap {
    display: inline-block;
    width: 49%;
}

.filterControlDetailWrap {
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid #202020;
}

.filterTitle {
    color: #fff;
    font-size: 16px;
}

.fieldClass_ES_bar_green {
    background: rgb(99, 225, 49);
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzZTEzMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0Y2E4MjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(99, 225, 49, 1) 0%, rgba(76, 168, 37, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(99, 225, 49, 1)), color-stop(100%, rgba(76, 168, 37, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(99, 225, 49, 1) 0%, rgba(76, 168, 37, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(99, 225, 49, 1) 0%, rgba(76, 168, 37, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(99, 225, 49, 1) 0%, rgba(76, 168, 37, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(99, 225, 49, 1) 0%, rgba(76, 168, 37, 1) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#63e131', endColorstr='#4ca825', GradientType=0);
    /* IE6-8 */
}

.fieldClass_ES_bar_white {
    background: rgb(221, 221, 221);
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2RkZGRkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiMmIyYjIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(221, 221, 221, 1) 1%, rgba(178, 178, 178, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, rgba(221, 221, 221, 1)), color-stop(100%, rgba(178, 178, 178, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(221, 221, 221, 1) 1%, rgba(178, 178, 178, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(221, 221, 221, 1) 1%, rgba(178, 178, 178, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(221, 221, 221, 1) 1%, rgba(178, 178, 178, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(221, 221, 221, 1) 1%, rgba(178, 178, 178, 1) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#b2b2b2', GradientType=0);
    /* IE6-8 */
}

.fieldClass_ES_bar_blue {
    background: rgb(0, 85, 255);
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNTVmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDJjYTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(0, 85, 255, 1) 0%, rgba(0, 44, 165, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 85, 255, 1)), color-stop(100%, rgba(0, 44, 165, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0, 85, 255, 1) 0%, rgba(0, 44, 165, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0, 85, 255, 1) 0%, rgba(0, 44, 165, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(0, 85, 255, 1) 0%, rgba(0, 44, 165, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(0, 85, 255, 1) 0%, rgba(0, 44, 165, 1) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0055ff', endColorstr='#002ca5', GradientType=0);
    /* IE6-8 */
}

.fieldClass_ES_bar_yellow {
    background: rgb(255, 255, 48);
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmYzMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5YjliMWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(255, 255, 48, 1) 0%, rgba(155, 155, 29, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 48, 1)), color-stop(100%, rgba(155, 155, 29, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255, 255, 48, 1) 0%, rgba(155, 155, 29, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255, 255, 48, 1) 0%, rgba(155, 155, 29, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255, 255, 48, 1) 0%, rgba(155, 155, 29, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(255, 255, 48, 1) 0%, rgba(155, 155, 29, 1) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff30', endColorstr='#9b9b1d', GradientType=0);
    /* IE6-8 */
}

.fieldClass_ES_bar_red {
    background: rgb(225, 49, 49);
    /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2UxMzEzMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhNTI4MjQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(225, 49, 49, 1) 1%, rgba(165, 40, 36, 1) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, rgba(225, 49, 49, 1)), color-stop(100%, rgba(165, 40, 36, 1)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(225, 49, 49, 1) 1%, rgba(165, 40, 36, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(225, 49, 49, 1) 1%, rgba(165, 40, 36, 1) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(225, 49, 49, 1) 1%, rgba(165, 40, 36, 1) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(225, 49, 49, 1) 1%, rgba(165, 40, 36, 1) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e13131', endColorstr='#a52824', GradientType=0);
    /* IE6-8 */
}

.fieldClass_box_indicator_green {
    background: var(--green) !important;
}

.fieldClass_box_indicator_red {
    background: #C32;
}

.fieldclass_IOC {
    width: 25%;
    float: right;
}

.shipCompareDataMode {
    position: absolute;
    left: 105px;
    top: 25px;
    font-size: 10px;
}

.shipCompareDataMode_label {
    display: inline-block;
    font-weight: bold;
}

.shipCompareDataMode_data {
    display: inline-block;
}

#patchModal .modalContent .loading {
    width: 100%;
    height: 100%;
    display: block;
    background: url('../img/FuseLogo_RGB_oneColor-White_small-digital-use-only_blade-only.svg') no-repeat center center;

}

@keyframes rotation {
    from {
        transform: rotate(0deg);
        transform-origin: center;
    }

    to {
        transform: rotate(359deg);
        transform-origin: center;
    }
}

#patchModal .modalContent .header {
    width: 100%;
    height: 30px;
    line-height: 30px;
    display: block;
    padding-bottom: 5px;
    font-size: 16px;
    color: #fff;
    z-index: 1;
    text-align: right;
    left: 0px;
    position: relative;
}

#patchModal .modalContent .header.label {
    width: 100%;
    height: 30px;
    line-height: 30px;
    display: block;
    padding-bottom: 0;
    font-size: 16px;
    color: #fff;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
    z-index: 1;
    text-align: center;
    background: url('../img/black_gradient.jpg') center repeat;
    left: 0px;
    position: relative;
}

#patchModal .modalContent .header .label {
    display: inline-block !important;
    width: auto;
    margin-right: 10px;
}

#patchModal .modalContent .header.label .label {
    display: inline-block !important;
    width: 16.6%;
    text-align: center;
    margin-right: 0;
    font-size: 14px;
    color: #dadada;
    box-sizing: border-box;
}

#patchModal .modalContent .header input {
    display: inline-block;
    border-radius: 3px;
    width: 300px;
    padding: 6px 0 6px 6px;
    background: #202020 url('../img/searchbar.png') center right no-repeat;
    border: 1px solid #1D1D1D;
    color: #DADADA;
    transition: all .5s;
    box-sizing: content-box;
}

#patchModal .modalContent .header input::-webkit-input-placeholder {
    color: #5C5C5C;
}

#patchModal .modalContent .header input:-moz-placeholder {
    /* Firefox 18- */
    color: #5C5C5C;
}

#patchModal .modalContent .header input::-moz-placeholder {
    /* Firefox 19+ */
    color: #5C5C5C;
}

#patchModal .modalContent .header input:-ms-input-placeholder {
    color: #5C5C5C;
}

#patchModal .modalContent .header input:hover {
    border: 1px solid #444;
}

#patchModal .modalContent .header input:focus {
    border: 1px solid #fff;
    color: #fff;
}

#patchModal,
#rpmShipList {
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -ms-touch-action: none;

    user-select: none;
    outline: none;
    height: 98%;
}

#rpmShipList {
    overflow-y: auto;
}

#rpmShipList .rpmShipListShip {
    width: 100%;
    height: 30px;
    line-height: 30px;
    cursor: default;
    box-sizing: border-box;
    border-bottom: 1px solid #202020;
    border-top: 1px solid #434343;
}

#rpmShipList .rpmShipListShip:hover {
    background: #4D4D4D !important;
}

#rpmShipList .rpmShipListShip div {
    width: 16.6%;
    height: 30px;
    display: inline-block;
    text-align: center;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

#patchModal .border1 {
    border-right: 1px solid #232323;
}

#patchModal .border2 {
    border-left: 1px solid #434343;
}

#rpmShipList .rpmShipListShip div.name {
    text-align: left;
    padding-left: 10px;
    box-sizing: border-box;
}

#rpmShipList .rpmShipListShip div.none {
    color: #C32;
}

.ui-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 10px;
    display: block;
    outline: none;
    width: 308px !important;
    z-index: 9999999;
    background: rgb(102, 102, 102);
}

.ui-menu .ui-menu {
    position: absolute;
}

.ui-menu .ui-menu-item {
    position: relative;
    margin: 0;
    padding: 3px 1em 3px .4em;
    cursor: pointer;
    min-height: 0;
    /* support: IE7 */
    font-size: 12px;
    border-bottom: 1px solid #202020;
    border-top: 1px solid #434343;
    color: #dadada;
    /* support: IE10, see #8844 */
    list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}

.ui-menu .ui-menu-item:hover,
.ui-menu .ui-menu-item.ui-state-focus {
    position: relative;
    margin: 0;
    padding: 3px 1em 3px .4em;
    cursor: pointer;
    min-height: 0;
    /* support: IE7 */
    font-size: 12px;
    border-bottom: 1px solid #202020;
    border-top: 1px solid #434343;
    color: #fff;
    font-weight: bold;
    /* support: IE10, see #8844 */
    list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}

.ui-menu .ui-menu-divider {
    margin: 5px 0;
    height: 0;
    font-size: 0;
    line-height: 0;
    border-width: 1px 0 0 0;
}

.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
    margin: -1px;
}

.classification_banner {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    flex-shrink: 0;
    color: #fff;
    text-align: center;
    padding: 2px;
}

.top {
    top: 0;
}

.bottom {
    bottom: 0;
}

.about {
    pointer-events: none;
}

.about-logo {
    width: 100%;
    height: 100%;
}

.about-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
    justify-content: center;
}

.about-info div {
    padding-left: 20px;
    border-left: solid 1px #707070;
}

#logon_banner {
    position: absolute;
    top: 0;
    bottom: 0px;
    background: #2e2e2e;
    width: 100%;
    z-index: 999999;
    display: flex;
    flex-direction: column;

}

#logon_banner .modalTitle {
    border-radius: 0;
}

#logon_banner .modalContent {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    background-color: #666;
    overflow-x: auto;
}

#logon_banner .modalContent .bannerWrap {
    width: 89%;
    margin: auto auto;
    border: 1px solid #343434;
    border-radius: 5px;
    background-color: #313131;
    max-width: 800px;
    color: white;
    min-width: 445px;
}

#BannerTitle {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: #191919;
    height: auto;
    border-radius: 5px;
    padding: 10px 0px 10px 18px;
}

#logon_banner .modalContent p {
    font-size: 12px;
    width: 60%;
    margin: 0 auto;
    font-weight: normal;
}

#logon_banner #bannerBody .select {
    margin-top: 12px;
    width: 100%;
    display: block;
}

#logon_banner .select .no,
#logon_banner .select .ok {
    display: inline-block;
    padding: 3px 12px;
    text-decoration: none;
    line-height: 30px;
    border: 1px solid #242424;
    font-size: 18px;
    transition: all .5s;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    border-radius: 17px;
    color: black;
    font-weight: bold;
    box-shadow: 0 0 10px 0 rgb(0 0 0 / 80%)
}

#logon_banner .select .ok {
    margin-left: 15px;
    background-color: var(--green);
}

#logon_banner .select .no {
    background-color: white;
}

#logon_banner .select .no:hover {
    background: #ddd;
}

#logon_banner .select .ok:hover {
    background: #7dfb4b;
}

.word {
    width: 356px;
    background: #333;
    color: #dadada;
    box-sizing: border-box;
    margin: 0 auto;
    margin-top: 10px;
    border: 1px solid #1e1e1e;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    -webkit-border-radius: 3px;
}

.word .title {
    padding: 10px;
    color: #fff;
    font-size: 14px;
    background: #353535;
    font-weight: bold;
    border-top: 1px solid #272727;
    border-bottom: 1px solid #272727;
    border-radius: 3px;
}

.word .fields .field {
    text-align: left;
}

.word .fields .field .label {
    font-size: 11px;
    color: #A0A0A0;
    padding: 10px 10px 0 10px;
    border-top: 1px solid #3D3D3D;
    margin-bottom: 2px;
}

.word .fields .field .value {
    display: block;
    font-size: 12px;
    padding: 0 10px 10px 10px;
    border-bottom: 1px solid #272727;
}

.placeholder {
    display: inline-block;
    width: 356px;
    height: 30px;
    line-height: 30px;
    float: left;
    padding: 0 10px;
    cursor: default;
    color: #fff;
    font-style: italic;
}

/* ================================================================== */
/* Toolbars
/* ================================================================== */

.leaflet-draw-section {
    position: relative;
}

.leaflet-draw-toolbar {
    margin-top: 12px;
    overflow: hidden;
}

.leaflet-draw-toolbar-top {
    margin-top: 0;
}

.leaflet-draw-toolbar-notop a:first-child {
    border-top-right-radius: 0;
}

.leaflet-draw-toolbar-nobottom a:last-child {
    border-bottom-right-radius: 0;
}

.leaflet-draw-toolbar a {
    background: url('../img/spritesheet.png');
    background-repeat: no-repeat;
    background-size: 270px 30px;
}

.leaflet-retina .leaflet-draw-toolbar a {
    background: url('../img/spritesheet-2x.png');
    background-repeat: no-repeat;
    background-size: cover;
}

.leaflet-draw a {
    display: block;
    text-align: center;
    text-decoration: none;
}

/* ================================================================== */
/* Toolbar actions menu
/* ================================================================== */

.leaflet-draw-actions {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 26px;
    /* leaflet-draw-toolbar.left + leaflet-draw-toolbar.width */
    top: 0;
    white-space: nowrap;
}

.leaflet-touch .leaflet-draw-actions {
    left: 32px;
}

.leaflet-right .leaflet-draw-actions {
    right: 26px;
    left: auto;
}

.leaflet-touch .leaflet-right .leaflet-draw-actions {
    right: 32px;
    left: auto;
}

.leaflet-draw-actions li {
    display: inline-block;
}

.leaflet-draw-actions li:first-child a {
    border-left: none;
}

.leaflet-draw-actions li:last-child a {
    -webkit-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
}

.leaflet-right .leaflet-draw-actions li:last-child a {
    -webkit-border-radius: 0;
    border-radius: 0;
}

.leaflet-right .leaflet-draw-actions li:first-child a {
    -webkit-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}

.leaflet-draw-actions a {
    background-color: #919187;
    border-left: 1px solid #AAA;
    color: #FFF;
    font: 11px/19px "Helvetica Neue", Arial, Helvetica, sans-serif;
    line-height: 28px;
    text-decoration: none;
    padding-left: 10px;
    padding-right: 10px;
    height: 28px;
}

.leaflet-touch .leaflet-draw-actions a {
    font-size: 12px;
    line-height: 30px;
    height: 30px;
}

.leaflet-draw-actions-bottom {
    margin-top: 0;
}

.leaflet-draw-actions-top {
    margin-top: 1px;
}

.leaflet-draw-actions-top a,
.leaflet-draw-actions-bottom a {
    height: 27px;
    line-height: 27px;
}

.leaflet-draw-actions a:hover {
    background-color: #A0A098;
}

.leaflet-draw-actions-top.leaflet-draw-actions-bottom a {
    height: 26px;
    line-height: 26px;
}

/* ================================================================== */
/* Draw toolbar
/* ================================================================== */

.leaflet-draw-toolbar .leaflet-draw-draw-polyline {
    background-position: -2px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polyline {
    background-position: 0 -1px;
}

.leaflet-draw-toolbar .leaflet-draw-draw-polygon {
    background-position: -31px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polygon {
    background-position: -29px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-draw-rectangle {
    background-position: -62px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle {
    background-position: -60px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-draw-circle {
    background-position: -92px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-circle {
    background-position: -90px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-draw-marker {
    background-position: -122px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-marker {
    background-position: -120px -1px;
}

/* ================================================================== */
/* Edit toolbar
/* ================================================================== */

.leaflet-draw-toolbar .leaflet-draw-edit-edit {
    background-position: -152px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit {
    background-position: -150px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-edit-remove {
    background-position: -182px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove {
    background-position: -180px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled {
    background-position: -212px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled {
    background-position: -210px -1px;
}

.leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled {
    background-position: -242px -2px;
}

.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled {
    background-position: -240px -2px;
}

/* ================================================================== */
/* Drawing styles
/* ================================================================== */

.leaflet-mouse-marker {
    background-color: #fff;
    cursor: crosshair;
}

.leaflet-draw-tooltip {
    background: url('../img/transparent_black_50.png') repeat;
    border: 1px solid transparent;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    color: #fff;
    font: 12px/18px "Helvetica Neue", Arial, Helvetica, sans-serif;
    margin-left: 20px;
    margin-top: -21px;
    padding: 4px 8px;
    position: absolute;
    visibility: hidden;
    white-space: nowrap;
    z-index: 6;
}

.leaflet-draw-tooltip:before {
    border-right: 6px solid black;
    border-right-color: rgba(0, 0, 0, 0.5);
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    content: "";
    position: absolute;
    top: 7px;
    left: -7px;
}

.leaflet-error-draw-tooltip {
    background-color: #F2DEDE;
    border: 1px solid #E6B6BD;
    color: #B94A48;
}

.leaflet-error-draw-tooltip:before {
    border-right-color: #E6B6BD;
}

.leaflet-draw-tooltip-single {
    margin-top: -12px
}

.leaflet-draw-tooltip-subtext {
    color: #f8d5e4;
    font-family: Arial, sans-serif;
}

.leaflet-draw-guide-dash {
    font-size: 1%;
    opacity: 0.6;
    position: absolute;
    width: 3px;
    height: 3px;
}

/* ================================================================== */
/* Edit styles
/* ================================================================== */

.leaflet-edit-marker-selected {
    background: orange;
    border: 3px dashed orange;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    box-sizing: content-box;
}

.leaflet-edit-move {
    cursor: move;
}

.leaflet-edit-resize {
    cursor: pointer;
}

/* ================================================================== */
/* Old IE styles
/* ================================================================== */

.leaflet-draw.leaflet-control {
    width: 26px;
    height: 26px;
}

.leaflet-draw-actions {
    display: none !important;
}

.leaflet-draw-tooltip-subtext {
    color: #fff !important;
}

.invalid {
    text-decoration: line-through !important;
    color: #969696 !important;
    height: 100px;
}


.shipList li:nth-child(odd) {
    background-color: #252525;
}

.shipList li:nth-child(even) {
    background-color: #202020;
}

.shipList .chit {
    padding-left: 4px;
    padding-right: 5px;
}

.shipListRow {
    width: 100%;
    height: 35px;
    line-height: 35px;
    background-color: #252525;
    color: white;
}

.shipListRowChits {
    margin-left: 14.5px;
}

.shipListRowName {
    margin-left: 8px;
}

.oldShip {
    color: var(--grey);
    text-decoration: line-through;
}

.textRight {
    text-align: right;
}

.spyTabs li {
    flex-grow: 1;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 7px;
}

.spyTabs .chit.before::before {
    margin-right: 3px;
}

.statusBar {
    display: inline;
    line-height: 30px;
    cursor: default;
    color: #bbb;
    text-align: left
}

.statusBar .segmentsContainer {
    margin-left: 15px;
    width: 200px !important;
    display: inline-flex;
    vertical-align: middle;
}

.statusBar .segment {
    height: 14px;
    width: 100% !important;
    border-right: 2px;
    border-style: solid;
    border-color: #252525;
}

.statusBar .statusBarText {
    padding-left: 20px;
}

.statusBar .segment:first-child {
    border-radius: 3px 0px 0px 3px;
}

.statusBar .segment:last-child {
    border-radius: 0px 3px 3px 0px;
    border-right: none;
}


.statusBar .greenSegment {
    background-color: var(--green);
}

.statusBar .redSegment {
    background-color: var(--red);
}

.statusBar .yellowSegment {
    background-color: var(--yellow);
}

.statusBar .greySegment {
    background-color: var(--grey);
}

.statusBar .partialSegment {
    height: 14px;
    display: block;
}

.accordion .spyStatusBoxes .box {
    display: inline-block;
    outline: 1px solid #444;
    background: #202020;
    width: calc(33.33% - 22px);
    margin: 5px;
    padding: 6px;
    color: #bbb;
    width: 25px;
    height: 25px;
    text-align: center;
    font-size: 12px;
    padding-top: 20px;
    padding-bottom: 2px;
}

ul.spyStatusBoxes {
    display: inline-block;
    min-width: 188px;
}

.accordion .spyStatusBoxes h2 {
    display: inline-block;
    outline: 1px solid #444;
    background: #202020;
    margin: 5px;
    padding: 6px;
    font-size: 12px;
    height: 25px;
    padding-top: 20px;
    padding-bottom: 2px;
    width: calc(50% - 22px);
}

.accordion .radarDoctrineBoxes {
    display: flex;
}

.accordion .radarDoctrineBoxes .box {
    flex-grow: 1;
    outline: 1px solid #444;
    background: #202020;
    color: #bbb;
    height: 25px;
    width: 100%;
    text-align: center;
    font-size: 12px;
    padding-top: 22px;
    padding-bottom: 2px;
    margin-top: 1px;
}

.accordion .flexItem {
    flex: 1;
}

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

.accordion .primeEnumBox {
    margin: 0 !important;
    position: relative;
}

.accordion .primeEnumBox .box {
    width: 171px;
    height: 55px;
    position: relative;
}

.accordion .primeEnumBox .primeEnumSpan {
    bottom: 10px;
    position: absolute;
    color: #fff;
}

.accordion .primeEnumBox .chit.before::before {
    margin-right: 4px;
}

.accordion .chit.above {
    padding-top: .75em !important;
}

.chitText {
    margin-left: 4px;
    color: white;
}

.box p {
    text-align: left;
}

.shipCompareSpyTab {
    padding-left: 10px;
    padding-right: 10px;
}

.visLineGraph {
    margin: 10px 15px 12px -8px;
}

.visLineGraph .vis-major {
    color: #bbb;
}

.visLineGraph .vis-timeline {
    border: none;
}

.visLineGraph .vis-y-axis.vis-major {
    color: #bbb !important;
}

.visLineGraph .vis-text {
    color: #bbb !important;
}

.visLineGraph .vis-background .vis-horizontal {
    opacity: .5;
}

.visLineGraph .vis-background .vis-vertical {
    display: none;
}

.visLineGraph .blueLine {
    stroke: #0077fc;
    stroke-width: 3px;
    fill: none;
}

.visLineGraph .whiteLine {
    stroke: white;
    stroke-width: 2px;
    fill: none;
}

.visLineGraph .vis-time-axis {
    overflow: visible !important;
}

.visLineGraph .vis-time-axis .vis-text {
    padding-top: 15px !important;
}

.visLineGraph .vis-time-axis .vis-text::before {
    content: '|';
    color: #bbb;
    position: absolute;
    right: 63%;
    top: -10.5px;
    transform: translateX(50%);
    border: 12px solid transparent;
}

.visLineGraph .vis-left {
    border-bottom: none !important;
}

.visLineGraph .vis-panel.vis-bottom {
    border-right: none !important;
    border-left: none !important;
}

.historyLegend {
    outline: 1px solid #444;
    background: #202020;
    margin: 5px;
    margin-left: auto;
    padding: 6px;
    color: #bbb;
    width: 150px;
    height: 39px;
    float: right;
    font-size: 12px;
}

.historyLegend p {
    line-height: 20px;
}

.historyLegendPoint {
    float: right;
    margin-right: 4px;
}

.historyLegendPoint::after {
    display: inline-block;
    content: "";
    height: 7px;
    width: 7px;
    margin-bottom: 1px;
    border-radius: 100%;
}

.doctrine-line {
    stroke: white;
    stroke-width: 1;
}

.shipMarkerLeftCol {
    text-align: left;
    width: 45px;
}

.shipMarkerRightCol {
    text-align: right;
}

.shipMarkerRow {
    width: 100% !important;
    display: inline-flex;
    font-size: 10px !important;
    text-align: right;
    line-height: 18px !important;
    border-top: 1px solid #707070;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.04);
    color: #DADADA;
    padding-top: 8px;
    padding-bottom: 5px;
}

.shipMarkerRow div {
    flex-grow: 1;
}

.shipMarkerChicletsContainer {
    height: 32px;
}

.shipMarkerChicletsContainer .chit.above {
    padding-top: 5px;
    margin-top: 11px;
}

.shipMarkerChicletsContainer .chit {
    margin-right: 6px;
}

.shipMarkerChicletsContainer .chit:first-child {
    margin-right: 10px;
}

.shipMarkerChicletsContainer .chit.before::before {
    margin-top: 6px;
}

.whiteBorderTop {
    border-top: 1px solid #707070;
}

.doctrineDataText {
    padding-top: 10px;
    padding-bottom: 6px;
    color: white;
    text-align: center !important;
}

.radarSectorLabel {
    font-size: 22px;
    cursor: auto;
    font-weight: 700;
}

.shipCompareTDLLabel {
    font-family: Arial, sans-serif !important;
    font-size: 10px;
    color: #bbb;
    text-align: right;
    position: absolute;
    top: -23px;
}

.battleShortContainer {
    position: absolute;
    left: 160px;
    top: 23px;
    height: 34px;
    width: 78px;
    border: 1px solid #707070;
    border-radius: 7px;
    font-size: 12px;
    display: flex;
}

.battleShortIcon {
    background: transparent url('../img/battle_short_icon.png') center center no-repeat;
    height: 16px;
    width: 16px;
    padding: 9px;
}

.battleShortTextDiv {
    font-family: Arial, sans-serif !important;
    height: 18.5px;
    margin-top: -6px;
    margin-left: 1px;
    font-size: 13px;
    font-weight: 550;
    line-height: 35px;
}

/* Battle Short Map Marker CSS */
.leaflet-pulsing-icon {
    border-radius: 100%;
    box-shadow: 1px 1px 8px 0 rgba(0, 0, 0, 0.75);
}

.leaflet-pulsing-icon:after {
    content: "";
    border-radius: 100%;
    height: 300%;
    width: 300%;
    position: absolute;
    margin: -100% 0 0 -100%;

}

@keyframes pulsate {
    0% {
        transform: scale(0.1, 0.1);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }

    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }

    100% {
        transform: scale(1.2, 1.2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
}

.exportButton {
    padding: 0px 8px;
    height: 29px;
    line-height: 28px;
    font-size: 14px;
    background: #313131;
    color: #bbbbbb;
    border: 1px solid white;
    border-radius: 5px;
    transition: all .5s;
    margin: 15px 3.5px;
    text-align: center;
    width: 368px;
    cursor: pointer;
}

.missionPriorityHeader li {
    background: #191919 !important;
    font-size: 12px;
}

.PanelBody {
    display: grid;
    grid-template-columns: 1fr 1fr;

}

.PanelSection+.PanelSection {
    margin-top: 0;
    margin-left: 5px;
}

.settings {
    background-color: #666;
    z-index: 99999;
    position: fixed;
    width: 100%;
    height: 90%;
}

.helpPage {
    background-color: #666;
    z-index: 99999;
    position: relative;
    width: 100%;
    height: 100%;
}

#helpContainer {
    height: 100%;
    display: none
}

.feedback .Button {
    width: 60px;
}

.feedback-required {
    display: flex;
    flex-direction: row;
}

.feedback-header-text {
    font-size: 16px;
}

.feedback-required span {
    padding: 5px 0 0 5px
}

.feedback-required textarea {
    min-width: 100%;
}

.feedback-success {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

.feedback-success>div {
    padding-right: 10px;
}

.feedback-success-list {
    list-style: disc;
}

.feedback-chiclet {
    margin-right: 5px;
}

.feedback-chiclet-container {
    display: flex;
}

.feedback-inputs textarea {
    resize: none;
}

.feedback-details {
    display: flex;
    justify-content: center;
}

.feedback-input-container {
    border: 1px solid #707070;
    border-radius: 5px;
    padding-right: 2px;
    background: rgba(25, 25, 25, 0.3);
}

.feedback-input-container .TextBox {
    border: none;
}

.feedback-input-container .TextBox:focus {
    border: none;
    margin: 0;
}

.feedback-input-container textarea::-webkit-scrollbar {
    background: rgba(25, 25, 25, 0.3);
    ;
}

.feedback-input-container .TextBox:hover {
    border: none;
}

.user-information-grid {
    display: grid;
    grid-template-columns: 80px 1fr min-content;
    row-gap: 10px;
    align-items: center;
}

#ortsContainer {
    position: absolute;
    top: 75px;
    left: 50px;
    width: 800px;
    height: 800px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 10px;
    background-color: #1F1F1F;
    font-family: Courier, fixed;
    font-size: 14px;
    color: #33d011;
}

.terminalLine:before {
    content: "\203A";
    margin-right: 6px;
}

.ortsRow {
    gap: 8px;
    margin-bottom: 5px;
}

.pb6 {
    padding-bottom: 6px;
}

.chevronButton {
    display: flex;
    align-content: center;
    height: 23px;
    line-height: 23px;
    border: 1px solid #707070;
    border-radius: 4px;
    padding-right: 8px;
    flex-basis: 100%;
}

.chevronButton:hover {
    border-color: #FFFFFF;
}

.chevronButton .chevronButtonChiclet {
    margin-top: -6px;
    margin-left: -2px;
}

.chevronButton .chevronButtonLabel {
    margin-top: 1px;
    margin-right: 10px;
    margin-left: -5px;
}

.chevronButton .chevronButtonChevron {
    flex-grow: 1;
    margin-top: -1px;
    font-size: 20px;
    text-align: right;
}

.chevronButton .chevron {
    position: absolute;
    top: 3px;
    left: 0px;
}

.ortsSectionHeader {
    margin-bottom: 8px !important;
}

.noHover {
    pointer-events: none;
}

.ortsDisabledText {
    color: #707070 !important;
    text-decoration: line-through;
}

.ortsHidden {
    visibility: hidden;
}

.chickletWrapper {
    display: inline-block;
    height: 20px;
}

.noticeBoxContainer {
    display: flex;
    position: absolute;
    top: 5px;
    right: 60px;
}

.noticeBox {
    color: #fff;
    padding: 0 8px 0 8px;
    font-size: 12px;
    height: 30px;
}

.noticeBox>div:first-child {
    width: 100%;
    height: 12px;
    line-height: 12px;
    text-align: center;
}

.noticeBox>div:last-child {
    width: 100%;
    height: 12px;
    padding-top: 2px;
    line-height: 12px;
    font-weight: 400;
    text-align: center;
    border-bottom: 4px solid #E13131;
}

.bRight1 {
    border-right: 1px solid #707070;
}

.bBottomOrange4 {
    border-bottom: 4px solid #FF7700 !important;
}

.chicletNextGen {
    margin-top: -1px;
}

.chicletNextGenIcon>svg {
    margin: 0 !important;
}

.chicletNextGenLabel {
    padding-top: 2px;
}

.ortsUl>li>span:first-child {
    color: #fff;
}

.ortsAlertSectionFilterContainer {
    padding: 6px;
}

.buttonNextGen {
    display: inline-block;
    color: #fff;
    background-color: #444;
    font-size: 16px;
    font-weight: 700;
    border-radius: 4px;
    padding: 6px;
}

.mr6 {
    margin-right: 6px;
}

.ortsDetailsContainer {
    position: absolute;
    left: 420px;
    top: 65px;
    width: 780px;
    height: 905px;
    padding: 2px 14px;
    background-color: #313131;
}

.ortsDetailsSelectorButtonContainer {
    display: flex;
    gap: 6px;
    background-color: #191919;
    padding: 6px;
}

.ortsDetailsSelectorButton {
    color: #bbb;
    font-size: 14px;
    font-weight: normal;
}

.ortsDetailSelected {
    border: 1px solid #fff;
    color: fff;
}

.ortsDetailsContentContainer {
    padding-top: 5px;
    background-color: #252525;
}

.detailsViewHeader {
    position: relative;
    display: flex;
    justify-content: space-between;
    padding-bottom: 6px;
    background-color: #313131;
}

.detailsViewHeader .label {
    padding-top: 9px;
    font-size: 15px;
}

.detailsViewContentHeader {
    padding: 10px 6px 7px 6px;
    background-color: #191919;
    border-bottom: 1px solid #707070;
    font-size: 16px;
    font-weight: 700;
}

.detailsViewContentSubHeader {
    padding: 6px;
    background-color: #202020;
    font-size: 14px;
    font-weight: 500;
}

.Chiclet-square {
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    color: green;
}

.componentStatusIndicator {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    width: 65px;
}

.componentStatusIndicator>.label {
    text-align: center;
    font-size: 10px;
}

.operabilityMapContainer {
    position: relative;
    background-color: #252525;
}

.fcsCgMapContainer {
    padding: 70px 10px 100px 10px;
}

.fcsDdg5178Ti12MapContainer {
    position: relative;
    padding: 70px 10px 100px 25px;
    background-color: #252525;
}

.dashboardToggleButton {
    display: flex;
    flex-direction: column;
    justify-content: center;
    justify-items: center;
    width: 23px;
    height: 23px;
    border-radius: 11.5px;
    background-color: #444;
    color: #fff;
    fill: #fff;
}

.dashboardToggleButton>div {
    margin-left: 4px;
}

.dashboardToggleButton svg {
    fill: currentColor;
}

.dashboardToggleButtonContainer {
    position: absolute;
    top: 21px;
    left: 363px;
}

.operabilityMapSubtext {
    font-size: 8px;
    color: #bbb;
}

.gwsOperabilityMapDottedBorder {
    border: 1px dashed #707070;
    border-radius: 4px;
    padding: 6px 4px;
    font-size: 10px;
    color: #FFF;
    text-align: center;
}

.accordion .ortsRows li span {
    color: #fff;
}

h1.noAfter {
    cursor: pointer;
}

h1.noAfter:after {
    content: none !important;
}

/* Settings Page */
.PanelContainer.Settings-PanelContainer {
    overflow: auto !important;
}

/* User Manangement */
.PanelBody-Wrapper.PanelBody-User-Account {
    flex-grow: 0;
    overflow-y: unset !important;
}

.Settings-PanelContainer>.NavigationBar {
    padding: 0 15px !important;
}

.Settings-PanelContainer>.NavigationBar>.NavigationDropdown {
    padding: 0 !important;
}

.PanelBody-Summary-Users {
    padding: 0 8px 8px;
    overflow-y: unset !important;
}

.PanelContainer .PanelBody-Summary-Users>.PanelBody {
    display: flex !important;
}

.PanelContainer .PanelBody-User-Account>.PanelBody {
    display: flex !important;
}

/* Summary of Users under Settings */
.FilterButton-Rows {
    padding: 9px;
}

.User-Summary-filter-buttons {
    margin-right: 9px;
    margin-bottom: 9px;
}

.Filters-Tooltip {
    height: 20px;
    width: 20px;
    float: right;
    margin: 10px 1vw 0 0;
}

.User-Summary-Section {
    background: #191919;
}

.User-Summary-Filter-TextBox {
    display: flex;
}

.User-Summary-TextBox {
    display: inline-block;
    width: 21rem;
}

.User-Summary-Select {
    display: inline-block;
    width: 8.5rem;
}

.User-Summary-Select .react-select__placeholder {
    color: #fff !important;
}

.PanelBody-User-Account .react-select__menu {
    z-index: 2 !important;
}

.User-Summary-Label {
    padding-top: 7px;
    padding-right: 5px;
    padding-left: 10px;
}

.Account-Status {
    margin-top: 10px;
    border-top: 1px solid #707070;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: rgb(112, 112, 112);
}

.Account-Status-Rows .Details-icon {
    padding: 6px 0 6px 1rem !important;
}

.strikeout {
    text-decoration: line-through;
    color: #707070 !important; 
}
/* ERDDS/Baseline differences */
.noGraph {
    font: 10px bold;
    color: #bbb;
    text-align: center;
    font-family: sans-serif;
    padding: 130px 0;
}

.noData {
    text-align: center;
    padding-top: 250px;
}
/* Add New Account/Create User  */
.user-information-grid {
    display: grid;
    grid-template-columns: 80px 1fr min-content;
    row-gap: 10px;
    align-items: center;
}

.user-confirmation-grid {
    display: grid;
    grid-template-columns: 120px 1fr;
    row-gap: 10px;
    align-items: center;
}

.header-text {
    font-size: 16px;
    font-weight: bold;
}

.password-requirements-list {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: minmax(45px, max-content) max-content;
    grid-gap: 10px;
    justify-items: start;
}

/* Generic name for list items under  */
.User-Management-list-item {
    list-style-type: disc;
    margin: 0;
    padding-left: 1.2em;
}

.User-Management-list-item li strong {
    font-weight: bold;
}

.delete-account .react-select__value-container {
    overflow: unset !important;
}

/* Determines padding, based on Add New Account form state 'Confrim,' 'Next,' and 'Acknowledge' */
.Administrative-Controls-Table .add-account-action-status-confirm {
    padding-left: 18px;
}

.Administrative-Controls-Table .add-account-action-status-next {
    padding-left: 26px;
}

.Administrative-Controls-Table .add-account-action-status-acknowledge {
    padding-left: 3px;
}