#splash {
    position: fixed; top: 0; left: 0; z-index: 999;
    width: 100%; height: 100vh; padding: 20px;
    box-sizing: border-box;

    display: flex;
    align-items: center; justify-content: center;

    font-size:24px;
    color: #fff;
    background: #000;

    opacity: 1; visibility: visible;
    cursor: pointer;
}

#splash.hide {
    opacity: 0; visibility: hidden;
    transition: all 1s;
}

#zone {
    position: absolute;
    bottom: 18%;
    left: 50%;
    align-items: center;
}

#instruction-text {
    background: white;
    font-size: 50px;
}

#instruction-box {
    position: fixed;
    left: 25%;
    top: 20px;
    transform: translateX(-50%);
    width: calc(100% - 40px);
    max-width: 800px;
    box-sizing: border-box;
    padding: 3px;
    border: 5px solid black;
    color: red;
    font-size: 24px;
    z-index: 10;
}
/*
        this.box.style.display = 'none'
        this.box.style.position = 'fixed'
        this.box.style.left = '50%'
        this.box.style.top = '20px'
        this.box.style.transform = 'translateX(-50%)'
        this.box.style.width = 'calc(100% - 40px)'
        this.box.style.maxWidth = '800px'
        this.box.style.boxSizing = 'border-box'
        this.box.style.padding = '16px'
        this.box.style.border = `5px solid ${colors.color}`
        this.box.style.color = colors.color
        this.box.style.backgroundColor = colors.backgroundColor
        this.box.style.fontFamily = colors.font
        this.box.style.fontSize = '24px'
        this.box.style.zIndex = '10'
        */