:root {
  --textColor: #212529;
  --light: #f8f9fa;
  --white-50: #fafafa;
  --blue: #007bff;
  --hover-blue: #1caaff;
  --medium-blue: #C3E1FF;
  --white: #fff;
  --light-blue: #E5F2FF;
  --dark-blue: #205493;
  --very-dark-blue: #083568;
  --very-light-blue: #f4f8fc;
  --midBlue: #7dbcff;
  --beige: #F7F3F3;
  --background: #f2f7fc;
  --black: #202020;
  --darkblack: #202020;
  --highlight: #afd2f5;
  --lightBorder: #e5e5e5;
  --table-border: #e5e5e5;
  --lighter-border: #e0e0e0;
  --border-color: #dee2e6;
  --secondaryBackground: #ccc;
  --connector-gray: #c4c4c4;
  --gray-background: #f8f8f8;
  --gray: #777777;
  --dropdown-gray: #d8d8d8;
  --dark-gray: #6c757d;
  --light-gray: #f0f0f0;
  --red: #b82b2b;
  --orange: #d77806;
  --green: #1eb942;
  --bright-red: #F25959;
  --red2: #e23939;
  --new-red: #F84821;
  --radius: 6px;
  --big-radius: 12px;
  --learn-box-shadow: rgba(169, 194, 219, 0.12);
  --aws: #EC6A10;
  --aws-color: #fff;
  --gcp: #1A73E8;
  --gcp-color: #fff;
  --healthchecks: #0c6131;
  --healthchecks-color: #fff;
  --apex-ping: #202020;
  --apex-ping-color: #fff;
  --uptime-robot: #4CA74C;
  --uptime-robot-color: #fff;
  --pingdom: #fff000;
  --pingdom-color: #181818;
  --sentry: #31293b;
  --sentry-color: #ffffff;
  --twilio: #f22f46;
  --twilio-color: #ffffff;
  --azure: #2665D0;
  --azure-color: #ffffff;
  --honeybadger: #EC6322;
  --honeybadger-color: #ffffff;
  --sematext: #1074BF;
  --sematext-color: #ffffff;
  --travisci: #F3EEAE;
  --travisci-color: #202020;
  --rollbar: #0F4C91;
  --rollbar-color: #ffffff;
  --needle: #D2D6FC;
  --needle-color: #5666EF;
  --webhook: #E8F1FF;
  --webhook-color: #0777FE;
  --heroku: #400099;
  --heroku-color: #ffffff;
  --datadog: #9E7CC1;
  --datadog-color: #ffffff;
  --cronitor: #5AB8D5;
  --cronitor-color: #202020;
  --bugsnag: #031347;
  --bugsnag-color: #ffffff;
  --prometheus: #E6572C;
  --prometheus-color: #ffffff;
  --grafana: #E86D21;
  --grafana-color: #ffffff;
  --influxdata: #ffffff;
  --influxdata-color: #202020;
  --instana: #5BB1AE;
  --instana-color: #202020;
  --zapier: #FF4A00;
  --zapier-color: #ffffff;
  --zapier-alert: #FFC4AC;
  --librato: #377DA5;
  --librato-color: #ffffff;
  --newrelic: #4B959C;
  --newrelic-color: #ffffff;
  --appsignal: #21375A;
  --appsignal-color: #ffffff;
  --checkly: #45C8F1;
  --checkly-color: #ffffff;
  --site24x7: #7EB035;
  --site24x7-color: #313131;
  --stackify: #9CD378;
  --stackify-color: #202020;
  --scout-apm: #F05929;
  --scout-apm-color: #ffffff;
  --ohdear: #e32929;
  --ohdear-color: #ffffff;
  --email: #E8F1FF;
  --email-color: #0777FE;
  --nixstats: #5ABFEF;
  --nixstats-color: #ffffff;
  --serverdensity: #202020;
  --serverdensity-color: #ffffff;
  --raygun: #202020;
  --raygun-color: #ffffff;
  --lightstep: #559948;
  --lightstep-color: #ffffff;
  --runscope: #1B70E0;
  --runscope-color: #ffffff;
  --honeycomb: #f4b827;
  --honeycomb-color: #202020;
  --graylog: #C84B2C;
  --graylog-color: #ffffff;
  --checkmk: #77D589;
  --checkmk-color: #202020;
  --hyperping: #3757FF;
  --hyperping-color: #FFFFFF;
  --epsagon: #A5BCFF;
  --epsagon-color: #515050;
  --uptime: #4E73FE;
  --uptime-color: #202020;
  --splunk: #61A024;
  --splunk-color: #202020;
  --sumologic: #001A9A;
  --sumologic-color: #FFFFFF;
  --thousandeyes: #FB7C32;
  --thousandeyes-color: #202020;
  --loggly: #F99D1C;
  --loggly-color: #202020;
  --elastic: #02B9AD;
  --elastic-color: #202020;
  --appoptics: #F1981B;
  --appoptics-color: #000000;
  --nodeping: #F76300;
  --nodeping-color: #000000;
  --scaylr: #54767F;
  --scaylr-color: #ffffff;
  --moogsoft: #FA385D;
  --moogsoft-color: #000000;
  --appdynamics: #18212A;
  --appdynamics-color: #ffffff;
  --dynatrace: #B4DC00;
  --dynatrace-color: #000000;
  --copperegg: #D5805B;
  --copperegg-color: #000000;
  --coralogix: #69D9AE;
  --coralogix-color: #000000;
  --errorception: #F30F04;
  --errorception-color: #000000;
  --elastalert: #000000;
  --elastalert-color: #ffffff;
  --logdna: #D54158;
  --logdna-color: #000000;
  --zebrium: #007CF7;
  --zebrium-color: #000000;
  --uptimekuma: #cccccc;
  --uptimekuma-color: #000000;
  --uptimekuma: #d23730;
  --uptimekuma-color: #ffffff;
  --operational: #5ABB74;
  --degraded-performance: #FBBC05;
  --partial-outage: #EC8100;
  --critical-outage: #EA4335;
  --planned-maintenance: #093990;
  --green-light: #EAF6F2;
  --beige-light: #FAF5F0;
  --red-pastel: #F7F3F3;
  --green-pastel: #F3F7F6;
  --purple-pastel: #F6F3F7;
  --yellow-pastel: #F7F7F3;
  --blue-pastel: #F3F4F7;
}

@media (prefers-color-scheme: dark) {
  body.system {
    --blue: #3395FF;
    --background: red;
    --white: #242729;
    --black: rgba(255, 255, 255, 0.9);
    --black-no-opacity: rgba(255, 255, 255);
    --beige: #373C3F;
    --textColor: #fff;
    --light: #2D3134;
    --gray: #A7A9B0;
    --light-gray: #474C50;
    --gray-background: #373C3F;
    --highlight: --black-no-opacity;
    --lighter-border: #535353;
    --lightBorder: #363A3E;
    --table-border: #4B4C4F;
    --light-blue: #474C50;
    --dropdown-gray: #45494B;
    --connector-gray: #474C50;
    --very-light-blue: #363A3E;
    --border-color: #535353;
    --learn-box-shadow: rgb(87 88 89 / 12%);
    --fc-neutral-bg-color: var(--dropdown-gray);
    --fc-border-color: var(--border-color);
    --fc-list-event-hover-bg-color: var(--dropdown-gray);
  }
}

