@import url('https://fonts.googleapis.com/css?family=Work+Sans');
/**
* Hide when Angular is not yet loaded and initialized
*/

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

body {
    font-family: "Source Sans Pro";
}

input, button, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.auto-logoff-modal {
    width: 400px;
    height: 200px;
}

a.no-underline {
    color: inherit;
    text-decoration: none;
}

md-dialog {
    border-radius: 0;
}

.red-link {
    color: red;
}

canvas.chart-line {
    height: 300px !important;
}

canvas.chart-line.modal {
    height: 300px !important;
}

.loading-cursor {
    cursor: progress !important;
}

.user-info-error-message {
    font-size: 16px;
    color: rgb(213, 0, 0);
}

.error-message {
    font-size: 12px;
    color: rgb(213, 0, 0);
}

.error {
    z-index: 1000;
}

.error .md-toast-content {
    background: #FCB820;
    color: black;
    margin-bottom: 8%;
}

.error ng-md-icon {
    fill: black;
    margin-right: 5px;
}

.command {
    z-index: 1000;
}

.command .md-toast-content {
    margin-bottom: 8%;
    font-size: 18px;
}

.command ng-md-icon {
    fill: white;
    margin-top: 5px;
    margin-right: 2px;
    padding-left: 10px;
}

.delete-dialog {
    background-color: #F3E9E8;
    border-left: 5px solid #8E2722;
    max-width: 450px;
}

.locations {
    max-height: 100%;
    height: 100%;
    padding-bottom: 0;
    padding-right: 0;
    padding-top: 0;
    overflow: auto;
}

.locations md-content {
    padding-right: 0;
}

.locations-container {
    padding: 0 0 0 0;
    max-height: 100%;
}

.locations-page-header {
    z-index: 1;
}

.locations-list {
    position: sticky;
    max-height: 75%;
    min-height: 100%;
    width: 28%;
    min-width: 380px;
    left: 0;
    bottom: 0;
    overflow-y: auto;
    z-index: 2;
}

.location-detail {
    position: sticky;
    max-height: 75%;
    min-height: 100%;
    width: 72%;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    z-index: 2;
}

.event-viewer-filter-tab {
    font-size: 20px !important;
}

.location-history-list {
    height: 40vh;
}

.event-note {
    font-style: italic;
    padding-top: 4px;
}

.blue-alert-container {
    width: 100%;
}

.blue-alert-banner {
    background-color: rgba(204, 237, 245, 0.8);
    text-align: center;
    justify-content: center;
}

.blue-border-banner {
    height: 40px;
    border-left: 3px solid #29ADCD;
    font-size: 14px;
    display: flex;
    align-items: center;
}

.multiple-days {
    align-items: flex-start !important;
    width: 100%;
}

.divider-margin {
    margin: 24px 0;
}

.wrap-div {
    display: flex;
    flex-wrap: wrap;
    word-break: break-word;
}

.word-wrap {
    word-wrap: break-word;
    display: block;
}

div.access-uneditable {
    margin-left: 0 !important;
}

img.access-uneditable {
    display: block;
    width: 14px;
    height: 18px;
    margin: 0 9px;
}

.page-description {
    color: #4A4A4A;
}

.flex-start {
    align-items: flex-start !important;
}

.capitalize {
    text-transform: capitalize;
}

.uppercase {
    text-transform: uppercase;
}

div.mobile-column>div {
    margin: 4px 0 4px 0;
}

img.main-logo {
    position: relative !important;
    width: 320px;
    height: 80px;
}

div.main-logo {
    position: absolute;
    left: 5px;
    top: 2px;
}

