/* START:: setting appearance */


.switch {
    position: relative;
    width: 150px;
    height: 30px;
    text-align: center;
    margin: 0;
    background: #D8D9DA;
    transition: all 0.2s ease;
    /* border-radius: 25px; */
    font-size:12px;

}
.switch span:after {
    content: "";
    display: block;
    position: absolute;
    width: 4px;
    height: 10px;
    margin-top: -8px;
    background: #fff;
    transition: all 0.2s ease;
}

.switch label {
    cursor: pointer;
    color: rgba(0, 0, 0, 0.2);
    width: 60px;
    line-height: 30px;
    transition: all 0.2s ease;
}
label[for="headwhite"] {
    position: absolute;
    left: 0px
}
label[for="asidewhite"] {
    position: absolute;
    left: 0px
}
label[for="headblck"] {
    position: absolute;
    right: 0px;
}
label[for="asideblck"] {
    position: absolute;
    right: 0px;
}


/* ------------------------------- */
#headblck:checked ~ .switch {
    background: #D8D9DA;
}
#headblck:checked ~ .switch span {
    background: #fff;
    margin-left: -8px;
}
#headblck:checked ~ .switch span:after {
    background: #fff;
    height: 20px;
    margin-top: -8px;
    margin-left: 8px;
    opacity:0.5px;
}
/* ------------------------------ */

#asideblck:checked ~ .switch {
    background: #D8D9DA;
}
#asideblck:checked ~ .switch span {
    background: #fff;
    margin-left: -8px;
}
#asideblck:checked ~ .switch span:after {
    background: #fff;
    height: 20px;
    margin-top: -8px;
    margin-left: 8px;
    opacity:0.5px;
}

/* ------------------------------ */


#headwhite:checked ~ .switch label[for="headwhite"] {
    color: #fff;
    background-color:black;
    width:50%;
    height:100%;
    /* border-radius:24px 0px 0px 24px; */
    padding:0;
    margin:-1px;
    font-size:15px;
}
#asidewhite:checked ~ .switch label[for="asidewhite"] {
    color: #fff;
    background-color:black;
    width:50%;
    height:100%;
    /* border-radius:24px 0px 0px 24px; */
    padding:0;
    margin:-1px;
    font-size:15px;
}
#headblck:checked ~ .switch label[for="headblck"] {
    color: black;
    background-color:white;
    width:50%;
    height:100%;
    /* border-radius:0px 24px 24px 0px; */
    padding:1px;
    margin:-1px;
    font-size:15px;
}
#asideblck:checked ~ .switch label[for="asideblck"] {
    color: black;
    background-color:white;
    width:50%;
    height:100%;
    /* border-radius:0px 24px 24px 0px; */
    padding:1px;
    margin:-1px;
    font-size:15px;
}

/* type */
#lswitch {
    cursor: pointer;
    text-indent: -9999px;
    width: 47px;
    height: 27px;
    background: grey;
    display: block;
    border-radius: 100px;
    position: relative;
}

#lswitch:after {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    width: 17px;
    height: 17px;
    background: #fff;
    border-radius: 90px;
    transition: 0.3s;
}

#switch:checked + #lswitch {
    background: rgb(70, 25, 89);
}

#switch:checked + #lswitch:after {
    left: calc(100% - 5px);
    transform: translateX(-100%);
}

#lswitch:active:after {
    width: 27px;
}

/* END:: setting appearance */





/* Variables */
:root {
    --primary: #4CB3D6;
  }

/* General */
.I-25 i{font-size: 25px!important;}
.I-35 i{font-size: 35px!important;}

.D-Inline{display: inline-block!important;}

.I-Primary i{color: var(--primary);}


/*Login Page*/
/* .Login-Container{
    background-color: red;
}
    .Login-Container .Left-Container{
        background-color: pink;
    }
    .Login-Container .Right-Container{
        background-color: pink;
    } */

.Module-Page .cardItem {
    transition: 0.4s;
}

.Module-Page .page_icon i {
    font-size: 50px;
}

.Module-Page .cardItem:hover {
    transform: scale(0.9, 0.9);
    box-shadow: 0px 0px 10px 2px rgba(173, 171, 173, 1);
}

