body.panorama-page {
overflow: hidden;
background-color: #1D1D1D;
user-select: none;
-webkit-user-select: none;
}

#panorama-viewport {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
z-index: 2;
touch-action: pan-y;
}

#panorama-world {
position: absolute;
top: 0;
left: 0;
height: 100%;
display: flex;
flex-direction: row;
align-items: flex-start;
transform: translate3d(0, 0, 0);
will-change: transform;
width: max-content;
}

.panorama-panel-wrapper {
position: relative;
height: 100%;
width: auto;
flex: 0 0 auto;
}

.panorama-panel {
display: block;
height: 100%;
width: auto;
max-width: none;
max-height: none;
flex: 0 0 auto;
pointer-events: none;
-webkit-user-drag: none;
vertical-align: top;
}

.panorama-area-container {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
z-index: 20;
}

.panorama-area-container a {
pointer-events: auto;
}

@media (max-width: 768px) {

#panorama-world {
    height: 65vh;
    top: 17.5vh;
}

.panorama-panel-wrapper {
    height: 65vh;
}

.panorama-panel {
    height: 65vh;
}

}

@media (prefers-reduced-motion: reduce) {

#panorama-world {
    transition: none;
}

}