.customer-name-header {
    font-size: 13px;
    color: #BBBBBB;
    max-width: 275px;
    margin-top: -18px;
    margin-left: 45px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media screen and (min-width: 1280px) and (max-width: 1599px) {
    img.main-logo {
        position: relative !important;
        width: 212px;
        height: 53px;
    }
    div.main-logo {
        position: absolute;
        left: 5px;
        top: 12px;
    }
    .customer-name-header {
        max-width: 275px;
        margin-top: -15px;
        margin-left: 30px;
    }
}

img.sidebar-logo {
    width: 90%;
    height: auto;
    display: block !important;
}

div.sidebar-logo {
    position: relative !important;
    margin: 10px auto 12px auto;
    align-items: center
}

div.sidebar-name {
    font-size: 12px;
    color: #BBBBBB;
    margin-top: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hamburger-icon {
    position: absolute;
    left: 0;
    height: 85px;
    min-width: unset;
}

.hamburger-icon img {
    height: 25pt;
    width: 25pt;
    display: block;
}

.login-dropdown {
    position: absolute;
    right: 0;
    height: 85px;
}

.login-dropdown .md-button {
    height: 100%;
    justify-content: center;
}

div.login-dropdown-username {
    line-height: 17px;
    color: #BBBBBB;
    font-size: 13px;
    margin-left: 8px;
}

.login-dropdown img {
    display: block;
}

span.login-dropdown-username {
    line-height: 23px;
    color: white;
    font-size: 18px;
}

img.login-dropdown-username {
    width: 35px;
    height: 35px;
}

.login-dropdown-arrow {
    height: 8px;
    width: 11px;
    margin-left: 10px;
}

.menu-item-profile {
    height: unset !important;
    margin-top: 8px;
}

.menu-item-profile img {
    display: block;
    height: 60px;
    width: 60px;
    margin-right: 16px;
    margin-top: 4px;
}

.menu-item-profile .md-button {
    margin-top: 16px;
    margin-bottom: 16px;
}

.menu-item-email {
    font-size: 14px;
    color: #777777;
}

.menu-item-users {
    height: 48px;
    font-size: 14px;
}

.menu-item-other {
    height: 60px;
}

.menu-item-other img {
    margin-left: 4px;
    margin-right: 8px;
}

.menu-item-other span {
    font-size: 18px;
}

.user-list-table {
    width: 100%; 
    table-layout: fixed; 
    border-spacing: 0px; 
    cursor: default;
}

.user-list-table tr {
    height: 40px;
}

.user-list-table th {
    text-align: left;     
    padding-right: 10px;
}

.user-list-table td {
    text-align: left; 
    _vertical-align: initial;
    _padding-top: 4px !important; 
    overflow: hidden; 
    text-overflow: ellipsis;
}

.user-list-table-sort-icon {
    position: relative; 
    top: 5px; 
    left: 2px; 
    cursor: pointer;
    fill: lightgray;
}

.user-status-dropdown {
    width: 150px;
}

.user-status-dropdown img {
    margin-left: 4px;
}

.mobile-alerts-card {
    color: white !important;
    display: flex;
    justify-content: center;
    font-weight: bold;
}

.mobile-alerts-card-count {
    font-size: 50px;
}

div.alert-active {
    background-color: #90261d;
}

div.alert-acknowledged {
    background-color: #777777;
}

div.alert-cleared {
    background-color: #44606E;
}

.alert-active {
    color: #90261d;
}

.alert-acknowledged {
    color: #777777;
}

.alert-cleared {
    color: #44606E;
}

.alert-active img {
    width: 50%;
    height: 60%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 18px;
    text-align: center;
    display: block;
}

.alert-acknowledged img {
    width: 55%;
    height: 60%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 18px;
    text-align: center;
    display: block;
}

.alert-cleared img {
    width: 55%;
    height: 60%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 18px;
    text-align: center;
    display: block;
}

.list-header {
    color: #777777;
    font-size: 16px;
    letter-spacing: 0.68px;
    line-height: 20px;
    padding-bottom: 8px;
    padding-left: 32px;
    align-items: center;
}

h2.edstrom {
    font-size: 28px;
    line-height: 36px;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
}

.alerts-by-location>div {
    width: 60%;
}

span.alerts-by-location {
    font-size: 26px;
    min-width: 35px;
    text-align: center;
}

div.alerts-by-location {
    margin-left: 2px;
    margin-top: 6px;
    align-items: baseline;
}

.location-description {
    font-size: 14px;
    margin-right: 9px
}

div.location-alert {
    align-items: center;
}

div.location-alert-button>div {
    margin-right: 10px;
}

.event-viewer-tabs {
    margin: 0 8px 0 8px;
}
.event-viewer-tabs md-tab-data {
    position: relative;
    opacity: 1;
    z-index: 100;
    display: flex;
    width: 100%;
}
.event-viewer-tabs .md-tab {
    font-size: 28px;
    font-weight: 600;
}
.event-viewer-tabs md-tab-item {
    padding-left: 52px;
    padding-right: 52px;
    max-width: 190px !important;
}
.event-viewer-tabs .md-tab {
    font-size: 16px;
}
.event-viewer-tabs md-tab-item {
    padding-left: 20px;
    padding-right: 20px;
}

md-tabs.alerts-tabs {
    margin: 0 8px 0 8px;
    height: 100%;
    overflow: hidden;
}

.alerts-tabs md-tab-data {
    position: relative;
    opacity: 1;
    z-index: 100;
    display: flex;
    width: 100%;
}

.tab-button {
    right: 0;
    position: absolute;
    z-index: auto;
}

.alerts-tabs .md-tab {
    font-size: 28px;
    font-weight: 600;
}

.alerts-tabs md-tab-item {
    padding-left: 52px;
    padding-right: 52px;
    max-width: none !important;
}

.alerts-tabs > md-tabs-content-wrapper,
.alerts-tabs > md-tabs-content-wrapper > md-tab-content {
    height: 100%;
}

.user-profile-pin-row {
    margin-top: 12px; 
    margin-bottom: 12px;
}

.show-pin-link {
    font-size: 12px;
    color: gray;
    cursor: pointer;
}

.action-links {
    font-size: 16px;
    text-decoration: underline;
    cursor: pointer;
}

.action-links.critical {
    color: #90261d;
}

.action-links.warning {
    color: #d99d3b;
}

.action-links.inactive {
    color: #777777
}

.action-links img {
    padding: 0 6px 0 12px;
    display: block;
    margin-top: auto;
    margin-bottom: auto;
}

.action-links a {
    align-items: center;
}

.action-links.disabled {
    color: lightgray;
    cursor: default;
}

.title-with-button {
    padding: 0;
    justify-content: space-between;
    align-items: center;
}

img.user-img {
    height: 60px;
    width: 60px;
    display: block;
    margin-right: 8px;
}

.title-buttons .md-button {
    margin: 0 16px 0 16px !important;
}

.title-with-button page-title {
    padding: 8px;
}

.mobile-title-buttons {
    background-color: #F4F4F4;
    align-items: center;
    justify-content: space-around;
    border-top: 1px solid rgba(187, 187, 187, 0.7);
    border-bottom: 1px solid rgba(187, 187, 187, 0.7);
}

.mobile-title-buttons .md-button {
    min-width: 134px;
}

.header-with-button {
    align-items: center;
    justify-content: space-between
}

.header-with-chips {
    align-items: center;
}

.header-with-chips h2 {
    margin-right: 8px;
}

page-title {
    -webkit-margin-before: 16px;
    -webkit-margin-after: 0;
    display: block;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    line-height: 50px;
    font-size: 40px;
    font-weight: 600;
}

.page-subheader a {
    color: inherit;
    text-decoration: none;
}

.page-subheader span {
    font-size: 16px;
    font-weight: 600;
}

div.page-subheader {
    padding: 0 8px 0 8px;
    margin-bottom: 16px;
    margin-left: 5px;
}

.settings-main img {
    display: block;
    margin: auto 10px auto -10px;
    max-height: 35px;
}

.settings-main>div {
    margin: 0 0 0 0;
}

.settings-main {
    padding: 20px 20px 0px 20px;
}

.settings-main, .modal-body md-card-title {
    flex: initial !important;
}

.settings-main .md-button {
    margin-top: auto;
    min-width: 190px;
}

.reset-password-box {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

.lighting-label {
    font-size: 16px !important;
}

.user-icon {
    align-items: center;
}

.user-icon img {
    width: 25px;
    height: 25px;
    margin-right: 8px;
}

md-card-title.flex-card {
    flex: initial;
}

md-card-title-text>div {
    height: 36px;
}

.general-settings-label {
    color: #777777;
    font-size: 16px;
}

.md-input-span-align {
    margin-bottom: 16px;
}

span.user-status {
    margin-right: 24px;
}

.user-list-row img {
    display: block;
    height: 35px;
    width: 35px;
    margin: auto 16px auto 0;
}

.user-list-row div {
    align-items: center;
}

.group-list-row {
    align-items: unset !important;
    margin: 8px 0 8px 0;
}

md-dialog.edit-profile-dialog {
    min-width: 1000px;
    overflow: visible;
}

md-dialog-content.edit-profile-dialog, form.edit-profile-dialog {
    padding: 16px 5% 16px 5%;
    order: unset;
    max-height: 100%;
}

md-dialog.edit-lights-dialog {
    min-width: 550px;
}

md-dialog.edit-watering-properties-dialog {
    min-width: 700px;
}

md-dialog.neuron-dialog {
    width: 600px;
}

md-dialog.waste-dialog.classification {
    width: 700px;
}

md-dialog.lighting-properties-modal {
    min-width: 800px;
}

.neuron-placeholder {
    margin: 32px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.neuron-label {
    margin: 8px 0 0 16px;
}

md-dialog.neuron-alert {
    width: 450px;
    background-color: #CDECF4;
    border-left: 5px solid #29ADCD;
}

md-dialog.report-generation {
    width: 330px;
    height: 140px;
    background-color: #353535;
    border-radius: 5px;
}

.neuron-alert-title {
    font-size: 24px;
    color: #29ADCD;
}

.neuron-button {
    width: 110px;
    margin: 16px auto 16px auto !important;
}

.neuron-requirement-dialog {
    color: #E6412E;
    font-size: 16px;
    margin-bottom: 10px;
}

.light-thresholds-current-value {
    font-size: 14px;
    color: #777777;
}

.light-thresholds-row {
    margin-bottom: 32px;
    align-items: center;
}

.absolute-close {
    position: absolute;
    right: 5px;
    top: 10px;
}

md-dialog.edit-contact-dialog {
    width: 700px;
}

.md-card-gap {
    margin-right: 16px;
}

.md-card-bottom-margin {
    margin-bottom: 32px;
}

.md-input-align div {
    align-items: center;
}

.md-tooltip {
    background-color: black !important;
    border-radius: 5px;
    color: white !important;
    font-size: 14px;
    height: auto;
    line-height: 20px !important;
}

.no-display {
    display: none !important;
}

.invisible {
    visibility: hidden;
}

.md-button.quick-action-buttons {
    line-height: unset;
    margin-bottom: 10px;
}

.quick-action-buttons ng-md-icon {
    display: block;
    fill: white;
    margin-top: 10px;
    margin-left: 0px;
}

.quick-action-dot {
    height: 60px;
    width: 60px;
    background-color: #607D8B;
    border-radius: 50%;
    display: inline-block;
}

.quick-action-buttons span {
    text-align: center;
}

.virtual-repeat-event {
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    height: 40px;
    padding-top: 10px; 
}

md-toolbar.header {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
}

md-toolbar.header>span {
    display: inherit;
}

md-toolbar.header .project-name {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 500;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-left: 130px;
}

md-toolbar.header .toolbar-buttons {
    margin-right: 130px;
}

md-toolbar.header .toolbar-buttons .active {
    background: rgba(255, 255, 255, .15);
}

md-toolbar.header .divider.vertical {
    width: 1px;
    height: 45px;
    opacity: 0.3;
    background: #ffffff;
    margin-left: 20px;
    margin-right: 20px;
}

.toolbar-link {
    font-size: 9px;
    line-height: normal;
}

md-card {
    border-radius: 0;
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3) !important;
}

md-card.plain {
    border-radius: 0;
    box-shadow: none;
}

md-card.settings {
    height: 240px;
}

md-card.settings ng-md-icon svg {
    /* Center the SVG icons vertically */
    transform: translate3d(0, 5%, 0);
    padding-right: 5px;
    fill: #607D8B
}

@media screen and (min-width: 1280px) and (max-width: 1700px) {
    md-card.settings {
        height: 280px;
    }
}

@media screen and (max-width: 1279px) and (min-width: 961px) {
    md-card.settings {
        height: 340px;
    }
}

@media screen and (min-width: 601px) and (max-width: 960px) {
    md-card.settings {
        height: 220px;
    }
}

@media screen and (max-width: 600px) {
    md-card.settings {
        height: auto;
    }
}

.activity-header {
    font-size: 30px;
    font-weight: bold;
    margin: 28px 0 0 24px;
}

md-card.current-alerts {
    height: 90px;
    width: 400px;
    border: 1px solid rgba(187, 187, 187, 0.9);
    margin: 8px 0 8px 0;
}

div.current-alerts {
    max-height: 305px;
    overflow-y: auto;
}

.location-subheader {
    font-size: 13px;
}

.user-subheader {
    font-size: 14px;
    color: black;
}

.alerts-card-row {
    justify-content: center;
}

alerts-card {
    margin-right: 1%;
    margin-right: 1%;
}

div.alert-card-color-div {
    min-width: 100px;
    height: 100%;
    display: block;
    justify-content: space-evenly;
}

.alert-card-content {
    padding: 0;
}

.alert-card-content .card-count {
    height: 100%;
    margin: 10px 8px auto 8px;
    text-align: center;
}

.alert-card-content>div>span>b {
    font-size: 70px;
}

.no-padding {
    padding: 0 !important;
}

md-card-content {
    padding-top: 16px !important
}

md-grid-tile[ng-click] {
    cursor: pointer;
}

.dashboard-chart {
    width: 300px;
    height: 300px;
    float: left;
    position: relative;
    z-index: 2;
}

.dashboard-chart .text {
    width: 100%;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -30px;
    line-height: 19px;
    text-align: center;
    z-index: -1;
}

.dashboard-chart .small {
    height: 20px;
    font-size: 28px;
    line-height: 30px;
    text-align: center;
    position: relative;
}

.dashboard-chart .count {
    height: 40px;
    font-size: 92px;
    font-weight: bold;
    margin-top: -30px;
    text-align: center;
    position: relative;
}

.dashboard-chart .label {
    font-size: 30px;
    font-weight: 600;
    line-height: 50px;
    text-align: center;
    position: relative;
}

.dashboard-chart .chart {
    z-index: 2;
}

.dashboard-no-alerts {
    font-size: 200%;
}

.key-row {
    width: 100%;
    font-size: 150%;
}

.key-margin {
    margin-left: 6px;
    font-weight: bold;
}

.key {
    height: 16px;
    width: 16px;
    display: block;
    border-radius: 50%;
    background-color: #ccff99;
}

.key.normal {
    background-color: #44606E;
}

.key.info {
    background-color: #000000;
}

.key.warning {
    background-color: #d99d3b;
}

.key.commloss {
    background-color: #BBBBBB;
}

.key.critical {
    background-color: #90261d;
}

.fill-critical {
    fill: #90261d;
}

.fill-warning {
    fill: #d99d3b
}

.point-value-circle {
    height: 10px;
    width: 10px;
    display: block;
    border-radius: 50%;
    margin: auto 6px auto 0;
}

.point-value-circle.normal {
    background-color: #44606E;
}

.point-value-circle.critical {
    background-color: #90261d;
}

.point-value-circle.warning {
    background-color: #d99d3b;
}

.point-value-circle.inactive {
    background-color: #FFFFFF;
    border: 1px solid #777777;
}

.left-nav {
    width: 256px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
    margin-top: 15px;
    margin-bottom: 15px;
    margin-left: 130px;
    border-radius: 4px;
}

.footer {
    box-sizing: border-box;
    height: 5%;
    border-top: 1px solid/* #979797;
    background-color: #FFFFFF; */
}

.copyright {
    color: #0A132F;
    font-size: 14px;
}

#applicationVersion {
    font-size: 60%;
    text-align: center;
}

md-toolbar.header .md-button img {
    margin-top: 12px;
}

.main-nav-bar .md-nav-bar {
    border-bottom-width: 0;
}

._md-nav-button-text img {
    display: block;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 13px;
}

@media screen and (min-width: 1280px) {
    ._md-nav-button-text svg {
        display: block;
        margin-top: 45%;
        margin-right: 10px;
    }
}

@media screen and (max-width: 1279px) {
    ._md-nav-button-text svg {
        display: block;
        margin-right: 10px;
    }
}

._md-nav-button-text div {
    justify-content: center;
}

._md-nav-button-text span {
    text-align: center;
}

md-nav-bar .md-button._md-nav-button {
    height: 89px;
    width: 173px;
    bottom: 20px;
    line-height: 55px;
    font-size: 20px;
    margin: 0;
}

md-nav-bar .md-button._md-nav-button.md-unselected {
    color: #BBBBBB;
}

md-nav-bar .md-button._md-nav-button.md-primary {
    color: #607D8B;
    background-color: white;
    font-weight: bold;
}

.md-nav-item ._md-nav-button {
    color: white;
}

.nav-spacer {
    width: 80px;
}

md-nav-bar md-nav-ink-bar {
    height: 5px;
    width: 173px;
    background-color: #607D8B;
    left: 0;
    bottom: 63px;
}

.main-nav-bar {
    width: 905px;
    height: 89px;
    border-bottom-width: 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #353535;
}

/**
Side Nav
 */

.side-nav-bar {
    position: relative;
    width: 100%;
    background-color: #353535;
    margin-bottom: 40px;
}

.side-nav-bar .md-nav-bar {
    border-color: transparent;
}

.side-nav-bar .md-nav-item {
    display: block;
}

.side-nav-bar .md-nav-bar {
    width: 100%;
    height: 100%;
}

.side-nav-bar nav {
    width: 100%;
    height: 100%;
}

.side-nav-bar .md-nav-item {
    height: 50px;
}

.side-nav-bar .md-button._md-nav-button {
    height: 50px;
    width: 100%;
    line-height: unset;
    bottom: 0;
    margin: 0;
    border-radius: 0;
}

.side-nav-bar ._md-nav-bar-list {
    -webkit-box-orient: vertical;
    flex-direction: column;
}

.side-nav-bar .md-nav-item:first-of-type {
    margin-left: 0;
}

.side-nav-bar ._md-nav-button-text div {
    justify-content: flex-start;
}

.side-nav-bar md-nav-ink-bar {
    display: none;
}

.user-data {
    margin: 0 16px 16px 16px;
    align-items: center;
}

.user-data div {
    line-height: 17px;
    color: #BBBBBB;
    font-size: 13px;
    margin-left: 8px;
}

.user-data img {
    display: block;
    height: 35px;
    width: 35px;
}

md-divider.user-data {
    margin: 0 16px 0 16px;
    border-color: #BBBBBB;
}

.side-nav-item {
    color: white;
    line-height: 36px;
}

.side-nav-item span {
    font-size: 18px;
}

.side-nav-item img {
    margin-right: 8px
}

/*-------------*/

.leftnav-tab {
    height: 45px;
}

.content-list {
    margin-top: 20px;
    margin-left: 60px;
    margin-right: 60px;
}

.i3-button {
    height: 45px;
    line-height: 40px;
    min-width: 155px;
    border-radius: 5px;
    /* All buttons at this point are aligned to the right edge of the container */
    margin-left: auto;
}

.i3-button>img {
    margin-right: 12px;
    vertical-align: middle;
}

.md-button.default-button {
    border: solid 2px #0a132f;
}

.next-day-label {
    font-size: 12px;
    color: #6e6e6e;
}

/* For warning alert labels */

.alert-warning {
    display: flex;
    height: 25px;
    width: 88px;
    color: white;
    background-color: #d99d3b;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}

/* For the alert card */

.alert-warning-text {
    color: #d99d3b;
}

/* For critical alert labels */

.alert-critical {
    display: flex;
    height: 25px;
    width: 88px;
    color: white;
    background-color: #90261d;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}

/* For inactive point labels */

.alert-inactive {
    display: flex;
    height: 25px;
    width: 88px;
    color: #777777;
    background-color: white;
    border-radius: 20px;
    border: 1px solid #777777;
    font-size: 13px;
    cursor: default;
    font-weight: 600;
}

.alert.panel {
    height: 80px;
    min-height: 80px;
    padding: 0px;
    width: 414px;
    font-size: 13px;
    border-radius: 0px;
    color: #353535;
    font-family: "Source Sans Pro";
    font-size: 16px;
    line-height: 20px;
}

.alert.panel .small {
    color: #777777;
    font-family: "Source Sans Pro";
    font-size: 13px;
    letter-spacing: 0.55px;
    line-height: 17px;
}

.side-drawer {
    background-color: rgba(187, 187, 187, 0.3);
    width: 355px;
}

md-sidenav {
    min-width: unset;
    width: 70%;
    background-color: #353535;
    box-shadow: none;
    top: 84px !important;
}

.alert.panel.hint .leftbar {
    background-color: #29ADCD;
    width: 4px;
    margin-right: 10px;
}

.alert.hint {
    background-color: #CDECF4;
    font-style: normal;
}

/* For warning alert buttons */

.alert.panel.warning .leftbar {
    background-color: #d99d3b;
    width: 4px;
    height: 100%;
    margin-right: 14px;
}

.alert.warning {
    background-color: rgba(252, 184, 32, 0.1);
}

/* For critical alert buttons */

.alert.critical {
    background-color: #E6412E0A;
}

.alert.panel.critical .leftbar {
    background-color: #90261d;
    width: 4px;
    height: 100%;
    margin-right: 14px;
}

.alert.inactive {
    background-color: #f3f3f3;
}

.alert.panel.inactive .leftbar {
    background-color: #777777;
    width: 4px;
    height: 100%;
    margin-right: 14px;
}

.edstrom-action-button-temp {
    height: 40px;
    color: white;
    background-color: #353535;
    border-radius: 20px;
    width: 120px;
}

.edstrom-action-button-hollow-temp {
    height: 40px;
    color: #607D8B;
    background-color: white;
    border-radius: 20px;
    border: 2px solid #607D8B;
    width: 150px;
    left: 10px;
}

.edstrom-action-button {
    height: 40px;
    border-radius: 20px;
}

.edstrom-action-button-small {
    height: 30px !important;
    color: white !important;
    background-color: #607D8B !important;
    border-radius: 10px !important;
}

.edstrom-action-button-micro {
    min-height: 22px !important;
    height: 22px !important;
    padding: 0px !important;
    color: white !important;
    background-color: #607D8B !important;
    border-radius: 20px !important;
}

.edstrom-action-button-hollow {
    height: 40px;
    border-radius: 20px;
    border: 2px solid #607D8B;
}

.edstrom-action-button-hollow-critical {
    height: 40px;
    border-radius: 20px;
    border: 2px solid #90261d;
}

.edstrom-action-button-hollow-warning {
    height: 40px;
    border-radius: 20px;
    border: 2px solid #d99d3b;
    color: #353535;
}

.edstrom-action-button-hollow:disabled {
    border: 0;
}

/* All edstrom red buttons on hover */

/* 
.edstrom-action-button:not([disabled]):hover {
    background-color: #B83324;
}

.edstrom-action-button:not([disabled]).md-focused {
    background-color: #B83324;
} */

.edstrom-action-button-small:not([disabled]):hover {
    background-color: #4e6a78 !important;
}

.edstrom-action-button-small:not([disabled]).md-focused {
    background-color: #4e6a78 !important;
}

.edstrom-action-button-micro:not([disabled]):hover {
    background-color: #4e6a78 !important;
}

.edstrom-action-button-micro:not([disabled]).md-focused {
    background-color: #4e6a78 !important;
}

.filled-row {
    background-color: #F4F4F4;
}

.filled-row-dark {
    background-color: #353535;
}

.data-row-condensed {
    align-items: center;
    padding-top: 4px;
    padding-bottom: 4px;
    min-height: 20px;
    display: flex;
    border-bottom: 1px solid rgba(187, 187, 187, 0.7);
}

.data-row {
    align-items: center;
    padding-top: 2px;
    padding-bottom: 2px;
    min-height: 35px;
    display: flex;
    border-bottom: 1px solid rgba(187, 187, 187, 0.7);
}

.data-row>div {
    margin-left: 32px;
    align-items: center;
    min-height: 40px;
}

.data-row-tooltip {
    display: flex;
    align-items: center;
    margin-left: 0 !important;
}

.data-row.alerts-row>div {
    margin-left: 48px;
}

.data-row.alerts-row-no-margin>div {
    margin-left: 0 !important;
}

.list-header.alerts-header {
    padding-left: 48px;
}

.cleared-alerts-note {
    margin-top: 5px;
}

.acknowledged-alert-icon {
    width: 48px;
    fill: #777777;
    display: flex;
    justify-content: center;
    align-items: center;
}

.acknowledged-alert-icon>img {
    width: 16px;
    height: 16px;
}

.selected-location-placeholder {
    margin-left: 32px;
    margin-right: 32px;
}

.selected-location-placeholder img {
    width: 100%;
}

.selected-location-header {
    justify-content: space-between;
}

.selected-location-header img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.selected-location-quick-actions {
    margin-left: 25px;
    align-items: center;
    min-width: 80px;
    justify-content: center;
}

.selected-location-header md-menu {
    margin-bottom: 16px;
}

.summary-chips {
    margin-top: 8px;
    background-color: rgba(187, 187, 187, 0.2);
    border-radius: 14.5px;
    height: 33px;
    align-items: center;
    justify-content: space-evenly;
}

.filter-chips {
    align-items: center;
    margin: 0 8px;
}

.summary-chips span {
    font-size: 14px;
}

.summary-chips .md-chips md-chip {
    margin-left: 0;
}

.location-list {
    align-items: center;
    width: 100%;
}

.location-list-body {
    width: 100%;
}

.full-width {
    width: 100%;
}

.location-list-header {
    align-items: center;
    display: flex;
    padding-left: 0;
    justify-content: space-between;
    margin-bottom: 8px;
    width: 100%;
}

.location-list-header md-divider {
    padding: 8px 0 8px 0;
    margin: 0 8px 0 8px;
}

.location-list-header, .neuron-dialog md-input-container {
    margin: 0;
}

.location-row {
    padding-top: 2px;
    padding-bottom: 2px;
    width: 100%;
    height: 40px;
}

.location-row>div {
    height: 100%;
    justify-content: space-between;
    align-items: center;
    margin: 0 8px;
}

.location-row-selected {
    background-color: rgba(75, 90, 121, 0.2);
}

.location-row-name {
    font-size: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.location-row-acknowledge {
    font-size: 14px;
    color: #444749;
    margin-top: 6px
}

.row-drop-down {
    height: 100%;
    width: 40px;
    display: flex
}

.no-points {
    align-items: center;
    font-size: 22px;
}

.no-points * {
    margin: 16px 0 16px 0;
}

md-checkbox {
    margin-bottom: 0;
}

md-checkbox.md-checked>div {
    color: #607D8B !important
}

md-checkbox[disabled] .md-label {
    color: rgba(0, 0, 0, 0.38) !important;
}

md-checkbox.md-default-theme.md-checked .md-icon, md-checkbox.md-checked .md-icon {
    background-color: #607D8B;
}

md-radio-button.md-checked .md-off, .md-ripple-container {
    color: #607D8B;
    border-color: #607D8B;
}

md-radio-group .md-checked .md-ink-ripple {
    color: #607D8B;
}

md-radio-button .md-on {
    background-color: #607D8B;
}

.md-chips {
    padding: 0;
    box-shadow: none !important;
}

.md-chips md-chip {
    height: 14px;
    line-height: 14px;
    font-size: 12px;
    margin-left: 8px;
    margin-right: 0;
    margin-top: 1px;
    color: white;
}

span.highlight {
    color: black !important;
    font-weight: bold;
}

.schedule-chips .md-chips md-chip {
    height: 26px;
    line-height: 26px;
    font-size: 16px;
    color: white;
    background-color: #607D8B;
    border-radius: 0;
}

.reorder-border {
    border-bottom: 1px solid #353535;
}

.normal-chips .md-chips {
    box-shadow: 0 1px rgba(0, 0, 0, 0.12) !important;
}

.normal-chips .md-chips md-chip {
    height: 32px;
    line-height: 32px;
    font-size: 16px;
    margin: 8px 8px 0 0;
    color: white;
    background-color: #44606E;
    border-radius: 0;
}

.normal-chips md-icon {
    color: white !important;
}

md-tabs .md-tab.md-active {
    color: #607D8B;
}

md-tabs md-ink-bar {
    color: #607D8B;
    background-color: #607D8B;
}

.tab-body {
    margin: 24px 0 24px 0;
}

.tab-body-margin-top {
    margin: 24px 0 0 0;
}

.alert-tab-contents {
    /* margin: 24px 0 0 0; */
    padding: 10px;
}

.legend {
    margin-top: 16px;
    margin-right: 50px;
}

.md-tab {
    text-transform: none;
    font-size: 16px;
    font-weight: 600;
}

.critical-chip {
    background-color: #90261d;
}

.warning-chip {
    background-color: #d99d3b;
}

.normal-chip {
    background-color: #44606E;
}

.inactive-chip {
    background-color: white;
    color: #777777 !important;
    border: 1px solid #777777;
}

.selected-locations-action-bar {
    background-color: #8E2722;
    position: sticky;
    min-height: 50px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.5), 0 3px 4px 0 #B7BBC0;
    justify-content: space-between;
}

.selected-locations-action-bar div {
    align-items: center;
    margin-left: 16px
}

.selected-locations-action-bar a {
    cursor: pointer;
    align-items: center;
}

.selected-locations-action-bar span {
    color: white;
    font-size: 14px;
    margin-left: 8px;
    align-items: center;
}

.selected-locations-action-bar img {
    display: block;
    margin: auto;
    height: 23px;
    width: 23px
}

.user-row {
    width: 100%;
    height: 100%;
    flex-wrap: wrap;
}

.user-search-bar {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 5px !important;
}

img.user-delete {
    width: 13px;
    height: 13px;
    margin-bottom: 18px;
}

img.user-edit {
    width: 16px;
    height: 17px;
}

.user-row ng-md-icon {
    display: block;
    margin-left: 22px;
    margin-right: 11px;
}

.user-row>div {
    justify-content: flex-start;
    align-items: center;
    width: 130px;
    margin-right: 25px;
    margin-left: 25px;
    margin-bottom: 16px;
}

.user-row span {
    text-align: center;
}

.user-row span.user-name {
    font-size: 18px;
    color: #353535;
    margin-bottom: 2px;
}

.user-row span.time-span {
    font-size: 12px;
    color: #777777;
}

.clickable {
    cursor: pointer !important;
}

@keyframes rowHide {
    0% {
        height: 41px;
        opacity: 1;
    }
    100% {
        height: 0;
        opacity: 0;
    }
}

@keyframes rowShow {
    0% {
        height: 0;
        opacity: 0;
    }
    100% {
        height: 41px;
        opacity: 1;
    }
}

.hideable.ng-hide-add {
    animation: 0.5s rowHide;
}

.hideable.ng-hide-remove {
    animation: 0.5s rowShow;
}

.hover-row:hover {
    background-color: rgba(75, 90, 121, 0.2);
}

.data-row svg, .data-row-condensed svg {
    /* Center the SVG icons vertically */
    transform: translate3d(0, 10%, 0);
    padding-left: 5px;
    /* fill: rgb(53, 53, 53, 0.87); */
}

.update-row-loading svg {
    padding-left: 0px;
}

.animate-show-hide.ng-hide {
    opacity: 0;
}

.animate-show-hide.ng-hide-add, .animate-show-hide.ng-hide-remove {
    transition: all linear 0.3s;
}

.action-buttons>img {
    margin-right: 12px;
    vertical-align: middle;
}

.action-buttons {
    width: 150px;
    text-align: right;
}

#globalErrors {
    padding-left: 40px;
    padding-right: 40px;
    color: white !important;
}

.dialog-errors {
    /* For whatever reason any padding at all causes this element to fill the available space, which is what we want */
    padding: 1px;
    color: white !important;
}

#globalErrors li, .dialog-errors li {
    list-style: none;
}

img[ng-click], a[ng-click], a[ng-click]>img {
    cursor: pointer;
}

body>md-content {
    /* Hack to use inset shadow because outset shadow on nav doesn't work */
    box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.24), inset 0 2px 2px 0 rgba(0, 0, 0, 0.12);
}

/* "search" content area should have no background */

#mainContent md-content:first-of-type {
    background-color: transparent;
    width: 100%;
}

