@font-face {
    font-family: "Kendo UI";
    src: url("../../../kendoui/2016.2.504/styles/images/kendoui.woff") format("woff"),
        url("../../../kendoui/2016.2.504/styles/images/kendoui.ttf") format("truetype");
}

body:before {
    font-family: "Kendo UI";
    content: "\a0";
    font-size: 0;
    width: 0;
    height: 0;
    position: absolute;
    z-index: -1;
}

/*take_over_user.png
html, body {
    margin: 0;
    padding: 0;
    min-width: 320px;
    /*padding-top: 45px;
}
*/
.label_title_header1 {
    color: #D2DC02;
}

.label_title_header2 {
    color: #16B3AC;
}

.head_menu {
    font-size: 10pt;
    font-weight: bold;
    color: #ffffff;
}

.navbar-default {
    background-color: #147F9F;
    border: none;
    border-radius: 0;
    color: #FFFFFF;
}

.navbar-nav>li>a {
    padding: 8px 10px;
}

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

.navbar-nav>li>a {
    padding-bottom: 5px;
    padding-top: 5px;
}

.nav>li>a {
    padding: 5px 15px;
}

.nav,
.navbar,
.navbar-nav {
    background-color: #147F9F;
    color: #FFFFFF;
}

.dropdown-menu {
    background-color: #147F9F;
    color: #FFFFFF;
}

.dropup,
.dropdown {
    background-color: #147F9F;
    color: #FFFFFF;
}

.dropdown-menu>li>a {
    background-color: #147F9F;
    color: #FFFFFF;
}

.dropdown-menu>li>a:hover {
    background-color: #FFFF00;
    color: #000000;
}

.navbar-default .navbar-nav>li>a {
    background-color: #147F9F;
    color: #FFFFFF;
}

.navbar-default .navbar-nav>li>a:hover {
    background-color: #EC971F;
    color: #FFFFFF;
}

.navbar-default .navbar-nav>li>a:active {
    background-color: #FFFF00;
    color: #000000;
}

.navbar-default .navbar-nav>.active>a {
    color: #000000;
    background-color: #FFFF00;
}

.navbar-default .navbar-nav>.active>a:hover {
    background-color: #EC971F;
    color: #FFFFFF;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #cccccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #555;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

.dropdown-menu>.active>a,
.dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a:hover {
    color: #000000;
    background-color: #FFFF00;
}

.dropdown-menu>li>a:hover {
    color: #ffffff;
    background-color: #EC971F;
}

#example {
    padding-top: 2em;
}

/*
header {
    margin: 0;
    font-size: 20px;
    color: #fff;
    background-color: #272727;
}
*/
header h1,
header button {
    display: inline-block;
    vertical-align: middle;
}

header .container h1 {
    margin: 0;
    font-size: 21px;
    line-height: 65px;
    padding-top: 20px;
    padding-left: 0;
}

#configure,
header label {
    border-style: solid;
    border-color: #636363;
    border-width: 0 0 0 1px;
    margin-bottom: 0;
    font-weight: normal;
}

header .container {
    position: relative;
}

header .description {
    text-transform: uppercase;
    color: #ccc;
    font-size: 10px;
    line-height: 29px;
}

header .k-dropdown,
header #font-size-value {
    font-size: 18px;
    line-height: 45px;
    margin-bottom: 9px;
}

header .k-dropdown {
    width: 100%;
}

header .k-dropdown-wrap {
    background-image: none !important;
}

header .k-dropdown,
header .k-dropdown-wrap.k-state-default {
    background-color: transparent;
    border-color: #5c5c5c;
    border-radius: 0;
}

header .k-dropdown-wrap.k-state-hover,
header .k-dropdown-wrap.k-state-active,
header .k-dropdown-wrap.k-state-focused {
    background-color: #030303;
}

header .k-dropdown-wrap.k-state-focused {
    box-shadow: none;
}

