.btn-login {
    color: #fff;
    background-color: #A8005C;
    border-color: #A8005C;
}


.btn-login:hover {
    color: #fff;
    background-color: #7B004F;
    border-color: #7B004F;
}

.btn-login:focus,
.btn-login.focus {
    box-shadow: 0 0 0 0rem #7B004F;
    color: #fff;
    background-color: #7B004F;
    border-color: #7B004F;

}


 a {
     color: inherit;
 }

 .card__one {
     transition: transform .5s;
 }

 .card__one::after {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     transition: opacity 2s cubic-bezier(.165, .84, .44, 1);
     box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .15);
     content: '';
     opacity: 0;
     z-index: -1;
 }

 .card__one:hover,
 .card__one:focus {
     transform: scale3d(1.036, 1.036, 1);
     -webkit-box-shadow: -1px -1px 16px -4px rgba(0, 0, 0, 0.53);
     -moz-box-shadow: -1px -1px 16px -4px rgba(0, 0, 0, 0.53);
     box-shadow: -1px -1px 16px -4px rgba(0, 0, 0, 0.53);


 }

 a:hover {
     color: inherit;
     text-decoration: none;
     cursor: pointer;
 }

 #loader {
     position: relative;
     width: 50px;
     height: 50px;
     border: 2px solid rgba(255, 255, 255, 0.2);
     border-radius: 50px;
     top: 100px;
     left: 50%;
     margin-left: -25px;
     animation-name: spinner 0.4s linear infinite;
     -webkit-animation: spinner 0.4s linear infinite;
     -moz-animation: spinner 0.4s linear infinite;
 }

 

 @keyframes spinner {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 @-webkit-keyframes spinner {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 @-moz-keyframes spinner {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 /* BOOTSTRAP SELECT CSS */
 .btn-light {
     color: #999;
     background: white;
     border-color: #CED4DA;
 }

 .dropdown-item.active,
 .dropdown-item:active {
     color: #333351;
     text-decoration: none;
     background-color: #E6ECF0;
 }

 /* SCROLL BAR */
 /*
       *  STYLE 3
       */
 .style-3::-webkit-scrollbar-track {
     -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
     background-color: #F5F5F5;
 }

 .style-3::-webkit-scrollbar {
     width: 6px;
     background-color: #F5F5F5;
 }

 .style-3::-webkit-scrollbar-thumb {
     background-color: #1BAD9D;
 }

 .hilang {
     display: none !important;
 }

 /* PROGRESS AND LOADER */
 #nprogress .bar {
     background: red !important;
 }

 #nprogress .peg {
     box-shadow: 0 0 10px red, 0 0 5px red !important;
 }

 #nprogress .spinner-icon {
     border-top-color: red !important;
     border-left-color: red !important;
 }

 #preloader {
     z-index: 999999;
     position: fixed;
     top: 0;
     left: 0;
     background: #ffffffeb;
     width: 100%;
     height: 100%;
     /*  */
 }

 #loader {
     display: block;
     position: relative;
     left: 50%;
     top: 50%;
     width: 150px;
     height: 150px;
     margin: -75px 0 0 -75px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #00B6FE;
     -webkit-animation: spin 2s linear infinite;
     animation: spin 2s linear infinite;
 }

 #loader:before {
     content: "";
     position: absolute;
     top: 5px;
     left: 5px;
     right: 5px;
     bottom: 5px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #A8005C;
     -webkit-animation: spin 3s linear infinite;
     animation: spin 3s linear infinite;
 }

 #loader:after {
     content: "";
     position: absolute;
     top: 15px;
     left: 15px;
     right: 15px;
     bottom: 15px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color:#00597A;
     -webkit-animation: spin 1.5s linear infinite;
     animation: spin 2s linear infinite;
 }

 @-webkit-keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
         transform: rotate(0deg);
     }

     100% {
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg);
     }
 }

 @keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
         transform: rotate(0deg);
     }

     100% {
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg);
     }
 }

 /* FLOATING BUTTON */
 .circle-div {
     height: 60px;
     /* width: 60px; */
     border-radius: 100%;
     position: fixed;
     bottom: 21px;
     right: 25px;
 }

 /* LIST SELECT DEVICE */
 .devices .list-group {
     display: flex;
     flex-direction: column;
     padding-left: 0;
     margin-bottom: 0;
 }

 .devices .list-group-item-action {
     width: 100%;
     color: #495057;
     text-align: inherit;
 }

 .devices .list-group-item-action:hover,
 .devices .list-group-item-action:focus {
     color: #495057;
     text-decoration: none;
     background-color: #f8f9fa;
 }

 .devices .list-group-item-action:active {
     color: #868ba1;
     background-color: #e9ecef;
 }

 .devices .list-group-item {
     position: relative;
     display: block;
     padding: 0.75rem 1.25rem;
     margin-bottom: 10px;
     background-color: #fff;
     border: 1px solid rgba(0, 0, 0, 0.125);
 }

 .devices .list-group-item:first-child {
     border-top-left-radius: 20px;
     border-top-right-radius: 20px;
 }

 .devices .list-group-item:last-child {
     margin-bottom: 10px;
     border-bottom-right-radius: 20px;
     border-bottom-left-radius: 20px;
 }

 .devices .list-group-item:hover,
 .devices .list-group-item:focus {
     z-index: 1;
     text-decoration: none;
 }

 .devices .list-group-item.disabled,
 .devices .list-group-item:disabled {
     color: #6c757d;
     background-color: #fff;
 }

 .devices .list-group-item.active {
     z-index: 2;
     color: #fff !important;
     background-color: #020d35;
     border-color: #020d35;
 }


 /* DATE PICKER */
 /* .datepicker-dropdown{
     z-index: 999 !important;
 } */

 /* MODAL */
 .modal-backdrop{
     z-index: 99999;
 }

 .modal{
     z-index: 100000;

 }

 /* SWALL */
 .swal2-container.swal2-backdrop-show,
 .swal2-container.swal2-noanimation {
     background: rgba(0, 0, 0, .4);
     z-index: 99999;
 }

 /* LOADER */
.overlay-ajax {
    width: 100%;
    height: 100%;
    display: table;
    background: rgba(255, 255, 255, 0.5);
    padding: 20px;
}

.overlay-ajax i {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.spin-big {
    font-size: 50px;
    height: 50px;
    width: 50px;

}

.spin-normal {
    font-size: 35px;
    height: 35px;
    width: 35px;
}

.spin-small {
    font-size: 20px;
    height: 20px;
    width: 20px;
}

/* SELECT PICKER */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0099F7;
}