/* --------------------------------------------------------------

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms

   Usage:
   * For text fields, use class .title or .text
   * For inline forms, use .inline (even when using columns)

-------------------------------------------------------------- */

/*
  A special hack is included for IE8 since it does not apply padding
  correctly on fieldsets
 */
label    { font-weight: 300; width: 100px; display: inline-block; }
fieldset { padding:0 1.4em 1.4em 1.4em; margin: 0 0 1.5em 0; }
legend   { color: #333; font-weight: bold; font-size:1.1em; margin-top:-0.2em; margin-bottom:1em; }

fieldset, #IE8#HACK { padding-top:1.4em; }
legend, #IE8#HACK 	{ margin-top:0; margin-bottom:0; }

/* Form fields
-------------------------------------------------------------- */

/*
  Attribute selectors are used to differentiate the different types
  of input elements, but to support old browsers, you will have to
  add classes for each one. ".title" simply creates a large text
  field, this is purely for looks.
 */
input[type=text], input[type=password], input[type=url], input[type=email],
input.text, input.title,
textarea, select {
  background-color:#fff;
  border:1px solid #ddd;
	box-shadow: 0 0 1px rgba(0,0,0,0.1);
  color:#333;
	font: 1em "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 300;
	margin:.5em 0;
	padding: 4px;
}

select { padding-top: 3px; padding-bottom: 3px; }

input[type=text]:focus, input[type=password]:focus, input[type=url]:focus, input[type=email]:focus,
input.text:focus, input.title:focus,
textarea:focus, select:focus {
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
}

input.text,
input.title 	{ width: 350px; }
input.title 	{ font-size: 1.5em; }
textarea    	{ width: 90%; height: 150px; }
input.short,select.short			{ width: 110px; }
input.shorter,select.shorter	{ width: 70px; }
input.medium,select.medium 		{ width: 190px; }
input.long,select.long 				{ width: 270px; }
input.longer,select.longer 		{ width: 450px; }

input[type=submit] { 
	cursor: pointer;
	color: #333;
	font: 1em "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 700; 
}


/*
  This is to be used on forms where a variety of elements are
  placed side-by-side. Use the p tag to denote a line.
 */
form.inline 	{ line-height: 3; }
form.inline p { margin-bottom: 0; }

label.inline	{ margin: auto 15px; width: auto!important; }
label.start		{ margin-left: 0!important; }


/* Success, info, notice and error/alert boxes
-------------------------------------------------------------- */

label.error, label.alert, label.notice, label.success, label.info { 
	border: 1px solid #ddd;
	display: inline;
	float: none;
	font-size: .9em;
	padding: 4px;
	margin: 0 0 0 4px;
	width: auto;
}

.error, .alert { background: #f8f8f8; color: #ec008c; border-color: #ffb1df; }
.notice        { background: #fff6bf; color: #514721; border-color: #ffd324; }
.success       { background: #e6efc2; color: #264409; border-color: #c6d880; }
.info          { background: #d5edf8; color: #205791; border-color: #92cae4; }
.error a, .alert a { color: #ec008c; }
.notice a          { color: #514721; }
.success a         { color: #264409; }
.info a            { color: #205791; }

/* contact/feedback form on contact.php */
.antispam { display:none!important;}
