/*==========================================================================
MASTER SIDE BAR
===========================================================================*/

.master-side-bar .master-topbar, 
.details-panel .details-topbar {
	background-color: #505050;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.25);
	line-height: 33px;
	height: 33px;
	font-weight: bold;
}

.turnBack-btn {
	width: 40px;
	margin-left: 2px;
	line-height: 22.2px;
}
.master-side-bar .ui-icon::before{
	color: #ffff;
}

button.turnBack-btn  span.ui-button-text {
	padding: 0;
}

.e1-sideBar {
	background-color: #515151;
	color: #ffffff;
	box-shadow: 2px 0px 4px rgba(0, 0, 0, 0.25);
}

.master-avatar {
	width: 150px;
	height: 150px;
	border-radius: 50%;
	margin: 15px auto;
	display: flex;
	justify-content: center;
}
/*-------------------------------------------------------
GROUP OF ICON 
--------------------------------------------------------*/
.group-icon-container {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.group-icon-container>* {
	padding: 5px 10px;
}

.group-icon-container .syn-upload-file-button .ui-corner-top:hover {
	background-color: transparent;
}

.popUp-image-full-size {
	overflow: auto;
	max-height: 800px;
	max-width: 800px;
}

/*-------------------------------------------------------
NEW ICON 
--------------------------------------------------------*/
.md-file-pdf-o{
	background-image: url("/TH6/javax.faces.resource/images/pdf-icon.svg.xhtml?ln=synfaces") !important;
	width: 22px;
	height: 22px;
	top: 11px !important;
}
.new-folder-icon .ui-icon.fa-folder-plus{
	background-image: url("/TH6/javax.faces.resource/images/add-folder-icon.png.xhtml?ln=synfaces") !important;
	width: 35px;
	height: 35px;
	top: -2px !important;
	left: 3px !important;
}
.new-folder-icon{
	width: 45px;
    height: 25px;
	background:transparent !important;
	border: none !important;
	
}
.new-folder-icon .ui-button-text{
	display: none;
}
div.top-bar-notification-div span.workflow-icon{
	background-image: url("/TH6/javax.faces.resource/images/flowchart-icon.svg.xhtml?ln=synfaces") !important;
	width: 17px;
	height: 17px;
	top: 11px !important;
}
 

/*===============================================================================
 MENU	
=================================================================================*/
.menu-side-bar {
	padding: 0;
	border-top: 1px solid #787878;
	border-top: none; /* OVERRIDE some screen not reflect E2a UI  */ 
}

.menu-side-bar .ui-menu {
	padding: 0;
	border: 0;
	background-color: #515151;
	display: flex;
	flex: 1;
	flex-direction: column;
}

 .menu-side-bar li button.ui-button.ui-state-default,
.menu-side-bar .ui-menuitem a span button{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	width: 100%;	
	padding: 10px 16px;
	background-color: transparent;
	color: #ffffff;
	border: none; 
} 

.menu-side-bar .ui-menu-list>.ui-menuitem>.ui-menuitem-link {
	padding: 9px 0;
}
.menu-side-bar .ui-menu .ui-menuitem-link{
	width: 100%;
	box-sizing: border-box;
}

.menu-side-bar span.ui-icon:before {
	color: #ffffff;
	margin-left: 10px;
}
.master-side-bar .ui-menu-list li.ui-menuitem a.singleMenu .ui-menuitem-text {
	margin-left: 20px;
}
.ui-menu .ui-menuitem-link,
.ui-menu .ui-menuitem  {
	border-radius: 0;
}

/*======================================================================================
SUBMENU
========================================================================================*/
  .master-side-bar .ui-panelmenu .ui-icon::before {
	top: -4px;
	right: -14em;
	position: absolute;
	font-size: 20px;
} 

 .master-side-bar .ui-panelmenu .ui-icon::after {
	top: 0;
	left: 12px;
	position: absolute;
}

.master-side-bar span.ui-menuitem-text span.ui-button-text {
	float: left;
	margin: 0 0 0 2em;
}


.menu-side-bar .ui-panelmenu .ui-panelmenu-header {
	display: block;
	padding: 8px 16px;
	background-color: transparent;
	color: #ffffff;
	border: none;
}

.master-side-bar .ui-panelmenu .ui-panelmenu-header a,
.master-side-bar .ui-panelmenu .ui-panelmenu-header span.ui-icon:before,
.master-side-bar .menu-side-bar .ui-menu-list li.ui-menuitem span.ui-menuitem-text {
	color: #ffffff ;
}

.master-side-bar .ui-panelmenu .ui-panelmenu-content {
	border: 0;
	background-color: #595959;
	padding: 0;
}

.master-side-bar .ui-panelmenu .ui-panelmenu-content .ui-menu-list .ui-menuitem-link{
	padding-left: 42px;
	font-weight: bold;
}

.master-side-bar .menu-side-bar .ui-menuitem-outline {
	outline: 0;
}

.master-side-bar .myIcon .ui-icon.ui-icon-triangle-1-e::after, 
.master-side-bar .myIcon .ui-icon.ui-icon-triangle-1-s::after{
	content: "\f0d6";
}

.master-side-bar .myIcon.fa-money-bill .ui-icon.ui-icon-triangle-1-e::after, 
.master-side-bar .myIcon.fa-money-bill .ui-icon.ui-icon-triangle-1-s::after{
	content: none;
}

.master-side-bar .myIcon.sub-menu h3 {
	margin-left: 20px;
}

.master-side-bar .ui-submenu-child .ui-menuitem-text{
	margin-left: 42px;
}


/*===========================================================================
COMMON
============================================================================*/

.menu-side-bar .ui-menu-list li.ui-menuitem span.ui-menuitem-text::selection,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu.selected,
.menu-side-bar .ui-menuitem a span button.selected,
.menu-side-bar li button.selected,
.master-side-bar .ui-panelmenu .ui-panelmenu-content .ui-menu-list li.ui-menuitem a.selected {
	background-color: #363636 !important;
}

.menu-side-bar .ui-menu-list li.ui-menuitem a.selected span.ui-menuitem-text,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu.selected span.ui-menuitem-icon:before,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu.selected,
.master-side-bar .ui-menuitem a span button.selected span.ui-button-text,
.menu-side-bar li button.selected span.ui-button-text, 
.menu-side-bar li button.selected span.ui-icon:before {
	color: #8fc4ff;
}

.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu:hover,
.menu-side-bar .ui-panelmenu-panel h3:hover,
.menu-side-bar .ui-menuitem a span button:hover,
.menu-side-bar li button:hover,
.master-side-bar .ui-panelmenu-panel .ui-menuitem:hover {
	background-color: #5e5e5e !important;
}

.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu:hover span.ui-menuitem-text{
	background-color: inherit !important;
}


.menu-side-bar .ui-menu-list li.ui-menuitem span.ui-menuitem-text:hover,
.menu-side-bar .ui-menu-list li.ui-menuitem a.selected span.ui-menuitem-text,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu.selected span.ui-menuitem-icon:before,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu.selected,
.menu-side-bar .ui-menu-list li.ui-menuitem a.singleMenu:hover,
.menu-side-bar .ui-panelmenu-panel h3:hover, 
.menu-side-bar .ui-panelmenu-panel .ui-menuitem,
.master-side-bar .ui-menuitem a span button.selected span.ui-button-text,
.menu-side-bar .ui-menuitem a span button:hover,
.menu-side-bar li button:hover,
.menu-side-bar li button.selected span.ui-button-text, 
.menu-side-bar li button.selected span.ui-icon:before{
	-moz-transition: color .1s ease-in;
	-o-transition: color .1s ease-in;
	-webkit-transition: color .1s ease-in;
}

/*=======================================================================================================
DETAILS
========================================================================================================== */

.details-panel .details-topbar {
	color: #ffffff;
	padding-left: 25px;
}

.details-panel td.synfaces-grid-item { 
	background: none !important; 
	padding: 5px 4px !important;
	min-height: 35px; 
} 

/*-------------------------------------------------------
				ATTACHMENTS
--------------------------------------------------------*/

.details-panel .blue-button.btnUpload .ui-fileupload-choose>span.ui-icon-plusthick {
	display: none !important;
}

.details-panel .blue-button.btnUpload .ui-button-text {
	color: #ffff;
	padding: 7px 5px 0px 5px;
}

.details-panel .blue-button.btnUpload > .ui-fileupload-buttonbar {
	background-color: #7a98d6;
	border: 1px solid #5872a3;
	display: inline-block;
	padding: 5px;
}

.details-panel .blue-button.btnUpload > .ui-fileupload-buttonbar:hover{
	background-color: #6685C7;
}

.details-panel .blue-button.btnUpload > .ui-fileupload-buttonbar:active{
	background-color: #5373B6;
}
/*------------------------------------------------------  
			GROUP OF ICON SIDE BAR
-------------------------------------------------------*/
.details-panel .ui-fileupload-choose {
	margin-top: -8px;
}

.e1-sideBar .white-icon>.ui-fileupload-buttonbar, 
.e1-sideBar .group-icon-container button.white-icon,
.details-panel .white-icon>.ui-fileupload-buttonbar,
.details-panel .group-icon-container button.white-icon{
	background-color: transparent;
	border: none;
	padding-bottom: 5px;
}

.menu-side-bar .white-icon>.ui-fileupload-buttonbar>span:before, 
.menu-side-bar .white-icon span:before,
.details-panel .white-icon>.ui-fileupload-buttonbar>span:before,
.details-panel .group-icon-container button.white-icon{
	color: #ffffff;
	font-size: 15px;
}
/*------------------------------------------------------  
	FIXED HEADER TABLES/TREE TABLES
-------------------------------------------------------*/
.syndatatable-freeze-header-summary-tabs .ui-tabs-panels .ui-tabs-panel[aria-hidden="false"] {
			display: flex;
			flex-direction: column;
			height: 100%;
			box-sizing: border-box;
}

.syndatatable-freeze-header-summary-tabs ul.syn-legend-single-line{
	padding: 0;
	margin: 0;
}

.syndatatable-no-column-border .ui-datatable-header{
	border: none !important;
}

.syndatatable-freeze-header .ui-datatable-header,
.syndatatable-freeze-header .ui-datatable-scrollable-header,
.syndatatable-freeze-header .ui-treetable-scrollable-header,
.ui-treetable-scrollable .ui-treetable-scrollable-header,
.ui-datatable-scrollable .ui-datatable-header,
.ui-datatable-scrollable .ui-datatable-scrollable-header{
    flex-shrink: 0;
}
/* .ui-treetable-scrollable .ui-treetable-scrollable-body,
.ui-datatable-scrollable .ui-datatable-scrollable-body */
.syndatatable-freeze-header .ui-datatable-scrollable-body,
.syndatatable-freeze-header .ui-treetable-scrollable-body{
    flex: 1 1 0 !important;
}
.ui-treetable-scrollable .ui-treetable-scrollable-body{
	padding: 0 !important;
}
.syndatatable-freeze-header .ui-datatable-scrollable-theadclone,
.ui-datatable-scrollable .ui-datatable-scrollable-theadclone{
	line-height: 0 !important;
}


/*------------------------------------------------------  
		REMOVE HEADER TABLE
-------------------------------------------------------*/
.ui-datatable.remove-header{
	border-top:1px solid #e4e4e4;
}

.ui-datatable.remove-header thead tr th {
	display:none;
}

/* E2 */

 #mainFormPagePanel .ui-tabs.main-panel-tab-view .ui-tabs-panels .ui-tabs-panel,
 #mainFormPagePanel .ui-tabs.main-panel-tab-view,
 #mainFormPagePanel .ui-tabs.main-panel-tab-view .ui-tabs-panels{
 	overflow: visible;
 }

 #mainFormPagePanel .ui-tabs.main-panel-tab-view .ui-tabs-panels{
 /* 	overflow-x: scroll; */
	display: block;
 }