/* Start: Login */

.bp-logo-login {
  height: 54px;
  width: auto;
  margin: 0 auto;
  /* display: flex; */
}

.bp-wrap-logo {
  margin-bottom: 40px;
  margin-left: 94px;
}

.bp-wrap-logo .bp-logo {
  position: absolute;
  margin-left: -94px;
  height: 78px;
  width: auto;
}

.bp-wrap-logo .title {
  display: block;
  font-size: 18px;
  color: #000;
  font-weight: bold;
}

.bp-wrap-logo .subtitle {
  display: block;
}

@media only screen and (max-width: 572px) {
  .bp-wrap-logo {
    margin-left: 0;
  }

  .bp-wrap-logo .bp-logo {
    position: relative;
    margin-left: 0;
    height: 52px;
    margin-bottom: 12px;
  }

  .bp-wrap-logo .title {
    font-size: 16px;
  }

  .bp-wrap-logo .subtitle {
    font-size: 12px;
  }
}

@media screen and (min-width: 992px) and (max-width: 1439px) {
  .bp-logo-login {
    height: 60px;
  }
}

.bp-form-control {
  border: 1px solid rgb(211, 211, 211) !important;
}

/* End: Login */

/* Start: Notification Card */

.bp-notif-card {
  padding: 10px 15px;
}

.bp-notif-card.error {
  border: 1px solid #7f1d1d;
  background: #fee2e2;
}

.bp-notif-card.success {
  border: 1px solid #14532d;
  background: #dcfce7;
}

.bp-notif-card .bp-notif-message {
  margin: 0;
  font-size: 14px;
}

.bp-notif-card.error .bp-notif-message {
  color: #7f1d1d;
}

.bp-notif-card.success .bp-notif-message {
  color: #14532d;
}

/* End: Notification Card */

/* Start: Sidebar */

.sidebar {
  background: #fefefe !important;
}

/* body.app.is-collapsed .bp-logo-sidebar {
  display: none;
} */

.bp-logo-sidebar {
  height: 54px;
  width: auto;
  margin-left: 9px;
  margin-top: 5px;
  display: flex;
}

@media screen and (min-width: 992px) and (max-width: 1439px) {
  /* .bp-logo-sidebar {
    display: none;
    height: 60px;
  } */
}

@media only screen and (max-width: 991px) {
  .bp-logo-sidebar {
    height: 47px;
    margin-top: 8.5px;
    margin-left: 0;
  }
}

li.nav-item.actived > a.sidebar-link > span.icon-holder > i {
  color: #673ab7 !important;
}

li.nav-item.actived > a.sidebar-link > span.title {
  color: #313435;
}

li.nav-item.dropdown > ul.dropdown-menu > li > a.sidebar-link {
  margin-left: 3px;
}

.icon-holder > i {
  position: relative;
  top: 2px;
}

/* End: Sidebar */

/* Start: Form */

/* Detail Kurikulum */
/* #stase_input_box {
  width: 100%;
} */

/* End: Form */

/* Datatable */

.dataTables_wrapper {
  overflow-x: scroll !important;
}

/* wrap add button */
.datatables-add-button {
  margin: 0;
}

/* buttons */
.ui-button {
  background: #ffffff;
}

.ui-button:hover {
  border-color: rgb(211, 211, 211);
  transition: none;
  box-shadow: 1px 3px 5px #ecf0f1;
}

.ui-button .ui-icon {
  display: none;
}

.ui-button .ui-button-text {
  color: rgb(85, 85, 85);
  padding: 8px 10px;
  font-size: 14px;
  transition: none;
}

.ui-button .ui-button-text:hover {
  color: rgb(85, 85, 85);
}

.add_button {
  background: transparent;
  border-color: #673ab7 !important;
}

.add_button span {
  color: #673ab7 !important;
}

.edit_button {
  background: transparent;
  border-color: #4caf50 !important;
}

.edit_button span {
  color: #4caf50 !important;
}

.delete_button {
  background: transparent;;
  border-color: #f44336 !important;
}

.delete_button span {
  color: #f44336 !important;
}

.custom_button {
  background: transparent;;
  border-color: #6c757d !important;
}

.custom_button span {
  color: #6c757d !important;
}

/* datatable toolbar */
div.dataTables_wrapper .ui-widget-header {
  background: transparent;
  border-color: transparent;
}

.dataTables_wrapper .ui-toolbar {
  background: #ffffff;
  padding: 8px 10px;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
  font-size: 14px;
}

.dataTables_wrapper .dataTables_length select {
  background: #ffffff;
  border: 1px solid rgb(211, 211, 211) !important;
}

