.dp__theme_light {
    --dp-background-color: #ffffff;
    --dp-text-color: #212121;
    --dp-hover-color: #f3f3f3;
    --dp-hover-text-color: #212121;
    --dp-hover-icon-color: #959595;
    --dp-primary-color: #1976d2;
    --dp-primary-text-color: #f8f5f5;
    --dp-secondary-color: #c0c4cc;
    --dp-border-color: #b4b4b4 !important;
    --dp-menu-border-color: #ddd;
    --dp-border-color-hover: #2471ff !important;
    --dp-disabled-color: #f6f6f6;
    --dp-scroll-bar-background: #f3f3f3;
    --dp-scroll-bar-color: #959595;
    --dp-success-color: #76d275;
    --dp-success-color-disabled: #a3d9b1;
    --dp-icon-color: #404040 !important;
    --dp-danger-color: #ff6f60;
    --dp-highlight-color: rgba(25, 118, 210, 0.1);
 }
 :root {
    /*General*/
    --dp-font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans",
    "Helvetica Neue", sans-serif;
    --dp-border-radius: 4px; /*Configurable border-radius*/
    --dp-cell-border-radius: 4px; /*Specific border radius for the calendar cell*/
    --dp-common-transition: all 0.1s ease-in; /*Generic transition applied on buttons and calendar cells*/

    /*Sizing*/
    --dp-button-height: 35px; /*Size for buttons in overlays*/
    --dp-month-year-row-height: 35px; /*Height of the month-year select row*/
    --dp-month-year-row-button-size: 35px; /*Specific height for the next/previous buttons*/
    --dp-button-icon-height: 20px; /*Icon sizing in buttons*/
    --dp-cell-size: 35px; /*Width and height of calendar cell*/
    --dp-cell-padding: 5px; /*Padding in the cell*/
    --dp-common-padding: 10px; /*Common padding used*/
    --dp-input-icon-padding: 35px; /*Padding on the left side of the input if icon is present*/
    --dp-input-padding: 6px 30px 6px 12px; /*Padding in the input*/
    --dp-menu-min-width: 260px; /*Adjust the min width of the menu*/
    --dp-action-buttons-padding: 2px 5px; /*Adjust padding for the action buttons in action row*/
    --dp-row-maring:  5px 0; /*Adjust the spacing between rows in the calendar*/
    --dp-calendar-header-cell-padding:  0.5rem; /*Adjust padding in calendar header cells*/
    --dp-two-calendars-spacing:  10px; /*Space between multiple calendars*/
    --dp-overlay-col-padding:  3px; /*Padding in the overlay column*/
    --dp-time-inc-dec-button-size:  32px; /*Sizing for arrow buttons in the time picker*/
    --dp-menu-padding: 6px 8px; /*Menu padding*/

    /*Font sizes*/
    --dp-font-size: 18px !important; /*Default font-size*/
    --dp-preview-font-size: 0.8rem; /*Font size of the date preview in the action row*/
    --dp-time-font-size: 0.8rem; /*Font size in the time picker*/

    /*Transitions*/
    --dp-animation-duration: 0.1s; /*Transition duration*/
    --dp-menu-appear-transition-timing: cubic-bezier(.4, 0, 1, 1); /*Timing on menu appear animation*/
    --dp-transition-timing: ease-out; /*Timing on slide animations*/
}

.dp__input_wrap {
    width: 98% !important;
    margin: 0 0 0 6px !important;
}
.mt-24{
    margin-top: 24px;
    font-weight: 500;
    padding: 8px;
}
.add_btn
{
    position: absolute;
    right: 3%;
    top: -8%;
}
.absolute{
    position: absolute !important;
}
.relative{
    position: relative !important;
}
.top-27{
    top: 27px !important;
}
.left-two-percent{
    margin-left: 2%;
}
.modal.right.fade .modal-dialog {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    -ms-transform: translate(100%, 0);
}