.overview-row {
    font-size: 120%;
    font-weight: bold;
}

.item-detail {
    background: #f3f3f3;
    color: #3b3b3b;
    opacity: 1;
    border-radius: 5px;
    padding: 20px 20px 20px 20px;
}

.no-margin {
    margin: 0 !important;
}

.no-vertical-padding {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.details-card {
    background: #ffffff;
    padding-left: 30px;
    padding-bottom: 40px;
    min-height: 80px;
}

.item-detail-label {
    color: dimgrey;
}

.details-card .label-container, .details-card .label-container div {
    font-size: 12px;
    color: dimgray;
}

.item-selected {
    -webkit-transition: 0.25s ease-out;
    -moz-transition: 0.25s ease-out;
    -o-transition: 0.25s ease-out;
    transition: 0.25s ease-out;
    transform: rotate(180deg);
}

.item-detail-panel {
    width: 65%;
    height: 95%;
}

.selected-row {
    font-weight: bold;
}

:focus {
    outline: none;
}

md-input-container.no-validation {
    padding: 0px;
    margin: 0px;
    margin-top: 10px;
    line-height: 10px;
}

md-input-container.no-validation .md-errors-spacer {
    display: none;
}

.panel {
    border-radius: 5px;
}

/* Panel headers */

.panel md-toolbar {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.panel md-toolbar .md-toolbar-tools {
    color: white;
}

.admin-marker {
    text-decoration: underline;
    text-decoration-color: #5064a0;
    color: white;
    text-shadow: -1px 1px 2px rgba(0, 0, 0, 1);
}

/** Specializations for account preferences, admin, and activity pages, which are structured differently from all other pages */

md-content#admin .title {
    justify-content: center;
    display: flex;
    align-items: center;
    font-size: 26px;
    font-weight: 600;
}

md-tabs md-content {
    background-color: rgba(0, 0, 0, 0);
}

.number-column {
    display: block;
    max-width: 100px;
    text-align: right;
}

/* Hack to make autocomplete dropdowns look like input fields because Angular Material's floating label support for md-autocomplete is horribly broken */

form[name='transferForm'] .md-whiteframe-z1 {
    box-shadow: none;
    color: red;
}

@media screen and (min-width: 960px) {
    /* Centering logic for mdToast because the Toast team has proven quite recalcitrant about centering */
    md-toast.md-center {
        margin-left: auto;
        margin-right: auto;
        left: 50%;
        right: auto;
        width: 600px;
        transform: translateX(-50%);
        padding: 0px;
    }
}

@media screen and (max-width: 1700px) {
    /* Site header bar should expand to fill horizontal viewport space that it 'encompasses' navbar items */
    md-toolbar.header .project-name {
        margin-left: 10px;
    }
    md-toolbar.header .toolbar-buttons {
        margin-right: 10px;
    }
    .nav-spacer {
        width: 10px;
    }
    .details-card {
        padding-left: 10px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
}

@media screen and (max-width: 1280px) {
    .main-nav-bar md-nav-ink-bar {
        visibility: hidden;
    }
    md-dialog-content.report-create-modal, form.report-create-modal {
        padding: 16px 20px 16px 20px !important;
        margin: 0 !important;
    }
    div.report-modal-detail {
        margin: 16px 0 16px 0 !important;
    }
    .mobile-user-creation-detail {
        margin: 0 16px 0 16px;
    }
}

@media screen and (max-width: 960px) {
    md-dialog {
        max-width: 100% !important;
        max-height: 100% !important;
        width: 100% !important;
        height: 100% !important;
        border-radius: 0;
        min-width: unset !important;
    }
    md-dialog.neuron-alert {
        max-width: 450px !important;
        max-height: 20% !important;
    }
    md-dialog-content {
        overflow-y: scroll !important;
    }
    md-card.current-alerts {
        width: 100%;
        height: 100%;
    }
    alerts-card {
        width: 140px;
        height: 115px;
    }
    div.alert-card-color-div {
        display: flex;
        width: 100%;
        height: 100%;
    }
    .alerts-card-row {
        justify-content: space-evenly;
    }
    .copyrightYears {
        font-size: 70%;
        text-align: center;
    }
    .location-list {
        width: 100%;
    }
    .location-action-icons {
        height: 50px;
        width: 50px;
    }
    .selected-location-header>div {
        min-width: unset;
    }
    .selected-location-header md-menu {
        margin-top: 16px;
    }
    .mobile-location-header {
        justify-content: space-between;
        margin: 8px 0 4px 0;
        align-items: center;
    }
    .user-row>div {
        margin-left: 16px;
        margin-right: 16px;
    }
    .data-row>div {
        align-items: unset;
    }
    .alerts-mobile-margin {
        margin-left: 2% !important;
    }
    .quick-action-buttons ng-md-icon {
        display: block;
        fill: white;
        margin-top: 10px;
        margin-left: 0px;
    }
    .quick-action-dot {
        height: 60px;
        width: 60px;
        background-color: #607D8B;
        border-radius: 50%;
        display: inline-block;
    }
    md-backdrop {
        opacity: 0 !important;
    }
    .dialog-footer.report-status-buttons {
        padding: 0 20px 0 20px;
    }
    div.user-added-message {
        display: flex;
        text-align: center;
        align-items: center;
        height: 77px;
        width: 100%;
        background-color: rgba(204, 237, 245, 0.8);
    }
}

@media screen and (max-width: 600px) {
    md-card-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    md-dialog.neuron-alert {
        max-width: 450px !important;
        max-height: 40% !important;
    }
    md-content {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }
    div, md-card {
        margin-left: 0;
        margin-right: 0;
    }
    alerts-card {
        width: 100px;
        height: 90px;
    }
    md-card-title {
        padding-top: 12px !important;
        padding-bottom: 8px !important;
    }
    page-title {
        text-align: center;
        font-size: 20px;
        margin-top: 0;
        line-height: 30px;
    }
    .count-type-text {
        font-size: 13px;
    }
    .error .md-toast-content {
        margin-bottom: 10%;
        margin-left: 0;
    }
    .title-with-button {
        justify-content: center;
    }
    h2.edstrom {
        font-size: 20px;
    }
    .mobile-current-alerts {
        align-items: center;
    }
    .mobile-current-alerts .alert-warning, .alert-critical {
        margin-right: 16px;
    }
    .point-dialog .header .point-name {
        margin-left: 10px;
        max-width: 100%;
    }
    .locations {
        height: 100%;
        padding-bottom: 0;
        overflow: auto;
    }
    .location-subheader {
        margin-bottom: 4px;
    }
    .user-subheader {
        font-size: 13px;
        color: #777777;
    }
    .chartjs-size-monitor {
        position: relative;
        z-index: 1;
    }
    .dashboard-chart {
        width: 150px;
        height: 150px;
        float: left;
        position: relative;
        z-index: 2;
    }
    .dashboard-chart .text {
        width: 100%;
        height: 40px;
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -20px;
        text-align: center;
        z-index: -1;
    }
    .dashboard-chart .small {
        height: 10px;
        font-size: 14px;
        line-height: 10px;
        margin-top: -10px;
        text-align: center;
        position: relative;
    }
    .dashboard-chart .count {
        height: 30px;
        font-size: 50px;
        font-weight: bold;
        margin-top: -20px;
        text-align: center;
        position: relative;
    }
    .dashboard-chart .label {
        font-size: 16px;
        font-weight: 600;
        margin-top: -10px;
        text-align: center;
        position: relative;
    }
    .dashbaord-chart .chart {
        z-index: 2;
    }
    .dashboard-no-alerts {
        font-size: 150%;
    }
    .alerts-by-location>div {
        width: 80%;
    }
    md-nav-ink-bar {
        visibility: hidden;
    }
    .location-list {
        width: 100%;
    }
    .location-action-icons {
        height: 50px;
        width: 50px;
    }
    .selected-location-quick-actions {
        min-width: unset;
        justify-content: space-around;
        margin-top: 16px;
        margin-left: 16px;
    }
    .selected-location-header md-menu {
        margin-top: 16px;
    }
    .summary-chips {
        margin-top: 8px;
        margin-left: -15%;
        background-color: rgba(187, 187, 187, 0.2);
        border-radius: 14.5px;
        height: 33px;
        align-items: center;
        justify-content: space-evenly;
    }
    .user-row>div {
        margin-left: 16px;
        margin-right: 16px;
    }
    .no-top-padding {
        padding-top: 0 !important;
    }
    .no-margin {
        margin: 0;
    }
    .alerts-tabs .md-tab {
        font-size: 16px;
    }
    .alerts-tabs md-tab-item {
        padding-left: 20px;
        padding-right: 20px;
    }
    md-tabs {
        margin: 0 !important;
        padding: 0 !important;
    }
    .data-row>div {
        margin-left: 19px;
    }
    .alerts-mobile-margin-right {
        margin-right: 8px;
    }
    .action-button-row {
        justify-content: space-between;
        margin-right: 8px;
    }
    .settings-main img {
        margin-top: 0px;
        margin-right: 10px;
    }
    .settings-main>div {
        margin-bottom: 10px;
    }
    .settings-main {
        padding: 0 0 0 0;
    }
    .md-input-align {
        margin: 0 4px 0 4px;
    }
    .user-list-row img {
        margin: 0 8px 8px 8px;
    }
    .key-row {
        width: 100%;
        justify-content: center;
    }
    .key-margin {
        margin-left: 0px;
        text-align: center;
        font-size: 18px;
        font-weight: bold;
    }
    .key {
        margin-left: 0;
        height: 20px;
        width: 20px;
        display: block;
        border-radius: 50%;
        background-color: #ccff99;
    }
    .key.normal {
        background-color: #44606E;
    }
    .key.info {
        background-color: #000000;
    }
    .key.warning {
        background-color: #d99d3b;
    }
    .key.commloss {
        background-color: #BBBBBB;
    }
    .key.critical {
        background-color: #90261d;
    }
}

.i3-title {
    height: 21px;
    font-family: Work Sans;
    font-size: 18px;
    font-weight: 300;
    text-align: left;
    color: #000000;
}

.i3-default-action {
    font-family: Work Sans;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    text-align: center;
    color: #0a132f;
}

.i3-cancel {
    font-family: Work Sans;
    font-size: 12px;
    text-decoration: underline;
    letter-spacing: 1px;
    text-align: center;
    color: #389b00;
}

.i3-panel {
    min-width: 390px;
    min-height: 160px;
}

.md-dialog {
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
}

md-dialog.alert-details-modal {
    width: 700px;
    overflow: visible;
}

md-dialog-content.modal-body {
    order: unset;
    margin: 16px;
    height: 100%;
}

md-dialog.report-type-modal {
    width: 50%;
}

md-card-content.report-type-modal {
    height: 100px;
}

.md-button.report-type-modal {
    margin: 16px;
    min-width: 170px;
}

div.report-type-modal {
    justify-content: flex-end;
}

span.report-type-modal {
    font-size: 20px;
    font-weight: 600;
}

md-dialog.report-create-modal {
    width: 90%;
    max-height: 95%;
    height: 95%;
    overflow: visible;
}

md-dialog-content.report-create-modal, form.report-create-modal {
    padding: 16px;
    order: unset;
    max-height: 100%;
}

.report-status-panel {
    justify-content: center;
    margin: 0 150px 0 150px;
}

div.progress-line {
    height: 1px;
    border-top: 1px solid rgba(183, 187, 192, 0.5);
    margin-top: 11px;
    width: 100%;
}

div.empty-space {
    width: 100%;
}

.report-status-panel div {
    text-align: center;
    font-weight: bold;
}

.step-row {
    max-width: 25%;
}

.step-modal-panel {
    justify-content: center;
}

.step-modal-panel div {
    text-align: center;
}

div.progress-number-container {
    height: 22px;
    width: 22px;
    border-radius: 22px;
}

.progress-number-container.pending {
    background-color: #D6D6D6;
    color: #777777;
}

.progress-number-container.current {
    background-color: #353535;
    color: white;
}

.progress-number-container.complete {
    background-color: #607D8B;
}

.current-tab-title {
    font-weight: bold;
}

.report-status-text {
    margin: 0 140px 4px 130px;
    justify-content: space-between;
}

.report-modal-detail {
    margin: 16px 160px 16px 160px;
    font-size: 14px;
}

.report-one-step-description {
    margin-bottom: 40px;
}

.report-status-buttons {
    width: 100%;
    padding: 24px 170px 0 170px;
    justify-content: space-between;
    background-color: white !important;
    font-size: 100%;
    bottom: 16px;
    border-top: 1px solid rgba(187, 187, 187, 0.7);
}

.schedule-toolbar {
    border-top: 1px solid rgba(187, 187, 187, 0.7);
}

.user-status-text {
    margin: 0 140px 4px 90px;
    justify-content: space-between;
}

.user-modal-description {
    margin: 8px 0 16px 0;
    font-size: 14px;
}

.user-modal-radio {
    margin: 8px 0 8px 0;
}

.user-modal-checkboxes {
    align-items: baseline !important;
    margin-bottom: 16px;
}

.user-modal-checkboxes md-checkbox {
    margin-right: 32px;
}

div.schedule-types {
    justify-content: space-evenly;
    padding: 32px 0 32px 0;
}

div.schedule-type {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    width: 170px;
    height: 120px;
}

.added-alert {
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #CDECF4;
    border-left: 3px #29ADCD solid;
    font-size: 14px;
}

.edit-lighting-notice-container {
    margin: 8px 90px;
}

.edit-lighting-notice {
    font-size: 14px !important;
    display: inline;
}

.contact-header>span {
    color: black;
    font-weight: bold;
    margin-right: 8px;
}

.contact-detail {
    margin-left: 24px;
}

.alert-point-row {
    margin-left: 24px;
    align-items: center;
}

.point-lighting-no-schedule {
    align-items: center;
    display: flex;
}

.point-lighting-icon {
    margin: 33px 0 24px 0;
    width: 50px;
    height: 50px;
    display: flex;
}

.point-lighting-detail {
    font-size: 20px;
    margin-bottom: 32px;
}

.point-lighting-button {
    margin-top: 100px;
}

.alerting-status-text {
    margin: 0 160px 4px 105px;
    justify-content: space-between;
}

.alerting-rule-table>div {
    align-items: center;
}

.alerting-rule-triggers-row {
    margin: 8px 0;
}

.alert-rule-modal-detail {
    margin: 1% 1% 1% 1%;
}

.alert-rule-modal-detail md-slider-container>:first-child:not(md-slider), md-slider-container>:last-child:not(md-slider) {
    max-width: 100px !important;
}

.alert-rule-searchbox {
    border: none;
    outline: none;
    padding: 0;
    width: 100%;
    height: 100%;
}

.alert-rule-search-header {
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
    padding-left: 10.667px;
    height: 48px;
    position: relative;
    display: flex;
    align-items: center;
}

.alert-rule-points-list {
    max-height: 280px;
    overflow-y: auto;
}

.margin-top-bottom-16 {
    margin: 16px 0;
}

.advanced-light-control-input {
    margin: 0 0 38px 0;
}

.alert-rule-small-text {
    font-size: 13px;
}

md-slider-container.edstrom-slider .md-track-fill {
    background-color: #607D8B;
}

md-slider-container.edstrom-slider .md-thumb, .md-thumb:after {
    border-color: #607D8B !important;
    background-color: #607D8B !important;
}

md-slider-container.edstrom-slider .md-sign, .md-sign:after {
    background-color: #607D8B;
    border-top: none !important;
}

.alert-rule-time-period {
    margin-left: 40px !important;
}

.alert-rule-time-period md-input-container {
    margin: 0;
}

.alert-rule-row-space {
    margin-top: 12px;
    margin-bottom: 12px;
}

.alert-time-period-container>div {
    margin-bottom: 24px;
}

.trigger-row {
    align-items: center;
    background-color: rgba(187, 187, 187, 0.1);
    margin: 8px 8px 16px 0;
    padding: 0 8px 0 8px;
}

.trigger-row .md-errors-spacer {
    min-height: 4px !important;
}

.trigger-row md-input-container {
    margin: 10px 10px;
}

.trigger-row md-select {
    margin: 8px 10px 12px !important;
}

.option-container {
    margin: 24px 0 16px 0;
}

.option-container-bigger {
    margin-left: 24px;
    margin-right: 24px;
    margin-top: 24px;
    margin-bottom: 0px;
    align-items: center;
    justify-content: center;
}

.md-dialog-content {
    max-width: 600px;
}

md-dialog-content.temp-selection-box {
    margin-top: 40px;
    margin-bottom: 40px;
    margin-right: 5px;
    scale: .7;
}

div.option-picker {
    border: 1px solid rgba(187, 187, 187, 0.9);
    border-radius: 4px;
    height: 40px;
}

div.option-picker-disabled div {
    cursor: default !important;
}

div.option-picker-bigger {
    height: 45px;
    border-radius: 1px;
    border: 1px solid rgba(187, 187, 187, 0.9);
}

div.option-picker-bigger div {
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    cursor: pointer;
    font-size: 14px;
}

div.option-picker div {
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    cursor: pointer;
    font-size: 12px;
}

div.option-selected-bigger {
    background-color: #8E2722;
    color: white;
    border-radius: 1px;
}

div.option-selected {
    background-color: #607D8B;
    color: white;
}

div.option-deselected {
    background-color: white;
}

table.daily-report {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

table.daily-report td {
    text-align: center;
    padding: 8px;
    border: 1px solid #4A4A4A;
}

table.daily-report td.empty-row {
    padding: 8px;
    border: none;
}

@media screen {
    #printSection {
        display: none;
    }
    .printOnly {
        display: none;
    }
}

@media print {
    body * {
        visibility: hidden;
    }
    html, body {
        height: 99vh;
        overflow: hidden;
    }
    #printSection, #printSection * {
        visibility: visible;
    }
    #printSection {
        position: absolute;
        left: 0;
        top: 0;
    }
    .printWidth {
        width: 100vw;
    }
}