.dataTables_wrapper .dataTables_filter input {
  border: 1px solid rgb(211, 211, 211) !important;
  padding: 8px 10px !important;
}

/* thead */
table.dataTable thead th {
  border-color: rgb(211, 211, 211);
  background: #ffffff;
  padding: 8px 10px;
  font-weight: 600;
}

/* tbody */
table.dataTable tbody {
  border: 1px solid rgb(211, 211, 211);
}

table.dataTable tbody tr td {
  border-bottom: 1px solid rgb(211, 211, 211);
  padding: 8px 10px;
}

table.dataTable tr.odd td.sorting_1 {
  /* border: 1px solid rgb(211, 211, 211); */
  background: #fafafa;
}

table.dataTable tr.even td.sorting_1 {
  /* border: 1px solid rgb(211, 211, 211); */
  background: #ffffff;
}

table.dataTable tbody tr.odd td {
  background: #fafafa;
}

/* tfoot */
table.dataTable tfoot th {
  border-color: rgb(211, 211, 211);
  background: #ffffff;
  padding: 8px 10px;
  font-weight: 600;
}

table.dataTable tfoot th .refresh-data {
  display: none;
}

table.dataTable tfoot th input {
  border: 1px solid rgb(211, 211, 211);
  padding: 8px 10px !important;
  box-shadow: none !important;
}

.dataTables_wrapper .dataTables_info {
  padding-top: 0;
  font-size: 14px;
  color: #313435;
  width: 300px;
}

.dataTables_wrapper .dataTables_paginate {
  width: calc(100% - 332px) !important;
  margin-right: 0 !important;
}

.dataTables_wrapper .dataTables_paginate .first,
/* .dataTables_wrapper .dataTables_paginate .previous, */
/* .dataTables_wrapper .dataTables_paginate .next, */
.dataTables_wrapper .dataTables_paginate .last {
  display: none;
}

@media only screen and (max-width: 640px) {
  .dataTables_wrapper .dataTables_info {
    width: 100%;
    margin-bottom: 8px;
  }

  .dataTables_wrapper .dataTables_paginate {
    width: 100% !important;
  }
}

/* End: Datatable */

/* Form */

.ui-widget-content {
  border: 1px solid rgb(211, 211, 211);
  box-shadow: none;
  margin-top: 25px;
}

.datatables-add-button {
  margin-top: 25px;
}

.ui-accordion-header {
  background: #ffffff !important;
  padding: 16px 20px !important;
  border: 0 solid transparent !important;
  border-bottom: 1px solid #dddddd !important;
}

.form-title-left {
  padding: 0;
  font-weight: 600;
  font-size: 16px;
}

form#crudForm .form-field-box {
  margin: 0;
  padding: 16px 20px;
}

form#crudForm .form-field-box.odd {
  background: #fafafa;
}

form#crudForm .form-field-box.even {
  background: #ffffff;
}

form#crudForm .form-field-box .form-display-as-box {
  margin-top: 6px;
  padding: 0;
}

@media only screen and (max-width: 640px) {
  form#crudForm .form-field-box .form-display-as-box {
    margin-bottom: 4px;
    width: 100%;
  }
}

form#crudForm .form-field-box .form-display-as-box .required {
  color: #f44336;
  margin-left: 2px;
}

form#crudForm .form-field-box .form-input-box {
  width: calc(100% - 200px);
}

@media only screen and (max-width: 640px) {
  form#crudForm .form-field-box .form-input-box {
    width: calc(100%);
  }
}

form#crudForm .form-field-box .form-input-box input[type="text"],
form#crudForm .form-field-box .form-input-box input[type="password"],
form#crudForm .form-field-box .form-input-box select,
form#crudForm .form-field-box .form-input-box textarea,
form#crudForm .form-field-box .form-input-box input[type="datetime-local"],
form#crudForm .form-field-box .form-input-box input[type="date"] {
  border-radius: 0.375rem;
  font-size: 14px;
  background: #ffffff;
  padding: 8px 10px;
  height: auto;
  width: 100%;
  box-shadow: none;
  border: 1px solid rgb(211, 211, 211);
}

form#crudForm .form-field-box .form-input-box textarea {
  height: 150px;
}

.qq-upload-button {
  background: #ffffff;
  border-color: rgb(211, 211, 211);
  transition: none;
  box-shadow: 1px 3px 5px #ecf0f1;
  color: rgb(85, 85, 85);
  padding: 8px 10px;
  font-size: 14px;
  transition: none;
}

