body {
    font-family: "Georgia", serif;
    font-size: medium;

    margin: 0;
    padding: 20px 20px;
    color: #333;
    text-align: center;
    background-image: url('marble.jpg'); /* Replace with your actual image path */
    background-size: cover; /* Cover the entire screen */
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Prevent repetition */
    background-attachment: fixed; /* Fixes the background */
    position: relative;
    
}

/* Background color overlay */
body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    z-index: -1; /* Keeps it behind content */
}

p {
text-align: center;
  line-height: 2; /* Increases line spacing to 1.5 times the font size */

}
.left {text-align: left}
h2 {
    font-family: "Georgia", serif; /* Matches your body font */
    font-size: 16px; /* Adjust size as needed */
    color: #333; /* Dark gray text */
    text-align: center; /* Center-align the heading */
    margin-top: 20px; /* Add spacing above */
    margin-bottom: 10px; /* Add spacing below */
      line-height: 2; /* Increases line spacing to 1.5 times the font size */
}
p.header{
	font: 16px/1.0 Georgia, serif;
	font-weight: 200;
	text-transform: uppercase;
         text-align: center;
	margin: 35px 15px 15px 15px;
         color:rgb(45, 78, 122);
         width:auto;
}

 .prose{

  text-align: left;
	margin: 0 30px 40px 0;
     color: black;
         width:auto;

}
 .prosecenter{

  text-align: center;
   	margin: 10px 30px 40px 30px;
     color: black;
         width:auto;
	
}
.letterfootnote{

  text-align: justify;
        font-size:smaller;
	margin: 10px 30px 40px 30px;
     color: black;
         width:auto;
}

header {

    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
}

.logo {
    max-width: 97%;
margin: 30px 0 0 0;
}

nav {
    margin-top: 15px;
}

nav a {
    margin: 0 15px;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    transition: color 0.3s ease-in-out;
}

nav a:hover {
    color: #555;
}

.content {
    padding: 5px 5px 5px;
}




.button-container {
    display: flex;
    justify-content: center; /* Centers buttons */
    flex-wrap: wrap; /* Allows wrapping on small screens */
    gap: 5px; /* Adds spacing between buttons */
}

.custom-btn {
    background-color: rgba(48, 90, 106, 0.6);
    color: #fff;
    padding: 0.5vw 1vw; /* Scales padding based on viewport width */
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size:clamp();/* Text scales with screen size */
    flex: 1 1 auto; /* Allows shrinking while maintaining equal spacing */
    min-width: 100px; /* Ensures buttons don’t get too small */
    max-width: 120px; /* Prevents them from getting too big */
    text-align: center;
   
}

.custom-btn:hover {
    background-color: #a1c3bf; /* Slightly lighter on hover */
}
.subscribe-container {
    background: rgba(255, 255, 255, 0.8); /* Semi-transparent white background */
    padding: 20px;
    border-radius: 8px;
    display: inline-block;
    text-align: center;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
    margin: 20px auto;
    max-width: 400px; /* Keeps form at a reasonable width */
    width: 100%;
}

.subscribe-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.subscribe-input,
.subscribe-textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    font-family: "Georgia", serif;
}

.subscribe-textarea {
    height: 100px;
    resize: none;
}

.newsletter-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    font-family: "Georgia", serif;
    color: #333;
}

.newsletter-checkbox {
    width: 20px;
    height: 20px;
}

.subscribe-btn {
    background-color: rgba(14, 80, 113, 0.8);
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s ease-in-out;
    width: 100%;
}

.subscribe-btn:hover {
    background-color: #a1c3bf;
}


