/****************************************************************************************
	[FORM BUILDER]
*****************************************************************************************/

/* [GENERAL SETTINGS]
-------------------------------------------------------*/
fieldset legend.frm-hdr {
	font-size: 130%;
	padding: 0 0 20px 0;
	color: #395985;
}
fieldset div.form-row {
	padding-bottom: 10px;
	width: 100%;
	float: left;
	border-bottom: 1px dotted #666;
	margin-bottom: 10px;
}
	fieldset div.form-row label,
	#main-content fieldset div.form-row p.frm-lbl {
		width: 250px;
		float: left;
		margin: 0 20px 0 0 !important;
		color: #000;
		display: block;
	}
	#main-content fieldset input.txt-input {width: 220px;}
	#main-content fieldset input.txt-input-sml {width: 75px;}
	#main-content fieldset input.txt-input-sml.dp {cursor: pointer;} /* Date Picker */
	#main-content fieldset textarea {
		height: 100px;
		width: 400px;
		overflow: auto;
	}

/* Right Column - used for multiple inputs */
fieldset div.form-row div.form-column {margin-left: 270px;}
	fieldset div.form-row div.form-column label,
	#main-content #form-builder fieldset div.form-row.lbl-wide ul li label {
		width: auto;
		float: none;
		margin: 0 !important;
		display: inline;
		color: #666 !important;
		text-align: left;
	}
	#main-content fieldset div.form-row div.form-column ul,
	#main-content #form-builder fieldset div.form-row.lbl-wide ul {
		margin: 0;
		list-style: none;
		font-size: 100%;
	}
		#main-content fieldset div.form-row div.form-column ul li,
		#main-content #form-builder fieldset div.form-row.lbl-wide ul li {padding-bottom: 2px !important;}
	/* Input Notes - appears underneath input(s) */
	#main-content fieldset div.form-row div.form-column p,
	#main-content #form-builder fieldset div.form-row.lbl-wide p.note {
		margin: 6px 0 0 0;
		font-size: 70%;	
		color: #666;
	}
			
/* Submit form */
div.submit {
	width: 100%;
	clear: both;
	padding: 25px 0;
}
	
/* [VALIDATION/NOTIFACTIONS]
-------------------------------------------------------*/
#main-content fieldset label em,
#main-content fieldset p.frm-lbl em,
em.req {
	color: red;
	cursor: help;
}

/* [SECTIONS]
-------------------------------------------------------*/
#main-content #form-builder fieldset.section {
	margin-top: 20px; 
	float: left;
	width: 100%;
}
#main-content #form-builder fieldset.section.first {margin-top: 0;}

/* [WIDE QUESTION]
-------------------------------------------------------*/
#main-content #form-builder fieldset div.form-row.lbl-wide label,
#main-content #form-builder fieldset div.form-row.lbl-wide p.frm-lbl {
	width: auto;
	float: none;
	padding: 0 0 6px 0;
	margin: 0 !important;
	text-align: left;
}
	#main-content #form-builder fieldset div.form-row.lbl-wide textarea {width: 100%;}
	
/* [MULTIPLE ANSWERS]
-------------------------------------------------------*/
/* Horizontal List */
#main-content #form-builder fieldset div.form-row ul.horizontal li {
	display: inline; 
	padding: 0 9px 0 0;
}
#main-content #form-builder fieldset div.form-row ul li.last {padding: 0;}
/* Other Rules */
#main-content #form-builder fieldset div.form-row ul li label,
#main-content #form-builder fieldset div.form-row ul li input {vertical-align: middle;}
#main-content #form-builder fieldset div.form-row ul li input.txt-input {margin-right: 4px;}
	
