/*
 *
 * eTanah CSS 
 *
 */
a {
	text-decoration: underline;
	table-layout: fixed;
}

textarea {
	width: 100%;
}

select {
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	width: auto;
}

tbody td {
	border-color: silver !important;
}

.gap1 {
	height: 0.1em;
}

.gap2 {
	height: 0.2em;
}

.gap3 {
	height: 0.3em;
}

.gap4 {
	height: 0.4em;
}

.gap5 {
	height: 0.5em;
}

.panel-block {
	margin: 0.1em 0 0.2em 0 !important;
}

.promo-logo {
	height: 80px;
	width: 200px;
	margin-right: 0.3em !important;
}

.promo-logo-sq {
	height: 150px;
	width: 150px;
	margin-right: 0.3em !important;
}

.column-pane {
	float: left;
}

/*************************/
/*       HEADER AREA     */
/*************************/
#banner-main-top-navigation {
	margin-top: -4px;
}

#banner-main-top-navigation ul {
	margin-left: -102px;
}

#banner-main-top-navigation ul li {
	display: inline;
	padding-left: 74px;
}

#banner-main-top-navigation ul li span a {
	color: white;
	text-decoration: none;
}

#header-section {
	width: auto !important;
	height: auto !important;
	margin-top: 1px;
	margin-bottom: 2px;
}

#top-action-bar {
	background-color: black;
	height: 22px;
}

#top-action-bar-items {
	float: right;
	margin-top: 0.1em;
	margin-right: 0.3em;
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	color: white;
}

#top-image-bar {
	width: 100%;
	clear: both;
	background-image: url('../img/banner_bg.png');
	background-repeat: repeat-x;
	background-repeat: repeat-y;
	background-repeat: repeat;
	text-align: right;
	display: inline-block;
}

#top-image-bg {
	display: inline-block;
	width: 100%;
	/* position: top; */
	text-align: right;
}

#logoHeader {
	height: 70px;
	/* width: 100%; */
}

#top-menu-bar {
	background-color: black;
	height: 22px;
}

#top-menu-bar-items {
	float: right;
	margin-top: 0.1em;
	margin-right: 0.3em;
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	color: white;
}

/*************************/
/*       FOOTER AREA     */
/*************************/
#footer-section {
	padding-left: 1em;
	background-image: url('../img/banner_bg.png');
	background-repeat: repeat-x;
}

/*==========================================
		Wizard
============================================*/
.news_block {
	padding-left: 10px;
	width: 100%;
	float: left;
	border-radius: 5px;
	padding-top: 10px;
	overflow: auto;
}

.pageHeader {
	font-size: 18px;
	font-weight: bold;
	color: #64584C;
	text-shadow: #CCC 1px 1px 1px;
	padding-left: 12px;
}

.buttonDiv {
	text-align: right;
	margin-top: 5px;
}

.buttonLeftDiv {
	text-align: left;
	margin-top: 5px;
}

.labelColumn {
	text-align: left;
	width: 49%;
}

.seperatorColumn {
	text-align: left;
	width: 2%;
}

.valueColumn {
	text-align: left;
	width: 49%;
}

.labelColumn2 {
	width: 24.5%;
}

.seperatorColumn2 {
	width: 1%;
}

.valueColumn2 {
	width: 24.5%;
}

.selectOneRadioColumn td {
	border: none !important;
}

.wrap {
	white-space: normal;
}

.header-bar {
	width: 100%;
	height: 1.5em;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, grey),
		color-stop(100%, black)) !important;
	background: -moz-linear-gradient(top, #a5c956 53%, #b3d682 100%)
		!important;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
}

.header-bar-greeting {
	float: left;
	margin-left: 1em;
	font-size: 12px;
}

/* .small-button {
	padding: 0.15em !important;
	border: 0 !important;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(53%, #80B000),
		color-stop(100%, #005505)) !important;
}

.small-button:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(53%, #005505),
		color-stop(100%, #80B000)) !important;
} */
.fieldset-toggle, .small-button {
	cursor: pointer !important;
}

.sticky {
	position: fixed;
	top: 0;
	z-index: 100;
}

.container-default {
	width: calc(100% - 18em);
	margin-left: 18em;
	position: absolute;
	top: calc(75px + 2em);
}

.container-expand {
	width: calc(100% - 5em) !important;
	/* margin-left: 0.5; */
}

