body.pushable {
    background: none;
}

/**
 * Set styling of code blocks.
 */
code {
    background-color: rgba(0, 150, 250, 0.1);
    border-radius: 3px;
    display: inline-block;
    font-family: "Monaco","Menlo","Ubuntu Mono","Consolas","source-code-pro",monospace;
    font-size: 0.875em;
    padding: 1px 6px;
    vertical-align: baseline;
}
code.red {
    background-color: rgba(250, 0, 0, 0.2);
}
code.green {
    background-color: rgba(0, 250, 0, 0.1);
}

.highlight {
    background-color: rgba(0, 180, 250, 0.15);
    border-radius: 3px;
    display: inline-block;
    padding: 1px;
    vertical-align: baseline;
}

/**
 * Remove top margin
 */
pre > code {
    margin-top: -1.4em;
}

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

/**
 * Set custom container margins.
 */
.ui.ui.ui.ui.page.container {
    flex: 1 1 auto;
    padding: 1em 1.22em;
    width: auto;
}

/**
 * Fix content offset for static sidebar.
 */
@media only screen and (min-width: 1400px) {
    .authed .ui.ui.ui.ui.page.container {
        margin-left: 260px;
        max-width: calc(100% - 260px);
    }
}



/**
 * Set content margins.
 */
.ui.content {
    margin-top: 1.5em;
}


/**
 * Add padded breadcrumb variant.
 */
.ui.padded.breadcrumb {
    margin: 0 1rem;
}

.toggle-sidebar.button {
    margin-right: 1em;
}

/**
 * Remove bottom margin from fields inside menu.
 */
.ui.menu .inline.fields {
    margin-bottom: 0;
}

/**
 * Remove right padding from last inline form field.
 */
.ui.form .inline.fields .field:last-of-type {
    padding-right: 0;
}

.ui.calendar .ui.table tr td.count:after {
    z-index: 2000;
    top: -.4em;
    right: 0;
    left: unset;
    white-space: nowrap;
    -webkit-transform: translateX(30%) !important;
    transform: translateX(30%) !important;
    opacity: .6;
    visibility: unset;

    padding: .1em .4em;
    margin: unset;

    background-color: #00b5ad;
    border-color: #00b5ad;
    color: #fff;
    font-size: .6em;
}
.ui.calendar .ui.table tr td.count:before {
    display: none;
}

/**
 * Add bottom margin for multi line labels
 */
.ui.label {
    margin-bottom: 0.2rem;
}

.ui.message .ui.label {
    color: inherit;
}
.ui.info.message .ui.label {
    border-left: 1px solid #a9d5de;
    border-bottom: 1px solid #a9d5de;
    background-color: rgba(149, 193, 202, .3);
}
.ui.warning.message .ui.label {
    border-left: 1px solid #c9ba9b;
    border-bottom: 1px solid #c9ba9b;
    background-color: rgba(181, 166, 135, .3);
}
.ui.positive.message .ui.label {
    border-left: 1px solid #a3c293;
    border-bottom: 1px solid #a3c293;
    background-color: rgba(143, 174, 127, .3);
}
.ui.negative.message .ui.label {
    border-left: 1px solid #e0b4b4;
    border-bottom: 1px solid #e0b4b4;
    background-color: rgba(204, 160, 160, .3);
}

/**
 * Remove min height from login menu.
 */
.ui.text.menu {
    min-height: 0;
}

/**
 * Remove margins from stackable menu.
 */
