.btn.btn-org {
    color: #ffffff;
    background-color: #FF8364;
    border-color: #FF8364;
  }
  .btn.btn-org i {
    color: #ffffff;
  }
  .btn.btn-org .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-org .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-org.dropdown-toggle:after {
    color: #2376c9;
  }
  .btn.btn-org:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-org:focus:not(.btn-text), .btn.btn-org.focus:not(.btn-text) {
    color: #ffffff;
    background-color: #f86b48;
    border-color: #f86b48;
  }
  .btn.btn-org:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-org:focus:not(.btn-text) i, .btn.btn-org.focus:not(.btn-text) i {
    color: #ffffff;
  }
  .btn.btn-org:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg g [fill], .btn.btn-org:focus:not(.btn-text) .svg-icon svg g [fill], .btn.btn-org.focus:not(.btn-text) .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-org:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg:hover g [fill], .btn.btn-org:focus:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-org.focus:not(.btn-text) .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-org:hover:not(.btn-text):not(:disabled):not(.disabled).dropdown-toggle:after, .btn.btn-org:focus:not(.btn-text).dropdown-toggle:after, .btn.btn-org.focus:not(.btn-text).dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-org.disabled, .btn.btn-org:disabled {
    color: #ffffff;
    background-color: #FF8364;
    border-color: #FF8364;
  }
  .btn.btn-org.disabled i, .btn.btn-org:disabled i {
    color: #ffffff;
  }
  .btn.btn-org.disabled .svg-icon svg g [fill], .btn.btn-org:disabled .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-org.disabled .svg-icon svg:hover g [fill], .btn.btn-org:disabled .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-org.disabled.dropdown-toggle:after, .btn.btn-org:disabled.dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-org:not(:disabled):not(.disabled):active:not(.btn-text), .btn.btn-org:not(:disabled):not(.disabled).active, .show > .btn.btn-org.dropdown-toggle, .show .btn.btn-org.btn-dropdown {
    color: #ffffff;
    background-color: #f86b48;
    border-color: #f86b48;
  }
  .btn.btn-org:not(:disabled):not(.disabled):active:not(.btn-text) i, .btn.btn-org:not(:disabled):not(.disabled).active i, .show > .btn.btn-org.dropdown-toggle i, .show .btn.btn-org.btn-dropdown i {
    color: #ffffff;
  }
  .btn.btn-org:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg g [fill], .btn.btn-org:not(:disabled):not(.disabled).active .svg-icon svg g [fill], .show > .btn.btn-org.dropdown-toggle .svg-icon svg g [fill], .show .btn.btn-org.btn-dropdown .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-org:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-org:not(:disabled):not(.disabled).active .svg-icon svg:hover g [fill], .show > .btn.btn-org.dropdown-toggle .svg-icon svg:hover g [fill], .show .btn.btn-org.btn-dropdown .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-org:not(:disabled):not(.disabled):active:not(.btn-text).dropdown-toggle:after, .btn.btn-org:not(:disabled):not(.disabled).active.dropdown-toggle:after, .show > .btn.btn-org.dropdown-toggle.dropdown-toggle:after, .show .btn.btn-org.btn-dropdown.dropdown-toggle:after {
    color: #ffffff;
  }

  .btn.btn-biru {
    color: #ffffff;
    background-color: #3699FF;
    border-color: #3699FF;
  }
  .btn.btn-biru i {
    color: #ffffff;
  }
  .btn.btn-biru .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-biru .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-biru.dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-biru:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-biru:focus:not(.btn-text), .btn.btn-biru.focus:not(.btn-text) {
    color: #ffffff;
    background-color: #2376c9;
    border-color: #2376c9;
  }
  .btn.btn-biru:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-biru:focus:not(.btn-text) i, .btn.btn-biru.focus:not(.btn-text) i {
    color: #ffffff;
  }
  .btn.btn-biru:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg g [fill], .btn.btn-biru:focus:not(.btn-text) .svg-icon svg g [fill], .btn.btn-biru.focus:not(.btn-text) .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-biru:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg:hover g [fill], .btn.btn-biru:focus:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-biru.focus:not(.btn-text) .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-biru:hover:not(.btn-text):not(:disabled):not(.disabled).dropdown-toggle:after, .btn.btn-biru:focus:not(.btn-text).dropdown-toggle:after, .btn.btn-biru.focus:not(.btn-text).dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-biru.disabled, .btn.btn-biru:disabled {
    color: #ffffff;
    background-color: #3699FF;
    border-color: #3699FF;
  }
  .btn.btn-biru.disabled i, .btn.btn-biru:disabled i {
    color: #ffffff;
  }
  .btn.btn-biru.disabled .svg-icon svg g [fill], .btn.btn-biru:disabled .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-biru.disabled .svg-icon svg:hover g [fill], .btn.btn-biru:disabled .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-biru.disabled.dropdown-toggle:after, .btn.btn-biru:disabled.dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-biru:not(:disabled):not(.disabled):active:not(.btn-text), .btn.btn-biru:not(:disabled):not(.disabled).active, .show > .btn.btn-biru.dropdown-toggle, .show .btn.btn-biru.btn-dropdown {
    color: #ffffff;
    background-color: #2376c9;
    border-color: #2376c9;
  }
  .btn.btn-biru:not(:disabled):not(.disabled):active:not(.btn-text) i, .btn.btn-biru:not(:disabled):not(.disabled).active i, .show > .btn.btn-biru.dropdown-toggle i, .show .btn.btn-biru.btn-dropdown i {
    color: #ffffff;
  }
  .btn.btn-biru:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg g [fill], .btn.btn-biru:not(:disabled):not(.disabled).active .svg-icon svg g [fill], .show > .btn.btn-biru.dropdown-toggle .svg-icon svg g [fill], .show .btn.btn-biru.btn-dropdown .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-biru:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-biru:not(:disabled):not(.disabled).active .svg-icon svg:hover g [fill], .show > .btn.btn-biru.dropdown-toggle .svg-icon svg:hover g [fill], .show .btn.btn-biru.btn-dropdown .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-biru:not(:disabled):not(.disabled):active:not(.btn-text).dropdown-toggle:after, .btn.btn-biru:not(:disabled):not(.disabled).active.dropdown-toggle:after, .show > .btn.btn-biru.dropdown-toggle.dropdown-toggle:after, .show .btn.btn-biru.btn-dropdown.dropdown-toggle:after {
    color: #ffffff;
  }

  
 .btn.btn-icnav {
    color: #B5B5C3;
    background-color: transparent;
    border-color: transparent;
  }
  .btn.btn-icnav i {
    color: #B5B5C3;
  }
  .btn.btn-icnav .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #B5B5C3;
  }
  .btn.btn-icnav .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-icnav.dropdown-toggle:after {
    color: #B5B5C3;
  }
  .btn.btn-icnav:hover.i.ic-nav-off {
      display: none;
    color: #FF8364;
    background-color: #F3F6F9;
    border-color: transparent;
  }
  
  .btn.btn-icnav:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-icnav:focus:not(.btn-text), .btn.btn-icnav.focus:not(.btn-text) {
    color: #FF8364;
    background-color: #F3F6F9;
    border-color: transparent;
  }
  .btn.btn-icnav:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-icnav:focus:not(.btn-text) i, .btn.btn-icnav.focus:not(.btn-text) i {
    color: #FF8364;
  }
  .btn.btn-icnav:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg g [fill], .btn.btn-icnav:focus:not(.btn-text) .svg-icon svg g [fill], .btn.btn-icnav.focus:not(.btn-text) .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #FF8364;
  }
  .btn.btn-icnav:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg:hover g [fill], .btn.btn-icnav:focus:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-icnav.focus:not(.btn-text) .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-icnav:hover:not(.btn-text):not(:disabled):not(.disabled).dropdown-toggle:after, .btn.btn-icnav:focus:not(.btn-text).dropdown-toggle:after, .btn.btn-icnav.focus:not(.btn-text).dropdown-toggle:after {
    color: #FF8364;
  }
  .btn.btn-icnav.disabled, .btn.btn-icnav:disabled {
    color: #B5B5C3;
    background-color: transparent;
    border-color: transparent;
  }
  .btn.btn-icnav.disabled i, .btn.btn-icnav:disabled i {
    color: #B5B5C3;
  }
  .btn.btn-icnav.disabled .svg-icon svg g [fill], .btn.btn-icnav:disabled .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #B5B5C3;
  }
  .btn.btn-icnav.disabled .svg-icon svg:hover g [fill], .btn.btn-icnav:disabled .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-icnav.disabled.dropdown-toggle:after, .btn.btn-icnav:disabled.dropdown-toggle:after {
    color: #B5B5C3;
  }
  .btn.btn-icnav:not(:disabled):not(.disabled):active:not(.btn-text), .btn.btn-icnav:not(:disabled):not(.disabled).active, .show > .btn.btn-icnav.dropdown-toggle, .show .btn.btn-icnav.btn-dropdown {
    color: #FF8364;
    background-color: #F3F6F9;
    border-color: transparent;
  }
  .btn.btn-icnav:not(:disabled):not(.disabled):active:not(.btn-text) i, .btn.btn-icnav:not(:disabled):not(.disabled).active i, .show > .btn.btn-icnav.dropdown-toggle i, .show .btn.btn-icnav.btn-dropdown i {
    color: #FF8364;
  }
  .btn.btn-icnav:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg g [fill], .btn.btn-icnav:not(:disabled):not(.disabled).active .svg-icon svg g [fill], .show > .btn.btn-icnav.dropdown-toggle .svg-icon svg g [fill], .show .btn.btn-icnav.btn-dropdown .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #FF8364;
  }
  .btn.btn-icnav:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-icnav:not(:disabled):not(.disabled).active .svg-icon svg:hover g [fill], .show > .btn.btn-icnav.dropdown-toggle .svg-icon svg:hover g [fill], .show .btn.btn-icnav.btn-dropdown .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-icnav:not(:disabled):not(.disabled):active:not(.btn-text).dropdown-toggle:after, .btn.btn-icnav:not(:disabled):not(.disabled).active.dropdown-toggle:after, .show > .btn.btn-icnav.dropdown-toggle.dropdown-toggle:after, .show .btn.btn-icnav.btn-dropdown.dropdown-toggle:after {
    color: #FF8364;
  }

  

  .btn.btn-hijau {
    color: #ffffff;
    background-color: #1BC5BD;
    border-color: #1BC5BD;
  }
  .btn.btn-hijau i {
    color: #ffffff;
  }
  .btn.btn-hijau .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-hijau .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-hijau.dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-hijau:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-hijau:focus:not(.btn-text), .btn.btn-hijau.focus:not(.btn-text) {
    color: #ffffff;
    background-color: #00a098;
    border-color: #00a098;
  }
  .btn.btn-hijau:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-hijau:focus:not(.btn-text) i, .btn.btn-hijau.focus:not(.btn-text) i {
    color: #ffffff;
  }
  .btn.btn-hijau:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg g [fill], .btn.btn-hijau:focus:not(.btn-text) .svg-icon svg g [fill], .btn.btn-hijau.focus:not(.btn-text) .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-hijau:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-icon svg:hover g [fill], .btn.btn-hijau:focus:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-hijau.focus:not(.btn-text) .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-hijau:hover:not(.btn-text):not(:disabled):not(.disabled).dropdown-toggle:after, .btn.btn-hijau:focus:not(.btn-text).dropdown-toggle:after, .btn.btn-hijau.focus:not(.btn-text).dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-hijau.disabled, .btn.btn-hijau:disabled {
    color: #ffffff;
    background-color: #1BC5BD;
    border-color: #1BC5BD;
  }
  .btn.btn-hijau.disabled i, .btn.btn-hijau:disabled i {
    color: #ffffff;
  }
  .btn.btn-hijau.disabled .svg-icon svg g [fill], .btn.btn-hijau:disabled .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-hijau.disabled .svg-icon svg:hover g [fill], .btn.btn-hijau:disabled .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-hijau.disabled.dropdown-toggle:after, .btn.btn-hijau:disabled.dropdown-toggle:after {
    color: #ffffff;
  }
  .btn.btn-hijau:not(:disabled):not(.disabled):active:not(.btn-text), .btn.btn-hijau:not(:disabled):not(.disabled).active, .show > .btn.btn-hijau.dropdown-toggle, .show .btn.btn-hijau.btn-dropdown {
    color: #ffffff;
    background-color: #00a098;
    border-color: #00a098;
  }
  .btn.btn-hijau:not(:disabled):not(.disabled):active:not(.btn-text) i, .btn.btn-hijau:not(:disabled):not(.disabled).active i, .show > .btn.btn-hijau.dropdown-toggle i, .show .btn.btn-hijau.btn-dropdown i {
    color: #ffffff;
  }
  .btn.btn-hijau:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg g [fill], .btn.btn-hijau:not(:disabled):not(.disabled).active .svg-icon svg g [fill], .show > .btn.btn-hijau.dropdown-toggle .svg-icon svg g [fill], .show .btn.btn-hijau.btn-dropdown .svg-icon svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #ffffff;
  }
  .btn.btn-hijau:not(:disabled):not(.disabled):active:not(.btn-text) .svg-icon svg:hover g [fill], .btn.btn-hijau:not(:disabled):not(.disabled).active .svg-icon svg:hover g [fill], .show > .btn.btn-hijau.dropdown-toggle .svg-icon svg:hover g [fill], .show .btn.btn-hijau.btn-dropdown .svg-icon svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
  }
  .btn.btn-hijau:not(:disabled):not(.disabled):active:not(.btn-text).dropdown-toggle:after, .btn.btn-hijau:not(:disabled):not(.disabled).active.dropdown-toggle:after, .show > .btn.btn-hijau.dropdown-toggle.dropdown-toggle:after, .show .btn.btn-hijau.btn-dropdown.dropdown-toggle:after {
    color: #ffffff;
  }

  .text-biru {
    color: #3699FF !important;
  }

  .bg-biru {
    background-color: #3699FF !important;
  }

