.mui-red {
  color: #f44336;
}

.mui-pink {
  color: #e91e63;
}

.mui-purple {
  color: #9c27b0;
}

.mui-deep-purple {
  color: #673ab7;
}

.mui-indigo {
  color: #3f51b5;
}

.mui-blue {
  color: #2196f3;
}

.mui-light-blue {
  color: #03a9f4;
}

.mui-cyan {
  color: #00bcd4;
}

.mui-teal {
  color: #009688;
}

.mui-green {
  color: #4caf50;
}

.mui-light-green {
  color: #8bc34a;
}

.mui-lime {
  color: #cddc39;
}

.mui-yellow {
  color: #ffeb3b;
}

.mui-amber {
  color: #ffc107;
}
:root {
  --mui-red: #f44336;
  --mui-pink: #e91e63;
  --mui-purple: #9c27b0;
  --mui-deep-purple: #673ab7;
  --mui-indigo: #3f51b5;
  --mui-blue: #2196f3;
  --mui-light-blue: #03a9f4;
  --mui-cyan: #00bcd4;
  --mui-teal: #009688;
  --mui-green: #4caf50;
  --mui-light-green: #8bc34a;
  --mui-lime: #cddc39;
  --mui-yellow: #ffeb3b;
  --mui-amber: #ffc107;
  --mui-orange: #ff9800;
  --mui-deep-orange: #ff5722;
  --mui-brown: #795548;
  --mui-grey: #9e9e9e;
  --mui-blue-grey: #607d8b;
}

.mui-red {
  color: var(--mui-red);
}

.mui-pink {
  color: var(--mui-pink);
}

.mui-purple {
  color: var(--mui-purple);
}

.mui-deep-purple {
  color: var(--mui-deep-purple);
}

.mui-indigo {
  color: var(--mui-indigo);
}

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

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

.mui-cyan {
  color: var(--mui-cyan);
}

.mui-teal {
  color: var(--mui-teal);
}

.mui-green {
  color: var(--mui-green);
}

.mui-light-green {
  color: var(--mui-light-green);
}

.mui-lime {
  color: var(--mui-lime);
}

.mui-yellow {
  color: var(--mui-yellow);
}

.mui-amber {
  color: var(--mui-amber);
}

.mui-orange {
  color: var(--mui-orange);
}

.mui-deep-orange {
  color: var(--mui-deep-orange);
}

.mui-brown {
  color: var(--mui-brown);
}

.mui-grey {
  color: var(--mui-grey);
}

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

.mui-orange {
  color: #ff9800;
}

.mui-deep-orange {
  color: #ff5722;
}

.mui-brown {
  color: #795548;
}

.mui-grey {
  color: #9e9e9e;
}

.mui-blue-grey {
  color: #607d8b;
}

.user-uuid {
  color: var(--mui-red);
}

.totp-sec {
  color: var(--mui-orange);
}

.totp-gen-sec {
  color: var(--mui-green);
}

.uuid-hash {
  color: var(--mui-teal);
}

.enc-totp-secret {
  color: var(--mui-cyan);
}

.color-code-text {
  font-weight: bold;
  font-family: monospace;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.o2fa-id {
  color: var(--mui-yellow);
}

.o2fa-enc-secret {
  color: var(--mui-deep-orange);
}

ol > li > ul > li > div > .color-code-text {
  display: inline-flex;
  max-width: 70vw;
}

.nav-link-gh {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  padding: 0.5rem;
}

.nav-link-gh > * {
  display: flex;
}

.nav-link-gh > img {
  height: 1.5rem;
  width: 1.5rem;
}


body, #body-wrap {
  width: 100vw;
  min-width: 100vw;
  overflow-x: hidden;
}

nav > *, nav > ul > * {
  display: inline-flex;
}

ul.navbar-nav.ml-auto {
  display: inline-flex;
  flex-direction: row;
}


nav > ul {
  width: calc(100% - 100px);
}

nav > ul > * {
  max-width:fit-content;
}

nav, #nav-wrap {
  display:flex;
  flex-direction: row;
  overflow: hidden;
  width: 100%;
  justify-content: center;
}

.one-line > p {
  display: inline-flex;
}

.one-line > p >code {
  line-height: 1.5rem;
}

.one-line-btncheck {
  display: flex;
}

.one-line-btncheck > .form-check {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  margin-left: 1rem;
}

.one-line-btncheck > .form-check > label {
  padding-left: 0.5rem;
}

input#rememberSecretsCheck {
  min-width: 1rem;
}

.secret-name {
  margin-right: 1rem;
}

.countdown {
  text-align: right;
  width: 100%;
}