:root {
    --background-border-radius: 2px;
}

.d-grid { display: grid; }

.justify-self-start { justify-self: start; }
.justify-self-end { justify-self: end; }

.grid-area {
    display: grid;
    grid-template-rows: max-content;
    min-width: 200px;
    min-height: 150px;
    overflow: hidden;
}

.d-fab {
    position: absolute;
    right: var(--spacing-3);
    bottom: var(--spacing-3);
}

.d-fabcontainer {
    display: grid;
    gap: var(--spacing-2);
    position: absolute;
    right: var(--spacing-3);
    bottom: var(--spacing-3);
}

.gutter {
    background-color: #eee;
    background-repeat: no-repeat;
    background-position: 50%;
}

    .gutter.gutter-horizontal {
        float: left;
        height: 100%;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
        cursor: col-resize;
    }