/* .login-bg{
  background: url('../img/pexels-uzunov-rostislav-5011647.jpg') no-repeat fixed;
  background-size: cover;
} */
.font-5{font-size:5px !important}
.font-6{font-size:6px !important}
.font-7{font-size:7px !important}
.font-8{font-size:8px !important}
.font-9{font-size:9px !important}
.font-10{font-size:10px !important}
.font-11{font-size:11px !important}
.font-12{font-size:12px !important}
.font-13{font-size:13px !important}
.font-14{font-size:14px !important}
.font-15{font-size:15px !important}
.font-16{font-size:16px !important}
.font-17{font-size:17px !important}
.font-18{font-size:18px !important}
.font-19{font-size:19px !important}
.font-20{font-size:20px !important}
.font-21{font-size:21px !important}
.font-22{font-size:22px !important}
.font-23{font-size:23px !important}
.font-24{font-size:24px !important}
.font-25{font-size:25px !important}
.font-26{font-size:26px !important}
.font-27{font-size:27px !important}
.font-28{font-size:28px !important}
.font-29{font-size:29px !important}
.font-30{font-size:30px !important}
.font-31{font-size:31px !important}
.font-32{font-size:32px !important}
.font-33{font-size:33px !important}
.font-34{font-size:34px !important}
.font-35{font-size:35px !important}
.font-36{font-size:36px !important}
.font-37{font-size:37px !important}
.font-38{font-size:38px !important}
.font-39{font-size:39px !important}
.font-40{font-size:40px !important}
.font-41{font-size:41px !important}
.font-42{font-size:42px !important}
.font-43{font-size:43px !important}
.font-44{font-size:44px !important}
.font-45{font-size:45px !important}
.font-46{font-size:46px !important}
.font-47{font-size:47px !important}
.font-48{font-size:48px !important}
.font-49{font-size:49px !important}
.font-50{font-size:50px !important}

::selection{background-color: hotpink;}

@font-face
{
    font-family: barcode;
    src: url('../../fonts/IDAutomationHC39M.ttf');
}
.barcode{
  font-family: barcode;
}

.preloader{
  width: 64px !important;
  margin: auto;
}
.clearfix:after {
  content: " "; /* Older browser do not support empty content */
  visibility: hidden;
  display: block;
  height: 30px;
  clear: both;
}

.res-circle {
  /* (A) PERCENTAGE WIDTH & BORDER RADIUS */
  width: 35%;
  border-radius: 50%;

  /* (B) BACKGROUND COLOR */ 
  background:var(--gray-dark);
  color:white;
 
  /* (C) NECESSARY TO POSITION TEXT BLOCK */
  line-height: 0;
  position: relative;
  margin: 0 auto;
}
 
/* (D) MATCH HEIGHT */
.res-circle::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
 
/* (E) TEXT BLOCK */
.circle-txt {
  /* (E1) CENTER TEXT IN CIRCLE */
  position: absolute;
  bottom: 50%;
  width: 100%;
  text-align: center;
 
  /* (E2) THE FONT - NOT REALLY IMPORTANT */
  font-family: arial, sans-serif;
  font-weight: bold;
  font-size: 130%;
}


.uhid-title{
  font-size:50%;
  position: relative;
  top:15px;
}


.btn:focus {
  outline: solid 2px var(--red) !important;
    background: #eeff07;
    color: black;
  box-shadow: none;
}

/* Remove Arrows/Spinners */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.bg-purple{
  background-color:#8a02c1;
  color:white;
}

.bg-msblue{
  background-color:#3f51b5;
  color:white;
}

.bg-parrot{
  background-color:#8bc34a;
  color:white;
}
.bg-mute{
  background-color:#cbcbcb!important;
}


.selection-off {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}


.rotate-90{
  position: absolute;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
}

/** Table (Excel) **/
.tableXls{
  width:100%
}
.tableXls th, .tableXls td
{
  border:1px solid black;
  text-align: center;
  line-height: 25px;
}


.interpretationHead{
  font-size: 12px;
  font-weight: bold;
  text-decoration: underline;
}
.interpretationData{
  font-size: 11px;
}

.pagination{
  margin: 5px auto !important;
}



/* ********************** CHECK BOX **************************** */
/* #1 */
.custom-control-crimson:checked~.custom-control-crimson::before
{
  color: #fff;
  border-color:crimson;
  background-color:crimson;
}
/* #2 */
.custom-control-success:checked~.custom-control-success::before
{
  color: #fff;
  border-color:#59C891;
  background-color:#59C891;
}


/* #3 */
.chkContainer {
  /* display: block; */
  height: 1.5em;
  width: 1.5em;
  cursor: pointer;
  position: relative;
}

.chkContainer input {
  position: absolute;
  transform: scale(0);
}

.chkContainer input:checked ~ .checkmark {
  transform: rotate(45deg);
  height: 2em;
  width: .7em;
  border-color: #007bff;
  border-top-color: transparent;
  border-left-color: transparent;
  border-radius: 0;
}

.chkContainer .checkmark {
  display: block;
  width: inherit;
  height: inherit;
  border: 2px solid #6c757d80;
  border-radius: 4px;
  transition: all .3s;
}






.Myfieldset {
  font-family: sans-serif;
    border: 1px solid #1F497D;
    border-radius: 5px;
    padding: 5px 15px;
}

.Myfieldset legend {
  background: #1F497D;
    color: #fff;
    padding: 5px 15px;
    font-size: 23px;
    border-radius: 5px;
    box-shadow: 0 0 0 3px #ddd;
    margin-left: 20px;
    width: auto;
}