.container-border-dashed {
    border:1px dashed #E5EAEE;
    border-radius: 4px;
}

.container-bg-light-blue {
    background-color: #f3fefe;
}

.container-area {
    display: flex; 
    flex-direction: row; 
    align-items: center;
}

.container-upload-single-img {
  width:450px; 
  height: 150px; 
  box-shadow: 0 0.1rem 0.5rem 0.1rem rgba(0, 0, 0, 0.075);
}

.area-label {
    display: flex; 
    flex-direction: column; 
    align-items: flex-start;
    padding-right: 1.25rem;
}
.area-usr {
    display: flex; 
    flex-direction: column; 
    align-items: flex-start;
}

.border-dashed-2 {
  border:2px dashed #E5EAEE;
  border-radius: 4px;
}

.bg-abu {
  background-color: #f2f2f2d3 !important;
}

.w-250 {
  width: 250px !important;
}

.align-vertical-center {
  align-items: center;
}


@media (min-width: 576px) {
    .container-sm, .container {
    max-width: 440px !important;
    }
}
@media (min-width: 768px) {
    .container-md, .container-sm, .container {
    max-width: 768px !important;
    }
}
@media (min-width: 992px) {
    .container-lg, .container-md, .container-sm, .container {
    max-width: 860px !important;
    margin-left: 140px;
    }
}
@media (min-width: 1100px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 940px !important;
    margin-left: 140px;
    }
}
@media (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1040px !important;
    margin-left: 140px;
    }
}
@media (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1240px !important;
    margin-left: 140px;
    }
}

.container .xa-div-body {
    width:calc(100vw - 220px)
}
@media only screen and (max-width: 600px) {
    .container .xa-div-body,#kt_content .div-kt-content {
        width:100%;
    }
    #kt_content .div-kt-content{
        margin: 0!important;
    }
    .card-body{
        padding: 0 0 0 auto;
    }
}

@media (min-width: 600px) and (max-width: 900px) {
    .container .xa-div-body {
        width:calc(100vw - 130px)
    }
}

@media only screen and (min-width: 600px) {
    .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm{
        width: 85vw !important;
    }
}