* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 400;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_regular-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_regular-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_regular-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 400;
  font-style: italic;
  src: url(.//assets/fonts/brink_-_br_hendrix_regular_italic-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_regular_italic-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_regular_italic-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 500;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_medium-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_medium-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_medium-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 600;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_semibold-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_semibold-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_semibold-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 700;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_bold-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_bold-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_bold-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'BR Hendrix';
  font-weight: 800;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_black-webfont.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_black-webfont.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_black-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'HendrixTabular';
  font-weight: 700;
  font-style: normal;
  src: url(.//assets/fonts/brink_-_br_hendrix_bold-webfont-tabular.woff2) format('woff2'), url(.//assets/fonts/brink_-_br_hendrix_bold-webfont-tabular.woff) format('woff'), url(.//assets/fonts/brink_-_br_hendrix_bold-webfont-tabular.ttf) format('truetype');
}
@font-face {
  font-family: 'scout-icons';
  font-weight: 400;
  font-style: normal;
  src: url(.//assets/fonts/scout-icons.woff) format('woff'), url(.//assets/fonts/scout-icons.ttf) format('truetype'), url(./images/41dc932db9e3564473cfacfe6f0a670d.svg) format('svg');
}
@font-face {
  font-family: 'icons';
  font-weight: 400;
  font-style: normal;
  src: url(.//assets/fonts/icons.woff) format('woff'), url(.//assets/fonts/icons.ttf) format('truetype'), url(./images/32d6c4a0a0f07fef9d8681eb59ffaf78.svg) format('svg');
}
body,
html {
  font-family: "BR Hendrix";
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss03" on, "ss01" off, "ss02" off;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
input {
  -webkit-touch-callout: text;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
.nav-inner {
  display: flex;
  flex-direction: row;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 auto;
}
#nav-top {
  transition: height 0.25s ease-in-out;
  position: relative;
  z-index: 100;
  width: 100%;
  height: 100px;
  line-height: 80px;
  padding: 20px 0 0;
  top: -20px;
  display: flex;
  flex-direction: row;
  text-align: left;
  white-space: nowrap;
  border-bottom: 1px solid #ddd;
  margin: env(safe-area-inset-top) 0 -20px;
  color: white;
  font-weight: 600;
  border: none;
  background-image: url(./images/f6d9be16d0b4c3f8edd0a2e7a6f1b73d.png);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
#nav-top a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#nav-top.attestation,
#nav-top.symptoms,
#nav-top.tracing,
#nav-top.diagnostics {
  height: 80px;
  line-height: 60px;
}
#nav-top.attestation #beacon-name,
#nav-top.symptoms #beacon-name,
#nav-top.tracing #beacon-name,
#nav-top.diagnostics #beacon-name {
  font-size: 18px;
  padding-left: 15px;
}
#nav-top.attestation #logobox,
#nav-top.symptoms #logobox,
#nav-top.tracing #logobox,
#nav-top.diagnostics #logobox {
  width: 60px;
  height: 60px;
}
#nav-top.attestation #logobox-bg,
#nav-top.symptoms #logobox-bg,
#nav-top.tracing #logobox-bg,
#nav-top.diagnostics #logobox-bg {
  width: 60px;
}
#nav-top.attestation #broad,
#nav-top.symptoms #broad,
#nav-top.tracing #broad,
#nav-top.diagnostics #broad {
  width: 64px;
  height: 60px;
  margin: 0 16px 0 auto;
}
#nav-top.symptoms {
  background-image: url(./images/bdc2a7c46f19f7b13abc6dc6ad9e45eb.png);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