.dark {
  --blue: #3395FF;
  --background: #202020;
  --white: #242729;
  --black: rgba(255, 255, 255, 0.9);
  --black-no-opacity: rgba(255, 255, 255);
  --beige: #373C3F;
  --red-pastel: #373C3F;
  --green-pastel: #373C3F;
  --purple-pastel: #373C3F;
  --yellow-pastel: #373C3F;
  --blue-pastel: #373C3F;
  --green-light: #EAF6F2;
  --textColor: #fff;
  --light: #2D3134;
  --gray: #A7A9B0;
  --light-gray: #474C50;
  --gray-background: #373C3F;
  --highlight: --black-no-opacity;
  --lighter-border: #535353;
  --lightBorder: #363A3E;
  --table-border: #4B4C4F;
  --light-blue: #474C50;
  --dropdown-gray: #45494B;
  --connector-gray: #474C50;
  --very-light-blue: #363A3E;
  --border-color: #535353;
  --learn-box-shadow: rgb(87 88 89 / 12%);
  --fc-neutral-bg-color: var(--dropdown-gray);
  --fc-border-color: var(--border-color);
  --fc-list-event-hover-bg-color: var(--dropdown-gray);
}

.landing-header .header {
  background: #f6f8f8;
  border-bottom: 1px solid #ebebeb;
}

.snapshot {
  background: #ebebeb;
  border: 1px solid #dfdfdf;
}
.snapshot img.dashboard {
  padding: 20px 10px;
}

#login-block .illustration {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  background-color: #007bff;
  background: url("/images/login-screen.svg");
  background-repeat: repeat;
  background-size: cover;
}
#login-block .illustration h1 {
  font-size: 1.875rem;
  line-height: 2rem;
  font-weight: 600;
}

#divider-or {
  position: relative;
  z-index: 1;
  width: 100%;
  border-top: 1px solid var(--border-color);
}
#divider-or .text {
  position: absolute;
  background: var(--white);
  width: 3rem;
  text-align: center;
  top: -12px;
  left: calc(50% - 1.5rem);
  z-index: 2;
  color: var(--gray);
}

span.login-tag {
  background: #fff;
  color: #007bff;
  padding: 0.75rem 0.85rem;
  border-radius: 2rem;
  font-size: 0.75rem;
}

#access-control--block .custom-nav-tabs, #show-user-permissions .custom-nav-tabs, #new-role--form .custom-nav-tabs, #edit-role--form .custom-nav-tabs {
  border: 1px solid var(--lightBorder);
  width: fit-content;
  border-radius: 4px;
  padding: 0.2rem;
  height: 2.6rem;
  background: var(--light-gray);
}
#access-control--block .custom-nav-tabs .nav-link, #show-user-permissions .custom-nav-tabs .nav-link, #new-role--form .custom-nav-tabs .nav-link, #edit-role--form .custom-nav-tabs .nav-link {
  height: 1.95rem;
  border: 0;
  padding: 0.2rem 0.75rem;
  padding-top: 4px;
}
#access-control--block .custom-nav-tabs .nav-link.active, #show-user-permissions .custom-nav-tabs .nav-link.active, #new-role--form .custom-nav-tabs .nav-link.active, #edit-role--form .custom-nav-tabs .nav-link.active {
  background: var(--white);
  border: 1px solid var(--lightBorder);
  box-shadow: 1px 1px 1px var(--gray);
  border-radius: 4px;
  color: var(--black) !important;
}
#access-control--block .custom-nav-tabs .nav-link:hover:not(.active), #show-user-permissions .custom-nav-tabs .nav-link:hover:not(.active), #new-role--form .custom-nav-tabs .nav-link:hover:not(.active), #edit-role--form .custom-nav-tabs .nav-link:hover:not(.active) {
  color: var(--black) !important;
  cursor: pointer;
}
#access-control--block .role-filter, #show-user-permissions .role-filter, #new-role--form .role-filter, #edit-role--form .role-filter {
  border: 1px dashed var(--gray);
  border-radius: 2rem;
  padding: 0.2rem 1rem;
  margin-right: 1rem;
  cursor: pointer;
}
#access-control--block .role-filter.active, #show-user-permissions .role-filter.active, #new-role--form .role-filter.active, #edit-role--form .role-filter.active {
  border: 1px dashed var(--blue);
  color: var(--blue) !important;
}
#access-control--block .role-filter.active .filter-applied, #show-user-permissions .role-filter.active .filter-applied, #new-role--form .role-filter.active .filter-applied, #edit-role--form .role-filter.active .filter-applied {
  display: inline-block !important;
}
#access-control--block .role-filter.active .icon, #show-user-permissions .role-filter.active .icon, #new-role--form .role-filter.active .icon, #edit-role--form .role-filter.active .icon {
  display: none !important;
}
#access-control--block .role, #show-user-permissions .role, #new-role--form .role, #edit-role--form .role {
  width: 12rem;
  height: 6rem;
  border: 1px solid var(--lightBorder);
  color: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-align: left;
}
#access-control--block .role.active, #show-user-permissions .role.active, #new-role--form .role.active, #edit-role--form .role.active {
  border: 1px solid #8AC2FF;
  background: var(--light-blue);
  color: var(--black);
}
#access-control--block .role.active .role-icon svg path, #show-user-permissions .role.active .role-icon svg path, #new-role--form .role.active .role-icon svg path, #edit-role--form .role.active .role-icon svg path {
  fill: var(--blue) !important;
}
#access-control--block .role.active .role-icon.responder svg path, #show-user-permissions .role.active .role-icon.responder svg path, #new-role--form .role.active .role-icon.responder svg path, #edit-role--form .role.active .role-icon.responder svg path {
  fill: var(--orange) !important;
}
#access-control--block .role.active .role-icon.manager svg path, #show-user-permissions .role.active .role-icon.manager svg path, #new-role--form .role.active .role-icon.manager svg path, #edit-role--form .role.active .role-icon.manager svg path {
  fill: var(--yellow) !important;
}
#access-control--block .role.active .role-icon.admin svg path, #show-user-permissions .role.active .role-icon.admin svg path, #new-role--form .role.active .role-icon.admin svg path, #edit-role--form .role.active .role-icon.admin svg path {
  fill: var(--blue) !important;
}
#access-control--block .role.active .role-icon.viewer svg path, #show-user-permissions .role.active .role-icon.viewer svg path, #new-role--form .role.active .role-icon.viewer svg path, #edit-role--form .role.active .role-icon.viewer svg path {
  fill: var(--gray) !important;
}
#access-control--block .role:hover, #show-user-permissions .role:hover, #new-role--form .role:hover, #edit-role--form .role:hover {
  border: 1px solid #8AC2FF;
}
#access-control--block .role:hover .role-icon svg path, #show-user-permissions .role:hover .role-icon svg path, #new-role--form .role:hover .role-icon svg path, #edit-role--form .role:hover .role-icon svg path {
  fill: var(--blue) !important;
}
#access-control--block .role:hover .role-icon.responder svg path, #show-user-permissions .role:hover .role-icon.responder svg path, #new-role--form .role:hover .role-icon.responder svg path, #edit-role--form .role:hover .role-icon.responder svg path {
  fill: var(--orange) !important;
}
#access-control--block .role:hover .role-icon.manager svg path, #show-user-permissions .role:hover .role-icon.manager svg path, #new-role--form .role:hover .role-icon.manager svg path, #edit-role--form .role:hover .role-icon.manager svg path {
  fill: var(--yellow) !important;
}
#access-control--block .role:hover .role-icon.admin svg path, #show-user-permissions .role:hover .role-icon.admin svg path, #new-role--form .role:hover .role-icon.admin svg path, #edit-role--form .role:hover .role-icon.admin svg path {
  fill: var(--blue) !important;
}
#access-control--block .role:hover .role-icon.viewer svg path, #show-user-permissions .role:hover .role-icon.viewer svg path, #new-role--form .role:hover .role-icon.viewer svg path, #edit-role--form .role:hover .role-icon.viewer svg path {
  fill: var(--gray) !important;
}
#access-control--block .role-members, #show-user-permissions .role-members, #new-role--form .role-members, #edit-role--form .role-members {
  overflow-y: auto;
  overflow-x: hidden;
}
#access-control--block .custom-control-label, #show-user-permissions .custom-control-label, #new-role--form .custom-control-label, #edit-role--form .custom-control-label {
  cursor: pointer;
}
#access-control--block .permissions .permission--text, #access-control--block .permissions .permission--checkbox, #show-user-permissions .permissions .permission--text, #show-user-permissions .permissions .permission--checkbox, #new-role--form .permissions .permission--text, #new-role--form .permissions .permission--checkbox, #edit-role--form .permissions .permission--text, #edit-role--form .permissions .permission--checkbox {
  cursor: pointer;
  margin: 0.2rem 0;
}
#access-control--block .permissions .permission-box, #show-user-permissions .permissions .permission-box, #new-role--form .permissions .permission-box, #edit-role--form .permissions .permission-box {
  height: 9.5rem;
  margin-right: 1rem;
  border: 1px solid var(--lightBorder);
  cursor: pointer;
  text-align: left;
  border-radius: 4px;
}
#access-control--block .permissions .custom-control-input:checked ~ .custom-control-label::before, #show-user-permissions .permissions .custom-control-input:checked ~ .custom-control-label::before, #new-role--form .permissions .custom-control-input:checked ~ .custom-control-label::before, #edit-role--form .permissions .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #4caf50 !important;
  border-color: #4caf50 !important;
}
#access-control--block .permissions .custom-control-input:disabled ~ .custom-control-label::before, #show-user-permissions .permissions .custom-control-input:disabled ~ .custom-control-label::before, #new-role--form .permissions .custom-control-input:disabled ~ .custom-control-label::before, #edit-role--form .permissions .custom-control-input:disabled ~ .custom-control-label::before {
  cursor: not-allowed;
}
#access-control--block .new-role--link, #show-user-permissions .new-role--link, #new-role--form .new-role--link, #edit-role--form .new-role--link {
  width: 12rem;
  height: 6rem;
  border: 1px dashed var(--border-color) !important;
  cursor: pointer;
}

