/** OVERIDE BOOTSTRAP COMPONENT **/
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}
html, body {
  height: 100%;
  background-color: #DCDCDC !important;
  font-family: Verdana, 'Open Sans', sans-serif;
  font-size: 11px !important;
  outline: none !important;
}
hr.dash {
  border: thin dashed #aaa !important;
  margin: 5px !important;
}
hr.minisolid{
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
  margin: 12px 50px !important;
}
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -60px;
  padding: 0 0 60px;
}
@media {
  #wrap > .container {
    padding: 20px 15px 0;
  }
}
#footer {
  background-color: #FFF;
  border-top: 1px solid rgba(0, 0, 0, 0.03);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) inset, 0 -1px 0 rgba(255, 255, 255, 0.25);
  margin-top: 50px;
}
#footer > .container {
  padding-left: 15px;
  padding-right: 15px;
}
.form-control {
  border-radius: 0px !important;
}
noscript {
  position: fixed;
  z-index: 10000;
  width: 100%;
}
#loading_panel {
  background-color: #EEE;
  padding: 10px;
  position: fixed;
  bottom: 50%;
  z-index: 10000;
  display: none;
  text-align: center;
}
#loading-overlay-layer {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 98;
  color: #eee;
  z-index: 1041;
}
.scroll_top > a {
  color: #fff;
}
.scroll_top {
  background-color: rgba(0, 0, 0, 0.14);
  bottom: 50%;
  color: #000 !important;
  display: none;
  font-size: 26px;
  height: 51px;
  right: 0px;
  padding: 6px 5px 5px 1px;
  position: fixed;
  text-align: center;
  vertical-align: middle !important;
  width: 51px;
  z-index: 9999;
}
.navbar {
  border-radius: 0px;
  margin-bottom: 0px !important;
  border: none !important;
}
.navbar-default {
  background-color: #FFF !important;
}
.navbar-brand {
  border-right: thin solid #CCC;
}
.navbar-brand img {
  margin-top: -12px;
  margin-right: 5px;
}
.dropdown-menu {
  font-size: inherit !important;
}
.progress{
  background-color: #ddd !important;
}
#footer {
  background-color: #FFF;
  border-top: 1px solid rgba(0, 0, 0, 0.03);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) inset, 0 -1px 0 rgba(255, 255, 255, 0.25);
  margin-top: 50px;
}
#footer > .container {
  padding-left: 15px;
  padding-right: 15px;
}
.container {
    max-width: 1194px !important;
}
.credit {
    margin: 20px 0;
}
.content_banner-search{
  padding: 15px 20px;
  background-color: rgba(66, 67, 88, 1);
  z-index: 999;
}
.content_banner-header{
  /*
  background-image: url(../img/component/background/4.svg);
  background-position: -116px -532px;
  background-repeat: no-repeat;
  color: #FFF;
  */
  font-size: 90%;
  position: relative;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  background-color: #269888;
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
  height: 250px;
}
.content_banner-header h3{
  text-align: left;
  color: #FFF !important;
  font-size: 250%;
  font-weight: bold;
}
.form-control:focus {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

/** RSHS DESIGN **/
.deep_container{
  top: -160px;
  z-index: 900 !important;
  position: relative;
}

@media print{
  .deep_container{
    top: 5px !important;
  }
  .panel{
    border: none !important;
  }
  .panel-body{
    padding: 2px !important;
  }
  .rocketchat-widget{
    display: none !important;
  }
}

/** FONTASI **/
.fnt45 {
  font-size: 45px !important;
}
.fnt25 {
  font-size: 25px !important;
}
.fnt20{
  font-size: 20px !important;
}
.fnt19{
  font-size: 19px !important;
}
.fnt18 {
  font-size: 25px !important;
}
.fnt16 {
  font-size: 16px !important;
}
.fnt15 {
  font-size: 15px !important;
}
.fnt14 {
  font-size: 14px !important;
}
.fnt13 {
  font-size: 13px !important;
}
.fnt12 {
  font-size: 12px !important;
}
.fnt11 {
  font-size: 11px !important;
}
.fnt10 {
  font-size: 10px !important;
}
.fnt9 {
  font-size: 9px !important;
}
.fnt8 {
  font-size: 8px !important;
}
.align_center {
  text-align: center;
}
.align_left {
  text-align: left;
}
.align_right {
  text-align: right;
}
/** HEIGHT **/
.h60{
  height: 60px !important;
}
.h100{
  height: 100px !important;
}

/** WIDTH **/
.wid5{
  width: 5px !important;
  white-space: normal !important;
}
.wid10{
  width: 10px !important;
  white-space: normal !important;
}
.wid20{
  width: 20px !important;
  white-space: normal !important;
}
.wid25{
  width: 25px !important;
  white-space: normal !important;
}
.wid30{
  width: 30px !important;
  white-space: normal !important;
}
.wid35{
  width: 35px !important;
  white-space: normal !important;
}
.wid40{
  width: 40px !important;
  white-space: normal !important;
}
.wid45{
  width: 45px !important;
  white-space: normal !important;
}
.wid50{
  width: 50px !important;
  white-space: normal !important;
}
.wid55{
  width: 55px !important;
  white-space: normal !important;
}
.wid60{
  width: 20px !important;
  white-space: normal !important;
}
.wid65{
  width: 65px !important;
  white-space: normal !important;
}
.wid70{
  width: 70px !important;
  white-space: normal !important;
}
.wid75{
  width: 75px !important;
  white-space: normal !important;
}
.wid80{
  width: 80px !important;
  white-space: normal !important;
}
.wid85{
  width: 85px !important;
  white-space: normal !important;
}
.wid90{
  width: 90px !important;
  white-space: normal !important;
}
.wid95{
  width: 95px !important;
  white-space: normal !important;
}
.wid100{
  width: 100px !important;
  white-space: normal !important;
}
.wid105{
  width: 105px !important;
  white-space: normal !important;
}
.wid110{
  width: 110px !important;
  white-space: normal !important;
}
.wid115{
  width: 115px !important;
  white-space: normal !important;
}
.wid120{
  width: 120px !important;
  white-space: normal !important;
}
.wid125{
  width: 125px !important;
  white-space: normal !important;
}
.wid130{
  width: 130px !important;
  white-space: normal !important;
}
.wid135{
  width: 135px !important;
  white-space: normal !important;
}
.wid140{
  width: 140px !important;
  white-space: normal !important;
}
.wid145{
  width: 145px !important;
  white-space: normal !important;
}
.wid150{
  width: 150px !important;
  white-space: normal !important;
}
.wid200{
  width: 200px !important;
  white-space: normal !important;
}
.wid300{
  width: 300px !important;
  white-space: normal !important;
}
.wid400{
  width: 400px !important;
  white-space: normal !important;
}
.wid410{
  width: 410px !important;
  white-space: normal !important;
}
.wid420{
  width: 420px !important;
  white-space: normal !important;
}
.wid430{
  width: 430px !important;
  white-space: normal !important;
}
.wid440{
  width: 440px !important;
  white-space: normal !important;
}
.wid450{
  width: 450px !important;
  white-space: normal !important;
}
.wid460{
  width: 460px !important;
  white-space: normal !important;
}
.wid470{
  width: 470px !important;
  white-space: normal !important;
}
.wid480{
  width: 480px !important;
  white-space: normal !important;
}
.wid490{
  width: 490px !important;
  white-space: normal !important;
}
.wid500{
  width: 500px !important;
  white-space: normal !important;
}
.wid600{
  width: 600px !important;
  white-space: normal !important;
}
.wid700{
  width: 700px !important;
  white-space: normal !important;
}

@media (min-width: 456px){
  .wid800{
    width: 300px !important;
    white-space: normal !important;
  }
}

@media (min-width: 768px){
  .wid800{
    width: 300px !important;
    white-space: normal !important;
  }
}

@media (min-width: 992px){
  .wid800{
    width: 400px !important;
    white-space: normal !important;
  }
}

@media (min-width: 1200px){
  .wid800{
    width: 800px !important;
    white-space: normal !important;
  }
}

/** COLOR **/
.clr-blue500{
  color: #03A9F4 !important;
}
.clr-red500{
  color: #F44336 !important;
}

/** BORDER **/
.brdrbtm-only{
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}

/** PADDING & MARGIN **/
.pd5{
    padding: 3px 5px !important;
}
.pd10 {
  padding: 10px !important;
}
.pd20 {
  padding: 20px !important;
}
.pdcustom5010{
  padding: 50px 10px 5px 10px
}
.pdcustom3010{
  padding: 30px 10px 10px 10px
}
.mrgbt0{
  margin-bottom: 0px !important;
}
.mrgbt-5{
  margin-bottom: -5px !important;
}
.mrgbt30{
  margin-bottom: 30px !important;
}
.mrgtp-5{
  margin-top: -5px !important;
}
.mrgtp-10{
  margin-top: -10px !important;
}
.mrgtp10{
  margin-top: 10px !important;
}
.mrgbt-10{
  margin-bottom: -10px !important;
}
.mrglf10 {
  margin-left: 10px !important;
}
.mrgtp5 {
  margin-top: 5px !important;
}
.mrgtp10 {
  margin-top: 10px !important;
}
.mrgtp15 {
  margin-top: 15px !important;
}
.mrgtp50 {
  margin-top: 50px !important;
}
.mrgbt1 {
  margin-bottom: 1px !important;
}
.mrgbt2 {
  margin-bottom: 2px !important;
}
.mrgbt3 {
  margin-bottom: 3px !important;
}
.mrgbt4 {
  margin-bottom: 4px !important;
}
.mrgbt5 {
  margin-bottom: 5px !important;
}
.mrgbt6 {
  margin-bottom: 6px !important;
}
.mrgbt7 {
  margin-bottom: 7px !important;
}
.mrgbt8 {
  margin-bottom: 8px !important;
}
.mrgbt9 {
  margin-bottom: 9px !important;
}
.mrgbt10 {
  margin-bottom: 10px !important;
}
.mrgbt10 {
  margin-bottom: 10px !important;
}
.mrgbt60 {
  margin-bottom: 60px !important;
}
/** BACKGROUND **/
.bgcl-blue50{
  background-color: #E3F2Fd !important;
}
.bgcl-blue60{
  background-color: #C7E6F9 !important;
}
.bgcl-blue70{
  background-color: #A8D8F6 !important;
}
.bgcl-blue80{
  background-color: #77C2F1 !important;
}
.bgcl-blue200{
  background-color: #90CAF9 !important;
}
.bgcl-yellow50{
  background-color: #FFFDE7 !important;
}
.bgcl-yellow60{
  background-color: #FDF7B3 !important;
}
.bgcl-green50{
    background-color: #F1F8E9 !important;
}
.bgcl-green100{
    background-color: #DCEDC8 !important;
}
.bgcl-green200{
    background-color: #C5E1A5 !important;
}
.bgcl-green300{
    background-color: #AED581 !important;
}
.bgcl-green400{
    background-color: #9CCC65 !important;
}
.bgcl-green500{
    background-color: #8BC34A !important;
}
.bgcl-green600{
    background-color: #7CB342 !important;
}
.bgcl-green700{
    background-color: #689F38 !important;
}
.bgcl-green800{
    background-color: #558B2F !important;
}
.bgcl-green900{
    background-color: #336911 !important;
}
.bgcl-grey50{
    background-color: #FAFAFA !important;
}
.bgcl-grey100{
    background-color: #F5F5F5 !important;
}
.bgcl-grey200{
    background-color: #EEEEEE !important;
}
.bgcl-grey300{
    background-color: #E0E0E0 !important;
}
.bgcl-grey400{
    background-color: #BDBDBD !important;
    color: #BDBDBD !important;
}
.bgcl-grey500{
    background-color: #9E9E9E !important;
}
.bgcl-grey600{
    background-color: #757575 !important;
}
.bgcl-grey700{
    background-color: #616161 !important;
}
.bgcl-grey800{
    background-color: #424242 !important;
}
.bgcl-grey900{
    background-color: #212121 !important;
}
.bgcl-orange500{
    background-color: #FF9800 !important;
}
.bgcl-orange50{
    background-color: #FFF3E0 !important;
}
.bgcl-orange100{
    background-color: #FFE0B2 !important;
}
.bgcl-orange200{
    background-color: #FFCC80 !important;
}
.bgcl-orange300{
    background-color: #FFB74D !important;
}
.bgcl-orange400{
    background-color: #FFA726 !important;
}
.bgcl-orange500{
    background-color: #FF9800 !important;
}
.bgcl-orange600{
    background-color: #FB8C00 !important;
}
.bgcl-orange700{
    background-color: #F57C00 !important;
}
.bgcl-orange800{
    background-color: #EF6C00 !important;
}
.bgcl-orange900{
    background-color: #E65100 !important;
}
.bgcl-orangeA100{
    background-color: #FFD180 !important;
}
.bgcl-orangeA200{
    background-color: #FFAB40 !important;
}
.bgcl-orangeA400{
    background-color: #FF9100 !important;
}
.bgcl-orangeA700{
    background-color: #FF6D00 !important;
}
.bgcl-teal50{
    background-color: #E0F2F1 !important;
} 
.bgcl-teal100{
    background-color: #B2DFDB !important;
} 
.bgcl-teal200{
    background-color: #80CBC4 !important;
} 
.bgcl-teal300{
    background-color: #4DB6AC !important;
} 
.bgcl-teal400{
    background-color: #26A69A !important;
} 
.bgcl-teal500{
    background-color: #009688 !important;
} 
.bgcl-teal600{
    background-color: #00897B !important;
} 
.bgcl-teal700{
    background-color: #00796B !important;
} 
.bgcl-teal800{
    background-color: #00695C !important;
} 
.bgcl-teal900{
    background-color: #004D40 !important;
} 
.bgcl-tealA100{
    background-color: #A7FFEB !important;
} 
.bgcl-tealA200{
    background-color: #64FFDA !important;
} 
.bgcl-tealA400{
    background-color: #1DE9B6 !important;
} 
.bgcl-tealA700{
    background-color: #00BFA5 !important;
}
.bgcl-cyan50{
    background-color: #E0F7FA !important;
}
.bgcl-cyan100{
    background-color: #B2EBF2 !important;
}
.bgcl-cyan200{
    background-color: #80DEEA !important;
}
.bgcl-cyan300{
    background-color: #4DD0E1 !important;
}
.bgcl-cyan400{
    background-color: #26C6DA !important;
}
.bgcl-cyan500{
    background-color: #00BCD4 !important;
}
.bgcl-cyan600{
    background-color: #00ACC1 !important;
}
.bgcl-cyan700{
    background-color: #0097A7 !important;
}
.bgcl-cyan800{
    background-color: #00838F !important;
}
.bgcl-cyan900{
    background-color: #006064 !important;
}
.bgcl-cyanA100{
    background-color: #84FFFF !important;
}
.bgcl-cyanA200{
    background-color: #18FFFF !important;
}
.bgcl-cyanA400{
    background-color: #00E5FF !important;
}
.bgcl-cyanA700{
    background-color: #00B8D4 !important;
}
.bgcl-red100{
    background-color: #FFAD60 !important;
}
.bgcl-red{
  background-color: red !important;
}
.bgcl-red a{
  color: yellow !important;
}

.bgcl-yellow{
  color: yellow !important;
}

.font-blue50{
    color: #E3F2Fd !important;
}
.font-blue60{
    color: #C7E6F9 !important;
}
.font-blue70{
    color: #A8D8F6 !important;
}
.font-blue80{
    color: #77C2F1 !important;
}
.font-blue200{
    color: #90CAF9 !important;
}
.font-blue500{
    color: #0A5EB0 !important;
}
.font-yellow50{
    color: #FFFDE7 !important;
}
.font-yellow60{
    color: #FDF7B3 !important;
}
.font-green50{
    color: #F1F8E9 !important;
}
.font-green100{
    color: #DCEDC8 !important;
}
.font-green200{
    color: #C5E1A5 !important;
}
.font-green300{
    color: #AED581 !important;
}
.font-green400{
    color: #9CCC65 !important;
}
.font-green500{
    color: #8BC34A !important;
}
.font-green600{
    color: #7CB342 !important;
}
.font-green700{
    color: #689F38 !important;
}
.font-green800{
    color: #558B2F !important;
}
.font-green900{
    color: #336911 !important;
}
.font-grey50{
    color: #FAFAFA !important;
}
.font-grey100{
    color: #F5F5F5 !important;
}
.font-grey200{
    color: #EEEEEE !important;
}
.font-grey300{
    color: #E0E0E0 !important;
}
.font-grey400{
    color: #BDBDBD !important;
}
.font-grey500{
    color: #9E9E9E !important;
}
.font-grey600{
    color: #757575 !important;
}
.font-grey700{
    color: #616161 !important;
}
.font-grey800{
    color: #424242 !important;
}
.font-grey900{
    color: #212121 !important;
}
.font-orange500{
    color: #FF9800 !important;
}
.font-orange50{
    color: #FFF3E0 !important;
}
.font-orange100{
    color: #FFE0B2 !important;
}
.font-orange200{
    color: #FFCC80 !important;
}
.font-orange300{
    color: #FFB74D !important;
}
.font-orange400{
    color: #FFA726 !important;
}
.font-orange500{
    color: #FF9800 !important;
}
.font-orange600{
    color: #FB8C00 !important;
}
.font-orange700{
    color: #F57C00 !important;
}
.font-orange800{
    color: #EF6C00 !important;
}
.font-orange900{
    color: #E65100 !important;
}
.font-orangeA100{
    color: #FFD180 !important;
}
.font-orangeA200{
    color: #FFAB40 !important;
}
.font-orangeA400{
    color: #FF9100 !important;
}
.font-orangeA700{
    color: #FF6D00 !important;
}
.font-teal50{
    color: #E0F2F1 !important;
} 
.font-teal100{
    color: #B2DFDB !important;
} 
.font-teal200{
    color: #80CBC4 !important;
} 
.font-teal300{
    color: #4DB6AC !important;
} 
.font-teal400{
    color: #26A69A !important;
} 
.font-teal500{
    color: #009688 !important;
} 
.font-teal600{
    color: #00897B !important;
} 
.font-teal700{
    color: #00796B !important;
} 
.font-teal800{
    color: #00695C !important;
} 
.font-teal900{
    color: #004D40 !important;
} 
.font-tealA100{
    color: #A7FFEB !important;
} 
.font-tealA200{
    color: #64FFDA !important;
} 
.font-tealA400{
    color: #1DE9B6 !important;
} 
.font-tealA700{
    color: #00BFA5 !important;
}
.font-cyan50{
    color: #E0F7FA !important;
}
.font-cyan100{
    color: #B2EBF2 !important;
}
.font-cyan200{
    color: #80DEEA !important;
}
.font-cyan300{
    color: #4DD0E1 !important;
}
.font-cyan400{
    color: #26C6DA !important;
}
.font-cyan500{
    color: #00BCD4 !important;
}
.font-cyan600{
    color: #00ACC1 !important;
}
.font-cyan700{
    color: #0097A7 !important;
}
.font-cyan800{
    color: #00838F !important;
}
.font-cyan900{
    color: #006064 !important;
}
.font-cyanA100{
    color: #84FFFF !important;
}
.font-cyanA200{
    color: #18FFFF !important;
}
.font-cyanA400{
    color: #00E5FF !important;
}
.font-cyanA700{
    color: #00B8D4 !important;
}
.font-red{
    color: red !important;
}
.font-red_red{
    color: red !important;
}
.font-white{
  color: white !important;
}

/** SHADOW **/
.shdw5-black {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2) !important;
}

