div, h1, form, input{ 
    padding: 0;
    margin: 0;
    outline: none;
    font-family: Roboto, Arial, sans-serif;
    font-size: 16px;
    color: #666;
    }
    h1 {
    padding: 10px 0;
    font-size: 32px;
    font-weight: 300;
    text-align: center;
    }
    hr {
    color: #a9a9a9;
    opacity: 0.3;
    }
	
 /*   form {
    margin: 0 30px;
    }*/
	
    label .icon i {
    width: 16px; /* Ensures consistent width */
    margin: 0;
    border-radius: 5px 0 0 5px;
    }
    
	input[type=text], input[type=password], input[type=email], input[type=date] {
		width: calc(100% - 57px);
		height: 36px;
		margin: 13px 0 0 -5px;
		padding-left: 10px;
		border-radius: 0 5px 5px 0;
		border: solid 1px #cbc9c9;
		box-shadow: 1px 2px 5px rgba(0,0,0,.09);
		background: #fff;
		font-family: 'Roboto', Arial, sans-serif;
		box-sizing: border-box;   /* ← add this (prevents width overflow) */
	}

    .g-recaptcha{
        margin: 10px 0 0 -2px;
    }

	.icon {
		display: inline-block;
		padding: 9.3px 15px;
		box-shadow: 1px 2px 5px rgba(0,0,0,.09); 
		background: #003893;
		color: #fff;
		text-align: center;
		height: 18px;
	}

    .btn-block {
    margin-top: 10px;
    text-align: center;
    }
    button {
    width: 100%;
    padding: 10px 0;
    margin: 5px auto;
    border-radius: 5px; 
    border: none;
    background: #003893; 
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    }
	/* New .danger class for red background */
	button.danger {
	    background: #D32F2F;  /* Red background */
	}
    button:hover {
    background: #325999;
    }
    .form-container {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;  /* Add space between menu and image section */
    }
	.agreement { 
	    padding: 0;
	    margin: 0;
	    outline: none;
	    font-family: Roboto, Arial, sans-serif;
	    font-size: 12px;
	    color: #666;
		text-align: left;
	 }
	 
	 /* Styling for the success message */
	 .success-message {
	     background-color: #d4edda;
	     color: #155724;
	     border: 1px solid #c3e6cb;
	     padding: 20px;
	     margin: 20px 0;
	     border-radius: 5px;
	     font-size: 18px;
	     font-weight: bold;
	     text-align: center;
	 }
	 
	 .delete-message {
	     background-color: #f8d7da; /* Light red background */
	     color: #721c24; /* Dark red text */
	     border: 1px solid #f5c6cb; /* Light red border */
	     padding: 20px;
	     margin: 20px 0;
	     border-radius: 5px;
	     font-size: 18px;
	     font-weight: bold;
	     text-align: center;
	 }

	 /* Styling for the login link */
	 .login-link {
	     text-align: center;
	     font-size: 16px;
	     margin-top: 10px;
	 }

	 .login-link a {
	     color: #007bff;
	     text-decoration: none;
	 }

	 .login-link a:hover {
	     text-decoration: underline;
	 }
    
	 
	 .dropdown_class {
	     padding: 12px 0 12px 2px !important;
	     border: 1px solid #d1d1d1;
	     width: 100% !important;
	     margin: 2px 0 !important;
	     height: auto !important;
	 }
	 
	 .textarea {
    	width: calc(100% - 5px);
		margin-top: 10px;
	 	font-size: 16px;
	 	border: 1px solid #ccc;
	 	border-radius: 4px;
	 	resize: vertical;
	 	display: block;
	 	height: 85px;
	 }
	 
	 .main-contact {
		display: flex; /* Use flexbox for layout */
		justify-content: space-between; /* Distribute space between left and right sections */
		gap: 20px; /* Add some space between left and right sections */
	 }

	 .left-main-contact {
	     width: 30%; /* 30% width for left section */
	     padding-right: 10px; /* Add space between the two sections */
	 }

	 .right-main-contact {
	     width: 70%; /* 70% width for right section */
	 }
	 /* Remove margin and padding from heading */
	 .form-heading {
		 margin-top: 25px;
	     margin-bottom: 5px; /* Adjust the margin below the heading */
	 }
	 
	 @media screen and (max-width: 600px) {
	 	.form-container {
	 		margin: 0 0px;
	 	}
		
		.main-contact {
		    flex-direction: column; /* Stack the sections vertically */
			gap: 0; /* Remove the gap between stacked items */
			padding: 0; /* Remove any padding */
		}
		
		/* When the screen is smaller than 600px, stack the sections vertically */
		.left-main-contact,
		.right-main-contact {
		    width: 100%; /* Full width on smaller screens */
		    padding-right: 0; /* Remove right padding */
		}
	}