﻿.red,
.field.error {
    color: red;
}

.smaller {
    font-size: smaller !important;
}

.larger {
    font-size: larger !important;
}

.smaller.label.meta {
    color: lightgray !important;
}

.lowercase {
    text-transform: lowercase !important;
}

.rendernavigation {
    margin: 0px 0 6px 0;
}

.renderbody {
    padding: 10px 20px 10px 20px;
}

.menu {
    z-index: 1;
}

.hidden.menu,
.mobile.borderless.menu,
.gps.hidden,
.hidden.chart,
.hidden.card,
.hidden.field,
.hidden.fields,
.hidden.clear.filter,
.dropdown.hidden,
.placeholder.hidden,
.button.apply.hidden,
.button.clear.hidden,
.button.hidden,
tr.hidden {
    display: none !important;
}

.highchart {
    width: 100%;
}

.wrapping.menu {
    flex-wrap: wrap;
}

.shaded.tabular.menu {
    background-color: rgba(0, 0, 0, 0.03) !important;
}

    .shaded.tabular.menu > .active {
        background-color: rgba(0, 0, 0, 0.06) !important;
    }

.ui.vertical.stripe {
    padding: 8em 0;
}

.top.fixed.menu .toc.item {
    display: none;
}

.ui.main.container {
    margin-top: 2em;
    min-height: 500px;
}

.ui.map.container {
    width: 100%;
}

.narrow.inline.fields {
    display: none !important;
}

.ui.sidebar {
    overflow: visible !important;
}

iframe.pdfviewer {
    height: 700px;
}

.ui.search > .results {
    overflow-y: auto !important;
    width: 175% !important;
    left: -25% !important;
}

.secondary.menu {
    cursor: pointer;
}

.ui.radio.checkbox > .label {
    padding-left: 1.75em;
}

section.ui.smartphone {
    display: none;
}

.tabletonly {
    display: none !important;
}

.desktoponly {
    display: initial !important;
}

@media only screen and (max-width: 1300px) {
    .ui.card > .content > .header {
        font-size: initial !important;
    }

    .pdf.ui.embed {
        height: 650px;
    }

    iframe.pdfviewer {
        height: 600px;
    }

    .ui.search > .results {
        left: -20% !important;
    }
}


@media only screen and (max-width: 1050px) {
    .ui.top.fixed.menu {
        display: none !important;
    }

    .ui.inverted.sidebar.menu,
    .mobile.borderless.menu {
        display: block !important;
    }

    .ui.main.container {
        margin-top: 1em;
    }

    .ui.labeled.icon.vertical.menu {
        display: none !important;
    }

    .narrow.inline.fields {
        display: block !important;
    }

    .pdf.ui.embed {
        height: 100% !important;
    }

    .stats.four.wide.column {
        width: 100% !important;
    }

    .pdf.twelve.wide.column {
        width: 100% !important;
    }

    .mobile {
        width: 100% !important;
    }

    iframe.pdfviewer {
        height: 350px !important;
    }

    .ui.search > .results {
        width: 125% !important;
        left: -20% !important;
    }

    .tabletonly {
        display: initial !important;
    }

    .desktoponly {
        display: none !important;
    }
}

@media only screen and (max-width: 414px) {
    section.ui.tablet {
        display: none !important;
    }

    section.ui.smartphone {
        display: block;
    }
}

@media only mobile and (max-width: 767px) {
    .column.mobile.aligned {
        text-align: left !important;
    }
}

@media (min-width:768px) {
    .column.mobile.aligned {
        text-align: right !important;
    }
}

@media (min-width: 1051px) {
    .ui.inverted.sidebar.menu,
    .ui.narrow.borderless.menu {
        display: none !important;
    }
    .renderbody {
        margin-top: 5em;
    }
}