/** TABLE **/
.table {
    margin-bottom: 10px!important;
}
table th {
    border-bottom: 3px solid #AAA!important;
    text-align: center;
    vertical-align: middle!important;
}
th {
    cursor: pointer;
}
td.empty-row, div.empty-row{
  text-align: center !important;
  padding: 15px;
  font-weight: bolder;
  background-color:#FFF6BF!important;
  text-align:center;
  color:#666633;
  border:thin solid #FDD845;
}
div.empty-row{
  min-height: 160px;
  background-position: center 38px;
  background-repeat: no-repeat;
  background-image: url(../img/component/tandus.png);
}
td.empty-row-blue{
  padding: 16px !important;
  border:thin solid #DBEEF6;
  background-color: #DBEEF6 !important;
}


/*----> SLIDER

/* The switch - the box around the slider */
.switch_toogle {
  position: relative;
  display: inline-block;
  width: 27px;
  height: 14px;
}

/* Hide default HTML checkbox */
.switch_toogle input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: -5px;
  bottom: -3px;
  background-color: white;
  border: thin solid #aaa;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(14px);
  -ms-transform: translateX(14px);
  transform: translateX(14px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 10px;
}

.slider.round:before {
  border-radius: 100%;
}

/** RIBBON **/
.ribbon{
  left: 5px;
  padding: 12px 9px 12px 20px;
  position: absolute;
  background: no-repeat url(../img/component/sprites.png) 0 0;
  color: #fff;
  height: 34px;
  width: 250px;
  z-index: 10;
  margin-top: 5px;
}

