.Dialog    { Background-color: PowderBlue; }
.Dialog>h1 {  background-color: darkcyan; color:  yellow; }

.Dialog
{ border: 3px solid darkblue;
  border-radius: 10px;
  overflow: hidden;
  position: absolute;
  box-shadow: 3px 3px 30px black;
  padding:0;
}

.Dialog>h1
{ width: 100%;
  height:21px;
  margin: 0px;
  padding: 3px 15px;
  font-size: 12px;
  font-weight: bold;
  box-sizing: border-box;
  border-radius: 8px 8px 0 0;
}
/************************************************************/

.EditForm
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif;
  background-color: AntiqueWhite; 
  padding:0 0 5px 0;
  position: absolute;
  right: 0; 
  top:21px;
  border-left: 3px solid darkblue;
  height: calc(100% - 26px);
}

.EditForm>h1
{ background-color:BurlyWood;
  margin:0;
  padding: 6px 10px;
  font-size: 1em;
  font-weight:bold;
  box-sizing: border-box;
  color: black;
}

.EditForm Fieldset legend { color:#555; }

.EditForm label
{ color: #555;
  margin: 5px 0 0 3px;
  font-size: 12px;
  display: block;
}
/***************************************************************/

.List
{ border-collapse: collapse;
  background-color: PowderBlue;
/*  z-index:1;*/
  position: relative;
  float: left;
}

.List td
{ border: 1px solid grey; }

.List thead  
{ background-color: SkyBlue; 
  display: table; 
  width:100%;
}

.List thead td 
{ text-align: center; 
  font-weight: bold; }

.List tbody
{ display: block;
  overflow-y: scroll;
  overflow-x: hidden;
  border-right:1px solid grey;
  margin-right:-1px;
}

.List tbody tr
{ margin-top:-1px; 
  display: table; 
  width:100%;
  table-layout:fixed;
}
  
.List .RowSelect
{ background-color: Cyan; }

.List .ElemSel
{ background-color: #99b3ff; }
  
.List tbody tr button[name='Edit'],
.List tbody tr button[name='Print'],
.List tbody tr button[name='Delete']
{ visibility: hidden; }

.List tbody tr:hover
{ background-color:lightcyan; 
  cursor: pointer; }

.List tbody tr.ElemSel:hover
{ background-color:#ccd9ff; }

.List tbody tr:hover button[name='Edit']:enabled,
.List tbody tr:hover button[name='Print']:enabled,
.List tbody tr:hover button[name='Delete']:enabled
{ visibility: visible; }

.List .RowSelect:hover button[name='Edit'],
.List .RowSelect:hover button[name='Print'],
.List .RowSelect:hover button[name='Delete']
{ visibility: hidden; }

.List tfoot  
{ background-color: #8bd1da; 
  display: table; 
  width:100%;
}

.List tfoot td 
{ font-weight: bold;
  height: 18px;}

.List input, .List select
{ border:none;
  width:100%;
}

.List.Yellow { background-color: AntiqueWhite; }
.List.Yellow tbody tr:hover { background-color:Bisque; }
.List.Yellow thead { background-color:brown; color:#eee; }

/************************************************************/

.EditField
{ float:left;
  margin: 0px; }

.EditField label
{ color: #555;
  margin: 5px 0 0 3px;
  font-size: 12px;
  display: block;
}

label.CheckBox
{ margin:0;
  padding:0;
  color: black;
  cursor: pointer;
}

label.CheckBox:hover
{ background-color:#f7ddbb; 
  color:#e00; }
/************************************************************/

.Text2Upper 
{ text-transform: uppercase; }

.DateField  
{ background-image: url("extra/images/iconCalendar.gif");
  background-repeat: no-repeat;
  background-position: 99% 50%;
  width: 90px; 
  cursor:pointer;
}

.FormTable
{ margin-top:5px;
  color:#555; 
  float:left;
}

.Framed
{ border-collapse: collapse; }

.Framed td
{ border: 1px solid grey;
  padding: 2px;
}

.Framed thead td
{ background-color:SkyBlue; /*brown;*/
  color:black; /*#eee;*/
  font-weight: bold;
  text-align:center;  
}

.FormList
{ border-collapse: collapse; }

.FormList td
{ border: 1px solid grey;
  padding: 2px; }

.FormList thead td
{ background-color:brown;
  color:#eee;
  font-weight: bold;
  text-align:center;  
}

.FormList tbody tr
{ margin-top:-1px; }

.FormList tbody tr:hover
{ background-color:Bisque; }

.FormList thead, .FormList tbody tr
{ display: table; 
  width:100%;
  table-layout:fixed;
}
.FormList thead
{ width:calc(100% - 1.5em); }

.FormList tbody
{ display: block;
  overflow-y: scroll;
  overflow-x: hidden;
}

.FormList input, .FormList select
{ border:none;
  width:100%;
}

/*********************************************/
.SingleForm
{ background-color: PowderBlue;/*AntiqueWhite; */
  border: 2px solid darkblue;
  border-radius: 10px;
/*  overflow: hidden;*/
  position: relative;
 /* margin:5px auto;*/
  box-shadow: 3px 3px 30px white;
  padding:0;
}

div.Canvas
{ background-color:PowderBlue; 
  position:absolute; 
  border-radius:0 0 8px 8px; 
/*  min-height:calc(100% - 21px)*/
}

.SingleForm>.Canvas>h1
{ background-color:darkcyan;
  margin:0;
  padding: 6px 10px;
  font-size: 1em;
  font-weight:bold;
  box-sizing: border-box;
  color: black;
  border-radius: 8px 8px 0 0;
}

/*********************************************/

.EditFormBottom
{ background-color: AntiqueWhite; 
  width:100%;
  padding:0 0 5px 0;
  position: absolute;
  bottom: 0;
  border-top: 3px solid darkblue;
}

.EditFormBottom h1
{ background-color:BurlyWood;
  margin:0;
  padding: 2px 10px;
  font-weight:bold;
  font-size:1.2em;
  box-sizing: border-box;
  color: black;
}

.EditFormBottom Fieldset legend { color:#555; }