.timebox-text {
    font-size: 14px;
    margin-right: 9px;
    margin-top: 12px;
}

.hint {
    color: #607D8B;
    font-size: 14px;
    font-style: italic;
    display: flex;
}

.error-text {
    color: rgb(213, 0, 0);
    font-size: 14px;
    font-style: italic;
    margin: 16px 0 16px 0;
    display: flex;
}

.updates-text {
    font-style: italic;
    max-width: 600px;
    margin-top: 10px;
}

.alert-rule-hint {
    margin-left: 16px;
    display: inline;
}

.space-below {
    margin-bottom: 8px;
}

.alert-rule-hint span {
    display: inline;
}

.inline {
    display: inline;
}

.center-align {
    align-items: center
}

.center-justify {
    justify-content: center;
}

.space-between {
    display: flex;
    justify-content: space-between;
}

.alert-rules-threshold-text {
    margin: 0 0 0 20px;
    font-size: 13px;
}

.modal-details div {
    align-items: center;
}

.modal-details md-input-container {
    margin-bottom: 0;
}

md-toolbar.edit-temp-buttons {
    width: 100%;
    background-color: white !important;
    font-size: 100%;
    bottom: 16px;
    padding: 24px 16px 0 16px;
    border-top: 1px solid rgba(187, 187, 187, 0.7);
    justify-content: flex-end;
}