.checkbox-empty, .checkbox-selected {
  cursor: pointer;
}

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

.role--member {
  height: 4.3rem;
  border-top: 1px solid var(--lightBorder);
}
.role--member:hover {
  background: var(--highlight-color);
}
.role--member:hover .remove-user-modal {
  display: block !important;
}
.role--member:hover .view-and-edit-permissions {
  display: block !important;
}

.view-and-edit-permissions {
  cursor: pointer;
}
.view-and-edit-permissions:hover .caret-sign {
  display: inline-block !important;
  transition: all 0.2s ease-in-out;
  transform: translateX(0.1rem);
}

.select2-results__option[aria-selected=true] {
  background: #afafaf !important;
}

.teams--all-teams.disabled .dropdown-item {
  cursor: not-allowed;
  pointer-events: none;
}

.radius-8px {
  border-radius: 8px !important;
}

.break-word {
  word-break: break-word !important;
}

.search-in-teams {
  border: 1px solid var(--lightBorder);
  border-radius: 4px;
}
.search-in-teams #user-search {
  border: none;
  outline: none;
  box-shadow: none;
}
.search-in-teams #user-search:focus {
  box-shadow: none;
  outline: none;
  border: none;
}
.search-in-teams:focus-within {
  border: 1px solid var(--blue);
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.teams-search-header {
  background: var(--white);
  position: sticky;
  top: 3rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  z-index: 50;
}

.admin-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 0.833328L0.5 4.16666V9.16666C0.5 13.7917 3.7 18.1167 8 19.1667C12.3 18.1167 15.5 13.7917 15.5 9.16666V4.16666L8 0.833328ZM8 4.16666C8.66304 4.16666 9.29893 4.43005 9.76777 4.89889C10.2366 5.36774 10.5 6.00362 10.5 6.66666C10.5 7.3297 10.2366 7.96559 9.76777 8.43443C9.29893 8.90327 8.66304 9.16666 8 9.16666C7.33696 9.16666 6.70107 8.90327 6.23223 8.43443C5.76339 7.96559 5.5 7.3297 5.5 6.66666C5.5 6.00362 5.76339 5.36774 6.23223 4.89889C6.70107 4.43005 7.33696 4.16666 8 4.16666ZM12.275 14.1667C11.2667 15.7083 9.75833 16.8667 8 17.4333C6.24167 16.8667 4.73333 15.7083 3.725 14.1667C3.44167 13.75 3.2 13.3333 3 12.8917C3 11.5167 5.25833 10.3917 8 10.3917C10.7417 10.3917 13 11.4917 13 12.8917C12.8 13.3333 12.5583 13.75 12.275 14.1667Z' fill='%23007bff'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.responder-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='18' viewBox='0 0 16 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 16.1052H7.4665V18H0V16.1052ZM4.98132 14.76L2.27209 11.9557C2.2401 11.9273 2.2295 11.8895 2.2081 11.8601L9.44571e-06 13.0831V15.1579H7.46651V13.1495L5.74931 14.7886C5.46118 14.9779 5.07728 14.8642 4.98128 14.76L4.98132 14.76ZM13.5892 10.7053L12.064 10.0137L11.04 9.54009C10.8906 9.46426 10.7093 9.46426 10.561 9.52968C10.4105 9.59593 10.3051 9.72859 10.2719 9.87067C10.1131 10.6665 9.13059 11.2728 7.96805 11.2728C6.8055 11.2728 5.78133 10.675 5.61077 9.88966C5.57877 9.74758 5.47219 9.62434 5.31204 9.5571C5.16267 9.49085 4.9921 9.49085 4.84274 9.56651L3.85076 10.0308L2.37889 10.7053L5.4082 13.5473L7.97881 12.1841L10.5708 13.5473L13.5892 10.7053ZM13.7172 11.8327C13.7055 11.8327 13.7055 11.8421 13.7055 11.8421L10.9963 14.7694C10.752 14.9967 10.3242 14.8736 10.2187 14.7892L8.5333 13.2442V15.1579H15.9998V13.0833L13.7172 11.8327ZM8.5335 17.9998H16V16.105H8.5335V17.9998ZM3.73361 5.21045C3.73361 4.9491 3.97263 4.73682 4.26707 4.73682H4.34277C4.29795 4.60994 4.26707 4.47827 4.26707 4.339V2.29258C4.26707 1.55081 4.94639 0.94746 5.78156 0.94746H5.95231C6.12512 0.94746 6.29048 0.973067 6.44507 1.02048C6.60931 0.434812 7.20567 0 7.91489 0H8.08564C8.79491 0 9.39233 0.434812 9.55547 1.02031C9.71115 0.972899 9.8754 0.947455 10.0482 0.947455H10.219C11.0541 0.947455 11.7335 1.5508 11.7335 2.29258V4.33883C11.7335 4.4781 11.7026 4.60976 11.6589 4.73664L11.7335 4.73681C12.0268 4.73681 12.2667 4.9491 12.2667 5.21045C12.2669 5.47197 12.0268 5.68425 11.7335 5.68425H11.1617C11.2694 5.97221 11.3281 6.27453 11.3281 6.58428C11.3281 8.18346 9.86465 9.48316 8.06426 9.48316C6.25849 9.48316 4.78957 8.18249 4.78957 6.58428C4.78957 6.27452 4.84817 5.97235 4.95605 5.68425H4.26707C3.97262 5.68425 3.7336 5.47196 3.7336 5.21045L3.73361 5.21045ZM5.85632 6.58412C5.85632 7.66026 6.8472 8.5367 8.06423 8.5367C9.27496 8.5367 10.2616 7.66128 10.2604 6.58412C10.2604 6.25817 10.1516 5.96162 9.98103 5.68409H6.13569C5.96605 5.9618 5.8563 6.25834 5.8563 6.58412H5.85632Z' fill='%23d77806'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.manager-icon {
  background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' width='24' style='fill: %23ffc107' viewbox='0 0 24 24'%3E%3Cpath d='m5.825 22 1.625-7.025L2 10.25l7.2-.625L12 3l2.8 6.625 7.2.625-5.45 4.725L18.175 22 12 18.275Z'/%3E%3C/svg%3E");
  margin-left: -2px !important;
  margin-top: -1px !important;
  background-repeat: no-repeat;
}
.manager-icon.active {
  margin-top: -7px !important;
  margin-left: -2px !important;
}