.loader{
  text-align: center;
  position: absolute;
  width: 100%;
  left: -1px;
  padding-top: 20%;
  height: -webkit-fill-available;
  background: #ffffff1f;
  z-index: 9;
  backdrop-filter: blur(2px);
}


/* =========== search =========== */
.search-control-pink{
  background: -webkit-linear-gradient(left top, var(--pink), var(--red));
}
.search-control-blue{
  background: -webkit-linear-gradient(left top, #007bff9d, #007bffce);
}
.search-control{
  border-radius: 100px;
  margin: 5px auto;
  
  color:white !important;
}


.search-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: white;
  opacity: 1; /* Firefox */
}
.search-control::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  height: 10px;
  width: 10px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgd2lkdGg9IjEyMy4wNXB4IiBoZWlnaHQ9IjEyMy4wNXB4IiB2aWV3Qm94PSIwIDAgMTIzLjA1IDEyMy4wNSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTIzLjA1IDEyMy4wNTsiDQoJIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTEyMS4zMjUsMTAuOTI1bC04LjUtOC4zOTljLTIuMy0yLjMtNi4xLTIuMy04LjUsMGwtNDIuNCw0Mi4zOTlMMTguNzI2LDEuNzI2Yy0yLjMwMS0yLjMwMS02LjEwMS0yLjMwMS04LjUsMGwtOC41LDguNQ0KCQljLTIuMzAxLDIuMy0yLjMwMSw2LjEsMCw4LjVsNDMuMSw0My4xbC00Mi4zLDQyLjVjLTIuMywyLjMtMi4zLDYuMSwwLDguNWw4LjUsOC41YzIuMywyLjMsNi4xLDIuMyw4LjUsMGw0Mi4zOTktNDIuNGw0Mi40LDQyLjQNCgkJYzIuMywyLjMsNi4xLDIuMyw4LjUsMGw4LjUtOC41YzIuMy0yLjMsMi4zLTYuMSwwLTguNWwtNDIuNS00Mi40bDQyLjQtNDIuMzk5QzEyMy42MjUsMTcuMTI1LDEyMy42MjUsMTMuMzI1LDEyMS4zMjUsMTAuOTI1eiIvPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPC9zdmc+DQo=);
  background-size: 10px 10px;
}


mark{
  background: #ff90c370;
  padding: 0;
}

.like-button{
  cursor: pointer;
}
.like-button:hover{
  background-color: #1F497D;
  color:white
}
.like-button:focus{
  background-color: #1F497D;
  color:white
}
.on-print{display: none !important;}
@media print
{    
    .no-print
    {
        display: none !important;
    }
    .print-on
    {
        display: none !important;
    }
    .on-print{display: block !important;}
}


/*  Login Option */
.loginOption .custom-control-label{
    padding: 17px 30px !important;
    width: 290px !important;
    text-align: left !important;
    border: 0px !important;
    line-height: 4px;
    background: transparent !important;
    cursor: pointer;
}
.loginOption .custom-radio{
    margin: 10px 0px;
    padding: 5px 0px;
}
.activeChk{background: rgb(245, 204, 0);
    box-shadow: 0 0 15px rgba(245, 204, 0, 0.67);
    border-radius: 5px;}

    .loginOption .custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #b38506;
    background-color: #d39c03;
}
.loginOption .custom-control-label::before{left:6px !important; top:13px !important}
.loginOption .custom-control-label::after{left:6px !important; top:13px !important}

@media(max-width: 414px) {
    .loginOption .custom-radio{
        width: 100% !important;
    } 
}


/*  Payment Option */

.paymentOption .custom-control-label{
    padding: 20px 30px !important;
    width: 290px !important;
    text-align: left !important;
    border: 0px !important;
    line-height: 4px;
    background: transparent !important;
    cursor: pointer;
}
.paymentOption .custom-radio{
    margin: 10px 0px;
    padding: 5px 0px;
}
.activeReceiveAmount{background: #3f51b5;
    box-shadow: 0 0 15px #3f51b5;
    border-radius: 5px;}
.activeRefundAmount{background: #8bc34a;
    box-shadow: 0 0 15px #8bc34a;
    border-radius: 5px;}
    .paymentOption .custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #1877c3;
    background-color: #2196f3;
}
.paymentOption .custom-control-label::before{left:6px !important; top:13px !important}
.paymentOption .custom-control-label::after{left:6px !important; top:13px !important}

@media(max-width: 414px) {
    .paymentOption .custom-radio{
        width: 100% !important;
    } 
}