md-toolbar.edit-profile-buttons {
    width: 100%;
    /* background-color: white !important; */
    font-size: 100%;
    /* bottom: 16px; */
    padding: 12px 16px 0 16px;
    border-top: 1px solid rgba(187, 187, 187, 0.7);
    justify-content: flex-end;
}

md-toolbar.edit-profile-buttons button {
    margin-right: 32px;
}

.profile-items-list {
    max-height: 410px !important;
    overflow-y: auto;
}

md-toolbar.edit-profile-buttons .md-button {
    margin: 0 8px 15px 21px !important;
    min-width: 150px;
}

.report-status-buttons .md-button {
    min-width: 150px;
}

.report-modal-detail-header {
    font-size: 22px;
}

span.report-modal-detail {
    margin: 10px 0 23px 0;
}

md-input-container.report-modal-inclusions {
    margin: 0 0 16px 0;
}

span.report-modal-inclusions {
    width: 200px;
    margin-bottom: 24px;
    font-size: 16px;
    display: block;
}

span.report-modal-inclusions-value {
    font-size: 14px;
}

.report-modal-inclusions md-select {
    width: 156px;
}

.report-modal-inclusions md-checkbox {
    margin-bottom: 30px;
}

.report-modal-frequency md-checkbox {
    margin-bottom: 0px;
}

