layout.css

#view-container > * {
    display: none;
    width: 100%;
    height:  100%;
    posisiotn: absolute;
}

body[drop-target] > #view-container[layout='welcome'] > .view-welcome {
    /* Special case: trarget drop banner looks bad on the welcome view. */
    display: none;
}

#view-container[layout='welcome'] > .ViewWelcome {
    display: flex;
}

#view-container[layout|='mode'] > .ViewLegend {
    width: 200px;
    height: 80px;
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: block;
}

#view-container[layout='mode-2d'] > .View2D {
    display: block;
    overflow: hidden;
    position: relative;
}

.View2D > #contentElement {
    position: absolute;
}

#view-container[layout='mode-3d'] > .ViewGroup3D {
    display: flex;
}

.ViewGroup3D[layout="single"] > #view-3d-1 {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.ViewGroup3D[layout="double"] > #view-3d-1,
.ViewGroup3D[layout="triple"] > #view-3d-1 {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 50%;
}

.ViewGroup3D[layout="quadriple"] > #view-3d-1 {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 50%;
    overflow: hidden;
}

.ViewGroup3D[layout="double"] > #view-3d-2 {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 50%;
}

.ViewGroup3D[layout="triple"] > #view-3d-2 {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 50%;
}

.ViewGroup3D[layout="quadriple"] > #view-3d-2 {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50%;
    height: 50%;
}

.ViewGroup3D[layout="triple"] > #view-3d-3 {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 50%;
}

.ViewGroup3D[layout="quadriple"] > #view-3d-3 {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 50%;
}

.ViewGroup3D[layout="quadriple"] > #view-3d-4 {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 50%;
}