/* Reset some basic styling for consistency */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Arial, sans-serif;
  background-color: #f8f8f8 !important;
  color: #333;
}

.oneColFixCtr {
  text-align: left;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
}

#mainContent {
  margin-top: 20px;
}

#div-logo {
  margin-top: 60px;
  margin-bottom: 20px;
}

#logo {
  background: url('hosting/images/logo.png') no-repeat;
  height: 20px;
  width: 380px;
}

/* Content Box Styles */
#content_box {
  margin-top: 20px;
}

.wide_box {
  background-color: #f2f2f2;
  padding: 20px;
  border-radius: 8px;
/*  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
}

li.box
{
  font-size:14px;
  list-style-image: url('images/sqpurple.gif');  
  background-repeat: no-repeat;
}

.wide_box ul.box {
  list-style: none; /* Removes default bullets */
  padding-left: 14px; /* Adjust space for the image */
}

#content_box .col-left {
  padding-right: 20px;
}

#content_box .col-right {
  padding-left: 20px;
}

#col_left {
  padding-right: 20px;
}

#col_right {
  padding-left: 20px;
}

/* Small Add Box Styles */
.small_add_box {
  background-color: #f2f2f2;
  border-radius: 8px;
/*  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
  margin-bottom: 20px;
  padding: 15px;
}

p {
  font-size: 14px;
  color: #000;  
}

.small_add_box .smallest {
  font-size: 14px;
  color: #666;
}

#footer {
  background-color: #DDD;
  padding: 20px;
  text-align: center;
  margin-top: 40px;
}

.line {
  width: 100%;
  border-top: 1px solid #FFA0B4;
  margin: -16px 0 0 0; 
}

#footer .smallest {
  font-size: 12px;
  color: #999;
}

@media (max-width: 767px) {
  #content_box .row {
    flex-direction: column;
    align-items: center;
  }

  #col_left, #col_right {
    padding: 10px;
    width: 100%;
  }

  #content_box .col-left {
    margin-bottom: 20px;
  }
}

.contact-form {
  background: #f2f2f2; 
  border-radius: 8px;
}

#contactFormContainer {
  font-size: 0.85rem; /* Adjust as needed */
}

#contactForm label {
  font-size: 14px; /* Smaller labels */
}

#contactForm input,
#contactForm textarea {
  font-size: 0.95rem; /* Smaller input text */
  padding: 5px; /* Adjust padding to match smaller text */
}

#contactForm input,
#contactForm textarea {
  background-color: #f8f9fa; /* Light gray background */
  border: 1px solid #ced4da; /* Soft border */
  color: #333; /* Darker text color */
}

#contactForm input:focus,
#contactForm textarea:focus {
  background-color: #ffffff; /* White background */
  border-color: #ffe0e7; /* Change this to your preferred color */
  box-shadow: 0 0 5px rgba(252, 212, 221, 0.8); /* Adjust glow effect */
  outline: none; /* Remove default outline */
}

#contactForm button {
  background-color: #999; /* Custom button color */
  border-color: #999; /* Match border with background */
  color: white; /* Text color */
}

#contactForm button:hover {
  background-color: #666; /* Darker shade on hover */
  border-color: #666;
}

#message {
  resize: block;
  overflow: hidden;
  border: 2px solid #ff6d88; /* Border color to match the theme */
}

#message {
  resize: block;
  overflow: auto; /* Ensures scrollbars appear if needed */
  padding-bottom: 15px; /* Prevents text from overlapping the custom handle */
  border: 2px solid #ccc; /* Optional: Adjust the border color */
}

/* Hide default resize handle */
#message::-webkit-resizer {
  display: none;
}

input:-webkit-autofill,
textarea:-webkit-autofill {
  background-color: #fff !important; /* Light beige */
  color: #333 !important; /* Dark text */
  box-shadow: 0 0 0 1000px #fff inset !important; /* Ensure background color stays */
}