/* outest table setting, to set core table width and border line */
.table_outest
{
	width:95%; 
	background-color:#FFFFFF;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:5px;
  margin-top: 2px;
}
/* outest table setting, to set core table width and WITHOUT border line. main for result page */
.table_outestNoBox
{
	width: 95%;
	background-color:#FFFFFF;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:5px;
	margin-top: 2px;
}

/* outline table setting, used to define different table in td */
.table_outline{
	padding:10px;
	border:1px solid #BCBCBC;
	background: #FFFFFF;
	padding-left: 8px;
}

/* outline table setting, used to define different table in td */
.Search_table_outline
{
  background: #FFFFFF;
  padding: 5px; 
  border: 1.5px dashed #66CCFF; 
  /*
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px; 
  */ 
  /*-webkit-box-shadow: 5px 5px 5px #888;
	-moz-box-shadow: 5px 5px 5px #888;
	box-shadow: 5px 5px 5px #888;*/
}
.Search_table_outline table{border-collapse: separate;border-spacing: 1px;}
.Search_table_outline table td{padding: 2px; vertical-align: middle;}

/* reverse of Search_table_outline - 2015/06/11.Eric */
.Search_table_outline_reverse{
	background: #FFFFFF;
	padding: 5px;
	border: 1.5px dashed #66CCFF; 
	
	/*
  -webkit-border-bottom-left-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-bottomright: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;	
  */

}
.Search_table_outline_reverse table{border-collapse: separate;border-spacing: 1px;}
.Search_table_outline_reverse table td{padding: 2px; vertical-align: middle;}