header .k-dropdown .k-input {
    padding-top: 0;
    padding-bottom: 0;
    height: auto;
    text-indent: 14px;
}

header .k-dropdown .k-input,
header .k-dropdown-wrap .k-select {
    line-height: 45px;
}

header .k-dropdown .k-i-arrow-s {
    background-image: url("../../../kendoui/2016.2.504/styles/Bootstrap/sprite.png");
    background-position: -16px -32px;
}

header .k-dropdown-wrap.k-state-default .k-input {
    color: #fff;
}

.k-popup.ra-list {
    background-color: #010101;
    border-color: #5c5c5c;
    color: #fff;
    padding: 0;
    border-radius: 0;
}

.k-popup.ra-list .k-state-hover,
.k-popup.ra-list .k-state-selected,
.k-popup.ra-list .k-state-focused {
    background-image: none;
    background-color: #555;
    box-shadow: none;
    color: #fff;
    border-color: #555;
}

.k-popup.ra-list .k-item {
    border-radius: 0;
    text-indent: 7px;
}

#configure {
    z-index: 10;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-width: 0 0 0 1px;
    background-color: transparent;
    position: absolute;
    top: 0;
    right: 0;
    color: #fff;
}

#demo {
    padding-top: 46px;
}

#menu {
    /*margin-bottom: 30px;*/
}

#profile {
    position: relative;
}

.ra-well-title {
    font-size: 1.2857em;
    line-height: 1.2857em;
    border-bottom: 1px solid #e7e7e7;
    margin: -5px -19px 0.8333em;
    padding: 0 19px 0.7222em;
}

.ra-avatar {
    border: 1px solid #e7e7e7;
    border-radius: 2px;
}

.ra-first-name {
    display: block;
    margin-top: 0.8571em;
}

.ra-last-name {
    display: block;
    font-size: 1.7143em;
    line-height: 1.3em;
}

.ra-position {
    font-size: 0.8571em;
    color: #999;
    padding-bottom: 2em;
}

.form-group .k-widget,
.form-group .k-textbox {
    width: 100%;
}

.buttons-wrap {
    border-top: 1px solid #e7e7e7;
    padding-top: .5em;
    text-align: right;
}

.ra-section {
    margin-bottom: 20px;
}

.ra-well-overlay {
    margin: -16px -20px -19px;
}

#tabstrip .k-content {
    min-height: 156px;
}

#tabstrip .k-chart {
    height: 156px;
}

#tabstrip .k-content {
    padding: 1px;
}

#tabstrip-4 {
    text-align: center;
}

#tabstrip .km-icon:after {
    font: 1.3em/1em "Kendo UI" !important;
}

.revenue:after {
    content: "\E08C";
}

.spd:after {
    content: "\E04B";
}

.spr:after {
    content: "\E050";
}

.share:after {
    content: "\E04E";
}

#tabstrip .k-tabstrip-items span {
    float: left;
    line-height: 1.3em;
    vertical-align: middle;
}

#tabstrip .k-tabstrip-items .hidden-xs {
    margin-left: 4px;
}

.market-donut {
    display: inline-block;
    width: 170px;
}

#panelbar .k-content {
    padding: 1em;
}

#panelbar ul {
    margin-bottom: 10px;
}

#listview {
    list-style-type: none;
    padding: 0 0 15px;
}

#listview figure {
    border: 1px solid #e7e7e7;
    border-radius: 3px;
    padding: 5px;
    margin-top: 15px;
}

figure h4 {
    font-size: 1.15em;
}

figure p.hidden-sm {
    min-height: 80px;
}

footer {
    text-align: right;
    font-size: 0.8571em;
    padding: 2em 0;
}

header .container h1.visible-sm {
    padding-top: 10px;
    line-height: 33px;
    padding-bottom: 10px;
}