.Module-Page .title-card {
    transform: scale(0.9, 0.9);
    box-shadow: 0px 0px 10px 2px rgba(173, 171, 173, 1);
}

.Module-Page .page_title_card {
    word-wrap: break-word;
    word-break: break-all;
}

.workspace-bg-light {
    background-color: #f7f9fe !important;
}

.workspace-bg-secondary {
    background-color: #707070 !important;
}

.workspace-bg-dark {
    background-color: #212121 !important;
}

.workspace-bg-primary {
    background-color: #4cb3d6 !important;
}

.workspace-bg-secondary {
    background-color: #1e1f4e !important;
}

.workspace-bg-secondary-dark {
    background-color: #0a0b32 !important;
}

.workspace-bg-purple {
    background-color: #0a0b32 !important;
}

.workspace-active {
    color: #1e1f4e !important;
}

.workspace-text-primary {
    color: #4cb3d6 !important;
}

.workspace-text-orange {
    color: rgb(233, 111, 30);
}

.workspace-text-secondary {
    color: #1e1f4e !important;
}

.workspace-text-secondary-dark {
    color: #0a0b32 !important;
}

.support-chat-btn-div {
    display: flex;
    position: fixed;
    bottom: 70px;
    right: 20px;
}

.ms-275px {
    margin-left: 275px;
}


/*****Aside*****/
.header-nav-logo {
    font-style: normal;
    font-weight: 800;
    font-size: 18px;
    color: #ffffff;
    letter-spacing: 1.2px;
}

.header-nav-logo:hover {
    color: #ffffff;
}

.btn-check:checked + .btn.btn-active-light-workspace-primary,
.btn-check:active + .btn.btn-active-light-workspace-primary,
.btn.btn-active-light-workspace-primary:focus:not(.btn-active),
.btn.btn-active-light-workspace-primary:hover:not(.btn-active),
.btn.btn-active-light-workspace-primary:active:not(.btn-active),
.btn.btn-active-light-workspace-primary.active,
.btn.btn-active-light-workspace-primary.show,
.show > .btn.btn-active-light-workspace-primary {
    transition: color 0.2s ease, background-color 0.2s ease;
    background-color: rgba(78, 78, 78, 0.38) !important;
    color: white !important;
}

.menu-state-bg .menu-item .menu-link.active {
    transition: color 0.2s ease, background-color 0.2s ease;
    background-color: rgba(78, 78, 78, 0.38) !important;
}

.menu-state-bg .menu-item .menu-link:hover:not(.disabled):not(.active),
.menu-state-bg .menu-item.hover > .menu-link:not(.disabled):not(.active) {
    transition: color 0.2s ease, background-color 0.2s ease;
    background-color: rgba(78, 78, 78, 0.38) !important;
    color: white !important;
}

.aside-dark .menu .menu-item .menu-link.active .menu-icon i,
.aside-dark .menu .menu-item .menu-link:hover .menu-icon i {
    color: #41c9f7 !important;
    /* color: var(--bs-gray-200); */
}

.aside-dark .menu .menu-item .menu-link {
    border-radius: 8px !important;
    margin: 4px !important;
    padding: 10px !important;
}
.menu-link.disabled{
    pointer-events: none;
    opacity: 0.6;
}


.aside-dark .menu .menu-item .menu-link:hover,
.aside-dark .menu .menu-item .menu-link.active {
    background-color: #58b2d154 !important;
    /* background-color: var(--bs-gray-900); */
}

.aside-dark .menu-item .menu-link .menu-icon {
    flex-shrink: 1 !important;
    margin-right: 0 !important;
    justify-content: center !important;
}

.aside-dark .menu .menu-item .menu-link .menu-title {
    margin-left: 0.5em !important;
}




/*****Sub-Aside*****/
.SubAside-Container{
    position: absolute;
    top: 65px;
    height: calc(100vh - 65px);
    z-index: 99;
}
.sub-aside-menu{
    margin-top: 0;
    top: 0;
    height: calc(100vh - 65px);
}
.sub-aside-menu .menu>.menu-item {
    margin-bottom: 2px !important;
}

