/***********************************************
/***********************************************
			Forms
/***********************************************
***********************************************/


select
{
   color: black !important;
}


/******* Fixed Width Forms **********/
div.fixed-form
{
	max-width: 500px;
	margin: 0 auto;
}


/****** Form Wrapper *********/
.form-wrapper
{
	background: rgba( 255, 255, 255, .1);
	padding: 0 .5rem .5rem .5rem;
	margin-bottom: 1rem;
}

.form-wrapper-header
{
	margin: 0 -.5rem 0 -.5rem;
	background: rgba( 255, 255, 255, .2);
	text-align: center;
	padding: .5rem 0;
	margin-bottom: .5rem;
}

.form-wrapper h3
{
	line-height: 1.1em;
	margin: 0;
}


/********* Form Elements *************/
input[type="submit"]
{
	display: inline-block;
	line-height: 2.5em;
	white-space: nowrap;
	font-size: .85rem;
	padding: 0 1em;
	border-radius: 4px;
	border: none;
	font-weight: 600;
	cursor: pointer;
	background: #09f !important;	
	color: white !important;
}

input[type=file]
{
	border: 1px solid #555;
	padding: .5rem;
	display: block;
	width: 100%;
	font-size: .8rem;
	background: #222;
	border-radius: 5px;
}

/********* General Form Styles *************/
form { color: white !important; }

.mc-field-group { margin-top: 1rem; }
span.asterisk { color: red; }

#email-form-link
{
	line-height: 70px;
	margin: 0 !important;
}

.form-alert
{
	background: #FF1300;
	color: white;
	font-family: Helvetica;
	font-size: .85em;
	font-weight: 600;
	padding: .1em .3em;
}


.form-required-field-marker
{
	color: red;
	font-size: 1rem;
	text-shadow: 0px 1px 1px #000;
}

form small
{
	font-size: .76rem;
	display: block;
	margin-top: .25rem;
	line-height: 1.4em;
	color: #CCC;
	font-weight: 600;
}

/********* Form Elements *************/
input[type=text],
input[type=search],
input[type=text],
input[type=text]:focus,
input[type=email],
input[type=email]:focus,
input[type=password],
input[type=search],
input[type=password]:focus
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	padding: 0 .3em !important;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	margin: 0 !important;
	border-radius: 0px !important;
	-webkit-appearance: none !important;
	-webkit-border-radius: 0px !important;
	max-width: 100%;
	width: 100%;	
	background: #333;
	box-shadow: inset 1px 1px 3px #000;
	color: white !important;
	font-size: .85rem !important;
	line-height: 2.2em !important;
	height: 2rem !important;
	font-weight: 600;
	border: 1px solid #777 !important;
}
input:focus,
textarea:focus,
input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
input[type=search]:focus
{
	outline: none;
	box-shadow: 0px 0px 2px #0af !important;
	background: #222 !important;
}

form textarea, textarea
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	padding: 0 .3em !important;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	margin: 0 !important;
	border-radius: 0px !important;
	-webkit-appearance: none !important;
	-webkit-border-radius: 0px !important;
	max-width: 100%;
	width: 100%;	
	background: #333 !important;
	box-shadow: inset 1px 1px 3px #000;
	color: white !important;
	font-size: .85rem !important;
	line-height: 1.4em !important;
	font-weight: 600;
	border: 1px solid #777 !important;
}

::placeholder
{
  color: #777 !important;
  opacity: 1;
}
form label, label
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	text-transform: uppercase;
	line-height: 2rem;
	margin: 0 .5rem 0 0;
	display: inline-block;
	color: white;
	font-size: .75rem !important;
	letter-spacing: .05rem;
	font-weight: 900;
}

form input[type="checkbox"] { width: auto; }


form input[type="radio"]+label,
form input[type="checkbox"]+label,
form label.checkbox
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	text-transform: none !important;
	line-height: 2rem;
	cursor: pointer;	
	font-size: .85rem !important;
	letter-spacing: 0rem !important;
	font-weight: 600 !important;
}

form input[type="checkbox"] 
{
	width: auto;
}

form input[type="checkbox"]+label,
form label.checkbox
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	text-transform: none !important;
	font-size: .9rem;
	line-height: 2rem;
	cursor: pointer;
}

form input[type="checkbox"] { width: auto; }

form input[type="checkbox"]+label,
form label.checkbox
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	text-transform: none !important;
	font-size: .9rem;
	line-height: 2rem;
	cursor: pointer;
}

form input[type="checkbox"] { width: auto; }

form input[type="checkbox"]+label,
form label.checkbox
{
	font-family: "Open Sans", Helvetica, Sans-Serif !important;
	text-transform: none !important;
	font-size: .9rem;
	line-height: 2rem;
	cursor: pointer;
}

.checkbox-stack
{
	line-height: 1em;
}

form .checkbox-stack input[type="radio"], 
form .checkbox-stack input[type="radio"]+label, 
form .checkbox-stack input[type="checkbox"]+label,
form .checkbox-stack label.checkbox
{
	line-height: 1.7em !important;
}
form select, select
{
	border: 1px solid #cdcdcd !important;
	max-width: 100%;
	height: 2rem;
	line-height: 2em;
	appearance: inherit !important;
	-webkit-appearance: inherit !important;
	padding: 0 1.5rem 0 .5rem;
	font-size: .9rem;
	margin: 0px !important;
	font-weight: 600;
	background-color: #cdcdcd;
	box-shadow: inset 0px 10px 20px #fff;
	border-radius: 5px;
}
form select:focus
{
  background-color: #ddf;
}