.ui.stackable.menu {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ui.statistics .statistic .label i.icon {
    margin-top: 2rem;
    margin-bottom: 0.8rem;
    font-size: 40px;
}
.ui.statistics .statistic .label i.tooltip.icon {
    font-size: 1rem;
    margin: inherit;
}

.ui.statistics .statistic .label .ui.padded.image {
    margin-top: 1.8rem;
    margin-bottom: 1rem;
    width: 40px;
}

/**
 * Display button as menu item.
 */
.ui.vertical.menu .button.item {
    width: 100%;
    border: none;
    font-weight: bold;
}
.ui.vertical.menu:not(.icon) .button.item {
    text-align: left;
}
.ui.vertical.menu .button.item:hover {
    background-color: rgba(0, 0, 0, 0.03) !important;
}
.ui.vertical.menu .button.item:before {
    display: none;
}

/**
 * Horizontally centered pagination menu.
 */
.ui.center.aligned.pagination {
    display: flex;
    justify-content: center;
}

/**
 * Wrap menu items if they doesn't fit in one row.
 */
.ui.wrapping.menu {
    flex-wrap: wrap;
}

.ui.wrapper .ui.segment {
    margin-top: 0;
}

.ui.button + .ui.wrapper {
    margin-top: 1rem;
}

/**
 * Center item horizontally inside menu
 */
.ui.menu .centered.item {
    margin-left: auto;
    margin-right: auto;
}
.ui.menu .centered.item:before {
    display: none;
}

/**
 * Fix basic label inside menu
 */
.ui.menu .item > .basic.label {
    position: relative;
    top: -4px;
    color: rgba(0, 0, 0, .87);
    background-color: #fff;
    border: none;
    box-shadow: 0 0 1px 0 #000;
}

@media only screen and (min-width: 768px) {
    /*.ui.segment .ui.wrapping.menu {
        margin-bottom: -10px;
    }*/

    .ui.wrapping.menu .item {
        margin-bottom: 10px;
    }
}


/**
 * Remove highlighted background of colored menu items.
 */
.ui.vertical.menu .clean.item {
    background: rgba(0, 0, 0, 0) !important;
}
.ui.vertical.menu .clean.item:hover {
    background: rgba(0, 0, 0, 0.03) !important;
}


/**
 * Define vertical menu item images.
 */
.ui.vertical.menu .item > img {
    float: right;
    height: 17px;
}
.ui.vertical.icon.menu .item > img {
    display: block;
    float: none;
    margin: 0 auto;
    opacity: 1;
}
.ui.labeled.icon.menu .item > img {
  display: block;
  font-size: 1.71429em !important;
  height: 1em;
  margin: 0 auto 0.5rem !important;
}

.ui.prime.image {
    width: 30px !important;
    display: inline-block;
    padding-left: 2px;
    margin-top: -10px;
    margin-bottom: -8px;
}

.ui.right.padded.image {
    padding-right: 1em;
}
.automation.card .ui.label > img {
    width: 30px !important;
}

.ui.main.header {
    margin-top: -1em;
    margin-bottom: 1.5em;
}
.ui.main.header > .image + .content {
    padding-left: 0;
    vertical-align: bottom;
}

/**
 * Define very huge header.
 */
.ui.very.huge.header {
    font-size: 4em;;
}

.ui.huge.header {
    margin-bottom: 2rem;
}

.ui.cards > .invalid.card {
    background-color: #db2828;
}
.personalization.card .ui.ribbon.label {
    margin-bottom: 0.8em;
}
.ui.loading.card {
    position: relative;
    cursor: default;
    pointer-events: none;
    text-shadow: none !important;
    transition: all 0s linear;
}
.ui.loading.card::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(255,255,255,.8);
    width: 100%;
    height: 100%;
    border-radius: .28571429rem;
    z-index: 100;
}
.ui.loading.card::after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    margin: -1.5em 0 0 -1.5em;
    width: 3em;
    height: 3em;
    animation: loader .6s infinite linear;
    border: .2em solid #767676;
    border-radius: 500rem;
    box-shadow: 0 0 0 1px transparent;
    visibility: visible;
    z-index: 101;
}

.ui.padded.card {
    padding: 0.5rem;
}

.ui.personalization.header {
    margin-top: 0.5em;
}

.ui.personalization.label {
    margin: 0.3em;
}

.ui.nowrap.floating.label {
    white-space: nowrap;
}

/**
 * Define right floated label variant.
 */
.ui.right.floated.label,
.ui.right.floated.labels {
    float: right;
}

.ui.left.floated.text {
    float: left;
}

.ui.basic.direction.segment {
    padding: 0;
    margin: 0 0 1em;
}
.ui.no-padding.segment {
    padding: 0;
}

/**
 * Define centered label variant.
 */
.ui.centered.label {
    margin-left: auto !important;
    margin-right: auto !important;
}

/**
 * Hide empty label.
 */
.ui.basic.label:empty {
    display: none;
}

