/* Layout Warna ------------------------------------------------------------------------------------------------------------------------------ */
.saturate {-webkit-filter:saturate(3);}
.grayscale {-webkit-filter:grayscale(100%);}
.contrast {-webkit-filter:contrast(160%);}
.brightness {-webkit-filter:brightness(0.25);}
.blur {-webkit-filter:blur(3px);}
.invert {-webkit-filter:invert(100%);}
.sepia {-webkit-filter:sepia(100%);}
.huerotate {-webkit-filter:hue-rotate(180deg);}
.rss.opacity {-webkit-filter:opacity(50%);}
.b-black{background-color:#000 !important; }
.bold{font-weight: bold !important; }

/* Layout Apps ------------------------------------------------------------------------------------------------------------------------------ */
.canvas-captcha{
    height:61px !important;
    border-radius: 3px;
    -ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    -o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    border: 1px solid #c8c8c8;
    color: #777;
    margin: 0 0 5px;
    width: 100%;
    overflow:hidden;
    position:relative;
}
.btn-rf-cptch{
    position:absolute !important;
    right:2px !important;
    bottom:2px !important;
}
.view-pwd{
	font-size:1.4em !important;
    position:absolute !important;
    right:10px !important;
    top:3px !important;
}
.view-pwd:hover{
	cursor:pointer;
}
.modal-header{
    background-color:#424242;
    color:#FFFFFF;
}
.modal-header .close {
    margin-top: 2px;
    color:#FFF;
    opacity:1;
}
.full-width{ width:100% !important; }
.full-relative{
	width:100% !important;	
	height:100% !important;	
	position:relative !important;
}
.x_result{ padding-bottom:60px !important; }

.w-20{ width:20px !important; }
.w-80{ width:80px !important; }
.w-150{ width:150px !important; }
.m-t-5{ margin-top:5px !important; }
.m-t-24{ margin-top:24px !important; }
.m-r-5{ margin-right:5px !important; }
.m-r-15{ margin-right:15px !important; }
.m-b-5{ margin-bottom:5px !important; }
.m-b-10{ margin-bottom:10px !important; }
.m-b-20{ margin-bottom:20px !important; }
.p-t-0{ padding-top:0 !important; }
.p-t-8{ padding-top:8px !important; }
.p-r-20{ padding-right:20px !important; }
.p-l-20{ padding-left:20px !important; }
.p-l-10{ padding-left:10px !important; }
.p-tb-10{ padding-top:10px !important; padding-bottom:10px !important; }
.table-st{ font-size:10px !important; text-align: center !important; }
.bg-1{ background-color: #454545; color: #FFF; }
.bg-2{ background-color :#64ffda; }

.toggle-hidden{ display: none !important; }
.toggle-show{ display:block !important;  }

.valign-m{ vertical-align: middle !important; }

.loader-container{
	display:none;
	position:fixed;
	z-index:999999999; /* 999999999 */
	top:0;
	left:0;
	width:100%;
	min-height:100%;
}
.loader-overlay{
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	background:#454545;
	opacity:0.4;
}
.loader-content{
	position:absolute;
	z-index:2;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.loader-frame{
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	margin:auto;
	width:380px;
	height:94px;
	border-radius:5px;
	background:#FFF;
	box-shadow:  0px 3px 5px 0px rgba(6, 6, 6, 0.4);
	padding:20px;
}
.loader-img{
	float:left;	
}
@media only screen and (max-width:640px) {
	.loader-frame{
		width:calc(100% - 40px);
	}
}
.loader-text{
	float:left;
	padding-left:20px;
	line-height:55px;
	vertical-align:middle;
	font-size:0.9em;
}

.logo-login{
	width:50%;
	height:auto;
}
.logo-nav{
	width:38px;
	height:33x;
}
.form-label{
	padding-top:8px;
	padding-left:0;
	margin-bottom:0;
	text-align:left;
}
.table-noborder > tbody > tr > td {
	border: 0 solid #FFF;
	padding: 0;
}
.table-pdf-th{
	padding: 5px !important;
	background:#214A9C !important;
	color:#FFF !important;
	font-weight: bold !important;
	border: 1px solid #DDD !important;
}
.table-pdf-td{
	padding: 5px !important;
	border: 1px solid #DDD !important;
}
.pd-left-0{
	padding-left:0 !important;
}

/* Autocomplete Component --------------------------------------------------------------------------------------------------------------------------- */
.ui-autocomplete { 
	position: absolute;
	cursor: pointer;
	background:#EAEAEA;
	border:2px #212121 solid;
}   
.ui-autocomplete { width:1px; }
.ui-menu {
    list-style:none;
    padding: 2px;
    margin: 0;
    display:block;
    float: left;
}
.ui-menu .ui-menu {
    margin-top: -3px;
}
.ui-menu .ui-menu-item {
	font-size:12px;
	font-family:Raleway;
    margin:0;
    padding: 0;
    zoom: 1;
    float: left;
    clear: left;
    width: 100%;
	color:#212121;
}
.ui-menu-item a{
	color:#000 !important;
}
.ui-menu-item a:hover{
	color:#FFF !important;
	background:#212121 !important;
}
.ui-menu .ui-menu-item a {
    text-decoration:none;
    display:block;
    padding:.2em .4em;
    line-height:1.5;
    zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
    font-weight: normal;
    margin: -1px;
}
.ui-helper-hidden-accessible { display:none; }
#toast-container {
  top: auto !important;
  left: auto !important;
  bottom: 20px;
  right:20px;
}