body, header, footer, section, h1, h2, h3, h4, h5, p, ul, ol, li, menu, menuitem {
    margin: 0;
    border: none;
    padding: 0;
}

h1, h2, h3, h4, h5 {
    font-family: inherit;
    font-weight: inherit;
    font-weight: inherit;
    text-decoration: inherit;
    font-style: inherit;
    font-size: inherit;
    line-height: inherit;
}

/* base page style */

body {
    background: white;
    font: 12px/16px "Segoe UI", "Tahoma", "Arial", "Helvetica", sans-serif;
    color: black;
}

a, a:hover, a:visited {
    color: #157f8d;
    text-decoration: none;
}

    a:hover {
        color: #0b434a;
    }

/*
::-webkit-scrollbar { margin: 4px; width: 8px; height: 8px; background: rgb(46, 51, 56); border-radius: 4px; }
::-webkit-scrollbar-thumb { background: rgb(86,93,113); border-radius: 4px; }
::-webkit-scrollbar-button { display: none; }
*/
.view {
    position: relative;
    flex: 0 0 auto;
}

.view:focus {
    outline: none;
}

.vbox {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.hbox {
    display: flex;
    flex-direction: row;
}

.expanding {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
}

.hidden {
    display: none !important;
}

.drag-handle
{
    cursor: pointer;
}

.dragging
{
    cursor: move !important;
}
.modallayer {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1000000;
}

.modallayer.shaded {
    background: rgba(0, 0, 0, 0.4);
}
.button {
    display: flex;
    flex-direction: row;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    color: black;
    border: 1px solid var(--controlbordercolor);
    padding: 3px 10px;
    background: rgb(233,233,233);
    text-align: center;
    font: inherit;
}

    .button[disabled] {
        color: darkgray;
        cursor: default;
    }

    .button:focus {
        border: 1px solid var(--controlfocuscolor);
        outline: none;
    }

    .button > .imagebox {
        width: 24px;
        height: 24px;
        padding-right: 4px;
    }
.borderlayout-vbox {
    position: absolute;
    width: 100%;
    height: 100%;
}

.borderlayoutsplitter {
    cursor: ew-resize;
    background: var(--panelcolor);
    width: 5px;
}

.vborderlayoutsplitter {
    cursor: ns-resize;
    background: var(--panelcolor);
    height: 5px;
}
.checkbox {
    -webkit-appearance: none;
    appearance: none;
    display: inline-block;
    background: none; /* resets gradient background on safari */
    background-image: var(--checkbox-image-unchecked);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0;
    border: none;
    padding: 0;
    width: 20px;
    height: 22px;
    vertical-align: -2px;
    align-self: baseline;
}

.checkbox:focus {
    filter: drop-shadow(0px 0px 2px var(--controlfocuscolor));
    background-image: var(--checkbox-image-unchecked); /* TODO: we need new graphics showing the focus rect with the icon. this will void need for filter effect */
}

.checkbox:checked:focus {
    filter: drop-shadow(0px 0px 2px var(--controlfocuscolor));
    background-image: var(--checkbox-image-checked); /* TODO: we need new graphics showing the focus rect with the icon. this will void need for filter effect */
}

.checkbox:checked {
    background-image: var(--checkbox-image-checked);
}

.checkbox:disabled:checked {
    filter: grayscale(100%);
}

.checkbox:disabled {
    filter: grayscale(100%);
}
.checkboxlabel {
    line-height: 22px;
    user-select: none;
}

.checkboxlabel .checkbox {
    margin-right: 2px;
}
.combobox {
    border: 1px solid var(--controlbordercolor);
    padding: 2px 20px 2px 4px;
    background: white;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    color: black;
    border-radius: 0px;
    height: calc(22px - 4px - 2px); /* same as lineedit minus padding minus double border */
    user-select: none;
    background-image: url("/lasernet/Resources/Icons/arrow-down.svg");
    background-position: right 5px center;
    background-repeat: no-repeat;
    background-size: 16px;
}

.combobox:focus, .combobox.focus {
    border: 1px solid var(--controlfocuscolor);
    outline: none;
}

.combobox.disabled {
    background: var(--controldisabledcolor);
    background-image: url("/lasernet/Resources/Icons/arrow-down.svg");
    background-position: right 5px center;
    background-repeat: no-repeat;
    background-size: 16px;
    filter: grayscale();
    color: rgb(80,80,80);
}

.combobox[disabled] {
    color: rgb(80,80,80);
}

.combobox-icon {
    position: absolute;
    padding-top: 1px;
    padding-right: 4px;
    width: 14px;
    height: 14px;
}

.combobox-label {
    overflow: hidden;
}

.combobox-label:before {
    content: "\A0"; /* to ensure baseline with label and text in combobox */
}

.combobox-label-hasicon {
    padding-left: calc(14px + 4px);
}

.comboboxpopup {
    color: black;
    position: absolute;
    left: -1px;
    top: calc(22px - 2px);
    width: 100%;
    background: white;
    border: 1px solid var(--controlfocuscolor);
    box-shadow: 2px 2px 2px rgba(0,0,0,0.3);
    z-index: 1000;
    overflow-y: auto;
    user-select: none;
}

.comboboxpopupitem {
    padding: 0 35px 1px 8px;
}

.comboboxpopup-itemselected {
    background-color: var(--selectedcolor);
    color: white;
}

.comboboxpopupitem-icon.imagebox {
    padding: 4px 12px 0 2px;
    width: 14px;
    height: 14px;
}

.comboboxpopupitem-text.textlabel {
    line-height: 20px;
    white-space: pre;
}

.comboboxpopupitem-text.textlabel:before {
    content: "\A0"; /* to ensure baseline with label and text in combobox */
}

.comboboxpopupitemseparator {
    border-top: 1px solid var(--menuitemseparator);
    height: 1px;
    margin: 3px 5px 3px 32px;
}
.datetimeedit {
    width: 164px;
    display: block;
    border: 1px solid var(--controlbordercolor);
    padding: 2px 4px;
    font: 12px/16px "Consolas", "Courier New", monospace;
    color: black;
}
.imagebox {
    display: block;
}
.lineedit {
    border: 1px solid var(--controlbordercolor);
    padding: 2px 4px;
    padding-right: 0px;
    background: white;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    color: black;
}

    .lineedit.focus {
        border: 1px solid var(--controlfocuscolor);
    }

    .lineedit.disabled {
        background: var(--controldisabledcolor);
    }

    .lineedit input[disabled] {
        color: rgb(80,80,80);
        background: inherit;
    }

    .lineedit input {
        display: block;
        border: none;
        padding: 0;
        margin: 0;
        background: inherit;
        font: inherit;
        color: inherit;
    }

        .lineedit input:focus {
            outline: none;
        }

.lineedit-imagebox {
    width: 16px;
    height: 16px;
    padding-top: 2px;
    padding-left: 2px;
    padding-right: 2px;
    padding-bottom: 2px;
    margin-top: -2px;
    margin-bottom: -2px;
}

.lineedit-imagebox:hover {
    background-color: var(--lineeditbuttonhover);
}

.lineedit.flat {
    background: transparent;
    border: none;
    padding: 0;
}
.listview {
    flex: 1 1 0;
    background: white;
}

.listview-headersplitter {
    cursor: ew-resize;
    justify-content: center;
}

.listview-headersplitter > .view {
    border-left: 1px solid var(--listviewheadersplitter);
    width: 1px;
}

.listviewheader {
    background: var(--panelcolor);
    padding: 0 5px;
    font-weight: bold;
    line-height: 24px;
    overflow: scroll;
    scrollbar-width: none;
}

    .listviewheader.sizingmode {
        cursor: ew-resize;
    }

.listviewbody {
    overflow: auto;
    outline: none;
}

.listviewheadline {
    font-weight: bold;
}

.listviewitem {
    line-height: 24px;
    padding: 0 5px;
    user-select: none;
}

    .listviewitem > * {
        overflow: hidden;
    }

.listviewitem.focused {
    outline: 1px dotted var(--listviewitemoutline);
    outline-offset: -1px;
}

.listviewbody.alternate .listviewitem:nth-child(even) {
    background: var(--alternaterowcolor);
}

.listviewbody.alternate .listviewitem:hover {
    background: var(--listviewitemhover);
}

.listviewitem:hover {
    background: var(--listviewitemhover);
}

.listviewitem.selected,
.listviewbody.alternate .listviewitem.selected {
    background: var(--listviewitemselected);
}

.listview.focused .listviewitem.selected,
.listview.focused .listviewbody.alternate .listviewitem.selected {
    background: var(--listviewfocuseditemselected);
}

.listviewitemicon {
    width: 16px;
    height: 16px;
    padding-right: 4px;
    align-self: start;
    padding-top: 4px;
}
.radiobutton {
    -webkit-appearance: none;
    appearance: none;
    display: inline-block;
    background: none; /* resets gradient background on safari */
    background-image: var(--radiobutton-image-unchecked);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0;
    border: none;
    padding: 0;
    width: 20px;
    height: 22px;
    vertical-align: -2px;
    align-self: baseline;
}

.radiobutton:checked {
    background-image: var(--radiobutton-image-checked);
}

.radiobutton:disabled:checked {
    filter: grayscale(100%);
}

.radiobutton:disabled {
    filter: grayscale(100%);
}
.radiobuttonlabel {
    line-height: 22px;
    user-select: none;
}

.radiobuttonlabel .radiobutton {
    margin-right: 2px;
}
.spinbox {
    border: 1px solid var(--controlbordercolor);
    padding: 2px 4px;
    padding-right: 0px;
    background: white;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    color: black;
}

    .spinbox.focus {
        border: 1px solid var(--controlfocuscolor);
    }

    .spinbox.disabled {
        background: var(--controldisabledcolor);
    }

    .spinbox input[disabled] {
        color: rgb(80,80,80);
        background: inherit;
    }

    .spinbox input {
        display: block;
        border: none;
        padding: 0;
        margin: 0;
        background: inherit;
    }
.lds-grid {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-grid div {
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: white;
    animation: lds-grid 1.2s linear infinite;
}

.lds-grid div:nth-child(1) {
    top: 8px;
    left: 8px;
    animation-delay: 0s;
}

.lds-grid div:nth-child(2) {
    top: 8px;
    left: 32px;
    animation-delay: -0.4s;
}

.lds-grid div:nth-child(3) {
    top: 8px;
    left: 56px;
    animation-delay: -0.8s;
}

.lds-grid div:nth-child(4) {
    top: 32px;
    left: 8px;
    animation-delay: -0.4s;
}

.lds-grid div:nth-child(5) {
    top: 32px;
    left: 32px;
    animation-delay: -0.8s;
}

.lds-grid div:nth-child(6) {
    top: 32px;
    left: 56px;
    animation-delay: -1.2s;
}

.lds-grid div:nth-child(7) {
    top: 56px;
    left: 8px;
    animation-delay: -0.8s;
}

.lds-grid div:nth-child(8) {
    top: 56px;
    left: 32px;
    animation-delay: -1.2s;
}

.lds-grid div:nth-child(9) {
    top: 56px;
    left: 56px;
    animation-delay: -1.6s;
}

@keyframes lds-grid {

    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.spinner-container {
    position: fixed;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.spinner-message {
    font-size: 18px;
    font-weight: 600;
}

.spinner-subtext {
    padding: 10px 0 25px 0;
}
.svgbox {
    display: block;
}
.tabbartab {
    padding: 6px 15px;
    cursor: default;
    border: 1px solid transparent;
    border-bottom: none;
    margin-bottom: -1px;
    z-index: 1;
}

.tabbartab-icon {
    width: 20px;
    height: 20px;
    padding-right: 4px;
}

.tabbartab-label {
    line-height: 20px;
}

.tabbartab.selected {
    background: white;
    border-color: var(--tabbarselected);
}

.tabcontrol {
    flex: 1 1 auto;
}

.tabcontrol-widgetstack {
    background: white;
    border: 1px solid var(--tabcontrolbordercolor);
}
.textarea {
    border: 1px solid var(--controlbordercolor);
    padding: 2px 4px;
    padding-right: 0px;
    background: white;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    color: black;
}

.textarea.focus {
    border: 1px solid var(--controlfocuscolor);
}

.textarea.disabled {
    background: var(--controldisabledcolor);
}

.textarea textarea[disabled] {
    color: rgb(80,80,80);
    background: inherit;
}

.textarea textarea {
    display: block;
    border: none;
    padding: 0;
    margin: 0;
    background: inherit;
    resize: none;
    color: inherit;
}

.textarea textarea:focus {
    outline: none;
}
.textlabel {
    overflow: hidden;
}
.small {
    height: 32px;
    width: 32px;
}

.medium {
    height: 64px;
    width: 64px;
}

.wide {
    height: 64px;
    width: 128px;
}

.large {
    height: 128px;
    width: 128px;
}

.smallWithLabel {
    height: 16px;
    width: 32px;
}

.mediumWithLabel {
    height: 48px;
    width: 64px;
}

.wideWithLabel {
    height: 48px;
    width: 128px;
}

.largeWithLabel {
    height: 112px;
    width: 128px;
}

.tile {
    margin: 4px;
    padding: 8px;
    cursor: pointer;
}

.tile:hover {
    opacity: 0.75;
}
.scrollbar {
    background: var(--panelcolor);
}

.scrollbar-corner {
    background: var(--panelcolor);
    width: 16px;
    height: 16px;
}

.scrollbar-vert {
    width: 16px;
}

.scrollbar-horz {
    height: 16px;
}

.scrollbar-vert .scrollbar-button-decr {
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(167,167,167)"><polygon points="8,5 3,10 13,10"/></svg>') center;
}

    .scrollbar-vert .scrollbar-button-decr:hover {
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(147,147,147)"><polygon points="8,5 3,10 13,10"/></svg>') center;
    }

.scrollbar-vert .scrollbar-button-incr {
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(167,167,167)"><polygon points="8,11 3,6 13,6"/></svg>') center;
}

    .scrollbar-vert .scrollbar-button-incr:hover {
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(147,147,147)"><polygon points="8,11 3,6 13,6"/></svg>') center;
    }

.scrollbar-horz .scrollbar-button-decr {
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(167,167,167)"><polygon points="5,8 10,3 10,13"/></svg>') center;
}

    .scrollbar-horz .scrollbar-button-decr:hover {
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(147,147,147)"><polygon points="5,8 10,3 10,13"/></svg>') center;
    }

.scrollbar-horz .scrollbar-button-incr {
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(167,167,167)"><polygon points="11,8 6,3 6,13"/></svg>') center;
}

    .scrollbar-horz .scrollbar-button-incr:hover {
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(147,147,147)"><polygon points="11,8 6,3 6,13"/></svg>') center;
    }

.scrollbar-vert .scrollbar-track {
    width: 16px;
}

.scrollbar-horz .scrollbar-track {
    height: 16px;
}

.scrollbar-thumb {
    background: rgb(197,197,197);
}

    .scrollbar-thumb:hover {
        background: rgb(167,167,167);
    }

    .scrollbar-vert .scrollbar-thumb {
        left: 4px;
        right: 4px;
        top: 0;
        bottom: 0;
    }

.scrollbar-horz .scrollbar-thumb {
    top: 4px;
    bottom: 4px;
    left: 0;
    right: 0;
}

.uses-scrollbar {
    scrollbar-width: none;
    overflow: scroll;
}
.appmenu {
    position: fixed;
    left: 0;
    top: 0;
    width: 320px;
    height: 100vh;
    background: var(--appmenubackground);
    box-shadow: rgba(0, 0, 0, 0.22) 0px 25.6px 57.6px 0px, rgba(0, 0, 0, 0.18) 0px 4.8px 14.4px 0px;
}

.appmenu-menubutton {
    width: 24px;
    height: 24px;
    padding: 12px;
    cursor: pointer;
}

    .appmenu-menubutton:hover {
        background: var(--appmenubuttonhighlight);
    }

.appmenu-title {
    font-weight: 600;
    padding: 10px;
    font-size: 16px;
}

.appmenu-itemlist {
    padding: 5px 10px;
}

.appmenuitem {
    cursor: pointer;
    width: 131px;
    padding: 5px;
    margin-right: 5px;
}

.appmenuitem-icon {
    width: 32px;
    height: 32px;
}

.appmenuitem-text {
    padding-left: 4px;
    line-height: 32px;
}

.appmenuitem:hover {
    background: var(--appmenuitemhighlight);
}
.dialog {
    position: fixed;
    background: var(--panelcolor);
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
}

.dialogheader {
    background: var(--headercolor);
    color: white;
    line-height: 30px;
    height: 30px;
}

.dialogheader-caption.textlabel {
    padding-left: 40px;
    text-align: center;
}

.dialogheaderbutton {
    width: 12px;
    height: 12px;
    padding: 9px 14px;
}

.dialogheader-closebutton.dialogheaderbutton:hover {
    background: red;
}

.dialog-centerview {
}
.dialogbuttonbar {
    padding: 10px;
}

.dialogbuttonbar-button.dialogbutton {
    margin-left: 5px;
}

.dialogbuttonbar-sep {
    width: 5px;
}

.dialogbuttonbar-spacer {
    flex: 1 1 0;
}

.dialogbutton {
    color: black;
    border: 1px solid var(--controlbordercolor);
    padding: 3px 10px;
    background: rgb(233,233,233);
    text-align: center;
    font: inherit;
}

    .dialogbutton:focus {
        border: 1px solid var(--controlfocuscolor);
        outline: none;
    }

    .dialogbutton:hover {
        background: var(--panelcolor);
    }

    .dialogbutton[disabled] {
        opacity: 0.5;
        filter: grayscale();
        cursor: default;
    }

        .dialogbutton[disabled]:hover {
            background: rgb(233,233,233);
        }

.dialogbuttonbar.flat .dialogbutton {
    border-color: transparent;
    background: none;
}

    .dialogbuttonbar.flat .dialogbutton:hover {
        background: rgb(221,233,249);
    }
.dockheader {
    background: var(--panelcolor);
    color: black;
    line-height: 24px;
    height: 24px;
}

.dockheader-caption.textlabel {
    padding-left: 7px;
}

.dockheaderbutton {
    width: 12px;
    height: 12px;
    margin: 2px 3px;
    padding: 4px;
}

.dockheader-closebutton.dockheaderbutton:hover {
    background: rgb(200, 200, 200);
}
.messagebox > .dialog-centerview {
    padding: 15px 15px 45px 15px;
    border-bottom: 1px solid var(--paneledgecolor);
    background: white;
}
.websiteheader {
    background: var(--headercolor);
    color: white;
    line-height: 48px;
    height: 48px;
}

.websiteheader-caption.textlabel {
    font-weight: 600;
    padding-left: 5px;
    font-size: 16px;
}

.websiteheader-menubutton {
    width: 24px;
    height: 24px;
    padding: 12px;
    cursor: pointer;
}

    .websiteheader-menubutton:hover {
        background: var(--headermenubuttonhighlight);
    }

.websiteheader-accountmenu {
    cursor: pointer;
    padding: 0 15px;
    line-height: 48px;
}

    .websiteheader-accountmenu:hover {
        background: var(--headermenubuttonhighlight);
    }
.windowheader {
    background: var(--headercolor);
    color: white;
    line-height: 30px;
    height: 30px;
}

.windowheader-caption.textlabel {
    padding-left: 40px;
    text-align: center;
    -webkit-app-region: drag;
}

.windowheader-minbutton.dialogheaderbutton:hover {
    background: var(--dialogheaderbuttonhighlight);
}

.windowheader-maxbutton.dialogheaderbutton:hover {
    background: var(--dialogheaderbuttonhighlight);
}

.windowheader-closebutton.dialogheaderbutton:hover {
    background: var(--dialogclosebuttonhighlight);
}
.menu {
    position: fixed;
    background: var(--panelcolor);
    color: black;
    border: 1px solid var(--menubordercolor);
    box-shadow: 2px 2px 2px rgba(0,0,0,0.3);
}

.menuitem {
    padding: 0 35px 1px 8px;
}

.menuitem-icon.imagebox {
    padding: 4px 12px 0 2px;
    width: 16px;
    height: 16px;
}

.menuitem-text.textlabel {
    line-height: 22px;
    white-space: pre;
}

.menuitemseparator {
    border-top: 1px solid var(--menuitemseparator);
    height: 1px;
    margin: 3px 5px 3px 32px;
}
.menubar, .menubarmodal {
    background: var(--headercolor);
    color: white;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    line-height: 30px;
}

.menubarmodal {
    cursor: default;
}

.menubar-spacer, .menubarmodal-spacer {
    flex: 1 1 0;
}

.menubaritem, .menubarmodalitem {
    position: relative;
    margin: 3px 0;
    border: 1px solid transparent;
    padding: 0 9px;
    line-height: 24px;
}
.statusbaritem {
    margin: 0 5px;
}

.statusbaritem-icon {
    width: 16px;
    height: 16px;
    align-self: center;
    margin-right: 4px;
}
.toolbarbutton {
    padding-right: 5px;
    margin-right: 5px;
    user-select: none;
}

    .toolbarbutton.disabled {
        opacity: 0.5;
        filter: grayscale();
    }

    .toolbarbutton:hover {
        background: var(--toolbarbuttonhover);
    }

    .toolbarbutton.disabled:hover {
        background: none;
    }

.toolbarbutton-icon.imagebox {
    padding: 3px 4px 3px 5px;
    width: 24px;
    height: 24px;
}

.toolbarseparator {
    border-right: 1px solid var(--toolbarseparatorcolor);
    width: 1px;
    height: 24px;
    margin: 3px 5px;
}

.toolbardropdown {
    margin-right: 5px;
}

.toolbardropdown-combobox {
    align-self: center;
    margin-left: 5px;
    border: 1px solid var(--controlbordercolor);
    color: black;
    width: 150px;
}

.toolbartextinput {
    margin: 0 6px 0 10px;
}

.toolbartextinput-edit {
    align-self: center;
    margin-left: 5px;
    margin-bottom: 4px;
    background: white;
    border: 1px solid var(--controlbordercolor);
    color: black;
    line-height: 16px;
    width: 200px;
}

.toolbar {
    padding: 5px 5px 5px 10px;
    line-height: 30px;
    align-items: center;
}

.toolbar-view {
    margin-right: 5px;
}
.vtoolbarbutton {
    width: 65px;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 3px;
    margin-bottom: 7px;
}

.vtoolbarbutton-icon.imagebox {
    width: 24px;
    height: 24px;
    align-self: center;
}

.vtoolbarbutton-text.textlabel {
    text-align: center;
    line-height: 14px;
}
@import "MainWindow/VToolbar.css";
:root {
    --panelcolor: rgb(240,240,240);
    --paneledgecolor: rgb(228,228,228);
    --headercolor: rgb(10,37,62);
    --startupheadercolor: white;
    --controlbordercolor: rgb(200,200,200);
    --dialogheaderbuttonhighlight: rgb(89,134,247);
    --dialogclosebuttonhighlight: red;
    --headermenubuttonhighlight: rgb(23,107,209);
    --menubordercolor: rgb(111,111,111);
    --selectedcolor: rgb(23,107,209);
    --appmenubackground: white;
    --appmenubuttonhighlight: rgb(221,233,249);
    --appmenuitemhighlight: rgb(221,233,249);
    --alternaterowcolor: rgb(250,250,250);
    --listviewheadersplitter: rgb(220,220,220);
    --listviewitemhover: rgb(229,243,255);
    --listviewitemselected: rgb(227,227,227);
    --listviewfocuseditemselected: rgb(204,232,255);
    --listviewitemoutline: rgb(153,209,255);
    --propertypagetabiconhover: rgb(221,233,249);
    --propertypagetabiconselectedhover: rgb(149,187,234);
    --hovertransition: background-color 50ms linear;
    --tabbarselected: rgb(197,197,197);
    --toolbarseparatorcolor: rgb(171,171,171);
    --toolbarbuttonhover: rgb(221,233,249);
    --tabcontrolbordercolor: rgb(197,197,197);
    --menuitemseparator: rgb(171,171,171);
    --controlfocuscolor: rgb(23,107,209);
    --controldisabledcolor: rgb(240,240,240);
    --lineeditbuttonhover: rgb(191,224,255);
    --warningcolor: rgb(255, 193, 7);
    --checkbox-image-unchecked: url("/lasernet/Resources/Icons/checkbox-unchecked.svg");
    --checkbox-image-checked: url("/lasernet/Resources/Icons/checkbox-checked.svg");
    --radiobutton-image-unchecked: url("/lasernet/Resources/Icons/radiobutton-unchecked.svg");
    --radiobutton-image-checked: url("/lasernet/Resources/Icons/radiobutton-checked.svg");
}
.appviewroot {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100vw;
    height: 100vh;
    background: var(--panelcolor);
    cursor: default;
    font: 12px/16px "Segoe UI", "Tahoma", sans-serif;
    color: black;
    overflow: hidden;
}
.errorpage {
    background: #7b7b7b;
}
.formbutton {
    padding: 3px;
    background: none;
    border-color: transparent;
}

.formbutton > .imagebox {
    width: 16px;
    height: 16px;
    padding-right: 4px;
}
.formgroupframe {
    border: 1px solid var(--controlbordercolor);
    padding: 5px;
}
.navpanel {
    padding: 5px 0;
    overflow-y: auto;
}

.navpanel-title {
    font-weight: bold;
    font-size: 16px;
    padding: 0 15px 5px 15px;
}

.navbutton {
    padding: 5px 10px;
    margin: 0 5px;
    cursor: pointer;
}

.navbutton-icon {
    line-height: 32px;
    height: 32px;
    padding-right: 5px;
}

.navbutton-text {
    line-height: 32px;
    vertical-align: middle;
}

.navbutton:hover {
    background: rgb(221,233,249);
}

.navbutton.selected {
    background: var(--selectedcolor);
    font-weight: bold;
    color: white;
}
.propertytabbar {
    background: var(--headercolor);
    color: white;
}

.propertytabbar-horizontal {
    padding: 5px 10px;
}

.propertytabbar-vertical {
    padding: 0px 6px;
}

.propertypagetab {
    cursor: pointer;
}

.propertypagetab-horizontal {
    padding-right: 5px;
}

.propertypagetab-vertical {
}

.propertypagetab-icon {
    height: 32px;
    align-self: center;
    padding: 3px;
    transition: var(--hovertransition);
}

.propertypagetab-icon:hover {
    background: var(--propertypagetabiconhover);
}

.propertypagetab-label {
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.propertypagetab-label-horizontal {
    padding-top: 5px;
}

.propertypagetab-label-vertical {
    padding-top: 2px;
}

.propertypagetab-sizinglabel {
    text-align: center;
    padding-top: 5px;
    font-weight: bold;
    visibility: hidden;
}

.propertypagetab-sizinglabel-horizontal {
}

.propertypagetab-sizinglabel-vertical {
    margin: auto;
}

.propertypagetab.selected .propertypagetab-icon {
    background: var(--selectedcolor);
}

.propertypagetab.selected .propertypagetab-label {
    font-weight: bold;
}

.propertypagetab.selected .propertypagetab-icon:hover {
    background: var(--propertypagetabiconselectedhover);
}

.propertysheet-widgetstack {
    padding: 11px;
    background: white;
    border-bottom: 1px solid rgb(228,228,228);
}
.startupwindow {
    position: fixed;
    background: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
}

.startupwindow-header {
    background: var(--startupheadercolor);
    color: white;
    padding: 11px;
    padding-left:32px;
    height: 102px;
}

.startupwindow-image {
    height: 102px;
}
.aboutdialog-image {
    width: 640px;
    height: 320px;
}

.aboutdialog-labelmessage {
    margin: 15px;
    text-align: center;
}
.appwindow-centerlayout2 {
    position: absolute;
    width: 100%;
    height: 100%;
}

.appwindow-centralwidgetscrollwrap {
    background: white;
    border-left: 1px solid rgb(197,197,197);
    border-top: 1px solid rgb(197,197,197);
}

.appwindow-centralwidget {
    overflow-y: auto;
}

.appwindow-navpanelscrollwrap {
    width: 250px;
    padding: 4px;
    background: var(--panelcolor);
    align-self: stretch;
}

.appwindow-navpanel {
    position: absolute;
    width: calc(100% - 8px);
    height: calc(100% - 38px);
    align-self: stretch;
}

.appwindow-statusbar {
    height: 26px;
    line-height: 26px;
    align-self: stretch;
}
.deploymentdialog > .dialog-centerview {
    margin: 15px;
}

.deploymentprogressdialog > .dialog-centerview {
    margin: 15px 15px 45px 15px;
}
.showclientsecretdialog {
    background: white;
}

.showclientsecretdialog > .dialog-centerview {
    margin: 15px;
}

.showclientsecretdialog > .dialog-centerview > .hbox {
    margin: 2px 0px;
    align-items: baseline;
}
.roleaddmemberdialog > .dialog-centerview {
    margin: 15px;
}
.rolememberlistpage-buttonbar {
    margin: 0 -5px;
    padding: 10px 0;
}
.jobinfodialog {
    background: white;
}

.jobinfodialog > .dialog-centerview {
    margin: 10px;
}

.jobinfodialog > .dialog-centerview > .hbox {
    margin: 2px 0px;
    align-items: baseline;
}
.serverjobinfospage-buttonbar {
    margin: 0 -5px;
    padding: 10px 0;
}
.groupaddmemberdialog > .dialog-centerview {
    margin: 15px;
}
.groupmemberlistpage-buttonbar {
    margin: 0 -5px;
    padding: 10px 0;
}
.monitorwindow-centerlayout2 {
    position: absolute;
    width: 100%;
    height: 100%;
}

.monitorwindow-centralwidgetscrollwrap {
}

.monitorwindow-centralwidget {
    overflow-y: auto;
}

.monitorwindow-statusbar {
    height: 26px;
    line-height: 26px;
    align-self: stretch;
}
.logpage-listview {
    border-top: 1px solid var(--controlbordercolor);
}

.findresults-listview {
    border-top: 1px solid var(--controlbordercolor);
}
.performancepage {
}

.performancepage-row {
    justify-content: center;
}

.performancechart {
    width: 300px;
    padding: 15px;
}

.performancechart-title {
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
}

.performancechart-description {
    text-align: center;
}

.performancechart-chart {
    width: 300px;
    height: 200px;
    border: 1px solid rgb(171,171,171);
}
.launcherwindow {
    background-color: rgb(67,88,106);
}

.launcherwindow-labelapplications {
    color: rgb(71,71,71);
    font-weight: 500;
    font-size: 24px;
    margin: 4px;
    line-height: 30px;
}
@import "Launcher/LauncherWindow.css";