.sub-aside-menu .menu-item > .menu-link:hover,
.sub-aside-menu .menu-item .menu-link.active,
.sub-aside-menu .show > .menu-link
 {
    /* transition: color 0.2s ease, background-color 0.2s ease; */
    /* background-color: var(--bs-primary) !important; */
    /* color: white !important; */
    /* border-radius: 5px; */
}

.sub-aside-menu .menu-sub .menu-item > .menu-link:hover,
.sub-aside-menu .menu-sub .menu-item > .menu-link:hover .menu-title,
.sub-aside-menu .menu-sub .menu-item.show > .menu-link > .menu-title,
.sub-aside-menu .menu-sub .show > .menu-link  {
    background-color: transparent !important;
    /* color: #ffffff !important; */
}

.sub-aside-menu .menu-sub .menu-item .menu-title {
    /* color: #707070 !important; */
}


.sub-aside-menu .menu .menu-item .menu-link:hover,
.sub-aside-menu .menu .menu-item .menu-link.active {
    /* background-color: var(--bs-primary) !important; */
    /* color: white !important; */

}

.menu-sub.menu-sub-accordion > .menu-item:first-child {
    margin-top: 3px !important;
}

.menu-sub.menu-sub-accordion > .menu-item:last-child {
    margin-bottom: 3px !important;
}







/* own css style */
:root {
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --flex-start: flex-start;
    --dNone: none;
    --vHidden: hidden;
    --black: black;
    --default-transition: 0.3s;
    --grab-cursor: grab;
    --font-weight: 300;
}


/***** SUBASIDE ICONS & PARENT TEXT *****/
.sub-aside-menu i.fas {
    font-size: 1.25rem !important;
}


/***** LOGIN *****/
div.tester {
    
}
div.Float_Login_Button#Show_Left {
    margin-left: auto;
}
div.Float_Login_Button#Show_Right {
    z-index: 9999;
    padding-left: 10px !important;
}
div.v-hidden {
    visibility: var(--vHidden);
}
.Custom_Fade-In {
    opacity: 1;
    transition: opacity 5s !important;
    background-color: #EFF2F5 !important;
}
@media screen and (max-width: 767px) {
    .dNone {
        display: var(--dNone) !important;
    }
    .vHidden {
        visibility: var(--vHidden) !important;
    }
    #Margin_Top {
        margin-top: 10px;
    }
    #Right-Container {
        width: 100% !important;
    }
}
@media screen and (min-width: 768px) {
    .Float_Login_Button {
        display: var(--dNone);
    }
}
/***** CAROUSEL LOGIN *****/
.Carousel_Deactive {
    display: var(--dNone);
}
.Fade_In {
    animation: fadein 0.9s;
}
@keyframes fadein {
    from { 

        opacity: 0; 
    }
    to {
        opacity: 1; 
    }
}
.Left_Right {
    animation: Left_Right 1s;
}
@keyframes Left_Right {
    from {
        margin-left: 50%;
        opacity: 0; 
    }
    to {
        margin-left: 0;
        opacity: 1;
    }
}
.Right_left {
    animation: Right_left 1s;
}
@keyframes Right_left {
    from {
        margin-left: -50%;
        opacity: 0; 
    }
    to {
        margin-left: 0;
        opacity: 1;
    }
}
.Carousel_Login .module-item {
    justify-content: normal !important;
    padding: 10px;
    width: 80px;
    height: 115px;
    transition: transform 0.5s;
}
.Carousel_Login .module-item i {
    height: 30px !important;
}
.carousel-item.Active .module-item {
    cursor: pointer;
    transform: scale(1);
    margin-bottom: 0;
    margin-top: 0px;
    transition: margin-top 1s,  transform 1s;
}
.carousel-item .d-flex.flex-row.flex-center.flex-wrap {
    /* height: 120px; */
    /* height: auto !important; */
}
.Carousel_Login .module-name {
    font-size: 11.5px;
}
.login-illustration {
    margin: 45px 0;
}
.Active_Carousel_Button {
    color: #6D74DA;
    transform: scale(1.2) translateY(-10px) !important;
    /* height: 120px !important; */
    transition: margin-top 0.3s , transform 0.3s !important;
}
.Carousel_Login .Active_Carousel_Button .module-icon:before {
    color: #6D74DA;
}
.Carousel_Login li.ms-1.Dot::after {
    background: #cbcbcb;
}
.Carousel_Login li.ms-1.Indicator_Active::after {
    background: #6D74DA;
}
/* CSS for active module */