.modal-dialog{
    /* width: 35% !important;
    margin: 0 65% !important; */
    min-width: 78% !important;
    margin: 0 0!important;
    position: absolute !important;
    right: 0 !important;

}
.modal.right.fade.in .modal-dialog {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -ms-transform: translate(0, 0);
}

.modal-content {
    border-radius: 0;
    border: none;
    height: 100vh;
}

.modal-header {
    border-bottom-color: #EEEEEE;
    background-color: #FAFAFA;
    display: block !important;
}
.notification-position{
    position: fixed;
    z-index: 1000;
    width: 40% !important;
    top: 0%;
    right: 0%;
}

.notif-row{
    top: 0%;
    position: fixed;
    width: 100%;
    z-index: 1000;
    display: flex !important;
    flex-direction: column !important;
    /* display: grid;
    justify-items: end; */
}
.notif-position{
    position: relative;
    z-index: 1000;
    width: 40% !important;
    left: 0;
}
.btn {
    display: inline-block !important;
}
.btn-table{
    position: relative;
    bottom: 6px;
    right: 8px;
    color: #411ef1 !important;
    FONT-WEIGHT: 600;
}
.select-table{
    position: relative;
    top: 17px;
    padding: 9px;
    background-color: #f0f0f1;
}
a{
    text-decoration: none !important;
}
.select2-container .select2-selection--single {
    height: 33px !important;
    font-size: 12px!important;
}
.form-control{
    width: 95% !important;
    font-size: 12px !important;
}
.input-group{
    position: relative !important;
    display: table !important;
    width: 98% !important;
}
.input-group-addon{
    position: relative !important;
    right: 10px !important;
}
.dp__input{
    font-size: 12px !important;
}
.fixed-bottom{
    z-index: 1 !important;
    position: relative !important;
    width: 100% !important;
    bottom: 10px !important;
}
.tile-block{
    position: relative;
    z-index: 2 !important;
}

.input-lg {
    height: 42px !important;
    padding: 10px 16px !important;
    line-height: 1.3333333 !important;
    border-radius: 3px !important;
    margin: 0 0 0 6px !important;
    width: 96% !important;
}
.btn-xs{
    padding: 1px 5px !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    border-radius: 2px !important;
}
.fa-pencil{
    font-size: 11px !important;
}
tr{
    font-size: 12px !important;
}
.btn{
    font-size: 10px !important;
}
.btn-link{
    text-decoration: none !important;
    font-size: 12px !important;
    margin: 0px 0px 0px -12px !important;
}
.todo-list{
    font-size: 12px !important;
}
.modal-bg{
z-index: 2 !important;
}
.loader-spinner{
    position: relative;
    bottom: 8px;
    margin-left: 14px;
    font-size: 14px;
}
.dt-search{
    width: 200px !important;
    height: 32px !important;
    right: 9px;
}
.img_id{
position: absolute;
}
.img_sign{
    position: relative;
    }
.sign{
    position: absolute;
}

.switches {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 20px;
  }

  .switches input {
    display: none !important;
  }

  .sliders {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: -15px;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
  }

  .sliders:before {
    position: absolute;
    content: "";
    height: 12px;
    width: 12px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
  }

  input:checked + .sliders {
    background-color: #4285f4;
  }

  input:focus + .sliders {
    box-shadow: 0 0 1px #4285f4;
  }

  input:checked + .sliders:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }

  .sliders.round {
    border-radius: 34px;
  }

  .sliders.round:before {
    border-radius: 50%;
  }

  .footer-con-grty{
    position: relative;
}

.pre-con-grty{
    position: relative;
    right: 4%;
    font-size: 18px;
    line-height: 3.9rem;
    margin-bottom: -41px;
    margin-top: -54px;
}
.pre-con-grty-print{
    position: relative;
    font-size: 15px;
    line-height: 1.5rem;
    margin-bottom: -25px;
    margin-top: -21px;
}
.fade-transition {
    transition: opacity .5s ease;
  }
  .fade-enter, .fade-leave {
    opacity: 0;
  }