@media all {
  .page-break { display: none; }
}

@font-face {
    font-family: Ubuntu-Bold;
    src: url(../fonts/Ubuntu-Bold.woff);
}

@font-face {
    font-family: Ubuntu-Condensed;
    src: url(../fonts/UbuntuCondensed-Regular.woff);
}


@font-face {
    font-family: OpenSans-Light;
    src: url(../fonts/OpenSans-Light.woff);
}




h1, h2, h3, h4, h5, h6 {
font-family: Ubuntu-Bold,sans-serif;
}
html,body{
    font-family: OpenSans-Light,sans-serif;
    font-size:14px;
    color:#777;
    background-color: #fff;
    height:100%;
}

p{
    font-family:  OpenSans-Light,sans-serif;
    font-size:15px;
    color:#777;
}
label {
  font-family:  Ubuntu-Bold,sans-serif;
/*  font-weight: bold;*/
  font-size:15px;
  margin-top: 0.3em;
}
.h-inputs {
  padding-left:0px;
  padding-right:3px;
}

table,td,th {
    font-size:11px;
}


@media print{
  body{ background-color:#FFFFFF; background-image:none; color:#000000 ;}

  .topnav1{ display:none;}
  .cnt-forms{ display:none;}
  .cnt-msg{display:none;}
  .cnt-heading{display:none;}
  .footer{display:none;}
  .cnt-print{ width:100%;}
  .page-break  { display: block; page-break-before: always; }
}


.page-bg{

  background:url('/static/images/fractal.jpg');
  background-repeat: no-repeat;
  background-size: 120% 120%;
    -webkit-filter: blur(100px);
    -webkit-transform: translate3d(0, 0, 0);

/*-webkit-filter: blur(50px);
-moz-filter: blur(50px);
-o-filter: blur(50px);
-ms-filter: blur(50px);
filter: blur(50px);*/

position:fixed;

height:100%;
top: 00%;
left: 0%;
width: 100%;
z-index:-1;
}

.nonfield-errors ul, .alert-box ul{
  margin-left:0px;
}

#div_id_username label,#div_id_password label{color:#006666;}


input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea {
    background-color: #ebfafa;
    margin-bottom: 0.3em;
    border-radius:7px;
}
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {
    background-color: #fff;
    font-family: OpenSans-Light;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1) inset;
    color: rgba(0, 0, 0, 0.75);
    display: block;
    margin-bottom: 0.3em;
    border-radius:7px;
/*    font-size: 0.875rem;
    margin: 0px 0px 1rem;
    padding: 5px;
    height: 30px;*/
    width: 100%;
    box-sizing: border-box;
    transition: box-shadow 0.45s ease 0s, border-color 0.45s ease-in-out 0s;
}
input:focus { 
    background-color: #ebfafa;
}


select {
   overflow: hidden;
/*   font-size: 0.875rem;
   height: 30px;
   padding : 4px;*/
   padding-right: 1.5rem; 
   font-family: OpenSans-Light;
}


.top-bar input, .top-bar .button, .top-bar button {
    font-size: 0.875rem;
    position: relative;
    top: 7px;
    height: 30px;
}


.no-js .top-bar {
  display: none;
}
.no-js .title-bar {
  display: none;
}
@media screen and (min-width: 40em) {
  .no-js .top-bar {
    display: block;
  }

  .no-js .title-bar {
    display: none;
  }
}
.title-bar {
  background: #034149;
  padding: 0.9rem; }

.top-bar {
  font-family: OpenSans-Light,sans-serif;
  font-size: 15px;
  background: #034149;
   }