.module-item.Active_Carousel_Button svg {
    fill:#6D74DA;
    /* stroke: rgb(109, 116, 218); */
    /* stroke-width: 6; */
}
.Active_Carousel_Button .cls-1{
    fill:#6D74DA;
}



/***** TABLE LIST STYLE *****/
.Table_Customize .table .Caret {
    position: relative;
}
.Table_Customize .table .Caret::before {
    content: "▾";
    opacity: .3;
    position: absolute;
    display: flex !important;
    right: 0px !important;
    bottom: 5px;
}
.Table_Customize table th.Caret::after {
    content: "▴";
    opacity: .3;
    position: absolute;
    display: flex !important;
    right: 0px;
    top: 5px;
}
.Table_Customize table th.Caret.desc::before {
    opacity: 1 !important;
}
.Table_Customize table th.Caret.asc::after {
    opacity: 1 !important;
}
.Table_Customize td.Table_Hover {
    /* box-shadow: inset 0 0 0 9999px rgb(0 0 0 / 2%); */ 
    /* box-shadow: inset 0 0 0 9999px rgb(245 248 250); */
    background: #E4E6EF !important;
}


/***** HAMBURGER BUTTON HEADER *****/
.testing {
    display: flex !important;
    margin-top: -5px !important;
    transform: rotate(180deg);
    animation: 0.5s rotate;
}
@keyframes rotate {
	0% {
        transform: rotate(0deg);
	}

	100% {
		transform: rotate(180deg);
	}
} 

.test {
    transform: rotate(360deg);
    animation: 0.5s rotat;
    display: flex !important;
    margin-left: -1px !important;
}

