.page_content.inside_page h1 {
    padding: 0px !important;
    margin-top: 0;
}

#content-start {
    padding: 0;
}

h1#content-start {
    padding: 0 !important;
}

input[type="text"] {
    /* Base styles for a clean, modern look */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    
    background-color: #ffffff; /* A subtle off-white background */
    color: #282217;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 400;

    padding: 12px 16px; /* Generous padding for better usability */
    border: 1px solid #d1d1d1; /* A neutral, light border */
    border-radius: 8px; /* Slightly rounded corners for a softer look */
    
    width: 100%; /* Makes the input a block element, easier for layout */
    line-height: 1.5; /* Improves readability of text inside the input */
    transition: all 0.2s ease-in-out;
}

input[type="text"]:hover {
    border-color: #a3a3a3; /* A slightly darker border on hover */
}

input[type="text"]:focus {
    outline: none; /* Remove default blue outline */
    border-color: #132092; /* A strong, purposeful color for focus */
    box-shadow: 0 0 0 3px rgba(19, 32, 146, 0.2); /* A subtle, expanding glow effect */
}


select {
    /* Step 1: Remove default browser styling for a custom look */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* Step 2: Custom Dropdown Arrow (using an inline SVG for performance) */
    /* This creates a clean, downward-pointing arrow symbol */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23293041' d='M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center; /* Position the arrow on the right */
    background-size: 16px 12px; /* Set the size of the arrow */
    padding-right: 40px; /* Crucial: make space for the custom arrow */

    /* Step 3: Base Styles */
    background-color: #f5edd6;
    color: #282217;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 400;

    /* Spacing and Dimensions */
    padding: 12px 16px; /* Generous padding for a larger hit area */
    border: 1px solid #d1d1d1;
    border-radius: 8px; /* Softer, modern corners */
    width: 100%;
    line-height: 1.5;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

select:hover {
    border-color: #a3a3a3;
}

select:focus {
    outline: none; /* Remove default blue outline */
    border-color: #0c4f3e
    box-shadow: 0 0 0 3px rgba(19, 32, 146, 0.2);
}



textarea {
  /* Reset default styles and set basic typography */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;

  /* Spacing and dimensions */
  padding: 12px 16px;
  width: 100%;
  min-height: 120px; /* Ensures the textarea is a usable size by default */
  line-height: 1.5;

  /* Visual design */
  background-color: #f5edd6; /* A soft, modern background color */
  color: #282217;
  border: 1px solid #d1d1d1;
  border-radius: 8px; /* Softer, modern corners */
  resize: vertical; /* Allows resizing only vertically to avoid layout issues */
  transition: all 0.2s ease-in-out;
}

textarea:hover {
  border-color: #a3a3a3; /* Darker border on hover */
}

textarea:focus {
  outline: none; /* Removes the default outline */
  border-color: #0c4f3e; /* The primary brand color for focus */
  box-shadow: 0 0 0 3px rgba(19, 32, 146, 0.2); /* A subtle, expanding glow effect */
}



input[type=button] {
    padding: 8px 16px;
    border-radius: 5px;
    border-color: #309b80;
    box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.04);
}

* {
  box-sizing: border-box; /* Ensures padding and border are included in the element's total width and height */
}

.page-buttons input[type=submit],
.page-buttons input[type=button],
input[type=submit],
input[type=button] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; /* Removes default browser styling for a consistent look */
  
  background: #0c4f3e;
  color: #Ffffff;
  
  font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; /* A modern, clean font stack */
  font-size: 1rem;
  font-weight: 600;
  
  padding: 14px 28px; /* Generous padding for a larger, more touch-friendly button */
  border-radius: 8px; /* Softly rounded corners for a modern feel */
  border: none;
  cursor: pointer;
  display: inline-block;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease; /* Smooth transitions for all state changes */
  user-select: none;
}

.page-buttons input[type=submit]:hover,
.page-buttons input[type=button]:hover,
input[type=submit]:hover,
input[type=button]:hover {
  background: #1a8268; /* A slightly lighter shade on hover */
  transform: translateY(-2px); /* A subtle lift effect */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* A soft shadow for depth */
}

.page-buttons input[type=submit]:focus,
.page-buttons input[type=button]:focus,
input[type=submit]:focus,
input[type=button]:focus {
  outline: 2px solid #1B2FBC;
  outline-offset: 4px; /* A clear, visible focus indicator for accessibility */
}

.page-buttons input[type=submit]:active,
.page-buttons input[type=button]:active,
input[type=submit]:active,
input[type=button]:active {
  background: #0b3d31; /* A darker shade on click */
  transform: translateY(1px); /* A pressing down effect */
  box-shadow: none; /* Removes the shadow for a "pressed" look */
}