/* __V3D_TEMPLATE__ - template-based file; delete this line to prevent this file from being updated */

body {
    margin: 0px;
    overflow: hidden;
    background: #cfd5da;
}

noscript {
    display: block;
    text-align: center;
    padding-top: 100px;
    font-size: 20px;
}

.v3d-container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 50% 46%, rgba(255, 255, 255, 0.96) 0%, rgba(235, 239, 242, 0.9) 31%, rgba(196, 204, 211, 0.92) 72%, rgba(166, 177, 185, 0.96) 100%),
        linear-gradient(135deg, #e8ecef 0%, #b8c1c8 100%);
}

.v3d-container::before,
.v3d-container::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.v3d-container::before {
    opacity: 0.25;
    background-image:
        linear-gradient(rgba(72, 87, 98, 0.11) 1px, transparent 1px),
        linear-gradient(90deg, rgba(72, 87, 98, 0.11) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: radial-gradient(circle at center, #000 0%, transparent 74%);
    -webkit-mask-image: radial-gradient(circle at center, #000 0%, transparent 74%);
}

.v3d-container::after {
    background:
        linear-gradient(118deg, transparent 0 63%, rgba(255, 255, 255, 0.17) 63.2% 63.6%, transparent 63.8%),
        radial-gradient(circle at 14% 18%, rgba(255, 255, 255, 0.72), transparent 21%);
}

.v3d-container canvas {
    position: relative;
    z-index: 1;
}

.fullscreen-button {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 50px;
    height: 50px;
    cursor: pointer;
    background-size: 100% 100%;
    display: none;
    z-index: 120;
}

.fullscreen-open {
    background-image: url('media/fullscreen_open.svg');
}

.fullscreen-close {
    background-image: url('media/fullscreen_close.svg');
}

/* removes tap blinking on ios devices */
* { -webkit-tap-highlight-color:rgba(0,0,0,0); }