#lbl_username{ text-transform:capitalize;}
.active_tab
{
    background-color: #40A8C5;
   /* background-image:url("images/arrow_tab_2.png");*/
    color: #ffffff !important;
    background-repeat:no-repeat;
    background-position:right;
}
.active_tab > i{ color:#fff !important;}
.active_tab:hover
{
    background-color: #40A8C5 !important;
    background-image:url("images/arrow_tab_2.png") !important;
    color: #ffffff !important;
    background-repeat:no-repeat !important;
    background-position:right !important;
}
.shadow_dash {
    box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.1) !important;
   
}
.input_de{ float:left;}
.inline-flex{ display:inline-flex;}
.top-3{ margin-top:2px !important;}

.table tr td a{ color:#40a8c5;}
.table tr td a:hover{text-decoration:underline;}
/* here you can put your own css to customize and override the theme */

/***
Rounded Portlets
***/
/*
.portlet {
	border-radius: 4px !important;
}

.portlet .portlet-title {
	border-radius: 4px 4px 0px 0px !important;
}

.portlet .portlet-body,
.portlet .portlet-body .form-actions  {
	border-radius: 0px 0px 4px 4px !important;
}
*/

/*
Change Quick Sidebar Width
*/

/*
.page-quick-sidebar-wrapper {
  right: -370px;
  width: 370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  margin-left: -370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content .page-footer {
  margin-right: 370px;
  margin-left: -370px;
}

.page-sidebar-reversed.page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  margin-right: 370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content.page-quick-sidebar-full-height .page-header {
  margin-left: -370px;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-list {
  width: 370px !important;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-item {
  width: 370px !important;
  margin-left: 370px;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-content-item-shown .page-quick-sidebar-list {
  margin-left: -370px;
}
*/

/*html, body {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#3C5868;
}*/
body {
	background:#fff;	
}

body.main-body 
{
	background:#003965;
}

body.help-window
{
	background:#003965;
	margin:0px;
}





a, a img, input {
	border:0px;
	outline:0px;
}
/*input, select, textarea {
    background:#FFFFFF;
    border: 1px solid silver;
    font-size:11px;
	width:140px;
}
*/
input[type='checkbox'],
input[type='radio'],
input[type='image'],
input[type='file'] {
	width:auto;
	margin:0px;
}

input:focus, select:focus, textarea:focus 
{
	/*background:#ffffdd;*/
}

ul, ol, li {
	margin:0px;
	padding:0px;
	list-style:none;
	outline:0px;
}

h1, h2, h3, h4 {
	color:#364656;
	/*font-family:Arial, Helvetica, sans-serif;*/
	width:100%;
	float:left;
	margin:5px;
	padding:0px;
	font-size:14px !important;
}

h1 {
	line-height:30px;
	text-transform:uppercase;
	font-size:17px;
}

h2 {
	line-height:20px;
	font-size:14px;
	width:99%;
	padding:8px 0 0 10px;
	margin:0 !important;	
}

	h2 span {
		font-size: 12px;
		font-weight: normal;
	}


form 
{
	
}
input[type='submit'], input[type='button'], input[type='reset'],
a.reset, a.export {
	/*color:#FFF;
	float:left;
	border-radius:4px;
	cursor:pointer;
	font-weight:normal;
	font-size:11px;
	border:solid 0px #1a527d;
	padding:0 12px;
	height:20px;
	line-height:20px;
	margin:0 6px 0 0;	
	background: #266697;
	background: -moz-linear-gradient(top,  #266697 0%, #3b82b8 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#266697), color-stop(100%,#3b82b8));
	background: -webkit-linear-gradient(top,  #266697 0%,#3b82b8 100%);
	background: -o-linear-gradient(top,  #266697 0%,#7db9e8 100%);
	background: -ms-linear-gradient(top,  #266697 0%,#3b82b8 100%);
	background: linear-gradient(to bottom,  #266697 0%,#3b82b8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#266697', endColorstr='#3b82b8',GradientType=0 );

	
	width:auto;
	text-decoration:none;*/

}

.gridLayout a.reset, .formLayout a.reset,
.gridLayout a.export, .formLayout a.export {
	float:right;
	
	padding:2px 10px;
	line-height:20px;
	color: #555;
    background-color: #E5E5E5;
	margin: 12px 28px 2px 0px;
}
.gridLayout a.export:hover{ text-decoration:none; background-color:lightgray; box-shadow:0px 0px 7px #ccc;}
.formLayout a.import {
	line-height:normal;
	float:left;
	padding:0 10px;

	
	
}


input[type='submit']:hover, input[type='button']:hover, input[type='reset']:hover,
.gridLayout a.reset:hover, .formLayout a.reset:hover, .gridLayout a.export:hover, .formLayout a.export:hover {
	/*color:#fff;
	background: #478bc0;
	background: -moz-linear-gradient(top,  #478bc0 0%, #b9e0ff 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#478bc0), color-stop(100%,#b9e0ff));
	background: -webkit-linear-gradient(top,  #478bc0 0%,#b9e0ff 100%);
	background: -o-linear-gradient(top,  #478bc0 0%,#b9e0ff 100%);
	background: -ms-linear-gradient(top,  #478bc0 0%,#b9e0ff 100%);
	background: linear-gradient(to bottom,  #478bc0 0%,#b9e0ff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#478bc0', endColorstr='#b9e0ff',GradientType=0 );
	
	text-decoration:none;*/
	
	
	
	
}


#loginForm .login-corner {
	float:left;
	position:absolute;
	left:0px;
	top:0px;
	width:85px;
	height:85px;
	background:url(../images/login-corner.png) 0 0 no-repeat;
}

#loginForm .login-shadow {
	float:left;
	position:absolute;
	left:0px;
	bottom:-32px;
	width:362px;
	height:32px;
	background:url(../images/login-shadow.gif) 0 0 no-repeat;
}