.top-bar ul {
background: #034149; }
.top-bar ul li {
background: #034149; }
.top-bar ul li a {
color: #fff; }
.top-bar ul li a:hover {
color: #fff; background-color:#066a79;}



.menu-text {
  color: #fff; }
  @media only screen and (max-width: 40em) {
    .menu-text {
      display: none !important; } }

@media only screen and (min-width: 40em) {
  .menu:last-child {
    border-left: 1px solid #21b1e8; }

  .menu:first-child {
    border-left: none; }

  .menu li:not(:last-child) {
    border-right: 1px solid #21b1e8; } }
.dropdown.menu .submenu {
  border: none; }

.dropdown.menu .is-dropdown-submenu-parent.is-right-arrow > a::after {
  border-color: #fff transparent transparent; }

.is-drilldown-submenu-parent > a::after {
  border-color: transparent transparent transparent #fff; }

.js-drilldown-back::before {
  border-color: transparent #fff transparent transparent; }

.top-bar-section .has-dropdown > a:after {
  border-style: none;
  border-color: #FF0000 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
}

/*dropdown menu arrow color*/
.dropdown.menu>li.is-dropdown-submenu-parent>a:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border: 5px inset;
    border-color: #cefdfd transparent transparent;
    border-top-style: solid;
    border-bottom-width: 0;
    right: 5px;
    margin-top: -2px;
}

.headconleft {
  float: left;
  background-color: #068293;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}

.headconright {
  float: right;
  color:#fff;
  padding-top:15px;
  padding-bottom:10px;
}

.headconleft1 {
  float: left;
  background-color: #eeaa7b;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}

.headconright1 {
  float: right;
  color:#fff;
  padding-top:15px;
  padding-bottom:10px;
}

.headconback {
  vertical-align: center;
  background-color:#068293;
  color:#fff;
}
.headconback1 {
  vertical-align: center;
  background-color:#e37222;
  color:#fff;
}
.headconleftemp {
  float: left;
  background-color: #e98c49;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}
.headconbackemp {
  vertical-align: center;
  background-color:#e98c49;
  color:#fff;
}


/* non-pns theme*/


.nonheadconleft {
  float: left;
  background-color: #26575a;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}


.nonheadconright {
  float: right;
  color:#fff;
  padding-top:15px;
  padding-bottom:10px;
}

.nonheadconleft1 {
  float: left;
  background-color: #eeaa78;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}

.nonheadconright1 {
  float: right;
  color:#fff;
  padding-top:15px;
  padding-bottom:10px;
}

.nonheadconback {
  vertical-align: center;
  background-color:#357a7e;
  color:#fff;
}
.nonheadconback1 {
  vertical-align: center;
  background-color:#e37222;
  color:#fff;
}
.nonheadconleftemp {
  float: left;
  background-color: #eea977;
  color:#fff;
  border-right : 0px dotted #fff;
  padding-top:15px;
  padding-bottom:10px;
  padding-left:3rem;
}
.nonheadconbackemp {
  vertical-align: center;
  background-color:#f4c5a4;
  color:#fff;
}



/* footer */
.footconleft {
  height: 5em;
  float: left;
  background-color: #eeaa7b;
  color:#fff;
  border-right : 2px dotted #fff;

}
.footconright {
  height: 5em;
  float: right;
  color:#fff;

}
.footconback {
  height: 5em;
  vertical-align: center;
  background-color: #ddd;
  color:#fff;
}

.wrapper {
    min-height: 98%;
    height: auto !important;
    margin: 0 auto -5em; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 5em; /* .push must be the same height as .footer */
}

.button.custom1 {
background-color: #e37222;
}

.button.custom1:hover, 
.button.custom1:focus {
background-color: darken($buttoncolor, 5%);
}

small{
  color:red!important;
}

.holder.error{
  padding-bottom: 10px!important;
}

.holder.error label {
  color:red!important;
}
.holder.error input {
  margin-bottom:0px!important;
  border-color: red!important; 
}

.messages ul, .messages li {
  list-style-type: none;
}

.callout.error{
  background-color: #ff8533;
  color:#fff;
  border-color: #fff;
}
.callout.success{
  background-color: #9966ff;
  color:#fff;
  border-color: #fff;
}

.input-group.perpage{
  margin-bottom: 0;
}

.button.hollow.prevnext{
  padding: 0.4em 0.7em;
}

h5.filtertoggle {
  display:inline;
}

.hint {
    margin-top: -0.3em;
    margin-bottom: 0.5rem;
    font-size: smaller;
    font-style: italic;
    color: #98d1d4;
}
.fldsm{
    min-width: 25% !important;
    width: auto !important;
}
.fldmd{
    min-width: 50% !important;
    width: auto !important;
}
.fldlg{
    min-width: 70% !important;
    width: auto !important;
}

ul.fancytree-container {
  min-height:auto !important;
  max-height: 300px !important;
  width:40% !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
}

.nonfield-errors ul, .alert-box ul{
  background-color: #ff8533 !important;
  color:#fff !important;
  border-color: #fff !important;
  list-style-type: none !important;
  padding:15px !important;
}

#tableEditor {
    position: fixed;
    top: 0;
    right: 0;
/*    width: 300px;*/
/*    position: absolute;
    left: 20px; top: 20px;*/
    padding: 5px;
    border: 1px solid #000;
    background: #fff;
}



/* ############################ paleblue1 themes ################## */
/*##################################################################################################*/

@media print {
td.grey {
    background-color: #eef !important;
    -webkit-print-color-adjust: exact; 

  }
  th.grey {
    background-color: #eef !important;
    -webkit-print-color-adjust: exact; 

  }

td.greyd {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }
th.greyd {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }

td.greyc {
    background-color: #ccc !important;
    -webkit-print-color-adjust: exact; 

  }
th.greyc {
    background-color: #ccc !important;
    -webkit-print-color-adjust: exact; 

  }

td.markdelta {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }
}

@media screen {
td.grey {
    background-color: #eef !important;
    -webkit-print-color-adjust: exact; 

  }
  th.grey {
    background-color: #eef !important;
    -webkit-print-color-adjust: exact; 

  }

td.greyd {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }
th.greyd {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }

td.greyc {
    background-color: #ccc !important;
    -webkit-print-color-adjust: exact; 

  }
th.greyc {
    background-color: #ccc !important;
    -webkit-print-color-adjust: exact; 

  }
td.markdelta {
    background-color: #ddd !important;
    -webkit-print-color-adjust: exact; 

  }
}


#dailyprinttb{
  margin:0rem !important;
  align-self: 
  border-collapse: collapse;
  border-color: #CCC;
  border: 1px solid #ccc;
  margin-bottom:0px;
  font-family:Arial !important;
  
}

#dailyprinttb th{
  padding:1px;
  margin:0px;
  border:1px solid #aaa;
  background-color: white;
  font-size:11px !important;
  color:black;
}

#dailyprinttb td{
  padding-left:2px;
  padding-bottom:1px;
  padding-top:1px;
  padding-right:2px;
  border:1px solid #aaa;
  background-color: white;
  font-size:11px !important;
  color:black;
}


#recaptb{
  margin:0rem !important;
  align-self: 
  border-collapse: collapse;
  border-color: #CCC;
  border: 1px solid #ccc;
  margin-bottom:0px;
  font-family:Arial !important;
  border:1px solid red;
  
}

#recaptb th{
  padding:1px;
  margin:0px;
  border:1px solid #aaa;
  background-color: white;
  font-size:11px !important;
  color:black;
}

#recaptb td{
  padding-left:2px;
  padding-bottom:1px;
  padding-top:1px;
  padding-right:2px;
  border:1px solid #aaa;
  background-color: white;
  font-size:11px !important;
  color:black;
}



#headprint{
 font-family: Arial;
 font-size: 18px;
 color:black;
 font-weight: bold;
 float:right;
}

#headprintsmall {
 font-family: Arial;
 font-size: 14px;
 color:black;
 font-weight: bold
}

#dailyprinttb tr:nth-child(even) {
    background-color: #f1f1f1;
}

div.table-container {
    white-space: nowrap;
    display: inline-block;
    width: 100%;
    overflow-x: auto;
}


.bigred{
  color:red;
  font-size:2em;
 }

table.paleblue1 input[type="checkbox"]{
  margin:0rem !important;
  align-self: 
}
table.paleblue1 th.id,table.paleblue1 td.id{
  text-align: center;
}
table.paleblue1 {
    border-collapse: collapse;
    border-color: #CCC;
    border: 1px solid #ccc;
    margin-bottom:0px;

}

table.paleblue1,
table.paleblue1 +  ul.pagination {
/*    font-family:OpenSans-Light !important;*/
    font-family:Arial !important;
}

table.paleblue1 a:link,
table.paleblue1 a:visited,
table.paleblue1 + ul.pagination > li > a {
    color: #5B80B2;
    text-decoration: underline;
}

table.paleblue1 a:hover {
    color: #036;
}
table.paleblue1 tr:hover {
    background-color: rgba(255, 0, 0, 0.7);
}
table.paleblue1 td,
table.paleblue1 th {
    padding: 7px;
    line-height: 13px;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ddd;
    text-align: left;
    font-size: 13px;
}

table.paleblue1 thead th:first-child,
table.paleblue1 thead td:first-child {
    border-left: none !important;
}

table.paleblue1 thead th,
table.paleblue1 thead td {
    background-color: #031A3B;
/*    background: #FCFCFC url(../images/header-bg.png) left bottom repeat-x;*/
    border-bottom: 1px solid #fff;
    font-family:Arial !important;
    padding: 5px 5px;
    font-size: 12px;
    vertical-align: middle;
    color: #ddd;
    height:35px;
/*    white-space: nowrap;*/
}

table tr:hover {
    background-color: rgba(100, 180, 150, 0.2) !important;
}


table.paleblue2 thead th,
table.paleblue2 thead td {
    background-color: #055761;
    font-family:Arial !important;
/*    background: #FCFCFC url(../images/header-bg.png) left bottom repeat-x;*/
    border-bottom: 1px solid #fff;
    padding: 10px 5px 10px 5px;
    font-size: 12px;
    color: #fff;
    height:35px;

/*    white-space: nowrap;*/
}


table.palebluelong td,
table.palebluelong th {
    padding: 7px;
    line-height: 11px !important;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ddd;
    text-align: left;
    font-size: 11px !important;
}


table.palebluelong thead th,
table.palebluelong thead td {
    background-color: #eb9a60;
    font-family:Arial !important;
/*    background: #FCFCFC url(../images/header-bg.png) left bottom repeat-x;*/
    border-bottom: 1px solid #fff;
    padding: 10px 5px 10px 5px;
    font-size: 10px !important;
    color: #fff;
    height:30px;

/*    white-space: nowrap;*/
}


table.paleblueemp thead th,
table.paleblueemp thead td {
    background-color: #eb9a60;
    font-family:Arial !important;
/*    background: #FCFCFC url(../images/header-bg.png) left bottom repeat-x;*/
    border-bottom: 1px solid #fff;
    padding: 10px 5px 10px 5px;
    font-size: 12px;
    color: #fff;
    height:35px;

/*    white-space: nowrap;*/
}

table.paleblue2 td {
    padding: 10px 5px 10px 5px !important;

}


table.paleblue1 thead th > a:link,
table.paleblue1 thead th > a:visited {
    color: #fff;
    text-decoration: none;
}
table.paleblue1 thead th > a:hover {
    color: #ddd;
}
.table-container {
    text-align: center;

}
.table-container1 {
    text-align: center;

}
table.paleblue1 thead th.orderable > a {
    padding-right: 20px;
    background: url(../images/arrow-inactive-up.png) right center no-repeat;
}
table.paleblue1 thead th.orderable.asc > a {
    background-image: url(../images/arrow-active-up.png);
}
table.paleblue1 thead th.orderable.desc > a {
    background-image: url(../images/arrow-active-down.png);
}

table.paleblue1 tr.odd {
    background-color: #eeeeef;
}
/*table.paleblueemp tr.odd {
    background-color: #eef6f6;
}*/
table.paleblue1 tr.even {
    background-color: white;
}

table.paleblue1 + ul.pagination {
    background: white url(../images/pagination-bg.gif) left 180% repeat-x;
    overflow: auto;
    padding: 10px;
    margin:0px;
    border: 1px solid #DDD;
    list-style: none;
    border-radius: 0px;
}

table.paleblue1 + ul.pagination > li {
    float: left;
    line-height: 22px;
    margin-left: 10px;
}

table.paleblue1 + ul.pagination > li:first-child {
    margin-left: 0;
}

table.paleblue1 + ul.pagination > li.cardinality {
    float: right;
    color: #000;
}

/*table.paleblue1 > tbody > tr > td > span.true,
table.paleblue1 > tbody > tr > td > span.false {
    background-position: top left;
    background-repeat: no-repeat;
    display: inline-block;
    height: 10px;
    overflow: auto;
    text-indent: -200px;
    width: 10px;
}
*/
table.paleblue1 > tbody > tr > td > .missing {
    background: transparent url(../images/missing.png) right center no-repeat;
    color: #717171;
    padding-right: 20px;
}

table.paleblue1 > tbody > tr > td > .missing:hover {
    color: #333;
}

/*table.paleblue1 > tbody > tr > td > span.true {
    background-image: url(../images/true.gif);
}

table.paleblue1 > tbody > tr > td > span.false {
    background-image: url(../images/false.gif);
}*/


table.paleblue1 td,
table.paleblue1 th {
    padding: 5px;
    line-height: 13px;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ddd;
    text-align: left;
}

table.paleblue1 th.inp_idpns, table.paleblue1 td.inp_idpns {
    text-align: center ! important;
}


.has-error .help-block {
  color : #f00 !important;
}
.has-error .form-control {
  border-color : #f00 !important;
}
.has-error .control-label {
/* text-align:right; */
color:#f00;
}


td.hlstatflag1 {
  background-color: rgba(255, 70, 0, 0.2) !important;
  # color : #fff !important;
}
td.hlstatflag1  a:visited, td.hlstatflag1  a:link, td.hlstatflag1  + ul.pagination > li > a {
    color : #fff;
}
td.hlstatflag1  a:hover, td.hlstatflag1  + ul.pagination > li > a {
    color : #ddd;
}

tr.hlstatflag2 {
  background-color: rgba(51, 204, 0, 0.9);
  color : #fff;
}
tr.hlstatflag2  a:visited, tr.hlstatflag2  a:link, tr.hlstatflag2  + ul.pagination > li > a {
    color : #fff;
}
tr.hlstatflag2  a:hover, tr.hlstatflag2  + ul.pagination > li > a {
    color : #ddd;
}


tr.hlstatflag3 {
  background-color: rgba(255, 247, 0, 0.7);
  color : #333;
}
tr.hlstatflag3  a:visited, tr.hlstatflag3  a:link, tr.hlstatflag3  + ul.pagination > li > a {
    color : #333;
}
tr.hlstatflag3  a:hover, tr.hlstatflag3  + ul.pagination > li > a {
    color : #ddd;
}


tr.hlstatflag4 {
  background-color: rgba(0, 122, 204, 0.7);
  color : #fff;
}
tr.hlstatflag4  a:visited, tr.hlstatflag4  a:link, tr.hlstatflag4  + ul.pagination > li > a {
    color : #003e66;
}
tr.hlstatflag4  a:hover, tr.hlstatflag4 + ul.pagination > li > a {
    color : #ddd;
}

tr.hlstatflag5 {
  background-color: rgba(230, 115, 0, 1);
  color : #fff;
}
tr.hlstatflag5  a:visited, tr.hlstatflag5  a:link, tr.hlstatflag5  + ul.pagination > li > a {
    color : #fff;
}
tr.hlstatflag5  a:hover, tr.hlstatflag5  + ul.pagination > li > a {
    color : #ddd;
}



#alamat_col {
  width:16%;
}
.filterdiv {
width:97%;
background:#eee;
margin-bottom:5px;
margin-left:15px;
padding-left:15px;
padding-top:5px;
border:1px solid #ccc;
border-radius:10px;
}

#filterfld{
background:#eee;
border:0px solid #c09;
width:100%;
float:right

}

#paginationdiv {
  border:0px solid #f00;
/*  width:97%;*/
  margin-top:5px;
  margin-right:25px;
  padding-left:5px;
  padding-right:5px;
  font-size: 13px;

  vertical-align: middle;
  display: inline-block;
}

.highlight{
  background-color: #ffdab3 !important;
}

th.inpart{
  background-color: #5770c1 !important;
}

th.outpart{
  background-color: #009999 !important;
}