@media (max-width: 767px) {
    .k-menu.k-menu-horizontal .k-item {
        float: none;
    }

    header .container {
        padding-right: 0;
    }

    header .container h1 {
        padding-top: 0;
        line-height: 50px;
    }

    header label {
        border-width: 1px 0 0 0;
        display: block;
    }

    #configurator-wrap {
        position: absolute;
        overflow: hidden;
        height: 260px;
        right: 0;
        top: 50px;
        z-index: 1000;
        padding: 0;
        width: 320px;
    }

    #configurator {
        background-color: #272727;
        position: absolute;
        width: 100%;
        margin: 0;
    }
}

.k-black body,
.k-metroblack body,
.k-black .well,
.k-metroblack .well,
.k-black .ra-well-title,
.k-metroblack .ra-well-title,
.k-black .buttons-wrap,
.k-metroblack .buttons-wrap {
    border-color: #444;
    background-color: #1e1e1e;
    color: #fff;
}

.k-highcontrast body,
.k-highcontrast .well .k-highcontrast .ra-well-title,
.k-highcontrast .buttons-wrap {
    border-color: #664e62;
    background-color: #2c232b;
    color: #fff;
}

.k-moonlight body,
.k-moonlight .well,
.k-moonlight .ra-well-title,
.k-moonlight .buttons-wrap {
    border-color: #171e28;
    background-color: #212a33;
    color: #fff;
}

/*================================================*/
#form_edit {
    /*height: 323px;*/
    margin: 0 auto;
    /*padding: 5px 20px 20px 20px;*/
    text-align: center;
}

.form_edit {
    /*height: 323px;*/
    margin: 0 auto;
    /*padding: 5px 20px 20px 20px;*/
    text-align: center;
}

#form-container {
    /*background-color: #ccc;*/
    border: 1px solid #428BCA;
    border-radius: 5px;
    padding: 0px;
    display: inline-block;
    min-width: 500px;
    width: 100%;
}

#form-header {
    display: block;
    text-align: left;
    background-color: #428BCA;
    color: #ffffff;
    padding: 4px;
    vertical-align: middle;
}

.grid_title-header {
    display: block;
    text-align: left;
    background-color: #FFFFFF;
    color: #000000;
    padding: 5px;
    font-size: 14pt;
    font-weight: bold;
    vertical-align: middle;
}

.title-header {
    font-size: large;
    font-weight: bold;
    text-align: left;
    display: inline-block;
}

#form-container-content {
    display: table;
    vertical-align: top;
    background-color: white;
    padding: 4px;
    border-radius: 0px;
    text-align: left;
    width: 100%;
}

#form-container-content-row {
    /*display: table-row;*/
    display: table;
    width: 100%;
}

#form-container-content-column {
    display: table-cell;
    padding: 2px;
    vertical-align: top;
}

.content-panel {
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    border-color: #ccc;
    border-radius: 4px;
}

.form-container-content-header {
    /*display: -moz-inline-grid;*/
    display: inline-block;
    /*min-width: 500px;*/
    vertical-align: top;
    margin: 4px 4px 0px 4px;
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    border-color: #ccc;
    border-radius: 0px;
    padding: 4px;
    cursor: pointer;

}

.form-container-content-item {
    /*display: -moz-inline-grid;*/
    /*display:inline-block;*/
    /*min-width: 500px;*/
    vertical-align: top;
    /*margin: 0px 4px 4px 4px;*/
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    border-color: #ccc;
    border-radius: 0px;
    padding: 0px;

}

.form-item-header {
    clear: both;
    padding: 2px 2px;
    /*display: table-row;*/
    width: 100%;
    min-height: 20px;
    /*border-top: 1px solid #ccc;*/
}

.form-item {
    clear: both;
    padding: 2px 2px;
    /*display: table-row;*/
    width: 100%;
    min-height: 20px;
    border-top: 1px dotted #ccc;
    text-align: left;
}

.form-item-none {
    clear: both;
    padding: 2px 2px;
    display: none;
}