#header 
{
	border-radius:6px 6px 0 0;
	border:solid 1px #1a527d;
	float:left;
	width:100%;
	min-width:900px;
	
	-moz-box-shadow:inset 0px 1px 0px #79aace;
	-webkit-box-shadow:inset 0px 1px 0px #79aace;
	box-shadow:inset 0px 1px 0px #79aace;
	
	background: #216396;
	background: -moz-linear-gradient(top,  #428bc3 0%, #216396 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#428bc3), color-stop(100%,#216396));
	background: -webkit-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: -o-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: -ms-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: linear-gradient(to bottom,  #428bc3 0%,#216396 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#428bc3', endColorstr='#216396',GradientType=0 );
	
}

#header input[type='submit'] 
{
	float:right;
	margin:0;
	padding:0;
	background:url(../images/logout.gif) left center no-repeat;
	line-height:24px;
	position:relative;
	top:0px;
	right:0px;
	height:24px;
	color:#24679a;
	width:26px;
	border-radius:0 3px 0 3px;
}

#header input[type='submit']:hover {
	box-shadow:0 0 8px #79aace inset;
}


#header .logo 
{
	float:left;
	padding:0;
	margin:5px 0 5px 10px;
	border-radius:6px;
}
#header .logo img,
#header .logo-user img  {	
	border-radius:6px;	
	height:50px;
}

#header .logo-user 
{
	float:right;
	margin:5px 10px 5px 0;
}

#middle {
	width:100%;
	min-width:900px;
	float:left;
	background:#f6f7f9;
	border-left:1px solid #d6d8d8;
	border-bottom:1px solid #d6d8d8;
	border-right:1px solid #d6d8d8;
	border-radius:0 0 6px 6px;
}

#left-menu ul {
	float:left;
	width:100%;
}

#left-menu ul ul {
	display:none;
}

#left-menu li {
	
	float:left;
	width:100%;
}

#left-menu li.active {
	border-bottom:solid 1px #dfdfdf;
	border-top:solid 1px #dfdfdf;
	border-right:solid 2px #ffffff;
	background:#fff;
	width:210px;
}

#left-menu li.active a.active {
	padding:9px 0 9px 30px;
	position:relative;
	font-weight:bold;
	
	background:url(../images/bullet1.gif) 10px 13px no-repeat;
}

#left-menu li.active ul {
	display:block;
}

#left-menu li a {
	
}

#left-menu li a:hover 
{
	
	
}

#left-menu ul ul {
	
}

#left-menu ul ul a {
	
}

#left-menu ul ul a:hover {
	
}

#content 
{
	
}

#page-content {
	
}

.formLayout, .gridLayout {
	float: left;
	width: 100%;
	/*background:#f4f4f4;
	border:solid 1px #d9d9d9;*/
	margin: 0 0 15px 0.3rem;
	padding: 0;
	min-height: 40px;
	border: 1px solid #ddd;
	border-top: none;
}

/*.formLayout {
	width: 100%;
	position: relative;
	padding-top: 10px;
	border: 1px solid #ddd;
	border-top: none;
}*/

.formLayout {
	width: 100%;
	position: relative;
	padding: 10px;
	border: 1px solid #ddd;
	/* border-top: none; */
	background: white;	
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
	border: 1px solid #f3f3f3;
	border-radius: 6px !important;
}

.formLayout ul, .formLayout ul li {
	float:left;
	color:#555;
	padding:4rem 0 0 0;
	width:100%;
}


.formLayout ul li {
	width:100%;
	padding:0 0 12px 0;
	clear:both;
   
}

.formLayout ul li.none-object {
	padding:0px;
}

.formLayout label {
	float: left;
	/*width: 180px;*/
	padding: 0 0 0 5px;
	font-weight: 600;
}


.formLayout .formGrid {
	width:96%;
	margin:0 2%;
}

.formLayout .formGrid input[type='text'], .formLayout .formGrid select {
	width:90%;
}


.formLayout .formGrid th, .formLayout .formGrid td {
	text-align:left;
	font-weight:normal;
	font-size:11px;
	padding:6px;
	margin:1px;
}

.formLayout .checkboxList {
	width:65%;
}

.formLayout .checkboxList td {
	width:33%;
}
.formLayout .checkboxList input {
	float:left;
	margin:4px 10px 0 0px;
}

.formLayout .checkboxList label {
	line-height:normal;
	padding:0px;
	line-height:20px;
	margin:0px;
	width:80%;
}

.formLayout .dateFrom {
	width:65%;
	float:left;
}