@keyframes rotat {
    0% {
        transform: rotate(180deg);
	}

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


/***** INSIDE STEPPER BREADCRUMB *****/
/* #BreadCrumb li:first-child a {
    padding-left: 15px;
    -moz-border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px 0 0 4px;
}
#BreadCrumb li.active a {
    background: #4CB3D6;
}
#BreadCrumb li a {
    color: #FFF;
    display: block;
    background: #ebf5fb;
    text-decoration: none;
    position: relative;
    height: 40px;
    line-height: 40px;
    padding: 0 10px 0 5px;
    text-align: center;
    margin-right: 12px;
}
#BreadCrumb li:first-child a:before {
    border: none;
}
#BreadCrumb li a:before {
    left: -18px;
    border-left-color: transparent !important;
}
#BreadCrumb li a:before, 
#BreadCrumb li a:after {
    content: "";
    position: absolute;
    top: 0;
    border: 0 solid #ebf5fb;
    border-width: 20px 10px;
    width: 0;
    height: 0;
}
#BreadCrumb li a:after {
    left: 100%;
    border-color: transparent;
    border-left-color: #ebf5fb;
} */
/* #BreadCrumb li.active a:after {
    border-left-color: #4CB3D6;
}
#BreadCrumb li.actives a {
    background: #4CB3D6;
    color: white !important;
}
.breadcrumb#BreadCrumb li.actives a:after {
    border-left-color: #4CB3D6;
}
.breadcrumb#BreadCrumb li.actives a:before,
.breadcrumb#BreadCrumb li.actives a:after {
    border: 0 solid #4CB3D6;
} */


.Extended_Text_Dropdown {
    padding-left: 0 !important;
    margin-right: 33px !important;
    border: none !important;
    margin-left: -68px !important;
    z-index: 9999999 !important;
    opacity: 0.5 !important;
    align-items: center !important;
    display: flex !important;
}


.lSSlideOuter.vertical {
    position: relative;
}
.lSSlideOuter {
    overflow: hidden;
    user-select: none;
}
.lSSlideWrapper {
    max-width: 100%;
    overflow: hidden;
}
.lSSlideWrapper, .lSSlideWrapper .lSFade {
    position: relative;
}
.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {
    padding-left: 0;
    list-style: none;
}
.lSSlideWrapper .lSSlide {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
    -webkit-transition: all 1s;
    -webkit-transition-property: -webkit-transform,height;
    -moz-transition-property: -moz-transform,height;
    transition-property: transform,height;
}
.lSSlideWrapper .lSSlide, .lSSlideWrapper.usingCss .lSFade>* {
    -webkit-transition-timing-function: inherit!important;
    transition-timing-function: inherit!important;
    -webkit-transition-duration: inherit!important;
    transition-duration: inherit!important;
}
.lightSlider {
    overflow: hidden;
    margin: 0;
}
.lightSlider:after, .lightSlider:before {
    content: " ";
    display: table;
}
.lSSlideOuter.vertical .lightSlider>* {
    width: 100%!important;
    max-width: none!important;
}
.lightSlider.lsGrab>* {
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab;
}
.lSSlideOuter .lSGallery li, .lSSlideOuter .lightSlider>* {
    float: left;
}
.lSSlideOuter.vertical .lSGallery {
    position: absolute!important;
    right: 0;
    top: 0;
}
.lSSlideOuter .lSPager.lSGallery {
    list-style: none;
    padding-left: 0;
    margin: 0;
    overflow: hidden;
    transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    user-select: none;
}
.lSSlideOuter, .lSSlideOuter .lSPager.lSGallery {
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}
.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {
    padding-left: 0;
    list-style: none;
}

.tableArrow {
    transform: rotate(180deg) !important;
}


.dp__cell_inner.dp__pointer.dp__range_between {
    background: #f1faff !important;
    color: #009ef7 !important;
    font-weight: 400 !important;
    border: none !important;
}
.dp__calendar_row {
    margin: 0 !important;
}
.dp__flex_display {
    padding: 20px !important;
}
.dp__instance_calendar:nth-child(1) {
    padding-right: 10px !important;
}
.dp__instance_calendar:nth-child(2) {
    padding-left: 10px !important;
}
.dp__calendar_wrap {
    font-family: 'Poppins' !important;
}
.dp__calendar_header_separator {
    display: none !important;
}
.dp__selection_preview {
    font-size: 11.7px !important;
}
.dp__calendar .dp__calendar_item {
    color: #5E6278 !important;
}
.dp__action_row {
    width: 100% !important;
    padding: 20px 30px !important;
    border-top: 1px solid #eff2f5 !important;
}
.dp__range_end, .dp__range_start, .dp__active_date {
    background: #009ef7!important;
}
#dropdownMenuButton3 .dp__main.dp__theme_light.dp__flex_display,
#dropdownMenuButton3 .dp__flex_display,
#dropdownMenuButton4 .dp__main.dp__theme_light.dp__flex_display,
#dropdownMenuButton4 .dp__flex_display ,
#dropdownMenuButton3 .dp__main.dp__theme_light.dp__flex_display,
#dropdownMenuButton3 .dp__flex_display {
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: center !important;
}
#dropdownMenuButton3 .dp__menu.dp__relative.dp__theme_light,
#dropdownMenuButton4 .dp__menu.dp__relative.dp__theme_light,
#calendarDesign .dp__menu.dp__relative.dp__theme_light{
    border: none !important;
}

@media (min-width: 769px) and (max-width: 1024px) {
    .employeeInfo\&Pos {
        height: 80px;
    }
}
svg.vue-star-rating-star {
    width: 19px;
}


/* btn remove design */
.approve-btn {
    height: 25px;
    width: 25px;
    display: flex;
    justify-content: center;
    padding: 0 !important;
    margin: auto;
    align-items: center;
}


/* change aside color */
.default-bg {
    background: #4E4E4E !important
}
.red-bg {
    background: #971233 !important;
}
.violet-bg {
    background: #2b148b !important;
}
.black-bg {
    background: #000000 !important;
}
.green-bg {
    background: #226226 !important;
}

