/* Last Updated 10-23-2024 */
body {
  font-family: Arial, sans-serif;
  font-size: 16px;
  line-height: 25px;
  margin: 0;

  /* Professional "Midnight" Mesh Gradient */
  background-color: #1E1E23; /* Deep charcoal base—softer than black */
  background-image: 
    radial-gradient(at 0% 0%, rgba(234, 194, 240, 0.2) 0px, transparent 55%),   /* EAC2F0 */
    radial-gradient(at 100% 0%, rgba(227, 152, 220, 0.2) 0px, transparent 55%), /* E398DC */
    radial-gradient(at 100% 100%, rgba(199, 107, 196, 0.25) 0px, transparent 55%), /* C76BC4 */
    radial-gradient(at 0% 100%, rgba(235, 127, 134, 0.2) 0px, transparent 55%); /* EB7F86 */
  
  background-attachment: fixed;
  background-size: cover;
  
  /* Light grey text for high-end readability */
  color: #E0E0E0; 
}


header { 
  color: #FFFFFF; 
  text-align: center; 
  /* Updated background properties */ 
  background: #1E1E23 url("images/4k.avif") no-repeat center center; 
  background-size: cover; 
  /* This makes the image fill the whole space */ 
  height: 152px; 
  padding: 20px; 
  /* Optional: smoothing the transition to your professional background */ 
  border-bottom: 1px solid rgba(234, 194, 240, 0.2); 

  /* Added Black Rounded Outline */
  border: 2px #EC9EBB;
  border-radius: 20px;
  overflow: hidden; /* This ensures the background image doesn't "leak" past the rounded corners */
}
 

nav {
	text-align: center;
	background-color: #496D2B;
	border-bottom: 2px solid #459302;
	border-top: 2px solid #459302;
	padding-bottom: 4px;
	padding-top: 10px;
}
/* The space between hyper linked buttons */
nav a {
	padding-left: 10px;
	padding-right: 10px;
}
/* The float CSS property places an element on the left or right side
 of its container, allowing text and inline elements to wrap around it. */
aside {
	float: right;
	font-size: 14px;
	text-align: center;
	padding: 20px;
	width: 210px;
}
/* The float CSS property places an element on the left or right side
 of its container, allowing text and inline elements to wrap around it. */
article {
	float: left;
	overflow: auto;
	text-align: justify;
	padding: 20px;
	width: 710px;
}
/*A container is for styling the entire width of a section. 
A wrapper is for styling and centering the max-width content inside it.*/
#wrapper {
  /* A smooth vertical gradient using your palette */
  background: linear-gradient(
    to bottom, 
    rgba(234, 194, 240, 0.95), /* EAC2F0 with slight transparency */
    rgba(235, 127, 134, 0.95)  /* EB7F86 with slight transparency */
  );
  
  /* Updated border to a deeper magenta from your list (#C76BC4) */
  border: 2px solid #C76BC4; 
  
  margin: auto;
  width: 1000px;
  
  /* Adds space so your text doesn't touch the edges */
  padding: 20px;
  
  /* Matches the rounded style of your images */
  border-radius: 15px; 
  
  /* Optional: adds a soft glow to separate it from the mesh background */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

footer {
  clear: both;
  color: #000000; /* Main footer text to black */
  text-align: center;
  background-color: #DB7496; 
  border-top: 2px solid #DB7496; 
  padding-top: 15px; 
  padding-bottom: 10px;
  border-radius: 10px;
  border: 2px #459302;
}

/* Updated footer links to black */
footer a {
  color: #000000;
  text-decoration: underline; /* Added underline so people know they are links */
}

/* Ensure the h6 is also black */
footer h6 {
  margin: 0;
  color: #000000;
}

 
.alignleft {
	float: left;
	padding-right: 20px;
}
/*horseback riding, dining, and lodging boy*/
.alignright {
	float: right;
	padding-left: 20px;
}
/*register page only*/
form span {
	float: left;
	width: 200px;
}
/*water activities and dining only repeat external, internal, and in line*/
th, td {
	text-align: center;
	padding-left: 5px;
	padding-right: 5px;
}
/*index page paragraph*/
.quote_author {
	color: #FFC0CB;
	font-style: italic;
}
/*any h1 header*/
header h1 {
	margin: 0;
}

h1 {
  margin: 0;
  font-size: 36px;
  /* Optional: keeps text readable if the image is busy */
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.6); 
}
.rounded-img {
  /* This rounds the actual image corners */
  border-radius: 20px; 
  
  /* This creates the black outline */
  border: 3px solid #000000; 
  
  /* Optional: keeps the image looking sharp if resized */
  display: block;
  margin: 0 auto; /* Centers the image inside the <p> tag */
}