.viewer-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='14' viewBox='0 0 20 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 4.5C9.33696 4.5 8.70108 4.76339 8.23224 5.23223C7.76339 5.70107 7.5 6.33696 7.5 7C7.5 7.66304 7.76339 8.29893 8.23224 8.76777C8.70108 9.23661 9.33696 9.5 10 9.5C10.663 9.5 11.2989 9.23661 11.7678 8.76777C12.2366 8.29893 12.5 7.66304 12.5 7C12.5 6.33696 12.2366 5.70107 11.7678 5.23223C11.2989 4.76339 10.663 4.5 10 4.5ZM10 11.1667C8.89493 11.1667 7.83513 10.7277 7.05372 9.94628C6.27232 9.16488 5.83334 8.10507 5.83334 7C5.83334 5.89493 6.27232 4.83512 7.05372 4.05372C7.83513 3.27232 8.89493 2.83333 10 2.83333C11.1051 2.83333 12.1649 3.27232 12.9463 4.05372C13.7277 4.83512 14.1667 5.89493 14.1667 7C14.1667 8.10507 13.7277 9.16488 12.9463 9.94628C12.1649 10.7277 11.1051 11.1667 10 11.1667ZM10 0.75C5.83334 0.75 2.275 3.34167 0.833336 7C2.275 10.6583 5.83334 13.25 10 13.25C14.1667 13.25 17.725 10.6583 19.1667 7C17.725 3.34167 14.1667 0.75 10 0.75Z' fill='%23777'/%3E%3C/svg%3E");
  top: 2px !important;
  background-repeat: no-repeat;
}

.custom-icon {
  background-image: url("data:image/svg+xml,%0A%3Csvg width='16' height='18' viewBox='0 0 16 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.66667 9.11667V0.666672H3V9.11667C1.56667 9.49167 0.5 10.7833 0.5 12.3333C0.5 13.8833 1.56667 15.175 3 15.55V17.3333H4.66667V15.55C6.1 15.175 7.16667 13.8833 7.16667 12.3333C7.16667 10.7833 6.1 9.49167 4.66667 9.11667ZM3.83333 10.6667C4.75 10.6667 5.5 11.4167 5.5 12.3333C5.5 13.25 4.75 14 3.83333 14C2.91667 14 2.16667 13.25 2.16667 12.3333C2.16667 11.4167 2.91667 10.6667 3.83333 10.6667ZM13 0.666672H11.3333V2.45C9.9 2.825 8.83333 4.11667 8.83333 5.66667C8.83333 7.21667 9.9 8.50834 11.3333 8.88334V17.3333H13V8.88334C14.4333 8.50834 15.5 7.21667 15.5 5.66667C15.5 4.11667 14.4333 2.825 13 2.45V0.666672ZM12.1667 4.00001C13.0833 4.00001 13.8333 4.75 13.8333 5.66667C13.8333 6.58334 13.0833 7.33334 12.1667 7.33334C11.25 7.33334 10.5 6.58334 10.5 5.66667C10.5 4.75 11.25 4.00001 12.1667 4.00001Z' fill='%23005CE5'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.additional-permissions {
  height: 9.5rem;
}

.degraded-performance-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 10H8V4H10V10ZM8 12H10V14H8V12ZM12.73 0H5.27L0 5.27V12.73L5.27 18H12.73L18 12.73V5.27L12.73 0Z' fill='%23FBBC05'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.partial-outage-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg' style='position: relative; top:-2px'%3E%3Cpath d='M13 14H11V9H13V14ZM13 18H11V16H13V18ZM1 21H23L12 2L1 21Z' fill='%23FF7A00'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.critical-outage-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' style='margin-left:0px' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.5 9.9H4.5V8.1H13.5V9.9ZM9 0C7.8181 0 6.64778 0.232792 5.55585 0.685084C4.46392 1.13738 3.47177 1.80031 2.63604 2.63604C0.948211 4.32387 0 6.61305 0 9C0 11.3869 0.948211 13.6761 2.63604 15.364C3.47177 16.1997 4.46392 16.8626 5.55585 17.3149C6.64778 17.7672 7.8181 18 9 18C11.3869 18 13.6761 17.0518 15.364 15.364C17.0518 13.6761 18 11.3869 18 9C18 7.8181 17.7672 6.64778 17.3149 5.55585C16.8626 4.46392 16.1997 3.47177 15.364 2.63604C14.5282 1.80031 13.5361 1.13738 12.4442 0.685084C11.3522 0.232792 10.1819 0 9 0Z' fill='%23D5291B'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.planned-maintenance-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' style='margin-top:1px' viewBox='0 0 18 18' fill='' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.7643 14.7124L10.3299 7.23295C11.0652 5.34256 10.6567 3.1234 9.1045 1.56176C7.47058 -0.0820609 5.0197 -0.410826 3.059 0.493277L6.57193 4.0275L4.12105 6.49323L0.526426 2.95901C-0.453925 4.9316 -0.045445 7.39734 1.58847 9.04116C3.1407 10.6028 5.34649 11.0137 7.22549 10.274L14.6598 17.7534C14.9866 18.0822 15.4768 18.0822 15.8036 17.7534L17.6826 15.863C18.0911 15.5343 18.0911 14.9589 17.7643 14.7124Z' fill='%23093990'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.operational-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 0C4.05 0 0 4.05 0 9C0 13.95 4.05 18 9 18C13.95 18 18 13.95 18 9C18 4.05 13.95 0 9 0ZM7.2 13.5L2.7 9L3.969 7.731L7.2 10.953L14.031 4.122L15.3 5.4L7.2 13.5Z' fill='%235ABB74'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}

.color-picker .color-picker-preview {
  width: 2rem;
  height: 2rem;
  border: 1px solid #ccc;
  border-radius: 5px;
  appearance: none;
}
.color-picker .color-picker-preview::-webkit-color-swatch-wrapper {
  padding: 0;
}
.color-picker .color-picker-preview::-webkit-color-swatch {
  border: none;
  border-radius: 3px;
}
.color-picker .color-picker-preview::-webkit-color-swatch-popup {
  border: none;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  border-radius: 5px;
}
.color-picker .color-picker-preview::-webkit-color-picker {
  border: none;
}
.color-picker .color-picker-preview::-webkit-color-picker::-webkit-color-swatch-wrapper {
  border: none;
}
.color-picker .color-input {
  display: flex;
  align-self: start;
  margin-left: 0.5rem;
}
.color-picker .color-input .color-input-hash {
  background: var(--light-gray);
  color: var(--gray);
}

.justify-self-end {
  justify-self: end !important;
}

.public-header {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  position: relative;
}
@media (max-width: 767px) {
  .public-header {
    display: none !important;
  }
}
.public-header .status-page-header-logo {
  display: flex;
  align-items: center;
  justify-content: center;
}
.public-header .status-page-header-logo img {
  height: 2rem;
  width: 8rem;
}

.page-status h1 {
  font-size: 2rem !important;
}

.public-page-cover {
  height: 20rem;
}
@media (max-width: 1000px) {
  .public-page-cover .page-status {
    font-size: 2.1rem !important;
  }
  .public-page-cover #subscribe--button {
    right: 50% !important;
    margin-top: -5rem;
  }
}
.public-page-cover .cover-image {
  max-height: 4rem;
  width: 16rem;
}
.public-page-cover .cover-image img {
  object-fit: contain;
  max-width: 16rem;
  height: auto;
}