#company_dropdown {
    padding: 11px 5px !important;
    margin-top: 19px !important;
}
#company_dropdown span.menu-title {
    color: white !important;
}
.company_bg-default {
    background: #6e6e6e !important;
}
.company_bg-red {
    background: #bf3456 !important;
}
.company_bg-violet {
    background: #4932a7 !important;
}
.company_bg-black {
    background: #212121 !important;
}
.company_bg-green {
    background: #48A14D !important;
}
/* .preview-design {
    margin-top: -48px;
    background: white;
    margin-left: -20px;
} */
.lds-ring {
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    background: rgba(125, 125, 125, 0.1);
    align-items: center;
    justify-content: center;
}
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #55c588;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #55c588 transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}
@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
#dropdownMenuButton11::after {
    color: #4cb3d6 !important;
}
i.fal.fa-clone {
    color: #4cb3d6 !important;
    cursor: pointer;
}
i.fal.fa-clone:hover {
    transform: scale(1.2);
}
.duplicate {
    border: none !important;
    border-radius: 10px;
    /* width: 10px;
    height: 30px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-content: center; */
}
/* FOR SUB ASIDE DASHBOARD */
.SubAside_Preview_Closed {
    width: 0% !important;
    transition: width  0.4s !important;
}
.my-m-0 {
    margin-left: 100px !important;
    transition: margin-left 0.4s !important;
}
.my-m-275 {
    margin-left: 275px !important;
    transition: margin-left 0.4s !important;
}
.my-pt-35 {
    padding-top: 35px;
    transition: padding-top 0.4s !important;
}
.my-px-29 {
    padding: 0 29.250px;
    transition: padding 0.4s !important;
}
.my-text-center {
    text-align: center;
    font-size: 17px !important;
    transition: text-align 0.7s !important;
    transition: font-size 0.7s !important;
}
.SubAside_Preview_Open {
    width: 265px !important;
    transition: width 0.4s !important;
}
.my-d-none {
    display: none;
    transition: display 5s !important;
}
.Blob_Pulse {
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(98, 172, 181, 0.9);
    }
    60% {
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(98, 172, 181, 0);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(98, 172, 181, 0);
    }
}
.my-l-s-2 {
    left: 250px !important;
}
.my-l-s {
    animation: my-l-s 0.6s;
    left: -10px;
}
@keyframes my-l-s {
    0% {
        left: 265px;
	}

	100% {
		left: -10px;
	}
}

/* FOR PREVIEW EMPLOYEE RESIZE */
.my-w-300 {
    width: 300px;
    animation: my-w-300 0.6s;
}
@keyframes my-w-300 {
    0% {
        width: 0px;
	}

	100% {
		width: 300px;
	}
}
.my-w-0 {
    animation: my-w-0 0.6s;
    width: 0px;
}
@keyframes my-w-0 {
    0% {
        width: 275px;
	}

	100% {
		width: 0px;
	}
}
@media screen and (max-width: 991px) {
    .my-m-275-add, .my-m-275 {
        margin-left: 0;
    }
}


.multiselect {
    min-height: 0 !important;
}
span.multiselect__single,
span.multiselect__placeholder,
input.multiselect__input {
    margin-bottom: 0 !important;
    font-size: 0.925rem !important;
}
.multiselect__tags {
    min-height: calc(1.5em + 1.1rem + 2px) !important;
    padding: 0.55rem 0.75rem !important;
    font-size: 0.925rem !important;
    border-radius: 0.6rem !important;
    font-weight: 500;
    color: #212121 !important;
}
span.multiselect__placeholder {
    color: #b7bac8 !important;
    font-weight: 600 !important;
}

.my-h-290px {
    height :260px;
}

.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
table thead tr th {
    position: sticky !important;
    top: 0 !important;
}
.table-contaier.scroll-y {
    max-height: 535px !important;
}
.table-row-bordered tr th {
    z-index: 99 !important;
}
.my-width {
    max-width: 1600px !important
}
.my-right {
    right: 15% !important;
    transition: right  0.4s !important;
}
.my-right-2 {
    right: 15% !important;
    transition: right  0.4s !important;
    width: 400px !important;
    transform: translateX(72%) !important;
}

/* Custom Color*/
/* .BannerColor_Blue {
    background-color:#0C2D48 !important;

}
.BannerColor_Green {
    background-color:#364b3a !important;
}
.BannerColor_Red {
    background-color:#6d1515 !important;
} */