.formLayout .dateFrom input {
	width:43%;
	background:url(../images/cal-icon.gif) right top no-repeat #fff;
}

.formLayout .dateFrom span {
	float:left;
	width:6%;
	text-align:center;
	line-height:26px;
}

.formLayout .reportLayoutSelect 
{
	width:68%;
	float:left;
}

.formLayout .reportLayoutSelect select
{
	width:28%;
	margin:0 5% 0 0;
}

.gridLayout table {
    clear:both;
	
}

.gridLayout table tr td, .gridLayout table tr th {
	
	padding:3px;
}

 .gridLayout table tr th 
 {
 	
 }

.gridLayout table tr:nth-child(2n+1) td
{
	
} 

.gridLayout table tr:hover td {
	
}



.gridLayout.multipleOption {
	margin:5px 0 0 25%;
	width:240px;
	clear:both;
}

.gridLayout table tr th {
	
}

.gridLayout th.action, .gridLayout td.action {
	width:80px;
	text-align:center;
	vertical-align:middle;
}

.gridLayout th.status, .gridLayout td.status {
	width:80px;
	text-align:center;
	vertical-align:middle;
}



.gridLayout table tr th.options, .gridLayout table tr td.options
 {
	width:90px;
	text-align:center;
}

.gridLayout table tr th.status, .gridLayout table tr td.status {
	width:70px;
	text-align:center;
}

.gridLayout table tr td:first-child,
.gridLayout table tr th:first-child {
	border-left:0px;
}


#footer {
	float:left;
	width:98%;
	padding:10px 1%;
	min-width:900px;
	color:#b3c6d5;
}

#footer p {
	margin:0px;
	padding:0px;
	float:right;
	color:#367db3;
}

#footer p.first {
	float:left;
}

#footer a {
		color:#367db3;
	text-decoration:underline;
}

#footer a:hover {
	text-decoration:none;
}

span.warning {
	display:block;
	padding:1.5%;
	width:97%;
	background:#fff8d8;
	border:solid 1px #f3d97e;
	border-radius:5px;
	color:#a68510;
	line-height:16px;
	float:left;
	margin:0 0 15px 0;
}

span.warning:before {
	content: 'Warning : ';
	font-weight:bold;
	padding:0 5px 0 25px;
	line-height:16px;
	float:left;
	background:url(../images/warning-icon.gif) 0 1px no-repeat;
}


span.succes {
	display:block;
	padding:12px 0px 12px 10px;
	width:100%;
	background:#ebf9e2;
	border:solid 1px #bee4a5;
	border-radius:5px;
	color:#658c2c;
	line-height:16px;
	float:left;
	margin:10px 0 0 0;	 
}

span.succes:before {
	content: 'Success : ';
	font-weight:bold;
	padding:0 5px 0 25px;
	line-height:16px;
	float:left;
	background:url(../images/succes-icon.gif) 0 0 no-repeat;
}


span.information {
	display:block;
	padding:12px 0px 12px 10px;
	width:100%;
	background:#e9f3f8;
	border:solid 1px #bbd7e4;
	border-radius:5px;
	color:#3876c6;	 
 	line-height:16px;
	float:left;
	margin:0 0 15px 0;
}

span.information:before {
	content: 'Information : ';
	font-weight:bold;
	padding:0 5px 0 25px;
	line-height:16px;
	float:left;
	background:url(../images/information-icon.gif) 0 0 no-repeat;
}

span.error {
	
	display: block;
    padding: 12px 0px 12px 10px;
    width: 100%;
    background: #e9f3f8;
    border: solid 1px #bbd7e4;
    border-radius: 5px;
    color: #3876c6;
    line-height: 16px;
    float: left;
    margin: 0 0 15px 0;
}


span.error.small {
	margin:5px 0 0 25%;
	float:left;
	width:230px;
	padding:5px;
}

span.error:before {
	content: 'Error : ';
	font-weight:bold;
	padding:0 5px 0 25px;
		line-height:16px;
	float:left;
	background:url(../images/error-icon.gif) 0 0 no-repeat;
}

.gridLayout a, .formLayout a {
	/*text-decoration:none;
	color:#025a8d;
	padding:0;*/
}

.gridLayout a:hover,
.formLayout a:hover
{
	text-decoration:none;
}

.gridLayout a[title='Edit'], .gridLayout a[title='Delete'], .gridLayout input[title='Update'],.gridLayout a[title='Update'], .gridLayout a[title='Cancel'], .gridLayout a.delete, a.add  {
	padding:0px;
	border:0px;
	width:26px;
	height:26px;
	text-indent:100px;
	overflow:hidden;
	margin:0 3px;
	display:inline-block;	
	vertical-align:top;
}


.gridLayout a[title='Edit'], .gridLayout a[title='Edit']:hover {
	background:url(../images/edit.gif) 0 0 no-repeat;
}

.gridLayout a[title='Delete'], .gridLayout a[title='Delete']:hover, .gridLayout a.delete, .gridLayout a.delete:hover {
	background:url(../images/delete.gif) 0 0 no-repeat;
}