.public-footer {
  height: 3rem;
  margin-top: auto;
  width: 100%;
}
.public-footer .copyright-and-social-links {
  margin-top: 6rem;
}
.public-footer .footer-logo {
  max-width: 8rem;
  height: 3rem;
  object-fit: contain;
}
.public-footer .footer-logo img {
  max-height: 4rem;
}
.public-footer .social-links svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 767px) {
  .public-footer .copyright-and-social-links {
    margin-top: 3rem !important;
  }
  .public-footer .logo-and-links {
    flex-direction: column !important;
  }
  .public-footer .footer-logo {
    max-width: 8rem;
    object-fit: contain;
    display: block;
    margin: 0.5rem auto;
  }
  .public-footer .footer-logo img {
    max-height: 3rem;
  }
  .public-footer .footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 6rem;
  }
  .public-footer .footer-links a {
    text-align: center;
    margin-top: 0.5rem !important;
  }
  .public-footer .copyright-and-social-links {
    flex-direction: column-reverse !important;
  }
  .public-footer .copyright-and-social-links .social-links {
    margin-bottom: 1rem !important;
  }
  .public-footer .copyright-and-social-links .copyright-and-terms {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .public-footer .copyright-and-social-links .copyright-and-terms .terms-and-privacy {
    margin-top: 0.5rem !important;
  }
}

#theme-hero .form-check-input {
  width: 1.15rem !important;
  height: 1.15rem !important;
  margin-top: 0.1rem !important;
}

#theme-controls .disabled .content, .components-display .disabled .content {
  background: var(--light-gray);
  opacity: 0.5;
  cursor: not-allowed;
}
#theme-controls .disabled input:not([type="radio"]), .components-display .disabled input:not([type="radio"]) {
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.5;
}
#theme-controls .disabled .upload-button, .components-display .disabled .upload-button {
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.5;
}

.pcr-button {
  border: 2px solid var(--lightBorder) !important;
  outline: none !important;
}
.pcr-button:after {
  outline: none !important;
  border-radius: 0 !important;
}

.hamburger-menu-container {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
@media (min-width: 767px) {
  .hamburger-menu-container {
    display: none;
  }
}
.hamburger-menu-container .hamburger-menu-toggle {
  padding: 10px;
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: all 0.2s ease-in-out;
  outline: none;
}
.hamburger-menu-container .hamburger-menu-list {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: #fff;
  list-style: none;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out, opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
  padding-right: 0.8rem;
  text-align: right;
  visibility: hidden;
  z-index: 1000;
}
@media (min-width: 767px) {
  .hamburger-menu-container .hamburger-menu-list {
    display: block;
  }
}
.hamburger-menu-container .hamburger-menu-list li {
  opacity: 0;
  transform: translateY(-10px);
  transition: all 0.3s ease-in-out;
  transition-delay: calc(var(--item-index) * 0.1s);
}
.hamburger-menu-container.is-open .hamburger-menu-list {
  max-height: 500px;
  opacity: 1;
  visibility: visible;
  padding: 1rem 0.8rem;
}
.hamburger-menu-container.is-open .hamburger-menu-list li {
  opacity: 1;
  transform: translateY(0);
}
.hamburger-menu-container .hamburger-logo-image {
  max-width: 120px;
  height: auto;
  object-fit: contain;
  transition: transform 0.3s ease;
}
.hamburger-menu-container .hamburger-logo-image.is-open {
  transform: scale(0.95);
}

.add-link-button {
  text-decoration: none !important;
}

.color-picker-hash {
  background: var(--light-gray);
}

.remove-preview-image {
  position: relative;
  top: -2.4rem;
  right: 1rem;
  cursor: pointer;
}

.invalid {
  border: 1px solid var(--red) !important;
  box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25) !important;
}

.incident-footer {
  position: relative;
  bottom: 0;
  width: 100%;
}

.public-incident-page-logo {
  max-height: 2rem;
  max-width: 2rem;
}
.public-incident-page-logo img {
  height: 2rem;
  width: 2rem;
  object-fit: contain;
}

.no-theme.subscribe--button {
  position: absolute;
  top: 2rem;
  right: 2rem;
}

@media (min-width: 767px) {
  .subscribe--button.mobile {
    display: none !important;
  }
}

.theme-actions {
  background: var(--white);
  position: sticky;
  bottom: 0;
  padding-block: 1rem;
}

.image-preview img {
  max-width: 60px;
  height: auto;
  object-fit: contain;
}

.animate__250ms {
  animation-duration: 0.25s;
}

.animate__150ms {
  animation-duration: 0.15s;
}

.animate__100ms {
  animation-duration: 0.1s;
}

.custom_animate__fadeInDown {
  -webkit-animation-name: custom_fadeInDown;
  animation-name: custom_fadeInDown;
}

@-webkit-keyframes custom_fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
.subscriber-row {
  border: 1px solid var(--light-gray);
  border-top: 0;
  display: flex;
}
.subscriber-row:last-child {
  border-bottom: 1px solid var(--light-gray);
  border-radius: 0 0 6px 6px;
}
.subscriber-row .subscriber-delete--hover-icon {
  visibility: hidden;
}
.subscriber-row:hover {
  background: var(--very-light-blue);
}
.subscriber-row:hover .subscriber-delete--hover-icon {
  visibility: visible;
}

.search-box {
  border: 1px solid var(--light-gray);
  border-radius: 6px;
  padding: 0.5rem 1rem;
}
.search-box input {
  border: 0;
  outline: none;
}

