body {
    font-family: 'Courier New', monospace; /* Monospace font for a more retro feel */
    background-color: #555876; /* Off-white background */
    color: #000; 
    margin: 0;
    padding: 40px; /* Padding around the body */
    text-align: center; /* Center-align text */
	line-height: 1.5; /* Expand line height to be more accessible */
}

header {
    background-color: #e7a35b
        ; 
    color: #db4260; 
    padding: 10px; /* Increased padding */
    display: flex; /* Use flex for centering */
    justify-content: center; /* Center content */
    align-items: center; /* Vertically center content */
    text-transform: uppercase; /* Uppercase for a bold look */
}

h1 {
    font-size: 2.5em; /* Emphasized size */
    margin: 0; /* Remove default margin */
    letter-spacing: 2px; /* Add spacing for impact */
}


main {
    margin: 40px auto; /* Center main */
    max-width: 800px; /* Limit the width */
}

section {
    background-color: #e3d8c5; /* White background for sections */
    border: 0px;
    margin: 20px 0; /* Vertical spacing */
    padding: 30px; /* Increased padding */
    text-align: left; /* Left-align text within sections */
    box-shadow: none; /* Remove shadows for a flat look */
    position: relative; /* For ASCII decoration */
}

h2 {
    font-size: 1.75em; /* Increased size */
    margin: 0 0 15px; /* Margin below */
    text-transform: uppercase; /* Bold look */
}

textarea {
    width: 100%; /* Full width */
    height: 200px; /* Set height */
    max-width: 100%; /* Ensure it fits within section */
    box-sizing: border-box; /* Include padding and border in width */
    padding: 10px; /* Padding inside textarea */
    border: 3px solid #555876; /* Black border */
    background-color: #F3EFE7; /* White background */
    color: #000; /* Black text */
    font-family: 'Courier New', monospace; /* Monospace font */
}

footer {
    background-color: #3B3D52; /* Black footer */
    color: #e7a35b; /* White text */
    padding: 20px; /* Increased padding */
    border: 5px solid #3B3D52; /* Border matching background */
    text-align: center; /* Center footer content */
    text-transform: uppercase; /* Bold look */
}

/* ASCII Decoration */
section::before {
    content: "===============================================================================================\=";
    white-space: pre; /* Preserve whitespace */
    color: #000; /* Black text */
    font-size: 0.8em; /* Smaller size for decoration */
}



.ascii-border {
    position: relative;
    padding: 20px;
    margin: 20px 0; /* Vertical spacing */
    background-color: #eaaf71; /* White background */
    overflow: hidden; /* Hide overflow for pseudo-elements */
    border: none; /* Remove default border */
}

.ascii-border::before,
.ascii-border::after {
    content: "/////////////////"; /* ASCII decoration */
    position: absolute;
    left: 0;
    right: 0;
    color: black; /* Black text */
    font-family: 'Courier New', monospace; /* Monospace font for consistency */
    text-align: center; /* Center the ASCII text */
}

.ascii-border::before {
    top: 1px; /* Adjust to place it above */
}

.ascii-border::after {
    bottom: 1px; /* Adjust to place it below */
}

.ascii-border h2 {
    margin: 0; /* Remove margin for better spacing */
    text-align: center; /* Center the title */
}

a:link{
	color:  #F3EFE7;
	background-color: #555876;
	text-decoration: none;
	padding: 1px 4px 1px 4px;
	margin: 2px;
	text-align: center;
}

a:visited {
	color:  #F3EFE7;
	background-color: #555876;
	text-decoration: none;
	padding: 4px 4px 2px 4px;
	margin: 2px;
	text-align: center;
}

a:hover,a:active {
	color:  #F3EFE7;
	background-color:  #555876;
	text-decoration: none;
	font-weight: bold;
}

/* Mobile responsiveness */
@media (max-width: 600px) {
    h1 {
        font-size: 1em; /* Adjusted for smaller screens */
	
    }

    h2 {
        font-size: 1em; /* Adjusted for smaller screens */
    }

    section {
        padding: 20px; /* Adjusted padding for smaller screens */
    }

    textarea {
        height: 150px; /* Adjust height for usability */
    }

/* ASCII Decoration */
section::before {
    content: "=======================\=";
    white-space: pre; /* Preserve whitespace */
    color: #000; /* Black text */
    font-size: 0.8em; /* Smaller size for decoration */
}


.ascii-border {
    position: relative;
    padding: 20px;
    margin: 20px 0; /* Vertical spacing */
    background-color: #F2F2F2; /* White background */
    overflow: hidden; /* Hide overflow for pseudo-elements */
    border: none; /* Remove default border */
}

.ascii-border::before,
.ascii-border::after {
    content: "/////////////////"; /* ASCII decoration */
    position: absolute;
    left: 0;
    right: 0;
    color: black; /* Black text */
    font-family: 'Courier New', monospace; /* Monospace font for consistency */
    text-align: center; /* Center the ASCII text */
}

.ascii-border::before {
    top: 5px; /* Adjust to place it above */
}

.ascii-border::after {
    bottom: 5px; /* Adjust to place it below */
}

.ascii-border h2 {
    margin: 0; /* Remove margin for better spacing */
    text-align: center; /* Center the title */
}



}