.gridLayout input[title='Update'], .gridLayout input[title='Update']:hover {
	background:url(../images/update.gif) 0 0 no-repeat;
}
.gridLayout a[title='Update'], .gridLayout a[title='Update']:hover {
	background:url(../images/update.gif) 0 0 no-repeat;
}

.gridLayout a[title='Cancel'], .gridLayout a[title='Cancel']:hover {
	background:url(../images/cancel.gif) 0 0 no-repeat;
}

.formLayout a.add, .formLayout a.add:hover {
	text-indent:100px;
	line-height:26px;
	background:url(../images/add.gif) 0 0 no-repeat;
}



.paging table
{
	width:auto;
	float:left;
	background:#fff;
}

.gridLayout table tr.paging table td 
{
	border:0px;
}

.gridLayout table tr.paging table td a, .gridLayout table tr.paging table td span 
{
	border:0px;
	background:#EFF3F8;
	padding:5px;
	line-height:20px;
	padding:0px;
	height:20px;
	width:20px;
	text-align:center;
	float:left;	
}

.gridLayout table tr.paging table td span, .gridLayout table tr.paging table td a:hover  
{
	background:#1a527d;
	color:#fff;
}
.treeView {
	float:left;
	margin-top:7px;
}

.treeView a {
	padding:0px;
	border:0px;
	color:#3C5868;
	/*font-family:Arial,Helvetica,sans-serif;*/
	font-size:14px;
	float:left;
	line-height:25px;
	padding:0 0 0 7px;
}

.treeView a:hover {
	text-decoration:none !important;
	background:none;
	color:#3C5868;
	text-decoration:none;	
}

.treeView input {
	float:left;
	margin:4px 0 0 0;
	width:14px;
	height:14px;
}

.treeviw_7 {
	text-decoration:none  !important;
}


#tabItem
{
	margin: 0;
	float: left;
	width:100%;
	border: 1px solid #CBDAE8;
	background:#fff;
}


.tabs-ul, .tabs-ul li, .tabs-ul li a {
	float:left;	
}

/*.tabs-ul, #tabBtns {
	//min-height: 40px;
	width: 100%;
	//margin: 2% 0 0 0;
	float: left;
	margin: 2% 0 0 0;
}*/

.tabs-ul, #tabBtns {
	width: 100%;
	float: left;
	/*margin: 0 0 0.4rem -1.2rem;*/
	margin: 0 0 0.4rem -.8rem;
	background-color: #ffffff;
	/* border-bottom: 1px solid #e5e5e5; */
	border-radius: 10px !important;
	padding: 7px 15px;
	border: 1px solid #f3f3f3;
	border-radius: 6px !important;
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease; /* Smooth transition for any changes */
}

.tabs-ul 
{
		margin:10px 0 0 0;
		border-bottom: 1px solid #ddd;
}

.tabs-ul li a {
	
	color:#000000;
	text-decoration:none;
	padding:8px 10px;
	margin:0 5px 0 0;
	line-height:28px;
	/*font-size:14px;*/	
	/*border-radius:5px 5px 0 0;*/
	text-transform:capitalize;
}

#tabBtns a {
	float: inline-start;
	color: #344054 !important;
	text-decoration: none;
	padding: 0 2rem;
	/* margin: 4px; */
	border-radius: 5px !important;
	line-height: 3.5rem;
	/* font-size: clamp(13px, 1vw, 15px); */
	background: #E7F7FC;
	text-transform: capitalize;
	/*font-family: "Roboto", sans-serif !important;
	font-weight: lighter !important;*/
	/*font-weight: 500;*/
}

.tabs-ul li a.active{position:relative;
	z-index:1;	
	color:#555;
	background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;

}

#tabBtns a.active {
	position: relative;
	z-index: 1;
	color: #fff !important;
	background-color: #40A8C5;
	/*border: 1px solid #ddd;
	border-bottom-color: transparent;*/
}

.formError .formErrorContent
{
	width:209px !important;
	padding: 2px 10px 2px 20px !important;
}

.welcome-page, .welcome-page p {
	float:left;
	width:100%;
}

.graph-image {
	float:left;
	width:49%;
	border:solid 1px #d9d9d9;
	margin:2% 0 0 0;
}

.graph-image.right {
	float:right;
}

.graph-image img {
	width:100%;
}

.left-text-box {
	float:left;
	width:194px;
	background:#c9e8ff;
	padding:0 0;
	margin:7px;
	text-align:justify;
	line-height:16px;
	border:solid 1px #7ec7ff;
	top:-100%;
}

.help-icon .left-text-box 
{
	width:314px;
	margin:0px;
	position:relative;
}

