.my-icon {
  box-sizing: content-box; 
  width:1em;
}
.my-text {
  display: inline-block;
  animation: my-text 15s linear infinite;
  white-space: nowrap;
}
@keyframes my-text {
  0%   { margin-left: 0px; }
  100% { margin-left: var(--offset-to-scroll); }
}
#maincont{
  display: flex !important; 
}
@media (orientation: portrait) {
  #maincont {
    flex-direction: column !important; 
  }
  #media-pane {
    margin-top: 1rem !important;
  }
}
@media (orientation: landscape) {
  #maincont {
    margin-top: 1rem !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important; 
  }
  #media-and-progress {
    display: flex !important; 
    flex-direction: column !important; 
    margin-left: 1rem !important;
    margin-top: 0.5rem !important;
    order: 2;
    width: 50% !important;
  }
  #volume-pane {
    display: flex !important; 
    flex-direction: column !important; 
    order: 1;
  }
}
#song-image-url {
  width: min(300px, 40vw, 40vh); 
  height: min(300px, 40vw, 40vh); 
  object-fit: cover;
  margin-right: 0.25rem !important;
}
#song-info {
  overflow: hidden;
  display: flex !important; 
  flex-direction: column !important; 
}
.song-title {
  flex: 1 1 auto !important; 
  flex-wrap: nowrap !important;
}
.room-name {
  display: flex !important; 
  flex: 1 1 auto !important; 
  flex-wrap: nowrap !important;
  margin-bottom: 0 !important;
  margin-left: 0.25rem !important;
}
.room-controls {
  display: flex !important; 
  flex: 1 1 auto !important; 
  flex-wrap: nowrap !important;
}
.my-button {
  margin: 0.25rem !important;
}
.my-input-number {
  margin: 0.25rem !important;
  box-sizing: content-box; 
  height: auto; 
  width:1.5em;
}
.my-range {
  margin: 0.25rem !important;
  align-self: center !important;
}
#media-progress-row {
  display: flex !important; 
  margin-bottom: 1rem !important;
  justify-content: center !important;
}
#media-progress {
  width: 70%
}
#media-controls-row {
  display: flex !important; 
  justify-content: space-around !important;
  margin-bottom: 3rem !important;
}
#media-pane {
  display: flex !important;
  flex-direction: row !important;  
  margin-bottom: 3rem !important;
}