.subsriber-csv--dropzone {
  max-width: 100%;
  height: 250px;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px dashed var(--lightBorder);
  border-radius: 8px;
  cursor: pointer;
}
.subsriber-csv--dropzone .dropzone--icon {
  transition: all 2s ease-in-out;
}
.subsriber-csv--dropzone .drop-zone--text {
  font-size: 1rem;
  font-weight: 500;
}
.subsriber-csv--dropzone small {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--gray);
}
.subsriber-csv--dropzone .subsriber-csv--input {
  display: none;
}
.subsriber-csv--dropzone .drop-zone--thumbnail {
  max-width: 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  border-radius: 6px;
  background: var(--light-gray);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.subsriber-csv--dropzone .drop-zone--thumbnail::before {
  content: attr(data-label);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  text-align: center;
  font-weight: 500;
  background: var(--highlight-color);
  color: var(--black);
  padding: 0.2rem;
  cursor: pointer;
}
.subsriber-csv--dropzone .remove-file {
  position: absolute;
  background: var(--highlight-color);
  border-radius: 50%;
  padding: 0.2rem;
  top: 10px;
  right: 1.5rem;
}

.subsriber-csv--dropzone--over {
  border: 3px dashed var(--blue) !important;
}
.subsriber-csv--dropzone--over .dropzone--text {
  font-size: 1.2rem;
  color: var(--blue) !important;
}
.subsriber-csv--dropzone--over .dropzone-icon svg {
  width: 40px !important;
  height: 40px !important;
}
.subsriber-csv--dropzone--over .dropzone-icon path {
  fill: var(--blue) !important;
}

#subscribe-modal .subscriber-modal--option-alerts {
  font-size: 0.875rem;
  font-weight: 500;
  margin-left: 1rem;
  margin-bottom: 0rem;
  margin-top: 0.25rem;
}
#subscribe-modal .nav-tabs .nav-item .nav-link {
  color: var(--gray);
  font-weight: 500;
  letter-spacing: 0.5px;
}
#subscribe-modal .nav-tabs .nav-link.active {
  border-bottom: 3px solid var(--black) !important;
  color: var(--black) !important;
}
#subscribe-modal .nav-tabs .nav-link:hover {
  color: var(--black) !important;
  cursor: pointer;
}
#subscribe-modal .copy-trigger {
  color: var(--gray) !important;
}
#subscribe-modal .copy-trigger svg path {
  fill: var(--gray) !important;
}
#subscribe-modal .copy-trigger:focus {
  box-shadow: none;
  outline: none;
}
#subscribe-modal .copy-trigger:hover {
  background-color: transparent;
  color: #000000 !important;
}
#subscribe-modal .copy-trigger:hover svg path {
  fill: #000000 !important;
}
#subscribe-modal .modal-body {
  min-height: 15rem;
}
#subscribe-modal .form-control {
  border-color: var(--gray);
}
#subscribe-modal .form-control:disabled, #subscribe-modal .form-control[readonly] {
  background-color: transparent;
  opacity: 1;
  color: var(--gray);
  font-size: 14px;
}
#subscribe-modal .email .form-control {
  color: var(--black);
}

.font-500 {
  font-weight: 500;
}

.font-600 {
  font-weight: 600;
}

.font-inter {
  font-family: "Inter", sans-serif;
}

.color-blue {
  color: var(--blue) !important;
}

.color-white {
  color: var(--white) !important;
}

.color-black {
  color: var(--black) !important;
}

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

.color-red {
  color: var(--red) !important;
}

::selection {
  background: #e4b029;
  color: #fff;
}

#google-button, #apple-button, #saml-sso-login--button {
  border: 1px solid var(--black);
  color: var(--black);
}
#google-button:hover, #apple-button:hover, #saml-sso-login--button:hover {
  background: var(--gray-background);
}

select {
  background: var(--white);
  color: var(--black);
}

input[type="radio"] {
  cursor: pointer;
}

.blue-select2 {
  background-color: var(--blue) !important;
  border-width: 0 !important;
}
.blue-select2 .select2-selection__rendered {
  color: var(--white) !important;
}
.blue-select2 .select2-selection__arrow b {
  border-color: var(--white) transparent transparent transparent !important;
}

.nav-tabs {
  border-bottom: 1px solid var(--border-color);
}

.nav-tabs .nav-link.active {
  background-color: var(--white);
  border: 0;
  border-bottom: 3px solid var(--blue);
  color: var(--blue) !important;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
  border-color: transparent transparent #dee2e6;
  color: var(--blue) !important;
}

.icon-hover-blue:hover svg {
  fill: var(--blue) !important;
}

.nav-tabs .nav-item .nav-link {
  color: var(--black);
}

body {
  background: var(--white);
  font-size: 14px;
  font-size: 0.875rem;
  font-family: "Source Sans Pro", sans-serif;
  font-family: "Inter", sans-serif;
  color: var(--textColor);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  transition-property: background color;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: never;
}

strong, b {
  font-weight: 600;
}

.thin-font {
  font-weight: 200;
}

.badge-outline-primary {
  border: 1px solid var(--blue);
  background: transparent;
  color: var(--black);
}

.badge-white {
  border: 1px solid var(--gray);
  background: var(--white);
  color: var(--black);
  padding: 0.5em 1em;
  border-radius: 2px;
}

.badge-gray {
  border: 0px;
  border-radius: 4px;
  background: var(--light-gray);
  color: var(--black);
  padding: 0.75rem 0.5rem;
}

.badge-outline-gray {
  border: 1px solid var(--gray);
  background: transparent;
  color: var(--gray);
}

.spike-badge {
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
}

.badge-light-gray {
  background: var(--light-gray);
  color: var(--gray);
}

.badge-light-blue {
  background: var(--light-blue);
  color: var(--blue);
}

.badge-light-green {
  background: #EAF4ED;
  color: var(--green);
}

.badge-very-dark-blue {
  background: var(--very-dark-blue);
  color: #fff;
}

.badge-billing {
  padding: 0.5em 0.7em;
  border-radius: 11rem;
  font-size: 85% !important;
}

.hyphen {
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

.source-sans {
  font-family: "Source Sans Pro", sans-serif;
}

.open-sans {
  font-family: "Open Sans", sans-serif;
}

.ibm-plex-mono {
  font-family: "IBM Plex Mono", "Source Sans Pro", "Open Sans", sans-serif;
}

.spike-select {
  border: 1px solid var(--dropdown-gray);
  border-radius: 4px;
}

h1 {
  font-size: 3rem;
}

.no-border-top {
  border-top: 0 !important;
}

.border-light {
  border: 1px solid var(--light-border);
}

.border-gray {
  border: 1px solid var(--gray);
}

.border-red {
  border: 1px solid var(--red) !important;
}

.box-shadow {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.08);
}

.bg-light {
  background-color: var(--light) !important;
}

.background-transparent {
  background: transparent;
}

.primary-background, .background-primary {
  background: var(--background);
}

.background-dark-gray {
  background: var(--dark-gray) !important;
}

.background-light {
  background: var(--light);
}

.background-light-blue {
  background: var(--light-blue);
}

.background-gray {
  background: var(--gray-background);
}

.background-beige {
  background: var(--beige);
}

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

.background-white {
  background: var(--white);
}

.no-text-decoration {
  text-decoration: none;
}
.no-text-decoration:hover, .no-text-decoration:active, .no-text-decoration:visited {
  text-decoration: none;
}

.link-white {
  color: var(--white);
}
.link-white:hover, .link-white:active, .link-white:visited {
  color: var(--white);
}

.outline-0 {
  outline: 0;
}
.outline-0:hover, .outline-0:active, .outline-0:visited, .outline-0:focus, .outline-0:focus-within {
  outline: 0;
  box-shadow: none;
}

.color-black-always {
  color: #202020;
}

.color-black {
  color: var(--black);
}
.color-black:hover, .color-black:active {
  color: var(--black);
}