.help-icon  .left-text-box a.close 
{
	width:25px;
	height:25px;
	line-height:25px;
	text-align:center;
	position:absolute;
	right:0px;
	top:0px;
	-moz-box-shadow:inset 0px 1px 0px #79aace;
	-webkit-box-shadow:inset 0px 1px 0px #79aace;
	box-shadow:inset 0px 1px 0px #79aace;
	
	background: #216396;
	background: -moz-linear-gradient(top,  #428bc3 0%, #216396 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#428bc3), color-stop(100%,#216396));
	background: -webkit-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: -o-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: -ms-linear-gradient(top,  #428bc3 0%,#216396 100%);
	background: linear-gradient(to bottom,  #428bc3 0%,#216396 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#428bc3', endColorstr='#216396',GradientType=0 );
	color:#fff;
	font-weight:bold;
}

.left-text-box h3 
{
	float:left;
	width:180px;
	background:#9cd5ff;
	line-height:26px;		
	padding:0 7px;
	margin:0 0 7px 0;
}
.help-icon  .left-text-box h3 , .help-icon  .left-text-box p 
{
	width:300px;
}

.left-text-box p
{
	padding:0 7px 7px 7px;
	margin:0px;
	float:left;
	width:180px;
}


.help-icon 
{
	height:0px;
	margin:0 20px 0 0;
	width:300px;
	float:right;
}

.help-icon a.click-help 
{
	display:none;
	float:right;
	position:absolute;
	right:10px;
	bottom:-24px;
	padding:0 10px 0 30px;
	line-height:24px;
	color:#fff;
	text-decoration:none;
	font-weight:bold;
	background:url(../images/bg-help.gif) left center no-repeat;
	border-radius:0 0 6px 6px;
}
.help-icon a.click-help:hover {
	box-shadow:0px 0px 4px #fff inset;
}


#iframe-view {
	width: 100%;
	margin: 5px 0 0 -6px;
	max-height: 88vh;
	/*padding: 10px;*/
	/*border-radius: 10px;*/
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	float: left;
	/*border: solid 1px #d9d9d9;*/
	/*height: 78vh;
	scrollbar-width: thin;*/ /* For Firefox scrollbar width */
	/*scrollbar-color: #888 #f1f1f1; /* For Firefox thumb and track colors */
	border: 1px solid #f3f3f3;
	border-radius: 6px !important;
	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
	overflow:hidden !important;
	transition: max-height 0.3s ease; /* Smooth transition for height changes */
}



/* Customize scrollbar styles */
	#iframe-view::-webkit-scrollbar {
		width: 2px !important; /* Adjust width */
		height: 2px !important;
	}

	#iframe-view::-webkit-scrollbar-track {
		background: #ffffff; /* Scrollbar track color */
	}

	#iframe-view::-webkit-scrollbar-thumb {
		background-color: #888; /* Scrollbar thumb color */
		border-radius: 10px; /* Rounded corners */
	}

		#iframe-view::-webkit-scrollbar-thumb:hover {
			background-color: #555; /* Scrollbar thumb hover color */
		}
/*.myIframe {
	height: 96%;
}
*/
.portlet.box.green-haze{ margin-top:5px;}
.active_tab
{
    background: #40A8C5;
    
    color: #ffffff !important;
}
.active_tab:hover
{
    background: #40A8C5 !important;
    
    color: #ffffff !important;
}
.checkbox_custom > input{ width:16px; height:16px;}
.align_right{ text-align:left !important;}
.form_input > input{font-size: clamp(13px, 1vw, 15px);
    font-weight: normal;
    color: #555;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    box-shadow: none;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
   
    line-height: 1.42857143;
   
    background-image: none;
    
    }
    .form_input > textarea{font-size: clamp(13px, 1vw, 15px);
    font-weight: normal;
    color: #555;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    box-shadow: none;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
   
    line-height: 1.42857143;
   
    background-image: none;
    
    }
    .form_input > select{font-size: clamp(13px, 1vw, 15px);
    font-weight: normal;
    color: #555;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    box-shadow: none;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
   
    line-height: 1.42857143;
   
    background-image: none;
    
    }
    .tab-content>.active{ overflow:hidden;}
    .dataTables_wrapper .pull-right{ display:none;}
    .fixed_height{ max-height:360px; overflow-x:hidden; overflow-y:auto;}
    .page-sidebar-menu > li > a.menu{ display:block;}
    #revEmail{ color:#BB8C8C !important;}
    .treeView .checker{ float:left;}
    #lbl_username{ text-transform:capitalize;}
    #ddlWeek{ margin-top:10px;}
    #divMonth > div{margin-top:10px;}
    #divRange > input{margin-top:10px;}
    #divRange > div{margin-top:10px;}
    .form-horizontal .form-group{ margin-left:0px !important;margin-right:0px !important;}
    .form-horizontal .control-label{ text-align:left !important;}
    .pagination>li>a, .pagination>li>span{ line-height:14px !important;}
    .portlet{ box-shadow:none !important;}
   .treeView div div table tr td img{ visibility:hidden;}
   .nav-tabs, .nav-pills{ margin-bottom:0px !important;}
   .border_none{ border:none;
  /*  font-style: italic;*/
}
   .portlet.light{box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.1) !important;}
   .welcome-page .row{ margin-left:0px !important; margin-right:0px !important;}
   h2.welcome_head{padding: 8px 0px 5px 15px;}
   .full_width a{margin: 0px 2px 10px 0px !important;}
   .green.btn:active, .green.btn.active{background:#40A8C5 !important;}
   .padding_bottom{ margin-bottom:0px !important;}
   .padding_none{margin: 12px 0px 10px 0px !important;}
   .width-210{ width:210px !important;}
   .flex_grid tr td .checker{ float:left;}
  
   
body {    
 overflow-x: hidden;
 
}  
.formLayout.tabs{
margin:5px 0 0 15px;
}

.dashboard {
    border: 1px solid;
    background: #fbfbfb;
    border-width: 2px;
    border-radius: 6px;
    border-color: rgb(191, 191, 191);
}

.dashboard_filter {
    background: #fbfbfb;
    padding: 3em;
}


/* Add overflow-y:auto to the element */
#left-menu {
	overflow-y: auto !important;
}

