html {
 /* height: -webkit-fill-available; */ /* For older WebKit browsers */
 /* overflow-x: hidden;  Hides any horizontal spillover */
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
}
body {
  min-height: 100vh;
  overflow-x: hidden; /* Hides any horizontal spillover */
  width: 100%;
  max-width: 100%;
}

hr{
	background-color:black;
	height:2px;
}

#form_error
{
	color:red;
	font-size:1.2em;
	font-weight:bold;
}	

#price
{
  font-size:1.2em;
  font-weight:bold;	
}

.data_dump {

  margin-bottom: 20px;
	width:90%;
	border-collapse:collapse;
	
}
#dump{
	width:100%;
	}

.data_dump td
{
	min-width: 0;            
	border:solid 1px black;
	cell-padding:5px;
}	



button
{
  font-size:1em;
  font-weight:bold;
}	

.tres_addr 
{
   width:210px;
   font-weight:bold;
   font-style:italic;	
   margin-left:50px;
   padding:5px 5px 5px 10px;
   border:solid 2px black;
   border-radius:5px; 	
}	
	
#fmca_error 
{
  display:none;
  color:red;
  font-weight:bold;	
}	

#p_name_error
{
  display:none;
  border:black solid 2px;
  margin-left:50px;
  padding:10px; 
  color:red;
  font-weight:bold;	
}

.emph {
	font-weight:bold;
	font-size:1.2em;
}	



/* Make all form inputs touch-friendly and scalable */
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="number"],
input[type="password"]
{
	font-weight:bold;
	max-width: 100%;                /* Never overflow */
	padding: 2px 20px;             /* Bigger tap area and comfortable typing */
	margin-bottom: 12px;            /* Consistent spacing */
	font-size: 19px;
	line-height:1.4;            	/* Critical: prevents auto-zoom on iOS */
	border: 2px solid #000;         /* Match your design */
	border-radius: 5px;             /* Optional: match your other boxes */
	box-sizing: border-box;         /* Include padding/border in width */
	background-color: #fff;
	min-width: 150px;
}

/* This targets any input or textarea when it is active */
input:focus, textarea:focus {
    background-color: #ffedd7; /* A light yellow tint */
    border: 2px solid #007bff;  /* A thick blue border */
    outline: none;               /* Removes the default browser glow */
}

/* This targets the placeholder text in all inputs */
input::placeholder {
  color: rgba(50, 50, 50, 1);
  font-style: italic;
  font-weight: 300;
  letter-spacing: 1px;
}

select
{
	font-weight:bold;
	max-width: 100%;                /* Never overflow */
	padding: 2px 10px;             /* Bigger tap area and comfortable typing */
	margin-bottom: 12px;            /* Consistent spacing */
	font-size: 19px;
	line-height:1.4;            	/* Critical: prevents auto-zoom on iOS */
	border: 2px solid #000;         /* Match your design */
	border-radius: 5px;             /* Optional: match your other boxes */
	box-sizing: border-box;         /* Include padding/border in width */
	background-color: #fff;
	min-width: 150px;
}

.boxes {
  margin-top:5px;
  max-width:800px;
  width:50%;
  align-items: left;
  text-align: left;
  font-family: Arial, sans-serif;
  border: 2px black solid; /* You can change this to 1px #ccc later for a softer look */
  padding: 1em 2em;         /* Increased breathing room inside the box */
  background: #d0d0ff;
  border-radius: 8px;      /* Slightly rounder corners feel more modern */

  height: auto;
  gap: 1rem;
}

.boxes img {
      /* float:right; */
       max-height:7em;
       }




.boxes h3, h2 {
  font-size:1.5em;
  font-weight:bold;
  color:red;
}

.boxes p {
  font-size:1.5em;
  margin: 0.5rem 0;
  line-height: 1.3;
}

.boxes li {
  font-size:1.4em;
  margin: 0.5rem 0;
  line-height: 1.3;
}


.boxes blockquote {
	font-size:1.4em;
	}

.logo_box {
	margin-top:5px;
	width:50%;
	max-width:800px;
	align-items: left;
	text-align: left;
	font-family: Arial, sans-serif;
	border: 2px solid #000; /* You can change this to 1px #ccc later for a softer look */
	padding: 1em 2em;         /* Increased breathing room inside the box */
	background: #fff;
	border-radius: 8px;      /* Slightly rounder corners feel more modern */
	
	height: auto;
	gap: 1rem;
	
	
	
}

.logo_box img {
    width: 100%;           /* Force it to span the full 90% width */
    height: auto;          /* Maintain aspect ratio */
    display: block;
    margin: 0 auto;        /* Centers it if it's smaller than the box */
}
















/* Fine-tune specifically for phones */
@media (max-width: 768px) {
    
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="number"],
	input[type="password"]
	{
		font-size: 16px;            /* Minimum to prevent iOS auto-zoom */
		padding: 2px 10px;         /* Comfortable but not huge */
		line-height: 1;
	}
	
	select {
		font-size: 16px;            /* Minimum to prevent iOS auto-zoom */
		padding: 2px 10px;         /* Comfortable but not huge */
		line-height: 4;
	}
	
	p{ font-size:3em;}
	
	.boxes {
	/* Layout: Mobile first */
		width:90%!important;
		max-width:none;
		margin: 5px auto;
		padding:1em;
		align-items: left;
		text-align: left;
		font-family: Arial, sans-serif;
		border: 2px black solid; /* You can change this to 1px #ccc later for a softer look */
		background: #d0d0e0;
		border-radius: 8px;      /* Slightly rounder corners feel more modern */
		box-sizing:border-box; 
		height: auto;
		gap: 1rem;
	}
	
	.boxes p{
		font-size:1.5em;
		margin: 0.5rem 0;
		line-height: 1.3;
	}
	
	.boxes img {
		float:right;
		max-height:4em;
	}
	
	.boxes blockquote {
		font-size:1.3em;
	}
	
	.logo_box {
    width: 90% !important;
    margin: 10px auto;
    padding: 0.5em;        /* Keep this low to maximize image size */
    border: 2px solid #000;
    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    
    /* Remove display: flex if the image is still too small */
    display: block;        
    overflow: hidden;
    height: auto;          /* Crucial: let the box grow with the image */
}

.logo_box img {
    width: 100%;           /* Force it to span the full 90% width */
    height: auto;          /* Maintain aspect ratio */
    display: block;
    margin: 0 auto;        /* Centers it if it's smaller than the box */
}
	
}