.header {
  display: flex;
  flex-flow: column;
  background-color: #F0F0F0;
  padding: 15px 20px 16px 20px;
  border-bottom: 1px solid silver;
}
.header .page-title {
  font-size: 28px;
  margin-bottom: -3px;
  /*font-weight: bold;*/
}
.header .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
  margin-top: 0px;
}
.header .mud-input {
  background-color: white !important;
}
.header .search {
  /*width: 500px;*/
}
.header .header-row {
  display: flex;
}

.margin-page {
  margin: 20px;
}

.song-item {
  border: 1px dashed silver;
  padding: 9px 12px 8px 12px;
  /*    margin-right: 10px;
  margin-bottom: 10px;*/
  cursor: pointer;
  display: flex;
  justify-content: space-between;
}

.song-item:hover {
  background-color: whitesmoke;
}

.chord {
  color: #EE2C2C;
  vertical-align: super;
  font-weight: bold;
  padding: 0.5px;
}

.chord-transposed {
  color: #045FB4;
  vertical-align: super;
  font-weight: bold;
  padding: 0.5px;
}

.lyrics .chord-note {
  display: none;
}

@media print {
  @page {
    size: portrait;
    /*margin: 60mm 20mm 30mm 55mm;*/
  }
  .chord {
    color: black;
  }
  .song-container {
    page-break-after: always;
  }
  w {
    color: #F5F5F5;
  }
}
.login-container {
  max-width: 350px;
}

div:focus {
  outline: none !important;
}

table.bordered td {
  padding: 6px 9px 6px 9px;
  border: 1px solid silver;
}

.active {
  background-color: aquamarine;
}

.audio-player {
  display: flex;
}
.audio-player .progress-bar {
  padding-top: 6px;
}
.audio-player .progress-bar .mud-progress-linear {
  height: 11px;
}
.audio-player .progress-bar .progress-slider {
  margin-top: 3px;
  margin-bottom: -12px;
}
.audio-player .time-container {
  margin-top: 2px;
  margin-bottom: -2px;
}

.random-tone {
  font-size: 500px;
}

.audio-files-page .add-new-file {
  max-width: 600px;
}

.danger-button {
  background-color: #F44336;
  color: white;
}

.w-100 {
  width: 100%;
}

m, k, p1 {
  /*text-decoration: underline dashed silver;*/
}

w, mi, p2 {
  /*color: #D3D3D3;*/
  color: #C96AFA;
}

z {
  color: #B0B0B0;
}

d {
  /* as in Delay */
  text-decoration: underline silver;
  color: black;
}

t {
  font-weight: bold;
  /*text-decoration: underline double silver;*/
  /*color: orangered;*/
}

c {
  color: #989898;
}

o {
  color: #F4AF36;
}

@media (max-width: 1000px) {
  /*    .more-1000 {
      display: none;
  }*/
  .margin-page {
    margin: 12px;
  }
  .header {
    padding: 8px 8px 8px 8px;
  }
}