.dm-utilityBar {
  padding-bottom: 1.2rem;
  padding-top: 1.2rem;
  background: linear-gradient(90deg, var(--brandColorSoft) 0%, var(--brandColorSoft) 100%) no-repeat bottom/100% 1px;
}

.dm-utilityBar ul {
  display: flex;
  justify-content: space-evenly;
  height: 100%;
  align-items: center;
}

.dm-utilityBar__itemLink--newspaper:before {
  -webkit-mask: var(--newspaper) no-repeat center center / contain;
  mask: var(--newspaper) no-repeat center center / contain;
}

.dm-utilityBar__itemLink--clock:before {
  -webkit-mask: var(--clockAlt) no-repeat center center / contain;
  mask: var(--clockAlt) no-repeat center center / contain;
}

.dm-utilityBar__itemLink--bookmark:before {
  -webkit-mask: var(--bookmark) no-repeat center center / 80%;
  mask: var(--bookmark) no-repeat center center / 80%;
}

.dm-utilityBar__itemLink--headphones:before {
  -webkit-mask: var(--headphones) no-repeat center center / contain;
  mask: var(--headphones) no-repeat center center / contain;
}

.dm-utilityBar__itemLink:before {
  content: "";
  display: inline-block;
  width: 1.5em;
  height: 100%;
  vertical-align: middle;
  cursor: pointer;
  background: var(--navColor);
}

.dm-utilityBar__item {
  height: 2em;
  position: relative;
}

.dm-utilityBar__itemLink {
  cursor: pointer;
  opacity: 1;
  transition: opacity var(--navAniDuration);
  color: var(--navColor);
  display: block;
  height: 100%;
  width: 100%;
}

.dm-utilityBar__itemText {
  display: none;
  font-size: 1.125rem;
}

@media (min-width: 768px) {
  .dm-utilityBar__itemText {
    color: var(--navColor);
    margin-left: 1rem;
    display: inline-block;
    vertical-align: middle;
  }
  .dm-utilityBar {
    background-size: calc(100% - 4rem) 1px;
  }
}