::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(197, 194, 194, 0), 0.048; 

}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(212, 212, 212, 0.048); 

}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #5b256e; 
}


.card .header h2{
    color: #d02351!important;
    font-weight: bold!important
  }

.modal-pin{
  padding: 20%!important;
}

.img-login{
  display: none;
}

.login-box{
  padding: 5% 1%;
}

.disable{
pointer-events: none;
opacity: 0.2;
}
.bg-gradient {
  background: linear-gradient(to top, #ebebebdc, #ffffff);  
}
.login-box2{
  margin: 6% 1%
}



.bg-login{
  border-radius: 50px;
  padding: 10% 5%
}
.bg-magenta{
    background: #d02351!important;
    color: white;
  }

  .m-0{margin:0!important}.mt-0,.my-0{margin-top:0!important}.mr-0,.mx-0{margin-right:0!important}.mb-0,.my-0{margin-bottom:0!important}.ml-0,.mx-0{margin-left:0!important}.m-1{margin:.25rem!important}.mt-1,.my-1{margin-top:.25rem!important}.mr-1,.mx-1{margin-right:.25rem!important}.mb-1,.my-1{margin-bottom:.25rem!important}.ml-1,.mx-1{margin-left:.25rem!important}.m-2{margin:.5rem!important}.mt-2,.my-2{margin-top:.5rem!important}.mr-2,.mx-2{margin-right:.5rem!important}.mb-2,.my-2{margin-bottom:.5rem!important}.ml-2,.mx-2{margin-left:.5rem!important}.m-3{margin:1rem!important}.mt-3,.my-3{margin-top:1rem!important}.mr-3,.mx-3{margin-right:1rem!important}.mb-3,.my-3{margin-bottom:1rem!important}.ml-3,.mx-3{margin-left:1rem!important}.m-4{margin:1.5rem!important}.mt-4,.my-4{margin-top:1.5rem!important}.mr-4,.mx-4{margin-right:1.5rem!important}.mb-4,.my-4{margin-bottom:1.5rem!important}.ml-4,.mx-4{margin-left:1.5rem!important}.m-5{margin:3rem!important}.mt-5,.my-5{margin-top:3rem!important}.mr-5,.mx-5{margin-right:3rem!important}.mb-5,.my-5{margin-bottom:3rem!important}.ml-5,.mx-5{margin-left:3rem!important}.p-0{padding:0!important}.pt-0,.py-0{padding-top:0!important}.pr-0,.px-0{padding-right:0!important}.pb-0,.py-0{padding-bottom:0!important}.pl-0,.px-0{padding-left:0!important}.p-1{padding:.25rem!important}.pt-1,.py-1{padding-top:.25rem!important}.pr-1,.px-1{padding-right:.25rem!important}.pb-1,.py-1{padding-bottom:.25rem!important}.pl-1,.px-1{padding-left:.25rem!important}.p-2{padding:.5rem!important}.pt-2,.py-2{padding-top:.5rem!important}.pr-2,.px-2{padding-right:.5rem!important}.pb-2,.py-2{padding-bottom:.5rem!important}.pl-2,.px-2{padding-left:.5rem!important}.p-3{padding:1rem!important}.pt-3,.py-3{padding-top:1rem!important}.pr-3,.px-3{padding-right:1rem!important}.pb-3,.py-3{padding-bottom:1rem!important}.pl-3,.px-3{padding-left:1rem!important}.p-4{padding:1.5rem!important}.pt-4,.py-4{padding-top:1.5rem!important}.pr-4,.px-4{padding-right:1.5rem!important}.pb-4,.py-4{padding-bottom:1.5rem!important}.pl-4,.px-4{padding-left:1.5rem!important}.p-5{padding:3rem!important}.pt-5,.py-5{padding-top:3rem!important}.pr-5,.px-5{padding-right:3rem!important}.pb-5,.py-5{padding-bottom:3rem!important}.pl-5,.px-5{padding-left:3rem!important}
  .bg-black-light{
    background-color: #d02351!important;
    color: white;
  }

    .bg-red-darken{
    background-color: #d02351!important;
    color: white;
  }

.bg-magenta-dark{
    background-color: #851634!important;
    color: white;
}



.delay-4 {
  animation-duration: 3s;
  animation-delay: 4s;
  animation-iteration-count: infinite;
}

.delay-2 {
  animation-duration: 2s;
  animation-delay: 2s;
  animation-iteration-count: infinite;
}


.margin-capcha{
  margin-left:auto!important;
  margin-right:auto!important
}

.text-magenta{
    color: #d02351!important;
}

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

.text-forgot{
  text-decoration: none;font-size:10px;
  margin-bottom: 0!important;
  color: rgb(255, 174, 0);
  font-weight: bold
}

.text-forgot:hover{
color: rgb(255, 230, 0)
}

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

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

.table tr td{
vertical-align: middle!important;
}

@font-face {
  font-family: "Font Digital";
  src: url('../fonts/nasalization-rg.ttf');
  }

.digital {
  font-size: 12px!important;
  font-family: "Font Digital";
  }

  .digital-login {
    font-size: 22px!important;
    font-family: "Font Digital";
    }

    .margin-dashboard{
      margin:0
    }

    .dekstop-margin-1,.dekstop-margin-2,.dekstop-margin-3,.dekstop-margin-4,.dekstop-margin-5,
    .dekstop-margin-y-1,.dekstop-margin-y-2,.dekstop-margin-y-3,.dekstop-margin-y-4,.dekstop-margin-y-5,
    .dekstop-margin-x-1,.dekstop-margin-x-2,.dekstop-margin-x-3,.dekstop-margin-x-4,.dekstop-margin-x-5{
      margin:0
    }

    .dekstop-padding-1,.dekstop-padding-2,.dekstop-padding-3,.dekstop-padding-4,.dekstop-padding-5,
    .dekstop-padding-y-1,.dekstop-padding-y-2,.dekstop-padding-y-3,.dekstop-padding-y-4,.dekstop-padding-y-5,
    .dekstop-padding-x-1,.dekstop-padding-x-2,.dekstop-padding-x-3,.dekstop-padding-x-4,.dekstop-padding-x-5,.dekstop-padding-x-10{
      padding:0
    }

    .table-responsive{
      padding: 15% 0!important;
    }

    .hide {
      display: none !important;
    }
    


    .table-borderless th,
    .table-borderless td,
    .table-borderless thead th,
    .table-borderless tbody + tbody {
      border: 0;
    }
    


  


@media (min-width: 992px) { 
  .table-responsive{
    padding: 2% 0!important;
  }

  .dekstop-margin-1{
    margin:1%
  }.dekstop-margin-2{
    margin:2%
  }.dekstop-margin-3{
    margin:3%
  }.dekstop-margin-4{
    margin:4%
  }.dekstop-margin-5{
    margin:5%
  }
  .dekstop-margin-x-1{
    margin-left:1%;margin-right:1%
  }.dekstop-margin-x-2{
    margin-left:2%;margin-right:2%
  }.dekstop-margin-x-3{
    margin-left:3%;margin-right:3%
  }.dekstop-margin-x-4{
    margin-left:4%;margin-right:4%
  }.dekstop-margin-x-5{
    margin-left:5%;margin-right:5%
  }
  .dekstop-margin-y-1{
    margin-top:1%;margin-bottom:1%
  }.dekstop-margin-y-2{
    margin-top:2%;margin-bottom:2%
  }.dekstop-margin-y-3{
    margin-top:3%;margin-bottom:3%
  }.dekstop-margin-y-4{
    margin-top:4%;margin-bottom:4%
  }.dekstop-margin-y-5{
    margin-top:5%;margin-bottom:5%
  }
  .dekstop-padding-1{
    padding:1%
  }.dekstop-padding-2{
    padding:2%
  }.dekstop-padding-3{
    padding:3%
  }.dekstop-padding-4{
    padding:4%
  }.dekstop-padding-5{
    padding:5%
  }
  .dekstop-padding-x-1{
    padding-left:1%;padding-right:1%
  }.dekstop-padding-x-2{
    padding-left:2%;padding-right:2%
  }.dekstop-padding-x-3{
    padding-left:3%;padding-right:3%
  }.dekstop-padding-x-4{
    padding-left:4%;padding-right:4%
  }.dekstop-padding-x-5{
    padding-left:5%;padding-right:5%
  }
}.dekstop-padding-x-10{
  padding-left:10%;padding-right:10%
}
  .dekstop-padding-y-1{
    padding-top:1%;padding-bottom:1%
  }.dekstop-padding-y-2{
    padding-top:2%;padding-bottom:2%
  }.dekstop-padding-y-3{
    padding-top:3%;padding-bottom:3%
  }.dekstop-padding-y-4{
    padding-top:4%;padding-bottom:4%
  }.dekstop-padding-y-5{
    padding-top:5%;padding-bottom:5%
  }

  .margin-dashboard{
    margin:5%
  }

  .digital {
    font-size: 18px!important;
    font-family: "Font Digital";
    }

    .digital-login {
      font-size: 24px!important;
      font-family: "Font Digital";
      }


  .img-login{
    display: block;
  }

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

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

  .text-right-center{
    text-align: right;
  }
  
  .login-box{
padding: 5% 1%;
  }

  .text-forgot{
    text-decoration: none!important;
    font-size:12px;
    margin-bottom: 0!important;
  }

  .login-box2{
    margin: 2% 5%
  }

}