form select[multiple]
{
	height: inherit;
}

form input.input-mini,
form input.input-mini:focus { width: 3rem; }

form th small
{
	font-size: .6rem !important;
	font-family: "Open Sans", Helvetica, Sans-Serif;
	color: #DDD;
	line-height: 1rem;
}

/* putting form rows inside of this will automatically space the rows with horizontal dividers. */
.form-rows-wrapper .form-row
{
  border-bottom: 1px solid #555;
  padding-bottom: 1rem;
  margin-bottom: 1rem !important;
}

.form-rows-wrapper .form-row:last-child
{
  border-bottom: none;
  margin-bottom: 0px !important;
}

.form-row 
{
	margin-bottom: .5rem !important; 
}

.section-row
{
	padding-top: .5rem;
	padding-bottom: .5rem;
	border-bottom: 1px solid #555;
}
.form-row.last
{
	border-bottom: none;
}

.form-rows-wrapper .row
{
	padding-top: .25em;
	padding-bottom: .25em;
}

.form-rows-wrapper .row .columns
{
	padding-left: 0;
	padding-right: 0;
}

input[type=text][readonly],
input[type=text][readonly]:focus,
input[type=email][readonly],
input[type=email][readonly]:focus,
input[type=password][readonly],
input[type=password][readonly]:focus
{
  background: #444 !important;
  color: #999 !important;
  border: 1px solid #555 !important;
}

input[type=text].price,
input[type=text].price:focus { text-align: right; }

input.inline,
select.inline,
select#shipping_method
{
	display: inline-block !important;
	max-width: auto !important;
	width: auto !important;
	min-width: 3rem;
}

input[type="radio"],
input[type="radio"]+label
{
	line-height: 1.5em;
	text-transform: inherit;
	cursor: pointer;
}
.stacking-form label
{
	margin-top: .5rem;
}

input[type=text].invalid, 
input[type=password].invalid, 
input[type=email].invalid
{
	border: 1px solid #ff3300 !important;
}

input[type="password"].valid,
input[type="email"].valid,
input[type="text"].valid
{
	border: 1px solid #00b359 !important;
}

input:disabled,
textarea:disabled,
textarea:read-only
{
	background: #ccc !important;
	color: #555 !important;
}

.form-field-wrapper
{
	margin-bottom: .5rem;
}

.form-field-wrapper label
{
	line-height: 1em;
}

/*****************************/
.form-error
{
	color: #ff3300 !important;
	font-size: .8rem;
	font-family: Helvetica !important;
	display: none;
	line-height: 1.2em;
	margin-top: .25em;
	font-weight: 900 !important;
}

.form-error.visible
{
	display: inherit;
}

.form-error.form-message
{
	color: #999 !important;
}
	
.form-error.valid
{
	color: #00b359 !important;
}	
	
label.valid
{
	color: #00b359 !important;
}

label.valid:before
{
	font-family: FontAwesome;
	content: '\f058';
	color: #00b359;
	margin-right: .2em;
}


/*************** Form Validation ************/

input[type=text].incomplete, 
input[type=password].incomplete, 
input[type=email].incomplete,
input[type=text].incomplete:focus, 
input[type=password].incomplete:focus, 
input[type=email].incomplete:focus
{
	border-color: yellow !important;
}

input[type=radio].styled-radio
{
  display: none;
}

input[type=radio].styled-radio+label
{
  display: inline-block;
  background: #777;
  padding: .5rem 1rem .5rem .5rem;
  border-radius: 4px;
  margin-bottom: .25rem;
  font-size: .85rem !important;
  line-height: 1em !important;
}


input[type=radio].styled-radio+label:before
{
  font-family: FontAwesome;
  content: "\f111";
  margin-left: .25rem;
  margin-right: .25rem;
}
input[type=radio].styled-radio:checked+label
{
  background: #09f;
}


input[type=radio].styled-radio:checked+label:before
{
  font-family: FontAwesome;
  content: "\f058";
  margin-left: .25rem;
  margin-right: .25rem;
}
input[type=text].double-sized
{
  font-size: 1.5rem !important;
  line-height: 2rem !important;

}
	
/* New style added 7/14/22 for new freeform layout */
.form-label
{
	font-size: 1.1rem !important;
	font-weight: 700;
	letter-spacing: 0px;
	margin-top: 0px;
	margin-bottom: .5em;
	line-height: 1.5em !important;
}
.help-block, .help-text
{
  font-style: inherit;
  color: #eee;
  font-size: .9rem;
  margin-bottom: .5rem;
}
.checkbox-group label.checkbox-label,
.radio-group label.radio-label
{
  font-weight: inherit !important;
  text-transform: none;
  letter-spacing: inherit;
  margin-bottom: 0px;
  line-height: 1em;
  padding: 0;
  font-size: .85rem !important;
  cursor: pointer;
  color: #ccc;
}

.checkbox-group input,
.radio-group input
{
  margin-bottom: 0px;
  margin-right: .1em;
  line-height: 1em;
  padding: 0;
}
.radio-group#overall_satisfaction-options .radio
{
  display: inline-block;
}
.radio-group#overall_satisfaction-options .radio input+label
{
  margin-right: .2em;
  margin-left: 0;
}


/* Inline search form used in various sections of the site */
.inline-search-form
{
	text-align: right;
	float: left;
	width: 100%;
}

.inline-search-form input
{
	float: left;
	width: 80% !important;
	padding: 0;
}

.inline-search-form .inline-search-button
{
	background: #0099ff;
	float: right;
	width: 19%;
	
	height: 2rem;
	margin: 0;
	padding: 0;
	color: white;
}