:root {
  --loading-grey: #ededed;
}
@import url(https://fonts.googleapis.com/css2?family=Poppins);
body{
  background-color: #f6f9fc !important;
  font-family: "Poppins", 'Segoe UI', Tahoma;
	
}
.form-darurat{
  margin-bottom: -200px;
}
/* Custom Radio */


.form {
  display: none;
}
.form.active {
  display: block
}

.card-radio .content{
  margin-top: 20px;
}
.card-radio  label.box{
  background: #ddd;
  margin-top: 12px;
  padding: 10px 12px;
  display: flex;
  border-radius: 5px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: all 0.25s ease;
}
#one:checked ~ label.first,
#two:checked ~ label.second,
#three:checked ~ label.third{
  border-color: #8E49E8;
  background: #d5bbf7;
}
.card-radio  label.box:hover{
  background: #d5bbf7;
}
.card-radio  label.box .circle{
  height: 22px;
  width: 22px;
  background: #ccc;
  border: 5px solid transparent;
  display: inline-block;
  margin-right: 15px;
  border-radius: 50%;
  transition: all 0.25s ease;
  box-shadow: inset -4px -4px 10px rgba(0, 0, 0, 0.2);
}
#one:checked ~ label.first .circle,
#two:checked ~ label.second .circle,
#three:checked ~ label.third .circle{
  border-color: #8E49E8;
  background: #fff;
}
.card-radio  label.box .plan{
  display: flex;
  width: 100%;
  align-items: center;
}
.card-radio input[type="radio"]{
  display: none;
}
/* End Custom Radio */
/* Card Loading */
.content-loading {
  padding: 2rem 1.8rem;
}
.description-loading {
  font-size: 1rem;
  line-height: 1.4rem;
}
.image-loading {
  height: 200px;
}
.loading .image-loading,
.loading h4,
.loading .description {
  background-color: var(--loading-grey);
  background: linear-gradient(
    100deg,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, .5) 50%,
    rgba(255, 255, 255, 0) 60%
  ) var(--loading-grey);
  background-size: 200% 100%;
  background-position-x: 180%;
  animation: 1s loading ease-in-out infinite;
}

@keyframes loading {
  to {
    background-position-x: -20%;
  }
}

.loading h4 {
  min-height: 1.6rem;
  border-radius: 4px;
  animation-delay: .05s;
}