.alert-summary {
    margin: 0;
}

.alert-summary>div {
    margin: 8px 0 8px 0;
}

.alert-summary img {
    display: block;
    margin-left: auto;
    margin-right: 10px;
}

.alert-summary-status-items {
    align-items: center;
}

.alert-summary-status-category {
    margin-right: 5px;
    font-size: 22px;
}

.alert-summary-status-button {
    margin-left: 5px;
    margin-right: 10px
}

.alert-summary-status-bell {
    margin-right: 5px;
    margin-top: -3px;
    font-size: 30px;
    font-weight: bold;
}

.alert-summary-status-active {
    margin-left: 5px;
    font-size: 16px;
    color: #353535;
    font-weight: normal;
}

.alert-summary-header {
    color: #777777;
    font-size: 14px;
    margin-bottom: 6px;
}

.alert-summary-body {
    color: #353535;
    font-size: 16px;
}

.alert-summary-subheader {
    font-size: 13px;
}

.alert-rule-text {
    margin-left: 16px;
    display: flex;
    align-items: center;
    font-weight: normal;
}

.watering-column {
    padding: 0 20px;
    justify-content: center;
}

.watering-column>div {
    width: 100%;
}

.watering-column-flush {
    margin-bottom: 6px;
}

span.alert-tab-header {
    font-size: 18px;
    font-weight: 600;
}

