﻿
/* ----- FORMS ---- */

::-webkit-input-placeholder { color:#aaaaaa}
:-moz-placeholder { color:#aaaaaa} /* Firefox 18- */
::-moz-placeholder { color:#aaaaaa} /* Firefox 19+ */
:-ms-input-placeholder {color:#aaaaaa}


form,
.pf input,
.pf button,
.pf select,
.pf textarea,
.pf label,
.pf fieldset.compound {
	font-size:14px;
	font-family:   helvetica, arial, sans-serif;
	line-height:20px;
}

.pf input,
.pf select,
.pf textarea,
.pf label,
.pf fieldset.compound {
	display:inline-block;
}

form {
	display: block;
}

/* Panels and Sections BEGIN { */

fieldset.section {
	margin:0 0 20px 0;
	padding:0;
	width:100%;
	display:block;
	border:0;
}

fieldset.section legend	{
	padding:0;
	margin:0 0 10px 0;
	font-weight:bold;
	color:#000000;
}

form .panel {
	border:#999999 solid 1px;
	background-color:#fafafa;
	padding:20px;
	margin:0 0 20px 0;
}

/* Panels and Sections END } */

div.pf.field {
	display:block;
	width:100%;
	margin:0 0 10px 0;
	position:relative;
	padding-right:30px; /* padding needed to accomodate the help icons */
}

div.pf.field:before,
div.pf.field:after {
	/* content: ""; this is creating a gap above field*/
	display: table;
}

div.pf.field:after { 	clear: both; }


.pf fieldset.compound {
   margin:0;
   padding:0;
   display:inline-block;
   border:0;

	width:65%;
}

.pf fieldset.optgroup {
	border:0;
	margin:0;
	padding:0;
}

.pf .compound  ul	{
	width:100%;
	overflow:hidden;
	list-style:none;
	margin:0;
	padding:0;
	display:block;
}

.pf .compound  ul li	{
	padding:0;
	float:left;
	margin-right:10px;
	position:relative;
	min-height:35px;
}


.pf label,
.pf output	{
	width:35%;
	padding:8px 5px 7px 0;
	display:inline-block;
	position:relative;
	vertical-align:top;
}



.pf output { width:65%; }


.pf label.offscreen {
   position: absolute;
   left: -10000px;
   top: auto;
   width: 1px;
   height: 1px;
   overflow: hidden;
}


.pf abbr	{
	display:inline-block;
	width:10px;
	margin-left:-10px;
	border:0px;
}


.pf .radio label,
.pf .checkbox label	{
	display:inline-block;
	padding:8px 5px 7px 20px;
	width:auto;
	position:relative;	
}



.pf input[type=radio],
.pf input[type=checkbox] {
	padding:0;
	margin:0;

	position:absolute;
	left:1px;
	top:10px;
}




.pf input[type=text],
.pf input[type=email],
.pf input[type=password],
.pf input[type=color],
.pf input[type=date],
.pf input[type=datetime],
.pf input[type=datetime-local],
.pf input[type=month],
.pf input[type=number],
.pf input[type=search],
.pf input[type=tel],
.pf input[type=time],
.pf input[type=url],
.pf input[type=week],
.pf textarea,
.pf select	{
	padding:8px;
	border-color:#8E8E8E #D4D4D4 #F0F0F0 ;
	border-style:solid;
	border-width:1px;
	height:35px;
	/*width:65%;*/
}

.pf input[readonly=""],
.pf input[type=text]:disabled, 
.pf input[type=email]:disabled,
.pf input[type=password]:disabled,
.pf input[type=color]:disabled,
.pf input[type=date]:disabled,
.pf input[type=datetime]:disabled,
.pf input[type=datetime-local]:disabled,
.pf input[type=month]:disabled,
.pf input[type=number]:disabled,
.pf input[type=search]:disabled,
.pf input[type=tel]:disabled,
.pf input[type=time]:disabled,
.pf input[type=url]:disabled,
.pf input[type=week]:disabled,
.pf textarea:disabled,
.pf select:disabled	{
	color:#999999;
	background-color:#f0f0f0;
}


.pf input[type=search]	{ 	-webkit-appearance: textfield;	}


.pf .composite label,
.pf .composite select,
.pf .composite input	{ 	width:auto; }


.pf option	{ 	margin-bottom:5px;}

.pf input[type=range],
.pf input[type=file]	{
	width:65%;
	height:40px;
	padding:0;
	margin:0;
}


.pf textarea	{
	height:60px;
	width:65%;
	max-width:65%;
}


	
	




.pf select[multiple]	{ height:auto; }

.pf select[multiple] option	{ 	padding:3px;}

.pf div.error,
.pf div.feedback	{
	width:65%;
	font-size:12px;
	line-height:15px;
	margin:10px 0 0 35%; /* width of the label */
}


.pf div.error p,
.pf div.feedback p,
.pf div.hint p,
.pf div.help p	{ 	margin:0; }

.pf div.error	{ 	color:#900000; }




.pf div.hint,
.pf div.help	{
	display:none;
	width:65%;
	margin:0 0 0 35%;
	font-size:12px;
	line-height:18px;
	padding:10px;
	background-color:#f0f0f0;
	border:#e0e0e0 solid 1px;
	position:absolute;
	top:39px;
	left:0;
	z-index:1;
}

.pf div.hint:hover,
.pf div.help:hover	{	display:block; }

.pf div.help	{ z-index:2;}

.pf input:focus ~ .hint,
.pf .helpIcon:hover ~ .help	{ 	display:block;;}


.pf .helpIcon	{
	position:absolute;
	right:0px;
	top:8px;
	font-size:12px;
	display:inline-block;
	
	border-radius:50%;
	background-color:#f0f0f0;
	width:22px;
	height:22px;
	line-height:23px;
	overflow:hidden;

	text-align:center;
}




.formFooter	{
	margin:40px 0 0 0;
}

.formFooter ul	{
	width:100%;
	overflow:hidden;
	list-style:none;
	margin:0;
	padding:0;
}

.formFooter ul li	{
	float:left;
	margin:0 0 0 5px;
}

.formFooter ul li:first-child	{	margin:0; }






.pf .button,
.pf button, 
.pf input[type=button],
.pf input[type=submit]	{	
	-webkit-appearance: none;
	-moz-appearance:    none;
	appearance:         none;
	margin:0;
	padding:0;

	
	font-size:14px;
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0px 10px;
	min-width:120px;
	text-align:center;
	
	
	color:#000000;
	border:#e0e0e0 solid 1px; 
	background-color:#F9F9F9;
	

}

.pf .button:hover,
.pf button:hover, 
.pf input[type=button]:hover,
.pf input[type=submit]:hover	{ 	background-color:#f0f0f0; }



.tgTags {
	width: 50%;
}



/* --- table --- */
tr.formRow td	{vertical-align:top; }
tr.formRow .field	{ margin: 0 0 5px 0; }
tr.formRow .field:last-child	{ margin:0;}


tr.formRow input[type=text],
tr.formRow input[type=email],
tr.formRow input[type=password],
tr.formRow input[type=color],
tr.formRow input[type=date],
tr.formRow input[type=datetime],
tr.formRow input[type=datetime-local],
tr.formRow input[type=month],
tr.formRow input[type=number],
tr.formRow input[type=search],
tr.formRow input[type=tel],
tr.formRow input[type=time],
tr.formRow input[type=url],
tr.formRow input[type=week],
tr.formRow textarea,
tr.formRow select,

tr.formRow div.error,
tr.formRow div.feedback,
tr.formRow div.hint,
tr.formRow div.help	{
	width:100%;
	margin-left:0;
}

td fieldset	{	width:100%; }

td .field	{ padding:0; margin:0;}




 
.repeaterOrderCell,
.repeaterDelCell {
	width:50px;
}

div.repeaterAdd	{ margin:0 0 5px 0;	}


.repeaterOrder,
.repeaterDel	{
	display:inline-block;
	height:35px;
	width:35px;
	padding-top:6px;
	text-align:center;
	border:#e0e0e0 solid 1px;
	background-color:#F9F9F9;
}


.repeaterOrder:hover,
.repeaterDel:hover	{background-color:#f0f0f0;}

.repeaterTable div.caption {
}

.repeaterTable div.caption .acAutoCombo {
	text-align: left;
}

.repeaterTable div.caption .acAutoCombo.acIsSourceCallback	{ 
	vertical-align:middle;
}


.repeaterTable div.caption .repeaterArgs,
.repeaterTable div.caption .repeaterAdd {
	display:inline-block;
	vertical-align:middle;
}


.repeaterTable div.caption .repeaterArgs {width:65%;}
.repeaterTable div.caption .repeaterArgs label {text-align:right; vertical-align:middle;}
.repeaterTable div.caption .repeaterAdd {margin:0 0 0 5px;}

.repeaterTable div.caption .field	{ margin:0; padding:0;}


table.repeaterTable tbody.emptyMarker {
	display: none;
	text-align: center;
}
table.repeaterTable tbody.tuples:empty + tbody.emptyMarker {
	display: table-row-group;
}


/* Added by Shahriar, to be finely incorporated by Dave */
.pf.field.hidden {
	display: none;
}
.pf.field.disabled {
	color:#999999;
	background-color:#f0f0f0;
}
.pf.section.hidden {
	display: none;
}
.pf.section.disabled {
	color:#999999;
	background-color:#f0f0f0;
}

.pf.field > .tgTags {
   width: 65%;
}

.pf.field > .acAutoCombo {
   width: 65%;
}

tr.formRow .pf.field > .tgTags {
   width: 100%;
}

tr.formRow .pf.field > .acAutoCombo {
   width: 100%;
}

fieldset.composite div.pf.field {
	float: left;
	width: auto;
}