.ui.condensed.grid > .row {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/**
 * Right floated dropdown.
 */
.ui.right.floated.dropdown {
    float: right;
}

.ui.small.dropdown {
    font-size: 0.7em;
}

/**
 * Improve vertical alignment of remove icon
 */
.ui.dropdown > .remove.icon {
    top: 30%;
}

/**
 * Fix icon size
 */
.ui.dropdown > .text > i.icon {
    font-size: inherit;
}


/**
 * Decrease font size of Manufacturer dropdown menu.
 */
.ui.manufacturer.dropdown .menu .item .circular.label {
    margin-top: -5px;
}


.ui.dropdown > .title {
    margin-left: 1em;
    font-weight: bold;
}

/**
 * Dropdown supporting wide items.
 */
.ui.selection.dropdown .menu > .item {
    white-space: nowrap !important;
}

/* remove bottom border from dropdown */
.ui.selection.dropdown.visible:after {
    background-color: #fff;
    bottom: -1px;
    content: "";
    display: block;
    height: 2px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 11;
}

/* add top border to dropdown menu */
.ui.selection.dropdown .menu {
    border-top: 1px solid rgba(39, 41, 43, 0.15) !important;
    border-top-right-radius: .28571429rem;
    width: auto;
}
.ui.active.selection.dropdown .menu {
    border-top-color: #96c8da !important;
}

/* padded dropdown */
.ui.right.padded.dropdown {
    padding-right: 2em;
}

/**
 * Filter popup
 */
.ui.filters.popup {
    width: auto;
    max-width: none;
}
.ui.filter.list {
    width: 160px;
}
.ui.filter.list .filter.row {
    margin-bottom: 0.5em;
    text-align: right;
    white-space: nowrap;
}

.filter.divider {
    padding: 1em 0.5em;
}

.filter.item {
    padding: 0.5em !important;
}
.filter.item > .filter.icon {
    display: table-cell;
    vertical-align: top;
}

.filter.date.title {
    padding-right: 1em;
}

.filter.date.separator {
    padding: 0 1em;
}


/**
 * Make search field fluid.
 */
.ui.search {
    width: 100%;
}

/**
 * Fix fluid dropdown inside inline form.
 */
.ui.form .inline.fields .field > .fluid.selection.dropdown {
    width: 100%;
}

/**
 * Fix width of search input inside dropdown menu inside inline form.
 */
.ui.form .ui.dropdown .menu > .input {
    width: auto;
}

/**
 * Make inline loader the same height as pagination menu and center animation vertically.
 */
.ui.inline.loader {
    height: 42px;
    top: 6px;
}

.ui.top.loader {
    top: 2.3em;
}

.ui.qr-code.modal {
    left: 310px;
    top: 240px;
    border: 1px solid #db2828;
}

.ui.almost.top.loader {
    top: 6em;
}

/**
 * Remove background & borders from basic sortable table headers.
 */
.ui.very.basic.sortable.table thead th:hover,
.ui.very.basic.sortable.table thead th.sorted {
    background: none;
}

.ui.very.basic.sortable.table thead th {
    border-left: none;
}

.editable .ui.input {
    margin: -6px;
}
.editable .ui.input input {
    padding: 0.4em;
}

/**
 * Add Table caption styles
 */
.ui.table caption {
    margin-bottom: 1rem;
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 2;
    text-align: left;
}

/**
 * Add Table footer styles
 */
.ui.table tfoot th {
    padding: .92857143em .78571429em;
    font-weight: 700;
    border-top: 2px solid rgba(34,36,38,.1);
}

/**
 * Fix missing pointer cursor on checkbox labals with 'for' attribute.
 * Issue: https://github.com/Semantic-Org/Semantic-UI/issues/3355
 */
.ui.checkbox input + label[for] {
    cursor: pointer;
    user-select: none;
    -moz-user-select: none;
}

/**
 * Labeled toggle checkbox variant.
 */
.ui.labeled.checkbox input.hidden {
    z-index: 3;
}
.toggle.label {
    cursor: pointer;
    display: inline-block;
    margin-right: 1em;
}
.ui.labeled.toggle.checkbox .box:hover::before,
.ui.labeled.toggle.checkbox label:hover::before {
    background-color: rgba(0, 0, 0, 0.05);
}

.ui.form .field > .description {
    margin-top: -5px;
    margin-bottom: 5px;
    opacity: 0.7;
    font-size: 0.85em;
}
.ui.form .field .info.text {
    opacity: 0.7;
    font-size: 0.85em;
}

/**
 * Small loading animation
 */
.ui.loading.form.menu:after {
    height: 2em;
    width: 2em;
    margin: -1em 0 0 -1em;
}

/**
 * File input styling.
 */
.ui.action.input input[type="file"] {
    display: none;
}

.ui.inline.form {
    width: 100%;
}

.ui.charts.form {
    height: 3.4em;
}

/**
 * Reset margin to align inline form input fields
 */
.ui.form .inline.field .prompt,
.ui.form .inline.fields .field .prompt {
    margin: 0;
}

.ui.date-picker.form {
    margin-bottom: 0.7em;
}

.ui.calendar.field input {
    cursor: pointer;
}


/**
 * Add margin to log viewer dropdown menus.
 */
.logViewer_file .ui.selection.dropdown {
    margin-left: .5em;
}

.dataTables_length .ui.selection.dropdown {
    margin-right: .5em;
}

/**
 * drag & drop upload form styling.
 */
.ui.upload.form {
    padding: 100px 20px;
    position: relative;

    text-align: center;
}
.ui.upload.form input[type="file"] {
    display: block;
    margin: 1em auto 2em;
}

/* drop zone */
.drop.zone,
.uploading.zone,
.success.zone,
.error.zone {
    display: none;
}
.drop.zone label {
    cursor: pointer;
    display: block;
    padding: 1em;
}
.drop.zone label:hover strong {
    color: #41a5f0;
}

/* drag & drop upload enabled */
.ui.dragndrop.upload.form {
    color: #2185d0;
    outline: 2px dashed currentColor;
    outline-offset: -1em;
    transition: background-color 0.15s linear 0s;
}
.ui.dragndrop.upload.form .drop.zone {
    display: inline;
    font-size: 1.25rem;
}

/* drag & drop upload active */
.ui.dragndrop.uploading.form .drop.zone {
    display: none;
}
.ui.dragndrop.uploading.form .uploading.zone {
    display: block;
}
.ui.dragndrop.success.form {
    padding: 50px 20px;
    color: #21ba45;
}
.ui.dragndrop.success.form .success.zone {
    display: block;
}
.ui.dragndrop.success.form .success.zone .ui.header {
    color: #21ba45;
}
.ui.dragndrop.success.form .drop.zone {
    display: none;
}

/* drag & drop upload disabled */
.ui.dragndrop.upload.form .no-dragndrop {
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 0.1px;
    z-index: -1;
}

.ui.accordion .compact.title {
    display: inline-block;
}

/* Fix wrong margin on 'right' named icons */
.ui.button > .arrow.right.icon,
.ui.button > .chevron.right.icon,
.ui.icon.label > .icon {
    margin: 0;
}

.ui.right.floated.icon {
    float: right;
}

.ui.tooltip.icon {
    cursor: pointer;
}

i.icons .large.corner.icon {
    bottom: -2px;
    right: -5px;
    font-size: 0.55em;
}

.ui.menu .item > i.icons {
    margin-right: 0.557143em;
}

.ui.icon.input > i.color.icon {
    opacity: 1;
}

.ui.circular.color.label {
    margin-right: 0.3em;
    vertical-align: middle;
}

.ui.filter.tag.label {
    margin-left: 2em;
}

.ui.inline.progress {
    margin-bottom: 0;
}

/* make headings floatable */
h1[class*="left floated"],
h2[class*="left floated"],
h3[class*="left floated"],
h4[class*="left floated"],
h5[class*="left floated"],
h6[class*="left floated"] {
    float: left;
}

h1[class*="right floated"],
h2[class*="right floated"],
h3[class*="right floated"],
h4[class*="right floated"],
h5[class*="right floated"],
h6[class*="right floated"] {
    float: right;
}

.red.text { color: #DB2828 !important; }
.orange.text { color: #F2711C !important; }
.yellow.text { color: #FBBD08 !important; }
.olive.text { color: #B5CC18 !important; }
.green.text { color: #21BA45 !important; }
.teal.text { color: #00B5AD !important; }
.blue.text { color: #2185D0 !important; }
.violet.text { color: #6435C9 !important; }
.purple.text { color: #A333C8 !important; }
.pink.text { color: #E03997 !important; }
.brown.text { color: #A5673F !important; }
.gray.text { color: #767676 !important; }
.black.text { color: #1B1C1D !important; }

.ui.strong.text {
    font-weight: 700;
}

.ui.muted.text {
     color: rgba(0, 0, 0, 0.4);
 }

.ui.padded.list .item {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.ui.definition.list .item .term,
.ui.definition.list .item .definition {
    float: left;
}
.ui.definition.list .item .term {
    min-width: 30%;
    font-weight: bold;
}

.relative {
    position: relative;
}

.dev.comment {
    margin: 0 0 1em;
}

.img.stats {
    width: 16px;
    height: 16px;
}

.template.open {
    box-shadow:
        #fff 0px 1px 0px 0px,
        #A333C8 0 0px 0 1px;
}
.template.details {
    box-shadow:
        #fff 0px -2px 0px 0px,
        #A333C8 0 0px 0 1px;
}

.payload-json {
    opacity: 0;
    position: absolute;
    z-index: -1;
}

.fc-time-grid .fc-slats td {
    height: 4rem !important;
}