/*********************
  Media Query Classes
**********************/
@media only screen and (max-width: 600px) {
  .hide-on-small-only, .hide-on-small-and-down {
    display: none !important;
  }
}

@media only screen and (max-width: 992px) {
  .hide-on-med-and-down {
    display: none !important;
  }
}

@media only screen and (min-width: 601px) {
  .hide-on-med-and-up {
    display: none !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .hide-on-med-only {
    display: none !important;
  }
}

@media only screen and (min-width: 993px) {
  .hide-on-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .hide-on-extra-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .show-on-extra-large {
    display: block !important;
  }
}

@media only screen and (min-width: 993px) {
  .show-on-large {
    display: block !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .show-on-medium {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .show-on-small {
    display: block !important;
  }
}

@media only screen and (min-width: 601px) {
  .show-on-medium-and-up {
    display: block !important;
  }
}

@media only screen and (max-width: 992px) {
  .show-on-medium-and-down {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .center-on-small-only {
    text-align: center;
  }
}


/* invoice */
.invoice-box {
            
  margin: auto;
  padding: 30px;

  font-size: 16px;
  line-height: 24px;
  font-family: 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
  color: #555;
}

.invoice-box table {
  width: 100%;
  line-height: inherit;
  text-align: left;
}

.invoice-box table td {
  padding: 5px;
  vertical-align: top;
}

.invoice-box table tr td:nth-child(2) {
  text-align: right;
}

.invoice-box table tr.top table td {
  padding-bottom: 20px;
}

.invoice-box table tr.top table td.title {
  font-size: 45px;
  line-height: 45px;
  color: #333;
}

.invoice-box table tr.information table td {
  padding-bottom: 40px;
}

.invoice-box table tr.heading td {
  background: #eee;
  border-bottom: 1px solid #ddd;
  font-weight: bold;
}

.invoice-box table tr.details td {
  padding-bottom: 20px;
}

.invoice-box table tr.item td{
  border-bottom: 1px solid #eee;
}

.invoice-box table tr.item.last td {
  border-bottom: none;
}

.invoice-box table tr.total td:nth-child(2) {
  border-top: 2px solid #eee;
  font-weight: bold;
}

@media only screen and (max-width: 600px) {
  .invoice-box table tr.top table td {
      width: 100%;
      display: block;
      text-align: center;
  }
  
  .invoice-box table tr.information table td {
      width: 100%;
      display: block;
      text-align: center;
  }
}

/** RTL **/
.rtl {
  direction: rtl;
  font-family: Tahoma, 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
}

.rtl table {
  text-align: right;
}

.rtl table tr td:nth-child(2) {
  text-align: left;
}

.card .header h2{
  color: #d02351!important;
  font-weight: bold!important
}

.modal-pin{
padding: 20%!important;
}



.img-login{
display: none;
}

.login-box{
padding: 5% 1%;
}

.login-box2{
margin: 6% 1%
}

.bg-login{
padding: 10% 5%
}

.margin-login{
padding: 50%
}

.bg-gradient{
background: linear-gradient(to right, #9e248d, #5b256e);  
}
.bg-magenta{
  background: #9e248d!important;
  color: white!important;
}

.bg-pandu{
  background-color: #0066FF!important;
  color: white!important;
}
.bg-pandu-2{
  background-color: #0066FF!important;
  color: white!important;
}
.bg-pandu-3{
  background-color: #722788!important;
  color: white!important;
}
.bg-pandu-4{
  background-color: #5b256e!important;
  color: white!important;
}

.text-pandu{
  color: #cf3694!important;
}
.text-pandu-2{
  color: #0066FF!important;
}
.text-pandu-3{

  color: #722788!important;
}
.text-pandu-4{
  color: #5b256e!important;
}

.hover-text-pandu-4:hover{color:#5b256e!important;}

.bg-black-light{
  background-color: #d02351!important;
  color: white;
}

  .bg-red-darken{
  background-color: #d02351!important;
  color: white;
}

.bg-magenta-dark{
  background-color: #5b256e!important;
  color: white;
}

.margin-capcha{
margin-left:auto!important;
margin-right:auto!important
}

.text-magenta{
  color: #9e248d!important;
}

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

.text-forgot{
text-decoration: none;font-size:10px;
margin-bottom: 0!important;
font-weight: bold
}


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

.table tr td{
vertical-align: middle!important;
}


@font-face {
font-family: "Font Digital";
src: url('nasalization-rg.ttf');
}

.digital {
font-size: 12px!important;
font-family: "Font Digital";
}

.font-login {
  font-size: 22px!important;
  font-family: "Font Digital";
  }


@media (min-width: 992px) { 

.font-login {
  font-size: 30px!important;
  font-family: "Font Digital";
  }

.digital {
  font-size: 18px!important;
  font-family: "Font Digital";
  }


.img-login{
  display: block;
}

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

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

.login-box{
padding: 5% 1%;
}

.text-forgot{
  text-decoration: none!important;
  font-size:12px;
  margin-bottom: 0!important;
}

.login-box2{
  margin: 2% 5%;
}

}


/*********************
  Media Query Classes
**********************/
.hide {
  display: none !important;
}

@media only screen and (max-width: 600px) {
  .hide-on-small-only, .hide-on-small-and-down {
    display: none !important;
  }
}

@media only screen and (max-width: 992px) {
  .hide-on-med-and-down {
    display: none !important;
  }
}

@media only screen and (min-width: 601px) {
  .hide-on-med-and-up {
    display: none !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .hide-on-med-only {
    display: none !important;
  }
}

@media only screen and (min-width: 993px) {
  .hide-on-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .hide-on-extra-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .show-on-extra-large {
    display: block !important;
  }
}

@media only screen and (min-width: 993px) {
  .show-on-large {
    display: block !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .show-on-medium {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .show-on-small {
    display: block !important;
  }
}

@media only screen and (min-width: 601px) {
  .show-on-medium-and-up {
    display: block !important;
  }
}

@media only screen and (max-width: 992px) {
  .show-on-medium-and-down {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .center-on-small-only {
    text-align: center;
  }
}