* {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
html {height: 100%;scroll-behavior: smooth;}
body {  
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px; color: #000000;
	background-color: #FFFFFF;
	overflow-x:hidden;
	overflow-y: hidden;
	margin:0px;
	height:100%;
}

/*Added by TYL 26/6/2019*/
::selection {
  color: #0c0c0c;
  background: #d9d9d9;
}

option:hover {
	background:#d9d9d9;	
}

select.decorated option:hover{
	background:#d9d9d9;
	box-shadow: 0 0 10px 100px #d9d9d9 inset;
}

select option:checked{
	background:#d9d9d9;
}

.titleBar { 
	font-size: 16px;
	background-position: left top ;
	font-weight: bold; height: 20px;
	color: #FFFFFF;
	background-color: #7698B3;
	background-color:#2c3e50;
	xbackground-image: url('img/bar_img/lightblue.jpg');
	background-repeat: repeat-x; 
	padding-left:5px;
	padding-right:5px;
	padding-top:3px;
	padding-bottom:3px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height:30px;
	/*line-height : 24px;*/
}
.titleBarGrandSub { 
	font-size: 14px;
	background-position: left top ;
	font-weight: bold; height: 20px;
	color: #FFFFFF;
	background-color: #7698B3;
	background-color:#2c3e50;
	xbackground-image: url('img/bar_img/lightblue.jpg');
	background-repeat: repeat-x; 
	padding-left:2px;
	padding-right:2px;
	padding-top:3px;
	padding-bottom:3px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height:45px;
}
.headerBar { 
	font-size: 10px;
	background-position: left top ;
	font-weight: bold;
	height: 20px;
	color: #000000;
	background-image: url('JMTree/ThemeXP/header.png');
	background-repeat: repeat-x;
	padding-left:5;
	padding-right:5;
	padding-top:3;
	padding-bottom:3;
}
.Findbutton {
  background-color: #bf1e2e; /* red */
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  padding: 6px 24px;
  outline: none;
  font-weight: bold;
}

.Findbutton:active{
	background-color: #dd2235;
	xopacity: 1.0;
	xbox-shadow: 0 5px #666;
	font-weight: bold;
}

.searchPivot {
  background-color: #cccccc; /* Blue background */
  border: none; /* Remove borders */
  color: white; /* White text */
  padding: 8px; /* Some padding */
  cursor: pointer; /* Mouse pointer on hover */
  vertical-align: middle;
}

.button { 
	background-color: #dddddd; /*#B2C6EC*/
	color: #333333; /*#000000*/
	padding:2.5px 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	cursor: pointer;
	font-weight: bold;
	xheight: 16px ;
	text-align: center; 
	xborder: #002D96; 
	border: 1px solid #aaaaaa; 
	xborder-top-width: 1px; 
	xborder-right-width: 1px; 
	xborder-bottom-width: 1px; 
	xborder-left-width: 1px;
	xborder-radius:2.5px;
}

/*Added by TYL (19/6/2019)*/
.button:active {
	background-color: #bf1e2e;
	color: #FFFFFF;
	font-weight: bold;
	
}

.button:disabled { 
	background-color: #b3b3b3; 
	color: #A0A0A0; padding:2.5px 10px; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px; cursor: pointer; 
	font-weight: bold; 
	/*height: 16px ;*/ 
	text-align: center; 
	border: #002D96; 
	border-style: outset; 
	border-top-width: 1px; 
	border-right-width: 1px; 
	border-bottom-width: 1px; 
	border-left-width: 1px;
	xborder-radius:2.5px;
}

/*Added by TYL (21/6/2019)*/
.button:focus {outline:0;} /*To remove the blue outline (for Chrome) when click*/


.button1 { 
	background-color: #2c3e50; 
	width: 85px;
	/*color: #000000; */
	xpadding:0px 5px; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 16px; cursor: pointer;
	color: #FFFFFF;
	font-weight: bold; height: 23px ; 
	text-align: center; border: #002d96; 
	border-style: outset; border-top-width: 1px; 
	border-right-width: 1px; 
	border-bottom-width: 1px; 
	border-left-width: 1px
}

.bdrStyle {  
	border: 1px solid; 
	white-space: nowrap; 
	border-color: #2c3e50 #2c3e50 #2c3e50 #2c3e50 
}
.bgColor2 {  
	background-color: #FFFFFF; /*#7698B3*/
	xbackground-color: #6699cc; 
	color: #FFFFFF
}
.tFont { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	xfont-size: 10px; color: #000000;
}
.MainPanelBg { 
	border: solid;
	border-width: 0px 1px;
	xborder-color: #ffffff #002d96 #000000 #002d96
	border-color: #ffffff #cccccc #000000 #cccccc
}
.buttonColl { 
	background:url(img/knowledgebase/overlay.png) repeat-x center ;		
	color: #ffffff; 
	padding:0px 5px; 
	font-family: sans-serif; 
	font-size: 11px; 
	cursor: pointer; 	
	height: 20px ; 
	text-align: center; 
	border: #f0f0f0; 
	border-style: outset; 
	border-top-width: 0px; 
	border-right-width: 0px; 
	border-bottom-width: 0px; 
	border-left-width: 0px
	}
.buttonPost{
	background:url(img/knowledgebase/overlay.png) repeat-x center #3399FF;	
	color: #ffffff; 
	padding:0px 5px; 
	font-family: sans-serif; 
	font-weight: bold;
	font-size: 13px; 
	cursor: pointer; 	
	height: 20px ; 
	text-align: center; 
	border: #f0f0f0; 
	border-style: outset; 
	border-top-width: 0px; 
	border-right-width: 0px; 
	border-bottom-width: 0px; 
	border-left-width: 0px
	}
.titleBarColl { 
	font-size: 12px; 
	background-position: left top ; 
	font-weight: bold; 
	height: 25px; 
	color: #ffffff; 
	background:url(img/knowledgebase/overlay.png) repeat-x center #e6e6fa;	
	padding-left:5; 
	padding-right:5; 
	padding-top:3; 
	padding-bottom:3;
}	
.collHdr{
	color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 2px;
	padding-left: 15px;
	padding-right: 2px;
	padding-top: 2px;
	background-image: url(img/bar_img/menu_bg.jpg)
	}
.unselectable {
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}	
.LowerPanelBg { border-color: #002d96 #002d96 black #002d96; background-color: #FFFFFF; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
.UpperPanelBg { border-left:0px solid black; border-right:0px solid black; border-top:0px solid black; border-bottom:0px solid #000000; background-image: url('img/bar_img/top_bar.gif');background-repeat: no-repeat}
/*.LeftPanelBg {filter: DropShadow(Color=#CCCCCC, OffX=5, OffY=5, Positive=no);border-style: none;background-color: #FFFFFF?, OffX=?, OffY=?, Positive=?)} */ /*ori*/
.LeftPanelBg {filter: DropShadow(Color=#CCCCCC, OffX=5, OffY=5, Positive=no);border-style: none;background-color: #FFFFFF} /*changed to this from above line - Joseph 8/9/2014*/
.txtField { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; width: 150px; border: #CCCCCC; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px;xborder-radius: 2px;outline-color:#808080}
select { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;border:1px solid #CCCCCC;outline-color:#808080}
.mainTitleBar { font-size: 10px; color: #000000; border: 1px solid #002d96; background-color: #990000; background-image: url('img/bg3/bg1.jpg'); font-weight: bold}
table {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; background-position: left top}
textarea { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; border: #CCCCCC; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; outline-color: #808080}
.mainLogo {  background-image: url('url(img/speedminerlogo(small'); background-repeat: no-repeat}

.thickLineAbove {  border-color: #006699 #002d96 #002d96 #002d96; font-size: 14px; color: #000000; border-style: solid; border-top-width: 0px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 0px}
.NoUnderLine {  text-decoration: none; font-style: normal}
.overFlow { overflow:auto; height:100%; width:100%;}
.dropShadow {  filter: Shadow(Color=#002d96, Direction=135)}
.submtBtn {  font-size: 9px; height: 18px}
.cellPadding5 {  padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px}
.NoUnderLineBlkHdr { font-size: 16px; text-decoration: none; font-style: normal; font-weight: bold ; cursor: pointer}
.abPos {  position: absolute; height: 0px; width: 0px; left: 0px; top: 0px;}
.frameETL {border-style: solid; border-color: lightblue; border-width: 0.002cm;}
.labelETL {position: relative; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;left: 10; top: -10; background-color:#FFFFFF}
.menStyle {  background-color: #FFFFFF;  clip:  rect(   ); text-align: center; border-style: outset; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; cursor: default; filter: BlendTrans(Duration=0.3); white-space: nowrap}
.menHiStyle {  color: #FFFFFF; background-color: #0033CC; text-decoration: underline}

/**
*	Added for custom scrollbar Akmal 16042019
*/
/* Strictly can use for Chrome only*/
.scrlbar{
	max-height:100%;
	overflow-y:scroll;
	overflow-x:unset;
}

.scrlbar::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 3px;
	background-color: #F5F5F5;
}
.scrlbar::-webkit-scrollbar-track:hover
{
	background-color: #dbdbdb;
}
.scrlbar::-webkit-scrollbar
{
	width: 5px;
	height: 5px; /* height: 0px;	Ori, Test by Akmal 02/10/2019 */
	background-color: #F5F5F5;
}

.scrlbar::-webkit-scrollbar-thumb
{
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #888;
}
.scrlbar::-webkit-scrollbar-thumb:hover
{
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #555;
}
.scrlbar::-webkit-scrollbar-thumb:active
{
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #333;
}
/**/

/**
*	Added for custom scrolling using buttons/images Akmal 18042019
*/
.fixedBtnUp{
	position: fixed;
	top: 0px;
	background-color: white;
	padding-top: 7px;
	padding-bottom: 7px;	
	border: 0.3px solid; 
	white-space: nowrap; 
	border-color: rgb(106, 140, 203) white white rgb(106, 140, 203)

}
.fixedBtnDown{
	position: fixed;
	bottom: 0px;
	background-color: white;
	padding-top: 7px;
	padding-bottom: 7px;
	border: 0.3px solid; 
	white-space: nowrap; 
	border-color: white white rgb(106, 140, 203) rgb(106, 140, 203)

}
.fixedBtnUp:hover{
	background-color: #d2ddef;
	border: 0px solid; 	
}
.fixedBtnDown:hover{
	background-color: #d2ddef;	
	border: 0px solid; 
}
.fixedBtnUp:active{
	background-color: #a1b8de;
	border: 0px solid; 	
}
.fixedBtnDown:active{
	background-color: #a1b8de;	
	border: 0px solid; 
}
span.clear { 
	clear: left; 
	display: block; 
}
/**/
.menInStyle {  
	position: absolute; 
	clip:   rect(   ); 
		
	height: 0px;
	width: 0px; 
	left: 0px; 
	top: 0px; 
	filter: BlendTrans(Duration=0.3); 
	white-space: nowrap;  

	border-style: solid; 
	border-top-width: 1px; 
	border-right-width: 1px; 
	border-bottom-width: 1px; 
	border-left-width: 1px;	
}

.menInStyle2 {  position: absolute; clip:   rect(   ); visibility: hidden; color: #FFFFFF; height: 0px; width: 0px; left: 0px; top: 0px}
.menInStyle1 { position: relative; clip: rect( ) ; background-color: #FFFFFF; filter: BlendTrans(Duration=0.3); padding-right: 4px; padding-left: 4px; cursor: default}
.opac {  filter: Alpha(Opacity=30); background-color: #666666}

.imgMenu	{cursor:pointer;padding:1px 2px;border:none;/*background-color:*/}
.imgMenu2	{padding:0px 1px;border:1px solid #ffffff;cursor:pointer;/*background-color:*/}
.imgMenu3	{padding:0px 1px;border:1px solid #ffffff;background:url(img/drop_down_bg.gif)}
.separator	{padding:0px 6px}
/*this part onwards is for menu by Jacob 27/4/2009*/
/*3rd December 2014 - remove color:#fffff for menu_titleBar,menu_main,menu_over,menu_click to follow theme*/
.menu_titleBar {background-image:url('img/bar_img/d_bar.gif');background-repeat:repeat-x;height:24px;border-collapse:collapse}
.menu_main {white-space: nowrap;text-align:center;cursor:pointer;padding-left:10px;padding-right:10px;border: 1px solid transparent;border-right:none}
.menu_over {white-space: nowrap;text-align:center;cursor:pointer;padding-left:10px;padding-right:10px;border-top:1px solid #ffffff;border-left:1px solid #ffffff;border-bottom:1px solid #000000;border-right:1px solid #000000}
.menu_click{white-space: nowrap;text-align:center;cursor:pointer;padding-left:10px;padding-right:10px;border-top:1px solid #000000;border-left:1px solid #000000;border-bottom:1px solid #ffffff;border-right:1px solid #ffffff}
.menu_sub {border-collapse:collapse}
.menu_sub .m1 {height:22px;width:20px;text-align:center}
.menu_sub .m2 {height:22px;cursor:default}
.menu_sub .m3 {height:22px;padding-left:10px;padding-right:10px;cursor:default}
.menu_sub .hr {height:22px;font-size:1px}

/**
*	Added for responsive div Akmal 24042019
*/
.container{
 	width:100%;
 	padding-right:15px;
 	padding-left:15px;
 	margin-right:auto;
 	margin-left:auto
}
 @media (min-width:576px){
 	.container{
 		max-width:540px
 	}
 }
 @media (min-width:768px){
 	.container{
 		max-width:720px
 	}
 }
 @media (min-width:992px){
 	.container{
 		max-width:960px
 	}
 }
 @media (min-width:1200px){
 	.container{
 		max-width:1140px
 	}
 }
 .container-fluid{
 	width:100%;
 	padding-right:15px;
 	padding-left:15px;
 	margin-right:auto;
 	margin-left:auto
 }
.row{
 	display:-webkit-box;
 	display:-ms-flexbox;
 	display:flex;
 	-ms-flex-wrap:wrap;
 	flex-wrap:wrap;
 	margin-right:-15px;
 	margin-left:-15px
 }
.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto,.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{
 	position:relative;
 	width:100%;
 	min-height:1px;
 	padding-right:15px;
 	padding-left:15px
 }
 .dropbtn {
  background-color: white;
  color: black;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  right: 0;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #efefef;}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #efefef;
}
/*Added by Akmal for navPanel beside Speedminer logo bgcolor 30/4/2019*/
.navPanelCSS{
	background-Color:#f5f5f5;
	color:black;	
}
.navPanelCSS:hover{
	background-Color:#CCCCCC;
	color:black;	
}
.navPanelCSST{
	/*Wilson 15JUl2019 - added to help the onmouseover event*/
	background-Color:transparent;
}

/*Added by TYL 14/6/2019*/
.DLButton {
	position: absolute;
	background-color: #b3b3b3;
	xopacity: 0.8;
	bottom: 20px;
	width: 85px;
	height: 25px;
	xborder-radius: 5px;	
}

.DLButton:active{
	background-color: #bf1e2e;
	xopacity: 1.0;
	xbox-shadow: 0 5px #666;
	color: #FFFFFF;
}

.DLBtn{
	text-align: center;
	font-size: 14px;
    font-weight: bold;
	height:15px;
	font-family: Arial, sans-serif;
	padding-top:5px;
	padding-bottom:10px;
	display:block;
}

.TtlStyle {
	width:100%;
	height:10%;
	font-size: large;
    font-weight: bolder;
    text-align: center;
    vertical-align: middle;
    color:#FFFFFF;
    background-color: #bf1e2e;
    padding-top: 10px;
    padding-bottom: 10px;
}

/*mod to remove rounded corner button*/
.DLButton2 {
	position: absolute;
	background-color: #b3b3b3;
	xopacity: 0.8;
	bottom: 20px;
	width: 85px;
	height: 25px;
	/*border-radius: 0px;	*/
}

.DLButton2:active{
	background-color: #bf1e2e;
	xopacity: 1.0;
	xbox-shadow: 0 5px #666;
	color: #FFFFFF;
}

.tableCust{
	border-color:#ECECEC;border-width:1px;border-style:solid;
}
.tableCustHead {
	/*background-image:none;background-color:#ECECEC;color:#ECECEC;*/
	border-color:#ECECEC;border-width:1px;border-style:solid;
}

/*RADIO BUTTON*/ /*Added by TYL*/
/* The container for the radio button*/
.containerRadio {
  display: inline;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.containerRadio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmarkRadio {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.containerRadio:hover input ~ .checkmarkRadio {
  background-color: #ccc;
}

/* When the radio button is checked, add a red background */
.containerRadio input:checked ~ .checkmarkRadio {
  background-color: #bf1e2e;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmarkRadio:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.containerRadio input:checked ~ .checkmarkRadio:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.containerRadio .checkmarkRadio:after {
 	top: 7px; 
	left: 7px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: white;
}

/*CHECKBOX*/ /*Added by TYL*/
/* The container for the Checkbox */
.containerChkbx {
  display: inline;
  position: relative;
  padding-left: 18px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.containerChkbx input {
  position: absolute;
  opacity: 0;
  xcursor: pointer;
  height: 0;
  width: 0;
}

/*.containerChkbx:disabled {
	cursor: default;
}

.containerChkbx input:disabled {
	cursor: default;
}*/

/* Create a custom checkbox */
.checkmarkChkbx{
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #ffffff;
  xborder-radius:2px;
  border: 1px solid #b3b3b3;
}

/* On mouse-over, add a grey background color */
.containerChkbx:hover input ~ .checkmarkChkbx {
  background-color: #b3b3b3; /*#a6a6a6*/
  border: 1px solid #b3b3b3;
}

/* When the checkbox is checked, add a red background */
.containerChkbx input:checked ~ .checkmarkChkbx {
  background-color: #bf1e2e;
  border: 1px solid #bf1e2e;
}

/* When the checkbox is checked and disabled, add a lighter red background */
.containerChkbx input:checked:disabled ~ .checkmarkChkbx {
  background-color: #ee919a;
  border: 1px solid #ee919a;
  cursor: default;
}

/* When the checkbox is disabled, add a lighter grey background */
.containerChkbx input:disabled ~ .checkmarkChkbx {
  background-color: #e6e6e6; /*#e6e6e6*/
  border: 1px solid #e6e6e6;
  cursor: default;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmarkChkbx:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.containerChkbx input:checked ~ .checkmarkChkbx:after {
  display: block;
}

/* Style the checkmark/indicator */
.containerChkbx .checkmarkChkbx:after {
  left: 5px;
  top: 2px;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Style the close button (span) */
.deleteNodes {
  cursor: pointer;
  float: right;
}
/*.deleteNodes {
  cursor: pointer;
  position: absolute;
  right: 0%;
  padding: 12px 16px;
  transform: translate(0%, -30%);
} Changed by Akmal 15/08/2019 [to make it scrollable] */
/**/

/*faiz*/
.smallIcon {
  cursor: pointer; 
  height: 13px; 
  width: 13px;
}

 /**
 **/
