/* ==========================================================================
   contact.css:
   Styles just for the Contact page form.
   ========================================================================== */
#contact #content { background:url(../img/company/bg_content-full.jpg) no-repeat center top; }
#contact #content { padding-bottom:20px; }

#contact th {
	color: #636363;
	padding-right: 10px;
	text-align: right;
	vertical-align: top;
	width: 80px;
}
#contact th.req:after {
	color: #FF0000;
	content: "*";
}
#contact input[type="text"] {
	border: 1px solid #CCCCCC;
	color: #777777;
	padding: 4px 5px;
	width: 200px;
}
#contact input[type="email"] {
	border: 1px solid #CCCCCC;
	color: #777777;
	padding: 4px 5px;
	width: 200px;
}
#contact input[required] {
	background-color: #FFFFCC;
}
#contact textarea {
	border: 1px solid #CCCCCC;
	color: #777777;
	height: 120px;
	padding: 4px 5px;
}
#contact .comments { text-align:left; }


@media screen and (max-width: 719px) {
	#contact #content .main { min-height:350px; border-bottom:1px solid #ccc; }
	#contact #content .sidebar { width:280px; margin:0 auto; padding-top:20px; }
	#contact #content .sidebar h2 { font-size:16px; }
	#contact #content .sidebar p.address { font-size:12px; }
	#contact textarea { width:265px; }
	#contact th { width:50px; font-size:12px; }
	#contact input[type="text"],
	#contact input[type="email"] { font-size:12px; }
	#contact .buttons { text-align:center; }

	/* MAKE PHONE #'S CLICKABLE */
	.phone > .default { display:none; }
	.phone > .mobile  { display:block; }

}
@media screen and (min-width: 720px) and (max-width:959px) {
	#contact #content .main    { width:350px; }
	#contact #content .sidebar { width:300px; padding-left:20px; border-left:1px solid #ccc; }
	#contact #content .sidebar p.address { font-size:13px; }
	#contact textarea { width:320px; }
	#contact th { font-size:14px; }
	#contact input[type="text"],
	#contact input[type="email"] { font-size:13px; }

	/* NO CLICKABLE Phone #'s */
	.phone > .default { display:block; }
	.phone > .mobile  { display:none; }

}
@media screen and (min-width: 960px) {
	#contact #content .main    { width:550px; }
	#contact #content .sidebar { width:285px; padding-left:20px; border-left:1px solid #ccc; }
	#contact #content table { width:550px; }
	#contact textarea { width:420px; }

	/* MAKE PHONE #'S CLICKABLE */
	.phone > .default { display:block; }
	.phone > .mobile  { display:none; }

}