/* Customize scrollbar styles */
::-webkit-scrollbar {
	width: 2px !important; /* Adjust width */
	height:2px !important;
}

::-webkit-scrollbar-track {
	background: #ffffff; /* Scrollbar track color */
}

::-webkit-scrollbar-thumb {
	background-color: #888; /* Scrollbar thumb color */
	border-radius: 10px; /* Rounded corners */
}

::-webkit-scrollbar-thumb:hover {
	background-color: #555; /* Scrollbar thumb hover color */
}


/* Firefox */
* {
	scrollbar-width: thin !important; /* Thin scrollbar */
	scrollbar-color: #c1c1c1 #ffffff !important; /* Scrollbar thumb color and transparent track */
}

/* For Firefox */
#left-menu {
	padding: 0;
	max-height: 81.5vh;
	overflow-y: auto !important;
	/*scrollbar-width: thin;
	scrollbar-color: #c1c1c1 transparent;
	display: flex;
	flex-direction: column;*/
}


#iframe-container {
	width: 100%;
	height: 80vh;
	border: 1px solid #d9d9d9;
	overflow: hidden; /* Hides any overflow */
	position: relative;
	padding: 0.79%;
}

#iframe-wrapper {
	width: 100%;
	height: 100%;
	overflow-y: auto; /* Makes the iframe content scrollable inside this wrapper */
	/*scrollbar-width: thin;*/ /* For Firefox scrollbar width */
	/*scrollbar-color: #888 #f1f1f1;*/ /* For Firefox thumb and track colors */
}

	/* Custom scrollbar styles */
	#iframe-wrapper::-webkit-scrollbar {
		width: 10px;
	}

	#iframe-wrapper::-webkit-scrollbar-track {
		background: #f1f1f1;
	}

	#iframe-wrapper::-webkit-scrollbar-thumb {
		background-color: #888;
		border-radius: 10px;
	}

		#iframe-wrapper::-webkit-scrollbar-thumb:hover {
			background-color: #555;
		}

/*---Photo Galary---*/
#pnlImageZoom.detail {
	background: #fff none repeat scroll 0 0;
	border: 1px solid #ccc;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
	float: none;
	height: auto;
	left: 50% !important;
	margin: auto;
	padding: 12px;
	right: 0 !important;
	text-align: center;
	top: 50% !important;
	transform: translate(-50%, -50%);
	width: auto;
}

	#pnlImageZoom.detail a#btnCancel {
		background: #000 none repeat scroll 0 0;
		color: #fff;
		font-size: 17px;
		font-weight: 600;
		height: 26px;
		line-height: 21px;
		position: absolute;
		right: -12px;
		text-align: center;
		text-decoration: none;
		top: -11px;
		width: 24px;
	}

#updPnl {
	display: inline-block;
	vertical-align: top;
	width: 99%;
}

	#updPnl .selectall {
		background: #364150 none repeat scroll 0 0;
		color: #fff;
		display: inline-block;
		float: right;
		margin-bottom: 14px;
		padding: 6px 14px;
	}

		#updPnl .selectall > input {
			margin-left: 12px;
		}

input#btnExport {
	background: #40a8c5 none repeat scroll 0 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
	color: #fff;
	display: inline-block;
	padding: 7px 12px;
	vertical-align: top;
}

	input#btnExport:hover {
		box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.26);
	}

#updPnl h3 {
	background: #40a8c5 none repeat scroll 0 0;
	color: #fff;
	font-weight: 400;
	margin: 0 0 12px;
	padding: 13px 10px;
	text-transform: uppercase;
}

.gallery_info {
	border-bottom: 1px solid #b4bcc8;
	padding-bottom: 14px;
	margin-bottom: 14px;
	width: 100%;
	clear: both;
}

	.gallery_info table {
		width: 100%;
	}

		.gallery_info table td > div {
			border: 1px solid #ccc;
			padding: 12px;
			position: relative;
			text-align: center;
			cursor: pointer;
			width: 226px;
			box-shadow: 0 0 12px rgba(0, 0, 0, 0.1) inset;
		}

		.gallery_info table td input {
			float: left;
			left: 6px;
			position: absolute;
			top: 0;
		}

	.gallery_info .head {
		font-size: clamp(13px, 1vw, 15px);
		line-height: normal;
		margin-bottom: 20px;
	}

		.gallery_info .head span.row {
			display: block;
			margin: 0 0 8px;
			vertical-align: top;
		}

			.gallery_info .head span.row span.it1 {
				font-weight: 700;
			}

#pnlImageZoom > img {
	width: 90%;
}

#imgZoom {
	/*width: 400px;
	height: 300px;*/
	object-fit: cover;
	overflow: hidden;
	transition: transform 0.2s ease; /* Smooth transition */
}

	#imgZoom:hover {
		transform: scale(1.7); /* Zoom level (adjust as needed) */
		cursor: zoom-in;
	}


