body {
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: auto;  
    margin: 0;
    height: 100vh;
    background: linear-gradient(to top, black, green);
}

#center {
    position: absolute;
    top: 50%; 
    left: 50%;
    width: 90vh;
    height: 90vh;
    background-color: rgb(224, 224, 224);
    transform: translate(-50%, -50%); 
    border-radius: 4vh;
    border: 0.5vh solid black;
}
.album-image {
    margin-top: 5vh; 

    width: 60vh;
    height: 60vh;
}

h5 {
    font-size: 3vh;
    margin-block-start: 0.4vh;
    margin-block-end: 0.4vh;
}

.row {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
  }
.row > * {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis; 
    white-space: nowrap;     
}
#songBar {
    grid-column: 4/10;
    background-color: rgb(159, 159, 159);
    height: 2vh;
    border-radius: 1vh;
    align-self: center;
  }
  
#songBarinner {
   /* grid-column: 4/10; */
    width: 10%;
    height: 2vh;
    border-radius: 1vh 0vh 0vh 1vh;
    background-color: rgb(239, 239, 239);
  }
#currentTime {
    grid-column:  3/4;
    align-self: center;
}
#totalTime {
    grid-column:  10/11;
    align-self: center;
}
/* #songSettings {
    background-color: aqua; 

} */
#login{
  grid-column: 2/4;
  grid-row : 1/2;
  transform: translateX(-3vh);
}
#pause {
    grid-column: 6/8;
    grid-row : 1/2;
    transform: translateX(1vh);
    padding : 0;
}
#test2 {
    grid-column: 4/6;
    grid-row : 1/2;
    transform: translateX(-1vh);

}
#skipskit {
  grid-column:  8/12;
  grid-row: 1/2;
  transform: translateX(3vh);
}

.buttonA {
  appearance: none;
  background-color: #363636;
  border: 1px solid rgba(27, 31, 35, .15);
  border-radius: 6px;
  box-shadow: rgba(27, 31, 35, .1) 0 1px 0;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-family: -apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  padding: 6px 16px;
  position: relative;
  text-align: center;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: middle;
  white-space: nowrap;
}

.buttonA:hover {
  background-color: #585858;
}