/* General Setting */
html, body {
	height: 100%;
	width: 100%;
	font-family: Verdana, Arial , Helvetica, sans-serif;
	color: black;
}

body {
	background-color: white;
	font-size: 90%;
	margin: 0px;
}

.hidden
{
	display: none;
}

/* Grid Editor Setting */
.grid {
	font-size: 90%;
	border-width: 4px;
	border-style: double;
	border-color: #E2E2E2;
	table-layout: fixed;
}

.grid thead td {
  padding: 2px;
  border-width: 0px;
  font-weight: bold;
  text-decoration: underline;
  vertical-align: top;
  text-align: center;
  text-overflow: ellipsis; /* Ie only, this will put "..." at the end of a cell if the text length is longer */
  overflow: hidden;
  white-space: nowrap;
}

.grid tbody {
  /* 
  For Gecko browser, the "-moz-user-select" property prevent the text from being 
  select on the grid body.
  For Ie browser, this is handle via JavaScript TBODY attribute 
  onmouseover (true) and onmouseout (false) calling the BlockSelection function 
  inside the toolbox's.
  */
  -moz-user-select: none;
  cursor: default;
}

.grid tbody td {
  height: 26px;
  padding: 2px;
  border-width: 0px;
  text-overflow: ellipsis; /* Ie only, this will put "..." at the end of a cell if the text length is longer */
  overflow: hidden;
  white-space: nowrap;
}

.grid tbody td input {
  height: 16px;
  width: 96%;   /* Will vary depending on the '.grid tbody td' padding and browser type */
}

.grid tbody td img {
  /* Apply style to image inside the grid (type="picture" in the xml head) */
  height: 30px;
  width: 35px;
  border-width: 2px;
}

.grid tbody td span {
  /* Apply style to hyperlink inside the grid (type="hyperlink" in the xml head) */
	color: #000066;
	/* background: url(images/MyButtonImage.png) no-repeat left top; */
}

.grid tbody td span:hover {
  /* Apply style to hyperlink inside the grid (type="hyperlink" in the xml head) */
  cursor: pointer;
  text-decoration: underline;
	color: #000066;
}

.cellSelected {
  background-color: #F0F8FF; /* This is the color of the current selected CELL in the grid */
}

.rowSelected {
  background-color: #ADD8E6; /* This is the color of the current selected ROW in the grid */
}

/* Grid Editor Page X of Y Setting */
TD.page {
  padding: 0px 2px 0px 2px;
}

TD.pageof {
  padding: 0px 2px 0px 2px;
  text-align:center;
  cursor: pointer;
}

TD.pageselect {
  padding: 0px 2px 0px 2px;
  text-align:center;
  cursor: pointer;
  
  font-weight: bold;
  text-decoration: underline;
  color: Maroon;
}

/* Grid Editor Filter Setting */
.vista-box {
  /* For explanation on vista style box, please refer to:
     http://www.wickham43.supanet.com/tutorial/opacity.html */
  position: absolute;
  top: 50px;
  left: 100px;
}
.box {
  width: 690px; /* box-titlebar-left width + box-titlebar-right width (and/or content) */
  filter: alpha(opacity = 80);
  opacity: 0.80;
}

.box-titlebar-left {
  background: url(images/BoxTopLeft.png) no-repeat left top;
  height: 40px;
  width: 670px;
  float: left;
}
.box-titlebar-right {
  background: url(images/BoxTopRight.png) no-repeat right top;
  height: 40px;
  width: 20px;
  float: right;
}
.box-titlebar {
  margin: 13px 15px 0px 15px;
}
.box-titlebar-icon {
  margin-top: -3px;
  margin-right: -22px;
  position: relative;
  float: right;
}
.box-titlebar-label {
  font-size: 16px;
  font-weight: bolder;
  float: left;
}

.box-content-left {
  background: url(images/BoxBottomLeft.png) no-repeat left bottom;
  height: 400px;
  width: 670px;
  float: left;
}
.box-content-right {
  background: url(images/BoxBottomRight.png) no-repeat right bottom;
  height: 400px;
  width: 20px;
  float: right;
}
.box-content {
  margin: 0px 0px 0px 0px;
  padding: 5px 5px 5px 5px;
  background-color: white;
  height: 375px;           /* box-content-left height - (this margin-top + 15px for box-content bottom) 
                                                      - (this padding-top + this padding-bottom) */
  width: 650px;            /* box-titlebar-left width - (this left + this padding-left) */
  position: absolute;      /* overwrite opacity of box */
  top: 40px;               /* equal to the box-titlebar height */
  left: 15px;              /* replace margin-left */
  overflow: auto;          /* set all child text within this box limit */
}