/*use for span - floating table info for header*/
.float_tableHeader
{
  background: #BCBCBC;
  color: #424242;
  font-weight: bold;
  height: 20px;
}
/*use for span - floating table Info*/
.float_tableBody
{
  position: absolute;
  color: #424242;
  text-align: left;
  width: 300px;
  visibility: hidden;  
  background-color: #E9E9E9;  
}
.table_upload
{
  width: 100%;
}
/*2015/02/13.Eric*/
.table_round_border
{
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
/*************************************
         Floating Pop_Up
**************************************/
/*to display pop-up for any approver/employee*/
.float_popup
{  
    position: absolute;
    text-align: left;
    width: 300px;
    visibility: hidden;  
    background-color: #ffffcc;
    BORDER-RIGHT: #ff9933 2px solid;
    BORDER-LEFT: #ff9933 2px solid;
    BORDER-TOP: #ff9933 2px solid;
    BORDER-BOTTOM: #ff9933 2px solid;
    FONT-WEIGHT: bold;
    FONT-SIZE: 10px;    
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;    
    FONT-VARIANT: normal;
    TEXT-DECORATION: none
}
/*************************************
         Table listing
**************************************/
/* main title of each column use for root folder */
.root_table_title{
  color:#ffffff;
  font-size: 12pt;
  
  background-color: #08b2dd;
  
  height:25px;
  text-align: center;
  padding: 4px;
}

/* main title of each column use for QG */
.root_table_title_small{
  color:#ffffff;
  font-size: 10pt;

  background-color: #08b2dd;
  
  height:20px;
  text-align: center;
  padding: 2px;
}

.root_table_title_small2
{
  color: #000000;
  font-size: 10pt;
  background-color: #CCCCCC; /*background-color: #5CA8F3;*/
  height: 20px;
  text-align: center;
  padding: 3px;
  border: solid 1px lightgrey;
}

/* a color to diffenciate different row for QG */
.QG_DefaultRow_Color1{
	background: #f5f5f5;  
}

/* a color to diffenciate different row for QG */
.QG_DefaultRow_Color2{
	background: #DDF1F5;	
	padding: 4px;
}

/*2014/05/19.Angel - */
.Table_title
{
  COLOR: #3299BB;
  FONT-WEIGHT: bold;
  FONT-SIZE: 18px;
  BACKGROUND-COLOR: #d7ebf9;
  TEXT-DECORATION: none;
  HEIGHT:30px;
}

/* a color to diffenciate different row */
.DefaultRow_Color1{
	background: #EEEEEE;
	text-align: center;
}

/* a color to diffenciate different row */
.DefaultRow_Color2{
	background: #d7ebf9;
	text-align: center;
	padding: 4px;
}

.DefaultRow_GradientRed1
{
  /* IE10 Consumer Preview */ 
  background-image: -ms-linear-gradient(bottom, #FFF0F0 0%, #FF0000 100%);
  /* Mozilla Firefox */ 
  background-image: -moz-linear-gradient(bottom, #FFF0F0 0%, #FF0000 100%);
  /* Opera */ 
  background-image: -o-linear-gradient(bottom, #FFF0F0 0%, #FF0000 100%);
  /* Webkit (Safari/Chrome 10) */ 
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFF0F0), color-stop(1, #FF0000));
  /* Webkit (Chrome 11+) */ 
  background-image: -webkit-linear-gradient(bottom, #FFF0F0 0%, #FF0000 100%);
  /* W3C Markup, IE10 Release Preview */ 
  background-image: linear-gradient(to top, #FFF0F0 0%, #FF0000 100%);
  text-align: center;
	padding: 4px;
}
.DefaultRow_GradientRed2
{
  /* IE10 Consumer Preview */ 
  background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #FFF0F0 100%);
  /* Mozilla Firefox */ 
  background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #FFF0F0 100%);
  /* Opera */ 
  background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #FFF0F0 100%);
  /* Webkit (Safari/Chrome 10) */ 
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF0F0));
  /* Webkit (Chrome 11+) */ 
  background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #FFF0F0 100%);
  /* W3C Markup, IE10 Release Preview */ 
  background-image: linear-gradient(to top, #FFFFFF 0%, #FFF0F0 100%);
  text-align: center;
	padding: 4px;
}

/* 2011/07/07.Eric a color for leave scheme/calendar assignment*/
.LvAlertRow_Color{
	background: #FFCC66;
	text-align: center;
}

/* a color to diffenciate different row */
.rowWithLine_Color1
{
  background: #ffffcc;
  text-align: left;
  border-bottom: 1px solid lightgrey;
}
/* a color to diffenciate different row */
.rowWithLine_Color2{
	background: #DDF1F5;
	text-align: left;
	border-bottom: 1px solid lightgrey;
}

.rowGrouping_Color1 {
  background: lightyellow;
  color: #000099;
  font-weight: bold;
}

.upload_title
{
  padding-left: 5px;
  text-align: left;
  background: #DDF1F5;  
  border: 1px solid #999999;
  
}
.upload_Desc
{
  padding-left:10px;
  text-align: left;
  background: #f5f5f5;  
  border: 1px solid #999999;  
 }
.td_WithBorder
{
  border-right: lightgrey 1px solid;
  border-top: lightgrey 1px solid;
  border-left: lightgrey 1px solid;
  border-bottom: lightgrey 1px solid;
}
.td_WithLeftTopBorder
{
  /*border-right-style: none;*/
  border-top: #424242 0.2 solid;
  border-bottom: #424242 0.2px solid;
  border-left: #424242 0.2px solid;
  border-right: #424242 0.2px solid;
  /*border-bottom-style: none;*/
}
 
/* sub title of each column use for root folder */
.sub_table_title{
	color:#ffffff;
	font-size: 9pt;
	background-color: #6699FF ;
	height:20px;
	font-weight: bold;
	text-align: center;
}

/* expense payroll a color to diffenciate posted */
.XPEN_VarEleFound{
	background: pink;
}
.LastRow_Scheme
{
    COLOR: #3299BB;
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    FONT-VARIANT: normal;
    BACKGROUND-COLOR: #d7ebf9;
    TEXT-DECORATION: none;
    HEIGHT: 35px;
}

/*2018/03/13.Eric*/
.tr_table_height
{
  height: 25px;
  vertical-align:bottom;
}
/*2016/01/15.Eric*/
.payslipPrint
{
  border-right: solid 4px blue;
}
.payslipEmail
{
  border-right: solid 4px green;
}

/*2016/01/21.Eric*/
.rowDisabled
{
  font-style: italic;
  color: #808080;
  font-weight: lighter;
}
/*************************************
         Title and sub Title
**************************************/
/* main title for page in the ROOT folder */
.root_title_page {
	COLOR: #3299BB;
	FONT-FAMILY: "Calibri";
	FONT-SIZE: 17pt;
	font-weight: bold;
	height:40px;
	padding-left:0px;
	padding-top:0px;
	padding-bottom:0px;
	/*
	padding-left:50px;
	background-image:url(imgs/title_bullet.gif);
	background-repeat: no-repeat;
	*/
}

/* main SMALL title for page in the ROOT folder - use on popup page such as emp listing */
.root_smalltitle_page {
	COLOR: #3299BB;
	FONT-FAMILY: "Calibri";
	FONT-SIZE: 15pt;
	font-weight: bold;
	height:30px;
	/*padding-left:35px;
	background-image:url(imgs/title_bulletsmall.gif);
	background-repeat: no-repeat;	
  */
}

/* sub title of content */
.root_title_sub
{
  /*COLOR: #34A7C4;*/
  font-family: "Calibri";
  font-size: 12pt;
  font-weight: bold;
  height: 30px;
  background-image: url(imgs/subtitle_bullet.gif);
  background-repeat: no-repeat;
  border-bottom: 1px dotted #6666ff;
  margin-top: 5px;
  padding-left: 40px;
  padding-top: 3px;
  width: 100%;
  color: #0494b8;
}

/*title after sub title*/
/*use in Setup-> employee directory*/
.root_title_sub2
{
  font-family: "Calibri";
  font-size: 12pt;
  font-weight: bold;
  padding-bottom: 5px;
  padding-top: 5px;
  width: 100%;
  color: #666666;
  text-decoration: none;
  font-style: normal;
}
/*title after sub title style 2*/
.root_title_sub3 {
	COLOR: #006699;
	FONT-FAMILY: "Calibri";
	FONT-SIZE: 12pt;
	font-weight: bold;
	height:30px;	
	font-weight: bold;
}

/*employee name & id below the masin title*/
.root_title_page_sub {
	COLOR: #424242;
	FONT-FAMILY: "Calibri";
	FONT-SIZE: 13pt;
	font-weight: bold;
	/*height:30px;*/
	font-weight: bold;
}

/*************************************
         _ Entry
**************************************/
/* outline table setting for form, used in the main table's td */
.form_outline{
	padding: 8px;
	-moz-border-radius: 5px;  
	-webkit-border-radius: 5px;  
	border-radius: 5px;
  background: #d7ebf9; /* Old browsers */
}
.form_outline table{width: 100%;border-collapse: separate;border-spacing: 5px;}
.form_outline table td{padding: 1px;}

/*2012/08/02.Eric currently use in sublist 2 and 4*/
.form_outline_style2
{
  padding:5px;
	border: 1px solid #616262

	-moz-border-radius: 12px;  
	-webkit-border-radius: 12px;  
	border-radius: 12px;
  background: #d7ebf9; /* Old browsers */
  
}
.form_outline_style2 table{width: 100%;border-collapse: separate;border-spacing: 2px;}
.form_outline_style2 table td{padding: 2px;}

/* form left side label style*/
.form_label
{
  font-size: 11pt;
  color: #424242;
  font-weight: normal;
  
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;	
  
}
/* form right side style with input entry*/
.form_td
{
  FONT-SIZE: 11pt;
  FONT-FAMILY: "Calibri";

  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;	
  
}
/* search form left side label style*/
.form_search_label
{
  font-size: 11pt;
  FONT-FAMILY: "Calibri";
}
.form_search_td
{
  FONT-SIZE: 11pt;
  FONT-FAMILY: "Calibri";
}

input, input[type=text], textarea, select, input[type=password]
{
  -moz-border-radius: 3px;  
  -webkit-border-radius: 3px;  
  border-radius: 3px;  
  border: 1px solid #3299BB; 
  FONT-FAMILY: "Calibri";
  COLOR: #424242;

  outline: 0;
  font-size: 12pt;  
  vertical-align:middle;
}
input[type="radio"]
{
  vertical-align: -3px;
}
select
{  
  -webkit-appearance : none;
  -moz-appearance : none;
  -ms-appearance: none;
  appearance: none;

  background-image: url(imgs/icon_select.png);
  -webkit-linear-gradient: (#FAFAFA, #F4F4F4 40%, #E5E5E5);
  
  background-position: 99% 50%;
  background-repeat: no-repeat;

  -webkit-padding-end: 20px;
  -webkit-padding-start: 20px;

  text-overflow: ellipsis;
  white-space: nowrap;

  padding-top: 1px;
  cursor: pointer;
  
  -webkit-border-top-left-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-bottomleft: 10px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
/*2014/07/23.Eric*/
select::-ms-expand { 
  display: none;
}   
input[type=checkbox], input[type=radio]
{
  border: 0px solid #368DBE;   
  padding-right: 10px;
 
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;

}
input[type=checkbox]
{
  width: 17px;
  height: 17px;
}
input[type=radio]
{
  width: 15px;
  height: 15px;
}
input:focus, select:focus
{
  color: #333;  
  border-color: rgba(41, 92, 161, 0.4);  
    
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);  
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);  
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);  
  outline: 0 none;
}
/*2013/06/26.Eric*/
input:disabled, select:disabled {
  background-color: #EBEBE4;
}
/*20230929.destin*/
.disabledOSelectOption {
  background-color: #A9A9A9;
  font-style:italic;
}
/* form input box */
.form_input
{
  height: 24px;
  padding: 1px 3px 1px 4px;
}
.form_mandatory
{
  background-color: #FFE1E1;
}

/* form selection box */
.form_listMenu 
{
  height: 28px;
  font-size: 12pt;
  padding-left: 3px;
  min-width: 60px;
  padding-right: 20px;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  margin-bottom: 2px;
}

.form_listMenu_multiple 
{
  height: 30px;
  font-size: 12pt;
  padding-left: 1px;
  min-width: 60px;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  
  background-image: none;
  
}
/* form text - for text that need to be shown in the form but not the input box */
.form_text {
	FONT-SIZE: 11pt;	
	color: #424242;
	font-weight: bold;
	padding-left: 2px;
	border-bottom: 1px dotted gray;
}

/*for text that with multiple line, such as textarea, use in the font/div tag */
.form_textMultiline 
{
  white-space: pre-wrap;
  word-wrap: break-word;
  word-break: break-word;
}

/* form text input as cash value*/
.form_cashvalue
{
  height: 24px;
  padding:  1px 3px 1px 3px;
  text-align: right;
}

/*form textarea*/
.form_area
{
  height: 70px;
  width: 330px;
  padding:  1px 3px 1px 3px;
}

/*2011/07/06.Eric - display text using textarea without border and scrollbar*/
.form_TextWrapArea 
{
  overflow: hidden; 
	height:100%; 
	width:100%; 
	border: none;
	FONT-SIZE: 12pt;

	font-weight: normal;
	background-color:inherit;
}

/* Only for ePersonal use - text in orange red */
.ePerson_Original_text 
{
  FONT-SIZE: 12pt;
  color: #ff4500;
}

/* Readonly Textbox */
.form_inputread
{
	border: none;
	background-color: Transparent;
	overflow: auto;  
	font-weight: bold;
	FONT-SIZE: 11pt;
	
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
/*read only input with box*/
.form_inputread_box
{
  height: 24px;
  padding: 1px 3px 1px 3px;
  background-color: #eee;
}
/* Readonly Textarea */
.form_arearead
{
  border: none;
  font-size: 12px;
  background-color: Transparent;
  overflow: auto;   

	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;     
}

/*20121022.Syenny - To be not able to select row*/
.NotSelectedRow{
  background: #f5f5f5;
  text-align: center;
}
/*2012/10/25.Eric*/
.display_msg
{
  padding: 5px 0px 5px 0px;
}
.accordion_outline
{
  -webkit-border-top-left-radius: 0px;
  -webkit-border-top-right-radius: 0px;
  -moz-border-radius-topleft: 0px;
  -moz-border-radius-topright: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;	    
}
.accordionContent h3
{
  font-size: 14px;
}
.form_field_width
{
  width: 80%;
}
/*2013/05/20.Eric - for the table row selected*/
.Table_SelectedRow
{
  COLOR: #0033cc;
  FONT-WEIGHT: bold;
  FONT-SIZE: 14px;
  BACKGROUND-COLOR: #d9ecff;
  TEXT-DECORATION: none;
}
/*2014/02/25.Eric*/
.ProgressBarStyle
{
  display:block;
  font-size: 15pt;
  color: White;
  width:0px;
  height:30px;
  background:#0DBA3B;
  vertical-align:middle;
  -moz-border-radius: 12px;  
  -webkit-border-radius: 12px;  
  border-radius: 12px;
  
}
.ProgressBarStyleResult
{
  height:500px;
  background: #ffffff;
  overflow: auto;
}
/*2014/06/24.Eric*/
.map_Outline 
{
  width: 100%;
  -moz-border-radius: 6px;  
  -webkit-border-radius: 6px;  
  border-radius: 6px;  
  background-color: gray;
}

/*2019/04/11.Eric*/
.divFilterInfo{
  display: none;
}