/* CSS Document */
/* CSS Document */

.formbox {
width:500px;
margin:20px auto;
padding:20px 0px 0px 50px;
border:1px solid #eee;
}

.cssform p{
width: 300px;
min-height:30px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;
padding-left: 165px; /*width of left column containing the label elements*/
border-bottom: 1px dotted #e4e4e4;
font-family:'Open Sans', Arial, Helvetica, sans-serif;
font-size:11px;
color:#666;
}

.cssform p:last-of-type{
border-bottom: none;
}

.cssform label{
font-weight: normal;
float: left;
text-transform:uppercase;
margin-top:6px;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}
.cssform label span.redstar {
color:#FF0000;
}

.cssform input[type="text"], textarea, select{ /*width of text boxes. IE6 does not understand this attribute*/
border: solid 1px #E5E5E5;
	background: #eee;
	padding: 5px;
	display:block;
	font-size:13px;
	width:83%;
	

}
.cssform input[type="text"]:focus , textarea:focus
{
	background:#feffef;
}
.cssform textarea{
width: 250px;
height: 100px;
}
.btn-value {
margin-left:165px;
}
.btnsubmit {
	background-color:#C11A22;
	border: 0px solid #ccc;
	color: #fff;
	font-family: 'Calibri', Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 0 9px;
	text-align: center;
	width: 100px;
	cursor:pointer;
	margin:15px auto 10px auto;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-moz-box-shadow: 0px 0px 2px #fff inset;
	-webkit-box-shadow: 0px 0px 2px #fff inset;
	box-shadow: 0px 0px 2px #fff inset;
}
.btnsubmit:hover {
	background: #e7604a;
	-moz-box-shadow: 0px 0px 2px #eaeaea inset;
	-webkit-box-shadow: 0px 0px 2px #eaeaea inset;
	box-shadow: 0px 0px 2px #eaeaea inset;
	color: #fff;
	text-shadow: 0px 0px 0px #fff;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

@media screen and (max-width: 1200px){ /* responsive form settings, when window width is 480px or less */

.formbox {
width:100%;
margin:20px auto;
padding:20px 0px 0px 0px;
border:0px solid #eee;
}
.btn-value {
margin-left:0px;
}

	.cssform p{
		padding-left: 0;
		width: auto;
		padding-bottom: 1em;
	}

	.cssform label{
		float: none;
		display: block;
		margin-left: 0;
	}

	.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
		width: 95%;
	}
	
	.cssform textarea{
		width: 95%;
	}
}