﻿.side-by-side {
    display: flex; /* Makes the div a flex container */
    justify-content: space-around; /* Distributes space around items */
    align-items: flex-start; /* Aligns items to the start of the cross-axis (top) */
    gap: 20px; /* Adds space between flex items */
    border: 1px solid #ccc;
    padding: 10px;
}

.ss-control {
    /* flex: 1; Allows items to grow and shrink, taking equal available space */
    flex-grow: 1;
    padding: 15px;
    background-color: #f7f7f7;
    border: 2em solid #ddd;
}

.ss-content {
    /* flex: 1; Allows items to grow and shrink, taking equal available space */
    flex-grow: 3;
    padding: 15px;
    background-color: #f0f0f0;
    border: 1px solid #ddd;
}

.content-text-underline {
    text-decoration: underline;
}

.content-font-bold {
    font-weight: bold;
}

.content-font-italic {
    font-style: italic;
}

.verse-title {
    font-size: larger;
}

.verse-body {
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    border: 1px solid gray;
    padding: 10px;
}