.loading .description {
  min-height: 4rem;
  border-radius: 4px;
  animation-delay: .06s;
}
/* End Card Loading */
.bg-label-primary{background-color:#e7e7ff !important;color:#0d6efd !important}
.btn-primary{color:#fff;background-color:#0d6efd;border-color:#0d6efd;}.btn-primary:hover{color:#fff !important;background-color:#0b5ed7 !important;border-color:#0b5ed7 !important;}.btn-check:focus+.btn-primary,.btn-primary:focus,.btn-primary.focus{color:#fff;background-color:#0b5ed7;border-color:#0b5ed7;transform:translateY(0);box-shadow:none}.btn-check:checked+.btn-primary,.btn-check:active+.btn-primary,.btn-primary:active,.btn-primary.active,.btn-primary.show.dropdown-toggle,.show>.btn-primary.dropdown-toggle{color:#fff !important;background-color:#595cd9 !important;border-color:#595cd9 !important}.btn-check:checked+.btn-primary:focus,.btn-check:active+.btn-primary:focus,.btn-primary:active:focus,.btn-primary.active:focus,.btn-primary.show.dropdown-toggle:focus,.show>.btn-primary.dropdown-toggle:focus{box-shadow:none}.btn-primary.disabled,.btn-primary:disabled{color:#fff !important;background-color:#0d6efd !important;border-color:#0d6efd !important;box-shadow:none !important}
.btn-label-primary{color:#0d6efd;border-color:rgba(0,0,0,0);background:#e7e7ff}.btn-label-primary:hover{border-color:rgba(0,0,0,0) !important;background:#0b5ed7 !important;color:#fff !important;}.btn-label-primary:focus,.btn-label-primary.focus{color:#fff;background:#0b5ed7;box-shadow:none !important;transform:translateY(0)}.btn-label-primary:active,.btn-label-primary.active,.btn-label-primary.show.dropdown-toggle,.show>.btn-label-primary.dropdown-toggle{color:#fff !important;background-color:#595cd9 !important;border-color:rgba(0,0,0,0) !important}.btn-label-primary:active:focus,.btn-label-primary.active:focus,.btn-label-primary.show.dropdown-toggle:focus,.show>.btn-label-primary.dropdown-toggle:focus{box-shadow:none}.btn-label-primary.disabled,.btn-label-primary:disabled{color:#0d6efd !important;background-color:#e7e7ff !important;border-color:rgba(0,0,0,0) !important}.btn-outline-primary{color:#0d6efd;border-color:#0d6efd;background:rgba(0,0,0,0)}.btn-outline-primary:hover{color:#fff !important;background-color:#0b5ed7 !important;border-color:#0b5ed7 !important;box-shadow:0 .125rem .25rem 0 rgba(105,108,255,.4) !important;transform:translateY(-1px) !important}.btn-check:focus+.btn-outline-primary,.btn-outline-primary:focus{color:#fff;background-color:#0b5ed7;border-color:#0b5ed7;box-shadow:none;transform:translateY(0)}.btn-check:checked+.btn-outline-primary,.btn-check:active+.btn-outline-primary,.btn-outline-primary:active,.btn-outline-primary.active,.btn-outline-primary.dropdown-toggle.show{color:#fff !important;background-color:#595cd9 !important;border-color:#595cd9 !important}.btn-check:checked+.btn-outline-primary:focus,.btn-check:active+.btn-outline-primary:focus,.btn-outline-primary:active:focus,.btn-outline-primary.active:focus,.btn-outline-primary.dropdown-toggle.show:focus{box-shadow:none}.btn-outline-primary.disabled,.btn-outline-primary:disabled{box-shadow:none !important;color:#0d6efd !important;background-color:rgba(0,0,0,0) !important}.btn-outline-primary .badge{background:#0d6efd;border-color:#0d6efd;color:#fff}.btn-outline-primary:hover .badge,.btn-outline-primary:focus:hover .badge,.btn-outline-primary:active .badge,.btn-outline-primary.active .badge,.show>.btn-outline-primary.dropdown-toggle .badge{background:#fff;border-color:#fff;color:#0d6efd}
/* Custom Check */
.form-check-input:focus{border-color:#0d6efd;box-shadow:0 2px 4px 0 rgba(105,108,255,.4)}.form-check-input:disabled{background-color:#eceef1}.form-check-input:checked,.form-check-input[type=checkbox]:indeterminate{background-color:#0d6efd;border-color:#0d6efd;box-shadow:0 2px 4px 0 rgba(105,108,255,.4)}.custom-option.checked{border:1px solid #0d6efd}.form-switch .form-check-input:focus{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%230d6efd'/%3e%3c/svg%3e")}.form-switch .form-check-input:checked{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")}
.page-item.active .page-link,.page-item.active .page-link:hover,.page-item.active .page-link:focus,.pagination li.active>a:not(.page-link),.pagination li.active>a:not(.page-link):hover,.pagination li.active>a:not(.page-link):focus{border-color:#0d6efd;background-color:#0d6efd;color:#fff;box-shadow:0 .125rem .25rem rgba(105,108,255,.4)}
.bg-label-secondary{background-color:#ebeef0 !important;color:#8592a3 !important}
.bg-label-danger{background-color:#ffe0db !important;color:#ff3e1d !important}
.bg-label-primary{background-color:#e7e7ff !important;color:#696cff !important}
.bg-label-success{background-color:#e8fadf !important;color:#71dd37 !important}
.bg-label-info{background-color:#d7f5fc !important;color:#03c3ec !important}
.bg-label-warning{background-color:#fff2d6 !important;color:#ffab00 !important}
.bg-label-light{background-color:#fff !important;color:#fcfdfd !important}
.bg-label-dark{background-color:#dcdfe1 !important;color:#233446 !important}
/* Avatar */
.avatar{position:relative;width:2.375rem;height:2.375rem;cursor:pointer}.avatar img{width:100%;height:100%}.avatar .avatar-initial{position:absolute;top:0;left:0;right:0;bottom:0;text-transform:uppercase;display:flex;align-items:center;justify-content:center;color:#fff;background-color:#8592a3;font-weight:700}.avatar.avatar-online:after,.avatar.avatar-offline:after,.avatar.avatar-away:after,.avatar.avatar-busy:after{content:"";position:absolute;bottom:0;right:3px;width:8px;height:8px;border-radius:100%;box-shadow:0 0 0 2px #fff}.avatar.avatar-online:after{background-color:#71dd37}.avatar.avatar-offline:after{background-color:#8592a3}.avatar.avatar-away:after{background-color:#ffab00}.avatar.avatar-busy:after{background-color:#ff3e1d}.pull-up{transition:all .25s ease}.pull-up:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 .25rem 1rem rgba(161,172,184,.45);z-index:30;border-radius:50%}.avatar-xs{width:1.625rem;height:1.625rem}.avatar-xs .avatar-initial{font-size:.625rem}.avatar-xs.avatar-online:after,.avatar-xs.avatar-offline:after,.avatar-xs.avatar-away:after,.avatar-xs.avatar-busy:after{width:.325rem;height:.325rem;right:1px}.avatar-sm{width:2rem;height:2rem}.avatar-sm .avatar-initial{font-size:.75rem}.avatar-sm.avatar-online:after,.avatar-sm.avatar-offline:after,.avatar-sm.avatar-away:after,.avatar-sm.avatar-busy:after{width:.4rem;height:.4rem;right:2px}.avatar-md{width:3rem;height:3rem}.avatar-md .avatar-initial{font-size:1.125rem}.avatar-md.avatar-online:after,.avatar-md.avatar-offline:after,.avatar-md.avatar-away:after,.avatar-md.avatar-busy:after{width:.6rem;height:.6rem;right:4px}.avatar-lg{width:4rem;height:4rem}.avatar-lg .avatar-initial{font-size:1.5rem}.avatar-lg.avatar-online:after,.avatar-lg.avatar-offline:after,.avatar-lg.avatar-away:after,.avatar-lg.avatar-busy:after{width:.8rem;height:.8rem;right:5px}.avatar-xl{width:4.5rem;height:4.5rem}.avatar-xl .avatar-initial{font-size:1.875rem}.avatar-xl.avatar-online:after,.avatar-xl.avatar-offline:after,.avatar-xl.avatar-away:after,.avatar-xl.avatar-busy:after{width:.9rem;height:.9rem;right:6px}.avatar-group .avatar{transition:all .25s ease}.avatar-group .avatar img,.avatar-group .avatar .avatar-initial{border:2px solid #fff}.avatar-group .avatar .avatar-initial{background-color:#9da8b5}.avatar-group .avatar:hover{z-index:30;transition:all .25s ease}.avatar-group .avatar{margin-left:-0.8rem}.avatar-group .avatar:first-child{margin-left:0}.avatar-group .avatar-xs{margin-left:-0.65rem}.avatar-group .avatar-sm{margin-left:-0.75rem}.avatar-group .avatar-md{margin-left:-0.9rem}.avatar-group .avatar-lg{margin-left:-1.5rem}.avatar-group .avatar-xl{margin-left:-1.75rem}

/* Divider */
.divider{display:block;text-align:center;margin:1rem 0;overflow:hidden;white-space:nowrap}.divider .divider-text{position:relative;display:inline-block;font-size:.8rem;padding:0rem 1rem}.divider .divider-text i{font-size:1rem}.divider .divider-text:before,.divider .divider-text:after{content:"";position:absolute;top:50%;width:100vw;border-top:1px solid rgba(67,89,113,.2)}.divider .divider-text:before{right:100%}.divider .divider-text:after{left:100%}.divider.text-start .divider-text{padding-left:0}.divider.text-end .divider-text{padding-right:0}.divider.text-start-center .divider-text{left:-25%}.divider.text-end-center .divider-text{right:-25%}.divider.divider-dotted .divider-text:before,.divider.divider-dotted .divider-text:after{border-style:dotted;border-width:0 1px 1px;border-color:rgba(67,89,113,.2)}.divider.divider-dashed .divider-text:before,.divider.divider-dashed .divider-text:after{border-style:dashed;border-width:0 1px 1px;border-color:rgba(67,89,113,.2)}.divider.divider.divider-secondary .divider-text:before,.divider.divider.divider-secondary .divider-text:after{border-color:#8592a3}.divider.divider.divider-success .divider-text:before,.divider.divider.divider-success .divider-text:after{border-color:#71dd37}.divider.divider.divider-info .divider-text:before,.divider.divider.divider-info .divider-text:after{border-color:#03c3ec}.divider.divider.divider-warning .divider-text:before,.divider.divider.divider-warning .divider-text:after{border-color:#ffab00}.divider.divider.divider-danger .divider-text:before,.divider.divider.divider-danger .divider-text:after{border-color:#ff3e1d}.divider.divider.divider-dark .divider-text:before,.divider.divider.divider-dark .divider-text:after{border-color:#233446}.divider.divider.divider-gray .divider-text:before,.divider.divider.divider-gray .divider-text:after{border-color:rgba(67,89,113,.1)}
/* Form Input */
textarea:focus, 
textarea.form-control:focus, 
input.form-control:focus, 
input[type=text]:focus, 
input[type=password]:focus, 
input[type=email]:focus, 
input[type=number]:focus, 
[type=text].form-control:focus, 
[type=password].form-control:focus, 
[type=email].form-control:focus, 
[type=tel].form-control:focus, 
[contenteditable].form-control:focus {
  /* box-shadow: inset 0 -1px 0 #ddd; */
  border: 1px solid #147ee7;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
.img-hero{
  margin-top: -70px;
  margin-bottom: 0;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */


/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  /* height: 32rem; */
}

  
  /* MARKETING CONTENT
  -------------------------------------------------- */
  
  /* Center align the text within the three columns below the carousel */
  .marketing .col-lg-4 {
    margin-bottom: 1.5rem;
    text-align: center;
  }
  /* rtl:begin:ignore */
  .marketing .col-lg-4 p {
    margin-right: .75rem;
    margin-left: .75rem;
  }
  /* rtl:end:ignore */
  
  
  /* Featurettes
  ------------------------- */
  
  .featurette-divider {
    margin: 5rem 0; /* Space out the Bootstrap <hr> more */
  }
  
  /* Thin out the marketing headings */
  /* rtl:begin:remove */
  .featurette-heading {
    letter-spacing: -.05rem;
  }
  
  /* rtl:end:remove */
  
  /* RESPONSIVE CSS
  -------------------------------------------------- */
  
  @media (min-width: 40em) {
    /* Bump up size of carousel content */
    .carousel-caption p {
      margin-bottom: 1.25rem;
      font-size: 1.25rem;
      line-height: 1.4;
    }
  
    .featurette-heading {
      font-size: 50px;
    }
  }
  
  @media (min-width: 62em) {
    .featurette-heading {
      margin-top: 7rem;
    }
  }

  /* Thumb Image */
  .card-img-frame img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    }

  /* Footer */
  .footer-area{
    padding: 40px 0px;
    background-color: #333;
    color: #fff;
}
.footer-area a{
    text-decoration: none;
}
.footer-area .footer-heading{
    font-size: 24px;
    color: #fff;
}
.footer-area .footer-underline{
    height: 1px;
    width: 70px;
    background-color: #ddd;
    margin: 10px 0px;
}
.copyright-area{
    padding: 14px 0px;
    background-color: #262626;
}
.copyright-area p{
    margin-bottom: 0px;
    color: #fff;
}
.copyright-area .social-media{
    text-align: end;
}
.copyright-area .social-media a{
    margin: 0px 10px;
    color: #fff;
    width: 20px;
}

.header{
  height: 150px;
}

.navbar {
  background-color: #fff !important;

  min-height: 80px;
  font-weight: normal;
  font-size: 16px;
}

/* NAVBAR MEMBER */
@media (min-width: 768px) {
  .sidebar-nav .navbar .navbar-collapse {
      padding: 0;
      max-height: none;
  }
  .sidebar-nav .navbar ul {
      float: none;
      display: block;
  }
  .sidebar-nav .navbar li {
      float: none;
      display: block;
  }
  .sidebar-nav .navbar li a {
      padding-top: 12px;
      padding-bottom: 12px;
  }
}
/* Floating Button */

.act-btn-shopee{
  background:orangered;
  display: block;
  width: 90px;
  height: 90px;
  padding: 5px;
  line-height: 50px;
  text-align: center;
  color: white;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  transition: ease all 0.3s;
  position: fixed;
  right: 0;
  bottom:50px;
}
.act-btn-tokped:hover{background: rgb(14, 120, 59)}
.act-btn-shopee:hover{background: orange}
.act-btn-map:hover{background: rgb(21, 85, 146)}