/* Style for the panel */
.detail {
	position: fixed; /* Fixed position to overlay content */
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8); /* Semi-transparent background */
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000; /* Ensure it appears above other content */
}

/* Style for the image */
#imgZoom {
	max-width: 90%; /* Adjust size as needed */
	max-height: 80%;
	transition: transform 0.3s ease; /* Smooth zoom transition */
}

	/* Zoom effect on hover */
	#imgZoom:hover {
		transform: scale(1.5); /* Zoom scale */
	}

/* Style for the close button */
.btn-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 30px;
	height: 30px;
	background-color: transparent;
	border: none;
	color: white;
	font-size: 24px;
	cursor: pointer;
	text-align: center;
	line-height: 30px; /* Center the 'X' vertically */
	z-index: 1100; /* Ensure it's above other content */
}

	.btn-close:hover {
		color: #ff0000; /* Change color on hover, if desired */
	}

/* General styles for the navbar */
.navbar {
	margin-bottom: 21px !important;
}

/* Ensure navbar items are displayed in a row */
.navbar-nav {
	flex-direction: row;
	margin-left: -15px; /* Adjust margin for proper alignment */
	margin-right: -15px;
}

/* Style for individual nav items */
.nav-item {
	margin-left: 15px; /* Space between items */
	margin-right: 15px;
}

/* Style for dropdown toggles */
.nav-link.dropdown-toggle {
	padding: 0.5rem 1rem; /* Padding around the text */
	font-size: 1rem; /* Font size for the text */
	color: #333; /* Text color */
}

/* Dropdown menu styles */
.dropdown-menu {
	border-radius: 0.25rem; /* Rounded corners */
	box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075); /* Light shadow */
	margin-top: 0.125rem; /* Margin above the dropdown */
	min-width: 200px; /* Minimum width */
}

/* Dropdown item styles */
.dropdown-item {
	padding: 0.5rem 1rem; /* Padding around each item */
	font-size: 0.875rem; /* Slightly smaller font size */
	color: #333; /* Text color */
}

	.dropdown-item:hover {
		background-color: #f8f9fa; /* Background color on hover */
	}

/* Style for hidden links (if needed) */
.class0, .class1, .class2 { /* Adjust these classes as needed */
	display: none;
}

/* Style adjustments for responsive behavior */
/*@media (max-width: 991px) {
	.navbar-nav {
		flex-direction: column;*/ /* Stack items vertically on smaller screens */
	/*}

	.nav-item {
		margin-left: 0;*/ /* Reset margin for mobile view */
		/*margin-bottom: 10px;*/ /* Add margin below each item */
	/*}

	.dropdown-menu {
		position: static;*/ /* Remove absolute positioning for mobile */
		/*margin: 0;*/ /* Reset margin */
	/*}
}

.navbar-default .navbar-nav > li > a {
	color: #ffffff !important;
	font-weight: bolder;
	font-size: 1.4rem;*/
	/*margin: -0.6rem 0 -0.6rem 0;*/
/*}

.container-fluid {
	background: #0e6ba8;	
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
	color: #555 !important;
	background-color: #bfbfbf !important;
}

.navbar-default .navbar-nav > li > a.active {
	color: #555 !important;
	background-color: #bfbfbf !important;
	padding: 1.5rem 1rem 1rem 1rem;
}*/

.form-control {
	border-radius: 5px !important;
	font-size:14px !important;
	background-color:white !important;
}


span.logo {
	background: #fff none repeat scroll 0 0;
	display: inline-block;
	margin-top: -8px;
	padding: 4px;
	text-align: center;
	vertical-align: top;
}

@media (min-width: 1440px) {
	#left-menu {
		max-height: 89vh; /* Increase the max-height for larger screens */
	}
}

@media (min-width: 1920px) {
	#left-menu {
		max-height: 89vh; /* Further adjust max-height for very large screens */
	}
}

/* Arrow buttons styles */

.scroll-btn {
	position: absolute;
	right: 10px; /* Position the buttons inside the sidebar */
	background-color: #3FD5C0;
	color: white;
	padding: 10px;
	border-radius: 50%;
	font-size: clamp(14px, 1.1vw, 16px);
	cursor: pointer;
	z-index: 10;
	display: none; /* Hidden initially */
}

.scroll-up-btn {
	top: 50px; /* You can adjust this value as needed */
}

.scroll-down-btn {
	bottom: 50px; /* You can adjust this value as needed */
}

.scroll-btn.show {
	display: block; /* Show buttons when appropriate */
}