#nav-top.symptoms #logobox {
  background-image: url(./images/461ceeb7a1952a6b55978341b97a33a4.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.symptoms #beacon-name {
  color: #ee6f9a;
}
#nav-top.symptoms #broad {
  background-image: url(./images/d4671b1dde84c06e3a2629e8865aae4d.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.tracing {
  background-image: url(./images/d29cf2404e811c798bfc745d13e76cd1.png);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
#nav-top.tracing #logobox {
  background-image: url(./images/21ba2b7233b7046ab8f56abed2aeb90a.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.tracing #beacon-name {
  color: #a489ff;
}
#nav-top.tracing #broad {
  background-image: url(./images/910c8549e3e42b35ce6b29c1e2107190.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.diagnostics {
  background-image: url(./images/4807d2461813225f66e0c8bf2f099526.png);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
#nav-top.diagnostics #logobox {
  background-image: url(./images/82205e31511d9c9d104f21954e0f7808.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.diagnostics #beacon-name {
  color: #00c9a6;
}
#nav-top.diagnostics #broad {
  background-image: url(./images/211d7188fe75743b78e0d28f5919f67b.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.attestation #logobox {
  background-image: url(./images/e193ba83d0258bdb9cef19ade5f30a8d.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
#nav-top.attestation #beacon-name {
  color: #3ebbff;
}
body.gradient #nav-top #beacon-name {
  color: white;
  padding-left: 6px;
}
body.gradient #nav-top #beacon-name .module-name {
  display: none;
}
body.gradient.cleared #nav-top.attestation #logobox {
  background-image: url(./images/bcd8fab2e276f5533f809b43823d942c.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
body.gradient.not-cleared #nav-top.attestation #logobox {
  background-image: url(./images/c403e8e507f10660820da04de0206d96.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.module-name {
  color: #fff;
  margin-left: 8px;
}
#logobox-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 80px;
  height: 100%;
}
#beacon-name {
  font-size: 22px;
  font-weight: 700;
  padding-left: 20px;
}
#logobox {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
  background-image: url(./images/d6d733413aef2c778e8f16f094b5106c.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin: 0;
  padding: 0;
  z-index: 2;
  transition: all 0.25s ease-in-out;
}
.nav-p {
  font-weight: 700;
  font-size: 17px;
  margin: 17px 11px 0 0;
}
#title {
  color: white;
  flex-grow: 2;
}
#broad {
  width: 80px;
  height: 80px;
  margin: 0 20px 0 auto;
  background-image: url(./images/99102e7c661e638bf6adb14dd58f8f6d.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin-left: auto;
}
.icon {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-family: 'icons', 'scout-icons';
  font-weight: 400 !important;
  font-style: normal !important;
  text-transform: none !important;
}
body,
html {
  width: 100%;
  height: 100%;
  margin: 0px;
  box-sizing: border-box;
}
html {
  padding: 0px;
}
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss03" on, "ss01" off, "ss02" off;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.icon {
  display: inline-block;
  font-family: 'icons';
  font-weight: normal;
  text-transform: none;
}
input {
  -webkit-touch-callout: text;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
.hidden {
  display: none;
}
.dlb {
  display: none;
}
a {
  text-decoration: none;
  color: white;
}
body {
  display: flex;
  flex-direction: column;
  transition: transform 0.15s ease-in-out;
  overflow-x: hidden;
  font-family: "BR Hendrix", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #949ab0;
  background-color: #131c29;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
body.cleared #clearance {
  background-color: #60c48f;
}
body.cleared #daily {
  background-color: #92f9c1;
  color: #61c691;
}
body.cleared #cleared {
  display: block;
}
body.cleared #complete-it {
  display: none;
}
body.not-cleared #clearance {
  background-color: #d9384b;
}
body.not-cleared #daily {
  background-color: #c6d1eb;
  color: #d9384b;
}
body.not-cleared #not-cleared {
  display: block;
}
body.not-cleared #complete-it {
  display: none;
}
header {
  font-size: 0;
  display: block;
  position: relative;
  width: 100%;
  height: 96px;
  background-color: #050c12;
  white-space: nowrap;
}
#logo-wrapper {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: inherit;
  padding-left: 28px;
  background-color: #050c12;
}
#logo-wrapper img {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
#core-stats {
  display: block;
  position: absolute;
  width: 100%;
  height: inherit;
  top: 0;
  left: 0;
  padding-left: 264px;
  padding-right: 264px;
}
.core-stat {
  display: inline-block;
  position: relative;
  width: 33%;
  white-space: nowrap;
  padding-top: 24px;
}
.core-stat--graphic,
.core-stat--value {
  display: inline-block;
  height: 24px;
  vertical-align: top;
}
.core-stat--graphic {
  width: 24px;
  height: 24px;
}
.core-stat--value {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" on;
  letter-spacing: -0.03rem;
  font-feature-settings: "ss03" on, "ss01" off, "ss02" off;
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
  color: white;
  margin-left: 8px;
}
.core-stat--label {
  font-family: "Ringside Extra Wide A", "Ringside Extra Wide B";
  font-style: normal;
  font-weight: 400;
  display: block;
  color: #949ab0;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  letter-spacing: 0.03rem;
  margin-top: 8px;
}
.donut-ring {
  stroke: #19202a;
}
.donut-segment {
  stroke: #176ca9;
}
#profile-button {
  font-size: 0;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 280px;
  height: inherit;
  padding: 0 16px;
  text-align: right;
}
#profile-box {
  display: inline-block;
  position: relative;
  width: auto;
  max-width: 248px;
  height: 64px;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  border: 1px solid #212833;
  background-color: #050c12;
  padding: 0;
  white-space: nowrap;
  text-align: left;
  cursor: pointer;
}
.profile-element {
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
#profile-info {
  display: block;
  position: relative;
  width: auto;
  max-width: 184px;
  margin-left: 16px;
  margin-right: 64px;
}
#profile-info div {
  display: block;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
#profile-info p {
  font-size: 14px;
  line-height: 22px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
#profile-name {
  color: #949ab0;
}
#profile-id {
  color: #323948;
}
#profile-token {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  margin: 12px 12px;
  line-height: 40px;
  border-radius: 20px;
  background-color: #212833;
  font-size: 14px;
  color: #050c12;
  text-align: center;
  letter-spacing: 0.02rem;
}
#lower {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
}
#nav-sidebar {
  display: flex;
  flex-direction: column;
}
.nav-sidebar--button {
  font-family: "Ringside Extra Wide A", "Ringside Extra Wide B";
  font-style: normal;
  font-weight: 800;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  letter-spacing: 0.03rem;
  width: 192px;
  height: auto;
  padding: 24px 0 28px 28px;
  color: #949ab0;
  background-color: #050c12;
  border-color: #131c29;
  border-style: solid;
  border-width: 2px 0 0 0;
  cursor: pointer;
}
.nav-sidebar--button.disabled {
  color: rgba(148, 154, 176, 0.2);
  pointer-events: none;
  cursor: auto;
}
.nav-sidebar--button.active {
  background-color: #176ca9;
  color: white;
  border-color: #176ca9;
  width: 200px;
  cursor: auto;
}
#nav-sidebar--filler {
  background-color: #050c12;
  flex-grow: 1;
  border-color: #131c29;
  border-style: solid;
  border-width: 2px 0 0 0;
  width: 192px;
}
#view-wrapper {
  flex-grow: 1;
  border: none;
}
.health-school-list--donut {
  width: 30px;
}