﻿/**********************************************************************
***  How to Accomplish a 'Table' Layout for a form with Divs  ***
*****************************************************************/
/* The Main Body of the "Tabular" Form (which is nothing more than a containing Div) */
.FormTable
{
	padding: 3px;
	clear: both;
}

/* Rows in the Form */
div.row
{
	width: 100%;
	clear: both;
	padding-top: 5px;
}

/* Dividers in the Form */
div.Divider
{
	padding-top: 10px;
	padding-bottom: 5px;
}
div.BigDivider
{
	padding-top: 15px;
	padding-bottom: 5px;
}

/* Columns in the Form Table */
div.row span.ColLabels
{
	float: left;	
}

div.row span.ColFields, div.row div.ColFields
{
	float: left;
	text-align: left;
	margin-right: 15px;	
}


/* Textboxes, dropdownlists, etc in the Fields column */
.ColFields input
{
	width: 98%;
}

.ColFields select
{
	width: 100%;
}

div.row .ListBox
{
	width: 100%;
}		

span.ColFields img
{
	margin-top: 3px;
}

span.SingleCheckBox input
{
	width: auto;
}

div.row .CheckBoxList
{
	width: 100%;
}

div.row .RadioButtonList
{
	position: relative;
	top: -6px;
}

div.row .RadioButtonList input, span.ColFields .CheckBoxList input
{
	width: auto;
}

div.row .CheckBoxList input
{
	position: relative;
	top: 2px;
	
	margin-left: 7px;
	margin-right: 7px;
	margin-top: 4px;
}

div.row .RadioButtonList input
{
	position: relative;
	top: 3px;
	margin-right: 5px;
	
	width: auto;
}

div.row .RadioButtonList label, div.row .CheckBoxList label
{
	margin-right: 10px;
}
	

/******************************************************
*	Specialized List Box Rows in the Form Table
******************************************************/	
FormTable div.ListBoxLabels
{
	margin-bottom: 2px;
}

.FormTable span.SourceListCell
{
	float: left;
	width: 41%;
}

.FormTable div.ActionButtonsCell
{
	float: left;
	width: 17%;
	
	text-align: center;
}

.FormTable span.DestinationLabelCell
{
	float: right;
	width: 41%;
	
	text-align: left;
}

.FormTable span.DestinationListCell
{
	float: right;
	text-align: right;
	width: 41%;
}

.ActionButtonContainer
{
	padding-top: 5px;
	padding-bottom: 5px;
}

.TreeContainer
{
	border: 1px inset black;
}

