.player-container {

    -webkit-user-select: none;

       -moz-user-select: none;

        -ms-user-select: none;

            user-select: none;
    position: relative;
    background: white;
    width: 380px;
    margin: 0 auto;

}
  
    .player-container .infos {
      position: absolute;
      top: 70px;
      right: -100%;
      width: 380px;
    }
  
    .player-container .player {
        position: relative;
        width: 100%;
        height: 100%;

    }
  
    .player-container .player .player-element svg {
                width: 100%;
                height: 100%;
            }
  
    .player-container .player .player-element.player-element-lp {

                transform: perspective(2000px);
                transition: 1s;
                transform-style: preserve-3d;
                -webkit-backface-visibility: hidden;
                        backface-visibility: hidden;
                padding: 40px;
                width: 85%;
                height: auto;
                display: inline-block;
                box-sizing: border-box;

            }
  
    .player-container .player .player-element.player-element-tonearm {

                position: absolute;
                top: calc(calc(20px * 2) - 29%);
                right: calc(calc(20px * 3) - 43%);
                width: 90%;
                height: auto;

            }
  
    .player-container .player-controls {

        display: flex;
        justify-content: space-between;
        width: 100%;
        padding: calc(20px * 2);
        box-sizing: border-box;
        align-items: center;

    }
  
    .player-container .player-controls .player-button {

            position: relative;
            margin: 0 calc(20px / 2);
            padding:0 calc(20px / 2);
            background-color: transparent;

        }
  
    .player-container .player-controls .player-button svg {

                max-height: 24px;
                width: 100%;
            }
  
    .player-container .player-controls .player-button svg path {
                    fill: #5b5b5f;
                    transition: .35s;
                }
  
    .player-container .player-controls .player-button:focus, .player-container .player-controls .player-button:hover {

                outline: none;
                cursor: pointer;

            }
  
    .player-container .player-controls .player-button:focus svg path, .player-container .player-controls .player-button:hover svg path {
                    fill: #121212;
                }
  
    .player-container .player-controls .player-button:first-child {
                margin-left: 0;
                padding-left: 0;
            }
  
    .player-container .player-controls .player-button:last-child {
                margin-right: 0;
                padding-right: 0;
            }
  
    .player-container .player-controls .player-button.player-button-play {

                display: inline;

            }
  
    .player-container .player-controls .player-button.player-button-play.paused { display: none; }
  
    .player-container .player-controls .player-button.player-button-pause {

                display: none;

            }
  
    .player-container .player-controls .player-button.player-button-pause.paused { display: inline; }
  
    .player-container .player-playlist {

        overflow: hidden;
        position: relative;
        margin: 0 auto;
        padding-bottom: calc(20px * 2);
        width: calc(100% - calc(20px * 4));
        box-sizing: border-box;
        list-style-type: decimal-leading-zero;
        padding-left: calc(20px * 1.5);

    }
  
    .player-container .player-playlist li {

            padding: calc(20px / 5) 0;
            cursor: pointer;

        }
  
    .player-container .player-playlist li.current-track {
                font-weight: bold;
            }