.color-dark-black {
  color: var(--black);
}

.color-white {
  color: var(--white);
}

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

.cover-hover-blue {
  color: var(--blue);
}
.cover-hover-blue:hover, .cover-hover-blue:focus, .cover-hover-blue:active {
  color: var(--hover-blue);
}

.color-gray {
  color: var(--gray) !important;
}

.color-light-gray {
  color: var(--light-gray);
}

.highlight {
  background: var(--highlight);
}

.radius-none {
  border-radius: 0px !important;
}

.radius-4px {
  border-radius: 4px;
}

.radius {
  border-radius: 6px;
}

.radius-small {
  border-radius: 2px;
}

.spam {
  color: #000;
  background-color: #e4cb16;
}

.big-radius {
  border-radius: 12px;
}

.secondary-background {
  background: #ccc;
}

.no-opacity {
  opacity: 0;
}

.opacity {
  opacity: 1;
}

.header-black {
  color: var(--black);
  font-weight: 200;
}
.header-black.h3 {
  font-size: 1.5rem;
}
.header-black span.number-font {
  font-size: 1.35rem;
}

.dashed {
  border-bottom: 2px dashed;
}

.btn {
  letter-spacing: 0.2px;
}

.btn-transparent {
  border: 0;
  background: transparent;
}

.btn.btn-outline-primary svg {
  fill: var(--blue);
}
.btn.btn-outline-primary:hover svg {
  fill: var(--white);
}
.btn.btn-outline-primary:disabled svg {
  fill: var(--blue);
}
.btn.btn-outline-primary:disabled:hover svg {
  fill: var(--blue);
}

.btn.btn-wide {
  padding: 0.3rem 1.8rem;
}

.btn.btn-white {
  background: #fff;
  border: 1px solid var(--light-border);
  color: var(--black);
}

.btn-blue-border {
  background: var(--white);
  color: var(--blue);
  border-color: var(--blue);
}

.btn-blue-transparent {
  background: transparent;
  color: var(--blue);
  border-color: var(--blue);
}

.btn-light-blue {
  background: #E0ECF9;
  radius: 10px;
  color: #63686E;
}
.btn-light-blue.color-blue {
  color: var(--blue);
}

.btn-zapier {
  background: var(--zapier);
  radius: 10px;
  color: var(--white);
}
.btn-zapier:hover, .btn-zapier:active, .btn-zapier:visited, .btn-zapier:focus {
  color: var(--white);
}

.link-red {
  color: #E02525;
}
.link-red:hover, .link-red:active, .link-red:visited, .link-red:focus {
  color: #E02525;
}

.link-gray-hover-blue {
  color: var(--gray);
}
.link-gray-hover-blue:hover, .link-gray-hover-blue:active, .link-gray-hover-blue:focus {
  color: var(--blue);
}
.link-gray-hover-blue:hover svg, .link-gray-hover-blue:active svg, .link-gray-hover-blue:focus svg {
  fill: var(--blue) !important;
}

.link-gray {
  color: var(--gray);
}
.link-gray:hover, .link-gray:active, .link-gray:visited, .link-gray:focus {
  color: var(--gray);
}

.link-zapier {
  color: var(--zapier);
}
.link-zapier:hover, .link-zapier:active, .link-zapier:visited, .link-zapier:focus {
  color: var(--zapier);
}

.link-color, .link-black {
  color: var(--black);
}
.link-color:hover, .link-color:active, .link-color:focus, .link-black:hover, .link-black:active, .link-black:focus {
  color: var(--black);
}
.link-color.hover-blue, .link-black.hover-blue {
  color: var(--black);
}
.link-color.hover-blue:hover, .link-color.hover-blue:active, .link-color.hover-blue:focus, .link-black.hover-blue:hover, .link-black.hover-blue:active, .link-black.hover-blue:focus {
  color: var(--blue);
}

.add-btn {
  color: var(--blue);
}
.add-btn:hover, .add-btn:active, .add-btn:visited, .add-btn:focus {
  color: var(--blue);
  outline: 0;
  box-shadow: none;
}

.link-dashed {
  color: #007bff;
  border: 0;
  border-bottom: 2px dashed #007bff;
  text-decoration: none;
}
.link-dashed:hover, .link-dashed:active, .link-dashed:visited, .link-dashed:focus {
  color: #007bff;
  text-decoration: none;
}

.alert.alert-light-blue {
  background: var(--light-blue);
  color: var(--black);
  border: 0;
}

.alert.alert-intel {
  background: var(--blue);
  color: #fff;
  border: 0;
}
.alert.alert-intel.mobile-view {
  background: #F7F3F3;
  color: var(--black);
  border: 0;
}

.text-break {
  overflow-wrap: break-word;
  word-break: break-word;
}

.text-point-11px {
  font-size: 0.675rem;
  font-size: 11px;
}

.text-point-12px {
  font-size: 0.75rem;
  font-size: 12px;
}

.text-point-14px {
  font-size: 0.875rem;
  font-size: 14px;
}

.text-point-16px {
  font-size: 1rem;
  font-size: 16px;
}

.text-point-18px {
  font-size: 1.125rem;
  font-size: 18px;
}

.text-point-20px {
  font-size: 1.25rem;
  font-size: 20px;
}

.text-500 {
  font-weight: 500;
}

.text-600 {
  font-weight: 600;
}

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

.text-800 {
  font-weight: 800;
}

.text-900 {
  font-weight: 900;
}

.text-1 {
  font-size: 1rem !important;
}

.text-1-1 {
  font-size: 1.1rem;
}

.text-1-2 {
  font-size: 1.2rem;
}

.text-1-5 {
  font-size: 1.5rem;
}

.text-1-75 {
  font-size: 1.5rem;
}

.text-2 {
  font-size: 2rem;
}

.capitalize {
  text-transform: capitalize;
}

.uppercase {
  text-transform: uppercase;
}

.bold {
  font-weight: bold;
}

.source-sans {
  font-family: "Source Sans Pro", sans-serif;
}

.open-sans {
  font-family: "Open Sans", sans-serif;
}

.iti-flag {
  background-image: url("/images/flags.png");
}

.intl-tel-input {
  display: block;
}

.well {
  background-color: #fff;
  padding: 15px;
  border: 1px solid #d4d4d4;
}

.custom-card .header {
  padding: 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  background: var(--gray-background);
  border-bottom: 0;
}
.custom-card .body {
  padding: 2rem 1.5rem;
}

.trigger-spike-tooltip {
  border: 0;
  outline: 0;
  cursor: pointer;
  background: var(--white);
  color: var(--gray);
}
.trigger-spike-tooltip:hover, .trigger-spike-tooltip:active, .trigger-spike-tooltip:visited, .trigger-spike-tooltip:focus {
  outline: 0;
  color: var(--black);
}
.trigger-spike-tooltip svg {
  fill: var(--gray) !important;
}

.price {
  font-size: 4rem;
  width: 100px;
  margin: 0-auto;
  position: relative;
  color: var(--blue);
}

.price-inr {
  font-size: 4rem;
  width: 100px;
  margin: 0-auto;
  position: relative;
  color: var(--blue);
}

.pricing-features {
  list-style: none;
}

#HW_badge_cont {
  display: inline !important;
  top: -5px;
}

#org-invite-link {
  user-select: all;
  overflow: hidden;
  white-space: nowrap;
  background: var(--white);
  border-radius: 0.25rem;
  letter-spacing: 0.3px;
  font-size: 0.875rem;
}

