/* The official mark is displayed from one untouched source image. */
.dots {
  width: 30px !important;
  height: 34px !important;
  flex: 0 0 30px;
  background-image: url("/brand-mark.png") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  /* Keep a small safety inset so the right and bottom dots are never clipped. */
  background-size: auto 82px !important;
}

.dots i {
  display: none !important;
}

.dashboard-title,
.legal-brand,
.legal-footer strong,
.ndg-static-brand {
  position: relative;
  min-height: 34px;
  padding-left: 40px !important;
}

.dashboard-title::before,
.legal-brand::before,
.legal-footer strong::before,
.ndg-static-brand::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 30px;
  height: 34px;
  transform: translateY(-50%);
  background: url("/brand-mark.png") center / auto 82px no-repeat;
}

.dashboard-title,
.legal-footer strong {
  display: inline-flex;
  align-items: center;
}

.legal-brand {
  display: flex !important;
  align-items: center;
}

.hub-identity::before {
  content: "";
  display: block;
  width: 48px;
  height: 54px;
  margin: 0 auto 8px;
  background: url("/brand-mark.png") center / auto 132px no-repeat;
}

@media (max-width: 760px) {
  .hub-identity::before {
    margin-left: 0;
  }
}