﻿/*******************  CSS for StyleSheetMaster.css  **********************/
.Navigation.More, .HeaderTextDetail.More
{
    background-image: url(../../X8/Style/images/btndown.png);
    background-position: 80% center;
    background-repeat: no-repeat;
    padding-right: 16px;
    cursor:pointer;
}

div.loader
{
    background-image: url(images/loading.gif);
    width: 16px;
    height: 16px;
}

.statusbar, .statusbarHome
{
    position: fixed;
    bottom: 0px;
    left: 0px;
    height: 32px;
    z-index: 1111;
}

div.statusbarHome
{
    height: 18px;
}
div.statusbarHome #zoneright
{
    float: right;
    margin-right: 30px;
}
.statusbar #zoneright
{
    float: right;
    margin-right: 30px;
}
.statusbar #zoneCenter
{
    margin-right: auto;
}

.DetailShower   
{
	display: none;
    position: absolute;
    padding: 0px;
    padding-top: 20px;
    background-image: url(images/pointer.gif);
    background-position: top left;
    background-repeat: no-repeat;
    list-style: none;
    z-index: 9999;
}
.DetailShower.Darker .BGContent
{
	background-color: #d0d0d0;
}

.DetailShower .BGContent
{
	background-color: #f0f0f0;
	float:left;
	position:relative;
}
.DetailShower .Content
{   
	margin:5px;
    text-align: left;
    position:relative;   
}
/*  Common */
.contentSeperator
{
}
.CommandZone
{
    margin-left: auto;
    margin-right: auto;
}
.last
{
    padding: 10px;
}

.tbForm
{
    max-width : 973px;
	margin:auto;
}
.tbSearch
{
    margin-left: auto;
    margin-right: auto;
    width: 92%;
    max-width : 973px;
}
.tbFormNormal
{
    width: 700px;
}
.tbFormLarge
{
    width: 850px;
}
.tbFormLarger
{
    width: 950px;
}
.tbFormSmall
{
    width: 550px;
}
tr.trMargin td
{
    padding-bottom: 10px;
    empty-cells: show;
}
.tdPaddingLeft
{
    padding-left: 10px;
}
.tdPaddingLeft15
{
    padding-left: 15px;
}
.paddingleft50
{
    padding-left: 50px;
}
.tdcenter
{
    text-align: center;
}
.suppoerter
{
    background-image: url(images/supporter.png);
    width: 220px;
    margin: auto;
    height: 35px;
}
.HeaderLabel /* Label Header SearchCriteria , SearchResult*/
{
    float: left;
    position: relative;
    margin-top: -20px;
    margin-left: -4px;
}
.DivContent /*Div Condition , Grid*/ /*Div Condition , Grid*/
{
    border: none;
    overflow: visible;
    position: relative;
    padding-top: 10px;
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    text-align:center;
    *padding-bottom:10px;
}
.Condition /* set*/
{
    overflow-y: auto;
    overflow-x: hidden;
}
.ButtonSearchClear
{
    float: right;
    margin-right: 10px;
}
.LimitSearch
{
    float: left;
    margin-left: 57px;
}
.SearchPlacer
{
    height: 30px;
}
.GridSearch
{
    overflow: hidden;
    position: relative;
    height: 230;    
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
}
.AjaxGrid
{
    margin-left:10px;
    margin-right:auto;
    
}
/*End Css Search Page*/


/*gridAJ*/

ZAjaxGrid
{
    margin-bottom: 500px;
   
}
.ZAjaxGridColumn
{
    text-align: left;    
}

.checkboxGrid > input
{
    margin: auto;
}
.checkboxGrid
{
    text-align: center;
}
/*End gridAJ*/



/*zHelpSearch InActive*/
.CSS_INACTIVE
{
    font-style:italic;
    color:#F69497;
}