.form-item-label {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 120px;
    text-align: left;
    font-weight: bold;
}
.form-item-label-checkbox{
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 120px;
    text-align: left;
    font-weight: bold;
}
.form-item-label80 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 80px;
    text-align: left;
    font-weight: bold;
}

.form-item-label90 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 90px;
    text-align: left;
    font-weight: bold;
}

.form-item-label100 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 100px;
    text-align: left;
    font-weight: bold;
}

.form-item-label100 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 100px;
    text-align: left;
    font-weight: bold;
}

.form-item-label105 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 105px;
    text-align: left;
    font-weight: bold;
}

.form-item-label110 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 110px;
    text-align: left;
    font-weight: bold;
}

.form-item-label120 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 120px;
    text-align: left;
    font-weight: bold;
}

.form-item-label140 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 140px;
    text-align: left;
    font-weight: bold;
}

.form-item-label160 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 160px;
    text-align: left;
    font-weight: bold;
}

.form-item-label180 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 180px;
    text-align: left;
    font-weight: bold;
}

.form-item-label200 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 200px;
    text-align: left;
    font-weight: bold;
}

.form-item-label220 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 220px;
    text-align: left;
    font-weight: bold;
}

.form-item-label250 {
    clear: both;
    float: left;
    display: table-cell;
    vertical-align: top;
    padding: 2px;
    width: 250px;
    text-align: left;
    font-weight: bold;
}

.form-item-separator {
    display: table-cell;
    width: 1px;
    vertical-align: top;
    padding: 2px;
}
.form-item-separator-checkbox {
    display: table-cell;
    width: 1px;
    vertical-align: top;
    padding: 2px;
}
.form-item-field {
    clear: right;
    display: table-cell;
    vertical-align: top;
    padding: 1px;
    text-align: left;
}
.form-item-field-checkbox {
    clear: right;
    display: table-cell;
    vertical-align: top;
    padding: 1px;
    text-align: left;
}

.form-item-view {
    clear: right;
    display: table-cell;
    vertical-align: top;
    padding: 1px;
    text-align: left;
}
.form-item-view-checkbox {
    clear: right;
    display: table-cell;
    vertical-align: top;
    padding: 1px;
    text-align: left;
}

.form-item-button {
    clear: both;
    padding: 2px 132px;
    display: table;
    width: 100%;
}

input.k-textbox {
    text-indent: 0px;
}

textarea.k-textbox {
    text-indent: 0px;
}

.required {
    font-weight: bold;
    color: red;
}

#form_edit li .setuju,
.status {
    padding-left: 90px;
}

.valid {
    color: green;
}

.invalid {
    color: red;
}

span.k-tooltip {
    margin-left: 6px;
}

#container-button-footer {
    display: block;
    text-align: center;
    background-color: #ccc;
    padding: 4px;
}

#container-button-top {
    display: block;
    text-align: center;
    background-color: #ccc;
    padding: 4px;
}

.grid_filter {
    background-color: #F5F7F8;
    display: block;
    width: 100%;
}

.item_grid_filter {
    display: inline-block;
    padding: 2px;
}

.grid_toolbar {
    background-color: #F5F7F8;
    width: 100%;
}

/*=========================*/
#logo {
    width: auto;
    margin: auto;
    background-color: #428BCA;
}


html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 30px;
}

/*footer*/
.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 30px;
    background-color: #f5f5f5;
}

.pgrender {
    float: left;
    text-align: left;
    margin: 5px 0;
    padding-left: 10px;
}

.cpright {
    /*float: right;*/
    text-align: center;
    margin: 5px 0;
    padding-right: 10px;
}

/*end footer*/

.k-button.k-button-icontext.v-view {
    min-width: 20px;
}

.k-button.k-button-icontext.v-send {
    min-width: 20px;
}

.k-button.k-button-icontext.v-pencil {
    min-width: 20px;
}

.k-button.k-button-icontext.v-copy {
    min-width: 20px;
}

.k-button.k-button-icontext.v-update {
    min-width: 20px;
}

