@media print {
			div#header, #flexSubMenu, #primary-nav, .hr-noprint {
				display: none;
			}
			
			input.hr-button, input.button {
				display: none;
			}
			
			input, select, textarea {
				border: none;
				overflow: visible;
			}
			
			span.hr-icon {
				display: none;
			}

			body h1.hr-title {
				padding: 0;
				margin: 0;				
			}
			
			body h1.hr-title span.hr-title {
				padding: 0;
				margin: 0;				
			}
			
			h2.hr-mandatory {
				display: none;
			}
			
			body form.hr-entry h3 {
				border-bottom: 1px solid black;
			}
			
			body form.hr-entry label {
				padding-left: 0;
			}
			
			body form.hr-entry div.hr-personnel-left div.hr-entry-group, body form.hr-entry div.hr-personnel-right div.hr-entry-group {
				width: auto;
			}

			input:after {
				 content: attr(value);
				 font-size: 90%;
			}
			
			#organization-chart {
				overflow: show !important;
				width: 1500px !important;
				height: 800px !important;
			}
			
			#org-chart-detail {
				display: none;
			}
		}
		
		html.hr-hidden {
			visibility: hidden;
		}

		span.hr-hidden {
			display: none;
		}
		
		body {
			font-family: Arial;
			font-size: 62.5%;
		}
		
		textarea {
			font-family: Arial;
		}
		ul.hr-entry-checkbox, ul.hr-nobullet {
			padding: 0;
			margin: 0;
		}			

		ul.hr-entry-checkbox li, ul.hr-nobullet li {			
			list-style-type: none;
			margin-bottom: 3px;
		}
		
		ul#staffothers li {
			margin-bottom: 8px;
		}
		
		a.delstaff {
			margin-right: 20px;
		}
		
		/* --------------------------------- Time Picker ------------------------------------------- */
		.ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
		.ui-timepicker-div dl{ text-align: left; }
		.ui-timepicker-div dl dt{ height: 25px; }
		.ui-timepicker-div dl dd{ margin: -25px 0 10px 65px; }
		.ui-timepicker-div td { font-size: 90%; }
		.ui-timepicker-div { width: 250px; padding: 2px 3px 2px 3px; }
		#ui-datepicker-div { width: 256px; }

		/* --------------------------------- Enhancement to jQuery --------------------------------- */
		body.hr-entry  .ui-dialog.ui-widget {
			font-family: Arial;
			font-size: 1.0em;			
		}
		body.hr-entry .ui-dialog-titlebar {
			font-size: 1.1em;			
		}

		body.hr-list  .ui-dialog.ui-widget {
			font-family: Arial;
			font-size: 1.0em;			
		}
		
		body.hr-overlay {
			overflow: hidden;
		}
		
		.ui-dialog {
			padding: 0;
			background: none;
			background-color: #fff;
		}
		
		.ui-dialog form {
			padding-bottom: 20px;
		}
		div.ui-widget-overlay iframe {
			height: 100%;
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
			padding: 0;
			margin: 0;
			opacity: 0;
		}

		div.ui-tabs {
			font-size: 10px;
		}
		.ui-datepicker { padding: 0;}
		
		div.ui-datepicker-header, div.ui-dialog-titlebar {
			border-top-width: 0;
			border-left-width: 0;
			border-right-width: 0;
			-moz-border-radius-bottomleft: 0;
			-webkit-border-bottom-left-radius: 0px;
			-moz-border-radius-bottomright: 0;
			-webkit-border-bottom-right-radius: 0px;
		}
		
		body.hr-entry .ui-datepicker-prev-hover, body.hr-entry .ui-datepicker-next-hover {
			border-width: 0;
			background-image: none;
		}

		div#hr-workflow-tabs {
			font-size: 10px;
		}
		
		div.hr-appraisal-preview {
			padding-top: 20px;
			padding-left: 50px;
			font-size: 11px;
		}
		div#hr-workflow-tabs.ui-tabs { padding: 0; border-width: 0; }

		div#hr-workflow-tabs .ui-tabs-nav, div#hr-lookup-tabs .ui-tabs-nav {
			border-width: 3px;
			border-top-width: 0;
			border-left-width: 0;
			border-right-width: 0;
			-moz-border-radius-bottomleft: 0;
			-webkit-border-bottom-left-radius: 0;
			-moz-border-radius-bottomright: 0;
			-webkit-border-bottom-right-radius: 0;
			padding: 0;
			background: none;
			background-color: #fff;
		}
		
		div#hr-workflow-tabs .ui-tabs-nav li, div#hr-lookup-tabs .ui-tabs-nav li {
			margin-right: .2em;
		}
				
				
		div#hr-workflow-tabs .ui-tabs-nav li.ui-tabs-selected, div#hr-lookup-tabs .ui-tabs-nav li.ui-tabs-selected {
				 border-width: 3px;
				 margin-bottom: -3px;
		}
		
		div#hr-workflow-tabs .ui-tabs-nav a, div#hr-lookup-tabs .ui-tabs-nav a {
				 font-size: 1.2em;
				 padding-top: .3em;
				 padding-bottom: .3em;
		}
		
		div#hr-workflow-tabs .ui-tabs-panel, div#hr-lookup-tabs .ui-tabs-panel {
				 border-width: 3px;
				 border-top-width: 0;
				 padding-top: 1.5em;
		}
				
		form.hr-appraisal-form div#hr-workflow-tabs .ui-tabs-panel {
			border-left-width: 0;
			border-right-width: 0;
			border-bottom-width: 0;
		}

		div#header {
			height: 90px;
		}
		
		div#banner {
			position: absolute;
			left: 5px;
			top: 10px;
			width: 300px;
			height: 50px;
			background: #fff url('image/default/logo.jpg') no-repeat 0 0; 
			height: 57px;
		}
		div#navigation {
			position: relative;
			float: right;
			margin-right: 10px;
			padding-right: 10px;
			padding-bottom: 0px;
			background: #fff url('image/top-final.gif') no-repeat 100% -75px; 
			height: 57px;
		}
		
		div#welcome {
			position: absolute;
			top: 70px;
			right: 30px;
			text-align: right;			
		}
		
		ul.navigation {
			height: 57px;
			padding: 0;
			padding-left: 10px;
			margin: 0;
			background: #fff url('image/top-final.gif') no-repeat 0% 0px; 
		}
		
		ul.navigation li {			
			list-style-type: none;
			display: block;
			float: left;
			height: 50px;
			bottom: 0;
			margin-right: 7px;			
			padding-top: 5px;
		}

		ul.navigation li a {			
			display: block;
			padding-top: 30px;
			background-position: 50% 0%;
			background-repeat:no-repeat;
			font-size: 0.9em;
			text-decoration: none;
			color: black;
			padding-left: 3px;
			padding-right: 3px;
		}

		ul.navigation li a.home {
			background-image: url('image/top_ico_09.gif');
		}
		ul.navigation li a.inbox {
			background-image: url('image/top_ico_04.gif');
		}
		ul.navigation li a.announcement {
			background-image: url('image/top_ico_announce.gif');
		}
		ul.navigation li a.myprofile {
			background-image: url('image/top_ico_profile.gif');
		}
		ul.navigation li a.change_password {
			background-image: url('image/top_ico_02.gif');
		}
		ul.navigation li a.help {
			background-image: url('image/top_ico_help.gif');
		}
		ul.navigation li a.logout {
			background-image: url('image/top_ico_01.gif');
		}

		div#header:after, legend:after, div#primary-nav:after, div.hr-list-action:after, 
			div.hr-entry-row:after, div.hr-search-form:after, div.hr-profile-entry:after, 
			div.hr-payslip-section:after {
			content: " ";
			display: block;
			height: 0;
			clear: both;
			visibility: hidden;
		}


		div#primary-nav {
			padding-top: 0px;
			margin-bottom: 20px;
		}
		
		div#primary-nav ul {
			padding: 0px;
			margin: 0px;
			height: 34px;			
			background: #fff url('image/menu2.gif') no-repeat 100% 0px; 
		}
		
		div#primary-nav ul li {
			list-style-type: none;
			position: relative;
			display: block;
			float: left;
			height: 34px;
			padding-right: 9px;
			background: #fff url('image/menu2.gif') no-repeat 100% -81px; 
		}
		
		div#primary-nav ul li.module {
			background-position: 100% -156px; 
		}
		
		
		div#primary-nav li a, div#primary-nav li span {
			display: block;
			float: left;
			background-position: 50% 0%;
			background-repeat:no-repeat;
			font-size: 1.1em;
			text-decoration: none;
			color: black;
			padding-top: 10px;
			padding-left: 10px;
			padding-right: 20px;
			height: 24px;
			color: white;
			background: #fff url('image/menu2.gif') no-repeat 100% -41px; 			
		}
		
		div#primary-nav ul li.module span {
			background-position: 0% -115px; 
			color: yellow;
			font-weight: bold;
			padding-right: 10px;
			padding-left: 15px;
		}

		/* --------------------------------- hr-entry --------------------------------- */

		form.hr-entry h3.hr-title {
			margin-top: 8px;
			font-size: 12px;
			font-weight: bold;
			height: auto;
			width: 100%;
			margin-bottom: 10px;
			background: none; 
		}
		
		p.hr-note {
			font-size: 11px;
		}
		
		p.hr-diff, span.hr-diff {
			color: red;
		}
		
		div.hr-inside-fieldset {
			float: left;
		}
		
		fieldset {
			padding-left: 0;
			padding-right: 0;
			padding-top: 0;
			padding-bottom: 0;
			margin: 0;
		}
		
		fieldset h4.hr-subtitle {
			padding: 0;
			margin: 0;
			margin-left: 20px;
			margin-right: 20px;
			font-size: 1.0em;
			font-weight: bold; 
			font-style: normal;
			margin-bottom: 8px;
			padding-bottom: 3px;
			border-bottom: 0;		
		}
		
		fieldset h4 {
			padding: 0;
			margin: 0;
			margin-left: 20px;
			margin-right: 20px;
			font-size: 1.0em;
			font-weight: bold; 
			font-style: italic;
			margin-bottom: 8px;
			padding-bottom: 3px;
			border-bottom: 1px solid #aaa;
		}
		
		fieldset h4.hr-between {
			margin-top: 8px;
		}

	
		div.hr-paragraph, div.hr-paragraph-inner {
			float: left;
			width: 250px;
			text-align: justify;
		}
		div#hr-entry-content.hr-single-column div.hr-paragraph {
			width: 550px;
		}
		
		div#hr-entry-content.hr-single-column {
			width: 80%;
			min-width: 800px;
		}
		div#hr-entry-content.hr-single-column.hr-single-column-large {
			width: 960px;
			min-width: 960px;
		}
		form.hr-appraisal-form div#hr-entry-content.hr-single-column {
			width: auto;
			min-width: none;
		}
		form.hr-entry fieldset {
			position: relative;
			border: 0;
			padding-left: 10px;
			background: #f5f5f5 url('image/side-left.gif') no-repeat 0% 1px;
			padding-bottom: 0px;
		}
		
		div.hr-search-form form.hr-entry fieldset {
			background: none;
		}

		form.hr-entry div.hr-entry-fieldset {
			padding-right: 9px;
			background: #f5f5f5 url('image/side-right.gif') no-repeat 100% 0px;
			font-size: 1.1em;
			margin-bottom: 10px;
		}

		div#hrlookupdiv form.hr-entry div.hr-entry-fieldset {
			font-size: 1.1em;		
		}
		
		form.hr-entry div.hr-entry-fieldset {
			
		}
		form.hr-entry h3 {			
			margin: 0;
			padding: 0;
			display: block;
			margin-left: 0;
			padding: 0;
			height: 34px;
			width: 100%;
			margin-bottom: 10px;
			font-size: 1em;
			background: #fff url('image/menu2.gif') no-repeat 0% 0px; 
		}
		
		form.hr-entry h3 span {
			position: relative;
			float: left;
			display: block;
			padding-top: 10px;
			height: 24px;			
			white-space:nowrap;
			padding-right: 15px;
			padding-left: 2px;
			color: white;
			font-weight: bold;
			background: #fff url('image/menu2.gif') no-repeat 100% -156px; 
		}
		form.hr-entry div.hr-entry-row {
			padding: 0;
			padding-bottom: 5px;
			padding-top: 5px;
			position: relative;
		}
		
		form.hr-entry div.hr-entry-group {
			/* width: 450px; */
			float: left;
		}
		
		form.hr-entry div.hr-entry-group-no-label {
			padding-left: 20px;
		}
		
		#hrlookupdiv form.hr-entry div.hr-entry-group {
			width: 150px;
			float: left;
		}

		form.hr-entry div.hr-personnel-left div.hr-entry-group, form.hr-entry div.hr-personnel-right div.hr-entry-group {
			width: 250px;
			width: auto;
		}
		form.hr-entry div.hr-entry-group {
			zoom: 1;
		}
		
		form.hr-entry div.hr-entry-group input {
			float: left;
			margin-top: 2px;
			clear: left;
		}
		form.hr-entry div.hr-entry-group input.hr-entry-radiobutton, form.hr-entry div.hr-entry-group input.hr-entry-checkbox {
			top: 0 !important;
			margin-top: 0 !important;
		}
		form.hr-entry div.hr-entry-group input.hr-entry-input-nofloat{
			float: none;
		}
		
		form.hr-entry label {
			float: left;
			width: 200px;
			padding-left: 20px;
		}
		
		form.hr-entry label.hr-suffix, form.hr-entry label.error, #hrlookupdiv div.hr-search-form form.hr-entry label.hr-suffix {
			padding-top: 3px;
			padding-left: 5px;
			padding-right: 5px;
			float: none;
			width: auto;
		}
		
		form.hr-entry div.hr-entry-group label.hr-suffix, #hrlookupdiv div.hr-search-form form.hr-entry div.hr-entry-group label.hr-suffix {
			float: left;
		}
		form.hr-entry label.error {
			margin-left: 10px;
			color: red;
			float: right;
			
			right: 10px;
		}
		
		#error-box label.error {
			position: static;
			right: auto;
		}
		
		#error-box ul {
			padding: 0;
			margin: 0;
		}
		
		#error-box ul li {
			list-style-type: none;
			margin-bottom: 3px;

		}
		
		span.hr-entry-colon {
			float: left;
			margin-right: 5px;
			font-style: normal;
		}
		form.hr-entry input {
			width: 150px;
		}
		form.hr-entry select {
			width: 150px;
		}
		form.hr-appraisal-form.hr-entry input, form.hr-appraisal-form.hr-entry select {
			width: auto;
		}

		form.hr-entry input.hr-small-input, #hrlookupdiv input.hr-small-input, form.hr-entry select.hr-small-input {
			width: 50px;
		}

		form.hr-entry input.hr-smallmid-input, #hrlookupdiv input.hr-smallmid-input, form.hr-entry select.hr-smallmid-input {
			width: 75px;
		}
		
		#hrlookupdiv input.hr-list-selector, form.hr-entry input.hr-entry-checkbox, form.hr-entry input.hr-list-selector, form.hr-list input.hr-list-selector,  form.hr-entry input.hr-entry-radiobutton, #hrlookupdiv td input.hr-entry-checkbox, #hrlookupdiv td input.hr-entry-radiobutton, #hrlookupdiv form.hr-entry input.hr-entry-radiobutton{
			width: auto;
			margin: 0;
			padding: 0;
		}
		form.hr-entry fieldset input.hr-entry-checkbox, form.hr-entry fieldset input.hr-entry-radiobutton {
			position: relative;
			top: 1px;
		}
		form.hr-entry fieldset input.hr-entry-radiobutton {
			top: 0 !important;
			margin-top: 0 !important;
		}
		
		form.hr-entry fieldset.hr-search-form input.hr-entry-checkbox, form.hr-entry fieldset.hr-search-form input.hr-entry-radiobutton {
			position: static;
		}

		form.hr-entry fieldset input.hr-entry-checkbox, form.hr-entry fieldset input.hr-entry-radiobutton {
			margin-right: 5px;
		}
		
		form.hr-entry input.hr-entry-checkbox-declaration {
			margin-right: 15px;
		}
		input, textarea, select {
			font-size: 1.1em;
		}
		form.hr-entry input, form.hr-entry select, form.hr-entry textarea {
			font-size: 1.0em;
		}
		
		input.hr-file {
			position: absolute;
			cursor: pointer;
			opacity: 0;
			z-index: 9999;
		}
		
		input.hr-button, input.button {
			background:#ff6464;
			line-height:20px;
			text-align:center;
			color:#FFFFFF;
			border-right:#701a1b 1px solid;
			border-bottom:#701a1b 1px solid;
			border-top:#c8aba5 1px solid;
			border-left:#c8aba5 1px solid;
			padding-bottom: 1px;
		}
		
	
		
		input.hr-number {
			text-align: right;
		}
		
		form.hr-entry input.hr-button, form.hr-entry input.button {
			width: auto;
			font-size: 12px;
		}

		form.hr-entry input.hr-button-medium {
			width: 50px;
		}
		
		form.hr-entry input.hr-xsmall, form.hr-entry select.xsmall, #hrlookupdiv input.hr-xsmall, #hrlookupdiv select.hr-xsmall {
			width: 20px;
		}
		
		form.hr-entry input.hr-long, form.hr-entry select.hr-long {
			width: 350px;
		}

		form.hr-entry input.hr-medium, form.hr-entry select.hr-medium {
			width: 250px;
		}

		form.hr-entry input.hr-nonedit, form.hr-entry select.hr-nonedit, form.hr-entry textarea.hr-nonedit {
			border: 1px solid #AAA;
			background-color: #f5f5f5;
			background-color: transparent;
		}

		form.hr-entry a.hr-entry-lookup, form.hr-entry a.hr-entry-datepicker, form.hr-entry a.hr-entry-collapsible, a.hr-entry-orgtree-lookup, a.hr-entry-datepicker {
			position: relative;
			margin-left: 10px;
			padding-left: 20px;
			padding-top: 5px;
			height: 20px;
			width: 20px;
		}
		
		form.hr-entry a.hr-entry-lookup {
			background: #f5f5f5 url('image/more_icon.jpg') no-repeat 0% 0px; 
		}
		
		a.hr-entry-orgtree-lookup {
			background: #f5f5f5 url('image/profile.gif') no-repeat 0% 0px; 
		}

		form.hr-entry a.hr-entry-datepicker, a.hr-entry-datepicker {
			background: #f5f5f5 url('image/calendar.jpg') no-repeat 0% 0px; 
		}

		form.hr-entry fieldset a.hr-entry-collapsible {
			padding-left: 0px;
			background: transparent url('image/btn-top.gif') no-repeat 0% 5px; 
		}

		form.hr-entry fieldset.hr-entry-collapsed a.hr-entry-collapsible {
			padding-left: 0px;
			background: transparent url('image/btn-down.gif') no-repeat 0% 5px; 
		}

		form.hr-entry a.hr-entry-lookup span, form.hr-entry a.hr-entry-datepicker span, a.hr-entry-orgtree-lookup span, a.hr-entry-datepicker span {
			display: none; 
/*			position: absolute;
			left: -9999px; */
		}		

		div.hr-entry-bottom-line {
			position: relative;			
			height: 4px;		
			padding:0;
			margin: 0;
			background: #f5f5f5 url('image/side_bot.gif') repeat-x 0 3px; 
		}
		

		form.hr-entry label.hr-mandatory {
			background: url('image/astericks.gif') no-repeat 10px 50%;
		}
		table.hr-list td span.hr-mandatory{
			background: url('image/astericks.gif') no-repeat;
		}
		form.hr-entry h3 {
			position: relative;
		}
		form.hr-entry a.hr-entry-collapsible {
			position: absolute;
			right: 20px;
			top: 3px;
		}
		
		h2.hr-mandatory {
			padding: 0;
			padding: 15px 10px 15px 25px;
			margin: 0;
			font-size: 11px;
			color: red;
			background: #fff url('image/bck_mandatory.gif') no-repeat 0 50%; 
		}
		/* --------------------------------- Lookup Form --------------------------------- */
		
		div#hr-loading {
			padding-top: 40px;
			text-align:center;
			font-size: 1.5em;
			font-weight: bold;
			font-style: italic;
		}
		
		#hrlookupdiv input {
			width: 150px;
		}
		#hrlookupdiv select {
			width: 155px;
		}
		
		#hrlookupdiv input.hr-entry-checkbox {
			width: auto;
			margin: 0;
			padding: 0;
		}
		
		
		#hrlookupdiv input, #hrlookupdiv select, #hrlookupdiv textarea {
			font-size: 1.0em;
		}
		#hrlookupdiv input.hr-button, #hrlookupdiv button.btnsearch {
			width: auto;
			font-size: 12px;
			
		}

		#hrlookupdiv input.hr-long, #hrlookupdiv select.hr-long {
			width: 350px;
		}

		#hrlookupdiv input.hr-medium, #hrlookupdiv select.hr-medium {
			width: 250px;
		}
		
		div.hr-dialog-action {
			padding: 0px;
			padding-top: 10px;
			padding-bottom: 5px;
		}
		/* --------------------------------- General --------------------------------- */
		
		table caption {
			text-align: left;
			font-size: 1.1em;
			font-weight: bold;
			padding-top: 20px;
			padding-bottom: 10px;
		}
		
		.hr-float-left {
			float: left;
			margin-right: 20px;
		}

		h1.hr-title {
			position: relative;
			font-size: 1.5em;
			font-weight: 700;
			padding: 0;
			margin: 0;
			padding-left: 30px;
			margin-top: 50px;
			margin-bottom: 20px;
			height: 20px;
			background-color: black;
		}

		h1.hr-title.hr-next-is-search {
			margin-bottom: 0px;
		}
		
		div.hr-search-form {
			padding-left: 40px;
			padding-top: 30px;
			padding-right: 40px;
			padding-bottom: 15px;
			margin-bottom: 15px;
			
			background-color: #EDEDED;
			font-size: 1.1em;
		}

		div.hr-profile-top-link {
			border: 1px solid #C9C9C9;
			border-top-width: 0;
			padding-left: 20px;			
			padding-right: 0px;
			padding-bottom: 10px;
			margin-bottom: 10px;
		}
		
		#hrlookupdiv div.hr-search-form {
			padding-left: 10px;
			padding-top: 10px;
			padding-bottom: 10px;
			margin-bottom: 10px;			
			background-color: #EDEDED;
			font-size: 11px;
		}
		
		#hrlookupdiv div.hr-search-form form.hr-entry label {
			float: left;
			width: 150px;
			padding-left: 20px;
		}
		
		span.hr-title {
			position: absolute;
			top: 0px;
			padding-top: 0px; 
			padding-left: 50px;
			padding-right: 20px;
			background: white; 
			padding-bottom: 2px;
		}
		
		span.hr-icon {
			position: absolute;
			top: -40px;
			padding-top: 50px; 
			padding-bottom: 20px; 
			padding-left: 50px;
			padding-right: 50px;
			z-index: 500;
		}

		body.hr-personnel span.hr-icon {
			background: transparent url('image/personnel.gif') no-repeat 10px 100%; 
		}
		
		body.hr-movement span.hr-title {
			padding-left: 70px;
		}

		body.hr-movement span.hr-icon {
			background: transparent url('image/staff-movement.gif') no-repeat 10px 100%;
		}

		body.hr-job span.hr-title {
			padding-left: 60px;
		}

		body.hr-job span.hr-icon {
			background: transparent url('image/job-information.gif') no-repeat 10px 100%;
		}
		
		body.hr-maintenance span.hr-title {
			padding-left: 60px;
		}

		body.hr-maintenance span.hr-icon {
			background: transparent url('image/maintenance.gif') no-repeat 10px 100%;
		}

		body.hr-changepassword span.hr-title {
			padding-left: 60px;
		}

		body.hr-changepassword span.hr-icon {
			background: transparent url('image/change-password.gif') no-repeat 10px 100%;
		}

		body.hr-dashboard span.hr-title {
			padding-left: 60px;
		}

		body.hr-dashboard span.hr-icon {
			background: transparent url('image/dashboard.gif') no-repeat 10px 100%;
		}

		body.hr-disciplinary span.hr-title, body.hr-grievance span.hr-title{
			padding-left: 90px;
		}

		body.hr-disciplinary span.hr-icon, body.hr-grievance span.hr-icon{
			background: transparent url('image/industrial-relationship.gif') no-repeat 10px 100%;
		}
		
		body.hr-industrialrelationship span.hr-title {
			padding-left: 90px;
		}

		body.hr-industrialrelationship span.hr-icon {
			background: transparent url('image/industrial-relationship.gif') no-repeat 10px 100%;
		}

		body.hr-manpower span.hr-title {
			padding-left: 75px;
		}

		body.hr-manpower span.hr-icon {
			background: transparent url('image/manpower-planning.gif') no-repeat 10px 100%;
		}

		body.hr-recruitment span.hr-title {
			padding-left: 80px;
		}

		body.hr-recruitment span.hr-icon {
			background: transparent url('image/recruitment.gif') no-repeat 10px 100%;
		}

		body.hr-industrial span.hr-title {
			padding-left: 90px;
		}

		body.hr-industrial span.hr-icon {
			background: transparent url('image/industrial-relationship.gif') no-repeat 10px 100%;
		}

		body.hr-learning span.hr-title {
			padding-left: 65px;
		}

		body.hr-learning  span.hr-icon {
			background: transparent url('image/learning-n-development.gif') no-repeat 10px 100%;
		}

		body.hr-performance span.hr-title {
			padding-left: 70px;
		}

		body.hr-performance span.hr-icon {
			background: transparent url('image/performance-management.gif') no-repeat 10px 100%;
		}

		body.hr-reports span.hr-title {
			padding-left: 65px;
		}

		body.hr-reports span.hr-icon {
			background: transparent url('image/reports.gif') no-repeat 10px 100%;
		}

		body.hr-announcements span.hr-title {
			padding-left: 70px;
		}

		body.hr-announcements span.hr-icon {
			padding-left: 70px;
			background: transparent url('image/annoucements.gif') no-repeat 10px 100%;
		}

		body.hr-policy span.hr-title {
			padding-left: 70px;
		}

		body.hr-policy span.hr-icon {
			background: transparent url('image/policies-n-procedures.gif') no-repeat 10px 100%;
		}

		body.hr-timemgmt span.hr-title {
			padding-left: 70px;
		}

		body.hr-timemgmt span.hr-icon {
			background: transparent url('image/time-management.gif') no-repeat 10px 100%;
		}

		body.hr-payroll span.hr-title {
			padding-left: 70px;
		}

		body.hr-payroll span.hr-icon {
			padding-left: 60px;
			background: transparent url('image/payroll.gif') no-repeat 10px 100%;
		}

		body.hr-esos span.hr-title {
			padding-left: 70px;
		}

		body.hr-esos span.hr-icon {
			background: transparent url('image/esos.gif') no-repeat 10px 100%;
		}

		body.hr-loan span.hr-title {
			padding-left: 80px;
		}
		
		body.hr-loan span.hr-icon {
			background: transparent url('image/loan.gif') no-repeat 10px 100%;
		}

		body.hr-claims span.hr-title {
			padding-left: 105px;
		}

		body.hr-claims span.hr-icon {
			background: transparent url('image/travel-claims-n-advances.gif') no-repeat 10px 100%;
		}

		body.hr-medical span.hr-title {
			padding-left: 55px;
		}

		body.hr-medical span.hr-icon {
			background: transparent url('image/medical.gif') no-repeat 10px 100%;
		}

		body.hr-leave span.hr-title {
			padding-left: 75px;
		}

		body.hr-leave span.hr-icon {
			background: transparent url('image/leave.gif') no-repeat 10px 100%;
		}

		body.hr-compensation span.hr-title {
			padding-left: 93px;
		}

		body.hr-compensation span.hr-icon {
			background: transparent url('image/compensation-n-benefits.gif') no-repeat 10px 100%;
		}

		/* --------------------------------- hr-list --------------------------------- */
		
		table.hr-list {
			font-size: 11px;
			width:100%;
			border-collapse:collapse;			
		}


		table.hr-list td, table.hr-list tr th {
			border-bottom:1px solid #e3e3e3;
			padding:3px 7px 2px 7px;
		}
		
		table.hr-list th, table.hr-list thead td {			
			text-align:left;
			padding-top:5px;
			padding-bottom:4px;
			background-color:#D5AE88;
			color:#000;
		}
		
		table.hr-list td.hr-center, table.hr-list th.hr-center {
			text-align: center;
		}
		
		.hr-center {
			text-align: center;
		}
		.hr-right {
			text-align: right;
		}
		table.hr-list td.hr-right, table.hr-list th.hr-right {
			text-align: right;
		}

		table.hr-list td.hr-list-timebox-left, table.hr-list th.hr-list-timebox-left {
			border-left:1px solid #5d0000;
			padding:3px 7px 2px 7px;
		}
		
		table.hr-list td.timebox-right, table.hr-list th.timebox-right {
			border-right:1px solid #5d0000;
			padding:3px 7px 2px 7px;
		}
		
		table.hr-list tr.hr-list-selected td {
			background-color: #E4F2D9;
		}
		table.hr-list thead th.hr-list-asc,  table.hr-list thead th.hr-list-desc {
			background-repeat: no-repeat;
			background-position: 100% 50%;
			padding-right: 20px;			
		}
		table.hr-list thead th.hr-list-asc {
			background-image: url('image/sort-up.gif');
		}

		table.hr-list thead th.hr-list-desc {
			background-image: url('image/sort-down.gif');
		}
		
		table.hr-list th.hr-number, table.hr-list td.hr-number {
			text-align: right;
		}
		
		table.hr-list th.hr-list-selector, table.hr-list td.hr-list-selector {
			text-align: center;
		}

		div.hr-list-bottom-line {
			position: relative;			
			height: 4px;		
			padding:0;
			margin: 0;
			background: #f5f5f5 url('image/side_bot.gif') repeat-x 0 0px; 
		}
		
		div#hr-list-content {
			padding-left: 30px;
			padding-right: 30px;
		}
		
		div.hr-list-action {
			padding: 10px 0 10px 0;
			height: 20px;
		}
		
		div.hr-list-action a {
			font-size: 1.1em;
			margin-right: 5px;
			position: relative;
			height: 17px;
			width: 17px;
			display: block;
			float: left;
		}

		div.hr-list-action a.hr-list-custom {
			width: auto;
			display: block;
			float: right;
		}

		a.hr-list-add, a.hr-add-icon {
			background: #ffffff url('image/add.jpg') no-repeat 0 0px; 
		}
		
		a.hr-list-delete, a.hr-delete-icon {
			background: #ffffff url('image/trash.jpg') no-repeat 0 0px; 
		}

		a.hr-list-attach {
			background: #ffffff url('image/zoom.jpg') no-repeat 0 0px; 
		}

		a.hr-list-export-excel {
			background: #ffffff url('image/excel3.jpg') no-repeat 0 0px; 
		}

		a.hr-list-view-profile {
			background: #ffffff url('image/profile.gif') no-repeat 0 0px; 
		}

		a.hr-delete-icon {
			font-size: 1.1em;
			margin-right: 5px;
			position: relative;
			height: 17px;
			width: 17px;
			display: block;
			float: left;
		}

		a.hr-delete-icon span {
			display: none;
		}
		div.hr-list-action a span {
			display: none;
		}
		
		div.hr-list-action a.hr-list-view-profile span {
			/* display: inline; */
		}
		
		a.hr-list-mainlink, a.hr-plainlink, a.hr-dialog-picklink, a.hr-dialog-actionlink, a.hr-dialog-inner-picklink, a.hr-dialog-actionlink-large {
			color:#000;
			text-decoration: none;
		}
		
		tr.hr-list-selected {
			cursor: pointer;
		}

		table.hr-view-only tr.hr-list-selected {
			cursor: auto;
		}
		
		table.hr-list.hr-list-sortable thead th {
			cursor: pointer;
		}
		
		table.hr-list thead th.hr-unsorted, table.hr-list thead th.hr-list-selector {
			cursor: auto;
		}		
		
		table.hr-list tr.hr-listing-empty-row { 
			height: 50px;
		}
		
		table.hr-list tr.hr-listing-empty-row td {
			text-align: center;
			font-style: italic;
			font-weight: bold;
			color: green;
		}
		
		a.hr-entry-orgtree-lookup span {
		
		}
		
		/* --------------------------------- Organization Chart --------------------------------- */
		
		.hr-organization-node, #org-chart-detail, #organization-chart {
			border:5px solid #ddd; 
			-moz-border-radius:5px; 
			-webkit-border-radius:5px; 
			border-radius:5px; 
			-o-box-shadow:0 0 10px #000; 
			-moz-box-shadow:0 0 10px #000; 
			-webkit-box-shadow:0 0 10px #000; 
			box-shadow:0 0 10px #000; 
			opacity:.9;
			padding: 0px;
			color: #000;
			background-color: #D5AE88;
			z-index: 555;
		}
		
		.hr-organization-node-inner {
			padding: 5px;
		}
		.hr-organization-node-inner div.hr-staffname {
			text-align: center;
		}
		.hr-organization-node-inner div.hr-staffname a {
			font-size: 1.3em;
			text-decoration: none;
		}
		.hr-organization-node-inner div.hr-staffname a:hover {
			text-decoration: underline;
		}
		
		.hr-organization-node-inner div.hr-position  {
			padding-top: 3px;
			font-size: 1.2em;
			text-align: center;
			font-style: italic;
		}
		.hr-organization-node h2 {
			padding: 0;
			padding-left: 23px;
			padding-right: 23px;
			padding-top: 3px;
			padding-bottom: 3px;
			margin: 0;
			color: #fff;
			text-align: center;
			background-color: rgb(96, 0, 0);
			position: relative;
			font-size: 1.3em;
		}
		.hr-organization-node h2 a {
			position: absolute;
			top: 2px;
			right: 3px;
			width: 20px;
			height: 20px;
			display: block;
		}
		.hr-organization-node-inner font, .hr-organization-node-inner a {		
			color: #000;
			font-size: 11px;
		}
		
		#hr-organization-action {
			margin-bottom: 10px;
		}
		#organization-chart {			
			width: 100%;
			height: 500px; 
			overflow: auto; 
			position: relative; 
			float: left;
			background-color: white;

		}

		#org-chart-detail {
			background: #252122 url('image/bg-tooltip.gif') top repeat-x;
			color: white;
			padding: 10px;
			width: 200px; 
			height: 300px; 
			overflow: auto; 
			position: relative; 
			float: right;
			margin-right: 5px;
		}
		#hr-organization-detail {
			overflow: auto; 
			text-align: center;
		}
		
		#hr-organization-detail img {
			border: 3px solid white;			
			background-color: #fff;
		}
		
		#hr-organization-detail div {
			text-align: left;
			padding-top: 10px;
			padding-bottom: 10px;
			font-size: 13px;
			padding-left: 10px;
			font-style: italic; 
			font-weight: bold;
		}
		
		#hr-organization-detail div label {
			text-align: left;
			font-size: 11px;
			display: block;
			font-style: normal; 
			font-weight: normal;
		}
		
		/* HR Personnel */
		
		div.hr-personnel-left, div.hr-personnel-right {
			float: left;
			width: 48%;
		}
		
		div#hr-profile-secondary-nav {
			padding-right: 20px;
			text-align: right;
		}
		
		div#hr-leave-secondary-nav {
			padding-right: 30px;
			padding-bottom:5px;
			text-align: right;
		}
		
		div.hr-list-action-right {
			float: right;
		}
		
		p.hr-warning {
			margin: 0;
			color: red;
			padding: 0 20px;
		}
		
		p.hr-jobinfo-warning {
			margin: 0;
			color: red;
			font-weight: bold;
			font-size: 12px;
			padding: 0 20px;
		}
		
		p.hr-loan-warning {
			margin-bottom: 10px;
			color: red;
			font-weight: bold;
			padding-left: 10px;
			
			
		}
		p.hr-leave-warning {
			margin: 0;
			color: red;
			
		}
		
		table.hr-view-only th.hr-bg-white {
			background-color: #FFF;
		}
		
		h4.subtitle {
			margin:0;
			font-size: 1.1em;
		}
		
		div.hr-result {
			width: 550px;		
			margin: 120px auto;
		}
		fieldset.hr-result {
			width: 550px;		
			
		}
		div.hr-result-icon {
			width:120px; 
			padding:10px; 
			text-align:center; 
			float:left;
		}
		div.hr-result-message{
			float:left; 
			text-align:left; 
			color:#000000; 
			font-family:Arial,Helvetica,sans-serif; 
			font-size:18px;
			width: 380px;
		}
		div.hr-result-message-fail {
			padding-top: 25px;
			padding-bottom: 28px;
		}
		
		div.hr-result-message-success {
			padding-top: 30px;
			padding-bottom: 30px;
		}
		
		a.hr-result-link {
					
			padding-left: 40px;
			padding-top: 10px;
			padding-bottom: 10px;								
			background:#CCCCCC url('image/note-icon.gif') no-repeat 2% 50%;
			display: block;			
			font-size:11px;
			color:#000000; 		
			text-decoration: none;
		}

		div.hr-result-confirm-link-container{
			background:#CCCCCC ;
			height: 30px;			
		}
		a.hr-result-confirm-link {
			float:right;
			display: block;
			font-size:14px;
			color:#000000; 
			font-weight: bold;
			margin-top:5px;
			margin-right:15px;					
		}

		span.hr-mandatory{
			color:red;
		}
		
		td.hr-warning {
			color:red;
		}
		
		td.hr-align-top {
			vertical-align: top;
		}
		
		form.hr-entry input.hr-date, #hrlookupdiv input.hr-date {
			
		}
		
		div#tracking_options {
			font-size: 1.1em;
			padding-left: 10px;
			margin-bottom: 10px;
		}
		
		div.hr-disclosure-confirmation{
		 	margin-left: 230px;
		 }
		 
		 form.hr-entry input.hr-confirmation-checkbox{
		 	width: 10px;
		 	
		 	
		}
		
		p.fp_header {
			color: black;
			font-family: Arial;
			font-size: 20px;
			font-weight: bold;		
		}
		
		p.fp_label {
			color: black;
			font-family: Arial;
			font-size: 11px;
		}

		ul.hr-normal-list {
			padding: 0;
			margin: 0;
		}

		ul.hr-normal-list li {			
			list-style-type: none;
			margin-bottom: 3px;
		}
		
		div.hr-leave-remark-view{
			position: absolute;
			left: 400px;
			display: inline;
		 }
		 div.hr-leave-remark{
			display: inline;
			padding-left:  50px;
		 }

		table.hr-list tr th.hr-top {
			vertical-align: top;
		}
		
		form.hr-entry div label.hr-entry-input-label{
			width: 100px;
			float:left;
		}
		
		div.hr-result-attention {
			width: 550px;		
			margin: 0 auto;
		}
		
		
		form.hr-entry div.hr-ol-lookup-button {
			position:absolute; 
			top: 20px; 
			left: 480px;
		}

		form.hr-entry div.hr-lookup-button {
			position:absolute; 
			top: 20px; 
			left: 480px;
		}

	td.hr-no-drill {
		cursor:default;
	}

	ul.hr-profile-top-link {
		float:left;
		list-style-type: none;
		margin-left: 0px;
		padding-left: 0px;
		padding-right: 10px;
	}

	a.hr-profile-top-link {
		background: transparent url('image/box_red.jpg') no-repeat 0 50%;
		padding-left: 15px;
		text-decoration: none;
		color: #000000;
	}
	a.hr-profile-top-link b{
		color: #5F0000;
	}

	img.hr-photo {
		float: left;
		margin-left: 20px;
	}
	img.hr-photo-profile {
		position:absolute;
		left:0;	
	}
	div.hr-photo {
		position:relative;
		float: left;
		margin-left: 20px;
		margin-top: 0px;
		margin-bottom: 0px;
		padding-bottom: 0px;	
		width:95px; 
		height:100px; 
		border: 1px solid rgb(200, 200, 200);
		text-align: center;
		vertical-align: middle;
	}
	ul.hr-profile-sublink {
		margin: 0 140px;
		
		
		list-style-type: none;
	}
	ul.hr-profile-sublink li {
		padding: 3px;	
		margin-bottom: 5px;
		
	}
	ul.hr-profile-sublink li a {
		padding-left: 30px;
		padding-top: 5px;
		padding-bottom: 5px;
		background:#F5F5F5 url('image/photograph_upload_icon.jpg') no-repeat 0% 30%;
		color: #000000;
		height: 100%;
		text-decoration: none;	
	}
	
	form.hr-entry input.hr-list-date-input, #hrlookupdiv input.hr-list-date-input{
		width: 80px;
	}

	table.hr-list a.action {
			font-size: 1.1em;
			margin-right: 5px;
			position: relative;
			height: 17px;
			width: 17px;
			display: block;
			float: left;
	}
	table.hr-list a.action span {
			display: none;
	}
	
	#report_progress {
		font-size: 12px;
		height: 400px;
		padding-top: 120px;
		text-align: center;
	}
	
	div#hr-top-action-nav {
		padding-top: 5px;
		float:right;		
	}
	div#hr-top-action-nav form {
		padding:0;
		margin:0;
	}

	h1.hr-record-not-found {
		font-size: 15px;
	}

	img.display-image {
		max-width: 100%;
	}
	tr.firstNode span.expander{
		margin-left: 0 !important;
	}
	div.autocomplete {
		position: absolute;
		width: 250px;
		height: 1px;
		background-color: #FFFFFF;
		border: 1px solid #888;
		margin: 0px; 
		padding: 0px;
		z-index: 10000000;
	}
	div.autocomplete ul {
		list-style-type: none;
		margin: 0px;
		padding: 0px 5px;
		background-color: #FFFFFF;
		border: 1px solid #888;	
	}
	
	div.autocomplete ul li.selected {background-color: #E4F2D9;}
	div.autocomplete ul li {
		list-style-type: none;
		display: block;
		margin: 0;
		padding: 0.1em;
		height: 1.5em;
		line-height: 1.5em;
		cursor: pointer;
	}
	
	div.loanlink {
		font-size: 12px;
		color: black;
	}
	
</style>