/*set background when Dpck Empty*/
.DpckEmpty 
{
    /*
    background-image: url(images/bgDpckBox.png);
    background-repeat:no-repeat;
    */
    color: #909090;
    text-transform: lowercase;
    width: 75px !important;
}
.DpckEmpty.CtrlDisable
{
    background-image:none;
}
form .PanelData div.notActive > div.Cell
{
    font-style: italic;
    color: #BEBEBE; /* background: #E0E0E0;*/
}

.filterMenu
{   
       color:#D1DCEB;
       
}
.classificationSelector
{
    width: 302px;
}
.menuSelector
{
    width: 302px;
}
li.selectedi
{
    background:url("../../../X8/style/images/ActionIcons/DarkGrey-313131/Back_256_313131.png") no-repeat center right;
    background-size: 12px;
}
.x8_NoCheck
{
    width: 18px;
    height: 18px;
    background: url(images/NoCheck.png) no-repeat center;
}
body .x8_Check
{
    width: 18px;
    height: 18px;
    background: url(images/Check.png) no-repeat center;
}
#nfdiv
{
    border:1px solid #ccc;
    padding:1px;
    float:right;
    
}
#nfdiv.o,#nfdiv:hover
{    
    background-color:#f0f0f0;
    border:1px solid #ccdddd;
}
#notifyi
{
    cursor:pointer;
    background:url('images/g-icon.png');
    background-repeat:no-repeat;
    background-position:left;
    color:White;
    float:right;
    width:20px;
    z-index:1002;
}
#nfdiv:hover #notifyi,#nfdiv.o #notifyi
{
    background:url('images/g-icon-b.png');
}
#nfdiv.n #notifyi,#nfdiv.n:hover #notifyi
{
    background:url('images/g-icon-r.png');
}
#nfdiv #notifypp,#nfdiv #notifypp #nwup
{    
    width:400px; 
}
#nfdiv #notifypp
{
    display:none;
    position:absolute;
    top:22px;
    right:-1px;
    empty-cells:show;
    display:none;    
    z-index:1003;
}
#nfdiv.o #notifypp{display:block;}
#nfdiv.o #notifypp #naup
{   
    float:right;clear:both;
    width: 0; height: 0; 
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;	
	border-bottom: 15px solid #f0f0f0;
}
#nfdiv #notifypp #nwup
{
    height:380px;   
    overflow-y:auto;
    overflow-x:hidden;    
    background-color:#f0f0f0;
    padding-top:10px;
    position:relative;
}
#nfdiv #notifypp .loader,.mnuNT .loader
{   
    background: url(images/loading.gif) no-repeat center;
    width: 16px;
    height: 16px;
    top:0;left:50%;margin-left:-8px;
    position:absolute;
}
#nfdiv.o #notifypp #notifypc
{
    margin:0px;        
    float:right;width:100%;    
    padding:0px;
}
#nfdiv.o #notifypp #notifypc li
{
    position:relative;
    overflow:hidden;
    border-bottom:solid 1px #dedede;
    padding-top:2px;
    padding-bottom:2px;
}
#nfdiv.o #notifypp #notifypc li>div
{
    width:80%;
    margin-left:10px;
}
#nfdiv.o #notifypp #notifypc li>.pgp
{
    display:block;
    position:absolute;
    width:45px;
    bottom:0px;
    empty-cells:show;
    position:absolute;
    right:2px;
    bottom:2px;
    font-size:8px;
    color:#888;  
     background-color:#ddd;
}
#nfdiv.o #notifypp #notifypc li>.pgp.S div,#nfdiv.o #notifypp #notifypc li>.pgp.F div
{ display:none; }
#nfdiv.o #notifypp #notifypc li>.pgp .SI
{ display:none; }
#nfdiv.o #notifypp #notifypc li>.pgp.S div.SI,#nfdiv.o #notifypp #notifypc li>.pgp.F div.SI
{ display:block; }
#nfdiv.o #notifypp #notifypc li>.pgp .SI
{
    background: url('images/ui-icons_888888_256x240.png') no-repeat -210px -194px; top: -12px; position: absolute; width: 12px; height: 12px; right: 2px;
}
#nfdiv.o #notifypp #notifypc li>.pgp.F .SI
{
    background: url('images/ui-icons_cd0a0a_256x240.png') no-repeat -34px -194px;
}
#nfdiv.o #notifypp #notifypc li>.pgp .pgb
{
    height:5px;
    margin-left:0px;
    background-color:#aaa;
    empty-cells:show;
}
#nfdiv.o #notifypp #notifypc li>.modidetail,#nfdiv.o #notifypp #notifypc li>.act
{
    font-size:8px;
    position:absolute;
    right:2px;
    top:0px;
    width:auto;
}
#nfdiv.o #notifypp #notifypc li>.modidetail
{
    color:#888;    
}