/** PAGINATION **/
.pagination{
  margin-top: 0px !important;
}
#tablePagination > div {
  display: inline-block;
  margin-right: 10px;
}
#tablePagination_paginater > .icon {
  padding: 0 5px;
  cursor: pointer;
}
.table-filter, #tablePagination {
  padding: 5px 10px;
  background-color: #eee;
  margin: 1px 0 10px 0;
}
.table-filter > #filter_form > .btn-link {
  color: #000 !important;
}
.table-hover > tbody > tr:hover > td.edit_column {
  background-color: #FEF8E2 !important;
}
.table-filter > #filter_form > label, #tablePagination > label {
  min-width: 80px;
  margin-left: 2px;
}
.filter_select {
  padding: 4px 8px 4px 4px;
  border: thin solid #eee;
}


/** DATE PICKER **/
.ui-datepicker {
  background-color: #fff;
  border: 1px solid #aaa;
  display: none;
  margin-top: 4px;
  padding: 10px;
}
.ui-datepicker a, .ui-datepicker a:hover {
  text-decoration: none;
}
.ui-datepicker a:hover, .ui-datepicker td:hover a {
  color: #2A6496;
  -webkit-transition: color 0.1s ease-in-out;
  -moz-transition: color 0.1s ease-in-out;
  -o-transition: color 0.1s ease-in-out;
  transition: color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-header {
  margin-bottom: 4px;
  text-align: center;
}
.ui-datepicker .ui-datepicker-title {
  font-weight: 700;
  margin-bottom: 15px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
  cursor: pointer;
  font-family: 'Glyphicons Halflings';
  -webkit-font-smoothing: antialiased;
  font-style: normal;
  font-weight: normal;
  height: 20px;
  line-height: 1;
  margin-top: 2px;
  width: 30px;
}
.ui-datepicker .ui-datepicker-prev {
  float: left;
  text-align: left;
}
.ui-datepicker .ui-datepicker-next {
  float: right;
  text-align: right;
}
.ui-datepicker .ui-datepicker-prev:before {
  content: "\e079";
}
.ui-datepicker .ui-datepicker-next:before {
  content: "\e080";
}
.ui-datepicker .ui-icon {
  display: none;
}
.ui-datepicker .ui-datepicker-calendar {
  table-layout: fixed;
  width: 100%;
}
.ui-datepicker .ui-datepicker-calendar th, .ui-datepicker .ui-datepicker-calendar td {
  text-align: center;
    padding: 2px;
    font-size: 17px;
    font-family: monospace;
}
.ui-datepicker .ui-datepicker-calendar td {
  border-radius: 4px;
  -webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
  -moz-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
  -o-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
  transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-calendar td:hover {
  background-color: #eee;
  cursor: pointer;
}
.ui-datepicker .ui-datepicker-calendar td a {
  text-decoration: none;
}
.ui-datepicker .ui-datepicker-current-day {
  background-color: #4289cc;
}
.ui-datepicker .ui-datepicker-current-day a {
  color: #fff
}
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover {
  background-color: #fff;
  cursor: default;
}
.ui-datepicker-unselectable.ui-state-disabled {
  background-color: #fff;
  color: #eee;
}
.clickable{
  cursor: pointer !important;
}
label.relative_block{
  position: relative;
  top: -8px;
  padding: 4px;
}
#loading_panel_lite{
  background-color: #FDF7B3;
  border: thin solid #F8BC36;
  position: fixed;
  width: 300px;
  top: 46%;
  z-index: 9999;
  text-align: center;
  left: calc(50% - calc(250px/2));
  padding: 5px;
}
.badge_web{
  background-image: url(../img/component/badge_web.png) !important;
  background-repeat: no-repeat;
  background-size: 148px;
  background-position: center -43px;
  display: block;
  height: 102px !important;
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: -10px;
  z-index: 100;
}


.icon_hide{
  font-size: 10px !important;
}

.txt_primary_data_link{
  font-weight: bold !important;
  color: #428bca !important;
  text-decoration: underline !important;
}
.txt_primary_data{
  font-weight: bold !important;
  color: #000 !important;
  text-decoration: underline !important;
}
.txt_primary_10{
  font-size: 10px !important;
  color: #9E9E9E !important;
}

/** overwrite bootstrap component **/
/* .btn-sm, .btn-xs{
  border-radius: 33px !important;;
} */

.vertlgn-mid{
  vertical-align: middle !important;
}