body {
    --canvas-size: 454px;
}

#tabs {
    display: flex;
    flex-direction: row;
}

#tabs > * {
    flex: 1 1 0;
}

#board-list {
    position: absolute;
    top: 10px;
    left: 300px;
    right: 300px;
    display: flex;
    flex-direction: column;
}

.board-info {
    display: flex;
    flex-direction: column;
    margin: 0px 0px 30px 0px;
    align-items: center;
}

.board-name {
    font-size: 50pt;
}

.board-info div {
    display: flex;
    flex-direction: row;
    width: var(--canvas-size);
    font-size: 20pt;
}

.board-shelter {
    font-size: 20pt;
    flex-grow: 1;
}

div.bv-canvas {
    display: none;
}

.board-info canvas,
.crop {
    cursor: copy;
    width: var(--canvas-size);
    height: var(--canvas-size);
}

div.crop {
    overflow: hidden;
}

.crop img {
    width: calc(var(--canvas-size) * 2.7273);
    height: calc(var(--canvas-size) * 1.5341);
    margin: calc(var(--canvas-size) * -0.3651) 0 0 calc(var(--canvas-size) * -0.8636);
}