#nfdiv li.o { background-color:#f9f9f9; }
#nfdiv li.o .p1
{
    display:none;
}
#nfdiv li .p2
{ display:none; }
#nfdiv li.o .p2
{
    display:block;
}
.iExpand
{
    cursor: pointer;
    background-image: url("../../../X8/Style/images/ActionIcons/DarkGrey-313131/CollapseDown_256_313131.png?v=4");
    background-size: contain;  
    width: 20px;
    height: 20px;
}
.iCollaspe
{
    cursor: pointer;
    background-image: url("../../../X8/Style/images/ActionIcons/DarkGrey-313131/CollapseUp_256_313131.png?v=4");
    background-size: contain;  
    width: 20px;
    height: 20px;
}


/*******************  CSS for StyleSheet.css **********************/
.UserEmptyJPN{background-image: url(images/bgUserBoxJPN.png);background-repeat: no-repeat;width:70px;background-position:-10px center;height:12px;}
.PassEmptyJPN{background-image: url(images/bgPassBoxJPN.png);background-repeat: no-repeat;width:70px;background-position:-10px center;height:12px;}
.UserEmpty{background-image: url(images/bgUserBox.png);background-repeat: no-repeat;width:70px;background-position:-10px center;height:12px;}
.PassEmpty {background-image: url(images/bgPassBox.png);background-repeat: no-repeat; width:70px;background-position:-10px center;height:12px;}
.EmailEmpty{background-image: url(images/EMAIL.png);background-repeat: no-repeat;width:70px;background-position:5px center;top:-2px; height:12px; zoom:90%;}
.EmailEmptyJPN{background-image: url(images/EMAIL.png);background-repeat: no-repeat;width:70px;background-position:5px center;top:-2px; height:12px; zoom:90%;}
.AnswerEmpty{background-image: url(images/ANSWER.png);background-repeat: no-repeat;width:70px;background-position:5px center;top:-2px; height:12px; zoom:90%;}
.AnswerEmptyJPN{background-image: url(images/ANSWER.png);background-repeat: no-repeat;width:70px;background-position:5px center;top:-2px; height:12px; zoom:90%;}
.pnlClass
{
	width: 100%;
}


/* Pnl */
.pnlClass > table
{
	margin-left: auto;
	margin-right: auto;
}
.pnlALL .bl
{
}
.bl .pnlH1, .bl .pnlH2, .bl .pnlH3
{
    float:left;
	border: none 0px;
}
.bl .pnlH2
{	
    text-align:center;
    text-transform:uppercase;
    color:#009ea0;
}
.bl .pnlH2 .control
{
   float:left;margin-left:20px;padding-left:30px;
}
.bl .pnlH1
{
	 width:100%;
}
.bl .pnlH3
{
	display:none;
}

/*  every page style */

.KeyLabel
{
	background-repeat: no-repeat;
	
}
.KeyLabel
{
    width: 12px;
}

.SpaceLabel
{
	width: 12px;
}

.TextLabel
{
	text-align: left;
	margin: 0px 0px 0px auto;
}
.TextLabelLeft
{
	text-align: left;
	margin: 0px 0px 0px auto;
}
.TextLabelCenter
{
	text-align: center;
	margin: 0px 0px 0px auto;
}
.TextCenter
{
	text-align: center;
}
.TextInput
{
	text-align: left;
	font-family: Applicationfont-Regular, helvethaica !important;
}
.ViewMode
{
	padding-left: 20px;
	text-align: left;
}
.SearchCommand
{
	text-align: right;
	padding-right: 20px;
}
.SearchCommand table
{
	margin: 0px 0px 0px auto;
}

