﻿/* FORM STYLES */
input[type="text"].error, select.error, textarea.error{
	border: 1px solid #da4f49 !important;
	-webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,.35);
	-moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,.35);
	-ms-box-shadow: 0px 0px 1px 0px rgba(0,0,0,.35);
	-o-box-shadow: 0px 0px 1px 0px rgba(0,0,0,.35);
	box-shadow: 0px 0px 1px 0px rgba(0,0,0,.35);
}
/********************************************
**************VALIDATION IMAGES**************
********************************************/
.valImage{
	display: none;
	position: absolute;
}
/********************************************
****************ERROR MESSAGE****************
********************************************/
#errorMessages{
	display: none;
	position: fixed;
	left: 33%;
	width: 33%;
	min-width: 240px;
	background-color: #666;
	z-index: 501;
	border: 1px solid #000;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background-color: #FFF;
	padding: 10px;
}
#blackout{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 500;
	display: none;
}
.blackout{
	height: 100%;
	width: 100%;
	background-color: #000;
	-moz-opacity: 0.70;
	opacity:.70;
	filter: alpha(opacity=70);
}
.errorBox {
	margin:0 0 15px;
	border: 1px solid rgba(216, 49, 49, 0.55);
	padding: 0 1em 1em 1em;
	font-size: 0.75em;
	line-height: 1.25em;
	background-color: #f7f7f7;
	display: none;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.errorBox ul 
{
    padding-left: 1em;
}

/********************************************
**************BASIC FORM STYLES**************
********************************************/
.contentHolder fieldset{
	padding:0 20px 20px;
	margin-left: auto;
	margin-right: auto;
	border:1px solid rgba(193, 193, 193, .75);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.contentHolder fieldset > div{margin:0 0 0.9375em;}
.contentHolder legend, .contentHolder legend h3{width: 100%;}

.contentHolder label{
	display: inline-block;
	color: #000000;
}
/*****************************************
*************SELECT & TEXTAREA************
*****************************************/
.contentHolder select, .contentHolder textarea{
	padding:3px;
	border:none;
	box-shadow: 1px 1px 0px 0px #cfcfcf;
	border: 1px solid #ccc;
	/*margin:0 10px;*/
}
#letterCounter{
   font-size: 0.8em;
   line-height: 1.25em;
}
/*****************************************
******************INPUT*******************
*****************************************/
.contentHolder input[type=text]{
    width: 10em; /* default width for text fields */
    padding: 0.1875em 0.3125em;
    box-shadow: 1px 1px 0px 0px #cfcfcf;
	border: 1px solid #ccc;
}
.contentHolder input[type=text]:focus{
	background-color: #f7f7f7;
	background-color: rgba(247, 247, 247, .5);
	outline-style: none;
}
/********************************************
**************PLACE HOLDER TEXT**************
********************************************/
.contentHolder input.placeholder_text, .contentHolder textarea.placeholder_text{color: #777;}
::-webkit-input-placeholder{color: #777;}

/********************************************
************  HONEYPOT FOR BOTS  ************
********************************************/
#URL-HP-Ctr
{
	position: absolute;
	left: -10000px;
	top: -10000px;
}

/********************************************
**********  MAP QUEST SEARCH FIELD  **********
********************************************/
#home-content .mq-place-search{
	padding: 0;
	margin: 0;
}
#home-content .mq-dropdown-menu{
	margin: 0;
	padding: 0;
}
#home-content .mq-result{
	margin: 0;
	padding: 0 10px;
}
#home-content .mq-with-results{
	margin: 0;
	padding: 0;
}
#home-content input[id*="wcu-mq"]{
	width: 20%;
	padding: 0 5px;
    box-shadow: 1px 1px 0px 0px #cfcfcf;
    border: 1px solid #ccc;
    border-radius: 0px;
    height: 24px;
}
#home-content .mq-input-icon{
    border: 0;
    background: transparent;
    position: inherit;
    top: 0;
    bottom: 0;
    outline: none;
    padding-left: 40px;
    padding-top: 10px;
}

/********************************************
*****************MEDIA QUERIES***************
********************************************/
@media screen and (max-width: 768px){
	.contentHolder form fieldset{margin:10px 0;}
	.contentHolder input[type=text]{
		width: 100%;
		padding:5px 8px;
	}
	.contentHolder input[type=text].phone, .contentHolder input[type=text].phonefield{width:3.5em !important;}
	.contentHolder div[class^="grid"] > label{margin:15px 0 0;}
	.contentHolder div[class^="grid"]{margin-bottom:0;}
	.valImage{margin-top:15px;}
	#errorMessages{
		width: 90%;
		top: 10%;
		left: 5%;
	}
}