@keyframes rotating {
  from {
    -ms-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  to {
    -ms-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

.btn-underline{
  border-bottom: dotted 2px black !important;
  border: 0px;
  background: none;
}

.btn-db{
  position: relative;
  border: none;
  font-size: 14px;
  transition: color 0.5s, transform 0.2s, background-color 0.2s;
  outline: none;
  border-radius: 3px;
  margin: 0 10px;
  /* padding: 23px 33px; */
  border: 3px solid transparent;
}
  .btn-db:active{
    /* transform: translateY(3px); */
    position: relative;
    animation: bound .3s cubic-bezier(.3, 2.4, .85, 2.5)
  }
  
  .btn-db::after, .btn-db::before
  {
    border-radius: 3px;
  }

  .btn-db::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid darken(var(--pink), 10%);
    transition: opacity 0.3s, border 0.3s;
  }
  .btn-db:hover::before{
    opacity: 0}
  
  .btn-db::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    border: 3px solid var(--pink);
    opacity: 0;
    z-index: -1;
    transform: scaleX(1.1) scaleY(1.3);
    transition: transform 0.3s, opacity 0.3s;
  }
  
  .btn-db:hover::after{
    opacity: 1;
    transform: scaleX(1) scaleY(1);
  }

  .btn-db:hover .rotating {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
  }

  /* Logo Animation */
  .glowing {
    position: relative;
    z-index: 0;
    /* width: 31%; */
    /* border-radius: 10px; */
    overflow: hidden;
    padding: 3px;
    margin: 0px auto;
  }
    
  .glowing::before {
    content: '';
    position: absolute;
    z-index: -2;
    left: -50%;
    top: -200%;
    width: 200%;
    height: 500%;
    background-color: #399953;
    background-repeat: no-repeat;
    background-size: 50% 50%, 50% 50%;
    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
    background-image: linear-gradient(#399953, #399953), linear-gradient(#fbb300, #fbb300), linear-gradient(#d53e33, #d53e33), linear-gradient(#377af5, #377af5);
    animation: rotate 4s linear infinite;
  }
    
  .glowing::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 6px;
    top: 6px;
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    background: white;
    border-radius: 5px;
  }

  @keyframes rotate {
    100% {
      transform: rotate(1turn);
    }
  }
  /* Logo Animation */




  #progress-bar {
    --scrollAmount: 0%;
    /* background:#9c27b0; */
    background:#f8ceff;
    width: var(--scrollAmount);
    height: 48px;
    position: fixed;
    top: 0px;
    z-index: -99;
    /* opacity: .2; */
  }
  #progress-bar-shine{
    background: rgb(225 153 237 / 0%);
    height: 47px;
    width: 1px;
    position: absolute;
    right: 0px;
    /* top: 5px; */
    box-shadow: -2px 0px 2px rgb(225 153 237), -2px 0px 4px rgb(225 153 237), -2px 0px 8px rgb(225 153 237), -2px 0px 10px rgb(225 153 237);
    -webkit-animation: progress-bar-glow .90s ease infinite;
    animation: progress-bar-glow .90s ease infinite;
  }
  @-webkit-keyframes progress-bar-glow {
    0% {
      opacity: 1;
    }
  
    50% {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }

  @keyframes progress-bar-glow {
    0% {
      opacity: 1;
    }
  
    50% {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }

  .bi-arrow-up-short{
    position: relative;
    animation: back-to-top .90s ease infinite;
  }
  @keyframes back-to-top {
    0% {
      top: 0px;
    }
  
    25% {
      top: -5px;
    }
    50% {
      top: 0px;
    }
    75% {
      top: 5px;
    }
  
    to {
      top: 0px;
    }
  }
  #txtOperatorID::-webkit-input-placeholder{
      font-size: 14px;
      line-height: 34;
      color:white;
      line-height: 50px;
      position: relative;
      top:-10px
  }
  #txtOperatorID{
    -webkit-text-security: square;
    -o-text-security: square;
    -moz-text-security: square;
    -ms-text-security: square;
    font-size: 30px;
    height: 31px;
    line-height: 15px;
    color:white;
  }

  

  /*  Modal */
  .modal-dialog{
    box-shadow: 0 0 20px 10px #00000059;
  }
  .modal-header{
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem;
    background: #aa66cc;
    color: white;
  }
  .modal-content{border-radius: 0px !important;}
  .modal-title{
    margin-bottom:0;
    line-height:1;
  }


  /* Form Controls */
  .form-control, .form-control-sm, .custom-select, .custom-select-sm{
    border-radius: .1rem;
  }



  /* button colors */
  .btn-success{background-color: #59C891;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-success:hover{background-color:#3b8a62;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-primary{background-color: #567DF4;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-primary:hover{background-color:#3452ac;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-info{background-color: #33b5e5;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-info:hover{background-color:#0099CC;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-warning{background-color: #FCC729;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;
    border-color: #bf9004 !important;
  }
  .btn-warning:hover{background-color:#ae891a;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-danger{
    background-color: #F87884;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-danger:hover{background-color:#ae4751;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-light{background-color: #e0e0e0 ;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-light:hover{background-color:#cccccc ;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-secondary{background-color: #37474F ;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-secondary:hover{background-color:#263238 ;
    box-shadow: 0px 3px 8px #0000006b;}

  .btn-dark{background-color: #2E2E2E ;
    border-radius: 1px;
    box-shadow: 0px 1px 5px #0000006b;}
  .btn-dark:hover{background-color:#212121 ;
    box-shadow: 0px 3px 8px #0000006b;}



  /*-----light-----*/
  .btn-success-light{
    background-color: #81E2BC;
    border: 1px solid #60c19b;
    border-radius: 1px;
  }
  .btn-success-light:hover{background-color:#60c19b;
    box-shadow: 0px 3px 8px #0000006b;}
  
  .btn-danger-light{
    background-color: #FAA1A0;
    border: 1px solid #d37c7b;
    border-radius: 1px;
    }
  .btn-danger-light:hover{background-color:#d37c7b;
    box-shadow: 0px 3px 8px #0000006b;}
  
  .btn-warning-light{
    background-color: #FDBB6C;
    border: 1px solid #c78d47;
    border-radius: 1px;
    }
  .btn-warning-light:hover{background-color:#c78d47;
    box-shadow: 0px 3px 8px #0000006b;}
  
  .btn-primary-light{
    background-color: #AAABF9;
    border: 1px solid #7778bf;
    border-radius: 1px;
    }
  .btn-primary-light:hover{background-color:#7778bf;
    box-shadow: 0px 3px 8px #0000006b;}

    
  .btn:disabled {
    background: #dddddd;
    border: #bbbbbb;
    color:#707070;
    cursor:not-allowed;
    box-shadow: 0px 1px 1px #0000006b;
  }

  .row-disabled {
    background-color: rgb(89 167 40 / 40%);
    pointer-events: none;
    width: 100%;
    color:var(--success)!important;
  }


  .hospital-remak{
    width: 325px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .colhover{
    background:rgb(255 193 7 / 58%);
  }

  .table td, .table th{vertical-align:middle !important}
  .table .thead-brown th{
    color: #fff;
    background-color: #795548;
    border-color: #483027;
  }
  .bg-gray{background:#9e9e9e!important}
  .bg-brown{background-color: #795548 !important;
    border-color: #483027 !important;
    color:white
  }
  
  .table thead.pink-blue
  {
    background:#4a53b2;
    color:white;
  }

  .aleradyAdded{
    background:#f8d7da
  }

  @keyframes mymove {
    from {background:rgb(196, 2, 2)}
    to {background:transparent}
  }

  .indicate-red
  {
    background:rgb(196, 2, 2);
    -webkit-animation: mymove 2s;
    animation: mymove 2s;
  }


  .td-link-blue:hover{
    cursor: pointer;
    background: #2196f3;
    color: white;
  }

 

.bg-primary{background: #567DF4 !important}
.bg-warning{background: #FCC729 !important}

/* -----------------Notification----------------- */
.notification-success{background: #59C891;color: #ffffff;box-shadow: 0px 0px 13px #3d9368;}
.notification-danger{background: #F87884;color: #ffffff;box-shadow: 0px 0px 13px #bc4d58;}
.notification-warning{background: #FCC729;color: #ffffff;box-shadow: 0px 0px 13px #b18911;}
.notification-info{background: #567DF4;color: #ffffff;box-shadow: 0px 0px 13px #2a4aab;}
.notification-dark{background: #191919;color: #ffffff;box-shadow: 0px 0px 13px #000000;}
.notification{
	display: block;
   font-size: 14px;
   padding: 15px 10px;
   position: fixed;
   top: 10%;
   right: 3%;
   box-sizing: border-box;
   border-radius: 4px;
   text-align: left;
   z-index: 99999999;
}



@media (min-width:576px) {
  .notification {
    width: 90%;
  }
}
@media (min-width:768px) {
  .notification {
    width: 50%;
  }
}
@media (min-width:992px) {
  .notification {
    width: 50%;
  }
}
@media (min-width:1200px) {
  .notification {
    width: 30%;
  }
}
@media (min-width:1400px) {
  .notification {
    width: 30%;
  }
}


.animateOpen{
   z-index: 999999;
	animation:moveOpen 4s;
	-webkit-animation:moveOpen 4s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}
/* Safari and Chrome */
@keyframes moveOpen 
	{
  from {-webkit-transform: translate(0,-100px);}
  10% {-webkit-transform: translate(0,20px);}
  12% {-webkit-transform: translate(0,22px);}
  16% {-webkit-transform: translate(0,20px);}
  80% {-webkit-transform: translate(0,20px);}
  85% {-webkit-transform: translate(0,25px);}
  to {-webkit-transform: translate(0,-100px);}
}
@-webkit-keyframes moveOpen 
	{
  from {-webkit-transform: translate(0,-100px);}
  10% {-webkit-transform: translate(0,20px);}
  12% {-webkit-transform: translate(0,22px);}
  16% {-webkit-transform: translate(0,20px);}
  80% {-webkit-transform: translate(0,20px);}
  85% {-webkit-transform: translate(0,25px);}
  to {-webkit-transform: translate(0,-100px);}
}

/* -----------------Notification----------------- */



/* -----------------Disable Cover----------------- */
#disable_cover_for_card {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1; /* make sure logout_box has a z-index of 2 */
	background-color: rgb(255, 255, 255);
	opacity: 0.7;
  margin: -1.25rem;
  background-image: url('../img/disabled_fill.svg');
  cursor: not-allowed;
}
/* -----------------Disable Cover----------------- */


.form-control:disabled, .form-control[readonly]{
  background: #fbfbfb;
  opacity: 0.7;
  background-image: url('../img/disabled_fill.svg');
  cursor: not-allowed;
}

/* -----------------Shake----------------- */
.shake{
  /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

}
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}



.shake-x {
  -webkit-animation: shakeX .15s ease;
  animation: shakeX .15s ease
}

@keyframes shakeX {
  0% {-webkit-transform: translate(0);transform: translate(0)}
  20% {-webkit-transform: translate(1em);transform: translate(1em)}
  40% {-webkit-transform: translate(-1em);transform: translate(-1em)}
  60% {-webkit-transform: translate(.5em);transform: translate(.5em)}
  80% {-webkit-transform: translate(-.5em);transform: translate(-.5em)}
  to {-webkit-transform: translate(0);transform: translate(0)}
}
.scale {-webkit-animation: shakeX .15s ease;animation: shakeX .15s ease}
.shake-scale {
  -webkit-animation: shakeX .25s ease, scale .15s ease;
  animation: shakeX .25s ease, scale .15s ease
}
@keyframes scale {
  0% {scale: 1}
  20% {scale: 1.3}
  40% {scale: 1.5}
  80% {scale: 1.3}
  to {scale: 1}
}
/* -----------------Shake----------------- */





/* -----------------Wave Hand----------------- */
.wave {
  animation-name: wave-animation;  /* Refers to the name of your @keyframes element below */
  animation-duration: 2.5s;        /* Change to speed up or slow down */
  animation-iteration-count: infinite;  /* Never stop waving :) */
  transform-origin: 70% 70%;       /* Pivot around the bottom-left palm */
  display: inline-block;
}

@keyframes wave-animation {
    0% { transform: rotate( 0.0deg) }
   10% { transform: rotate(14.0deg) }  /* The following five values can be played with to make the waving more or less extreme */
   20% { transform: rotate(-8.0deg) }
   30% { transform: rotate(14.0deg) }
   40% { transform: rotate(-4.0deg) }
   50% { transform: rotate(10.0deg) }
   60% { transform: rotate( 0.0deg) }  /* Reset for the last half to pause */
  100% { transform: rotate( 0.0deg) }
}
/* -----------------Wave Hand----------------- */




/* -----------------Bell Ring----------------- */
.ring{
  -webkit-animation: ring 4s .7s ease-in-out infinite;
  -webkit-transform-origin: 50% 4px;
  -moz-animation: ring 4s .7s ease-in-out infinite;
  -moz-transform-origin: 50% 4px;
  animation: ring 4s .7s ease-in-out infinite;
  transform-origin: 50% 4px;
}
@-webkit-keyframes ring {
  0% { -webkit-transform: rotateZ(0); }
  1% { -webkit-transform: rotateZ(30deg); }
  3% { -webkit-transform: rotateZ(-28deg); }
  5% { -webkit-transform: rotateZ(34deg); }
  7% { -webkit-transform: rotateZ(-32deg); }
  9% { -webkit-transform: rotateZ(30deg); }
  11% { -webkit-transform: rotateZ(-28deg); }
  13% { -webkit-transform: rotateZ(26deg); }
  15% { -webkit-transform: rotateZ(-24deg); }
  17% { -webkit-transform: rotateZ(22deg); }
  19% { -webkit-transform: rotateZ(-20deg); }
  21% { -webkit-transform: rotateZ(18deg); }
  23% { -webkit-transform: rotateZ(-16deg); }
  25% { -webkit-transform: rotateZ(14deg); }
  27% { -webkit-transform: rotateZ(-12deg); }
  29% { -webkit-transform: rotateZ(10deg); }
  31% { -webkit-transform: rotateZ(-8deg); }
  33% { -webkit-transform: rotateZ(6deg); }
  35% { -webkit-transform: rotateZ(-4deg); }
  37% { -webkit-transform: rotateZ(2deg); }
  39% { -webkit-transform: rotateZ(-1deg); }
  41% { -webkit-transform: rotateZ(1deg); }

  43% { -webkit-transform: rotateZ(0); }
  100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
  0% { -moz-transform: rotate(0); }
  1% { -moz-transform: rotate(30deg); }
  3% { -moz-transform: rotate(-28deg); }
  5% { -moz-transform: rotate(34deg); }
  7% { -moz-transform: rotate(-32deg); }
  9% { -moz-transform: rotate(30deg); }
  11% { -moz-transform: rotate(-28deg); }
  13% { -moz-transform: rotate(26deg); }
  15% { -moz-transform: rotate(-24deg); }
  17% { -moz-transform: rotate(22deg); }
  19% { -moz-transform: rotate(-20deg); }
  21% { -moz-transform: rotate(18deg); }
  23% { -moz-transform: rotate(-16deg); }
  25% { -moz-transform: rotate(14deg); }
  27% { -moz-transform: rotate(-12deg); }
  29% { -moz-transform: rotate(10deg); }
  31% { -moz-transform: rotate(-8deg); }
  33% { -moz-transform: rotate(6deg); }
  35% { -moz-transform: rotate(-4deg); }
  37% { -moz-transform: rotate(2deg); }
  39% { -moz-transform: rotate(-1deg); }
  41% { -moz-transform: rotate(1deg); }

  43% { -moz-transform: rotate(0); }
  100% { -moz-transform: rotate(0); }
}

@keyframes ring {
  0% { transform: rotate(0); }
  1% { transform: rotate(30deg); }
  3% { transform: rotate(-28deg); }
  5% { transform: rotate(34deg); }
  7% { transform: rotate(-32deg); }
  9% { transform: rotate(30deg); }
  11% { transform: rotate(-28deg); }
  13% { transform: rotate(26deg); }
  15% { transform: rotate(-24deg); }
  17% { transform: rotate(22deg); }
  19% { transform: rotate(-20deg); }
  21% { transform: rotate(18deg); }
  23% { transform: rotate(-16deg); }
  25% { transform: rotate(14deg); }
  27% { transform: rotate(-12deg); }
  29% { transform: rotate(10deg); }
  31% { transform: rotate(-8deg); }
  33% { transform: rotate(6deg); }
  35% { transform: rotate(-4deg); }
  37% { transform: rotate(2deg); }
  39% { transform: rotate(-1deg); }
  41% { transform: rotate(1deg); }

  43% { transform: rotate(0); }
  100% { transform: rotate(0); }
}
/* -----------------Bell Ring----------------- */





/* -----------------.modal-backdrop----------------- */
.modal-backdrop.show {
  opacity: .7 !important;
}
.modal-backdrop{
background: -webkit-repeating-linear-gradient(45deg, #000, #000 0.9rem, #000000 0, #141414 1.8rem);
background: repeating-linear-gradient(45deg, #000, #000 0.9rem, #000000 0, #141414 1.8rem);
}
/* -----------------.modal-backdrop----------------- */



/* -----------------MOVABLE MODAL----------------- */
/* .modal {
  position: relative;
}

.modal-dialog {
  position: fixed;
  width: 100%;
  margin: 0;
  padding: 10px;
}
.ui-helper-hidden-accessible { display:none; } */
/* -----------------MOVABLE MODAL----------------- */




/* ----------------- SHOW PASSWORD ----------------- */
.toggle-password.text-white{color:#ffffff !important}
.field-icon {
    float: right;
    margin-top: -30px;
    position: relative;
    z-index: 2;
    color: #a1a0a0;
    position: relative;
    left: -5px;
  }


    .bounce {
      -webkit-animation: bound .3s cubic-bezier(.3, 2.4, .85, 2.5);
      animation: bound .3s cubic-bezier(.3, 2.4, .85, 2.5)
    }
  
    @-webkit-keyframes bound {
      0%,
      to {
        top: 0
      }
  
      75% {
        top: 5px
      }
    }
  
    @keyframes bound {
  
      0%,
      to {
        top: 0
      }
  
      75% {
        top: 5px
      }
    }



/* ------------------ Flash */
.Blink {
  animation: blinker 0.3s cubic-bezier(.5, 0, 1, 1) infinite alternate;
}

@keyframes blinker {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}
    
@-webkit-keyframes row-flash {
  from { background-color: #8ACFC2; }
  to { background-color: inherit; }
}
@-moz-keyframes row-flash {
  from { background-color: #8ACFC2; }
  to { background-color: inherit; }
}
@-o-keyframes row-flash {
  from { background-color: #8ACFC2; }
  to { background-color: inherit; }
}
@keyframes row-flash {
  from { background-color: #8ACFC2; }
  to { background-color: inherit; }
}
.row-flash {
  -webkit-animation: row-flash 1s infinite; /* Safari 4+ */
  -moz-animation:    row-flash 1s infinite; /* Fx 5+ */
  -o-animation:      row-flash 1s infinite; /* Opera 12+ */
  animation:         row-flash 1s infinite; /* IE 10+ */
}


.blink-bg-red{
  color: #fff;
  animation: blinkingBackground 2s infinite;
}
@keyframes blinkingBackground{
  0%		{ background-color: #ef0a1a;color: #fff}
  25%		{ background-color: transparent;color: #ef0a1a}
  50%		{ background-color: #ef0a1a;color: #fff}
  75%		{ background-color: transparent;color: #ef0a1a}
  100%	{ background-color: #ef0a1a;color: #fff}
}


.blink-bg-yellow{
  color: #000000;
  animation: blinkingBackground 2s infinite;
}
@keyframes blinkingBackground{
  0%		{ background-color: #f3ec15;color: #000000}
  25%		{ background-color: transparent;}
  50%		{ background-color: #f3ec15;color: #000000}
  75%		{ background-color: transparent;}
  100%	{ background-color: #f3ec15;color: #000000}
}
/* ------------------ Flash */


button {
  position: relative;
  overflow: hidden;
}

    .ink {
    display: block;
    position: absolute;
    border-radius: 100%;
    transform: scale(0);
}
/*animation effect*/
.ink.animate {
    animation: ripple 0.65s linear;
}

@keyframes ripple {
    /*scale the element to 250% to safely cover the entire link and fade it out*/
    100% {
        opacity: 0;
        transform: scale(2.5);
    }
}




/* PULSE */
.pulse {
  -webkit-animation: pulse .15s ease;
  animation: pulse .15s ease
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  50% {
    -webkit-transform: scale(.98);
    transform: scale(.98)
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  50% {
    -webkit-transform: scale(.98);
    transform: scale(.98)
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

body.outer-app-wrapper,
html {
  height: auto
}

#outer-app .outer-base.login {
  -webkit-perspective: 1000px;
  perspective: 1000px
}

#outer-app .logo.kite-logo img {
  max-width: 60px
}
/* PULSE */




/*Back to Top */
.backToTop {

  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
  0% {
     opacity: 0;
     -webkit-transform: translateY(-300px);
  }
  100% {
     opacity: 1;
     -webkit-transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
     opacity: 0;
     transform: translateY(-300px);
  }
  100% {
     opacity: 1;
     transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
/*Back to Top */




/* REMARK */
.remark{
  border-radius: 3px;
  padding: 7px;
}
.remark-danger{
  border: 1px solid #e91e63;
  border-left: 15px solid #e91e63;
  background: #fff0f5;
  color: #e91e63;
}

.remark-success{
  border: 1px solid #4caf50;
  border-left: 15px solid #4caf50;
  background: #edffee;
  color: #4caf50;
}

.remark-info{
  border: 1px solid #2196f3;
  border-left: 15px solid #2196f3;
  background: #f2f9ff;
  color: #2196f3;
}






/* ================ DRIVE/WORK ASSIGNMENT ================ */
.assignment_card{
   /* box-shadow: 0 0 10px #dddddd; */
   border: 1px solid #ededed;
   border-radius: 8px;
   overflow: hidden;
}
.assignment_card header{
   padding: 10px;
   font-size: 17px;
   font-weight: bold;
   text-align: center;
   color:white;
   padding: 20px 0;
   background: rgb(2,121,254);
   background: linear-gradient(143deg, rgba(2,121,254,1) 0%, rgba(2,83,252,1) 100%);
}
.assignment_body{
   background: #f3f3f3;
   padding: 10px;
}
.assignment_body .head{
   padding: 10px;
   background: white;
   border-radius: 5px;
   position: relative;
   top: -22px
}
.assignment_row{
   padding: 10px;
   background: white;
   border-radius: 5px;
   position: relative;
   top: -15px;
   margin-bottom:5px;
}
/* ================ DRIVE/WORK ASSIGNMENT ================ */




.panelB_search{
  background: white;
  padding: 1rem !important;
  box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
  border-left:5px solid #1e6acc;
  border-radius: 5px;
}
.panelB_search .btn-search{
  
}









/* ================ VERTICAL MENU [WARD-PATIENTSECTION] ================ */
.v-menu-ui-1{
  list-style: none;
  background: white;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #e9e9e9;
}
.v-menu-ui-1 li{
  line-height: 28px;
  transition: all .3s;
  margin-bottom: 3px;
}
.v-menu-ui-1 li:hover{
  background: #9d63dd;
  border-radius: 50px;
}
.v-menu-ui-1 li:hover a{
  color:#fff !important
}
.v-menu-ui-1 li:hover:not(.v-menu-ui-1-active) a{
  color: rgb(72 11 159);
  padding-left: 10px;
  -webkit-animation: shakeX .15s ease;
  animation: shakeX .15s ease
}
.v-menu-ui-1 li a{
  color: black;
  display: block;
  line-height: 40px;
}
.v-menu-ui-1 li a:hover{
  
}
.v-menu-ui-1 li a i{
  width: 20px;
}
.v-menu-ui-1-active{
  background: #9d63dd;
  border-radius: 50px;
  color: rgb(255, 255, 255) !important;
  padding-left: 10px;
}
.v-menu-ui-1-active a{
  color:#fff !important
}
/* ================ VERTICAL MENU [WARD-PATIENTSECTION] ================ */



/* ================ HORIZONTAL MENU [WARD-PATIENTSECTION] ================ */

.h-menu-ui-1{
  list-style: none;
  background: white;
  padding: 10px;
  margin:5px 0px !important;
  border-radius: 5px;
  border: 0px solid #e9e9e9;
}
.h-menu-ui-1 li{
  line-height: 28px;
  transition: all .3s;
  margin-bottom: 3px;
  margin: 0 6px;
}
.h-menu-ui-1 li:hover{
  background: #9d63dd;
  border-radius: 50px;
}
.h-menu-ui-1 li:hover a{
  /* color:#fff !important */
}
.h-menu-ui-1 li:hover:not(.h-menu-ui-1-active) a{
  color: rgb(72 11 159);
  padding-left: 6px;
  font-weight: normal;
  font-size: 15px;
  -webkit-animation: shakeX .15s ease;
  animation: shakeX .15s ease
}
.h-menu-ui-1 li a{
  color: black;
  display: block;
  line-height: 25px;
  font-weight: normal;
  text-transform: capitalize;
  font-size: 15px;
}
.h-menu-ui-1 li a:focus{
  color: black;
  display: block;
  line-height: 25px;
  font-weight: normal;
  text-transform: capitalize;
  font-size: 15px;
}
.h-menu-ui-1 li a:hover{
  
}
.h-menu-ui-1 li a i{
  width: 20px;
}
.h-menu-ui-1-active{
  background: #9d63dd;
  border-radius: 50px;
  color: rgb(255, 255, 255) !important;
  padding-left: 0px;
  font-weight: normal;
  font-size: 15px;
}
.h-menu-ui-1-active a{
  color:#fff !important
}
/* ================ HORIZONTAL MENU [WARD-PATIENTSECTION] ================ */



.mediIssuSuccess{
	background: #4caf50 !important;
	color: #ffffff !important;
	cursor: not-allowed;
}
.mediIssuDanger{
	background: #f44336 !important;
	color: #ffffff !important;
	cursor: not-allowed;
}
.mediIssuPrimary{
	background: #3678f4 !important;
	color: #ffffff !important;
	cursor: not-allowed;
}


.rejected {
  position: absolute;
  top: 28px;
  left: 102px;
  z-index: 1;
  rotate: -16deg;
}


/* FOR PRINT BUTTON */
.float-btn{
      position: fixed;
      padding: 8px;
      top: 5%;
      right: -152px;
      background: #363636;
      color: white;
      width: 180px;
      height: 90px;
      z-index: 9999;
      font-size: 12px !important;
    }
    .float-btn:hover{
      right:0px;
      transition: .3s;
    }
    .float-btn label{
      transform: rotate(-90deg);
      position: absolute;
      left: -20px;
      top: 31px;
      font-size: 18px !important;
    }
    .float-btn nav{
      margin: 13px 24px
    }
/* FOR PRINT BUTTON */


/* REFUND BUTTON */
.refund-btn {
  background: #ffc107;
  padding: 10px 2rem;
  outline: 2.5px solid #FEBF00;
  outline-offset: 2px;
  border: 0;
  color: white;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 1rem;
  border-radius: 100rem;
  transition: 0.4s;
  font-weight: 600;
}

.refund-btn:hover {
  outline-offset: 4.5px;
  background: #FEBF00;
  font-size: 13px;
  color:#765b06 !important
}
/* REFUND BUTTON */


/* OPD MANAGEMENT BUTTON */
.opd-management-btn {
  background: #dc3545;
  padding: 10px 2rem;
  outline: 2.5px solid #dc3545;
  outline-offset: 2px;
  border: 0;
  color: white !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 1rem;
  border-radius: 100rem;
  transition: 0.4s;
  font-weight: 600;
}

.opd-management-btn:hover {
  outline-offset: 4.5px;
  background: #dc3545;
  font-size: 13px;
}
/* OPD MANAGEMENT BUTTON */


/* TEXT */
.line-through{
  text-decoration: line-through !important;
}
/* TEXT */




/* DROPDOWN MULTISELECT */
.dropdown-multiselect{
  padding:0px;
}
.dropdown-multiselect .dropdown-menu{
  padding:5px 8px;
  overflow-y:scroll !important;
}
.dropdown-multiselect .dropdown-menu a{
  color: black !important;
  cursor: pointer;
  padding: 3px 2px;
}
.dropdown-multiselect .dropdown-menu li.bg-dark a{
  color: white !important;
  cursor: pointer;
  padding: 3px 2px;
}



.add-multiply-r::after{
  content:"X";
  position: absolute;
  right:2px;
  right: -3px;
  top: 35px;
}
.add-equal-r::after{
  content:"=";
  position: absolute;
  right:2px;
  right: -3px;
  top: 35px;
}


.pointer-events{
  pointer-events:none;
  
}
.pointer-events td{
  color:rgb(140, 140, 140) !important;
  background-color: #d4d4d4;
}



.print-anim{
  content: "";
  background: url('../../assets/img/icon/print.gif');
  width:30px !important;
  height: 30px !important;
  position: relative;
  background-size: cover;
  cursor: pointer;
}
.print-anim-dnone{
  display: none;
}


.table tbody tr.khaki td{
    background:khaki
  }









/* ===================== LOADER 2 [WORKING] ================= */


figcaption {
	font: 600 1.6rem consolas;
	text-transform: uppercase;
	margin-top: 7px;
	text-align: center;
	text-shadow: 1px 1px #000;
}

.success {
	color: #00cc74;
}

.info {
	color: #999;
}

.warning {
	color: #f7d600;
}

.danger {
	color: #d70902;
}

@-webkit-keyframes f {
	0% {
		background-position: 0px 0;
	}

	to {
		background-position: 100px 0;
	}
}

@keyframes f {
	0% {
		background-position: 0px 0;
	}

	to {
		background-position: 100px 0;
	}
}

figure .progress {
	overflow: hidden;
	height: 7px;
	border-radius: 0px;
  position:fixed;
  z-index: 999;
  width: 100%;
  top:0px;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

figure .progress-bar {
	height: 100%;
	box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}

figure .progress-bar-striped,
figure .progress-striped .progress-bar {
	background-image: linear-gradient(
		45deg,
		hsla(0, 0%, 95%, 0.8) 25%,
		transparent 0,
		transparent 50%,
		hsla(0, 0%, 95%, 0.8) 0,
		hsla(0, 0%, 95%, 0.8) 75%,
		transparent 0,
		transparent
	);
	background-size: 40px 40px;
}

.progress-bar.active,
.progress.active .progress-bar {
	-webkit-animation: f 2s linear infinite;
	animation: f 10s linear infinite;
}

.progress-bar-success {
	background-color: #00cc74;
}

.progress-striped .progress-bar-success {
	background-image: linear-gradient(
		45deg,
		hsla(0, 0%, 100%, 0.15) 25%,
		transparent 0,
		transparent 50%,
		hsla(0, 0%, 100%, 0.15) 0,
		hsla(0, 0%, 100%, 0.15) 75%,
		transparent 0,
		transparent
	);
}

.progress-bar-info {
	background-color: #999;
}

.progress-striped .progress-bar-info {
	background-image: linear-gradient(
		45deg,
		hsla(0, 0%, 95%, 0.8) 25%,
		transparent 0,
		transparent 50%,
		hsla(0, 0%, 95%, 0.8) 0,
		hsla(0, 0%, 95%, 0.8) 75%,
		transparent 0,
		transparent
	);
}

.progress-bar-warning {
	background-color: #f7d600;
}

.progress-striped .progress-bar-warning {
	background-image: linear-gradient(
		45deg,
		hsla(0, 0%, 100%, 0.15) 25%,
		transparent 0,
		transparent 50%,
		hsla(0, 0%, 100%, 0.15) 0,
		hsla(0, 0%, 100%, 0.15) 75%,
		transparent 0,
		transparent
	);
}

.progress-bar-danger {
	background-color: #d70902;
}

.progress-striped .progress-bar-danger {
	background-image: linear-gradient(
		45deg,
		hsla(0, 0%, 100%, 0.15) 25%,
		transparent 0,
		transparent 50%,
		hsla(0, 0%, 100%, 0.15) 0,
		hsla(0, 0%, 100%, 0.15) 75%,
		transparent 0,
		transparent
	);
}

/* ===================== LOADER 2 ================= */



.table-gold, .table-gold>td, .table-gold>th{background-color: gold;}
.table-hover .table-gold:hover{background-color: rgb(255, 187, 0);}



/* ===================== ANIMATED BACKGROUND ================= */
.gradient1{
  animation: gradient 15s ease infinite !important;
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}


#countdown{
  background-color: #d50000;
  width: 100%;
  text-align: center;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  line-height: 45px;
  color: white;
  font-size: 28px;
  z-index: 99999;
}


input:hover, select:hover, textarea:hover {
  background-color: rgb(246, 228, 205)  !important;
  color:#000000 !important;
}
input:focus, select:focus, textarea:focus {
  background-color: tan  !important;
  color:#000000 !important;
}




/* ------- CLIENT CODE ------- */
#clientCode{
  text-align: center;
  line-height: 18px;
}

#clientCode .label{
  color: chocolate;
  font-weight: 500;
  display: block;
}
#clientCode .code::before{
  content: "#";
  color:#bcbcbc
}
#clientCode .code{
  font-family: 'Poppins';
  font-size: 20x;
}

#client_support img {
  height: 30px;
  border-radius: 50%; /* Makes the image rounded */
  animation: wave 2s ease-in-out infinite, roundPulse 4s ease-in-out infinite;
}

/* Wave animation */
@keyframes wave {
  0% {
      transform: rotate(0deg) translateX(0px);
  }
  25% {
      transform: rotate(5deg) translateX(5px);
  }
  50% {
      transform: rotate(0deg) translateX(0px);
  }
  75% {
      transform: rotate(-5deg) translateX(-5px);
  }
  100% {
      transform: rotate(0deg) translateX(0px);
  }
}

/* Pulse for smooth rounded effect */
@keyframes roundPulse {
  0%, 100% {
      border-radius: 50%;
  }
  50% {
      border-radius: 40%;
  }
}

#client_support a{
  font-family: math;
  font-size: 21px;
  line-height: 10px;
}
#client_support a span{
  font-size: 15px;
  display: block;
  color: black;
}
/* ------- CLIENT CODE END ------- */


@keyframes beat{
	to { transform: scale(1.4); }
}

.blacklist{
  
  animation: beat .25s infinite alternate;
  
}