span.alert-tab-note {
    color: #607D8B;
    font-size: 14px;
    margin-bottom: 4px;
    font-style: italic;
}

div.alert-tab-header {
    justify-content: space-between;
    align-items: baseline;
    margin-top: 16px;
    margin-left: 5px;
}

div.alert-tab-note {
    text-align: end;
}

.alert-detail-section {
    margin: 4px;
}

.alert-detail-section img {
    width: 35px;
    height: 35px;
    display: block;
    margin-right: 16px;
}

.alert-detail-hours {
    width: 130px;
    margin-top: 0;
}

.alert-detail-buttons {
    justify-content: flex-end;
    align-items: center;
    margin: 32px 0 8px 0;
}

.alert-detail-buttons .md-button {
    margin: 0 8px 15px 21px !important;
}

.md-toolbar-tools {
    justify-content: space-between;
    border-bottom: 1px solid rgba(187, 187, 187, 0.7);
}

.md-button {
    min-height: 25px;
    align-items: center;
    line-height: 0;
    margin: 0;
    padding: 0 16px;
    text-transform: none;
    font-size: 100%
}

.md-button.left {
    border-radius: 5px 0 0 5px;
    margin-right: 0px;
}

.md-button.middle {
    border-radius: 0;
    border-left: 1px solid rgba(230, 230, 230, 0.96);
    border-right: 1px solid rgba(230, 230, 230, 0.96);
}

.md-button.right {
    border-radius: 0 5px 5px 0;
    margin-left: 0px;
}

.toggle {
    min-width: 60px;
}

.toggle.md-button:not([disabled]):hover, .toggle.md-button.md-primary.md-raised:not([disabled]):hover {
    background-color: rgb(41, 60, 119);
    color: #fff;
    transition: 0.3s;
}

.md-button.active {
    /*background-color: rgb(41, 60, 119);*/
    transition: 0.3s;
}

.md-button.button-add-subtract {
    max-height: 40px;
    margin-right: 1px;
}

.toggle.md-button.button-preference {
    max-height: 40px;
    margin-right: 1px;
}

.toggle.md-button.button-preference {
    background-color: white;
    color: black;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .26)
}

.toggle.md-button.button-preference.selected {
    background-color: rgb(10, 19, 47);
    color: #fff;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
}

.toggle.units {
    max-height: 30px;
}

.panel-description {
    display: flex;
    justify-content: center;
    margin-top: 25px;
    margin-bottom: 25px;
    color: #565656;
}

.point-dialog {
    width: 600px;
}

.point-dialog .header {
    padding: 0;
    margin-top: 37px;
    width: 100%;
    justify-content: space-evenly;
}

.point-dialog .header .point-name {
    max-width: 70%
}

.point-dialog-add-point {
    color: #353535;
    font-size: 20px;
}

.dialog-header div {
    font-size: 28px;
    /* color: black; */
    font-weight: 600;
}

.dialog-sub-head {
    word-wrap: break-word;
    color: #444749;
    font-size: 22px;
    max-width: 80%;
}

.dialog-value {
    color: #444749;
    font-size: 30px;
    font-weight: bold;
}

.dialog-table-head {
    width: 212.21px;
    color: #353535;
    font-size: 18px;
    font-weight: 600;
}

.dialog-table-label {
    width: 40px;
    color: #353535;
    font-size: 16px;
}

.dialog-table-value {
    width: 342px;
    color: #353535;
    font-size: 14px;
}

.point-datepicker {
    padding: 0;
    border-color: #000000;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    margin-right: 0px;
    min-width: 140px;
}

.report .md-datepicker-button {
    max-width: 33px !important;
}

.dialog-history-header>div {
    margin: 4px 0px 4px 32px;
    height: 20px;
    width: 37px;
    color: #777777;
    font-family: "Source Sans Pro";
    font-size: 16px;
    letter-spacing: 0.68px;
}

.point-datepicker>.md-datepicker-button {
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    height: 30px;
    margin-left: 12px !important;
}

.point-datepicker>.md-datepicker-input-container {
    padding: 4px;
    border-color: #00000000;
    border-width: 0px;
    border-style: solid;
    border-radius: 4px;
}

.point-datepicker * .md-datepicker-input {
    min-width: 82px;
    max-width: 82px;
}