.k-button.k-button-icontext.v-back {
    min-width: 20px;
}

.k-button.k-button-icontext.v-close {
    min-width: 20px;
}

.k-button.k-button-icontext.v-delete {
    min-width: 20px;
}

.k-button.k-button-icontext.v-cancel {
    min-width: 20px;
}

.k-button.k-button-icontext.v-reset {
    min-width: 20px;
}

.k-button.k-button-icontext.view_map {
    min-width: 20px;
}

.k-button.k-button-icontext.v-docx {
    min-width: 20px;
}

.k-button.k-button-icontext.v-xlsx {
    min-width: 20px;
}

.k-button.k-button-icontext.v-pdf {
    min-width: 20px;
}

.k-button.k-button-icontext.v-setuju {
    min-width: 20px;
}

.k-button.k-button-icontext.v-valid {
    min-width: 20px;
}

.k-button.k-button-icontext.v-undo {
    min-width: 20px;
}

.k-button.k-button-icontext.v-select {
    min-width: 20px;
}

.k-button.k-button-icontext.v-take-over-user {
    min-width: 20px;
}

.k-button.k-button-icontext.v-terima {
    min-width: 20px;
}

.k-button.k-button-icontext.v-kirim {
    min-width: 20px;
}

.k-button.k-button-icontext.v-download {
    min-width: 20px;
}

.k-button.k-button-icontext.v-sertifikat {
    min-width: 20px;
}

/**/
span.k-tooltip {
    margin-left: 6px;
}

.k-widget.k-notification.k-notification-error {
    background-color: #FF4C4C;
    color: #ffffff;
}

.k-notification-error.k-group {
    background: rgba(100%, 0%, 0%, .7);
    color: #ffffff;
}

.wrong-pass {
    min-width: 500px;
    min-height: 100px;
    border-radius: 5px;
    color: white;
    margin-bottom: 10px;
    padding-right: 10px;
}

.wrong-pass h3 {
    font-size: 1.2em;
    padding: 2px;
    font-weight: bold;
}

.wrong-pass img {
    float: left;
    margin: 30px 15px 30px 30px;
}

.wrong-pass p {
    background-color: #ffffff;
    border-radius: 5px;
    color: red;
    display: table;
    margin-right: 10px;
    padding: 5px;
}

.wrong-pass-msg {
    background-color: #ffffff;
    border-radius: 5px;
    color: red;
    display: table-cell;
    margin-right: 10px;
    padding: 5px;
    min-width: 400px;
}

.wrong-pass-msg ul,
.wrong-pass-msg ol {
    padding-left: 10px;
}

.k-notification {
    border: 0;
}

/* Info template */
.k-notification-info.k-group {
    background: rgba(0%, 0%, 0%, .7);
    color: #fff;
}

.new-info {
    width: 300px;
    height: 100px;
}

.new-info h3 {
    font-size: 2em;
    padding: 5px 10px 5px;
}

.new-info p {
    float: left;
    margin: 30px 15px 30px 30px;
}

.new-info img {
    float: left;
    margin: 20px 15px 30px 30px;
}

.lock-info {
    width: 300px;
    height: 100px;
}

.lock-info h3 {
    font-size: 2em;
}

.lock-info p {
    float: left;
}

.lock-info img {
    float: left;
    margin: 20px 15px 30px 30px;
}

/* Success template 
.k-notification-upload-success.k-group {
*/
.k-notification.k-notification-success {
    background: rgba(0%, 60%, 0%, .7);
    color: #fff;
}

.upload-success {
    width: 340px;
    height: 100px;
    padding: 0 30px;
    line-height: 100px;
    display: table;
}

.upload-success h3 {
    font-size: 1.7em;
    font-weight: normal;
    /*display: inline-block;*/
    display: table-cell;
    vertical-align: middle;
}

.upload-success img {
    /*display: inline-block;*/
    vertical-align: middle;
    margin-right: 10px;
}

