/** My own contact form stylesheets **/

.form_clear { float: none; clear: both; width: 100%;}

.form_clear2 { clear: both; width: 100%;}

.my_own_contact_form_frontend{ width: 100%;  display: block; float: none; clear: both; }

.my_own_contact_form_frontend form .form_field{ width: 100%; float:left; }

.my_own_contact_form_frontend form{  }

.my_own_contact_form_frontend form div .input_div{float: left; width: 65%; display: 'inline-block'; padding: 10px;}

.my_own_contact_form_frontend form div .label_div{ width: 35%; display: 'inline-block'; float:left; padding: 10px; }

.my_own_contact_form_frontend form div .label_div label{ width: 100%;  float:left;}

.my_own_contact_form_frontend form input[type='text']{ border-radius: 5px; border: solid 2px; clear: both;  min-width: 100%; }

.my_own_contact_form_frontend form textarea{ border-radius: 5px; border: solid 2px; resize: none;  min-width: 100%; }

.my_own_contact_form_frontend form label span.my_cnt_frm_req{ color: red; }

.my_own_contact_form_frontend form label.error{ color: red; }

.my_own_contact_form_frontend .notice{ padding: 15px; border: solid 1px; border-radius: 8px; font-weight: bold; text-align: center; }

.my_own_contact_form_frontend .success{ color: white; background-color: green; }

.my_own_contact_form_frontend .failed{ color: white; background-color: crimson; }

.notice{ padding: 15px; border: solid 1px; border-radius: 8px; font-weight: bold; }

.success{ color: white; background-color: green; }

.failed{ color: white; background-color: crimson; }

@media only screen and (max-width: 360px){
	
	.my_own_contact_form_frontend{ /* padding: 5px; */ min-width: 100%; width: 100%; max-width: 360px; }
	
	.my_own_contact_form_frontend form{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend .notice{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend form .form_field{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend form{ margin-left: 0px; }
	
	.my_own_contact_form_frontend form .input_div{ float:none; clear: both; width: 100% !important; max-width: 360px; padding: 10px 0px 10px 0px !important;}
	
	.my_own_contact_form_frontend form .label_div{ float:none; clear: both; width: 100% !important; max-width: 360px; padding: 10px 0px 10px 0px;}
	
	.my_own_contact_form_frontend form .label_div label{ width: 100%; max-width: 360px; float: none;}

	.my_own_contact_form_frontend form textarea{ width: 100%; max-width: 360px; } 
	
	.my_own_contact_form_frontend form input[type='text']{ width: 100%; max-width: 360px; }
	
	
	
}

/* For example, newer phones */
@media only screen and (min-width: 361px) and (max-width: 480px){
	
	.my_own_contact_form_frontend{ /* padding: 5px; */ min-width: 100%; width: 100%; max-width: 480px;}
	
	.my_own_contact_form_frontend form{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend .notice{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend form .form_field{ max-width: 100%; width: 100%; }
	
	.my_own_contact_form_frontend form{ margin-left: 0px; }
	
	.my_own_contact_form_frontend form .input_div{ float:none; clear: both; width: 100% !important; max-width: 480px; padding: 10px 0px 10px 0px !important; }
	
	.my_own_contact_form_frontend form .label_div{ float:none; clear: both; width: 100% !important; max-width: 480px; padding: 10px 0px 10px 0px;}
	
	.my_own_contact_form_frontend form .label_div label{ width: 100%; max-width: 480px; float:none; }
	
	.my_own_contact_form_frontend form textarea{ width: 100%; max-width: 480px; } 
	
	.my_own_contact_form_frontend form input[type='text']{ width: 100%; max-width: 480px; }
	
}

/* For example, small computer screens and larger tablets */
@media only screen and (min-width: 481px) and (max-width: 768px) {
    
}

/* For example, typical desktop monitors or larger tablet devices */
@media only screen and (min-width: 992px){
    
}

/* Large Devices, for example large monitors and TVs */
@media only screen and (min-width: 1200px){
	
}
