body {
    background-size: cover;
    /* Image is centered vertically and horizontally at all times */
    background-position: center center;
    /* Image doesn't repeat */
    background-repeat: no-repeat;
    /* Makes the image fixed in the viewport so that it doesn't move when 
     the content height is greater than the image height */
    background-attachment: fixed;
    /* This is what makes the background image rescale based on its container's size */
    margin: 0;
    width: 100vw;
    height: 100vh;
    padding:10pt;
}

h1,
h2,
h3 {
    color: red;
}

div {
    width: 100vw;
    height: 100vh;
}

.tableStyle {
    color: white;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    width: 75%;
    background-color: #ffffff;
    min-width: 100%;
    position: relative;
    opacity: 0.5;
    background: transparent;
    text-align: center;
    padding-inline: 20px;
}

.outerLineWhiteText {
    color: white;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    text-align: center;
   
}

.outerLineRedText {
    color: red;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-align: center;
}

.verseChapterCell {
    color: black;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-align: center;
    vertical-align: text-top;
}

.verseNumberCell {
    color: black;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-align: center;
    vertical-align: text-top;
}

.verseTextCell {
    color: black;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-align: left;
    vertical-align: text-top;
    padding: 10px;
}

.verseTextCellBold {
    color: black;
    font-weight: bold;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-align: left;
    vertical-align: text-top;
}

#footer {
    position:fixed;
    bottom: 10px;
    width: 100%;
    font-size:20pt;
    font-weight:bolder;
}

/* For mobile devices */
@media only screen and (max-width: 767px) {
    body {
        /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
        background-image: url(./images/jesus-cross_2.jpg);
    }
}