/*  ctrl custom */

.btnHelp
{
	margin-left: auto;
	margin-right: auto;
	vertical-align: middle;
}
.color_picker
{
	width: 244px;
	height: 240px;
	background-image: url('Images/c_picker.png');
	position: absolute;
	display: none;
	cursor: crosshair;
	z-index: 200;
}
div.PopUpWarper
{
	width: 0px;
	height: 0px;
	border: solid 1px black;
	position: relative;
	margin: -2px 0px 0px -2px;
}
div.PopUp
{
	font-weight: normal;
	position: absolute;
	text-align: center;
	padding: 20px 12px 10px;
	font-style: normal;
	z-index: 10000;
	display: none;
}
.tbYW
{
	border-collapse:collapse;margin:0px;padding:0px;
}
.tbYW td
{
	margin:0px;padding:0px;
}
td>select{margin:0px;}

  /********* CSS For StyleSheetPayslip.css  **********/
body {
}

.HeaderPayslip
{
	background-color: Gainsboro;
	border : solid 1px black;
	border-left : solid 1px black;
	border-bottom : solid 1px black;
	border-right: solid 1px black;
	border-top: solid 1px black;
}

.reportSelectorInnerZone
{
	display:table;
	margin:auto;
}
.reportSelectorInnerZone *
{
	display:inline-block;
	
}

  /********* CSS For StyleSheetReport.css  *********/
.ReportPanel *
{
    font-family: Calibri;
    font-size: 8pt;    
}
.RPHeaderTitle
{
    font-size: 9pt;
    font-weight: bold;
}

div.selectedi
{
    background:url(images/submenu-select.png) no-repeat center right;
}

.ReportPayslip *
{
    font-family: Tahoma;
    font-size: 10pt;        
}

.ReportPayslipDetail *
{
    font-family: Tahoma;
    font-size: 8pt;        
}

.scrollB
{
    background:url(../../App_Themes/Default/DIYReport/images/arrow-left-green.png) no-repeat center;
}

.scrollN
{
    background:url(../../App_Themes/Default/DIYReport/images/arrow-right-green.png) no-repeat;    
}

.slide-out-div
{
    padding: 20px;
    width: 235px;
    background: #e8fcf6;
    border: #29216d;
    z-index: 778;
}

 div.text-label {
    color: #909090;
}


/* ---------------------------- Customize for tab profile ------------------------- */
.LMenu li a, .LMenu li a:after, .LMenu li a:before {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
.LMenu li a  
{
    margin:0;padding:0;border:0 none;position: relative; outline: none;
}

.LMenu li a, h3 > a {
  text-decoration: none;
  color: rgba(0,0,0,.4);
  z-index: 1;
}

.LMenu li a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background: #575756;
  visibility: hidden;
  border-radius: 1px;
  transform: scaleX(0);
  transition: .25s linear;
}
.LMenu li.selectedi a:hover:before,
.LMenu li.selectedi a:focus:before {
  visibility: hidden;
  transform: scaleX(1);
}
.LMenu li a:hover:before,
.LMenu li a:focus:before {
  visibility: visible;
  transform: scaleX(1);
}

/* ---------------------------- IE7 ------------------------- */
*+html .LMenu li a :hover
{
    text-decoration: underline;
}
*+html .LMenu li a  
{
    margin:0;padding:0;border:0 none;position: static; outline: none;
}

.underline_hover
{
    text-decoration: underline;
}
/* ---------------------------- Customize for tab profile ------------------------- */

.wpthemeFrame 
{
   height:auto !important;
}
.wpthemeMainContent #X8TopMain
{
   position:absolute;
   top:0px !important;
}
#swfMainContent { background-color:#e3e3e3 !important; }