body{
    background-color: #008080;
}

@keyframes marquee{
    0%{transform: translateX(100%);}
    100%{transform: translateX(-100%);}
}

@media (prefers-reduced-motion: no-preference) {
    .moving-text{
        animation: marquee 15s linear infinite;
        overflow:hidden;
    }
}

.progress-indicator {
    height: 28px;
    position: relative;
    box-shadow: inset -2px -2px #dfdfdf, inset 2px 2px #808080;
    padding: 4px;
    border: none;
    box-sizing: none;
    box-sizing: border-box;
    appearance: none;
    border-radius: 0;
}


.progress-indicator > .progress-indicator-bar {
  height: 100%;
  display: block;
  background-color: #000080;
}

.progress-indicator.segmented > .progress-indicator-bar {
  width: 100%;
  background-color: transparent; /* resets the background color which is set to blue in the non-segmented selector */
  background-image: linear-gradient(
    90deg,
    #000080 0 16px,
    transparent 0 2px
  );
  background-repeat: repeat;
  background-size: 18px 100%;
}