.qq-upload-button:hover {
  background: #ffffff;
}

.chosen-container {
  width: 100% !important:
}

.chosen-container .chosen-single {
  font-size: 14px;
  background: #ffffff;
  padding: 8px 10px;
  height: auto;
  box-shadow: none;
  border: 1px solid rgb(211, 211, 211);
}

.chosen-container .chosen-single div b {
  display: none;
}

.chosen-container-single .chosen-single abbr {
  top: 15px;
  /* right: 8px; */
}

.chosen-container .chosen-choices {
  border-color: rgb(211, 211, 211);
  border-radius: 0.375rem;
  display: flex;
  flex-flow: row;
  align-items: center;
}

.chosen-container-active .chosen-choices {
  border-color: rgb(211, 211, 211);
  box-shadow: none;
}

.chosen-container .chosen-choices .search-field input {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

form#crudForm .form-field-box .form-input-box .pretty-radio-buttons {
  margin: 0;
}

form#crudForm .form-field-box .form-input-box .pretty-radio-buttons .radio {
  padding-left: 0;
}

form#crudForm .form-field-box .form-input-box .pretty-radio-buttons .radio label {
  padding-left: 0;
}

form#crudForm .form-field-box .form-input-box .pretty-radio-buttons .radio label input[type="radio"] {
  opacity: 1;
  margin-right: 8px;
}

.radio label:before,
.radio label:after {
  display: none !important;
}

.line-1px {
  display: none;
}

form#crudForm .buttons-box {
  border-top: 1px solid rgb(211, 211, 211);
  padding: 16px 20px 16px 220px;
}

@media only screen and (max-width: 640px) {
  form#crudForm .buttons-box {
    border-top: 1px solid rgb(211, 211, 211);
    padding: 16px 20px;
  }
}

form#crudForm .buttons-box .form-button-box {
  margin: 0;
}

form#crudForm .buttons-box .form-button-box input[type="button"] {
  background: #ffffff;
  margin-right: 8px;
  color: rgb(85, 85, 85);
  padding: 8px 10px;
  font-size: 14px !important;
}

form#crudForm .buttons-box .form-button-box #form-button-save {
  display: none;
}

form#crudForm .buttons-box .form-button-box #save-and-go-back-button {
  background: transparent;
  border: 1px solid #673ab7;
  color: #673ab7;
}

/* form#crudForm .buttons-box .form-button-box #cancel-button {
  background: transparent;
  border: 1px solid #f44336;
  color: #f44336;
} */

/* End: Form */

.bp-custom-message {
  background: #ffffff;
  padding: 8px 16px;
  border: 1px solid rgb(211, 211, 211);
  border-left: 4px solid #00bcd4;
}

.bp-floating {
  background: #673ab7;;
  padding: 4px 20px;
  padding-left: 20px;
  position: fixed;
  top: 0;
  width: 100%;
  left: 0;
  z-index: 999;
}

.bp-floating.error {
  background: #f44336;
}

/* @media screen and (min-width: 992px) and (max-width: 1439px) {
  .bp-floating {
    padding-left: 90px;
  }
}

@media screen and (max-width: 991px) {
  .bp-floating {
    padding-left: 20px;
  }
} */

.bp-floating p {
  margin-bottom: 5px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}

@media only screen and (max-width: 640px) {
  .bp-floating {
    padding: 4px 16px;
  }

  .bp-floating p {
    font-size: 14px;
  }
}

#loader {
  top: 0;
  left: 0;
}

#choosePesertaDidik,
#chooseDivisi {
  float: right;
  width: auto;
}

@media only screen and (max-width: 360px) {
  #choosePesertaDidik,
  #chooseDivisi {
    float: left;
    width: 100%;
    margin-bottom: 8px;
  }
}

/* table: kompetensi */
table.table-kompetensi {
  min-width: 640px;
}

table.table-kompetensi thead tr th,
table.table-kompetensi thead tr td,
table.table-kompetensi tbody tr th,
table.table-kompetensi tbody tr td {
  vertical-align: middle;
}

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

.bp-bg-gray {
  background: rgb(226, 227, 229) !important;
}

.bp-bg-success {
  background: rgb(219, 239, 220) !important;
}

.bp-bg-error {
  background: rgb(253, 217, 215) !important;
}

@media only screen and (max-width: 572px) {
  .header .header-container .nav-right .notifications .dropdown-menu {
    min-width: 320px !important;
  }

  .header .header-container .nav-right .dropdown-menu {
    right: -207px !important;
  }
}

.chosen-multiple-select {
  display: none !important;
}