.reaction {
    display: table-row;
}

.reaction-aligned {
    display: table-cell;
    vertical-align: middle;
}

.molecule-container {
    .reaction-aligned;
    margin: 20px;
}

.molecule-canvas {
    .reaction-aligned;
}

.arrow-container {
    .reaction-aligned;
}

.above-text {
    font-size: 0.8em;
    margin-bottom: -1em;
    min-height: 1.8em;
    text-align: center;
}

.below-text {
    font-size: 0.8em;
    margin-top: -1.6em;
    min-height: 1.8em;
    text-align: center;
}