.menu-header {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, #827E00),
		color-stop(100%, #FFFEC4)) !important;
	background: -moz-linear-gradient(top, #827E00 53%, #FFFEC4 100%)
		!important;
	color: white;
	font-size: 1.2em;
	font-weight: bold;
	display: inline-block;
	width: 96%;
	padding: 0.3em 0.3em 0.3em 0.3em;
}

.menu-content:collapse {
	overflow: hidden;
}

.menu-content-panel {
	width: inherit;
	height: calc(100% - 10px);
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}

.menu-content-table tbody>tr, .menu-content-table>.ui-datagrid-content {
	background: none !important;
	border: none !important;
}

.menu-tree {
	background: none !important;
	width: inherit !important;
	border: 0 !important;
	overflow-y: visible !important;
}

.form-field {
	width: 100%;
	height: auto;
	display: inline-block;
}

.form-field-label {
	display: inline-block;
	float: left;
	width: 200px;
	height: inherit;
	font-size: 1em;
}

.form-field-separator {
	display: inline-block;
	float: left;
	height: inherit;
	margin-left: 5px;
	margin-right: 5px;
}

.form-mandatory {
	float: left;
	padding-left: 0.5em;
	min-height: 1.7em;
}

.table-mandatory {
	height: 100%;
	overflow: auto;
	width: 5px;
}

.mandatory-completed {
	background-color: #008000;
}

.mandatory-required {
	background-color: #FF0000;
}

.mandatory-optional {
	background-color: #FFFFFF;
}

.mandatory-empty {
	background: none;
}

.form-field-contents {
	display: inline-block;
	float: left;
	width: calc(100% - 220px);
	height: inherit;
	margin-left: 0.5em;
}

.form-field-content {
	display: inline-block;
	width: 100%;
	margin-bottom: 0.2em;
	min-height: 1.7em;
}

.form-field-content .form-field-content-newline {
	margin-bottom: 0.2em;
}

.form-field-content-additional {
	display: inline-block;
	margin-left: 0.5em;
}

.input-text-width-1, .input-text-width-2, .input-select-width-1,
	.input-select-width-2 {
	margin-right: 0.2em;
}

.input-text-width-1 {
	width: calc(33% - 0.5em);
}

.input-text-width-2 {
	width: calc(66% - 0.5em);
}

.input-text-width-3 {
	width: calc(100% - 0.5em);
}

.input-autocomplete-width-1 {
	width: calc(33% - 2.2em) !important;
}

.input-autocomplete-width-2 {
	width: calc(66% - 2.2em) !important;
}

.input-autocomplete-width-3 {
	width: calc(100% - 2.2em) !important;
}

.input-autocomplete-width-5em {
	width: 5em !important;
}

.input-autocomplete-button {
	padding: 0;
}

.input-select-width-1 {
	width: calc(33% - 1.5em) !important;
}

.input-select-width-2 {
	width: calc(66% - 1.5em) !important;
}

.input-select-width-3 {
	width: calc(100% - 1.5em) !important;
}

.panel-header-title {
	font-size: 1.3em;
	color: #64584C;
	font-weight: bold;
}

.side-panel {
	display: inline-block;
}

.side-panel-left {
	width: 20em;
}

.side-panel-right {
	width: 22em;
	float: right;
}

.side-panel-left, .side-panel-right {
	background-color: #eaf1dd;
}

.side-panel-collapse {
	white-space: nowrap !important;
	overflow: hidden;
}

.side-panel-button-show {
	display: none;
}

.side-panel-content {
	margin-top: 0.5em;
	padding: 0.5em;
	background-color: #EAE7E6;
	border: 1px solid silver;
}

.side-panel-content tr {
	background-color: #EAE7E6;
}

.body-height {
	min-height: calc(100% - 143px - 150px);
}

.body-contents {
	width: 100%;
	display: inline-block;
	background-image: url('../img/bg-body.png');
	background-repeat: repeat;
}

/*
	body width
	c = content only
	pc = content after left side panel
	cp = content before right side panel
	pcp = content between left and right side panels
*/
.body-content-width-c {
	width: 100%;
}

.body-content-width-pc {
	width: calc(100% - 21em);
}

.body-content-width-cp {
	width: calc(100% - 23.3em);
}

.body-content-width-pcp {
	width: calc(100% - 43.3em);
}

.body-content-width-c, .body-content-width-pc, .body-content-width-cp,
	.body-content-width-pcp {
	display: inline-block;
	margin: 0 0.5em;
}

.body-side-panel-collapse {
	width: initial;
}

.center-contents {
	padding-top: 0.5em;
}

.header-content {
	width: 100%;
	height: 143px;
}

.footer-content {
	width: 100%;
	height: 150px;
}

.banner-main {
	height: 100%;
	width: 1175px;
	background-image: url('../img/banner-main-edit.jpg');
	background-repeat: no-repeat;
}

.banner-side-left, .banner-side-right {
	height: 100%;
	width: calc(( 100% - 1175px)/2);
	background-image: url('../img/banner-side.jpg');
	background-repeat: repeat-x;
}

.banner-main, .banner-side-left {
	float: left;
}

.banner-side-right {
	float: right;
}

.langkah-bar-current, .langkah-bar-completed, .langkah-bar-incomplete {
	width: 100%;
	margin-bottom: 0.25em;
}

.langkah-bar-current {
	background: #8CA641;
}

.langkah-bar-completed {
	background: #BCE162;
}

/* .langkah-bar-incomplete {
    background: #DEDEDE;
} */
.langkah-bar-indi-current, .langkah-bar-indi-completed,
	.langkah-bar-indi-incomplete {
	float: left;
	height: inherit;
	padding-left: 0.7em;
}

.langkah-bar-indi-current, .langkah-bar-indi-completed {
	background: green;
}

.langkah-bar-indi-incomplete {
	background: red;
}

.langkah-bar-number {
	float: left;
	padding: 0 0.3em;
	height: inherit;
	background-color: white;
}

.langkah-bar-number-content {
	height: inherit;
	color: black;
	font-weight: bold;
	vertical-align: middle;
	display: table-cell;
}

.langkah-bar-title-current, .langkah-bar-title-completed,
	.langkah-bar-title-incomplete {
	float: left;
	height: inherit;
}

.langkah-bar-title-current {
	font-weight: bold;
}

.langkah-bar-title-completed, .langkah-bar-title-incomplete {
	font-weight: normal;
}

.langkah-bar-title-content {
	width: 14em;
	padding: 1.2em 0.5em;
	height: inherit;
	color: black;
	vertical-align: middle;
	display: table-cell;
}

.langkah-bar-title-link-current, .langkah-bar-title-link-completed,
	.langkah-bar-title-link-incomplete {
	text-decoration: none;
}

.langkah-bar-title-link-current {
	color: white;
}

.langkah-bar-title-link-completed, .langkah-bar-title-link-incomplete {
	color: black;
}

.menu-item-1 {
	background: linear-gradient(to bottom, #32cd20 0%, #50b243 50%, #26a017 100%);
	list-style-type: none;
	padding: 2px 0 2px 2px;
	vertical-align: middle;
	border: 1px solid #000;
	cursor: pointer;
	border-radius: 5px;
	font-weight: bold;
}

.menu-item-2 {
	background: linear-gradient(to bottom, #32cd20 0%, #50b243 50%, #26a017 100%);
	list-style-type: none;
	padding: 2px 0 2px 10px;
	vertical-align: middle;
	border: 1px solid #000;
	cursor: pointer;
	border-radius: 5px;
	font-weight: bold;
	margin-left: 1em;
}

.menu-item-2.has-children .menu-item-label {
	width: 89%;
}

.menu-item-3 {
	background: linear-gradient(to bottom, #32cd20 0%, #50b243 50%, #26a017 100%);
	list-style-type: none;
	padding: 2px 0 2px 10px;
	vertical-align: middle;
	border: 1px solid #000;
	cursor: pointer;
	border-radius: 5px;
	font-weight: bold;
	margin-left: 2em;
}

.menu-item-label {
	/* width: 85%; */
	display: inline-block;
}

.menu-item-expand {
	float: right;
	background: none;
	border: none;
	margin-right: 0.3em;
	display: inline-block;
}

/* ET:FileUpload */
.et-ui-fileUpload .ui-fileupload-content.ui-widget-content.ui-corner-bottom
	{
	border: none;
	background: transparent;
}

.et-ui-fileUpload .ui-button-icon-left.ui-icon.ui-c.ui-icon-plusthick {
	display: none;
}

.et-ui-fileUpload .ui-fileupload-buttonbar.ui-widget-header.ui-corner-top
	{
	background: none;
	border: none;
}

.et-ui-fileUpload .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-icon-left.ui-fileupload-choose
	{
	/* background: url(../../resources/img/lampiran.png) !important; */
	/* sakinah */
	background:
		url('/etanah-awam/javax.faces.resource/img/lampiran.png.xhtml')
		!important;
	background-size: 28px 28px;
	background-repeat: no-repeat !important;
	border: none !important;
	height: 30px;
	width: 30px;
	padding: 0 !important;
	margin: 0 !important;
}

.et-ui-fileUpload .ui-button-text.ui-c {
	color: transparent;
	text-shadow: none;
	background: none;
	height: 45px;
	padding: 0 !important;
	display: none;
}

.et-ui-fileUpload .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-icon-left.ui-fileupload-choose input
	{
	height: 28px !important;
}

.et-ui-fileUpload .ui-fileupload.ui-widget {
	display: inline-block;
}

.et-ui-fileUpload .ui-datalist.ui-widget {
	display: inline-block;
}

.et-ui-fileUpload .ui-datalist-content.ui-widget-content {
	border: none;
	background: transparent;
}

.et-ui-fileUpload .ui-datalist-data {
	padding-left: 1em !important;
}

.et-ui-fileUpload .ui-fileupload-files {
	margin: 0 !important;
}

.et-ui-datalist .ui-datalist.ui-widget {
	display: inline-block;
}

.et-ui-datalist .ui-datalist-content.ui-widget-content {
	border: none;
	background: transparent;
}

.et-ui-dashboard .ui-filter-column {
	vertical-align: bottom;
}

.et-ui-dashboard .ui-datatable .ui-datatable-data tr {
	height: 35px;
}

.dialog-width-xlarge {
	width: 1160px !important;
	overflow: hidden !important;
}

.dialog-width-large {
	width: 1080px !important;
	overflow: hidden !important;
}

.dialog-width-xlarge-overflow {
	width: 1160px !important;
	overflow: auto !important;
	height: 700px !important;
}

.dialog-width-medium {
	width: 720px !important;
}

.dialog-width-small {
	width: 480px !important;
}

.et-ui-audit .ui-selectmanymenu .ui-selectlistbox-list {
	line-height: 1.45;
}

.et-ui-audit .ui-datatable {
	width: 750px !important;
	margin: 0 auto;
}

.et-ui-audit .ui-datatable .ui-datatable-tablewrapper {
	width: 750px;
	overflow-x: scroll;
}

/* ET:FileUpload */

/* From bootstrap */
body {
	margin: 0;
	line-height: 1.428571429;
}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

*:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

img {
	vertical-align: middle;
}

.hide {
	display: none !important;
}

fieldset {
	padding: 0 0 4px 0;
	min-width: 0;
	clear: both;
}

.form-horizontal .control-label, .form-horizontal .radio,
	.form-horizontal .checkbox, .form-horizontal .radio-inline,
	.form-horizontal .checkbox-inline {
	margin-bottom: 0;
}

.ui-grid-col-1, .ui-grid-col-2, .ui-grid-col-3, .ui-grid-col-4,
	.ui-grid-col-5, .ui-grid-col-6, .ui-grid-col-7, .ui-grid-col-8,
	.ui-grid-col-9, .ui-grid-col-10, .ui-grid-col-11, .ui-grid-col-12 {
	padding-left: 6px;
	padding-right: 6px;
}

.clearfix:before, .clearfix:after, .container:before, .container:after,
	.container-fluid:before, .container-fluid:after, .row:before, .row:after,
	.form-horizontal .form-group:before, .form-horizontal .form-group:after,
	.btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical>.btn-group:before,
	.btn-group-vertical>.btn-group:after, .nav:before, .nav:after, .navbar:before,
	.navbar:after, .navbar-header:before, .navbar-header:after,
	.navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after,
	.panel-body:before, .panel-body:after, .modal-footer:before,
	.modal-footer:after {
	content: " ";
	display: table;
}

/* .form-horizontal .control-label { */
/*     padding-right: 0 !important; */
/* } */
/*  */
.notification-unread {
	font-weight: bold !important;
}

.notification-read {
	font-weight: normal !important;
}

/* File upload solution (because at ie and firefox not working!) */
.ui-fileupload-buttonbar .ui-fileupload-choose input {
	transform: translate(0px, 0px) !important;
}

/* mandatory icon for tab */
.tab-mandatory {
	float: left;
	padding-left: 2em;
	min-height: 22px;
}

.mandatoryLabel {
	line-height: 22px;
}

.mandatory-icon-required {
	background-image:
		url('/etanah-awam/javax.faces.resource/img/mandatoryRequired.png.xhtml');
	background-size: 16px 16px;
	background-position: center;
	background-repeat: no-repeat;
}

.mandatory-icon-completed {
	background:
		url('/etanah-awam/javax.faces.resource/img/mandatoryCompleted.png.xhtml');
	background-size: 16px 16px;
	background-position: center;
	background-repeat: no-repeat;
}

.mandatory-icon-optional {
	background:
		url('/etanah-awam/javax.faces.resource/img/mandatoryCompleted.png.xhtml');
	background-size: 16px 16px;
	background-position: center;
	background-repeat: no-repeat;
}

.et-ui-picklist {
	padding-left: 5px !important;
}

.et-ui-picklist ul.ui-widget-content.ui-picklist-list.ui-picklist-source.ui-corner-bottom.ui-sortable
	{
	width: 350px !important;
}

.et-ui-picklist .ui-picklist-caption.ui-widget-header.ui-corner-tl.ui-corner-tr
	{
	height: 22px !important;
}

.et-ui-picklist ul.ui-widget-content.ui-picklist-list.ui-picklist-target.ui-corner-bottom.ui-sortable
	{
	width: 350px !important;
}

.et-ui-picklist .ui-picklist-caption.ui-widget-header.ui-corner-tl.ui-corner-tr
	{
	height: 22px !important;
}

.et-ui-dokumen-toggler .ui-row-toggler {
	/* Hidden row toggler for penyediaan dokumen component */
	visibility: hidden !important;
	display: inline !important;
}

.dropdown-check-list {
	display: inline-block;
}

.dropdown-check-list .anchor {
	position: relative;
	cursor: pointer;
	display: inline-block;
	padding: 5px 50px 5px 10px;
	text-align: right;
	width: 200px;
}

.dropdown-check-list .anchor:after {
	position: absolute;
	content: "";
	border-left: 2px solid black;
	border-top: 2px solid black;
	padding: 5px;
	right: 10px;
	top: 20%;
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

.dropdown-check-list .anchor:active:after {
	right: 8px;
	top: 21%;
}

.dropdown-check-list ul.items {
	padding: 2px;
	display: none;
	margin: 0;
	background-color: #D3D3D3;
}

.dropdown-check-list ul.items li {
	list-style: none;
}

div#list1:focus {
	outline: none;
}

/* For testing before change. IF got issue REMOVE it. No issue, add it on internal.less */
.form-horizontal .form-group {
	margin-bottom: 0;
}
/* .row{
	line-height: 0px;
} */
tfoot>tr>td, .ui-datatable>.ui-datatable-tablewrapper>table>tfoot>tr>td
	{
	background: #D9D9D9 !important;
}

tfoot {
	height: 0.1px;
}

/* don't show the x for text inputs in ie */
::-ms-clear {
	width: 0;
	height: 0;
}

/* don't show the eye for password inputs in ie*/
::-ms-reveal {
	width: 0;
	height: 0;
}

/* toggle switch color */
.ui-inputswitch-handle {
	background: #555555 !important;
}

/* end for testing */

/*class for left menu border bottom*/
.menu-border-bottom {
	border-bottom: 3px solid black;
}

/* Image viewer */
.ui-icon-rotate-left, .ui-icon-rotate-right, .ui-icon-zoomin,
	.ui-icon-zoomout, .ui-icon-reset-zoom-rotate {
	width: 20px;
	height: 20px;
}

.act-like-btn {
	cursor: pointer;
	display: inline-block;
	width: 30px;
	border: 1px solid #ccc !important;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	height: 25px;
	padding: 1px 3px;
	font-weight: bold !important;
	background: #757575 !important;
	background: -ms-linear-gradient(top, #757575 0, #464646 100%) !important;
	background: -moz-linear-gradient(top, #757575 0, #464646 100%)
		!important;
	background: -o-linear-gradient(top, #757575 0, #464646 100%) !important;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #757575),
		color-stop(1, #464646)) !important;
	background: -webkit-linear-gradient(top, #757575 0, #464646 100%)
		!important;
	background: linear-gradient(to bottom, #757575 0, #464646 100%)
		!important;
}

.act-like-btn:hover {
	background: #ffc !important;
}

.positionButtonDiv {
	margin-bottom: 10px;
}
.zoom-in, .zoom-out{
    width: 30px;
    height: 25px;
    padding: 1px 5px;}

