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

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

	HTML SYNTAX
	
	<ul class="form-list clear-after">
		<li>
			<label for="SSN">SSN</label>
			<span><input type="text" name="SSN" size="3" maxlength="3" /></span>
		</li>
		<li class="new-line">
			<label for="status">Status</label>
			<span>
				<select name="status">
					<option value="A">Active</option>
					<option value="I">InActive</option>
					<option value="T">Terminated</option>
					<option value="Q">Quit</option>
				</select>
			</span>
		</li>
	</ul>

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


ul.form-list {
	
}

ul.form-list:after {
	content:'.';
	display:block;
	visibility:hidden;
	height:0;
	clear:both;
}

.form-list li {
	padding:4px;
	width:275px;
	float:left;
}

.form-list label {
	text-align:right;
	float:left;
	width:110px;
	clear:both;
	padding-top:6px;
	padding-right:4px;
}

.form-list li span {
	padding:4px;
}

.form-list li.checkbox label {
	margin-left:5px;
	float:none;
}

.form-list li.checkbox span {
	float:left;
	padding-top:0;
}

.form-list .new-line {
	clear:left;
}


/*---------
   COLUMNS
 ----------*/

.form-list-4-column li {
	width:300px;
}

.form-list-4-column label {
	width:130px;
}

.form-list-6-column li {
	width:215px;
}

.form-list-6-column label {
	width:70px;
}

.form-list-7-column li {
	width:130px;
}

.form-list-7-column label {
	width:80px;
}