button {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #3FD5C0;
	color: white;
	padding: 8px 12px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

	button:focus {
		outline: none;
	}


.button-container button:nth-child(n+6) {
	display: none;
}

/* When expanded, show all buttons */
.button-container.show-all button {
	display: inline-block;
}


.responsive-grid {
	width: 100%;
	border-collapse: collapse;
}

	/* Cell padding and alignment */
	.responsive-grid th, .responsive-grid td {
		padding: 10px; /* Additional padding */
		text-align: left;
		border: 1px solid #ddd; /* Border around each cell */
	}

	/* Header styling */
	.responsive-grid th {
		background-color: #f2f2f2;
		font-weight: bold;
	}

/* Optional: Make table fully responsive on mobile */
@media screen and (max-width: 768px) {
	.responsive-grid td, .responsive-grid th {
		display: block;
		width: 100%;
		box-sizing: border-box;
	}

	.responsive-grid tr {
		margin-bottom: 15px;
		display: block;
		border-bottom: 1px solid #ddd;
	}

	.responsive-grid td:before {
		content: attr(data-label);
		font-weight: bold;
		display: inline-block;
		width: 100%;
	}
}


.pb-2 {
	padding-bottom: .5rem !important;
}

.align-items-center {
	align-items: center !important;
}

.justify-content-between {
	justify-content: space-between !important;
}

.border-bottom {
	border-bottom: .5px #dddd solid;
}

.filter-padding {
	padding: 0 2.2rem !important;
}

.fs-bold{
	font-weight:bold
}

/* Group header styling - for grouped menu structure */
.page-sidebar-menu .group-header {
	font-weight: 600;
	cursor: pointer;
}

.page-sidebar-menu .group-header:hover {
	background-color: rgba(64, 168, 197, 0.1);
}

/* Mobile Responsive Header Styles */
@media (max-width: 768px) {
	/* Header adjustments - single line layout */
	.page-header {
		min-height: 60px;
		height: 60px;
		overflow: visible;
	}

	.page-header .page-header-inner {
		padding: 0 8px;
		height: 60px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: nowrap;
	}

	/* Logo adjustments - compact */
	.page-header .page-logo {
		width: auto;
		padding: 8px 5px;
		float: none;
		flex-shrink: 0;
	}

	.page-header .page-logo img {
		max-height: 40px;
		height: 40px;
		width: auto;
		display: block;
	}

	/* Top menu - flex layout for single line */
	.page-header .top-menu {
		margin-right: 0;
		float: none;
		display: flex;
		align-items: center;
		flex-shrink: 0;
	}

	.page-header .top-menu .nav {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		margin: 0;
		float: none;
	}

	.page-header .top-menu .nav > li {
		margin-left: 0;
		margin-right: 2px;
		float: none;
		flex-shrink: 0;
	}

	/* Username - hide text but keep structure */
	.username-hide-on-mobile {
		display: none !important;
	}

	/* Dropdown arrow - smaller */
	.page-header .dropdown-user .fa-angle-down {
		display: inline-block;
		font-size: 12px;
		margin-left: 2px;
	}

	/* Dropdown icons - compact */
	.page-header .top-menu .nav > li > a {
		padding: 20px 8px;
		font-size: 16px;
		display: flex;
		align-items: center;
		white-space: nowrap;
	}

	.page-header .top-menu .nav > li > a > i {
		font-size: 20px;
	}

	/* PPMS Logo in header - compact */
	.page-header .top-menu .logo {
		padding: 4px 6px;
		margin-top: -8px;
		background: #fff;
		flex-shrink: 0;
	}

	.page-header .top-menu .logo img {
		height: 28px;
		width: auto;
		display: block;
	}

	/* Dropdown menu adjustments */
	.page-header .dropdown-menu {
		right: 0;
		left: auto;
		min-width: 200px;
	}

	/* Responsive menu toggler */
	.page-header .menu-toggler.responsive-toggler {
		margin-right: 8px;
		padding: 20px 10px;
		flex-shrink: 0;
	}

	/* Sidebar adjustments */
	.page-sidebar-wrapper {
		margin-top: 60px;
	}

	.page-content-wrapper {
		margin-top: 60px;
	}

	/* Page content adjustments */
	.page-content {
		min-height: calc(100vh - 60px);
	}
}

@media (max-width: 480px) {
	/* Small mobile - ultra compact single line */
	.page-header {
		min-height: 55px;
		height: 55px;
	}

	.page-header .page-header-inner {
		height: 55px;
		padding: 0 5px;
	}

	.page-header .page-logo {
		padding: 6px 3px;
	}

	.page-header .page-logo img {
		max-height: 36px;
		height: 36px;
	}

	.page-header .top-menu .nav > li {
		margin-right: 1px;
	}

	.page-header .top-menu .nav > li > a {
		padding: 18px 6px;
		font-size: 14px;
	}

	.page-header .top-menu .nav > li > a > i {
		font-size: 18px;
	}

	.page-header .top-menu .logo {
		padding: 1rem 1px;
	}

	.page-header .top-menu .logo img {
		height: 24px;
	}

	.page-header .menu-toggler.responsive-toggler {
		padding: 18px 8px;
		margin-right: 5px;
	}

	/* Adjust content for header */
	.page-sidebar-wrapper {
		margin-top: 0px;
	}

	.page-content-wrapper {
		margin-top: 0px;
	}

	.page-content {
		min-height: calc(100vh - 55px);
	}

	.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-toggle:hover {
        background-color: #ffffff !important;
    }

	.page-header.navbar .top-menu {
        background-color: #ffffff !important;
    }

	.page-header.navbar .top-menu .navbar-nav {        
        margin: 0 !important;
    }

	.page-header.navbar .top-menu .navbar-nav > li.dropdown{
		background-color: #ffffff !important;	
	}
}