.my-border {
    border: 1px solid #e5e5e5;
}
.my-padding {
    padding: 0 10px !important;
    margin-left: -10px !important;
}
ul#companyDropdown.dropdown-menu.show {
    display: block;
    margin-top: -13px !important;
    padding-top: 13px !important;
}

/* NAVBAR COMPANY DROPDOWN */
.dropdown-item:hover, .dropdown-item:focus {
    color: black !important;
}

.modal-footer-css {
    width: 20%; 
    left: 78%; 
    justify-content: flex-end !important;
    position: absolute;
    display: flex
}
.tab-pane-card-height {
    max-height: 598px !important;
}
.tab-pane-table-height {
    max-height: 537px !important;
}


/* You can easily set a different style for each split of your days. */
.vuecal__cell-split.dad {background-color: rgba(221, 238, 255, 0.5);}
.vuecal__cell-split.mom {background-color: rgba(255, 232, 251, 0.5);}
.vuecal__cell-split.kid1 {background-color: rgba(221, 255, 239, 0.5);}
.vuecal__cell-split.kid2 {background-color: rgba(255, 250, 196, 0.5);}
.vuecal__cell-split.kid3 {background-color: rgba(255, 206, 178, 0.5);}
.vuecal__cell-split .split-label {color: rgba(0, 0, 0, 0.1);font-size: 26px;}

/* Different color for different event types. */
.vuecal__event.leisure {background-color: rgba(253, 156, 66, 0.9);border: 1px solid rgb(233, 136, 46);color: #fff;}
.vuecal__event.health {background-color: rgba(164, 230, 210, 0.9);border: 1px solid rgb(144, 210, 190);}
.vuecal__event.sport {background-color: rgba(255, 102, 102, 0.9);border: 1px solid rgb(235, 82, 82);color: #fff;}


span#menu-link-1 span.menu-title,
span#menu-link-1 span.menu-icon span.svg-icon {
    color: gray !important;
}


.card {
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.03) !important;
}


/* .content.d-flex.flex-row {
    z-index: 101 !important;
} */

.multiselect__option--highlight {
    background: transparent !important;
    color: black !important;
}
.multiselect__content-wrapper span {
    font-size: 13px !important;
}
.multiselect__option--selected.multiselect__option--highlight::after {
    background: #ff6a6a;
    color: #fff;
    font-family: "Font Awesome 5 Free" !important;
    content: "\f1f8" !important;
    padding: 0 20px !important;
}
.multiselect__option--highlight::after {
    background: #41b883;
    color: white;
    font-family: "Font Awesome 5 Free" !important;
    content: "\2b" !important;
    padding: 0 20px !important;
}
span.multiselect__tag {
    margin-bottom: 0 !important;
}
.multiselect__tags {
    height: 35px !important;
}
.current .stepper-icon {
    background: #4CB3D6 !important;
}
@media print {
    .oudrey {
        background-image: url('https://images.unsplash.com/photo-1579353977828-2a4eab540b9a?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c2FtcGxlfGVufDB8fDB8fHww&w=1000&q=80') !important; 
        height: 315px !important; 
        width: 200px !important; 
        background-size: cover !important; 
        background-repeat: no-repeat !important;
    }
}

a.menu-link.ps-8.py-3.text-primary .menu-title,
a.menu-link.px-0.py-3.ms-8.text-primary .menu-title,
a.menu-link.px-0.py-3.ms-8.text-primary .menu-icon .fas {
    color: #4CB3D6 !important;
}

.timeline-label {
    position: relative;
    margin-right: 10px;
}

.timeline-label:before {
    content: "";
    position: absolute;
    left: 51px;
    width: 3px;
    top: 0;
    bottom: 0;
    background-color: #EFF2F5;
    margin-left: 10px;
}

.accordion-notclick-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1.5rem 1.5rem;
    font-size: 1rem;
    color: #212121;
    text-align: left;
    background-color: #ffffff;
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
}

a.menu-link.ps-8.py-3.text-primary .menu-title,
a.menu-link.px-0.py-3.ms-8.text-primary .menu-title,
a.menu-link.px-0.py-3.ms-8.text-primary .menu-icon .fas {
    color: #4CB3D6 !important;
}

