@charset "utf-8";
/* CSS Document */


#formWrap {	
	margin:0 auto;
	margin:5px 10px ;
	webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #e2e2e2;
	padding:6px 10px 16px;
}

#form .row {  /* Each complete ROW */
	overflow:auto;
	padding:5px 0px;
	border-bottom:1px dotted #ccc;
	/*background-color:#FFC;*/
	display:block;
	line-height:25px;
}

#form .row .label { /* titles */
	font-size:14px;
	font-weight:400;
	
	width:180px; /* From 180 Much better */
	text-align:right; /* @ Media align left and padd out 10px or so*/
	float:left;
	padding-right:10px;
	margin-right:10px;
}

#form .row .input { /*Layer around the input itslef*/
	float:left;
	margin-right:10px;/
	width:auto;
}

#form .row .input2 { /* Layer around the comment box itslef*/
	float:left;
	margin-right:10px;
	width:auto;
	/*width:466px; Design View Fix*/
}

.detail {   /* Input Form Fields */
	width:200px; /* @media change to 97% - Will absorb the margin */
	
	font-size:12px;
	padding:4px 5px;
	display:block;
	border-radius:5px 5px 5px 5px;
	background:#f8f7f7;
	border:1px solid #ccc;
}


.detailSmall {   /* Input Form Fields */
	width:80px; /* @media change to 97% - Will absorb the margin */
	
	font-size:12px;
	padding:4px 5px;
	display:block;
	border-radius:5px 5px 5px 5px;
	border:1px solid #ccc;
}
.detailMed{   /* Input Form Fields */
	width:160px; /* @media change to 97% - Will absorb the margin */
	
	font-size:12px;
	padding:4px 5px;
	display:block;
	border-radius:5px 5px 5px 5px;
	border:1px solid #ccc;
}

.mess {  /* Comment Class */
	width:350px;
	max-width:350px;/*Chrome resize lock*/
	height:150px;
	overflow:auto;/*IE No scroll bar*/
	
	font-size:12px;
	padding:4px 5px;
	line-height:1em;
	margin:0;
	display:block;
	border-radius:5px 5px 5px 5px;
	background:#f8f7f7;
	border:1px solid #ccc;
}


#form .row .context { /* Floated layer beside the inputs */
	color:#999;
	font-size:11px;
	font-style:italic;
	line-height:14px;
	/*font-family:Arial, Helvetica, sans-serif;*/
	width:200px;
	float:left;
	
}

#form #submit {
	/*font-family:Arial, Helvetica, sans-serif;*/
	font-size:14px;
	margin-top:15px;
	margin-left:300px;
	color:#000;
	
	text-shadow:1px 1px 1px #999;
	padding:5px; /* Around button text*/
}

span.error {
	color:#f00;
	display:block;
	margin-top:2px;
	background-image:url(../images/x14.png);
	background-repeat:no-repeat;
	background-position:left 3px;/* 6 px all around*/
	padding-left:19px;
	font-size:11px;
}

input:focus {  /* When selected apply rules */
background-color:#fff;
border:1px solid #999;
outline:none;
}

textarea:focus { /* When selected apply rules */
background-color:#fff;
border:1px solid #999;
outline:none;
}

select:focus {  /* When selected apply rules */
background-color:#fff;
border:1px solid #999;
outline:none;
}

#form select { /*Form Select Boxes*/
	width:140px;
	/*height: 24px;*/
	padding:.3em;/.4em; /*firefox virt align fix*/
	background:#f0f0f0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #ccc;
}

.thxMessage {
	width:500px;
	margin:0 auto;
	padding-top:15px;
}

.fourthName {
	display:none;	
}

.project {
	display:none;
}

/* #Media Queries
================================================== */


	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 746px) {

	#form .row .label { /* titles */
	text-align:left; /* @ Media align left and padd out 10px or so*/
	width:95%;
}	


	#form .row .context { /* Floated layer beside the inputs */
		clear:left;
	}
	.mess {  /* Comment Class */
	width:240px;
	height:75px;
}
	#formWrap h2 { 
	margin:2px;
}
	#form #submit {
	margin-left:20px;

}	
.thxMessage {
	width:97%;
}
}
		
	@media only screen and (max-width: 321px) {




}