/* [MATRIX]
-------------------------------------------------------*/
#main-content #form-builder fieldset div.form-row table.matrix {
	margin: 0;
	width: 100%;
	font-size: 80%;
	font-family: Arial, Verdana;
}
	#main-content #form-builder fieldset div.form-row table.matrix thead th {
		font-weight: bold;
		text-align: center;
		padding: 0 10px 4px 10px;
	}
	#main-content #form-builder fieldset div.form-row table.matrix thead td,
	#main-content #form-builder fieldset div.form-row table.matrix tbody th {
		width: 90px;
		padding: 0;
		color: #666;
	}
	#main-content #form-builder fieldset div.form-row.lbl-wide table.matrix thead td,
	#main-content #form-builder fieldset div.form-row.lbl-wide table.matrix tbody th {width: 140px;}
	#main-content #form-builder fieldset div.form-row table.matrix td {
		text-align: center;
		padding: 2px 0;
		vertical-align: middle;
	}
	#main-content #form-builder fieldset div.form-row table.matrix tbody th {
		padding: 4px 0;
		text-align: left;
	}
	#main-content #form-builder fieldset div.form-row table.matrix.txt-input td {padding: 2px 5px;}
	#main-content #form-builder fieldset div.form-row table.matrix thead td,
	#main-content #form-builder fieldset div.form-row table.matrix.txt-input thead td {padding: 0;}
		#main-content #form-builder fieldset div.form-row table.matrix input.txt-input {width: 80px;}

/* [WYSIWYG]
-------------------------------------------------------*/
#main-content #form-builder fieldset div.wysiwyg {
	width: 100%;
	padding-bottom: 10px;
	float: left;
	border-bottom: 1px dotted #666;
	margin-bottom: 10px;
}
	#main-content #form-builder fieldset div.wysiwyg p,
	#main-content #form-builder fieldset div.wysiwyg ul,
	#main-content #form-builder fieldset div.wysiwyg ol,
	#main-content #form-builder fieldset div.wysiwyg table {margin-bottom: 10px;}

/* [MISC]
-------------------------------------------------------*/
#main-content #form-builder fieldset div.form-row span {
	padding-left: 4px;
	color: #666;
	font-size: 80%;
}

/* [HIDE]
-------------------------------------------------------*/
.hide,
table caption span {
	position: absolute;
	left: -9999em;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* [JQUERY DATE PICKER]
-------------------------------------------------------*/
div#dp-popup {
	position: absolute;
	z-index: 199;
}
div.dp-popup {
	position: relative;
	background-color: #000;
	padding: 2px;
	width: 176px;
	line-height: 1.2em;
	color: #fff;
	font-size: 62%;
}
	div.dp-popup h2 {
		text-align: center;
		margin: 4px 0;
		color: #fff;
		font-size: 120%;
	}
	a#dp-close {
		padding: 4px 0;
		text-align: center;
		display: block;
	}
	div.dp-popup a {
		color: #fff !important;
		padding: 3px 2px;
	}
	div.dp-popup div.dp-nav-prev {
		position: absolute;
		top: 2px;
		left: 4px;
		width: 100px;
	}
	div.dp-popup div.dp-nav-prev a {float: left;}
	div.dp-popup div.dp-nav-next {
		position: absolute;
		top: 2px;
		right: 4px;
		width: 100px;
	}
	div.dp-popup div.dp-nav-next a {float: right;}
	/* Calendar */
	table.jCalendar {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
		font-size: 100%;
	}
		table.jCalendar th {
			background-color: #333;
			color: #fff;
			padding: 3px 5px;
			text-align: center;
			border: 1px solid #fff;
		}
		table.jCalendar td {
			padding: 3px 5px;
			text-align: center;
			vertical-align: middle;
			background-color: #ccc;
			border: 1px solid #fff;
			cursor: pointer;
			color: #484848;
		}
		table.jCalendar td.other-month {
			background-color: #ddd;
			color: #999;
		}
		table.jCalendar td.today {
			background-color: #666;
			color: #fff;
		}
		table.jCalendar td.selected {
			background-color: #fff;
			color: #000;
		}
		table.jCalendar td:hover, table.jCalendar td.dp-hover {
			background-color: #fff;
			color: #000;
		}
		table.jCalendar td.disabled, table.jCalendar td.disabled:hover {
			background: #bbb;
			color: #888;
			cursor: default;
		}