/* Style for the entire body of the webpage */
body {
  background-image: url(images/bible.png);

  /* Ensure the background covers the entire viewport */
  background-size: cover;

  /* Keep the background image fixed in place when scrolling */
  background-attachment: fixed;

  /* Center the background image within the viewport */
  background-position: center;

  /* Prevent the background image from repeating */
  background-repeat: no-repeat;

  /* Set the body height to cover the full viewport height */
  height: 100vh;

  margin: 0; /* Remove margin around main */
  padding: 0; /* Remove padding inside main */

  background-color: lightgray;

  /* Set the font family to Tahoma, with sans-serif as a fallback */
  font-family: "Tahoma", sans-serif;
  text-align: left;
  font-size: medium;
  width: 100%;
  max-width: 100%;
}

main {
  margin: 0; /* Remove margin around main */
  padding: 0; /* Remove padding inside main */
  width: 100%; /* Ensure main takes the full width */
}

footer {
  position: fixed; /* Keeps the footer at the bottom even when scrolling */
  bottom: 0; /* Positions the container at the bottom of the viewport */
  left: 0px;
  width: 100%; /* Makes the container stretch across the full width of the page */
  color: #ffffff; /* Change the font color to white for all text inside the footer */

  background: linear-gradient(
    to right,
    #2a3118,
    #450606
  ); /* Light gradient background */
  text-align: center; /* Centers the links horizontally */
  box-shadow: 0 -2px 5px rgba(241, 235, 235, 0.1); /* Adds a slight shadow */
  border-top: 1px solid #e6b7b7; /* Light top border */
  z-index: 1000; /* Ensures the footer stays above other elements */
  font-family: Arial, sans-serif; /* Font */
  font-size: clamp(15px, 18px, 20px); /* Responsive font size */
  transition: color 0.3s ease, text-decoration 0.3s ease; /* Smooth transition for hover effects */
}

footer p {
  margin: 4px;
}

.verse {
  margin-bottom: 5px; /* Space between verses */
}

.verse-number {
  float: left;
  color: white;
}

.verse-text {
  color: #333; /* Sets the text color */
  margin-left: 20px;
  margin-bottom: 0px;
  color: white;
}

strong {
  color: rgb(177, 105, 105);
}