.point-datepicker>.md-datepicker-input-container>.md-datepicker-triangle-button {
    margin-right: 8px;
}

.md-datepicker-button.md-button.md-icon-button {
    width: auto;
    padding: 0;
}

.md-datepicker-calendar-icon {
    margin: 0px;
}

.bigger-font {
    font-size: 24px;
    margin-top: 36px;
    margin-left: 18px;
    margin-bottom: 10px;
}

/*---------------*/

/* Nested Select */

/*---------------*/

nested-select {
    display: block;
    width: 100%;
}

/*
 * Nested selects include an input container unless they're
 * permanently open.
 */

nested-select md-input-container {
    width: 100%;
    margin: 0 0;
}

/*
 * Most of the styling for the contents of the input
 * container come from Angular Material, but we do
 * need to override a few styles.
 */

nested-select-selection.md-select-value {
    border-bottom-color: rgba(0, 0, 0, 0.12);
    cursor: pointer;
}

nested-select-selection.md-select-value:focus, nested-select-selection.md-select-value.focused {
    border-bottom-color: black;
    border-bottom-width: 2px;
    outline: none;
    padding-bottom: 0;
}

/*
 * The select options themselves are enclosed in a menu
 * container. This container may be permanently open or
 * it may open/close based on a trigger. By default, the
 * menu is triggerable, so set it to display: none.
 * Also give it an absolute position and a z-index so
 * it pops over the main page content.
 */

nested-select-menu {
    display: none;
    position: relative;
    z-index: 100;
    width: 500px !important;
    max-height: 400px;
    overflow-y: auto;
    left: 0;
    right: 0;
    margin: auto;
}

nested-select-menu.selected-list {
    left: 740px;
}

.nested-select-arrow {
    display: none;
    margin-bottom: auto;
    position: absolute;
    left: 710px;
    margin-top: 140px;
}

/*
 * The menu container has a tabindex so that clicking
 * anywhere within it keeps the focus within the nested
 * select. (Otherwise, focus may revert to the body
 * element.) There's no need to visually distinguish
 * this focus, though, so disable the normal outline.
 */

nested-select-menu:focus {
    outline: none;
}

/*
 * Adjust the menu if it is permanently fixed open.
 */

nested-select[fixed-menu] nested-select-menu {
    display: block;
    position: static;
    z-index: inherit;
}

/*
 * When the meny is visible, show it.
 */

nested-select-menu.visible, img.visible {
    display: block;
}

/*
 * If the select only supports single values, there's
 * no need to show the accumulated values in the
 * input container, so shift the open menu up so that
 * it's placed "on top of" that container.
 */

nested-select:not([multiple]) nested-select-menu.visible {
    transform: translate(2px, -48px);
}

/*
 * If search/filter is available, the menu container
 * includes a header with the search field.
 */

nested-select-header {
    background-color: rgb(250, 250, 250);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding-left: 10.667px;
    height: 48px;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    width: auto;
}

nested-select-header input[type=search] {
    background-color: transparent;
    border: none;
    outline: none;
    height: 100%;
    width: 100%;
    padding: 0;
}

/*
 * Beneath the header is the actual menu content.
 */

nested-select md-content {
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0);
}

/*
 * The main content is a series of selectable
 * options. An option includes the text and
 * related styling cues (icons).
 */

nested-select-option {
    display: block;
    width: 100%;
}

.nested-select-text {
    display: flex;
    height: 40px;
    width: 100%;
    align-items: center;
}

/*
 * Each option may have a series of icons "in front
 * of it". There are two types of icons. If the
 * select is collapsible, then each option that has
 * children will include a button to collapse or
 * expand the display of those children. And if
 * the component only allows single selections, then
 * additional icons add visual guidance to the
 * heirarchy. (For multiple selects, the checkboxes
 * provide that visual guidance.)
 */

/*
 * Styles for the "guide" icons.
 */

nested-select-guide {
    left: 8px;
    position: relative;
    top: -8px;
}

/*
 * Styles for the collapse/expand buttons
 */

.nested-select-collapse.nested-select-collapse {
    flex-shrink: 0;
    left: 8px;
    margin: 0px;
    position: relative;
    width: 40px;
}

.nested-select-collapse ng-md-icon {
    color: rgba(0, 0, 0, 0.38);
}

.nested-select-collapse:focus ng-md-icon, .nested-select-collapse:hover ng-md-icon {
    color: rgba(0, 0, 0, 0.87);
}

.nested-select-collapse svg {
    transition: transform 200ms linear 0s;
}

.nested-select-collapse.collapsed svg {
    transform: rotate(-90deg);
}

/*
 * Individual options are implemented as Angular
 * Material checkboxes, and most of their styles
 * come from that library. We do need to make a
 * few adjustments, though.
 */

nested-select md-checkbox:last-of-type {
    display: block;
    margin-left: 16px;
    width: 100%;
}

nested-select md-checkbox>.md-label {
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 16px);
}

nested-select[multiple] md-checkbox>.md-label {
    width: calc(100% - 40px - 16px);
}

/*
 * If the component is using single select, don't
 * display the actual checkboxes (and don't shift
 * the label over to leave room for them).
 * Also display any checked text using the primaru
 * color.
 */

nested-select:not([multiple]) md-checkbox>.md-container {
    display: none;
}

nested-select:not([multiple]) md-checkbox>.md-label {
    margin-left: 0;
}

nested-select:not([multiple]) md-checkbox.md-checked {
    color: #3F51B5;
}

/*
 * Since the md-checkbox elements might not
 * span the entire width of the menu, we use
 * a pseudo-element to render the focus, hover,
 * and selected styles. We can extend it the
 * full width using a bit of vw trickery.
 */

nested-select md-checkbox:focus::before, nested-select md-checkbox:hover::before, nested-select:not([multiple]) md-checkbox.md-checked::before {
    content: "";
    position: absolute;
    background-color: rgb(238, 238, 238);
    transform: translate(-100vw, -8px);
}

/*
 * Keep the icons visible even when the option is
 * focus/hover/checked by raising their z-index.
 */

nested-select button, nested-select-guide {
    z-index: 101;
}

nested-select[fixed-menu] button, nested-select[fixed-menu] nested-select-guide {
    z-index: 1;
}

/*
 * Handle collapse/expand via CSS. Someday
 * this might be animated.
 */

nested-select-options.collapsed {
    display: none;
}

md-progress-circular.white svg path {
    stroke: white;
}

.errors {
    background-color: #d99d3b;
    z-index: 50;
}

.errors li {
    list-style-type: none;
}

.alert-badge {
    color: #ffffff;
    background-color: #90261d;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    font-family: "Source Sans Pro";
    font-size: 16px;
    letter-spacing: 0.68px;
    text-align: center;
    text-decoration: none;
    font-style: normal;
    font-weight: 500;
    align-items: center;
    display: flex;
    justify-content: center;
}

.issues-badge {
    color: #ffffff;
    background-color: #ff3e3a;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-family: "Source Sans Pro";
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    text-decoration: none;
    font-style: normal;
    font-weight: 500;
    display: block;
    margin-top: -30px;
    margin-left: -18px;
}

.barchart {
    width: 450px;
    height: 42px;
}

li.disabled-item-template {
    cursor: default !important;
    padding: 0 !important;
    margin: 0 15px !important;
    transition: none !important;
    background-color: white !important;
}

div.disabled-item-template {
    cursor: default !important;
    transition: none !important;
    background-color: white !important;
    font-weight: bold;
}

.lighting-value {
    border-bottom-style: solid;
    border-bottom-width: 2px;
    border-bottom-color: #cccccc;
    padding-top: 1px;
}

.lighting-value-input {
    text-align: center;
    padding-top: 10px !important;
}

md-chip.dropping:before {
    content: "↓";
    position: absolute;
    top: -20px;
    color: black;
}

md-chip.dropping--before:before {
    left: -9px;
}

md-chip.dropping--after:before {
    right: -9px;
}

.device-progress.md-accent .md-container {
    background-color: rgb(200, 200, 200);
}

.nav-bar-tab-icon-selected {
    fill: #607D8B;
    size: 24;
    font-size: 50px;
}

.nav-bar-tab-icon-not-selected {
    fill: white;
    size: 24;
}

.nav-bar-tab-text {
    font-size: 20px;
}

.no-text-selection {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.marketing-message-banner {
    height: 50px; 
    width: 100%; 
    background-color: #D99D3B;
    position: relative;
    top: 0px;
}

.marketing-message-banner-text {
    text-align: center;
    position: relative;
    top: 8px;
    margin: auto;
    font-size: large;
    width: 100%; 
}
.chip {
    background-color: #44606E; 
    color: white; 
    height: 14px; 
    line-height: 14px; 
    font-size: 12px; 
    margin-left: 8px; 
    margin-top: 1px; 
    border-radius: 16px; 
    display: block; 
    padding: 0 12px; 
    float: left; 
    box-sizing: border-box; 
    max-width: 100%; 
    position: relative;
}
.chip-critical {
    background-color: #90261d;
}
.chip-warning {
    background-color: #d99d3b;
}