#receive-sms:disabled {
  cursor: not-allowed;
}

#receive-call:disabled {
  cursor: not-allowed;
}

.foldable {
  cursor: pointer;
}
.foldable .foldable-bar {
  cursor: pointer;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .iti-flag {
    background-image: url("/images/flags@2x.png");
  }
}
.bold-and-black-title {
  font-weight: 500;
  color: var(--black);
  font-size: 1rem;
}

.radius-6px {
  border-radius: 6px !important;
}

.radius-8px {
  border-radius: 8px !important;
}

.radius-12px {
  border-radius: 12px !important;
}

.edit-component {
  visibility: hidden;
}

.component {
  border-radius: 6px;
}
.component:hover {
  box-shadow: 1px 2px 4px 2px rgba(0, 0, 0, 0.15) !important;
}
.component:hover .edit-component {
  visibility: visible;
}

.component-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.component-spectrum {
  box-shadow: 1px 2px 4px 2px rgba(0, 0, 0, 0.15) !important;
}

.send-incident-update {
  border-bottom: 1px dashed var(--gray);
  cursor: pointer;
}

.incident-row {
  margin-bottom: 1rem;
  transition: all 0.2s ease-in-out;
}
.incident-row:hover {
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}
.incident-row:hover .send-incident-update {
  color: var(--blue) !important;
  border-bottom: 1px dashed var(--blue);
}

.border-left-2px {
  border-left: 2px solid var(--light-gray);
}

.underline {
  text-decoration: underline !important;
}

#incident-nav-tabs .nav-link, .custom-tabs .nav-link {
  outline: 0;
  background: var(--white);
  cursor: pointer;
  color: var(--black);
  padding: 0.5rem 1rem;
}
#incident-nav-tabs .nav-link:hover, #incident-nav-tabs .nav-link:active, #incident-nav-tabs .nav-link:visited, #incident-nav-tabs .nav-link:focus, .custom-tabs .nav-link:hover, .custom-tabs .nav-link:active, .custom-tabs .nav-link:visited, .custom-tabs .nav-link:focus {
  color: var(--black);
  text-decoration: none;
}
#incident-nav-tabs #ongoing-incident-count, .custom-tabs #ongoing-incident-count {
  background: var(--light-gray);
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
  font-size: 0.825rem;
  color: var(--black);
}

.loader {
  display: block;
  position: relative;
  height: 24px;
  width: 24px;
}
.loader span {
  display: block;
  position: absolute;
  margin: auto;
  height: 24px;
  width: 24px;
}
.loader::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  height: 24px;
  width: 24px;
  border: 3px solid #898989;
  border-bottom: 3px solid transparent;
  border-radius: 50%;
  -webkit-animation: loader-1 1.5s cubic-bezier(0.77, 0, 0.175, 1) infinite;
  animation: loader-1 1.5s cubic-bezier(0.77, 0, 0.175, 1) infinite;
}
.loader::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 6px;
  height: 6px;
  background: #aeaeae;
  border-radius: 50%;
  -webkit-animation: loader-2 1.5s cubic-bezier(0.77, 0, 0.175, 1) infinite;
  animation: loader-2 1.5s cubic-bezier(0.77, 0, 0.175, 1) infinite;
}

@-webkit-keyframes loader-1 {
  0% {
    -webkit-transform: rotate(0deg);
  }
  40% {
    -webkit-transform: rotate(180deg);
  }
  60% {
    -webkit-transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes loader-1 {
  0% {
    transform: rotate(0deg);
  }
  40% {
    transform: rotate(180deg);
  }
  60% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes loader-2 {
  0% {
    -webkit-transform: translate3d(0, -24px, 0) scale(0, 2);
    opacity: 0;
  }
  50% {
    -webkit-transform: translate3d(0, 0, 0) scale(1.25, 1.25);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(0, 8px, 0) scale(0, 0);
    opacity: 0;
  }
}
@keyframes loader-2 {
  0% {
    transform: translate3d(0, -24px, 0) scale(0, 2);
    opacity: 0;
  }
  50% {
    transform: translate3d(0, 0, 0) scale(1.25, 1.25);
    opacity: 1;
  }
  100% {
    transform: translate3d(0, 8px, 0) scale(0, 0);
    opacity: 0;
  }
}
.loading {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cursor-pointer {
  cursor: pointer !important;
}

.status-page-switcher {
  background: var(--white);
  border: 1px solid var(--light-gray);
  border-radius: 6px;
}
.status-page-switcher .dropdown-menu::after {
  left: 18px;
}
.status-page-switcher .dropdown-menu::before {
  left: 18px;
}

.component-icon {
  background: var(--light-gray);
  border-radius: 6px;
  padding-top: 0.2rem !important;
  padding-bottom: 0.3rem !important;
}

.notification-icon {
  background: var(--light-gray);
  border-radius: 6px;
  padding-top: 0.3rem !important;
  padding-right: 0.3rem !important;
}

.custom-control-label {
  cursor: pointer;
}

.alarms .alarm {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}
.alarms .reminder-input {
  width: 100%;
  margin-right: 0.5rem;
  height: 2rem;
}
.alarms .reminder .select2-selection--single, .alarms .reminder .select2-selection__rendered {
  height: 2rem !important;
}
.alarms .remove-reminder {
  cursor: pointer;
}

.count-badge {
  background: var(--light-gray);
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
  font-size: 0.825rem;
  color: var(--black);
  margin-left: 0.3rem;
}

.width-30 {
  width: 30% !important;
}

.index-page-status-page {
  height: 13rem;
  text-align: center;
  transition: all 0.2s ease-in-out;
}
.index-page-status-page:hover {
  border: 1px solid var(--blue) !important;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
.index-page-status-page .status-page-name {
  font-size: 1.25rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.index-page-status-page .status-page-url {
  color: var(--gray);
  display: inline-block;
  margin-bottom: 0.5rem;
}

.affected-component-row {
  padding: 0.3rem 0.1rem;
  border-radius: 6px;
}
.affected-component-row .affected-component-severity {
  margin-right: -2px !important;
}
.affected-component-row .select2-selection--single {
  height: 2.1rem !important;
}
.affected-component-row .select2-selection__rendered {
  line-height: 30px !important;
}

.show-incidents-page-link {
  color: var(--gray);
}
.show-incidents-page-link:hover svg path {
  fill: var(--blue);
}

.modified-row {
  flex-wrap: nowrap;
}

.status-bar--tooltip {
  position: relative;
  z-index: 10;
  top: 3rem;
  left: -7rem;
  padding: 1rem;
  width: 16rem;
  background-color: white;
  cursor: pointer;
  max-height: 20rem;
  overflow-y: auto;
}

.spectrum-bar {
  cursor: pointer;
}

.status-page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-gap: 1rem;
  margin-top: 1rem;
}

.show-blue-on-hover {
  color: var(--black);
}
.show-blue-on-hover:hover {
  color: var(--blue);
}

.link-disabled {
  pointer-events: none !important;
  color: var(--gray) !important;
}

.pointer {
  cursor: pointer;
}

.radius-4px-left {
  border-radius: 4px 0 0 4px !important;
}

.cursor-not-allowed {
  cursor: not-allowed !important;
}

.radius-bottom {
  border-radius: 0 0 6px 6px !important;
}

.radius-top {
  border-radius: 6px 6px 0 0 !important;
}

.checkbox {
  transform: scale(1.4);
  cursor: pointer;
}

/*# sourceMappingURL=main.css.map */