/* This style sheet is only for the contact.asp page.
===================================================================== */

/*
html {overflow-x: hidden; overflow-y: auto;}
html {overflow-y: scroll;}
*/

/* Buttons
===================================================================== */
.button {
    -moz-box-shadow: 0px 1px 0px 0px #006699;
    -webkit-box-shadow: 0px 1px 0px 0px #006699;
    box-shadow: 0px 1px 0px 0px #006699;
    background-color: #448bb9;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #448bb9;
    display: inline-block;
    color: #fff !important;
    font-family: 'Raleway', Arial, Helvetica, sans-serif;
    font-size: .875em;
    font-weight: 400;
    padding: 8px 24px;
    letter-spacing: .06em;
    text-decoration: none;
    text-transform: uppercase;
}
.button:hover {
    color: #fff !important;
    text-decoration: none;
    background-color: #3d7faa;
	cursor: pointer;
}
.button:active {
    position: relative;
    top: 1px;
    color: #fff !important;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-decoration: none;
}
.greybutton {
	margin: 0;
	padding: 6px 16px 6px 16px;
	border: none;
	color: #ffffff;
	background-color: #575757;
	font-family: Arial,Verdana,sans-serif;
	font-size: 13px;
	font-weight: bold;
	cursor: pointer;
	}
.greybutton:hover {
	background-color: #828282;
}
.greybutton:active {
	background-color: #828282;
}

/* Completed Messages in Forms
===================================================================== */
.messageCompleteContainer {
	position: relative;
	width: auto;
	height: auto;
}
.messageCompleteWrap {
	position: relative;
	white-space: wrap;
	text-align: left;
}
.messageComplete {
	height: auto;
	padding: 10px;
	color: #ffffff;
	background-color: #333333;
}
.message {
	color: #ff0000;
	text-align: center;
	font-weight: bold;
}
.messagecomplete {
	color: #000080;
	font-weight: bold;
}

/* Main Form Elements
===================================================================== */
.formsHeader {
	width: 90%;
	max-width: 640px;
	margin: 0 auto;
	text-align: justify;
}
.formsHeader p {
	padding: 0;
}
.formsTag {
	margin: 0;
	padding: 0;
}
.formsBody {
	width: auto;
}
.formsFieldset {
	width: auto;
	margin: 0;
	border: 0;
	padding: 0;
	overflow: hidden;
	background-color: #ffffff;
}
.formsLegend {
	margin: 0;
	padding: 0px 5px 0px 5px;
	background-color: #ffffff;
	font-size: 16px;
	font-weight: bold;
}
.formsBar {
	height: 1px;
	margin: 0;
	padding: 0;
	background-color: #808080;
}
.formsFieldsetHeader {
	margin: -10px 0 10px 5px;
}
.formsLabel {
	clear: both;
	float: left;
	width: 80px;
	margin: 11px 0 0 0;
	padding: 0 5px 0 0;
	text-align: right;
}
.formsLabelRequired {
	clear: both;
	float: left;
	width: 80px;
	margin: 11px 0 0 0;
	padding: 0 5px 0 0;
	text-align: right;
	font-weight: bold;
}
.formsField {
	float: left;
	width: 225px;
	margin: 4px 0 0 0;
}
.formsTextbox {
	float: left;
	width: 260px;
	margin: 4px 0 0 0;
	padding: 4px;
	border: 1px solid #cccccc;
	border-radius: 2px;
	color: #333333;
	background-color: #f9f9f9;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1em;
}
.formsTextboxWidth {
	width: 270px;
}
.formsWideTextbox {
	float: left;
	width: 260px;
	margin: 4px 0 0 0;
	padding: 4px;
	border: 1px solid #cccccc;
	border-radius: 2px;
	color: #333333;
	background-color: #f9f9f9;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1em;
}
.formsWideTextboxWidth {
	width: 270px;
}
.formsSelectbox {
	float: left;
	width: 260px;
	margin: 4px 0 0 0;
	padding: 4px;
	border: 1px solid #cccccc;
	border-radius: 2px;
	color: #333333;
	background-color: #f9f9f9;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1em;
}
.formsCheckbox {
	position: relative;
	margin: 0 5px 0 0;
	vertical-align: middle;
	bottom: 1px;
}
.formsOptions {
	margin: 0 0 0 80px;
	padding: 0 0 0 3px;
}
.formsBox {
	width: auto;
}
.formsBox1 {
	float: left;
	width: 80px;
}
.formsBox2 {
	float: left;
	width: 275px;
}
.formsFooter {
	width: auto;
}
.formsFieldsetVerticalSpacer {
	margin-top: 20px;
}
.formsTextboxVerticalSpacer {
	margin-top: 10px;
}
.formsButtonVerticalSpacer {
	margin-top: 20px;
}
.formsBottomVerticalSpacer {
	width: auto;
	height: 0;
}

/* Contact Page Wrappers
===================================================================== */
#contactBox {width: 760px; margin: 20px auto 0 auto;}
#contactBox1 {float: left; width: 388px; border-right: #eeeeee 2px solid;}
#contactBox2 {float: left; width: 340px; margin-left: 30px;}
#contactAddress {display: block;}
#contactAddressMobile {display: none;}

/* Responsive Design
===================================================================== */
@media only screen and (max-width: 920px) {
	#contactBox {width: 420px; margin: 20px auto 0 auto;}
	#contactBox1 {width: 420px; border: 0;}
	#contactBox2 {width: 340px; margin: 50px 0 0 80px;}
}
@media only screen and (max-width: 520px) {
	#contactBox {width: 360px;}
	#contactBox1 {width: 360px;}
	#contactBox2 {width: 360px; margin: 40px 0 0 0;}
}
@media only screen and (max-width: 400px) {
	#contactBox {width: 270px;}
	#contactBox1 {width: 270px;}
	#contactBox2 {width: 270px;}
	#contactAddress {display: none;}
	#contactAddressMobile {display: block;}
	.formsLabelRequired {width: 270px; padding: 0; text-align: left;}
	.formsBox1 {width: 0;}
	.formsBox2 {width: 270px;}
}