:root {
    --pnlm-sprite-offset: calc( 100% / 7);
    --pnlm-wrap-gap: var(--wrap-gap);
    --header-mix-blend-mode: none;
}

.pnlm-container {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: currentColor;
}
.pnlm-panorama-info {
    position: absolute;
    bottom: 3rem;
    background: transparent;
    border-radius: 0;
    padding: 0;
    color: currentColor;
}

.pnlm-sprite {
    background-image: url(../assets/sprite.svg);
    background-size: 100% auto;
    background-position: 0 calc( var(--pnlm-sprite-offset) * var(--pnlm-sprite-index, 0)) !important;
}

.pnlm-controls {
    //background-color: transparent !important;
    border: none;
}

.pnlm-hotspot {
    width: 9.3rem;
    height: 9.3rem;
    border-radius: 50%;
}

.pnlm-zoom-in {
    --pnlm-sprite-index: 0;
}

.pnlm-zoom-out {
    --pnlm-sprite-index: 1;
}
.pnlm-fullscreen-toggle-button-inactive {
    --pnlm-sprite-index: 2;
}

.pnlm-fullscreen-toggle-button-active {
    --pnlm-sprite-index: 3;
}

.pnlm-orientation-button-inactive {
    --pnlm-sprite-index: 6;
}

.pnlm-orientation-button-active {
    --pnlm-sprite-index: 7;
}




.pnlm-hotspot.pnlm-info {
    --pnlm-sprite-index: 4;
}

.pnlm-hotspot.pnlm-scene {
    --pnlm-sprite-index: 5;
}

.pnlm-controls-container {
    position: absolute;
    top: auto;
    left: auto;
    z-index: 1;
    right: var(--pnlm-wrap-gap);
    bottom: var(--pnlm-wrap-gap);
}

.pnlm-title-box {
    font-size: 2rem;
    padding-left: 0;
    margin-bottom: 0;
}

.pnlm-panorama-info {
    left: var(--pnlm-wrap-gap);
    bottom: var(--pnlm-wrap-gap);
    top: auto;
    max-width: calc( 100% - 10rem);
}

.pnlm-container {
    background-color: #282828;
}