/* .dropdown-menu.bg-dark.show li:nth-child(5),*/
.dropdown-menu.bg-dark.show li:nth-child(3) {
    display: none !important;
}

.bg-orange {
    background: #F05924 !important;
}
.my-60vh {
    height: 60vh !important;
}
.my-maxHeight-60vh {
    max-height: 60vh !important;
}



@media only screen and (max-width: 425px) {
    #header_company {
        justify-content: center !important;
    }
}

@media only screen and (min-width: 320px) and (max-width: 575px) {
    div#global_card_pane_col {
        padding-bottom: 1.25rem !important;
    }
} 

@media only screen and (min-width: 320px) and (max-width: 349px) {
    #global_card_pane {
        height: 52vh !important;
    }
}
@media only screen and (min-width: 350px) and (max-width: 409px) {
    #global_card_pane {
        height: 55vh !important;
    }
}
@media only screen and (min-width: 410px) and (max-width: 571px) {
    #global_card_pane {
        height: 58vh !important;
    }
}
@media only screen and (min-width: 572px) and (max-width: 579px) {
    #global_card_pane {
        height: 61vh !important;
    }
}
@media only screen and (min-width: 580px) and (max-width: 767px) {
    #global_card_pane {
        height: 64vh !important;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #global_card_pane {
        height: 63vh !important;
    }
}
@media only screen and (min-width: 1113px) and (max-width: 1800px) {
    #global_card_pane {
        height: 63vh !important;
    }
}
@media only screen and (max-width: 500px) {
    span#clear_filter_non_mobile {
        display: none !important;
    }
}
@media only screen and (min-width: 501px) and (max-width: 1920px) {
    span#clear_filter_mobile {
        display: none !important;
    }
}
@media only screen and (max-width: 991px) {
    div#product_tags span {
        width: 32% !important;
    }
}
@media only screen and (max-width: 991px) {
    div#global_breadcrumbs {
        margin-top: 0 !important;
        top: 20px;
        position: relative;
    }
}
@media only screen and (max-width: 1200px) {
    #Remove_Width {
        margin: 0 !important;
    }
    #header_company {
        top: -10px !important;
        position: relative !important;
    }
}


/* ASIDE */
.menu .menu-item a .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: white !important;
}
.menu .menu-item span .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: #A5A5A5 !important;
}




.multiselect .multiselect__select::before {
    top: 65% !important;
}
ul#dropdownMenuButton1.w-200px .far {
    width: 15px !important;
    margin-right: 0.25rem !important;
}
ul#dropdownMenuButton1.w-200px .menu-content {
    font-weight: 600 !important;
    color: black !important;
    font-size: 13px !important;
    border-bottom: 1px solid #EFF2F5;
    padding: 10px !important;
}
ul#dropdownMenuButton1.w-200px {
    padding: 0 !important;
}
ul#dropdownMenuButton1.w-200px a.dropdown-item.bg-hover-light-primary.text-primary {
    color: #4CB3D6 !important;
}
ul#dropdownMenuButton1.w-200px a.dropdown-item.bg-hover-light-info.text-info {
    color: #7239EA !important
}
ul#dropdownMenuButton1.w-200px a.dropdown-item.bg-hover-light-danger.text-danger {
    color: #F1416C !important
}
ul#dropdownMenuButton1.w-200px a.dropdown-item.bg-hover-light-success.text-success {
    color: #50CD89 !important;
}



/*Custom reusable*/
.Disabled{
    pointer-events: none;
    opacity: 0.5; 
}



/* Force dropdown to be wider */
.multiselect-custom .multiselect__content-wrapper {
    white-space: nowrap;
}

.multiselect-custom .multiselect__single {
    white-space: nowrap;
    overflow: hidden;
    width: auto !important;
}
/* Show full text on hover */
.multiselect-custom .multiselect__single:hover {
    overflow: visible;
    white-space: pre-wrap;
    background: white; /* Ensure text is readable */
    z-index: 10; /* Make sure it appears above other elements */  
}

.multiselect-custom .multiselect__tags-wrap {
    width: auto !important;
}