html.ios {
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

    html.ios,
    html.ios body {
        height: initial !important;
    }

svg.tiny, img.tiny {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

svg.small, img.small {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}

svg.medium, img.medium {
    width: 32px;
    height: 32px;
    vertical-align: middle;
}

svg.large, img.large {
    width: 48px;
    height: 48px;
    vertical-align: middle;
}

svg.xlarge, img.xlarge {
    width: 64px;
    height: 64px;
    vertical-align: middle;
}

.svg.floated.right, img.floated.right {
    float: right;
}

object.svg.small {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}

svg.dimmed, img.dimmed, .opacity-50 {
    opacity: 0.5 !important;
}

.opacity-35 {
    opacity: 0.35 !important;
}

.field-svg > path.validation-error {
    font-weight: bolder;
    background: #fff6f6;
    border-color: #e0b4b4;
    color: #9f3a38;
    -webkit-appearance: none;
    box-shadow: none;
    text-align: left;
}

.svg > path.validation-summary-valid {
    display: none;
}

.svg > path.validation-summary-errors {
    border: 1px solid red !important;
    font-weight: bolder;
    background: #fff6f6;
    border-color: #e0b4b4;
    color: #9f3a38;
    -webkit-appearance: none;
    box-shadow: none;
    margin-bottom: 1em;
    text-align: left;
}

    .svg > path.validation-summary-errors > ul {
        margin: 4px 5px 5px 4px;
    }

ul.legend > li {
    display: flex;
    list-style: none;
    width: auto;
    float: right;
    margin: 2px 4px 2px 4px;
}

table.tight th {
    padding: 4px 5px 4px 5px !important;
}

table.tight td {
    padding: 3px 4px 3px 4px !important;
}

button.signoff {
    background: none !important;
    border: none;
    padding: 0 !important;
    color: #4183c4;
    cursor: pointer;
    font-family: inherit;
}

.overlay.icon {
    position: relative;
    display: block;
    font-size: 18px !important;
    width: 18px !important;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    opacity: 1 !important;
    z-index: 100 !important;
}

.overlay.bottom.icon {
    margin-top: -15px !important;
}

.overlay.right.icon {
    margin-left: 14px !important;
}

.overlay.top.icon {
    margin-top: -34px !important;
}

.overlay.centered.icon {
    margin-top: -25px !important;
    margin-left: 10px !important;
}

.ui.icon.header i.icons .corner.icon {
    font-size: 1.5em !important;
}

.tight.right.menu > .item {
    padding-left: 4px;
    padding-right: 4px;
}

    .tight.right.menu > .item > i.icon {
        margin: 0 0 0 0 !important;
    }

.borderless.button {
    border: 0;
    background: none;
}

.filter.secondary.pointing.menu > a {
    padding-left: 6px !important;
    padding-right: 6px !important;
    cursor: pointer;
}

.ui.dragdrop.label {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    vertical-align: top;
    white-space: normal;
    font-size: 1em;
    padding: 0.35714286em 0.78571429em;
    margin: 0.14285714rem 0.28571429rem 0.14285714rem 0;
    box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
}

.ui.form .required.field > .radio.checkbox:after {
    margin: -0.2em 0 0 0.2em;
    content: '' !important;
    color: #DB2828;
}

label.control.hidden {
    display: none;
}

.clickable.button {
    margin: 1px 1px 1px 1px;
}

.ui.half.segment {
    width: 50%;
}

address.hidden {
    display: none;
}

.ui.alert.message {
    margin: 0.25em 0.15em !important;
    padding: 0.25em 0.15em !important;
}

    .ui.alert.message > div {
        margin: 0.5em !important;
        padding: 0 !important;
    }

.ui.alert.hidden.segments {
    display: none !important;
}

.ui.internal.basic.segment {
    padding: 0 0 14px 14px;
}

h5.ui.sub.header {
    margin-top: 1em !important;
}

h6.ui.sub.header {
    margin-top: 0.5em !important;
    font-size: 0.75em !important;
    text-transform: none;
}

.alert.notification > .row {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

    .alert.notification > .row > .column {
        margin-top: 0.1rem !important;
        margin-bottom: 0.1rem !important;
    }

/* Inactive */
.ui.inactive.cards > .card, .ui.cards > .inactive.card, .ui.inactive.card {
    box-shadow: inset 5px 0 0 0 #767676, 0 1px 3px 0 #767676, 0 0 0 1px #f8f8f8;
}

    /* Inactive - Hover */
    .ui.inactive.cards > .card:hover, .ui.cards > .inactive.card:hover, .ui.inactive.card:hover {
        box-shadow: inset 5px 0 0 0 #767676, 0 1px 3px 0 #767676, 0 0 0 1px #767676;
    }

/* standard red color override */
.ui.red.cards > .card, .ui.cards > .red.card, .ui.red.card,
/* Refused inspections */
.ui.refusal.cards > .card, .ui.cards > .refusal.card, .ui.refusal.card,
/* Locked Entity, also display in red */
.ui.unknown.cards > .card, .ui.cards > .unknown.card, .ui.unknown.card,
/* Locked Entity, also display in red */
.ui.locked.cards > .card, .ui.cards > .locked.card, .ui.locked.card,
/* Error */
.ui.error.cards > card, .ui.cards > .error.card, .ui.error.cards > .card,
.ui.error.cards > .card:hover, .ui.cards > .error.card:hover, .ui.error.card:hover {
    box-shadow: inset 5px 0 0 0 red, 0 1px 3px 0 red, 0 0 0 1px red;
}

svg > path.error {
    fill: red;
}

i.error.icon {
    color: red !important;
}

/* Calibration missing dates */
/* Communication fields missing*/
.ui.cards > .missing.card, .ui.missing.card
/* Low Battery */
.ui.cards > .low.card, .ui.low.card {
    box-shadow: inset 5px 0 0 0 #9f3a38, 0 1px 3px 0 #9f3a38, 0 0 0 1px #9f3a38;
}

svg > path.missing,
svg > path.low {
    fill: #9f3a38;
}

i.missing.icon,
i.low.icon {
    color: #9f3a38 !important;
}

/* Calibration overdue or due today */
.ui.cards > .due.card, .ui.due.card
/* Connection: Not today*/
.ui.cards > .pending.card, .ui.pending.card,
/* High Battery */
.ui.cards > .high.card, .ui.high.card {
    box-shadow: inset 5px 0 0 0 orange, 0 1px 3px 0 orange, 0 0 0 1px orange;
}

svg > path.due,
svg > path.high,
svg > path.pending {
    fill: orange;
}

i.due.icon,
i.high.icon,
i.pending.icon {
    color: orange !important;
}

/* Warning */
.ui.warn.cards > .card, .ui.cards > .warn.card, .ui.warn.card,
/* Calibration Due within 15 days */
.ui.due15.cards > .card, .ui.cards > .due15.card, .ui.due15.card {
    box-shadow: inset 5px 0 0 0 #fbe008, 0 1px 3px 0 #fbe008, 0 0 0 1px #fbe008;
}

svg > path.warn,
svg > path.due15 {
    fill: #fbe008;
}

i.warn.icon,
i.due15.icon {
    color: #fbe008 !important;
}

/* Notice */
.ui.notice.cards > .card, .ui.cards > .notice.card, .ui.notice.card,
/* Calibration Due in 30 days*/
.ui.due30.cards > .card, .ui.cards > .due30.card, .ui.due30.card {
    box-shadow: inset 5px 0 0 0 darkcyan, 0 1px 3px 0 darkcyan, 0 0 0 1px darkcyan;
}

svg > path.notice {
    fill: darkcyan;
}

svg > path.due30 {
    fill: darkcyan;
}

i.notice.icon,
i.due30.icon {
    color: darkcyan !important;
}

/* Calibration Due within 60 days */
.ui.due60.cards > .card, .ui.cards > .due60.card, .ui.due60.card {
    box-shadow: inset 5px 0 0 0 #afc652, 0 1px 3px 0 #afc652, 0 0 0 1px #afc652;
}

svg > path.due60 {
    fill: #afc652;
}

i.due60.icon {
    color: #afc652 !important;
}

/* Calibration Due within 90 days */
.ui.due90.cards > .card, .ui.cards > .due90.card, .ui.due90.card {
    box-shadow: inset 5px 0 0 0 #97c25a, 0 1px 3px 0 #97c25a, 0 0 0 1px #97c25a;
}

svg > path.due90 {
    fill: #97c25a;
}

i.due90.icon {
    color: #97c25a !important;
}


/* Good Records */
.ui.good.cards > .card, .ui.cards > .good.card, .ui.good.card,
/* Calibration Pulse */
.ui.cal.cards > .card, .ui.cards > .cal.card, .ui.cal.card {
    box-shadow: inset 5px 0 0 0 #aaa7a7, 0 1px 3px 0 #aaa7a7, 0 0 0 1px #aaa7a7;
}

svg > path.good {
    fill: #aaa7a7;
}

i.good.icon {
    color: #aaa7a7 !important;
}

.ui.complete.cards > .card, .ui.cards > .complete.card, .ui.complete.card,
.ui.exterior.cards > .card, .ui.cards > .exterior.card, .ui.exterior.card,
.ui.interior.cards > .card, .ui.cards > .interior.card, .ui.interior.card,
/* Valid Event */
.ui.valid.cards > .card, .ui.cards > .valid.card, .ui.valid.card {
    box-shadow: inset 5px 0 0 0 #74d34f, 0 1px 3px 0 #74d34f, 0 0 0 1px #74d34f;
}

svg > path.valid {
    fill: #008000;
}

i.valid.icon {
    color: #008000;
}

.valid.color {
    color: #74d34f !important;
}

/* Unknown */
.ui.unknown.cards > .card, .ui.cards > .unknown.card, .ui.unknown.card {
    box-shadow: inset 5px 0 0 0 #353535, 0 1px 3px 0 #353535, 0 0 0 1px #353535;
}

svg > path.unknown {
    fill: #353535;
}

i.unknown.icon {
    color: #353535 !important;
}

/* Unknown */
.ui.yellow.cards:hover > .card, .ui.cards > .yellow.card:hover, .ui.yellow.card:hover,
.ui.yellow.cards > .card, .ui.cards > .yellow.card, .ui.yellow.card {
    box-shadow: inset 5px 0 0 0 #fbe008, 0 1px 1px 0 #fbe008, 0 0 0 1px #fbe008;
}

svg > path.yellow {
    fill: #fbe008;
}

i.yellow.icon {
    color: #fbe008 !important;
}


/* No Trigger */
.ui.notrigger.cards > .card, .ui.cards > .notrigger.card, .ui.notrigger.card {
    box-shadow: inset 5px 0 0 0 #edd387, 0 1px 3px 0 #edd387, 0 0 0 1px #edd387;
}

/* Deleted */
.ui.deleted.cards > .card, .ui.cards > .deleted.card, .ui.deleted.card {
    box-shadow: inset 5px 0 0 0 #000000, 0 1px 3px 0 #000000, 0 0 0 1px #000000;
}

svg > path.lightgrey {
    fill: #767676;
}

.notrigger.color {
    color: #edd387 !important;
}

/* Valid Event */
.valid.tr,
.active.row,
.valid.row {
    box-shadow: inset 5px 0 0 0 #74d34f;
    width:inherit !important;
}

.pending.row {
    box-shadow: inset 5px 0 0 0 hsl(60, 100%, 50%);
}

.inactive.row, .ui.inactive.segment {
    box-shadow: inset 5px 0 0 0 #767676;
}

.refusal.row {
    box-shadow: inset 5px 0 0 0 rgb(244, 111, 96);
}
.error.row {
    box-shadow: inset 5px 0 0 0 red;
}

.notice.row {
    box-shadow: inset 5px 0 0 0 darkcyan;
}

.deleted.row, .ui.deleted.segment {
    box-shadow: inset 5px 0 0 0 #000000;
}

/* Calibration Pulse */
.cal.row {
    box-shadow: inset 5px 0 0 0 #aaa7a7;
}

/* No Trigger */
.notrigger.row {
    box-shadow: inset 5px 0 0 0 #edd387;
}

.ui.filter.dropdown {
    padding: 5px;
    background: rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, 0.95);
}

div.ui.readonly {
    border: 1px solid rgba(34, 36, 38, 0.15);
    opacity: 0.45;
    pointer-events: none;
    font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
    margin: 0;
    outline: none;
    -webkit-appearance: none;
    line-height: 1.21428571em;
    padding: 0.67857143em 1em;
    font-size: 1em;
    background: #FFFFFF;
    color: rgba(0, 0, 0, 0.87);
    border-radius: 0.28571429rem;
    box-shadow: 0 0 0 0 transparent inset;
    -webkit-transition: color 0.1s ease, border-color 0.1s ease;
    transition: color 0.1s ease, border-color 0.1s ease;
}

a.button,
.action > a, button {
    margin: 2px !important;
}

.svg > path.validation.ui.fixed.sticky {
    margin-top: 2em;
}

.narrow.row, tr.narrow {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ui.grid > .small.navigation.row {
    padding: 1px 10px 1px 10px;
}

.navigation {
    background-color: rgba(0, 0, 0, 0.10);
    font-style: italic;
}

.nopendingsvg > path.validations {
    text-align: center !important;
    width: 100%;
    padding-top: 2.5em;
}

.hidden.nopendingsvg > path.validations {
    display: none;
}

.nopendingvalidations {
    text-align: center !important;
    width: 100%;
    padding-top: 2.5em;
}

.hidden.nopendingvalidations, canvas.hidden {
    display: none !important;
}

.ct-series-a-icon {
    color: #d70206 !important;
}

.ct-series-b-icon {
    color: #f05b4f !important;
}

.ct-series-c-icon {
    color: #f4c63d !important;
}

.card.label {
    margin: 0 0 0 0.15em !important;
    text-transform: none !important;
}

.undo.item > .content,
.undo.card > .content {
    text-decoration: line-through;
}

.clickable.card {
    cursor: pointer;
}

.maximum.channel {
    padding-top: 4px;
    padding-bottom: 4px;
}

    .maximum.channel.top {
        border-bottom: 1px solid lightgray;
        border-bottom-width: thin;
    }

    .maximum.channel > .value {
        font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
        font-size: 1.05em;
        font-weight: bolder;
        line-height: 1em;
        color: #1B1C1D;
        text-align: center;
    }

    .maximum.channel > .label {
        font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
        font-size: 0.9em;
        font-weight: bold;
        color: rgba(0, 0, 0, 0.87);
        text-align: center;
    }

    .maximum.channel > .value > .unit {
        font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
        font-size: 0.75em;
        font-weight: lighter;
        color: rgba(0, 0, 0, 0.87);
    }

.disabled.link {
    cursor: default;
    opacity: 0.45 !important;
    background-image: none !important;
    box-shadow: none !important;
    pointer-events: none !important;
}

.label {
    font-weight: bold;
}


/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fade-in {
    opacity: 0; /* make things invisible upon start */
    -webkit-animation: fadeIn ease-in 1; /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation: fadeIn ease-in 1;
    animation: fadeIn ease-in 1;
    -webkit-animation-fill-mode: forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    animation-duration: 2s;
}

    .fade-in.one {
        -webkit-animation-delay: 0.5s;
        -moz-animation-delay: 0.5s;
        animation-delay: 0.5s;
    }

    .fade-in.two {
        -webkit-animation-delay: 1s;
        -moz-animation-delay: 1s;
        animation-delay: 1s;
    }

    .fade-in.three {
        -webkit-animation-delay: 1.5s;
        -moz-animation-delay: 1.5s;
        animation-delay: 1.5s;
    }

    .fade-in.four {
        -webkit-animation-delay: 3s;
        -moz-animation-delay: 3s;
        animation-delay: 3s;
    }

a.right.clear.filter {
    float: right !important;
    cursor: pointer !important;
    margin-right: 0 !important;
}

.ui.topofpage {
    height: 40px;
    position: fixed;
    bottom: 0;
    opacity: 1;
    width: 100%;
    z-index: 999;
}

.ui.gotomap {
    position: fixed;
    right: 15px;
    opacity: 1;
    z-index: 999;
    top: 10px;
}

    .ui.topofpage.hidden, .ui.gotomap.hidden {
        display: none;
    }

.ui.active.dimmer.chart.fluid.card {
    background-color: rgba(0, 0, 0, 0.60);
}

.compact.row.stretched {
    margin: 0 1rem;
}

    .compact.row.stretched .column {
        padding: 0 1px 0 1px;
    }

.map.marker.legend {
    margin: 10px;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.80);
    border: 1px solid black;
}

    .map.marker.legend > h5.on {
        margin-bottom: 0.5em;
    }

    .map.marker.legend > h5.off {
        margin-bottom: 0em;
    }

    .map.marker.legend.dark {
        margin: 10px;
        padding: 10px;
        background-color: rgba(255, 255, 255, 0.75);
        border: 1px solid black;
    }

.map.menu {
    background-color: rgba(255, 255, 255, 0.80);
    border: 1px solid #fff;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0,0,0,.3);
    cursor: pointer;
    margin-top: 3px !important;
    margin-left: 3px !important;
}

    .map.menu.darker {
        background-color: rgba(255, 255, 255, 0.75);
    }

    /*.map.menu > .item {
    color: rgb(25,25,25);
    font-family: Arial,Roboto,sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5em;
    padding-left: 5px;
    padding-right: 5px;
    flex-direction: row;
    flex-wrap: nowrap;
    display: flex;  
    width: auto;
}
*/
    .map.menu > .item:hover {
        background-color: rgba(128,128,128,.15);
    }

    /*.map.menu > .item > .dropdown {
    flex-direction: column;
    display: none;
    position: absolute;
    left: 80px;
    background-color: #fff;
    min-width: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
    white-space: nowrap;
}
*/
    .map.menu > .item > .dropdown div {
        display: block;
        text-decoration: none;
    }

    .map.menu > .item:hover .dropdown {
        display: flex;
    }

.map.infowindow {
    padding: 5px;
}

table.inspectionresults td + td {
    padding-left: 5px;
}

table.inspectionresults > thead > tr {
    font-weight: 600 !important;
    font-size: 80%;
    font-weight: bolder;
}

table.inspectionresults > tbody > tr > td.right {
    text-align: right;
}

.unit {
    color: gray;
    font-size: 80%;
}

.value.high {
    color: red;
}

.value.warning {
    color: darkorange;
}

.value.low {
    color: #FBBD08;
}

.cardlink {
    color: black;
}

a > h2, a > div > h2, h2.cardheadercolumn,
a > h3, a > div > h3, h3.cardheadercolumn {
    margin: 2px 2px 2px 0px;
    margin-bottom: 2px;
}

a > h4, a > div > h4, h4.cardheadercolumn,
a > h5, a > div > h5, h5.cardheadercolumn {
    margin-top: 2px;
    margin-bottom: 2px;
}

.thin.top {
    padding-bottom: 1px !important;
    margin-bottom: 1px !important;
}

.thin.bottom {
    padding-top: 1px !important;
    margin-top: 1px !important;
}

.flush {
    padding: 0;
}

    .flush.plusone {
        padding: 1px 1px 1px 1px !important;
    }

.meta {
    color: rgba(0, 0, 0, 0.7) !important;
}

.warning.box {
    -webkit-box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
    box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
    background-color: #FFF6F6;
    color: #9F3A38;
    padding: 4px 2px 4px 2px;
}

.header.line {
    padding-bottom: 5px !important;
    margin-bottom: 5px !important;
}

.stack.tight {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.header.line > label {
    font-weight: 700;
}

.daytabs > div.item {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.centeredflex {
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}

.centereditem {
    padding: 5px;
    margin: 10px;
    line-height: 20px;
    text-align: center;
    font-size: 3em;
    font-weight: 600;
}

.hidden.segment {
    display: none;
}

.toggle.sitelimit {
    text-align: left;
}

.orgtree, .orgtree ul, .orgtree li {
    position: relative;
}

    .orgtree ul {
        list-style: none;
    }

    .orgtree li::before, .orgtree li:not(.top)::after {
        content: "";
        position: absolute;
        left: -10px;
        top: -4px;
    }

    .orgtree li:not(.top)::before {
        border-top: 2px solid #000;
        top: 32px;
        width: 14px;
        height: 0;
    }

    .orgtree li:not(.top)::after {
        border-left: 2px solid #000;
        height: calc(100% + 8px);
        width: 4px;
        top: -4px;
    }

    /*.orgtree ul > li.top {}*/

    .orgtree ul > li:not(.top):last-child::after {
        height: 38px;
    }

.dashboard.totals {
    font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-weight: 700;
    font-size: 14px;
    background-color: rgba(0, 0, 0, 0.03);
    height: 42px;
    border-bottom: 2px solid rgba(34, 36, 38, 0.15);
    padding: 12px 16px 16px 12px;
    margin-bottom: 2px;
}

.units.red {
    color: red;
    font-size: x-small;
    font-weight: 300;
    align-content: center;
    text-align: center;
}

.table-container {
    overflow: scroll;
}

.button.disabled.unusable {
    opacity: 0.80 !important;
    background-color: rgba(0, 0, 0, 0.08) !important;
}

.label.siterole {
    width: 99%;
}

table.siterole {
    font-size: 0.85714286rem !important;
    font-weight: bold;
    border: 1px solid rgba(38, 38, 40, 0.5) !important;
}

    table.siterole tr:first-child td {
        padding: .5em .7em .5em .7em !important;
        border: none !important;
    }

    table.siterole tr td {
        padding: .5em .7em .5em .7em !important;
        border-top: 1px solid rgba(38, 38, 40, 0.5) !important;
    }

span.rolename {
    color: rgba(0, 0, 0, 0.4) !important;
}
/*
thead.sticky {
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky !important;
    top: 125px !important;
    background-color: green !important;
}*/

.ui.fixed.sticky + tr {
    margin-top: 50px;
}

small.header {
    color: blue;
}

.highlight:not(.secondary) {
    background-color: #dddddd !important;
}

.secondary.highlight {
    background-color: #eeeeee !important;
}

i.validation1.icon {
    color: #9f3a38 !important;
}

svg > path.validation1 {
    fill: #9f3a38
}

i.validation2.icon {
    color: #ff7f00 !important;
}

svg > path.validation2 {
    fill: #ff7f00
}

i.validation3.icon {
    color: #ffff00 !important;
}

svg > path.validation3 {
    fill: #ffff00
}

i.validation4.icon {
    color: #80ff00 !important;
}

svg > path.validation4 {
    fill: #80ff00
}

i.validation5.icon {
    color: #00ff00 !important;
}

svg > path.validation5 {
    fill: #00ff00
}

i.validation6.icon {
    color: #00fd7f !important;
}

svg > path.validation6 {
    fill: #00fd7f
}

i.validation7.icon {
    color: #00ffff !important;
}

svg > path.validation7 {
    fill: #00ffff
}

i.validation8.icon {
    color: #00bbff !important;
}

svg > path.validation8 {
    fill: #00bbff
}

i.validation9.icon {
    color: #00ddff !important;
}

svg > path.validation9 {
    fill: #00ddff !important;
}

i.validation10.icon {
    color: #1f8ffb !important;
}

svg > path.validation10 {
    fill: #1f8ffb
}

i.validation11.icon {
    color: #ff007f !important;
}

svg > path.validation11 {
    fill: #ff007f
}

i.validation12.icon {
    color: #ff9f41 !important;
}

svg > path.validation12 {
    fill: #ff9f41
}

i.validation13.icon {
    color: #9ffb42 !important;
}

svg > path.validation13 {
    fill: #9ffb42
}

i.validation14.icon {
    color: #228181 !important;
}

svg > path.validation14 {
    fill: #228181
}

i.validation15.icon {
    color: #abdbdb !important;
}

svg > path.validation15 {
    fill: #abdbdb
}

i.validation16.icon {
    color: #ffdd42 !important;
}

svg > path.validation16 {
    fill: #ffdd42
}

.stats {
    flex-direction: row;
    flex-wrap: nowrap;
    display: flex;
    white-space: nowrap;
}

.float-right {
    float: right !important;
}

.text-right {
    text-align: right;
}

.font-bold {
    font-weight: 700;
}

.collapse.list > .item {
    display: none !important;
}

.hidden {
    display: none !important;
}

.subdrawing {
    background: #fff;
    margin: 3px;
    border: 1px solid #fff;
    border-radius: 3px;
    box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
    font-size: 1em;
    font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
    min-height: 2.85714286em;
}

    .subdrawing > .content {
        padding: 0.75em 1.0em;
        line-height: 1;
        position: relative;
        vertical-align: middle;
        margin: 3px;
    }

.nowrap.grid {
    white-space: nowrap !important;
}

.subdrawing > .content label {
    font-weight: 600;
    font-size: 80%;
    font-style: italic;
}

.treeborder {
    border: 1px solid rgba(0, 0, 0, 0.87);
    margin: 0px;
    padding: 7px;
}


.tree, .tree ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .tree ul {
        margin-left: 1em;
        position: relative
    }

        .tree ul ul {
            margin-left: .5em
        }

        .tree ul:before {
            content: "";
            background-color: transparent;
            display: block;
            width: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            border-left: 1px solid
        }

    .tree li {
        margin: 0;
        padding: 0 1em;
        line-height: 2em;
        color: #369;
        /* font-weight: 700; */
        position: relative
    }

    .tree ul li:before {
        content: "";
        background-color: transparent;
        display: block;
        width: 10px;
        height: 0;
        border-top: 1px solid;
        margin-top: -1px;
        position: absolute;
        top: 1em;
        left: 0
    }

    .tree ul li:last-child:before {
        background: #fff;
        height: auto;
        top: 1em;
        bottom: 0
    }

.indicator {
    margin-right: 5px;
}

.tree li a {
    text-decoration: none;
    color: #369;
}

.tree li button, .tree li button:active, .tree li button:focus {
    text-decoration: none;
    color: #369;
    border: none;
    background: transparent;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    outline: 0;
}

li > div.item.active, li > div.item.disabled {
    background-color: rgba(0, 0, 0, 0.15);
}

    li > div.item.active.disabled {
        background-color: rgba(0, 0, 0, 0.10);
    }

li > div > div.ui.map.checkbox > label {
    margin-top: 2px;
}

li > div.item.container > span.icon {
    display: none !important;
    float: right;
}

li > div.item.container.active > span.icon {
    display: inline !important;
    cursor: pointer;
}

.spacer {
    margin: 0 3px 3px 3px;
    padding: 0 3px 3px 3px;
}

.dragging {
    opacity: 0.5;
}

.dragover {
    font-weight: 800;
    color: black;
    background-color: #aaa7a7;
}

li > div.item.placemark > span.icon {
    display: none !important;
    float: right;
}

li > div.item.placemark.active:not(.disabled) > span.icon {
    display: inline !important;
    cursor: pointer;
}

form.element > input, form.element > select {
    width: 100%;
}

.hovertext {
    position: relative;
    border-bottom: 1px dotted black;
    padding: 1px 2px 1px 2px;
}

    .hovertext:before {
        content: attr(data-hover);
        visibility: hidden;
        opacity: 0;
        background-color: lightgray;
        color: black;
        text-align: left;
        border-radius: 5px;
        /*width:110%;*/
        padding: 5px;
        margin: 5px;
        transition: opacity 1s ease-in-out;
        position: absolute;
        z-index: 1;
        left: 0;
        top: 110%;
    }

    .hovertext:hover:before {
        opacity: 1;
        visibility: visible;
    }

.maplabel {
    background-color: rgba(0, 0, 0, .25);
    padding: 0.25em;
    border-radius: 5px;
}

.progress.label {
    text-align: center;
    margin-top: -1em;
    font-size: xx-small;
    font-weight: 700;
}

.padding.half {
    padding-top: 0.5em;
}

.padding.whole {
    padding-top: 1em;
}

.steps.column {
    border: 1px solid lightgray;
    padding: 10px;
    margin: 5px;
}

.completed.segment .centereditem:before {
    font-family: 'Step';
    content: '\e800';
    color: #21BA45;
}

.completed.segment .centereditem span {
    display: none;
}

.contactcount {
    font-size: x-large;
    font-family: serif;
    font-weight: 800;
    vertical-align: bottom;
}

.countborder {
    padding: 3px;
    border: 1px solid lightgray;
    border-radius: 1000rem;
    margin-right: 5px;
    color: gray;
    background-color: #cecece;
}

table.calendar .hour {
    width: 2em;
}

table.calendar .subheader {
    font-size: smaller;
    background-color: darkgray !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    text-align: center;
}

table.calendar td {
    vertical-align: top !important;
}

table.calendar div.block {
    min-height: 5em;
}

    table.calendar div.block > div.date {
        font-weight: bold;
        font-size: larger;
        color: #767676;
    }

        table.calendar div.block > div.date.monthlabel {
            color: black;
        }

    table.calendar div.block ul {
        padding-inline-start: 1.25em;
    }

table.calendar td.placeholder {
    background-color: #f3f3f3;
}

table.calendar a {
    font-size: smaller;
}

table.calendar .a {
    margin: 5px;
    padding: 5px;
    border: 1px solid gray;
    background-color: lightgray;
    border-radius: 0.25em;
    cursor: pointer;
}

a.linkable {
    color: #0071c1 !important;
}