.k-widget.k-tooltip-validation {
    display: table-cell;
}
/**/
.k-button.k-button-icontext.v-link {
    min-width: 20px;
}

.v-link {
    background: url("../../../themes/default/images/v-link.png") no-repeat;
    background-position: 2px 2px;
    background-color: #fff;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-link:hover {
    background: url("../../../themes/default/images/v-link.png") no-repeat;
    background-position: 2px 2px;
    background-color: #fff;
    height: 20px;
}

a.v-link:focus {
    background: url("../../../themes/default/images/v-link.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

/**/
.k-button.k-button-icontext.v-plus {
    min-width: 20px;
    background-color: deepskyblue;
}

.v-plus {
    background: url("../../../themes/default/images/v-plus.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-plus:hover {
    background: url("../../../themes/default/images/v-plus.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-plus:focus {
    background: url("../../../themes/default/images/v-plus.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-view {
    background: url("../../../themes/default/images/v-view.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-view:hover {
    background: url("../../../themes/default/images/v-view.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-view:focus {
    background: url("../../../themes/default/images/v-view.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-send {
    background: url("../../../themes/default/images/v-send.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-send:hover {
    background: url("../../../themes/default/images/v-send.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-send:focus {
    background: url("../../../themes/default/images/v-send.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-pencil {
    background: url("../../../themes/default/images/v-pencil.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-pencil:hover {
    background: url("../../../themes/default/images/v-pencil.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-pencil:focus {
    background: url("../../../themes/default/images/v-pencil.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-copy {
    background: url("../../../themes/default/images/v-copy.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-copy:hover {
    background: url("../../../themes/default/images/v-copy.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-copy:focus {
    background: url("../../../themes/default/images/v-copy.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}


.v-update {
    background: url("../../../themes/default/images/v-update.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-update:hover {
    background: url("../../../themes/default/images/v-update.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-update:focus {
    background: url("../../../themes/default/images/v-update.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-back {
    background: url("../../../themes/default/images/v-back.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-back:hover {
    background: url("../../../themes/default/images/v-back.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-back:focus {
    background: url("../../../themes/default/images/v-back.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-close {
    background: url("../../../themes/default/images/v-close.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-close:hover {
    background: url("../../../themes/default/images/v-close.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-close:focus {
    background: url("../../../themes/default/images/v-close.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-delete {
    background: url("../../../themes/default/images/v-delete.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-delete:hover {
    background: url("../../../themes/default/images/v-delete.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-delete:focus {
    background: url("../../../themes/default/images/v-delete.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-cancel {
    background: url("../../../themes/default/images/v-cancel.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-cancel:hover {
    background: url("../../../themes/default/images/v-cancel.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-cancel:focus {
    background: url("../../../themes/default/images/v-cancel.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-reset {
    background: url("../../../themes/default/images/change_password.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-reset:hover {
    background: url("../../../themes/default/images/change_password.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-reset:focus {
    background: url("../../../themes/default/images/change_password.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.view_map {
    background: url("../../../themes/default/images/view_map.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.view_map:hover {
    background: url("../../../themes/default/images/view_map.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.view_map:focus {
    background: url("../../../themes/default/images/view_map.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-docx {
    background: url("../../../themes/default/images/v-docx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-docx:hover {
    background: url("../../../themes/default/images/v-docx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-docx:focus {
    background: url("../../../themes/default/images/v-docx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-xlsx {
    background: url("../../../themes/default/images/v-xlsx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-xlsx:hover {
    background: url("../../../themes/default/images/v-xlsx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-xlsx:focus {
    background: url("../../../themes/default/images/v-xlsx.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-pdf {
    background: url("../../../themes/default/images/v-pdf.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-pdf:hover {
    background: url("../../../themes/default/images/v-pdf.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-pdf:focus {
    background: url("../../../themes/default/images/v-pdf.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-setuju {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-setuju:hover {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-setuju:focus {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-valid {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-valid:hover {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-valid:focus {
    background: url("../../../themes/default/images/v-valid.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-undo {
    background: url("../../../themes/default/images/v-undo.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-undo:hover {
    background: url("../../../themes/default/images/v-undo.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-undo:focus {
    background: url("../../../themes/default/images/v-undo.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-select {
    background: url("../../../themes/default/images/v-select.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-select:hover {
    background: url("../../../themes/default/images/v-select.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-select:focus {
    background: url("../../../themes/default/images/v-select.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-take-over-user {
    background: url("../../../themes/default/images/take_over_user.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-take-over-user:hover {
    background: url("../../../themes/default/images/take_over_user.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-take-over-user:focus {
    background: url("../../../themes/default/images/take_over_user.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-terima {
    background: url("../../../themes/default/images/v-terima.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-terima:hover {
    background: url("../../../themes/default/images/v-terima.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-terima:focus {
    background: url("../../../themes/default/images/v-terima.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}


.v-kirim {
    background: url("../../../themes/default/images/v-kirim.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-kirim:hover {
    background: url("../../../themes/default/images/v-kirim.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-kirim:focus {
    background: url("../../../themes/default/images/v-kirim.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-download {
    background: url("../../../themes/default/images/v-download.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-download:hover {
    background: url("../../../themes/default/images/v-download.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-download:focus {
    background: url("../../../themes/default/images/v-download.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.v-sertifikat {
    background: url("../../../themes/default/images/v-sertifikat.png") no-repeat;
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 20px;
}

a.v-sertifikat:hover {
    background: url("../../../themes/default/images/v-sertifikat.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

a.v-sertifikat:focus {
    background: url("../../../themes/default/images/v-sertifikat.png") no-repeat;
    background-position: 2px 2px;
    background-color: #97DCF8;
    height: 20px;
}

.k-button.k-button-icontext.v-addterduga {
    min-width: 20px;
    background: url("../../../themes/default/images/v-addterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    padding: 8px 10px;
}

.v-addterduga {
    background: url("../../../themes/default/images/v-addterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1px;
    padding-right: 1px;
    height: var(--action-height);
}

a.v-addterduga:hover {
    background: url("../../../themes/default/images/v-addterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

a.v-addterduga:focus {
    background: url("../../../themes/default/images/v-addterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

.k-button.k-button-icontext.v-linkterduga {
    min-width: 20px;
    background: url("../../../themes/default/images/v-linkterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    padding: 8px 10px;
}

.v-linkterduga {
    background: url("../../../themes/default/images/v-linkterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1px;
    padding-right: 1px;
    height: var(--action-height);
}

a.v-linkterduga:hover {
    background: url("../../../themes/default/images/v-linkterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

a.v-linkterduga:focus {
    background: url("../../../themes/default/images/v-linkterduga.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

.k-button.k-button-icontext.v-addtpt {
    min-width: 20px;
    background: url("../../../themes/default/images/v-addtpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    padding: 8px 10px;
}

.v-addtpt {
    background: url("../../../themes/default/images/v-addtpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1px;
    padding-right: 1px;
    height: var(--action-height);
}

a.v-addtpt:hover {
    background: url("../../../themes/default/images/v-addtpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

a.v-addtpt:focus {
    background: url("../../../themes/default/images/v-addtpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

.k-button.k-button-icontext.v-linktpt {
    min-width: 20px;
    background: url("../../../themes/default/images/v-linktpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    padding: 8px 10px;
}

.v-linktpt {
    background: url("../../../themes/default/images/v-linktpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #daecf4;
    padding-left: 1px;
    padding-right: 1px;
    height: var(--action-height);
}

a.v-linktpt:hover {
    background: url("../../../themes/default/images/v-linktpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

a.v-linktpt:focus {
    background: url("../../../themes/default/images/v-linktpt.png") no-repeat;
    background-size: var(--action-icon-size);
    background-position: 2px 2px;
    background-color: #97dcf8;
    height: var(--action-height);
}

k-grid-edit2 {
    color: red;
}

.item_list {
    padding-left: 12px;
    margin-bottom: 2px;
}

.k-grid-header .k-header {
    overflow: visible;
    white-space: normal;
}

/*
.k-grid .k-grid-content {
    min-height: 382px;
}
*/
.k-upload-files {
    min-width: 500px;
}

.k-dropzone {
    padding: 2px;
}


.item_detil_label {
    width: 120px;
    display: table-cell;
}

.item_detil_sep {
    width: 2px;
    display: table-cell;
}

.item_detil_value {
    display: table-cell;
}

.panel-heading {
    font-weight: bold;
    text-align: left;
    padding: 2px;
}

.panel-body {
    padding: 2px 10px 2px 10px;
}

.panel-footer {
    padding: 2px 5px;
}

.panel {
    margin-bottom: 10px;
}

.display_none {
    display: none;
}

.fieldlist {
    margin: 0 0 -1em;
    padding: 0;
}

.fieldlist li {
    list-style: none;
    padding-bottom: 1em;
}

.table>tbody>tr>th {
    text-align: center;
    vertical-align: middle;
}

.btn-sm,
.btn-group-sm>.btn {

    padding: 2px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;

}

a[aria-expanded=true] .glyphicon-plus {
    display: none;
}

a[aria-expanded=false] .glyphicon-minus {
    display: none;
}

.pointer {
    cursor: pointer;
}

.table-bordered>thead>tr>th,
.table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>th,
.table-bordered>thead>tr>td,
.table-bordered>tbody>tr>td,
.table-bordered>tfoot>tr>td {
    border: 1px solid #555555;
}

.badge {
    color: #000000;
    background-color: orange;
}

.footer_body {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #E1F0F7;
    color: #000000;
    text-align: center;
}

.btn-warning {
    color: #000000;
}

.btn-warning:hover {
    color: #0000ff;
}

.help-block {
    display: inline-block;
}

.k-tooltip-content {
    text-align: left;
}

.button_oat {
    color: #003f59;
    border-color: #a3d0e4;
    background-color: #f0d602 !important;
}

/*
.k-button {
    color: #003f59;
    border-color: #a3d0e4 !important;
    background-color: #f0d602 !important;
}
*/
.table>thead>tr>th {
    text-align: center;
    vertical-align: middle;
}

.delete_tanggal {
    cursor: pointer;
}

td ol,
td ul {
    padding-left: 12px !important;
}

.view_only {
    background-color: #F4F9FC !important;
}

.table>tbody {
    border-top: 1px solid #555;
}

.table>tbody+tbody {
    border-top: 1px solid #555;
}

.table-bordered {
    border: 1px solid #555;
}

.content-error {
    margin-bottom: 2px;
    background-color: #ffffff;
    color: #000000;
    margin-left: 80px;
    padding: 5px;
    min-height: 65px;
    border-radius: 5px;
}

input[readonly="readonly"],
input[readonly] {
    color: #003f59 !important;
    background-color: #edf5f9 !important;
}

textarea[readonly="readonly"],
textarea[readonly] {
    color: #003f59 !important;
    background-color: #edf5f9 !important;
}

.k-button {
    margin: 2px;
}

.statusNIK {
    font-size: 9pt;
    display: inherit;
    padding: 4px 10px;
    border-radius: 10px;
}

.panel_no_data {
    width: 100%;
    height: auto;
    border: 1px solid;
    text-align: center;
    padding: 100px;
    font-size: xx-large;
    background-color: #f3f2d2;
  }

  .export_detil {
    width: 100%;
    padding: 4px;
    border-left: 1px solid silver;
    border-top: 1px solid silver;
  }
  
  .export_detil th {
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid silver;
    border-bottom: 1px solid silver;
    padding: 4px;
  }
  
  .export_detil td {
    vertical-align: top;
    border-right: 1px solid silver;
    border-bottom: 1px solid silver;
    padding: 4px;
  }