/* - - - - - - - - - - - - - - - - - - - - -FORM- - - - - - - - - - - - - - - - - - - - - */

/* Backgrounds */ 
#form{
	margin: 0px;
	padding: 0px;
	background: #FFFFFF;
	text-align:left;
	}
	

/* ----- POSITION ----- */
.left {float: left;}
.right {float: right;}

form ul {
	margin: 0px;
	padding: 10px;
	list-style-type: none;
	width: 720px;
	}
form li {
	line-height: 2em;
	margin: 0;
	padding: 1px 4px 6px 9px;
	display:  inline-block;
	}
form li: after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
	
/* Holly Hack Targets IE Win only \*/
* html form li{height: 1%;}
form li {display: block;}
/* End Holly Hack */

form li div {
	float: left;
	display: inline;
	margin-right: 5px;
	}
form li.focused {
	background-color: #FFF7C0;
	}
	
form li div.left {width: 48%;}
form li div.right {width: 48%;}
form li div.left .medium, form li div.right .medium{width: 96%;}

.clear {clear: both;}

form li div p {margin-bottom: 5px;}

/* ----- FIELDS AND LABELS ----- */	
label.desc {
	line-height: 125%;
	padding: 4px 4px 1px 0;
	border: none;
	color: #333333;
	display: block;
	font-weight: bold;
	}
	
form li p {
	clear: both;
	margin: 0px;
	padding: 0px;
	font: 9px/20px 'Trebuchet MS'; 
	}
	
input.text, textarea.textarea, select.select, input.FT, select.FT, textarea.FT {
	font: 12px/14px 'Trebuchet MS'; 
	color: #333333; 
	border: solid 1px;
	border-top-color: #7c7c7c;
	border-right-color: #c3c3c3;
	border-bottom-color: #dddddd;
	border-left-color: #c3c3c3;
	}
input.text, input.FT  {
	padding: 2px 0px 2px 2px;
	}

input.checkbox, input.radio {
	display: block;
	margin: 8px 0 0 3px;
	width: 13px;
	height: 13px;
	}
	
input.button {
   padding: 2px 8px;
   color: #333333;
   font: 11px/14px 'Trebuchet MS';
   letter-spacing: 2px;
   text-transform: uppercase;
   background-color: #d4e03c;
   border: solid 1px #FFFFFF;
   cursor: pointer !important;
   }
	
select.select,  select.FT {
	margin: 1px 0 1px 0;
	padding: 1px 0 0 0;
	}
	
select.select[class] {
	margin: 0;
	padding: 1px 0 1px 0;
	}

/* ----- SIZES ----- */
.third{width: 32% !important;}
.half{width: 50% !important;}
.full{width: 100% !important;}
input.small, select.small{width: 25%;}
input.medium, select.medium{width: 50%;}
input.large, select.large, textarea.textarea{width: 97%;}
input.tags{width: 315px;}
textarea.small{height: 5.5em;}
textarea.medium{height: 10em;}
textarea.large{height: 20em;}

/* ----- ERRORS ----- */
form li.error{
	background-color: #FFDFDF;
	margin: 3px 0;
	}
form li.error h3{
	margin-top: 3px;
	font-size: 110%;
	line-height: 130%;
	color: #C02C19;
	}
#liError{
	border-bottom: 1px solid #EACBCC;
	border-right: 1px solid #EACBCC;
	}
form #liError p{
	color: #222;
	font-size: 85%;
	}
	
input.error, textarea.error{
	border: 1px solid #EF5959;
	border-left: 1px solid #FF8F8F;
	border-top: 1px solid #FF8F8F;
	background: #fff;}

p.error, li.error label.desc{
	color: #C02C19; 
	clear: both;
	}

/* ----- REQUIRED ----- */
.req{
	color: #C02C19;
	font-weight: bold;
	}

/* ----- INSTRUCTIONS ----- */
.instruct{
	display: none;
	position: absolute;
	left: 100%;
	width: 40%;
	margin: -1px 0 0 10px;
	padding: 8px 7px 9px 10px;
	border: 1px solid #e6e6e6;
	background: #f5f5f5;
	line-height: 130%;
	font-size: 80%;
	color: #444;
	}
	
form li: hover .instruct, form li.focused .instruct{
	display: block;
	}