﻿@import 'ag-grid.css';
@import 'ag-theme-alpine.css';



.cdk-overlay-container { 
     z-index: 100000 !important;
	
 } 

.iframeContainerLanding {
    position: absolute;
    top: 64px;
    /* overflow: hidden; */
    left: 75px;
    height: calc(100% - 64px) !important;
    /* border: 2px solid #000; */
    width: calc(100% - 75px) !important;
}

div#dashwrapper.large-screens::-webkit-scrollbar {
    width: 0px !important;
}

.iframeContainerLanding ::-webkit-scrollbar {
    width: 0px !important;
}

.iframeContainerLanding1 {

    display: block;
    padding-left: 75px;
    /* height: calc(113vh - 65px); 
    overflow-x: hidden;*/
    /* margin-bottom: 75px; */
    /* bottom: 120px; */
    position: absolute;
    /* height:100%; */
    max-width: 1366px;
    height: inherit !important;
}

.mat-form-field {

    font-family: 'OpenSans-Regular' !important;
}

iframe#commonFormRender {
    position: absolute;
    height: 100%;
    width: 100%;
}

#loginpanel {

    /* margin-bottom: -13px; */
    padding-bottom: -17px;
    overflow: auto;
}

@font-face {
    font-family: 'Montserrat-Black';
    src: url('fonts/Montserrat-Black.woff2') format('woff2'),
        url('fonts/Montserrat-Black.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url('fonts/materialfonts.woff2') format('woff2');
}

@font-face {
    font-family: 'Pompiere';
    src: url('fonts/Pompiere-Regular.woff2') format('woff2'),
        url('fonts/Pompiere-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url('fonts/Montserrat-Regular.woff2') format('woff2'),
        url('fonts/Montserrat-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url('fonts/Montserrat-Bold.woff2') format('woff2'),
        url('fonts/Montserrat-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Montserrat-Medium';
    src: url('fonts/Montserrat-Medium.woff2') format('woff2'),
        url('fonts/Montserrat-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSans-Bold';
    src: url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-ExtraBold';
    src: url('fonts/OpenSans-ExtraBold.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-BoldItalic';
    src: url('fonts/OpenSans-BoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-ExtraBoldItalic';
    src: url('fonts/OpenSans-ExtraBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-Italic';
    src: url('fonts/OpenSans-Italic.woff2') format('woff2'),
        url('fonts/OpenSans-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-Light';
    src: url('fonts/OpenSans-Light.woff2') format('woff2'),
        url('fonts/OpenSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-Regular';
    src: url('fonts/OpenSans-Regular.woff2') format('woff2'),
        url('fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-LightItalic';
    src: url('fonts/OpenSans-LightItalic.woff2') format('woff2'),
        url('fonts/OpenSans-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-SemiBoldItalic';
    src: url('fonts/OpenSans-SemiBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-MediumItalic';
    src: url('fonts/OpenSans-MediumItalic.woff2') format('woff2'),
        url('fonts/OpenSans-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-Medium';
    src: url('fonts/OpenSans-Medium.woff2') format('woff2'),
        url('fonts/OpenSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans-SemiBold';
    src: url('fonts/OpenSans-SemiBold.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}




/* COLOR */
:root {

    /*ZEUX Given*/
    /* --bs-primary: #2C6691!important;
  --bs-secondary:#C6CF58!important; */

    /*DEVMAX Given*/
    /*  --bs-primary: #4043a0!important;
  --bs-secondary:#52cabd !important;

    --bs-primary: #2C8C9B !important;
    --bs-secondary: #FF9F1C !important;
    --bs-light-primary: #74C2CE !important;  
    --bs-light-secondary: #FFBB5D !important;
    --bs-primary-light: rgba(36, 58, 115, 0.7) !important;
    --bs-secondary-rgb: rgb(105, 177, 136) !important;
    --bs-odd-row-color:#F2F7F7 !important;
    --bs-even-row-color:#F6FBFB !important;
    --bs-filter-widget-bg: #f7fcfd !important;
	--bs-table-primary-header: #ddedef !important; */
   
    --bs-primary: #2C6691;
    --bs-light-primary: #64A0CC  ;  
    --bs-secondary: #C6CF58  ;
    --bs-light-secondary: #DCE29A  ;
    --bs-primary-light: rgba(36, 58, 115, 0.7)  ;
    --bs-secondary-rgb: rgb(105, 177, 136)  ;
    --bs-even-row-color:#eff3f8 ;
    --bs-odd-row-color:#f6f9fc;
	--bs-filter-widget-bg: #FDFDFD ;
	--bs-table-primary-header: #D5D5DD ;	
	
    --bs-primary-light: rgba(36, 58, 115, 0.7) ;
    --bs-secondary-rgb: rgb(105, 177, 136);
    --bs-bodyTxt: #38385C !important;
    --bs-bodyTxt-light: #74748D !important;
    --bs-text-field-border: rgba(116, 116, 141, 0.30);
    --bs-light-blue: #CAE3F3;
    --bs-table-light-grey: var(--bs-odd-row-color);
    --bs-font: 'OpenSans-Regular', Arial !important;
    --bs-white: #FFFFFF !important;
    --bs-darkgrey: #74748D !important;
    --bs-bannerTitle: #fdfdfd !important;
	--bs-highlight-text: #0071c3 !important;
    --bs-widgetTitle: #38385C !important;
    --bs-Topsearch-Bg: var(--bs-even-row-color) !important;
    --bs-Widget-Duration: #74748D !important;
    --bs-wrapper-card-bg: #e7e7e7 !important;
    --bs-wrapper-card-shadow: #1d1d1d40;
    --bs-wrapper-card-border: #ffffff80 !important;
    --bs-black: #000 !important;
    --bs-light-grey: #afafaf !important;
    --bs-medium-grey: #494949 !important;
    --bs-light-grey: #afafaf !important;
    --bs-low-light-grey: #e9e9e9 !important;
    --bs-Topbar-border: #f3f3f3 !important;
    --bs-divider: #b5b5b5 !important;
    --bs-row-zero: #eeeeee !important;
    --bs-user-no-img-bg: #C5C5C5 !important;
    --bs-left-tab-bg: var(--bs-odd-row-color) !important;
    --bs-profile-bg: var(--bs-even-row-color) !important;
    --bs-primary-bg: var(--bs-even-row-color) !important;
    --bs-card-background: #FDFDFD !important;
    --bs-status-review: #F0B46D !important;
    --bs-status-sent-approval: #EAA9A9 !important;
    --bs-red-flag: #EAA9A9 !important;
    --bs-template2-progressbar: #F5753E !important;
    --bs-approver: #74748D !important;
    --bs-table-head: var(--bs-odd-row-color) !important;
    --bs-disable-stat: #B0B0B0 !important;
    --bs-error-red: #E86161;
    --bs-chipapproved: #AECD9B;
    --bs-chippending: #F0B46D;
    --bs-chiprejected: #EAA9A9;
    --bs-login-bg: #ffffffe6;
    --bs-topbar-shadow: #E7EEF3;
    --bs-dynamic-thead: var(--bs-odd-row-color);
    --bs-btnhover: #64A0CC !important;
    --bs-table-head-dark: var(--bs-even-row-color) !important;
    --bs-success-green: #509625 !important;
    --bs-Error-red: #E86161 !important;
    --bs-Light-green: #AECD9B !important;
    --bs-Error-pink: #EAA9A9 !important;
    --bs-black: #000000 !important;
    --bs-zoom: 0.93; 
    --bs-planning-colour1: #FDF0C2 !important;
    --bs-planning-colour2: #F0B46D !important;
    --bs-planning-colour3: #E8ECBC !important;
    --bs-planning-colour4: #F0B46D !important;
    --bs-planning-colour5: #E2CFC4 !important;
    --bs-planning-colour6: #ECCEFF !important;
    --bs-planning-colour7: #FBD1AB !important;
    --bs-planning-colour8: #C5DEDD !important;
    --bs-planning-colour9: #C1D3FE !important;
    --bs-planning-colour10: #FFE2E0 !important;
	

	
}


.bg-cover {
    background-size: cover !important;
}


/* TYPHOGRAPHY */
/* Display text login, page title */
h1 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 28px !important;
    /*   padding-bottom: 10px !important; */
    margin-top: 10px;
}

/*Form title, dashboard widget titles  */
h2 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
}

/* Overview tab labels-selected state */
h3 {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 24px !important;

}

h4 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 24px !important;
}

h5 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
}

h6 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 20px !important;
}

.h1 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 44px !important;
}

/*Form title, dashboard widget titles  */
.h2 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 24px !important;
}

/* Overview tab labels-selected state */
.h3 {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 24px !important;
}

.h4 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 24px !important;
}

.h5 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
}

.h6 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 20px !important;
}

.h7 {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 20px !important;
}

.h8 {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 16px !important;
}

.h9 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 18px !important;
}

.h10 {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px;
}

.h11 {
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 14px !important;

}

.h12 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 400 !important;
}

.h13 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    line-height: 20px;
}

.h14 {
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 12px !important;
    line-height: 12px;
}

.h15 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 12px !important;
    line-height: 12px;
}

.h16 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 10px !important;
    line-height: 10px !important;
}

.h17 {
    font-family: 'Montserrat-Regular' !important;
    font-size: 44px !important;
    font-weight: 400;
}

.h18 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 20px !important;
}

.h19 {
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 10px !important;
    line-height: 10px;
}

.h20 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 36px !important;
}

.h21 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.h22 {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 16px !important;
}

.h23 {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 16px !important;
}

.h24 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 36px !important;
}

.h25 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 500;
}

.h26 {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.h27 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.h28 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 16px !important;
}

.h29 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 16px !important;
    font-weight: 500;
}

.h30 {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 12px !important;
}

.h31 {

    font-family: 'OpenSans', Arial !important;
    font-size: 12px !important;
    line-height: 12px;
    font-weight: 600;
}

.h32 {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 28px !important;
    font-weight: 500;
}


.h36 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 36px;
    font-weight: 600;
    letter-spacing: 0.05em;
}

.h37 {
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 18px !important;

}

.TextLink {
    color: var(--bs-primary) !important;
}

.TextLink:hover {
    opacity: 0.5 !important;
}

.TextLink:disabled {
    color: var(--bs-disable-stat) !important;
}

.primary-text-color {
    color: var(--bs-primary) !important;
}


.bg-cover {
    background-size: cover !important;
}

body {
    background-color: #FFFFFF;
    margin: auto !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    color: var(--bs-bodyTxt) !important;
    text-align: left;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* height: auto !important; 
  overflow-x: hidden;
  overflow-y: auto;*/
    overflow-y: hidden;
    overflow-x: hidden;
    width: inherit;
    min-height: 768px;
    max-width: 1366px;
}

/*body [class^='mat-'], body [class*=' mat-'] {
    font-family: 'OpenSans-Regular' ;
} 
*/

body [class^='mat-']:not('fa'),
body [class*='mat-']:not('fa') {
    font-family: 'OpenSans-Regular' !important;
}

.mat-checkbox {
    font-family: 'OpenSans-Regular' !important;
}

.fa-solid,
.fas {
    font-family: "Font Awesome 6 Free" !important;
}

body .material-icons {
    font-family: 'Material Icons';
}

#commonFormRender html {
    background-color: var(--bs-white);
    height: 100%;

}

#wrapper {
    min-height: 100vh;
    padding-bottom: 150px;
    background: #fff;
}

.TextLink {
    color: var(--bs-primary) !important;
}

.TextLink:hover {
    opacity: 0.5 !important;
}

.TextLink:disabled {
    color: var(--bs-disable-stat) !important;
}

.primary-text-color {
    color: var(--bs-primary) !important;
}

ul.typo li {
    padding: 10px;
}

/* TYPHOGRAPHY END */
img.onbehalfEmpimg.role-image {
    width: 24px;
    height: 24px;
}

.welcome-text {
    margin-left: 20px;
}

.skip-welcome {
    padding-top: 16px;
    cursor: pointer;
    color: var(--bs-primary);
}

.welcome-right-logo {
    margin-top: 18px;
    width: 100%;
    padding-right: 18px;
}

.welcome-left-logo {
    position: absolute;
    padding-top: 32px;
    padding-left: 18px;
    z-index: 9999;
}

.welcome-left-logo img {
    /* height: 30px;
    width: 109px; */
    max-height: 150px;
    max-width: 150px;
}

.sidebar-toggle {
    z-index: 9909;
    position: absolute;
    font-size: 18px;
    margin-left: 50px;
    height: 30px;
    width: 30px;
    text-align: center;
    margin-top: 32px;
    color: var(--bs-white);
    padding: 3px;
    background: var(--bs-darkgrey);
}

body.sidebar-toggled footer.sticky-footer {
    width: 100% !important;
}

.header-logo {
    height: 50px;
    margin-left: 110px;
    cursor: pointer !important;
}

.bg-header {
    height: 236px;
    position: relative;
    max-width: 1300px;
    right: 20px;
    background-image: url(../images/banner.png);
    background-repeat: no-repeat;
    background-size: contain;
    margin: auto;
}

.bg-gradient-primary {

    background-image: none !important;
}

.bg-header h1 {
    color: var(--bs-bannerTitle);

    margin-left: 30px;
}


.header-cnt {
    width: 100%;
    margin-top: 50px;
    margin-left: 50px;
    color: var(--bs-card-background);
}

.header-right-img {
    margin: 0px 10px 2px -16px;
}

.nav-link.dropdown-toggle i {
    position: relative;
    top: 3px;
}

.sidebar.toggled {
    max-height: 616px !important;
}

.sidebar-dark .nav-item.active .nav-link i {
    margin-top: 6px;
    color: var(--bs-secondary);
}

.sidebar-dark .nav-item .nav-link i:hover {

    color: var(--bs-secondary);
}

.widget-title {
    font-weight: 700;
    color: var(--bs-widgetTitle);
    padding-top: 24px;
    padding-bottom: 15px;
    padding-left: 24px;
    /* float: left; */
}

.widget-actions {
    text-align: right;
}

.right-card-margin-top {
    margin-top: -20px;
    margin-left: 8px;
}

.widget-title .mfa {

    padding: 5px 0px 20px 27px;
}

.cnt-count {
    margin-right: -15px;
    color: var(--bs-bodyTxt-light);
    float: left;
    position: relative;
    padding-top: 31px;
    padding-left: 16px;
    display: none;
}

.widget-list-cnt {
    width: 100%;
    color: var(--bs-bodyTxt);
    min-height: 54px;
    padding-top: 16px;
    padding-bottom: 18px;
    text-wrap: nowrap;
}

.widget-list-text {
    margin-left: 24px;
    white-space: nowrap;
    max-width: 365px;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.row.data-zero {
    background: var(--bs-row-zero);
    vertical-align: middle;
}

.sidebar .nav-item .nav-link {

    padding: 1.6rem 1rem;
}

.wrapper .card {
    /* max-width: 100%!important; */
    margin: 0 auto;
}

.password-description {
    margin-bottom: 15px;
}

ul.pwd-desc li {
    padding-top: 8px;
}

ul.pwd-desc i {
    padding-right: 5px;
}

.pwd-hint {
    padding-bottom: 10px;
}

.card {
    border-radius: 1.35em;
	background: var(--bs-card-background);
}

.wrapper .card {

    max-width: 410px;
    margin: 0px;
    border-radius: 15px;
    background: var(--bs-login-bg);
    padding: 0.8rem;
    width: 410px;
    min-height: 557px;


}

.wrapper .card a {
    text-decoration: none;
    color: var(--bs-black);
}

.wrapper .card a:hover {
    color: var(--bs-black);
}

.wrapper .card .input-field {

    border-radius: 5px;
    color: var(--bs-black);
    padding: 0.3rem;
}

.wrapper .card .input-field input {
    background: var(--bs-white);
}

.wrapper .card .input-field input::placeholder {
    font-size: 12px;
    color: var(--bs-bodyTxt) !important;
    opacity: 0.56;
    /* Firefox */
}

.wrapper .card .input-field input.form-control,
.wrapper .card .input-field input.form-control:focus {
    border: none;
    outline: none;
    box-shadow: none;


}

.wrapper .card .input-field button.btn {

    padding: 0rem;
    padding-right: 0.5rem;
}

.wrapper .card .input-field button.btn:focus {
    border: none;
    outline: none;
    box-shadow: none;
}


.wrapper .card .option {
    display: block;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    user-select: none
}

.wrapper .card .option input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0
}

.welcome-bg {
    background: var(--bs-secondary) !important;
    height: 100%;
    position: absolute;
    right: 0px;
    max-width: 1366px;
    left: 0px;
}

.checkmark {
    position: absolute;
    top: 3px;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: var(--bs-white);
    border-radius: 2px
}

.submitBtn {
    background: var(--bs-disable-stat) !important;
    color: var(--bs-left-tab-bg) !important;
    margin-top: 19px !important;
    border-radius: 100px !important;

}

.cancelBtn {
    background: var(--bs-primary);
    margin-top: 19px;
    border-radius: 100px;
}

.disableBtn {
    background: var(--bs-primary);
    margin-top: 19px;
    border-radius: 100px;
}

.footer-buttons {
    margin-left: -150px;
    margin-top: 10px;
}

.footer-buttons aesbutton {
    margin-left: 19px;
}

.wrapper .card .option input:checked~.checkmark {
    border: none;
    background-color: var(--bs-darkgrey);
    transition: 300ms ease-in-out all
}

.checkmark:after {
    content: "\2713";
    position: absolute;
    display: none;
    color: var(--bs-white);
    font-size: 1rem
}

.wrapper .card .option input:checked~.checkmark:after {
    display: block
}

.wrapper .card .option .checkmark:after {
    left: 3px;
    top: -3px;
    width: 5px;
    height: 10px
}

.wrapper .card .btn.btn-primary {
    border-radius: 20px;
    width: 100px;
    background-color: var(--bs-white);
    color: var(--bs-bodyTxt);
    border: none;
}

.wrapper .card .btn.btn-primary:focus {
    border: none;
    box-shadow: none;
}


.wrapper .card .line span.connect {
    position: absolute;
    top: -12px;
    left: 33%;
    padding: 0 0.3rem;
    z-index: 100;
    border-radius: 2px;
    background-color: var(--bs-white);
}

.wrapper .card .connections a img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;

}

.main-widget.top {

    max-width: 704px;

    margin-top: -50px;

    margin-left: 32px;

    height: 375px;

    margin-bottom: 30px;
}

.main-widget.right {
    max-width: 496px;
    margin-top: 0px;
    margin-left: -9px;
    margin-bottom: 24px;
}

.main-widget.top-right {
    max-width: 496px;
    margin-top: -50px;
    margin-left: -9px;
    margin-bottom: 24px;
}

.main-widget.right {
    max-width: 496px;
    margin-top: 0px;
    margin-left: -9px;
    margin-bottom: 24px;
}

.main-widget-bottom {
    max-width: 704px;
    margin-bottom: 24px;
    margin-left: 32px;
    margin-top: 24px;
}


.topbar .navbar-search input {
    font-size: 14px;
    height: auto;
    background: #EFF3F8 !important;
    font-family: 'OpenSans-Regular' !important;
}


.widget-list-action {
    text-align: right;
    color: var(--bs-primary);

}

.counter-box-top {

    margin-left: 100px;
    position: relative;
    margin-top: -85px;
}

.counter-box-bottom {

    margin-left: 100px;
    position: relative;

}

.counter-number {
    padding-top: 24px;
    color: var(--bs-primary);
}



.counter-box {
    padding-top: 20px;
    border-radius: 15px;
    margin-top: 13px;
    margin-bottom: 10px;
    width: 278px;
    min-height: 145px;
    text-align: center;
    background: var(--bs-white);
}

.counter-box-top-widget {
    width: 97%;
    margin-left: 80px;
    margin-top: -97px;
    margin-bottom: 10px;
    z-index: 9999;

}

.counter-box-bottom-widget {
    width: 97%;
    margin-left: 80px;
    margin-top: -12px;
    margin-bottom: 10px;
    z-index: 9999;

}

.widget-list-action-approve {
    padding-left: 25px;
    text-align: right;
    padding-right: 32px;
    color: var(--bs-primary);

}

.right-padding32 {
    padding-right: 32px;
}

.left-padding32 {
    padding-left: 32px;
}

.right-padding14 {
    padding-right: 14px;
}

.left-padding14 {
    padding-left: 14px;
}

.action-divider {
    border-right: 1px solid var(--bs-divider);
}

.widget-list-action-approve a {
    color: var(--bs-primary);
    text-decoration: none;

}

.widget-list-action a {
    color: var(--bs-primary);
    text-decoration: none;
    cursor: pointer;
}

.widget-list-action-link {

    padding-left: 25px;
    text-align: right;
    padding-right: 20px;
    color: var(--bs-primary);

}

.widget-list-action-divder {
    border-right: 1px solid;
    border-color: var(--bs-divider);

}

.widget-list-action-link a {
    color: var(--bs-primary);
    text-decoration: none;
    cursor: pointer;
}

.widget-duration {
    margin-left: 5px;
    color: var(--bs-Widget-Duration);

}

.bg-secondary {
    background-color: var(--bs-secondary);
}

.bg-primary {
    background-color: var(--bs-primary);
}

.nav-link .img-profile {
    height: 32px !important;
    width: 32px !important;


}

.dropdown-item .img-profile {
    height: 25px !important;
    width: 25px !important;


}

.noftify-bullet {
    margin-left: -15px;
    margin-top: -4px;
    position: relative;
    font-size: 8px;
    color: var(--bs-secondary);
}

.bottom-arrow {
    z-index: 985;
    position: relative;
    width: 43px;
    height: 18px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    margin: 0 auto;
    background: var(--bs-white);
    padding: 0px;
    cursor: pointer;
}

/*.bottom-arrow:after {
    content: '';
    position: absolute;
    left: 2px;
    right: 0;
    margin: 0 auto;
    width: 3px;
    height: 2px;
    border-top: 12px solid var(--bs-primary);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-radius: 4px;
    border-bottom-right-radius: 13px; 
    border-bottom-left-radius: 14px; 
  } */
.bottom-arrow-expand {
    font-size: 28px;
    position: relative;
    top: -10px;
    left: 14px;
    color: var(--bs-primary);
    cursor: pointer;
}

.expand-right {

    position: relative;
    top: -20px;

}

i.fa-solid.fa-chevron-right.to-do-arrow {
    font-size: 10px;
    font-weight: bold;
}

.chip {
    display: inline-block;
    padding: 0px 13px;
    height: 36px;
    margin-left: 4px;
    margin-bottom: 10px;
    line-height: 33px;
    border-radius: 100px;
    border: 1px solid var(--bs-primary);
    color: var(--bs-primary);
}

.chip-user {
    display: inline-block;
    padding: 16px 15px 0px 18px;
    height: 42px;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 38px;
    color: var(--bs-bodyTxt);
}

.user-name {
    padding-right: 5px;
    color: var(--bs-bodyTxt);
    font-weight: 600;
}

.user-designation {
    color: var(--bs-bodyTxt-light);
}

.seperator {
    color: var(--bs-bodyTxt-light);
}

.mfa-chip {
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 25px;
    padding-right: 25px;
    cursor: pointer;
    margin-left: 17px;
    margin-right: 5px;
    margin-bottom: 20px;
    border-radius: 100px;
    border: 2px solid var(--bs-primary);
    color: var(--bs-primary);
    float: left;
}


.mfa-chip.empty1 {
    min-width: 150px;
    min-height: 52px;
    border: 2px solid var(--bs-low-light-grey);
}

.mfa-chip.empty2 {
    min-width: 160px;
    min-height: 52px;
    border: 2px solid var(--bs-low-light-grey);
}

.mfa-chip.empty3 {
    min-width: 190px;
    min-height: 52px;
    border: 2px solid var(--bs-low-light-grey);
}

.tnk-chip-s {
    display: inline-block;
    padding: 5px 10px 5px 10px;
    /* cursor: pointer; */
    border-radius: 100px;
    border: 1px solid var(--bs-secondary);
    background: var(--bs-secondary);
    color: var(--bs-white);
    line-height: 15px;
}

.tnk-chip-p {
    display: inline-block;
    padding: 4px 12px 4px 12px;
    /*cursor: pointer; */
    border-radius: 100px;
    border: 1px solid var(--bs-primary);
    background: var(--bs-primary);
    color: var(--bs-white);
    line-height: 15px;
}

.mfa-chip:hover {
    background: var(--bs-secondary);
    color: var(--bs-white);
    border-color: var(--bs-secondary);
    text-decoration: none;
}

.mfa-chip-user {
    display: inline-block;
    padding: 20px 23px 34px 20px;
    height: 42px;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 45px;
    line-height: 38px;
    color: var(--bs-bodyTxt);
}


.empty-text {

    color: var(--bs-medium-grey);
    font-weight: 100 !important;
    padding-bottom: 15px;
    margin-left: 30px;
}

.empty-text-chat {

    color: var(--bs-medium-grey);
    font-weight: 100 !important;
    margin-top: 56px;
    margin-left: 30px;
}

.empty-user-img {
    margin-left: 15px;
    margin-right: 15px;
    /* padding: 59px; */
    width: 72px;
    height: 72px;
    background: var(--bs-low-light-grey);
}

.things-title {
    color: var(--bs-primary);

}

.profile .table-properties th {
    font-weight: normal;
    width: 15rem;
}

.profile .table-properties td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile .table-properties tr:first-child td,
.profile .table-properties tr:first-child th {
    border-top: none !important;
}

.profile .img-lg {
    width: 72px;
    height: 72px;
    border: 4px solid var(--bs-light-grey) !important;

}

.profile .img-lg.active {

    border: 4px solid var(--bs-secondary) !important;

}

.SpinnerContainer {
    margin-top: -9px;
    padding-left: 6px;
    float: right;
}



.progresstxt {
    padding-left: 50px;
    /* top: -3px; */
    top: 16px;
    left: 14px;
    float: left;
    position: relative;
}

.halfwidth-SpinnerContainer {
    margin-top: -31px;
    margin-left: -89px;
}

.mat-progress-spinner circle {
    stroke: var(--bs-secondary) !important;
}

.repo {
    color: var(--bs-primary);
    cursor: pointer;
    position: relative;
    top: 8px;
}

.repo i {
    top: 4px;
    position: relative;
    font-size: 26px;
    margin-top: 0px;
    margin-left: -20px;
    margin-right: 11px;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 75% !important;
        margin: 0px !important;

    }
}

.data-popup mat-dialog-container {
    border-radius: 0px !important;
    height: calc(100vh - 0px);
    width: 100%;
    margin-top: 0px;
    max-width: 100% !important;
    margin-left: 0px;
}

.data-popup {
    max-width: 100% !important;
    width: 100% !important;
}

.mat-tab-body-content {
    height: 100%;
    overflow: auto;
    padding-top: 16px !important;
    padding-left: 0px !important;
}

.data-popup-title {
    margin-left: 2px;
    margin-top: 0px;
    margin-bottom: 25px;
}

.popup-page-footer {
    min-height: 86px;
    background: var(--bs-card-background);
    box-shadow: 0px -4px 4px rgb(219 219 238 / 40%);
    position: relative;
}

.divDialogCloseInner {
    float: right;
    position: relative;
    top: -10px;
    left: 10px;
}

.divDialogCloseOuter mat-icon {
    height: 72px;
    width: 56px;
    padding-top: 20px;
    padding-left: 16px;
    font-size: 31px;
    border-radius: 0px 8px 8px 0px;
    cursor: pointer;
    background: var(--bs-card-background) !important;
    margin-left: -6px;
}

.divDialogClose mat-icon {
    height: 72px;
    width: 56px;
    padding-top: 20px;
    padding-left: 16px;
    font-size: 31px;
    border-radius: 0px 8px 8px 0px;
    cursor: pointer;
    background: var(--bs-card-background) !important;
}

/*.matAesDialogCornerClose.divDialogClose mat-icon {
    font-size: 24px;
    position: relative;
    top: -29px;
    left: 24px;
} */
/* .divDialogClose {
  margin-top: -134px;
} */
/*
.matAesDialogCornerClose {
    position: absolute!important;
    top: -35px!important;
    left: 32px!important;
}
.matAesDialogCornerClose mat-icon {
    font-size: 27px;
}
*/
.divDialogClose {
    position: relative;
    top: 0px;
    left: -5px;
}

.row-full {
    width: 100%;
    padding: 0px;
    position: relative;
    /* margin-left: -43vw; */
    height: 100px;
    /* margin-top: -12px; */
    /* left: 50%; */
}

.data-popup-close {
    margin-top: -33px;
    padding-top: 12px;
    border-radius: 0px 8px 8px 0px;
    background: var(--bs-card-background);
    float: right;
    text-align: right;
    width: 56px;
    color: var(--bs-bodyTxt) !important;
    height: 64px;

}

.data-popup-footer {
    padding-top: 0px;
    margin-left: -35px;
}

.popup-grid-container {
    max-height: 277px;
    overflow-y: scroll;
}

/* .onbehalf-grid-container{
  max-height: 385px;
  overflow-y:scroll;
} */
.data-popup .modal-header {
    border-bottom: 1px solid #fff;
}

.data-popup .modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem -1rem -1rem 990px;
    background: var(--bs-white);
    z-index: 9999;
    border-radius: 0px 8px 8px 0px;
}

.data-popup .modal-footer {
    box-shadow: 0px -4px 4px rgba(219, 219, 238, 0.4);
}

.popup-grid-head {
    background: var(--bs-odd-row-color);
    height: 56px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    padding-top: 18px;
    border-radius: 8px 8px 0px 0px;
}

.popup-grid-zero {
    background: var(--bs-even-row-color);
    min-height: 52px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    /* margin-left: -5px; */
    padding-left: 24px;
    padding-top: 15px;
}

.popup-grid-one {
    background: var(--bs-odd-row-color);
    min-height: 52px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    padding-left: 24px;
    padding-top: 15px;
}

.role-dropdown {
    margin-left: -25px;
    width: 100%;
    height: 24px;
    margin-top: 6px;
}

.template2-progress.overview {
    width: 48px;
    height: 48px !important;
    float: right;
    line-height: 50px;
    background: none;
    /* margin: 10px; */
    box-shadow: none;
    position: relative;
    margin-top: -16px;
    margin-right: 110px;
}

.mfa-chip-user h6 {
    font-size: 13px;
    padding: 10px;
    color: var(--bs-light-grey);
    max-width: 100px;
    min-width: 100px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.mfa-chip-user.active h6 {
    color: var(--bs-secondary);
}

.dropdown-menu.dropdown-menu-right.p-3.shadow.animated--grow-in.show {
    width: 436px;
    height: 46px;
    background: transparent;
    box-shadow: none !important;
    border: none;
}

.form-inline .input-group,
.form-inline .custom-select {
    width: 389px;
    margin-top: -103px;
}

.srch-mobile-btn {
    height: 37px;
}

.sidebar.toggled .nav-item .nav-link {
    padding: 26px 0.6rem !important;
}


/* @media only screen and (max-width: 1960px) {
  .widget-list-cnt {
    width: 86%;
  }
} */
/* For MacAirbook */

/* For Android Mobile Devices  devices */
@media only screen and (max-device-width: 1366px) {

    .wrapper-changepwd {
        margin-top: 58px;
        margin: auto;
        width: 30%;
    }

    .welcome-widget .BtnLogin {
        margin-top: 0px;
    }

    .welcome-widget {
        width: 400px !important;
    }

    .chat-frame {
        background: var(--bs-secondary);
        float: right;
        z-index: 999;
        height: 520px !important;
        top: 5px !important;
        position: fixed;
        left: 60% !important;
        bottom: 0;
        width: auto;
        text-align: r;
        box-shadow: 1px 11px 19px 9px #cccc;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    .chat {
        width: 440px;
        float: left;
        background: var(--bs-white);
        border-radius: 15px 15px 0px 0px;
        color: #434651;
    }

    .chat .chat-history {
        height: 338px !important;
    }

}

@media only screen and (min-device-width: 1366px) and (max-device-width: 1960px) {
    /* 
  .main-widget.top-right {
    margin-top: -85px !important;
   
} */

    .header-cnt {
        margin-top: 50px;
    }

    .carousel-item img {
        width: 100% !important;
    }

    .large-screens {

        background: #fff;

        /* max-width: 1366px !important; */

        margin: auto;

        /* min-height: 800px;
    max-height: 1200px; */

        /* overflow-x: hidden;  
    overflow-y: auto;
    height: 125vh; */
    }

    .large-screens::-webkit-scrollbar {
        width: 10px !important;
    }

}

@media only screen and (max-width: 1366px) {
    .attpopup {
        top: 112px !important;
    }

    .wrapper {

        margin-top: 50px !important;


    }
}

@media only screen and (max-width: 400px) {
    .card-body {

        padding: 0.25rem;
    }
}

/* IPAD MINI 

  @media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)  {
  .main-widget.top-right {
    max-width: 100% !important;
  }
  .main-widget.right {
    max-width: 100% !important;
  }
    .welcome-widget {
      width: 370px !important;
      margin-left: 194px !important;
      margin-top: 220px !important;
      padding: 10px !important;

  }

  .welcome-subtxt {
    text-align: left !important;
}
  }
*/
/* IPAD AIR */

@media only screen and (min-device-width : 820px) and (max-device-width : 1180px) {
    .main-widget.top-right {
        max-width: 100% !important;
    }

    .main-widget.right {
        max-width: 100% !important;
    }

    .welcome-widget {
        width: 370px !important;
        margin-left: 209px !important;
        margin-top: 315px !important;
        padding: 10px !important;

    }

    .welcome-banner {
        display: none !important;
    }

    .welcome-subtxt {
        text-align: left !important;
    }
}


.top-right-links {
    margin-right: -1px !important;
}

/* For Apple Mobile Devices  devices */




@media only screen and (max-width: 768px) {




    .mfa-chip-user {
        padding: 25px !important;
    }

    .top-right-links {
        margin-right: -1px !important;
    }

    #content-wrapper {

        min-width: 100% !important;
        padding-right: 0px !important;
    }

    .sheet-calendar {
        margin-left: -15px !important;
    }

    .footer-btn-right-disable {
        padding-top: 19px !important;
        margin-left: -4px !important;
        text-align: center !important;
        padding-left: 0px !important;
    }

    body {

        overflow-x: hidden !;
        background: #ffffff;
    }

    .form-main-title {
        margin-bottom: 24px !important;
        margin-top: 20px !important;
    }

    .iframeContainerClass {

        padding-left: 0px !important;
    }

    .role-dropdown-forms {
        margin-left: 0px !important;
    }

    .footer-btn-left {

        padding-left: 0px !important;
    }

    .BtnNext-forgetpwd .mat-button {
        max-width: 224px !important;
    }

    .form-check-label {
        font-size: 11px !important;
    }

    .forget-pwd {
        font-size: 11px !important;
        margin-left: 38px !important;
    }

    .BtnLogin .mat-button {
        min-width: 244px !important;
    }

    .progress-level {
        margin-left: 255px !important;
    }

    .user-img-box {
        max-width: 100% !important;
    }

    .left-tab-bg {

        max-width: 100% !important;

    }

    .inner-content-right {

        margin-left: 0px !important;
    }

    .navbar .floatbar-toggle {
        display: block !important;
    }

    .main-content-section {
        margin-left: 0px !important;
    }

    .template2-progress.template.weight {
        margin-top: -32px !important;
        margin-right: 28px !important;
    }

    .footer-btn-right {
        padding-top: 0px !important;
        padding-left: 0px !important;
        text-align: center !important;
        margin-left: -6px !important;
    }

    .template2-progresstxt {
        padding-right: 87px !important;
    }

    .footer-btn-left {
        padding-top: 19px;
        padding-left: 19px !important;
        margin: auto;
        text-align: center !important;
    }

    .template2-progress {
        width: 240px !important;
        height: 10px !important;
        text-align: center !important;
        margin: auto !important;
    }

    .tab-content {
        min-width: auto !important;
        margin-left: 0px !important;
    }

    .wrapper {
        margin-left: 32px !important;
        margin-top: 75px !important;
        margin-bottom: 84px !important;
    }

    .carousel-item img {
        max-height: 100%;
        width: fit-content !important;
    }

    .login-form {
        border-radius: 10px !important;
        margin-left: 3% !important;
        width: 325px !important;
        margin-top: 24% !important;
    }

    .form-inline .input-group,
    .form-inline .custom-select {
        width: 328px;
        margin-top: -95px;
        margin-left: 43px;

    }

    .widget-list-text {
        margin-left: 26px;
        margin-right: 20px;
    }

    .widget-actions {
        text-align: left;
    }

    .card-counter {

        width: 320px !important;
    }

    .counter-box-top {
        margin-left: 15px;
    }

    .counter-box-bottom {
        margin-left: 15px;
    }

    .widget-list-cnt {
        line-height: 21px;
        text-align: left;
        padding-top: 14px;
        padding-bottom: 10px;
    }

    .widget-list-action {
        padding-left: 25px;
        text-align: right;
        padding-right: 30px;
        padding-bottom: -14px;

    }

    .floatbar.hidden {
        display: none;
    }

    .main-widget.top {

        margin-left: 8px !important;
    }

    .bg-header h1 {

        margin-left: 0px;
        text-align: center;
    }

    .bg-header p {
        margin-left: 0px;
        text-align: center;
    }

    .main-widget {

        margin-left: 8px !important;
    }

    .table {
        width: 94%;
    }

    .togglesearch {
        left: 63px !important;
        top: 85px !important;
    }

    .main-widget.top-right {

        margin-top: 0px !important;
    }

    .topbar .navbar-search {

        margin-top: 56px !important;
    }
}

@media only screen and (max-width: 414px) {
    .welcome-widget {
        text-align: center !important;
        margin-left: 3px !important;
        margin-top: 179px !important;
    }

    .welcome-content {
        padding: 9px 26px 12px 10px;
    }

    body {

        overflow-x: hidden;
    }

    .wrapper {
        margin-top: 120px !important;
        margin-left: 38px !important;
    }

    .languages-menu {
        margin-left: 19px !important;
        margin-top: 64px;
    }
}

@media only screen and (max-width: 375px) {
    .welcome-content {
        padding: 0px 30px 0px 0px;
    }

    body {

        overflow-x: hidden;
    }

    .wrapper {
        margin-left: 22px !important;
    }
}

/* Google Pixel 5 */
@media only screen and (max-width: 393px) {

    .welcome-widget {
        text-align: center !important;
        margin-left: -6px !important;
        margin-top: 150px !important;
    }

    .languages-menu {
        margin-left: 25px !important;
    }

    .welcome-content {
        padding: 9px 26px 12px 10px;
    }

    body {

        overflow-x: hidden;
    }

    .wrapper {
        margin-left: 46px !important;
    }
}

@media only screen and (max-width: 375px) {
    .welcome-widget {
        text-align: center !important;
        margin-left: -9px !important;
        margin-top: 74px !important;
    }
}

@media only screen and (max-width: 390px) {
    .welcome-widget {
        text-align: center !important;
        margin-left: -6px !important;
        margin-top: 116px !important;
    }

    body {

        overflow-x: hidden;
    }

    .wrapper {
        margin-top: 120px !important;
        margin-left: 38px !important
    }
}

@media only screen and (max-width: 375px) {
    body {

        overflow-x: hidden;
    }

    .wrapper {
        margin-top: 40px !important;
        margin-left: 38px !important
    }
}


@media only screen and (max-width: 768px) {
    .welcome-subtxt {
        width: 100% !important;
        text-align: center !important;
    }

    /* .welcome-widget {
      text-align: center !important;
      margin-left: -13px !important;
      margin-top: 111px !important;
  } */
    .login-right-logo {
        display: none;
    }


    .lang-icon {
        margin-top: 24px;
        padding-left: 20px;
    }

    .languages-menu {
        margin-left: 66px !important;
        margin-top: -9px;
    }

    .counter-box-top-widget {
        width: 97%;
        margin-left: 10px;
    }

    .counter-box-bottom-widget {
        width: 97%;
        margin-left: 10px;
        margin-top: -12px;
    }

    .counter-box {
        width: 97%;
    }

    .searchbar {
        display: block !important;
        margin-top: 27px;
        position: absolute;
        margin-left: -40px;
    }

    .topbar .nav-item .nav-link {
        padding: 0px !important;
    }

    .topbar .navbar-search input {
        font-size: 14px;
        height: auto;
        width: 300px !important;
        margin-left: -70px;
        margin-top: 20px;

    }

    li.searchbar i {
        margin: 11px !important;
    }

    .topbar .navbar-search {
        width: 400px;
        /* left: -79px!important; */
        margin-left: -123px;
        margin-top: 24px !important;
    }

    .sidebar.toggled .nav-item .nav-link {
        text-align: center;
        padding: 40px 1rem;
        width: 3.5rem;
    }

    .main-widget.top {
        margin-top: -70px !important;
    }

    .sidebar .nav-item .nav-link {

        padding: 1.6rem 1rem;
    }


}

/* SAMSUNG Mobiles */

/* Iphone Mobiles */
@media only screen and (min-width: 320px) and (max-width: 568px) {

    .counter-box {
        width: 97% !important;
    }

    .wrapper .card {
        width: 300px !important;
    }

    .card-counter {
        width: 230px !important;
        margin-left: 10px !important;
    }
}

/* large screens */
@media only screen and (min-device-width: 1445px) and (max-device-width: 1960px) {



    /* .mfa-chip {
    display: inline-block;
    padding: 12px 10px 12px 10px;
  } */


    .main-widget.top {
        margin-top: -85px;
        margin-bottom: 24px;
        padding-left: 24px;
    }

    .main-widget.top-right {

        margin-top: -85px !important;
    }

    .main-widget.widget-bottom {

        margin-left: 70px;
    }

    .large-screens {
        background: var(--bs-white);
        /* max-width: 1366px !important; */
        margin: 0 auto;


    }

    /* Track */

    .large-screens-login {

        max-width: 1366px !important;
        margin: 0 auto;

    }

}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;

}

#dashwrapper::-webkit-scrollbar {
    width: 0px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--bs-primary);
    border-radius: 30px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary);
}

@media only screen and (max-width:360px) {
    .mfa-chip-user {
        padding: 20px !important;
    }

    .languages-menu {
        margin-left: 15px !important;
        margin-top: 37px;
    }

    .wrapper {
        margin-top: 90px !important;
        margin-left: 32px !important;
    }

}

.togglesearch {
    left: 85px !important;
}

.card-counter {

    width: 290px !important;
}

.counter-box {
    width: 97% !important;
}

.counter-box-top {
    margin-left: 15px;
}

.counter-box-bottom {
    margin-left: 15px;
}


@media only screen and (min-width: 960px) {
    .togglesearch {
        display: block !important;
    }
}


/* ONEPLUS NORD 2 

 @media only screen and (min-width: 412px) and (max-width: 915px) {

  .counter-box {
    width: 93% !important;
    margin-left: 12px;
}
.wrapper {
margin-top: 160px !important;
margin-left: 60px !important;
  }
}
/* IPAD DEVICES */
/* IPAD PRO11 */

@media only screen and (min-device-width: 834px) and (max-device-width: 1194px) and (orientation: landscape) {
    body {
        overflow-y: auto !important;

    }

    .login-bg {
        max-width: 100% !important;
    }

    .col.login-bg+.col {
        display: none !important;
    }

    .col-5.login-bg {
        width: 100% !important;
        flex: 100% !important;
        max-width: 100% !important;
    }

    #loginpanel .col-7 {
        display: none !important;
    }

    .avatar:not(:first-child) {
        /* margin-left: -31px; */
        -webkit-mask: unset !important;
        mask: unset !important;
    }

    .list-group-horizontal {
        float: left !important;
        text-align: left;
    }


    .tab-content {
        min-width: 695px !important;
    }

    span.avatars {

        -webkit-mask: unset !important;
        mask: unset !important;
    }

    .avatar:not(:last-child) {
        /* margin-left: -31px; */
        position: relative;
        left: 10px;
    }

    span.avatars {

        background: var(--bs-white);
    }

    .dynamic-buttons .float-right {
        float: left !important;
    }

    body {
        background: transparent !important;
        zoom: 1;
    }

    .large-screens {
        background: transparent !important;
    }

    .wrapper {
        margin-top: 5% !important;
        margin-left: 33% !important;

    }

    .top-content {
        height: 100%;
        background: var(--bs-secondary);
        padding: 0px;
    }

    .carousel-inner {
        display: none !important;
    }

    .ml-auto,
    .mx-auto {
        margin-right: 150px !important;
    }

    .topbar .dropdown .dropdown-menu {

        right: 11.75rem !important;
    }

    #notify {
        display: none;
        position: absolute;
        left: 40% !important;
    }

    .lang-menu {
        margin-left: -65px !important;

    }

    .lang-icon {
        margin-top: -22px !important;
        margin-left: 30px;
        padding-right: 5px;
        font-size: 16px;
    }

    .BtnLogin .mat-button {
        min-width: 100% !important;
    }

    .forget-pwd {
        margin-left: 110px !important;
    }

    .languages-menu {
        margin-left: 415px !important;
        position: absolute !important;
        z-index: 1000;
        margin-top: 0px;
    }

    .lang-icon i {
        position: relative;
        top: 45px;
        right: 52px;
    }

    /* Dashboard */
    .main-widget.top {
        max-width: 615px;
        margin-top: -35px;
        margin-left: 32px;
        height: 375px;
        margin-bottom: 30px;
    }

    .main-widget.top-right {
        max-width: 80% !important;
        margin-left: -104px !important;
        margin-top: -35px !important;
    }

    .widget-list-text {
        margin-left: 32px;
        white-space: nowrap;
        max-width: 430px !important;
        display: inline-block;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .main-widget-bottom {
        max-width: 618px !important;
        margin-bottom: 24px;
        margin-left: 32px;
        margin-top: 24px;
    }

    .main-widget.right {
        max-width: 80% !important;
        margin-left: -100px !important;
    }

    .card-bodyChat {
        flex: 1 1 auto;
        margin-bottom: 40px;
        margin-left: 13px;
        height: 240px;
        overflow: hidden;
    }

    .play-btn {

        position: relative;
        top: -15px;
        left: -30px;
    }

    .iframeContainerClass {
        height: auto;
    }

    .bg-header {
        height: 236px;
        background-repeat: no-repeat !important;
        background-size: 95% 98% !important;
    }

    /*PMS */
    .progresstxt {
        padding-left: 0px !important;
        top: 16px !important;
        /* left: -42px !important; */
        position: relative;
    }


    .half-width .template2-progresstxt {
        left: 39px !important;
        position: relative;
        margin-top: 14px !important;
    }

    .repo {
        position: absolute !important;
        left: 176px;
    }

    .ChipPending {

        max-width: 260px !important;
    }

    .col-md-3 {

        -ms-flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .left-tab-bg {

        width: 303px !important;
        max-width: 100% !important;
    }

    .tab-content {

        margin-left: 0px !important;
    }

    .col-md-4 {

        width: 40%;
        max-width: 100% !important;
    }
}

/*IPAD MINI  
@media only screen and (max-device-height: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

 
  .wrapper{
    margin-left: 305px !important;
    margin-top: 100px !important;
  }
  .top-content{
      height: 100%;
    background: var(--bs-secondary);
  }

  .carousel-inner{
	  display:none;
  }
  .ml-auto, .mx-auto {
    margin-left: 50px!important;
}
.topbar .dropdown .dropdown-menu {
   
    right: 22.75rem !important;
}

#notify {
    display: none;
    position: absolute;
    left: 26% !important;
}
  .lang-menu {
    margin-left: -9px !important;
    margin-top: -1px !important;
}
  
  .BtnLogin .mat-button {
    min-width: 100%!important;
}
.forget-pwd {
       margin-left: 150px !important;
}
.languages-menu {
    margin-left: 355px !important;
    position: absolute!important;
    z-index: 1000;
    margin-top: 0px;
}
.lang-icon i {
    position: relative;
    top: 50px;
    right: 52px;
}


.main-widget.top {
    max-width: 615px;
    margin-top: -35px;
    margin-left: 32px;
    height: 375px;
    margin-bottom: 30px;
}
.main-widget.top-right {
    max-width: 100% !important;
    margin-left: -104px  !important;
    margin-top: -35px !important;
}
.widget-list-text {
    margin-left: 32px;
    white-space: nowrap;
    max-width: 430px !important;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.main-widget-bottom {
    max-width: 618px !important;
    margin-bottom: 24px;
    margin-left: 32px;
    margin-top: 24px;
}
.main-widget.right {
    max-width: 47% !important;
    margin-left: -100px  !important;
}
.card-bodyChat {
    flex: 1 1 auto;
    margin-bottom: 40px;
    margin-left: 5px;
    height: 310px;
    overflow: hidden;
}
.play-btn {
   
    position: relative;
    top: -15px;
    left: -30px;
}
.iframeContainerClass {
      height: auto;
}

.bg-header {
    height: 236px;
    background-repeat: no-repeat !important;
    background-size: 80% 98% !important;
}


.progresstxt {
  padding-left: 0px !important;
    top: 16px !important;
    lef: ;

    loat: left;
    position: relative;
}


.half-width .template2-progresstxt {
    left: 39px !important;
    position: relative;
    margin-top: 14px !important;
}

.repo {   
    position: absolute !important;
    left: 176px;    
}
.ChipPending {
 
    max-width: 260px !important;
}
.col-md-3 {
    max-width: 100%!important;
}

.left-tab-bg {

    width: 303px !important;
    max-width:100% !important;
}
.tab-content {
   
  margin-left:0px !important;
}
.col-md-4 {

    width: 40%;
    max-width: 100% !important;
}
}
*/

@media only screen and (min-width: 820px) and (max-height: 1180px) and (max-width:1180px) {

    /* LOGIN */
    body {
        background: transparent !important;
    }

    .large-screens {
        background: transparent !important;
    }

    .wrapper {
        margin-left: 100% !important;
        margin-top: 100px !important;
    }

    .top-content {
        height: 100%;
        background: var(--bs-secondary);
        padding: 0px;
    }

    .carousel-inner {
        display: none !important;
    }

    .ml-auto,
    .mx-auto {
        margin-right: 150px !important;
    }

    .topbar .dropdown .dropdown-menu {

        right: 11.75rem !important;
    }

    #notify {
        display: none;
        position: absolute;
        left: 40% !important;
    }

    .lang-menu {
        margin-left: -9px !important;
        margin-top: -5px !important;
    }

    .BtnLogin .mat-button {
        min-width: 100% !important;
    }

    .forget-pwd {
        margin-left: 110px !important;
    }

    .languages-menu {
        margin-left: 415px !important;
        position: absolute !important;
        z-index: 1000;
        margin-top: 0px;
    }

    .lang-icon i {
        position: relative;
        top: 45px;
        right: 52px;
    }

    /* Dashboard */
    .main-widget.top {
        max-width: 615px;
        margin-top: -35px;
        margin-left: 32px;
        height: 375px;
        margin-bottom: 30px;
    }

    .main-widget.top-right {
        max-width: 80% !important;
        margin-left: -104px !important;
        margin-top: -35px !important;
    }

    .widget-list-text {
        margin-left: 32px;
        white-space: nowrap;
        max-width: 430px !important;
        display: inline-block;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .main-widget-bottom {
        max-width: 618px !important;
        margin-bottom: 24px;
        margin-left: 32px;
        margin-top: 24px;
    }

    .main-widget.right {
        max-width: 80% !important;
        margin-left: -100px !important;
    }

    .card-bodyChat {
        flex: 1 1 auto;
        margin-bottom: 40px;
        margin-left: 13px;
        height: 240px;
        overflow: hidden;
    }

    .play-btn {

        position: relative;
        top: -15px;
        left: -30px;
    }

    .iframeContainerClass {
        height: auto;
    }

    .bg-header {
        height: 236px;
        background-repeat: no-repeat !important;
        background-size: 95% 98% !important;
    }

    /*PMS */
    .progresstxt {
        padding-left: 0px !important;
        top: 16px !important;

        /* left: -42px !important; */

        position: relative;
    }


    .half-width .template2-progresstxt {
        left: 39px !important;
        position: relative;
        margin-top: 14px !important;
    }

    .repo {
        position: absolute !important;
        left: 176px;
    }

    .ChipPending {

        max-width: 260px !important;
    }

    .col-md-3 {

        -ms-flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .left-tab-bg {

        width: 303px !important;
        max-width: 100% !important;
    }

    .tab-content {

        margin-left: 0px !important;
    }

    .col-md-4 {

        width: 40%;
        max-width: 100% !important;
    }
}

/* Desktop Multi Resolution */

/* Desktop Multi Resolution */
@media only screen and (min-width: 1400px) {

    .languages-menu {
        margin-top: 160px !important;
    }

    .welcome-widget {
        margin-top: 40% !important;
    }

    .welcome-banner {
        margin-top: 20% !important;
    }

    .wrapper {
        margin-top: 210px !important;
    }
}

@media only screen and (max-width: 1600px) and (max-height:900px) {
    .exitimage {
        left: 41%;
    }

    .exit-widget {
        padding-top: 25%;
    }
}

@media only screen and (min-width: 1440px) and (max-height:900px) {
    .exit-widget {
        padding-top: 25% !important;
    }

    .exitimage {
        left: 41%;
    }

    .languages-menu {
        margin-top: 70px !important;
    }

    .welcome-widget {
        margin-top: 20% !important;
    }

    .welcome-banner {
        margin-top: 12% !important;
    }

    .wrapper {
        margin-top: 120px !important;

    }
}

@media screen and (min-width: 1680px) {
    .chat-frame {
        position: relative;

        top: 13% !important;
    }
}

@media only screen and (min-width: 1680px) {


    .main-widget.top {
        margin-top: -50px;
    }

    .main-widget.top-right {
        margin-top: -50px !important;
    }

    .container.data-popup {
        height: 90vh;
    }

    .languages-menu {
        margin-top: 135px !important;
    }

    .welcome-widget {
        margin-top: 35% !important;
    }

    .welcome-banner {
        margin-top: 18% !important;
    }

    .wrapper {
        margin-top: 185px !important;

    }
}

@media (min-device-width: 834px) and (max-device-width: 1194px) {
    body {
        zoom: 1 !important;
    }
}

@media (-webkit-min-device-pixel-ratio: 1.25) {
    .chat-frame {
        zoom: 0.90;
    }


    /* body {  */
        /* zoom: 0.93; */
    /* }  */

    .iframeContainerLanding {
        display: block;

    }

    .tab-content {
        min-width: 885px !important;
    }
}

@media (-webkit-min-device-pixel-ratio: 1.75) {
    .chat-frame {
        zoom: 0.90;
    }


    body {
        zoom: 0.95;

    }


    .tab-content {
        min-width: 885px !important;
    }
}


@media (-webkit-min-device-pixel-ratio: 1.5) {
    .chat-frame {
        zoom: 0.90;
    }


      body { 
         zoom: 0.93 !important;
     } 


    /* .iframeContainerLanding { */

    /* margin-top: 9%; */
    /* } */
    /* .login-bg{ */
    /* height: calc(100vh/var(--bs-zoom)) !important; */
    /* } */
}

/* SAFARI and MAC */
@media (-webkit-min-device-pixel-ratio: 2) {

    .chat-frame {
        zoom: 0.90;
    }

    body { 
         zoom: 0.93; 
     } 

    .welcome-bg {

        height: calc(100vh/var(--bs-zoom)) !important;
    }



    .login-bg {
        height: calc(100vh/var(--bs-zoom)) !important;
    }
}

/* Higher resolution height fix */
@media screen and (max-width: 1920px) {
    body {
        min-height: 938px;
    }
}

/* SAFARI and MAC END */



@media screen and (min-width: 1920px) {

    .chat-frame {
        bottom: 40px !important;
    }

    .scrollable2 {
        /*  height: calc(100vh - 63px); */
        /* overflow: hidden; */
    }

    .scrollable {
        /* max-height: 78vh; */
        /* overflow: hidden; */
    }

    .scrollable:hover {
        /*  overflow-y:auto !important; */
    }

    .scrollable2:hover {
        /*  overflow-y:auto !important; */
    }

    .exitimage {
        position: fixed;
        bottom: 0px;
        left: 42.5% !important;
    }

    .exit-widget {
        margin-left: 5px;
        padding-top: 24% !important;
    }


    .container.data-popup {
        height: 94vh;
    }

    .languages-menu {
        margin-top: 130px !important;
    }

    .welcome-widget {
        margin-top: 35% !important;
    }

    .welcome-banner {
        margin-top: 18% !important;
    }

    .wrapper {
        margin-top: 180px !important;

    }
}

/* IPAD AIR 4 */

/* @media screen and (min-width: 820px) and (max-height:1180px) {
  .wrapper {
    margin-left: 195px !important;
    margin-top: 260px !important;

}
}  */
@media only screen and (min-width: 820px) and (max-width: 1180px) {
    .counter-box {
        width: 240px !important;
    }

    .main-widget.top-right {
        max-width: 96%;
        margin-left: 68px;
        margin-top: 0px;
    }

    .main-widget.right {
        max-width: 96%;
        margin-left: 60px;
    }
}

/* SAMSUNG GALAXY TAB S7 */

@media only screen and (min-width: 800px) and (max-width: 1280px) {
    .counter-box {
        width: 205px !important;
    }

    /* .main-widget.top-right {
  max-width: 96%;
  margin-left: 68px;
  margin-top: 0px;
} */
    /* .main-widget.right {
  max-width: 96%;
  margin-left: 60px;
} */
}

@media (min-width: 576px) {
    .topbar .dropdown {
        position: relative;
    }

    .topbar .dropdown .dropdown-menu {
        width: auto;
        right: 0;
    }

    /* .topbar .dropdown-list {
    width: 20rem !important;
  } */
    .topbar .dropdown-list .dropdown-item .text-truncate {
        max-width: 13.375rem;
    }
}

@media (min-width: 768px) {

    .sidebar {
        width: auto !important;
    }

    .sidebar .nav-item .collapse {
        position: relative;
        left: 0;
        z-index: 1;
        top: 0;
        -webkit-animation: none;
        animation: none;
    }

    .sidebar .nav-item .collapse .collapse-inner {
        border-radius: 0;
        box-shadow: none;
    }

    .sidebar .nav-item .collapsing {
        display: block;
        transition: height 0.15s ease;
    }

    .sidebar .nav-item .collapse,
    .sidebar .nav-item .collapsing {
        margin: 0 1rem;
    }

    .sidebar .nav-item .nav-link {
        display: block;
        width: 100%;
        text-align: left;
        padding: 10px 10px 10px 10px;
        width: 16rem;
    }

    .sidebar .nav-item .nav-link i {

        margin-right: 0.45rem;
    }

    .sidebar .nav-item .nav-link span {
        font-size: 0.85rem;
        display: inline;
    }

    .sidebar .nav-item .nav-link[data-toggle="collapse"]::after {
        width: 1rem;
        text-align: center;
        float: right;
        vertical-align: 0;
        border: 0;
        font-weight: 900;
        content: '\f107';
        font-family: 'Font Awesome 5 Free';
    }

    .sidebar .nav-item .nav-link[data-toggle="collapse"].collapsed::after {
        content: '\f105';
    }

    .sidebar .sidebar-brand .sidebar-brand-icon i {
        font-size: 2rem;
    }

    .sidebar .sidebar-brand .sidebar-brand-text {
        display: inline;
    }

    .sidebar .sidebar-heading {
        text-align: left;
    }

    .sidebar.toggled {

        overflow: visible;
        width: 4.5rem !important;
        border-top-right-radius: 25px;
        border-bottom-right-radius: 25px;
    }

    .sidebar.toggled .nav-item .collapse {
        position: absolute;
        left: calc(6.5rem + 1.5rem / 2);
        z-index: 1;
        top: 2px;
        -webkit-animation-name: growIn;
        animation-name: growIn;
        -webkit-animation-duration: 200ms;
        animation-duration: 200ms;

    }

    .sidebar.toggled .nav-item .collapse .collapse-inner {
        box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
        border-radius: 0.35rem;
    }

    .sidebar.toggled .nav-item .collapsing {
        display: none;
        transition: none;
    }

    .sidebar.toggled .nav-item .collapse,
    .sidebar.toggled .nav-item .collapsing {
        margin: 0;
    }

    .sidebar.toggled .nav-item:last-child {
        margin-bottom: 1rem;
    }

    .sidebar.toggled .nav-item .nav-link {
        text-align: center;
        padding: 40px 1rem;
        width: auto;
    }

    .sidebar.toggled .nav-item .nav-link span {
        font-size: 0.65rem;
        display: block;
    }

    .sidebar.toggled .nav-item .nav-link i {
        margin-right: 0;
    }

    .sidebar.toggled .nav-item .nav-link[data-toggle="collapse"]::after {
        display: none;
    }

    .sidebar.toggled .sidebar-brand .sidebar-brand-icon i {
        font-size: 2rem;
    }

    .sidebar.toggled .sidebar-brand .sidebar-brand-text {
        display: none;
    }

    .sidebar.toggled .sidebar-heading {
        text-align: center;
    }
}


@media only screen and (max-width: 768px) {
    .welcome-banner {
        display: none;
    }

    #banner-carousel {
        display: none !important;
    }

    .header-logo {
        max-height: 50px !important;
    }

    .header-logo {
        margin-left: 3%;
    }

    .topbar .dropdown-list .dropdown-header {

        padding-top: 0px;
    }

    .header-right-img {
        display: none;
    }

    .chip-user {
        display: inline-block;

    }

    .table {
        width: 95%;
        /* min-width: 210px; */
        margin: 0 auto;
    }

    .widget-list-action-approve a {
        font-size: 12px;
        text-decoration: none;
    }

    .widget-list-action a {

        font-size: 12px;
    }
}

@media (max-width: 767.98px) {

    .cnt-count {
        font-size: 12px !important;
        margin-right: 0px !important;
    }

    .main-widget.top {
        margin-top: -50px !important;

    }

}

@media (min-width: 576px) {
    .dropdown-menu-sm-left {
        right: auto;
        left: 0;
    }

    .dropdown-menu-sm-right {
        right: 0;
        left: auto;
    }
}

@media (min-width: 768px) {
    .dropdown-menu-md-left {
        right: auto;
        left: 0;
    }

    .dropdown-menu-md-right {
        right: 0;
        left: auto;
    }
}

@media (min-width: 992px) {
    .dropdown-menu-lg-left {
        right: auto;
        left: 0;
    }

    .dropdown-menu-lg-right {
        right: 0;
        left: auto;
    }
}

@media (min-width: 1200px) {
    .dropdown-menu-xl-left {
        right: auto;
        left: 0;
    }

    .dropdown-menu-xl-right {
        right: 0;
        left: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .carousel-item {
        transition: none;
    }
}

.srch-icon {
    position: absolute !important;
    margin-top: -17px;
    position: absolute !important;
    z-index: 999;
    width: 50px !important;
}

span.icon.arrow-down i {
    font-size: 22px;
}

.topbar .navbar-search input {
    padding-left: 46px !important;
}

.searchbar {
    display: block;
    margin-top: 13px;
    margin-bottom: 16px;
    margin-right: 57px;
    z-index: 999;
    width: 468px;
}

.togglesearch {
    z-index: 999;
    /* background: #E8E8E4; */

    top: 48px;
    right: 9.7%;
    width: 400px;
    left: 16px;
    /* height: 48px; */
    line-height: 27px;
    /* box-shadow: 0 0 10px rgb(0 0 0 / 50%); */
    /* border-top: 4px solid #D80B15; */
    display: none;
}

.wrapper {
    margin-left: 64px;
    margin-top: 50px;
    position: absolute;
    z-index: 999;
}

#wrapper-main {
    height: 100vh !important;
}

.login-logo {
    padding-top: 20px;
}

.login-logo img {
    /* height: 30px; */
    max-height: 150px;
    max-width: 150px;
}



.login-right-logo {
    position: absolute;
    z-index: 999;
    margin-top: 18px;
    width: 100%;
    padding-right: 18px;
}

.login-welcome {
    padding-top: 30px;
    padding-bottom: 20px;
    text-align: center;
    font-size: 24px !important;
}

.change-pwd {
    text-align: left;
    padding-bottom: 44px;
    margin-left: 16px;
}

.popup-title {
    padding: 0px;
}

ul.popup-li {
    list-style-type: disc !important;
    padding-left: 1em !important;
    margin-left: 1em;
}

ul.popup-li li {
    padding-bottom: 10px;
}

.aes-popup {
    margin-left: 8px;
}

/* .aes-popup .mat-dialog-container {
  padding: 24px 24px 0px 24px !important;
 } */
.aes-popup .mat-dialog-container {
    padding: 24px 24px 0px 24px !important;
    max-height: 100vh;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.popup-subtitle {
    color: var(--bs-light-grey);
}

.cdk-overlay-dark-backdrop {
    background: rgba(56, 56, 92, 0.8) !important;
}

.languages-menu {
    position: absolute;
    margin-left: 58px;
    padding-bottom: 30px !important;
}

.maintenance-msg {
    margin: auto;
    padding-top: 5px;
    max-width: 405px;
    line-height: 15px;
}

.login-controls {

    padding: 20px;
    margin-bottom: 40px;
    margin-top: 458x;
}

.login-btn {

    background: var(--bs-primary) !important;
    ;
    color: var(--bs-white) !important;
    ;
    padding: 0.25rem 5.5rem !important;
    font-size: 0.875rem !important;
    ;
    line-height: 1.5 !important;
    ;
    border-radius: 1.2rem !important;
    ;
    border: 1px solid var(--bs-wrapper-card-border) !important;
    ;
    width: 100% !important;
    ;
    height: 3em !important;
    ;
    cursor: pointer;

}

.topbar.navbar-light .navbar-nav .nav-item .nav-link {

    font-size: 20px;
}

.topbar .navbar-search input::placeholder {
    color: var(--bs-light-grey);
    font-size: 14px;
}

.nav-link.open-menu {
    display: block;

}

.sidebar.toggled .nav-item .open-menu {
    display: none;
}


.sidebar-dark .nav-item .nav-link i {
    font-size: 20px;
    float: left;
    color: var(--bs-white);
}

.open-menu {
    font-size: 13px;
    padding: 0px 2px 3px 25px;
}

a#sidebarToggleTop {
    margin-bottom: 15px;
}

.sidebar-dark {
    width: 14.5rem !important;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    max-height: 620px;
    position: fixed;
    z-index: 999;
}

.sidebar .nav-item .nav-link {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0px 15px 32px 2px;
    width: 15rem;
    margin-left: 13px;
}

.sidebar-dark .nav-item.active .nav-link {

    margin-top: 10px;
    margin-bottom: 10px;
}

i.fa.right.fa-times {
    float: right;
}

.dropdown .dropdown-menu {
    font-size: 0.85rem;
}

.dropdown .dropdown-menu .dropdown-header {
    font-weight: 800;
    font-size: 0.65rem;

}

.dropdown.no-arrow .dropdown-toggle::after {
    display: none;
}

.sidebar .nav-item.dropdown .dropdown-toggle::after,
.topbar .nav-item.dropdown .dropdown-toggle::after {
    width: 1rem;
    text-align: center;
    float: right;
    vertical-align: 0;
    border: 0;
    font-weight: 900;
    content: '\f105';
    font-family: 'Font Awesome 5 Free';
}

.sidebar .nav-item.dropdown.show .dropdown-toggle::after,
.topbar .nav-item.dropdown.show .dropdown-toggle::after {
    content: '\f107';
}

.sidebar .nav-item .nav-link,
.topbar .nav-item .nav-link {
    position: relative;
}

.sidebar .nav-item .nav-link .badge-counter,
.topbar .nav-item .nav-link .badge-counter {
    position: absolute;
    transform: scale(0.7);
    transform-origin: top right;
    right: -5px;
    margin-top: 6px;
}

.sidebar .nav-item .nav-link .img-profile,
.topbar .nav-item .nav-link .img-profile {
    height: 2rem;
    width: 2rem;
}

.badge {
    display: inline-block;
    font-size: 75%;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background: var(--bs-secondary);
    color: var(--bs-white);
    padding: 13px 10px !important;
    border-radius: 50px !important;
    height: 40px !important;
    width: 40px !important;
}

.topbar {
    min-width: 1366px;
    position: fixed;
    height: 64px;
    padding-top: 25px;
    padding-bottom: 25px;
    box-shadow: 0px 4px 12px var(--bs-topbar-shadow);
}

.topbar-fullwidth {
    background: var(--bs-white);
    height: 80px;
    padding-top: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid var(--bs-Topbar-border);
}

.topbar-fixed {
    min-width: 1366px;
    margin-top: -25px;
}

.header-fullwidth {
    margin-top: -25px;
    max-width: 100% !important;
}

.topbar #sidebarToggleTop {
    height: 2.5rem;
    width: 2.5rem;
}


.topbar .navbar-search {
    width: 25rem;
}

.topbar .navbar-search input {
    font-size: 14px;
    height: 36px;
    width: 468px;
    border: none;
    border-radius: 4px;

}

.topbar .topbar-divider {
    width: 0;
    height: calc(4.375rem - 2rem);
    margin: auto 1rem;
}

.topbar .nav-item .nav-link {
    height: 4.375rem;
    display: flex;
    align-items: center;
    padding: 0 11px;
}

.topbar .nav-item .nav-link i {
    font-size: 28px !important;
}

.topbar .nav-item .nav-link:focus {
    outline: none;
}

.topbar .nav-item:focus {
    outline: none;
}

.topbar .dropdown {
    position: static;
    margin-right: 10px;
}

.topbar .dropdown .dropdown-menu {
    width: 450px;
    right: 2.75rem;
    box-shadow: 1px 2px 8px #EAEAEA !important;
}

.login-bg {
    background: var(--bs-secondary);
}

.topbar .dropdown-list {
    padding: 0;
    border: none;
    overflow: hidden;
}

.topbar .dropdown-list .dropdown-header {
    background-color: var(--bs-primary);
    border: 1px solid var(--bs-secondary);
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.topbar .dropdown-list .dropdown-item {
    white-space: normal;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    line-height: 1.3rem;
}

.topbar .dropdown-list .dropdown-item .dropdown-list-image {
    position: relative;
    height: 2.5rem;
    width: 2.5rem;
}

.topbar .dropdown-list .dropdown-item .dropdown-list-image img {
    height: 2.5rem;
    width: 2.5rem;
}

.topbar .dropdown-list .dropdown-item .dropdown-list-image .status-indicator {

    height: 0.75rem;
    width: 0.75rem;
    border-radius: 100%;
    position: absolute;
    bottom: 0;
    right: 0;

}

.topbar .dropdown-list .dropdown-item .text-truncate {
    max-width: 10rem;
}

/* .topbar .dropdown-list .dropdown-item:active {

    color: #3a3b45;
  } */

.topbar.navbar-light .navbar-nav .nav-item .nav-link {
    color: var(--bs-primary);
}


.topbar.navbar-light .navbar-nav .nav-item .nav-link:active {
    color: var(--bs-secondary);
    ;
}

.sidebar {
    width: 6.5rem;
    height: auto;
    margin-top: 20px;
}

.sidebar .nav-item {
    position: relative;

}

.sidebar .nav-item:last-child {
    margin-bottom: 1rem;
}

.sidebar .nav-item .nav-link {
    text-align: center;
    padding: 0.75rem 1rem;
    width: 6.5rem;
}

.sidebar .nav-item .nav-link span {
    font-size: 0.65rem;
    display: block;
}

.sidebar .nav-item.active .nav-link {
    font-weight: 700;
}

.sidebar .nav-item .collapse {
    position: absolute;
    left: calc(6.5rem + 1.5rem / 2);
    z-index: 1;
    top: 2px;
}

.sidebar .nav-item .collapse .collapse-inner {
    border-radius: 0.35rem;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
}

.sidebar .nav-item .collapsing {
    display: none;
    transition: none;
}

.sidebar .nav-item .collapse .collapse-inner,
.sidebar .nav-item .collapsing .collapse-inner {
    padding: .5rem 0;
    min-width: 10rem;
    font-size: 0.85rem;
    margin: 0 0 1rem 0;
}

.sidebar .nav-item .collapse .collapse-inner .collapse-header,
.sidebar .nav-item .collapsing .collapse-inner .collapse-header {
    margin: 0;
    white-space: nowrap;
    padding: .5rem 1.5rem;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 0.65rem;

}

.sidebar .nav-item .collapse .collapse-inner .collapse-item,
.sidebar .nav-item .collapsing .collapse-inner .collapse-item {
    padding: 0.5rem 1rem;
    margin: 0 0.5rem;
    display: block;

    text-decoration: none;
    border-radius: 0.35rem;
    white-space: nowrap;
}


.sidebar .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar .nav-item .collapsing .collapse-inner .collapse-item.active {

    font-weight: 700;
}

.sidebar #sidebarToggle {
    width: 2.5rem;
    height: 2.5rem;
    text-align: center;
    margin-bottom: 1rem;
    cursor: pointer;
}

.sidebar #sidebarToggle::after {
    font-weight: 900;
    content: '\f104';
    font-family: 'Font Awesome 5 Free';
    margin-right: 0.1rem;
}

.sidebar #sidebarToggle:hover {
    text-decoration: none;
}


.sidebar #sidebarToggle:focus {
    outline: none;
}

.sidebar.toggled {
    width: 0 !important;
    max-height: 980px;
    overflow: hidden;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.sidebar.toggled #sidebarToggle::after {
    content: '\f105';
    font-family: 'Font Awesome 5 Free';
    margin-left: 0.25rem;
}

.sidebar.toggled .sidebar-card {
    display: none;
}

.sidebar .sidebar-brand {
    height: 4.375rem;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 800;
    padding: 1.5rem 1rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    z-index: 1;
}

.sidebar .sidebar-brand .sidebar-brand-icon i {
    font-size: 2rem;
}

.sidebar .sidebar-brand .sidebar-brand-text {
    display: none;
}

.sidebar hr.sidebar-divider {
    margin: 0 1rem 1rem;
}

.sidebar .sidebar-heading {
    text-align: center;
    padding: 0 1rem;
    font-weight: 800;
    font-size: 0.65rem;
}

.sidebar .sidebar-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 0.875rem;
    border-radius: 0.35rem;
    margin-left: 1rem;
    margin-right: 1rem;
    margin-bottom: 1rem;
    padding: 1rem;

}

.sidebar .sidebar-card .sidebar-card-illustration {
    height: 3rem;
    display: block;
}

.sidebar .sidebar-card .sidebar-card-title {
    font-weight: bold;
}

.sidebar .sidebar-card p {
    font-size: 0.75rem;

}

.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.no-gutters>.col,
.no-gutters>[class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

.widget-list-action-approve-no-border {
    border-right: 0px;
}

.widget-list-action-approve-no-border a {
    color: var(--bs-primary);
    text-decoration: none;
    cursor: pointer !important;
}

.dropdown-toggle {
    white-space: nowrap;
}

.dropdown-toggle::after {
    border-right: 2px solid var(--bs-bodyTxt);
    border-bottom: 2px solid var(--bs-bodyTxt);
    border-top: none !important;
    border-left: none !important;
    width: 8px;
    display: inline-block;
    height: 8px;
    transform: rotate(45deg);
    -webkit-transform: scale(1) rotate(45deg) translate(0px, 0px);
    -moz-transform: rotate(45deg) scale(1.0);
    -o-transform: rotate(45deg) scale(1.0);
    margin-top: 0px;
    content: "";
    margin-left: 12px;
}

.dropdown-toggle:empty::after {
    margin-left: 0;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0 0 0;
    font-size: 0.85rem;
    color: var(--bs-secondary);
    ;
    text-align: left;
    list-style: none;
    background-color: var(--bs-white);
    background-clip: padding-box;
    border-radius: 0.35rem;
}

.dropdown-menu-left {
    right: auto;
    left: 0;
}

.dropdown-menu-right {
    right: 0;
    left: auto;
}

.dropup .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 0.125rem;
}

.dropup .dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0;
    border-right: 0.3em solid transparent;
    border-bottom: 0.3em solid;
    border-left: 0.3em solid transparent;
}

.dropup .dropdown-toggle:empty::after {
    margin-left: 0;
}

.dropright .dropdown-menu {
    top: 0;
    right: auto;
    left: 100%;
    margin-top: 0;
    margin-left: 0.125rem;
}

.dropright .dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid transparent;
    border-right: 0;
    border-bottom: 0.3em solid transparent;
    border-left: 0.3em solid;
}

.dropright .dropdown-toggle:empty::after {
    margin-left: 0;
}

.dropright .dropdown-toggle::after {
    vertical-align: 0;
}

.dropleft .dropdown-menu {
    top: 0;
    right: 100%;
    left: auto;
    margin-top: 0;
    margin-right: 0.125rem;
}

.dropleft .dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
}

.dropleft .dropdown-toggle::after {
    display: none;
}

.dropleft .dropdown-toggle::before {
    display: inline-block;
    margin-right: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid transparent;
    border-right: 0.3em solid;
    border-bottom: 0.3em solid transparent;
}

.dropleft .dropdown-toggle:empty::after {
    margin-left: 0;
}

.dropleft .dropdown-toggle::before {
    vertical-align: 0;
}

.dropdown-menu[x-placement^="top"],
.dropdown-menu[x-placement^="right"],
.dropdown-menu[x-placement^="bottom"],
.dropdown-menu[x-placement^="left"] {
    right: auto;
    bottom: auto;
}

.dropdown-divider {
    height: 0;
    margin: 0.5rem 0;
    overflow: hidden;
    border-top: 1px solid #eaecf4;
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: 0.25rem 1.5rem;
    clear: both;
    font-weight: 400;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-item:hover,
.dropdown-item:focus {
    text-decoration: none;

}

.dropdown-item.active,
.dropdown-item:active {

    text-decoration: none;

}

.dropdown-item.disabled,
.dropdown-item:disabled {

    pointer-events: none;
    background-color: transparent;
}

.dropdown-menu.show {
    /* display: block; */
}

.dropdown-header {
    display: block;
    padding: 0.5rem 1.5rem;
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-secondary);
    ;
    white-space: nowrap;
}

.dropdown-item-text {
    display: block;
    padding: 0.25rem 1.5rem;

}

.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.btn-group>.btn,
.btn-group-vertical>.btn {
    position: relative;
    flex: 1 1 auto;
}

.btn-group>.btn:hover,
.btn-group-vertical>.btn:hover {
    z-index: 1;
}

.btn-group>.btn:focus,
.btn-group>.btn:active,
.btn-group>.btn.active,
.btn-group-vertical>.btn:focus,
.btn-group-vertical>.btn:active,
.btn-group-vertical>.btn.active {
    z-index: 1;
}

.btn-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.btn-toolbar .input-group {
    width: auto;
}

.btn-group>.btn:not(:first-child),
.btn-group>.btn-group:not(:first-child) {
    margin-left: -1px;
}

.btn-group>.btn:not(:last-child):not(.dropdown-toggle),
.btn-group>.btn-group:not(:last-child)>.btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group>.btn:not(:first-child),
.btn-group>.btn-group:not(:first-child)>.btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.dropdown-toggle-split {
    padding-right: 0.5625rem;
    padding-left: 0.5625rem;
}

.dropdown-toggle-split::after,
.dropup .dropdown-toggle-split::after,
.dropright .dropdown-toggle-split::after {
    margin-left: 0;
}

.dropleft .dropdown-toggle-split::before {
    margin-right: 0;
}



.card-cnt {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--bs-card-background);
    background-clip: border-box;
    border-radius: 1.35rem;
    height: 400px !important;
}

.card-cnt1 {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--bs-white);
    background-clip: border-box;
    border-radius: 1.35rem;
    height: 380px !important;
}

.card-counter {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 143px;
    min-width: 254px;
    margin-left: 19px;
    margin-right: 5px;
    word-wrap: break-word;
    background-color: var(--bs-card-background);
    background-clip: border-box;
    border-radius: 15px;
    margin-bottom: 19px;
}

.card-wgt {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 250px;
    word-wrap: break-word;
    background-color: var(--bs-card-background);
    border-radius: 15px;

}

.card {
    border: 0px !important;
}

.shadow {
    box-shadow: 0px 4px 20px #EAEAEA !important;
}

.card-bodyChat {
    flex: 1 1 auto;
    margin-bottom: 40px;
    margin-left: 13px;
    height: 240px;
    overflow: hidden;
}


.carousel {
    position: relative;
    width: 828px;
}

.carousel.pointer-event {
    touch-action: pan-y;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: var(--bs-secondary);
}

.carousel-inner::after {
    display: block;
    clear: both;
    content: "";
}

.carousel-item img {
    width: 100%;
    /* height: 100vh; */

}

#content-wrapper {
    background-color: var(--bs-white);
    max-width: 1366px;
    padding-right: 48px;
    height: auto;
    padding-top: 20px;
    padding-left: 7px;
}

#content-wrapper-landing {
    background-color: var(--bs-white);
    min-width: 1366px;
    padding-right: 48px;
    height: auto;
}

#content-wrapper-inner {
    max-width: 1250px;


}

.carousel-item {
    position: relative;
    min-height: 649px;
    height: 100vh;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: transform 0.6s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
    .carousel-item {
        transition: none;
    }
}

.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
    display: block;
}

.carousel-item-next:not(.carousel-item-left),
.active.carousel-item-right {
    transform: translateX(100%);
}

.carousel-item-prev:not(.carousel-item-right),
.active.carousel-item-left {
    transform: translateX(-100%);
}

.carousel-fade .carousel-item {
    opacity: 0;
    transition-property: opacity;
    transform: none;
}

.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
    z-index: 1;
    opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
    z-index: 0;
    opacity: 0;
    transition: opacity 0s 0.6s;
}

@media (prefers-reduced-motion: reduce) {

    .carousel-fade .active.carousel-item-left,
    .carousel-fade .active.carousel-item-right {
        transition: none;
    }
}

.carousel-control-prev,
.carousel-control-next {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;

    text-align: center;
    opacity: 0.5;
    transition: opacity 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {

    .carousel-control-prev,
    .carousel-control-next {
        transition: none;
    }
}

.carousel-control-prev:hover,
.carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {

    text-decoration: none;
    outline: 0;
    opacity: 0.9;
}

.carousel-control-prev {
    left: 0;
}

.carousel-control-next {
    right: 0;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: 50% / 100% 100% no-repeat;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 15;
    display: flex;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none;
}

.carousel-indicators li {
    box-sizing: content-box;
    flex: 0 1 auto;
    border: solid 2px #fff !important;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: transparent;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: 8.5;
    transition: opacity 0.6s ease;
}

.carousel-indicators .active {
    background-color: var(--bs-white) !important;
}

.carousel-control-prev {
    display: none;
}

.carousel-control-next-icon {
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .carousel-indicators li {
        transition: none;
    }
}

.carousel-indicators .active {
    opacity: 1;
}

.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 20px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;

    text-align: center;
}

@-webkit-keyframes spinner-border {
    to {
        transform: rotate(360deg);
    }
}

@keyframes spinner-border {
    to {
        transform: rotate(360deg);
    }
}

.scrollable {
    /* height: calc(87vh - 63px);*/
    /* width: 100%; */
    /*  overflow:hidden; */
}

.scrollable::-webkit-scrollbar {

    width: 10px !important;
}

.scrollable2::-webkit-scrollbar {

    width: 10px !important;
}

.scrollable2 {
    /*  height: calc(87vh - 63px); */
    /* overflow: hidden; */
}

.scrollable2:hover {

    /*   overflow-y:auto; */
}

.scrollable::-webkit-scrollbar {

    width: 10px !important;
}

.scrollable3::-webkit-scrollbar {

    width: 10px !important;
}

.scrollable3 {

    overflow: hidden;
}

.mat-progress-bar-fill::after {
    background: var(--bs-secondary) !important;
}

.scrollable3:hover {

    overflow-y: auto;
}

.mat-option {
    font-family: inherit !important;
}

@media screen and (min-height:768px) {

    .scrollable {
        /*
  width: 100%;
  overflow:hidden; */
    }
}

.scrollable:hover {
    /* overflow-y:auto; */
}

.scroll-to-top {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    display: none;
    width: 2.75rem;
    height: 2.75rem;
    text-align: center;

    background: var(--bs-primary) !important;
    line-height: 46px;
}

.scroll-to-top:hover {
    background: #5a5c69;
}

.scroll-to-top i {
    font-weight: 800;
}

@-webkit-keyframes growIn {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes growIn {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}


.animated--fade-in {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 200ms;
    animation-duration: 200ms;

}

/*MENU CSS */
button {
    margin: 0;
    padding: 0;
    line-height: 1;
}

ul,
ol {
    list-style-type: none;
}

button.floatbar-toggle.transparent-btn.rotated {
    background: transparent;
    border: none;
    margin-left: 6px;
    position: absolute;
    padding-top: 30px;
}

button.floatbar-toggle.transparent-btn.rotated i {
    font-size: 26px;
    padding: 5px;

}

button.floatbar-toggle.transparent-btn {

    background: none !important;
    border: none;
}

button.floatbar-toggle.transparent-btn i {
    background: none !important;
    font-size: 24px;
    width: 30px;
    height: 25px;


}

.floatbar {
    position: fixed;
    transition: .3s all;
    z-index: 999999;
    top: 0;
    margin-top: 16px;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    background-color: var(--bs-primary) !important;
    width: 390px;
    padding: 20px 15px 37px 20px;
    min-height: 649px;
    /* floatbar head */
    /* floatbar body */
    /* floatbar footer */
    overflow: scroll;
}

.floatbar a:focus {
    outline: none;
}

.floatbar-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.floatbar-body {
    margin-top: 49px;
    margin-left: -20px;
}

.floatbar.hidden .floatbar-body {
    margin-top: 15px;
    margin-left: 0px;
}

.floatbar-body-menu li {
    position: relative;
    padding-top: 18px;
    padding-bottom: 18px;
    padding-left: 32px;
    padding-right: 32px;
    transition: 0.6s;
}

/* .floatbar-body-menu li:hover {
  background: #1e1e1e;

} */
.bar-title {
    margin-top: -10px;
    cursor: pointer;
}

.floatbar-body-menu a {
    text-decoration: none;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    color: var(--bs-white);
    cursor: pointer !important;

}


.floatbar-body-menu a:hover {
    opacity: 1;
}

.floatbar-body-menu a:hover::after {
    opacity: 1;
}

.floatbar-body-menu a.active {
    opacity: 1;
}

.floatbar-body-menu a.active::after {
    opacity: 1;
}

.floatbar-body-menu a>.icon {
    margin-right: 16px;
    height: 24px;
    width: 24px;
    margin-top: -10px;
}

.floatbar-user {
    border-radius: 10px;
    padding: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.floatbar-user-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-right: 8px;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    overflow: hidden;
    background-color: var(--bs-white);
}

ul,
button {
    margin: 0;
    padding: 0;
    line-height: 1;
}

ul,
ol {
    list-style-type: none;
}

/* content of sr-only is available only for screen-readers */
.sr-only {
    position: absolute;
    white-space: nowrap;
    width: 1px;
    height: 1px;
    overflow: hidden;
    border: 0;
    padding: 0;
    clip: rect(0 0 0 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    margin: -1px;
}

/* Track */
.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
}

.menu-toggle {
    background-image: url(../images/Menu-toggle-white.svg);
    width: 24px;
    height: 24px;
}

.menu-toggle--gray {
    background-image: url(../images/Menu-toggle-gray.svg);
    width: 24px;
    height: 24px;
}

.home {
    background-image: url(../images/Home-white.svg);
    width: 24px;
    height: 24px;
}

span.icon.document i {
    font-size: 24px;
}



.floatbar-toggle {
    -webkit-transition: 0.3s all;
    -o-transition: 0.3s all;
    transition: 0.3s all;
}

.floatbar-toggle:hover {
    opacity: 1;
}



.category__btn {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    right: 0;
    top: -10px;
    z-index: 1;
}

.gray-circle-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border-width: 0;
}

.ligt-circle-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border-width: 0;
}


.floatbar-user-img picture {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.floatbar-user-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.menu-toggle {
    background-image: url(../images/Menu-toggle-white.svg);
    width: 24px;
    height: 24px;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.menu-toggle--gray {
    background-image: url(../images/Menu-toggle-gray.svg);
    width: 24px;
    height: 24px;
}

.home {
    background-image: url(../images/Home-white.svg);
    width: 24px;
    height: 24px;
}

.msg-counter {
    position: absolute;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background-color: var(--bs-primary);
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-weight: 500;
    font-size: 12px !important;
    line-height: 1.25;
    letter-spacing: 0.75px;
    color: var(--bs-white);
}

.system-menu__title {
    display: inline-block;
    margin-top: 13px;
    margin-bottom: 2px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.25;
    letter-spacing: 0.75px;
    color: rgba(255, 255, 255, 0.5);
}

.cat-sub-menu {
    padding-left: 34px;
    height: 0;
}

.floatbar.hidden *.cat-sub-menu.visible {
    display: none !important;
}

.cat-sub-menu.visible {
    height: 100%;
    padding-left: 75px;
    background: #ffab70;
    width: 390px;
    margin-left: -32px;
    margin-top: 10px;
    padding-top: 10px;
}

ul.cat-sub-menu li {
    padding: 5px 5px 5px 5px;
}

.cat-sub-menu.visible a {
    opacity: 10.6;
    visibility: visible;
    padding-left: 12px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.rotate {
    -moz-transition: all 2s linear;
    -webkit-transition: all 2s linear;
    transition: all 2s linear;
}

.rotate.down {
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.cat-sub-menu.visible a:hover {
    opacity: 1;
}

.auto-search-box {
    display: none;
    position: absolute;
    z-index: 999;
    min-width: 520px;
    background: #FDFDFD;
    box-shadow: 1px 2px 8px #EAEAEA;
    border-radius: 0px 0px 15px 15px;
}

.aes-main-popup {
    margin: auto !important;
    width: 438px !important;
    height: 100% !important;
    background: var(--bs-card-background);
    padding: 30px;
    box-shadow: 0px 4px 12px 4px rgb(29 29 29 / 25%);
    border-radius: 8px;
    margin: auto;
    z-index: 99999;
    position: relative;
}


.popup-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8;
    /* for demo purpose  */
    background: rgba(56, 56, 92, 0.8) !important;
}

.page-popup-btn {
    margin-top: 109px;
    padding-bottom: 20px;
}

.submenu i {
    font-size: 24px;
    padding-right: 10px;
}

.stack-top {
    z-index: 9;
    margin: 20px;
    /* for demo purpose  */
}

.cat-sub-menu a {
    opacity: 0;
    visibility: hidden;
}

.category__btn .icon {
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.bar-title:hover {
    color: var(--bs-secondary);
}

.floatbar-body-menu a:hover {
    color: var(--bs-secondary);
    transition: 0.3s all;
}

.floatbar.hidden {
    position: fixed;
    z-index: 1000;
    width: 84px;
    padding-right: 4px;
    padding-left: 4px;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    overflow: scroll;
}

.floatbar.hidden::-webkit-scrollbar {

    width: 2px;

}

.floatbar.hidden .logo-wrapper {
    display: none;
}

.floatbar.hidden * {
    font-size: 0px;
}

.floatbar.hidden .floatbar-head {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px;

}

.floatbar.hidden .category__btn {
    display: none;
}

.floatbar.hidden .floatbar-body-menu a {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;

}

.floatbar.hidden .floatbar-body-menu a::after {
    right: -4px;
}

.floatbar.hidden .floatbar-body-menu a>.icon {
    margin-right: 0;
}

.floatbar.hidden .msg-counter {
    right: 10px;
    top: 30%;
}

.floatbar.hidden .floatbar-user {
    width: 52px;
    height: 53px;
    margin-right: auto;
    margin-left: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.floatbar.hidden .floatbar-user-img {
    width: 40px;
    height: 40px;
    margin-right: 0;
}

.floatbar.hidden .floatbar-user-img img {
    height: 100%;
    width: 100%;
}

.navbar .floatbar-toggle {
    display: none;
}

.main-nav .floatbar-toggle {
    display: none;
}

.main-nav {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}


.sort-bar {
    padding: 20px;
}

a.show-cat-btn i {
    font-size: 27px;

}

.dropdown::before {
    content: '';
    position: absolute;
    right: 6px;
    top: -10px;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent var(--bs-white)transparent;
}

.dropdown li:last-child a {
    border-width: 0;
}

.dropdown a {
    display: inline-block;
    width: 100%;
    font-weight: 500;
    font-size: 14px;
    line-height: 2.43;
    color: var(--bs-bodyTxt);
    text-align: left;
}

.dropdown a:hover {
    color: var(--bs-primary);
}

.badge-pending,
.badge-active,
.badge-trashed,
.badge-success,
.badge-disabled {
    padding: 1px;
    width: 85px;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.67;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: 100px;
    text-align: center;
}

/* Game css*/
:root {
    --bgcol: #37474F;
    --mcol0: #29B6F6;
    --mcol1: #2196F3;
    --mcol2: #1976D2;
    --txtcol0: #90A4AE;
    --txtcol1: #607D8B;
    --whitecol: #ECEFF1;
    --darkcol: #263238;
}


/* body{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding-top:15vh;
    background-color:var(--bgcol);
} */
.welcome-widget {
    width: 370px;
    margin-left: 122px;
    margin-top: 50px;
    padding: 10px;
}

.welcome-subtxt {
    width: 273px;
    height: 72px;
    line-height: 36px;
    margin-top: 25px;
}

.welcome-content {
    width: 370px;
    margin-top: 25px;

}

.welcome-banner {
    margin-top: 63px;
}

#puzzle_container {

    position: relative;
    /* width: 59vh; */
    width: auto;
    height: 50vh;


    background-color: var(--darkcol);
    border-radius: 1.35rem;
    border: 1px solid var(--mcol0);
    box-shadow: 0px 8px 0px var(--mcol0);
}

.top-bar {
    z-index: 998;
    background: var(--bs-white);
    position: fixed;
}

li.searchbar i {
    font-size: 14px;
    position: absolute;
    z-index: 999;
    margin: 12px;
    padding-left: 13px;
    color: var(--bs-primary);
    top: 12px;
}

.puzzle_block {
    position: absolute;
    left: 0;
    top: 0;
    width: 30.4%;
    height: 23.4%;
    background-color: var(--txtcol1);
    color: var(--whitecol);
    font-size: 7vh;
    font-weight: bold;
    text-align: center;
    padding-top: 0%;
    cursor: pointer;

    cursor: pointer;
    user-select: none;
    transition: left 0.3s, top 0.3s;
    border-radius: 1.35rem;
    margin-left: 15px;
    margin-top: 5px;
}

/*difficulty container*/
#difficulty_container {
    display: flex;
    flex-direction: row;

    /* width: 59vh; */
    width: auto;
    height: 10vh;


    background-color: var(--darkcol);
    border-radius: 1.35rem;
    margin-top: 22px
}

.difficulty_button {
    flex-grow: 1;
    background-color: inherit;
    color: var(--mcol2);
    text-align: center;
    font-size: 3vh;
    font-weight: bold;
    padding-top: 5%;
    margin: 4px;

    cursor: pointer;
    transition: font-size 0.3s;
    border-radius: 1.35rem;
}

.difficulty_button:hover {
    opacity: 0.8;
    font-size: 3.5vh;
}

.difficulty_button.active {
    background-color: inherit;
    color: var(--mcol0);
}

/* SLIDER CSS */
.carousel-control-next,
.carousel-control-prev {

    width: 5% !important;

}

.data-grid {
    max-width: 1230px;
    margin-left: -10px;
    /* margin-top: 20px; */
}

.breadcrumb {
    background: none;
    padding: 0px 16px !important;
}

.breadcrumb-item a {
    color: var(--bs-primary) !important;
    cursor: pointer;
}

.BreadCrumLink a {
    cursor: pointer;
    color: var(--bs-primary) !important;
}

.breadcrumb-item+.breadcrumb-item::before {
    content: "";
}

.role-dropdown {
    width: 100%;
    height: 24px;
    margin-top: 6px;

}

.role-dropdown-forms {
    margin-left: -100px;
    width: 100%;
    height: 24px;
    margin-top: 2px;

}

/* Inner content with left tab */
.inner-content {
    max-width: 100%;

}

.role-image {
    height: 24px;
    width: 24px;
    float: left;
    margin-right: 10px;
    border-radius: 50%;
}

.role-dropdown-item {
    padding-top: 2px;
    padding-bottom: 12px;
    padding-right: 10px;
}

.role-dropdown-item i {
    font-size: 16px;
    padding-left: 15px;
    color: var(--bs-secondary);
}

#dropdownMenu2:focus {
    outline: none;
    box-shadow: none;
}

.role-submenu.show {
    margin-left: -37px;
    width: 170px;
    height: 81px;
}

.form-title {
    padding-left: 12px;
    white-space: nowrap;
    margin-bottom: 0px;
    padding-top: 0px;
}


.horizontal-progress {
    margin-top: 20px;
    margin-left: -10px;
    width: 220px;
    height: 10px;
}


.progress-bar {
    background: var(--bs-secondary) !important;
}

.progress-level {
    position: absolute;
    margin-left: 226px;
    margin-top: -5px;
}

.user-no-img {
    font-size: 120px;
    color: var(--bs-user-no-img-bg);
}

.user-img-box {
    background-color: var(--bs-even-row-color);
    border-top-right-radius: 15px;
    border-top-left-radius: 15px; 
    max-width: 303px;
}

.user-img-box .h13 {
    color: var(--bs-bodyTxt-light);
}

.nav-pills .tab-link.active,
.tab-pills .show>.tab-link {
    color: var(--bs-bodyTxt);
    background-color: var(--bs-secondary);
    border-radius: 0px;
    font-weight: 700;
}

.nav-pills .tab-link {

    color: var(--bs-bodyTxt);
    text-decoration: none;
    border-bottom: 1px solid rgba(116, 116, 141, 0.3);
    cursor: pointer;
}

.left-tab-bg {
    background: var(--bs-odd-row-color);
    max-width: 303px;
    overflow-x: hidden;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.doc-remove {
    color: red;
    padding-left: 10px;
    cursor: pointer;
}

.emp-name {
    padding-top: 5px;
    padding-bottom: 5px;
}

.viewmore {
    padding-top: 10px;
    padding-bottom: 10px;
    color: var(--bs-primary);
    cursor: pointer;
}

.viewmore i {
    margin-left: 10px;
    margin-top: 5px;
}

.add-photo i {
    font-size: 15px;
    height: 32px;
    width: 32px;
    background: var(--bs-primary);
    color: var(--bs-white);
    border-radius: 32px;
    padding-top: 9px;
    padding-left: 1px;
    cursor: pointer !important;
}

.add-photo {
    margin-top: 80px;
    position: absolute;
    margin-left: 150px;
}

.breadcrumb-seperator {
    padding-right: 10px;
    padding-left: 10px;
    color: var(--bs-primary);
}

.offer-download a:hover {
    color: var(--secondary);
}

.role-action-modal {
    margin-top: 10%;

}

.offer-download {
    margin-left: -22px;
}

.role-content {
    width: 520px;
    height: 438px;
    border-radius: 8px;
}

.role-action-close {
    font-size: 71px;
    font-weight: 100;

    margin-right: 22px;
    color: var(--bs-primary);
}

.role-action-text {
    width: 422px;
    height: 24px;
    margin-left: 40px;
    margin-top: 15px;
}

.role-submit {
    padding-right: 75px;
    padding-left: 75px;
}

input.max-text-input {
    width: 220px;
    height: 56px;
    margin-left: 40px;
    margin-top: 32px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
    padding-left: 14px;

}

.modal-backdrop {
    background: var(--bs-bodyTxt);
}

.modal-backdrop.show {
    opacity: 0.8;
}

.tab-content {
    min-width: 900px;
    margin-left: -5px;
}

.notify2 .tab-content {
    min-width: unset !important;
}

.form-breadcrum {
    max-width: 1124px;
}

.tab-link {
    display: block;
    padding-top: 16px;
    padding-bottom: 12px;
    padding-left: 24px;
}

.tab-link i {
    margin-right: 22px;
}

.maxTextLink {
    display: inline-block;
    white-space: nowrap;
    max-width: 220px;
    text-overflow: ellipsis;
    overflow: hidden;
}


.user-img {
    height: 120px;
    width: 120px;
    border-radius: 65px;
    object-fit: cover;
}

.form-section-title {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    margin-top: 15px;
    margin-bottom: 25px;
}

.form-main-title {
    margin-bottom: 24px !important;
}

.bottom-buttons {
    margin-top: 20px;
}


.AeSToasterValidation {
    margin-top: 260px !important;
    width: 563px !important;
    max-width: 563px !important;

}

.AeSToasterValidation mat-dialog-container {
    z-index: 999;
    background: #EAA9A9 !important;
    border: 1px solid #F5753E;
    border-radius: 15px;
    overflow: hidden;
}

.AeSToasterValidation .tittle {
    margin-top: 10px;
    color: var(--bs-white) !important;
}

.AeSToasterValidation .mat-dialog-container {
    overflow: hidden !important;
}




.AeSToasterWarning {
    margin-top: 260px !important;
    width: 563px !important;
    max-width: 563px !important;

}

.AeSToasterWarning mat-dialog-container {
    z-index: 999;
    background: #EAA9A9 !important;
    border: 1px solid #F5753E;
    border-radius: 15px;
    overflow: hidden;
}

/* Validation Toastr */
.AeSToasterValidation .message {
    margin-top: 7px;
    font-family: 'OpenSans-Regular';
    margin-left: 0px;
    font-size: 16px;
    color: var(--bs-white) !important;
}

.AeSToasterValidation .tittle span {
    padding: 20px;
    margin-top: -34px;
    position: absolute;
    margin-left: -308px;
    font-size: 24px;
    font-family: 'OpenSans-Bold';
    color: var(--bs-white) !important;
}

.AeSToasterValidation .tittle mat-icon {
    padding-right: 325px;
    margin-top: -10px;
    position: relative;
    font-size: 28px;

}

.AeSToasterValidation .tittle mat-icon {
    color: var(--bs-white) !important;
}

.AeSToasterValidation .close {
    margin-top: -15px;
    color: var(--bs-white) !important;
    margin-right: -12px;
}

.AeSToasterValidation .close .mat-icon {
    color: var(--bs-white) !important;
    opacity: 1;
}

/* Success Toastr */


.AeSToasterSuccess .tittle span {
    margin-left: unset !important;
}

.AeSToasterSuccess .message {
    margin-top: 7px;
    font-family: 'OpenSans-Regular';
    margin-left: 0px;
    font-size: 16px;
    color: var(--bs-white) !important;
}

.AeSToasterSuccess .tittle span {
    padding: 20px;
    padding-left: 14px;
    top: -6px;
    position: relative;
    margin-left: -308px;
    font-size: 24px;
    font-family: 'OpenSans-Bold';
    color: var(--bs-white) !important;
}

.AeSToasterSuccess .tittle mat-icon {
    margin-top: -10px;
    position: relative;
    font-size: 28px;

}

.AeSToasterSuccess .tittle mat-icon {
    color: var(--bs-white) !important;
}

.AeSToasterSuccess .close {
    margin-top: -15px;
    color: var(--bs-white) !important;
    margin-right: -12px;
}

.AeSToasterSuccess .close .mat-icon {
    color: var(--bs-white) !important;
    opacity: 1;
}

.AeSToasterSuccess {
    margin-top: 260px !important;
    width: 563px !important;
    max-width: 563px !important;

}

.AeSToasterSuccess mat-dialog-container {
    z-index: 999;
    background: #bfe9a5 !important;
    border: 1px solid #509625 !important;
    /* border-radius: 15px; */
    overflow: hidden;
}

/* Warning toastr */

.AeSToasterWarning .message {
    margin-top: 7px;
    font-family: 'OpenSans-Regular';
    margin-left: 0px;
    font-size: 16px;
    color: var(--bs-white) !important;
}

.AeSToasterWarning .tittle span {
    padding: 20px;
    top: -5px;
    position: relative;
    margin-left: -308px;
    font-size: 24px;
    font-family: 'OpenSans-Bold';
    color: var(--bs-white) !important;
}

.AeSToasterWarning .tittle mat-icon {
    padding-right: 325px;
    margin-top: -10px;
    position: relative;
    font-size: 28px;

}

.AeSToasterWarning .tittle mat-icon {
    color: var(--bs-white) !important;
}

.AeSToasterWarning .close {
    margin-top: -15px;
    color: var(--bs-white) !important;
    margin-right: -12px;
}

.AeSToasterWarning .close .mat-icon {
    color: var(--bs-white) !important;
    opacity: 1;
}

.close {
    opacity: 1;
}

#overlay {
    position: fixed;
    /* Sit on top of the page content */
    display: none;
    /* Hidden by default */
    width: 100%;
    /* Full width (cover the whole page) */
    height: 100%;
    /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    /* Black background with opacity */
    z-index: 2;
    /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer;
    /* Add a pointer on hover */
}

.warn-toast {
    margin: auto;
    margin-top: 40%;
    box-sizing: border-box;

    position: absolute;
    width: 563px !important;
    height: 112px;
    /* Light green */
    z-index: 999;
    background: #F0B46D;
    /* success green */

    border: 1px solid #AECD9B;
    border-radius: 15px;
}

.toast-body {
    margin-top: 15px;
    margin-left: 24px;
    /* margin-bottom: 56px; */
    color: #fff;
    opacity: 0.9;
}

.secondary-button {
    color: var(--bs-primary) !important;
    min-width: 160px !important;
    height: 48px;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    border: 2px solid var(--bs-primary) !important;
    background: none !important;
}

.next-btn {

    min-width: 160px !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
}

input.form-field {
    width: 100%;
    height: 56px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
    padding-left: 14px;
}

select.form-field {
    box-sizing: border-box;
    width: 100%;
    height: 56px;
    border: 1px solid rgba(5, 5, 12, 0.3);
    border-radius: 4px;
    padding-left: 14px;
}

.form-check-input {
    width: 24px;
    height: 24px;
    margin-bottom: 20px;
}

.form-check-label {

    margin-left: 5px;
    margin-top: 6px;
}

.forget-pwd {
    margin-left: 100px;
}

#secret-question {
    display: none;
}

.remember-pwd {
    margin-left: 21px;
    margin-top: -26px;
}

.remember-check .mat-checkbox-inner-container {
    height: 15px;
    width: 15px;
}

.page-footer {
    width: auto;
}

.iframeContainerClass {
    display: block;
    /* margin-top: 64px; */
    padding-left: 75px;
    overflow-x: hidden;
    height: calc(100vh - 63px);


}

.close_sidenav{
    font-size: 24px;
    cursor: pointer;
    float: right;
    color: var(--bs-primary);
    width: 100%;
    text-align: right;
    background: var(--bs-white);
    position: sticky;
    top: -24px;
    right: 0;
    padding-top: 10px;
    padding-bottom: 12px;
}
 
.iframeContainerClass.FullHeightWidth {
    padding-left: 0px;
    margin-top: 0px !important;
    width: 100%
}


.iframeContainerClass1 {
    height: calc(100vh - 63px);
}

.iframeContainerClass3 {
    display: block;
    width: 100%;
    border: none;
    overflow-x: hidden;
    height: calc(116vh - 63px);
}

.iframeContainerClass2 {
    display: block;
    /* margin-top: 35px; */
    overflow-x: hidden;
    height: calc(100vh - 63px);
    width: calc(100% - 27px) !important;
}

#dashwrapper {
    background: var(--bs-white);
    max-width: 1366px;
    left: 1px;
    right: 1px;
    top: 1px;
    position: fixed;
    box-shadow: 0px 0px 0px 300px #F0F0F0;
    bottom: 0px;
    overflow: hidden;
    overflow-y: auto;
	z-index:1000;
	margin:auto;
}

#dashboardCompDisplay{
	scroll-behavior:smooth;
}

#wrapper-inner {
    background: var(--bs-white);


}

#wrapper-inner::-webkit-scrollbar {
    width: 0px !important;
}

.footer-fixed {
    position: fixed;
    z-index: 9999;
    max-width: 1366px;
    bottom: 0px;
    min-height: 86px;
    background: var(--bs-card-background);
    box-shadow: 0px -4px 4px rgb(219 219 238 / 40%);
}

.footer-btn-right {
    padding-top: 19px;
    padding-right: 31px;
}

.footer-btn-right-disable {
    padding-top: 19px;
    padding-left: 52px;
}

.footer-btn {
    padding-top: 19px;
    margin-left: 42px;

}

.footer-btn-left {
    padding-top: 19px;
    margin-left: 15px;
}

.submenu-container {
    margin-left: 5px;
    padding-bottom: 10px;
    /* margin-top: -25px; */
    min-height: 25px;
}

.submenu li a {
    color: var(--bs-primary);
    padding-right: 18px;
    padding-left: 12px;
}

.submenu li img {
    padding-right: 8px;
}

.submenu li {
    padding-left: 0px;
}

.attach {
    cursor: pointer;
    position: absolute;
    margin-left: -100px;
    ;
}

.attach2 {
    cursor: pointer;
    /* margin-left: -67px; */
    float: left;
    position: relative;
    width: auto;
    left: 438px;

}

.datagrid-add .clk-delete {
    position: relative;
    top: -27px;
    right: 180px;
}

.datagrid-add .AeSFilename {
    position: relative;
    top: 0px;
    right: 213px;
    max-width: 146px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-left: 127px;
}

.view-full {
    cursor: pointer;
    margin-left: -75px;
}

.view-profile {
    display: none;
}

.view-profile .h11 {
    font-size: 12px;
    font-family: 'OpenSans-Regular' !important;
    color: var(--bs-bodyTxt-light);
    padding-bottom: 4px;
}

.attach-label {
    position: absolute;
    margin-left: 0px;

}

.grid-filter {
    margin-top: -7px;
}

.calendar-control {
    color: var(--bs-bodyTxt);
    margin-left: -16px;
    margin-top: -21px;
}

.AeSProgressSpinnerText {
    top: -31px !important;
}

.half-width .AeSProgressSpinnerText {
    top: -35px !important;
}

.calendar-control .mat-select-min-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 347px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.calendar-control i {
    float: left;
    position: absolute;
    padding-left: 10px;
}

.calendar-control-date {
    color: var(--bs-bodyTxt);
    padding: 0px;
    margin-top: -4px;
    margin-left: -212px;
    font-size: 20px;
    font-family: 'Montserrat-Bold', Arial;

}

.calendar-dropdown {
    font-family: 'OpenSans-Regular';
    margin-top: -8px;
    width: 100%;
    height: 24px;
}

.calendar-dropdown {
    margin-left: -50px;
    padding-right: 23px;
    float: left;
    margin-top: -25px;
}

.calendar-dropdown .mat-select-arrow {
    margin-top: 20px;
    margin-right: 10px;
}

.calendar-control .mat-select-arrow {
    top: 12px;
}

.calendar-dropdown .mat-form-field-infix {
    width: 130px;
}

.top-right-links {
    margin-right: 100px !important;
}

.sheet-calendar {
    margin-left: -131px;
    float: left;
}

.sheet-approver {
    margin-left: -50px;
    padding-bottom: 10px;
    padding-top: 5px;
}

.calendar-dropdown i {
    margin-top: 6px;
    position: absolute;

}

.calendar-submenu.show {
    margin-left: 13px;
    width: 50%;
    height: 81px;
    margin-top: 120px;
}

.sheet-status {
    color: var(--bs-white);
    padding-top: 6px !important;
    margin-left: -23px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 300px;
    overflow: hidden;
    margin-top: 7px;
}

.left-accordin .mat-list-base .mat-list-item .mat-list-item-content,
.mat-list-base .mat-list-option .mat-list-item-content {
    padding-bottom: 48px !important;
}

.sheet-status2 {
    color: var(--bs-white);
    padding-top: 6px !important;
    margin-left: -23px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 300px;
    overflow: hidden;
    margin-top: -6px !important;
}

.approver-flow {
    margin-top: -24px;
    margin-top: 10px;
}

.approver-data {
    margin-left: -28px;
    margin-top: -19px;
    padding-bottom: 10px;
}

.calendar-control-2 .mat-select-arrow {

    margin-top: 23px
}

.status-approval {
    background-color: var(--bs-status-sent-approval);
}

.template1-progresstxt {
    padding-right: 90px;

}

.template2-progresstxt {
    padding-right: 60px;
    margin-top: 14px;
}

.progresstxt i {
    font-size: 16px;
}

.template1-progresstxt i {
    font-size: 16px;
    padding-left: 10px;
}

/* Template2 progressbar */
.template2-progress {
    width: 48px;
    height: 48px !important;
    float: right;
    line-height: 50px;
    background: none;
    /* margin: 10px; */
    box-shadow: none;
    position: relative;
    margin-top: 3px;


}

.template2-progress.template.weight {
    margin-top: -5px;
    margin-right: 126px;
}

.template2-progress:after {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 8px solid #F1F1F6;
    position: absolute;
    top: 0;
    left: 0;
}

.template2-progress>span {
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}

.template2-progress .template2-progress-left {
    left: 0;
}

.template2-progress .template2-progress-bar {
    width: 100%;
    height: 100%;
    background: none;
    border-width: 6px;
    border-style: solid;
    position: absolute;
    top: 0;
}

.template2-progress .template2-progress-left .template2-progress-bar {
    left: 100%;
    border-top-right-radius: 80px;
    border-bottom-right-radius: 80px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}

.template2-progress .template2-progress-right {
    right: 0;
}

.template2-progress .template2-progress-right .template2-progress-bar {
    left: -100%;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;
    animation: loading-1 1.8s linear forwards;
}

.template2-progress .template2-progress-value {
    width: 75%;
    height: 75%;
    border-radius: 50%;
    font-size: 12px;
    /* color: var(--bs-secondary); */
    line-height: 47px;
    text-align: center;
    position: absolute;
    top: 4%;
    left: 18%;
}

@keyframes prog {
    0% {
        stroke-dashoffset: 300px;
    }

    20% {
        stroke-dashoffset: 200px;
    }

    30% {
        stroke-dashoffset: 190px;
    }

    80% {
        stroke-dashoffset: 100px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes glow {
    100% {
        filter: drop-shadow(0 0 3px #ff7a59);
    }
}

.data-actions mat-icon {
    margin-top: -10px;
    color: var(--bs-primary);
}

.data-actions {
    /* margin-top: -4px; */
    /* padding-right: 10px; */
}

.template2-progress.weight .template2-progress-bar {
    border-color: var(--bs-template2-progressbar);
}

.template2-progress.weight .template2-progress-left .template2-progress-bar {
    animation: loading-2 1.5s linear forwards 1.8s;
}

@keyframes loading-1 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

@keyframes loading-2 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(144deg);
        transform: rotate(144deg);
    }
}

@keyframes loading-3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
    }
}

.approver {
    color: var(--bs-approver);
}

.left-tab-icon {
    float: right;
    font-size: 20px;
}

.main-counter {
    margin-left: 16px;
    margin-top: 15px;
}

.aesprogressactive.main-counter-box {

    border: 3px solid var(--bs-secondary);
}

.main-counter-box {
    margin-right: 24px;
    padding-top: 20px;
    border-radius: 15px;
    margin-top: 13px;
    margin-bottom: 10px;
    width: 160px;
    height: 120px;
    text-align: center;
    background: var(--bs-card-background);
    box-shadow: 0px 4px 16px #EAEAEA;
    border-radius: 15px;
    display: inline-block;
    float: left !important;
    transition: transform .2s;
    /* Animation */
}

.main-counter-box .active {

    border: 3px solid var(--bs-secondary);
}

.main-counter-box:hover {
    cursor: pointer;
    background: var(--bs-light-secondary);
}

/*.main-counter-box:hover .counter-number {
   
    color: var(--bs-white);
} */
/*
.main-counter-box:hover .TextField{
	color: var(--bs-white);
} */
.kpi-widget {
    margin-left: -35px;
}

.sub-title {
    padding-top: 40px;
    padding-bottom: 32px;
}

.datagrid-add {
    margin-right: -13px;
    font-family: 'OpenSans-Regular', Arial;
    margin-bottom: 16px;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    cursor: pointer;
    /* identical to box height, or 100% */

    text-align: right;

    /* Primary blue */

    color: var(--bs-primary);

}

.add-data {
    position: relative;
    top: 2px;
}

.dynamic-add-row {

    font-family: 'OpenSans-Regular', Arial;
    margin-bottom: 16px;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    cursor: pointer;
    text-align: right;
    color: var(--bs-primary);
    padding-top: 10px;
}

.container.main-content-section {
    margin-left: -4px;
    max-width: 100%;
}

.data-grid-head {
    background: var(--bs-odd-row-color);
    height: 56px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    margin-left: 8px;
    padding-left: 24px;
    padding-top: 18px;
    border-radius: 8px 8px 0px 0px;
}

.border-curve {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

.data-grid-zero {
    background: var(--bs-even-row-color);
    min-height: 52px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    margin-left: 8px;
    padding-left: 24px;
    padding-top: 15px
}

.data-grid-line {
    border-left: 2px solid rgb(230, 230, 230);
    height: 100;
}

.data-grid-one {
    background: var(--bs-odd-row-color);
    min-height: 52px;
    color: var(--bs-bodyTxt);
    max-width: 1311px;
    margin-left: 8px;
    padding-left: 24px;
    padding-top: 15px;
}

.grid-data-sub {
    padding-top: 5px;

}

span.icon.toggle {
    color: var(--bs-white);
}

.data-sorting {
    color: var(--bs-primary);
}

.data-sorting i {
    padding-right: 3px;
}

.popup-name {
    color: var(--bs-primary);
    padding-top: 0px;
    margin-left: -7px;

}

.data-name {
    color: var(--bs-primary) !important;
    margin-top: -16px;
    cursor: pointer;
}

.data-name {
    max-width: 170px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 14px;
}

.progresstxt i {
    padding-left: 10px;
    padding-right: 0px
}

.mat-radio-button {
    font-family: inherit !important;
}

.name-limit {

    max-width: 136px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.mail-name-limit {
    max-width: 350px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.gridname-Limit {
    max-width: 200px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.card-name-limit {
    max-width: 116px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.accordin-name-limit {
    position: absolute;
    max-width: 200px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: -12px !important;
}

.left-accordin .mat-list-item.mat-list-item.mat-focus-indicator.active {
    background: var(--bs-secondary);
}

.left-accordin .mat-list-single-selected-option,
.mat-list-single-selected-option:hover,
.mat-list-single-selected-option:focus {
    background: var(--bs-secondary) !important;
}

.left-accordin .mat-list-option:hover {
    background: var(--bs-secondary) !important;
}

.milestone-name-limit {
    position: absolute;
    max-width: 136px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-left: 37px;
}

.tracking-progress {
    width: 80px;
    height: 8px;
}

.progress-level-tracking {
    position: absolute;
    margin-left: 84px;
    margin-top: -2px;
}

.data-name-i {
    color: var(--bs-primary);
    display: none;

}

.data-name i {
    color: var(--bs-primary) !important;
    padding-right: 12px;
    margin-left: -12px;
    padding: 10px;
    margin-top: 11px;
}

.ChipApproved {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-chipapproved) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);


}
.ChipActive{
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-primary) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);
}

.ChipPending {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-chippending) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);

}


.ChipUpdation {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-light-primary);
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);

}

.ChipRejected {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-chiprejected) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);

}

.ChipDrafted {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-low-light-grey);
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-bodyTxt-light);

}

.ChipDeleted {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-disable-stat);
    border-radius: 34px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 3px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-white);
}

.BtnSubmit .mat-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
}

.BtnSubmitL .mat-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
}

.BtnSecond .mat-button {
    min-width: 160px;
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
}

.BtnSecond .mat-button:hover {
    opacity: 0.8;
}


.BtnSubmit .mat-button:hover {
    opacity: 0.8;
}

.BtnSubmit .mat-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}

.BtnSave .mat-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    max-width: 100%;

    border-radius: 54px !important;
    margin: auto !important;
    margin-left: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    margin-bottom: 30px !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilter .mat-button {
    border-radius: 100px;
    padding: 13px 32px;
    display: inline-flex;
    height: 40px;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilterTrans .mat-button {
    border-radius: 100px;
    padding: 13px 32px;
    display: inline-flex;
    height: 40px;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnDisable .mat-button {
    min-width: 160px;
    height: 40px !important;
    border-radius: 54px !important;
    cursor: none;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-disable-stat) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnSave .mat-button:hover {
    opacity: 0.8;
}

.BtnSave .mat-button:disabled {
    background-color: var(--bs-disable-stat) !important;
    padding-left: 32px;
    padding-right: 32px;
}

.BtnLogin .mat-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    min-width: 353px;
    max-width: 100%;

    border-radius: 54px !important;
    margin: 0 auto !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    font-weight: 700;
}

.BtnLogin .mat-button:hover {

    opacity: 0.8;
}

.BtnLogin {
    margin-top: 60px;
}

.BtnDelete .mat-button {
    min-width: 160px !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnDelete .mat-button:hover {
    opacity: 0.8;
}

.BtnDelete .mat-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}

.BtnNext .mat-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;

    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}


.BtnNext .mat-button:hover {
    opacity: 0.5;
}

.BtnNext .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnBack .mat-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;

    min-width: 160px;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;


}

.BtnBack .mat-button:hover {
    opacity: 0.5;
}

.BtnBack .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

/* Transparent button */
.BtnTrans .mat-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    max-width: 100%;

    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnTrans .mat-button:hover {
    opacity: 0.5;
}

.BtnTrans .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

/* BAckground filled Button */

.BtnFilled .mat-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilled .mat-button:hover {
    opacity: 0.8;
}

.BtnFilled .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnCancel .mat-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px !important;

    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    border: 1px solid !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnCancel .mat-button:hover {
    opacity: 0.5;
}

.BtnCancel .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnLoginCancel .mat-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    border: 1px solid var(--bs-primary) !important;
    color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold', Arial !important;
}

.BtnLoginCancel .mat-button:hover {
    opacity: 0.5;
}

.BtnLoginCancel .mat-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnNext-forgetpwd .mat-button {
    width: 100% !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 0px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
}

.popup-btn {
    margin-top: 70px;
    padding-bottom: 20px;
}


.AeSCheckbox .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,
.mat-checkbox-checked.mat-accent .mat-checkbox-background {
    background-color: var(--bs-primary) !important;

}

.dialog-close {
    top: -18px;
    float: right;
    text-align: right;
    left: 0px;
    position: absolute;
    z-index: 9999;
    width: 100%;
    color: var(--bs-bodyTxt) !important;
}

.mat-icon.mat-icon.notranslate.close-icon.mat-warn.material-icons {
    color: var(--bs-primary) !important;
}

.status-started i {
    color: var(--bs-disable-stat);
    padding-right: 5px;
}

.status-completed i {
    color: #509625;
    padding-right: 5px;
}

.status-completed-white i {
    color: var(--bs-white);
    padding-right: 5px;
}

.status-delayed {
    color: var(--bs-template2-progressbar);
    padding-right: 5px;
}

.status-error {
    color: var(--bs-error-red);
}

.status-error i {
    padding-right: 10px;
}

.status-ontrack {
    color: var(--bs-light-primary);
}

.status-ontrack i {
    padding-right: 5px;
}

.data-actions i {
    color: var(--bs-primary);
}

.data-grid-user-img {
    height: 40px !important;
    width: 40px !important;
    margin-top: -10px;
    padding-right: 4px;
}

.data-widget {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 48px;
    margin-left: 0px;
    background: var(--bs-odd-row-color) !important;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px 0px 0px 4px;
}

.data-widget-multi {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0px;
    background: var(--bs-odd-row-color) !important;
    border: 1px solid rgba(116, 116, 141, 0.3);
    /* border-radius: 4px 0px 0px 4px; */
    margin-bottom: 48px;
    border-bottom: 0px;
}

.bg-transparent {
    background-color: #ffffff !important;
}

.section-gap {
    margin-top: 48px;

}

.data-widget-inner {
    background: var(--bs-odd-row-color);
    border-radius: 4px 0px 0px 4px;
}

.data-widget-name {
    padding-top: 10px;
    padding-bottom: 5px;
    color: var(--bs-darkgrey) !important;

}

.data-widget-text {
    padding-bottom: 10px;
    color: var(--bs-bodyTxt);

}

.add-txt-link {
    color: var(--bs-primary);
}

.container.main-content-section {
    margin-left: -4px;
    max-width: 100%;
}

.mat-form-field-label {
    position: absolute;
    left: 0;
    font-size: 14px !important;
    font-family: 'OpenSans-Regular', Arial !important;
}

.mat-form-field {
    width: 100% !important;


}

.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {
    border-style: none !important;
    color: var(--bs-primary) !important;

}

.mat-form-field-label {
    color: var(--bs-bodyTxt) !important;
}



.mat-menu-item {
    line-height: 25px !important;
    height: 30px !important;
}

.mat-menu-panel {
    min-width: 127px !important;
    padding: 7px 16px 10px 10px;
}

.page-form-content {
    max-width: 969px;
    margin-left: 10px;

}

.mat-dialog-container {


    box-shadow: var(--bs-wrapper-card-shadow) !important;
    border-radius: 8px !important;
    /* min-height: 352px !important; */
}

.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
    border-color: var(--bs-primary) !important;
}

.mat-radio-button.mat-accent .mat-radio-inner-circle {
    background: var(--bs-primary) !important;
}

.comment-box .mat-radio-label {
    padding-right: 50px !important;
}

.mat-tab-group.mat-primary .mat-ink-bar,
.mat-tab-nav-bar.mat-primary .mat-ink-bar {
    background: var(--bs-primary) !important;
}

.mat-tab-label {
    color: var(--bs-primary) !important;
}

.content-accordin .mat-expansion-panel {
    border-bottom: 1px solid var(--bs-bodyTxt-light) !important;
    border-radius: 0px !important;
    padding: 28px 0px 28px 0px !important;
}

.content-accordin .mat-expansion-panel-header {
    padding-left: 0px !important;
}

.content-accordin .mat-expansion-panel-body {
    padding: 0px !important;
}

.left-accordin .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: none !important;
}

.content-accordin .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: none !important;
}

.content-accordin .mat-expansion-panel-header-title {
    color: var(--bs-bodyTxt) !important;
}

.left-accordin .mat-expansion-panel-header-title {
    color: var(--bs-bodyTxt) !important;
}

.left-accordin .mat-expansion-panel-header {
    background: var(--bs-even-row-color) !important;

}

.left-accordin .mat-expansion-panel-header.mat-expanded {
    height: 54px !important;
}

.left-accordin .mat-expansion-panel-body {

    padding: 0px 0px 7px;
}

.left-accordin .mat-list-base .mat-list-item,
.mat-list-base .mat-list-option {

    display: block;
    height: 80px !important;
    border-bottom: 1px solid var(--bs-bodyTxt-light);
    padding-bottom: 10px;
    background: var(--bs-odd-row-color);

}

.accordin-status {
    position: absolute;
    margin-left: -3px !important;
    margin-top: 17px !important;
}

.L1submenu.expanded a.mat-list-item .mat-list-item-content{
        padding-bottom: 10px !important;
    }

.mat-list-base .mat-list-item .mat-list-item-content,
.mat-list-base .mat-list-option .mat-list-item-content {

    padding-bottom: 24px !important;
}

span.l0menu-icon i {
    font-size: 24px;
    top: 6px;
    position: relative;
    padding: 30px 9px 29px 9px;
}

.l0menu-icon.isActive {
    color: var(--bs-secondary);
}


.l1menu-txt.isActive {
    color: var(--bs-secondary);
}

.left-accordin .mat-list-base .mat-list-item .mat-list-item-content,
.mat-list-base .mat-list-option .mat-list-item-content {
    padding-top: 19px;
}

.content-accordin .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover:not([aria-disabled=true]) {
    background: none;
}

.mat-icon {
    color: var(--bs-primary) !important;
}

.by {
    padding-left: 10px;
    margin-left: 10px;
    color: var(--bs-bodyTxt-light);

}

.mat-divider-small {
    height: 15px !important;
    margin-top: 4px !important;
    float: left !important;
    margin-right: 11px !important;
}

.data-widget-multi-noborder {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0px;
    /* margin-bottom: 48px; */
}

.data-widget-multi-withborder {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px 0px 0px 4px;
}

.data-widget-multi-highlight {
    width: 100%;
    background: var(--bs-odd-row-color);
    box-sizing: border-box;
    margin-left: 0px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-top: none;
    border-radius: 0px 0px 0px 4px;
}

.data-widget-section {
    margin-top: 15px;
    padding-bottom: 10px;
    color: var(--bs-bodyTxt);

}

.data-widget-edit {
    margin-top: 15px;
    font-size: 18px;
    color: var(--bs-bodyTxt);

}

.data-widget-edit.disable {
    margin-top: 15px;
    font-size: 18px;
    padding-left: 18px;
    color: var(--bs-disable-stat) !important;

}

/* Comments history Css */
.comment-wrapper .panel-body {
    max-height: 650px;
    overflow: auto;
}

.comment-wrapper .media-list .media img {
    width: 28px;
    height: 28px;
    margin-right: 13px;
}

.comment-wrapper .media-list .media {
    margin-bottom: 25px;
}

.comments-text {
    padding-top: 5px;
}

.comments-date {
    padding-top: 7px;
    color: var(--bs-bodyTxt-light);
}

.comment-box {
    background: var(--bs-odd-row-color);
    border-radius: 8px;
    padding-top: 20px;
    padding-left: 24px;
    padding-right: 24px;
}

.comment-box textarea {
    background: var(--bs-white);
}

.comment-wrapper {
    padding-left: 18px;
}

.mat-radio-persistent-ripple {
    background-color: var(--bs-primary) !important
}

.mat-radio-label-content {

    padding-right: 20px !important;
}

/* .accordin-list-menu .mat-list-item-content{
  display: block !important;
} */
/* .mat-checkbox-inner-container {

  width: 24px !important;
  height:24px !important;
}

::ng-deep .mat-form-field {
  font-size: 22px;
}
.mat-form-field-label {
  font-size: 16px !important;
  margin-top: -5px !important;
}
.mat-form-field-infix {
  height: 56px !important;
}

input.mat-input-element {

  font-size: 16px !important;
}
.mat-option-text {
  font-size: 16px !important;
}

.mat-select-value {
  font-size: 16px !important;
}
.mat-raised-button.mat-primary{
font-family: 'Montserrat-Regular',Arial !important;
}

.mat-form-field-appearance-fill .mat-form-field-flex {
    background-color: #fdfdfc !important;
}
.mat-form-field-outline-start {
  background:var(--bs-white);
}
.mat-form-field-outline-end {
  background: var(--bs-white);
}
.mat-form-field-appearance-outline {
  color: var(--bs-primary) !important;
}
.mat-form-field-appearance-outline .mat-form-field-wrapper {
  margin:0px !important;
}
button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {
  background-color: var(--bs-primary) !important;
} */
/* .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
  background:var(--bs-secondary) !important;
}

.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {
  background:var(--bs-secondary) !important;
}

.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {
  background:var(--bs-secondary) !important;
}
.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
  background:var(--bs-secondary) !important;

}
.mat-form-field-appearance-outline .mat-form-field-outline-thick {
  color:var(--bs-primary)!important;
}
.mat-form-field.mat-focused .mat-form-field-label
{
  color:var(--bs-primary)!important;

  padding-top: 2px;
} */
.languages-menu .mat-form-field-appearance-standard .mat-form-field-underline {
    display: none;
}

.noborderFormfield mat-form-field .mat-form-field-wrapper .mat-form-field-underline {
    display: none;
    /* display: none; */
}

.noborderFormfield mat-form-field .mat-form-field-wrapper .mat-form-field-underline {
    display: none;
    /* display: none; */
}

.noborderFormfield mat-form-field .mat-form-field-wrapper .mat-select-value-text {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px;
    font-weight: 700;
}

.languages-menu .noborderFormfield mat-form-field .mat-form-field-wrapper .mat-select-value-text {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
}

.mat-select-panel {
    margin-top: 28px !important;
}

.lang-icon {
    margin-top: 11px;
    padding-left: 8px;
    padding-right: 5px;
    font-size: 16px;
}

.lang-menu {
    margin-left: -10px;
    margin-top: -15px;
}

.lang-menu .mat-select-value {
    display: contents !important;
    max-width: 0;
    width: 100%;
    overflow: visible !important;
    text-overflow: none !important;
    white-space: nowrap;

}

.lang-menu .mat-select-arrow {

    margin-top: 14px !important;
    margin-left: 10px !important;
}

.lang-box {
    float: left;
    margin-left: 15px;
}

.Aesmenu .mat-select-value {
    display: contents !important;
    max-width: 0;
    width: 100%;
    overflow: visible !important;
    text-overflow: none !important;
    white-space: nowrap;

}

.no-border {
    border: none !important;
}

.mat-elevation-z4 {
    box-shadow: 1px 2px 8px #EAEAEA !important;
    border-radius: 0px 0px 8px 8px !important;
    color: var(--bs-bodyTxt-light) !important;
}

.mat-menu-item {
    color: var(--bs-bodyTxt-light) !important;
}

.mat-select-value {
    color: var(--bs-bodyTxt) !important;
}

.mat-menu-dash {
    float: right;
    padding-top: 18px;
}

.tooltip-inner {
    width: 127px;
    height: 160px;
    left: 159px;
    top: 344px;

    background: var(--bs-light-primary);
    border-radius: 8px;
}

.topbar .dropdown-list .profile-header {
    background-color: var(--bs-table-head);
    height: 86px;
}

.profile-menu {
    margin-right: 75px;
    min-width: 410px;
}

.profile-menu-left.disabled {
    opacity: 0.5;
    pointer-events: none;
}

.profile-menu a.dropdown-item.d-flex.align-items-center {

    padding-top: 1.8rem;
}

.profile-menu-user img {
    height: 50px;
    width: 50px;
    margin-left: 5px;
    top: 10px;
    position: relative;
}

.profile-menu-name {
    color: var(--bs-bodyTxt);
    margin-left: 2px;
    margin-top: 24px;
}

.profile-menu-name-switcher {
    color: var(--bs-bodyTxt);
    margin-left: 34px;
    margin-top: 18px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 200px;
}

.profile-menu-position {
    margin-top: 8px;
    margin-left: 34px;
    color: var(--bs-Widget-Duration);
}

.profile-menu-position-switcher {
    margin-top: 8px;
    margin-left: 2px;
    color: var(--bs-Widget-Duration);
}

.profile-menu-name-switcher-default {
    color: var(--bs-bodyTxt);
    margin-left: 5px;
    margin-top: 18px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 200px;
}


.profile-menu-position-default {
    margin-top: 8px;
    margin-left: 5px;
    color: var(--bs-Widget-Duration);
}

.profile-status input {
    height: 20px;
    width: 20px;
    margin-top: 5px;
    color: var(--bs-primary);
}

.profile-action {
    position: absolute;
    margin-right: -64px;
    text-align: right;
    width: 91%;
    margin-top: 18px;
    color: var(--bs-primary);
    padding-right: 10px;
}

.Aesmenu .mat-select-value {
    display: contents !important;
    max-width: 0;
    width: 100%;
    overflow: visible !important;
    text-overflow: none !important;
    white-space: nowrap;
}



.profile-menu a.dropdown-item.d-flex.align-items-center {
    padding-top: 17px !important;
    padding-left: 20px;
}

.topbar .dropdown-list .dropdown-item {
    white-space: normal;
    padding-top: 4px;
    padding-bottom: 4px;
}

.profile-menu .dropdown a:hover {
    color: var(--bs-primary);
}

.profile-menu .dropdown-item:hover,
.dropdown-item:focus {
    text-decoration: none;
}

.profile-menu .dropdown-item:hover {

    text-decoration: none;
    background-color: transparent !important;
}

.profile-menu .dropdown-item {
    padding: 0.25rem 35px !important;

}

.row.profile-menu-item {
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(116, 116, 141, 0.3);
    padding-top: 12px;
    width: 410px;

}

.profile-menu-edit-access {
    position: absolute;
    text-align: right;
    width: 100%;
    color: var(--bs-primary);
}

.dropdown-list.dropdown-menu.dalerts.dropdown-menu-right.shadow.animated--grow-in.show {
    height: 516px;
    padding-bottom: 20px;
}

.show-alerts {
    padding: 20px;
    position: absolute;
    color: var(--bs-primary);
    top: 90%;
    text-align: center;
    margin-left: 0px;
    padding-bottom: -24px;
    cursor: pointer;
    width: auto;
    /* z-index: 999; */
    background: var(--bs-white);
    width: 325px;
}

.show-alerts:hover {
    background-color: #e9ecef;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: none !important;
}


.profile-menu-btn {
    padding: 10px 35px 5px 35px;
}

.profile-menu-btn .mat-button {
    height: 40px !important;
}

.pad-l10 {
    padding-left: 10px;
}

.pad-l20 {
    padding-left: 20px;
}

.pad-l30 {
    padding-left: 30px;
}

.pad-l40 {
    padding-left: 40px;
}

.pad-l50 {
    padding-left: 50px;
}

.profile-menu-right {
    padding-left: 0px;
    color: var(--bs-bodyTxt);
}

.profile-menu-left {
    padding-bottom: 5p;
    padding-right: 0px;
    color: var(--bs-bodyTxt);
    cursor: pointer !important;
}

.profile-menu-left i {
    cursor: pointer;
}

.profile-menu-dark {
    color: var(--bs-black) !important;
}

.light-grey {
    color: var(--bs-darkgrey) !important;
    line-height: 20px;
}

.dark-grey {
    color: var(--bs-darkgrey) !important;
    line-height: 20px;
}

.datagrid-add aeslabel {
    cursor: pointer;
    position: relative;
    z-index: 998;
    font-weight: 700;
}

.profile-status {
    margin-left: 17px;
    margin-top: 14px;
    font-size: 20px;
    color: var(--bs-secondary) !important;
}


.mat-table thead {
    background: var(--bs-odd-row-color) !important;
    height: 56px !important;
    color: var(--bs-bodyTxt) !important;
    max-width: 1311px !important;
    margin-left: 8px !important;
    padding-left: 24px !important;
    padding-top: 18px !important;

}

.mat-header-cell {
    color: var(--bs-bodyTxt) !important;

}

.mat-table .mat-row:last-child {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.mat-row:nth-child(even) {
    background-color: var(--bs-even-row-color);
}

.mat-row:nth-child(odd) {
    background-color: var(--bs-odd-row-color);
}

tbody .mat-row:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

tbody .mat-row:nth-child(even) {
    background-color: var(--bs-odd-row-color);
}

table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 8px 8px 0px 0px !important;
}

td.mat-cell {
    border-bottom-style: none !important;
}

th.mat-header-cell {
    border-bottom-style: none !important;
}

.mat-select-arrow {
    color: var(--bs-primary) !important;
    position: relative;
}

th.mat-header-cell,
td.mat-cell,
td.mat-footer-cell {
    padding-left: 10px !important;
    /* padding-right: 10px !important; */
}

.actions-menu {
    padding-top: 16px;
    position: relative;
    /*height: 20px;*/
}

.mat-form-field-infix {
    width: auto !important;
}

.add-progress .SpinnerContainer {
    margin-top: -10px;
    margin-left: -51px;
}

.add-progresstxt .template2-progresstxt {
    padding-right: 69px;
    margin-top: 8px;
}

.primary-chip {
    padding: 10px 32px;
    min-width: 295px;
    height: 40px;
    background: var(--bs-primary);
    border-radius: 100px;
    color: var(--bs-white);
    text-align: center;
    cursor: pointer;
}

.primary-chip2 {
    padding: 10px 32px;
    width: 237px;
    height: 40px;
    background: var(--bs-primary);
    border-radius: 100px;
    color: var(--bs-white);
    text-align: center;
}

.mat-tab-label {
    height: 40px !important;
    border-top-left-radius: 5px;
    background: transparent;
    color: var(--bs-bodyTxt) !important;
    opacity: 6.6 !important;
    z-index: 9999;
    position: relative !important;
    min-width: 248px !important;
}

.mat-tab-label:before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 10;
    border-bottom: none !important;
    border-radius: 0.4em 0.4em 0 0 !;
    -webkit-transform: skewX(40deg) !important;
    transform: skewX(40deg) !important;
    transform-origin: bottom left;
    background: var(--bs-even-row-color);
    border-top-right-radius: 7px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom: 0px !important;
}

.mat-tab-label-active:before {
    background: var(--bs-secondary) !important;
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 10;
    border-bottom: none !important;
    border-radius: 0.4em 0.4em 0 0 !;
    -webkit-transform: skewX(40deg) !important;
    transform: skewX(40deg) !important;
    transform-origin: bottom left;

}

.mat-tab-label .mat-tab-label-content {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    z-index: 99;
    padding-right: 20px;
}

.mat-tab-nav-bar,
.mat-tab-header {
    border-bottom: 3px solid var(--bs-secondary) !important;
}

.mat-ink-bar {
    height: 0px !important;
}

.mat-tab-label-active {
    color: var(--bs-white) !important;
}

.mat-tab-label .cdk-mouse-focused {
    opacity: 0 !important;
}

.mat-ripple .mat-tab-label .mat-focus-indicator .mat-tab-label-active:focus {
    background-color: transparent !important;
}

.mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled) {
    background-color: none !important;
}

/* NO goals
.no-goals{
  max-width: 1260px;
  padding-top: 20px;
  background: #FDFDFD;
  border: 1px solid rgba(116, 116, 141, 0.3);
  border-radius: 15px;
  margin-top: 32px;
  }
  
   */
.mat-option {
    font-family: inherit;

}

.no-goal-inner {
    height: 280px;
    width: 350px;
    padding-top: 30px;
    background: url('../images/no-goals.png') no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.nogoals-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 58px;
    max-width: 211px;
    margin-left: -44px;

}

/* Need to do */

.needDo-inner {
    height: 320px;
    width: 350px;
    padding-top: 30px;
    background: url('../images/needDO.png') no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.needDo-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 90px;
    line-height: 55px;
    max-width: 211px;
    margin-left: -84px;
}

/* Need know */

.needKnow-inner {
    height: 320px;
    width: 350px;
    padding-top: 30px;
    background: url('../images/announcements.png') no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.needKnow-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 90px;
    line-height: 35px;
    max-width: 211px;
    margin-left: -45px;
    text-align: center;
}

/* No record */
.noRecord-inner {
    height: 290px;
    width: 350px;
    padding-top: 30px;
    background: url('../images/no-record.png') no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.noRecord-outer {
    max-width: 1272px;
    background: #FDFDFD;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 15px;
    margin-bottom: 10px;
}

.noRecord-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 137px;
    line-height: 40px;
    max-width: 100px;
    margin-left: 225px;
    text-align: center;
}


.mat-tab-label:focus {
    background: none !important;
}

.mat-ripple-element {
    transform: scale(0) !important;
}

.head-title {
    color: var(--bs-bodyTxt);
    margin-top: -24px;

}

.content-accordin .mat-expansion-panel {
    border-bottom: 1px solid #73738c4d !important;
}

.left-accordin .mat-list-base .mat-list-item,
.mat-list-base .mat-list-option {

    border-bottom: 1px solid #74748d4d !important;
}

th.mat-header-cell i {
    padding-left: 7px;
}

.mat-tab-body-content {
    overflow-x: hidden !important;
}

.mat-tab-header {
    margin-left: 12px;
    /* max-width: 1205px !important; */
}

.dropdown-item.odd {
    background: var(--bs-odd-row-color);
}

.dropdown-item.even {
    background: var(--bs-even-row-color);
}

.notify-time {
    color: var(--bs-light-grey);
}

.notify-text {
    max-width: 189px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer
}

.notify-menu {
    height: 400px;
    margin-right: 130px;
    width: 410px !important;
    margin-left: 45%;
    overflow: auto !important;
}

.show-notify {
    padding: 20px;
    position: absolute;
    color: var(--bs-primary);
    top: 87%;
    text-align: center;
    margin-left: 0px;
    padding-bottom: -24px;
    cursor: pointer;
    width: auto;
    /* z-index: 999; */
    background: var(--bs-white);
    width: 100%;
}

.show-notify:hover {
    background-color: #e9ecef;
}

.mat-expansion-panel-header-description,
.mat-expansion-indicator::after {
    color: var(--bs-primary) !important;
}

/* tr:nth-child(odd) {background-color: var(--bs-even-row-color);} */
.dash-t tr:nth-child(even) {
    background-color:var(--bs-odd-row-color);
}

.dash-t tr:nth-child(2n+1) {
    background-color: var(--bs-even-row-color);
}

.mat-menu-dash button {
    border: 0px;
    margin-right: 18px;
    background: transparent;
}

/* CALENDAR CSS */
.calendar-header {
    width: 100%;
    margin: auto;
}

.calender-table-top-header {
    background: transparent !important;
}

#cal .mat-button-wrapper {

    font-size: inherit !important;
    border: none !important;
}

#dateView {
    border: none !important;
    width: auto !important;
    color: var(--bs-bodyTxt) !important;
    padding-left: 4px;
    padding-right: 9px;
}

aesl2menulist {
    width: 100%;
    cursor: auto !important;
}

aesl2menulist .col.dynamic-buttons .float-right {
    float: left !important;

}

#cal .mat-raised-button span i {
    color: var(--bs-primary) !important;
}

.custom-control-description_in {
    color: var(--bs-primary) !important;
}

.refresh_btn {

    display: inline-block;
    cursor: pointer;
    font-size: 16px;
    color: #888;
    border: 1px solid #888;
    border-radius: 90px;
    padding: 3px 7px;
    background: #ffffff;
    color: var(--bs-primary) !important;
    border: 1px solid var(--bs-primary) !important;
    margin-left: 30px;

}

.table_calender th,
.table_calender td {
    border: solid 1px solid rgba(116, 116, 141, 0.3) !important;
    background: #FDFDFD !important;
}

.calender-day {
    color: var(--bs-bodyTxt) !important;
}

span.calender-day.h7.past-day {
    color: #B0B0B0 !important;
}

.calendar-cell .icons {
    height: 12px !important;
    width: 12px !important;
    border-radius: 50%;
    position: relative !important;
    /* margin-left: 88%; */
    float: right !important;
    bottom: -6px !important;
    top: 10px !important;
    left: 13px !important;
}

.calendar-cell {
    width: 175px !important;
    height: 82px;
    background: var(--bs-card-background);
}

.time-box {
    height: 50px;
    padding-top: 10px;
    vertical-align: middle;
}

.category_showing span {
    color: var(--bs-low-light-grey);
}

.mat-tab-label-content {
    font-family: 'OpenSans-Regular';
    font-size: 16px;
}

.color-infos {
    padding: 0px 0px !important;
    color: var(--bs-Widget-Duration) !important;
    border-radius: 3px;
    display: inline-block;
    line-height: 18px !important;
    border-radius: 4px;
}

.calendar-legend {
    margin-top: 16px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;
    /* padding-right: 18px; */
}

.calendar-legend i {
    padding-right: 8px;
}

ul.list-inline.calendar-legend li {
    padding-left: 8px;
}

popper-content.hover_box {
    color: var(--bs-white);
}

.a-present i {
    color: #509625;
}

.a-absent i {
    color: #E86161;
}

.a-leave i {
    color: #A220F6;
}

.a-permi i {
    color: #AECD9B;
}

.a-holi i {
    color: #54A5DD;
}

.a-event i {
    color: #FCD139;
}

.hover_box .ngxp__container {
    background-color: var(--bs-light-primary);
    z-index: 10000;
    display: block;
    border-radius: 5px !important;
    box-shadow: none !important;
    margin-right: 57px;
    border-color: unset;
}

.hover_box .ngxp__container:before {
    position: absolute;
    z-index: -1;
    content: "";
    right: calc(50% - 10px);
    top: -8px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent var(--bs-light-primary) transparent;
    transition-duration: 0.3s;
    transition-property: transform;
}

.hover_box .ngxp__arrow {
    display: none !important;
}

.hover_box .ngxp__container>.ngxp__arrow {
    border-color: var(--bs-light-primary);

}

.auto-search {
    position: absolute;
    background: #FDFDFD;
    box-shadow: 1px 2px 8px #EAEAEA;
    border-radius: 0px 0px 15px 15px;
    color: #ffffff;
    text-align: left;
    display: none;
    width: 520px;
    padding-left: 24px;
    padding-top: 24px;
    padding-bottom: 16px;
    color: var(--bs-bodyTxt);
}

.auto-search .img-profile {
    height: 30px !important;
    width: 30px !important;
    margin-top: 4px;
    position: relative;
}

.selected {
    width: 100%;
}

.srch-title {
    padding: 20px 20px 5px 20px;

}

.srch-position {
    margin-left: 40px;
    margin-top: -8px;
}

.srch-position-name {
    margin-left: 9px;
}

.srch-emp-code {
    padding-left: 5px;
}

.srch-item {
    padding-bottom: 0px;
}

.srch-item i {
    background: #f1f1f1 !important;
    height: 30px !important;
    width: 30px !important;
    text-align: center;
	align-content: center;
    border-radius: 50% !important;
    color: var(--bs-primary);
}

.srch-position-form {
    margin-left: 40px;
    margin-top: 3px;
}

.vl {
    height: auto;
    padding-right: 5px;
}

.srch-separator {
    margin-right: 20px;
    margin-left: 20px;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 1px solid rgba(116, 116, 141, 0.3);

}

.onbehalfRadioList {
    height: auto;
    display: grid;
}

.onbehalf-radioList {
    height: 59vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.onbehalfEmpimg {
    width: 24px !important;
    height: 24px !important;
    margin-right: -23px !important;
    margin-top: 7px !important;
}

.onbehalf .mat-icon {
    top: 6px;
    position: relative;
}

.role-dropdown-item {
    padding-right: 10px;
}

/* .onbehalf {
    float: right;
    cursor: pointer;
 

} */
.onbehalfclose {
    top: 0px;
    right: -45px;
}

.panelOnbehalfOf {
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
    position: absolute !important;
}

/* Advance Search */
.advance-grid-icon {
    font-size: 28px;
    padding-top: 6px;
    position: absolute;
    color: var(--bs-primary);
    cursor: pointer;

}

.advance-list-icon {
    font-size: 28px;
    padding-top: 6px;
    position: absolute;
    padding-left: 40px;
    color: var(--bs-primary);
    cursor: pointer;
}

.advance-filter button {
    background: var(--bs-primary);
    color: var(--bs-white);

}

.emp-radio-list {
    max-height: 250px;
    overflow-y: scroll;
}

.advance-filter {
    display: block;
    padding: 12px;
    box-shadow: 0px 0px 3px 0px #ccc;
}

.advance-search-icon {
    font-size: 24px;
    color: var(--bs-primary);
    float: right;
}

.clicker {
    cursor: pointer;
    color: var(--bs-primary);
}

.clicker:focus+.advance-filter {
    display: block !important;
}

.onbehalf-grid-container .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: none !important;
}

.onbehalf-grid-container .mat-expansion-panel-body {
    padding: 0px 6px 2px !important;
}

.advance-srch-btn:hover {
    background: none !important;
}


.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb {
    background-color: var(--bs-secondary) !important;
}

.mat-slide-toggle.mat-checked .mat-slide-toggle-bar {
    background-color: var(--bs-light-secondary) !important;
}

.onbehalf-grid-container .mat-expansion-panel-header {
    position: relative;
    margin-left: 24px !important;
    padding-top: 25px !important;
    padding: 0 0px;

}

.onbehalf-grid-container .mat-expansion-panel-header i {
    margin-left: 20px;
}

.onbehalf-grid-container .mat-expansion-panel-header-title {
    margin-right: 0px !important;
}

.cxo {
    margin-top: -48px;
    margin-left: 25px;
    padding-bottom: 47px;
}

/* Nov 3 added */
.play-btn {
    padding: 12px;
    width: 179px;
    /* background: transparent; */
    color: #fff;
    border: 2px solid var(--bs-white);
    margin-top: 42%;
    /* margin-left: 52%; */
    float: right;
    font-size: 28px;
    border-radius: 27px;
    background: transparent;
    font-weight: 700;
    margin-right: 33px;
}

.wrapper-changepwd {
    margin-top: 208px;
    margin: auto;
    width: 30%;
}

.login-bg {
    /*height: 100vh; */
    max-width: 40%;
}

.change-pwd {
    margin-top: 20px;
}

.change-pwd-btn {
    padding-top: 128px;

}

ul.pwd-desc {
    line-height: 20px;
}

.popup-logo {
    height: 50px;
    padding-bottom: 10px;
}

.container.main-content-section-pims {
    margin-left: -4px;
    max-width: 1276px;
}

span#CalendarCell {
    text-align: center !important;

}

#CalendarCell {
    z-index: 99;
    height: 72px;
    margin-top: -36px;
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

/* Moodexpress css */

.rating-wrapper {
    max-width: 400px;
    margin: auto;
    background: #fff;
    padding: 1em;
    border-radius: 3px;
    margin-bottom: 24px;
}

.rating-wrapper .rating-label {
    text-align: center;
    font-weight: 700;
    display: block;
}

.rating-wrapper .ratingItemList {
    margin: auto;
    display: flex;
    justify-content: space-between;
    padding: 1em 0;
}

.rating-wrapper input.rating {
    display: none;
}

.rating-wrapper label.rating {
    padding: 5px 3px;
    font-size: 14px;
    opacity: 0.7;
    cursor: pointer;
}

.rating-wrapper label.rating:hover {

    transform: scale(1.1);
    transition: 100ms ease;
}

.rating-wrapper input.rating:checked+label.rating {
    filter: grayscale(0);
    opacity: 1;
    transform: scale(1.1);
}

.feedback {
    width: 100%;
    display: block;
}

.feedback textarea,
.feedback input {
    max-width: 300px;
    width: 100%;
    display: block;
    margin: 0.5em auto;
    padding: 0.5em;

    border: 1px solid #d2d3d8;
    border-radius: 3px;
}

.feedback textarea:focus,
.feedback textarea:active,
.feedback input:focus,
.feedback input:active {
    border-color: #3870c4;
    box-shadow: 0px 0px 1px 1px #3870c4;
    transition: 100ms;
}

.feedback textarea {
    height: 100px;
}

.feedback button {
    margin: 1em auto;
    display: table;
    text-align: center;
}

.disputelab_logo {
    width: 140px;
    position: absolute;
    top: 1em;
    left: 50%;
    margin-left: -70px;
}


button.not-disabled {
    color: white;
    background-color: #3870c4;
    text-shadow: 0px 1px 1px #214375;
    cursor: pointer;
}

button.not-disabled:hover {
    background-color: #2d599c;
    transition: 100ms;
}

.smile-card {
    width: 150px;
    margin-right: 10px !important;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    box-shadow: 0px 5px 15px rgb(0 0 0 / 10%);
}

label.rating i {
    font-size: 50px;
    padding: 6px;
}

.sad-smile:hover {
    color: #c79f57 !important;
}

.happy-smile:hover {
    color: #f5e068 !important;
}

.ok-smile:hover {
    color: #be9bff !important;
}

.sad-smile.selected {
    color: #c79f57 !important;
}

.happy-smile.selected {
    color: #f5e068 !important;
}

.ok-smile.selected {
    color: #be9bff !important;
}


.half-width .SpinnerContainer {
    margin-left: 0px !important;
    margin-top: -5px;
    position: absolute;
}

.half-width .template2-progresstxt {

    left: 74px;
    position: relative;
    margin-top: 14px;
}

.half-width .template2-progresstxt i {
    padding-left: 5px;
}

/* Birthday wish css */
.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .05);
}

.wish-link {
    padding-left: 20px;
    font-weight: bold;
    color: var(--bs-primary);
    cursor: pointer;
}

.wish-link i {
    padding-left: 10px;
}

.wish-list {
    height: 420px;
    overflow: auto;
}

.wish-profile img {
    border-radius: 50%;
    height: 100px;
}

.wishlist-option {
    padding-top: 20px;
}

.wishlist-option .mat-checkbox-layout .mat-checkbox-label {
    padding-right: 20px;
}

.wishlist-option .mat-checkbox-inner-container {
    width: 24px;
    height: 24px;
}

.mat-checkbox-frame {
    border-color: var(--bs-primary);
}

.wish-mailbox {
    padding-top: 20px;
    box-shadow: 2px 2px 8px 0px #ccc;
}

.wish-label {
    padding-right: 10px;
    color: var(--bs-light-grey);
}

.att_color_absent i {

    color: #FF0000;
}

.att_color_leaves i {

    color: #0000ff;
}

.att_color_present i {

    color: #006400;
}

.att_color_holiday i {

    color: #ffbf00;
}

.att_color_weaklyOff i {

    color: #00bfff;
}

.att_color_mulitple_events i {

    color: #CBCD3E;
}

/* Days Color */

.att_color_absent_legend {
    background: #FF0000;
}

.att_color_leaves_legend {

    background: #0000ff;
}

.att_color_present_legend {

    background: #006400;
}

.att_color_holiday_legend {

    background: #ffbf00;
}

.att_color_weaklyOff_legend {

    background: #00bfff;
}

.att_color_mulitple_events_legend {

    background: #CBCD3E;
}

.hover-date {
    margin-left: -20px !important;
    color: var(--bs-white);
}

td.today-selector {
    background: var(--bs-light-secondary) !important;

}

span.show-time.h12 {
    position: relative;
    margin-left: -15px;
}

.today-link {
    position: relative;
    top: 5px;
    right: 18px;
}

.calendar-header .btn.focus,
.btn:focus {

    box-shadow: none !important;
}

.day-selector {
    color: var(--bs-primary);
    cursor: pointer;
    padding-right: 4px;
    position: relative;
    top: -2px;
}

.cal-refresh-link {
    position: relative;
    top: 0px;
}

.dynamic-approvals {
    max-height: 600px;
    overflow-x: hidden;
    overflow-y: auto;
}

.dynamic-table textarea {
    min-height: 16px !important;
    /* max-height: 50px; 
    height: 16px !important;
	resize:both !important;*/
}

/* .mat-table thead { */
    /* background: var(--bs-odd-row-color) !important; */
/* } */

/* .mat-table thead { */
    /* background: var(--bs-odd-row-color) !important; */
/* } */

.mat-table thead th:first-child {
    border-top-left-radius: 8px !important;
}

.mat-table thead th:last-child {
    border-top-right-radius: 8px !important;
}

.mat-paginator-page-size-label {
    margin: 0 4px;
    min-width: 100px !important;
    white-space: nowrap !important;
}

.mat-paginator-page-size-select {
    margin: 6px 4px 0 4px !important;
    min-width: 56px !important;
}

.l2-menu-link {
    color: var(--bs-primary) !important;
    cursor: pointer;
}

.l2-menu-link span {
    font-size: 16px;
    font-weight: bold;
    line-height: 30px;
}

.submenu-container .list-inline-item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 10px;
    width: 2px;
    height: 15px;
    background: #74748d4d;
}

button.cal-nav.btn.btn {
    position: relative;
    top: -2px;
    color: var(--bs-primary);
    right: 4px;

}

.show-time .mat-checkbox-layout {
    padding-top: 6px;
}

.calendar-dots {
    padding-right: 13px;
    margin-top: -42px;
}

.row .horizontal-cards:nth-child(even) {
    background: var(--bs-even-row-color);
    margin-bottom: 2px;
    border-radius: 8px 8px 0px 0px;
    padding: 12px 0px 12px 0px;
}

.row .horizontal-cards:nth-child(odd) {
    background: var(--bs-odd-row-color);
    margin-bottom: 2px;
    padding: 16px 0px 16px 0px;
}

.row .horizontal-cards:first-child {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.row .horizontal-cards:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

.horizontal-cards i {
    margin-left: 20px;
    font-size: 18px;
    color: var(--bs-primary) !important;
    cursor: pointer;
}

.profile-widget {
    background: var(--bs-profile-bg);
    padding-bottom: 20px;
    border-radius: 10px;
    margin-bottom: 20px;
    /* min-height: 219px; */
}

.profile-widget2 {
    background: var(--bs-profile-bg);
    max-width: 403px;
    padding-bottom: 20px;
    border-radius: 15px 15px 15px 15px;
    margin-bottom: 20px;
    min-height: 175px;
}

.wish-option-list {
    margin-top: 88px;
}

.profile-details {
    background: var(--bs-left-tab-bg);
}

.profile-details th,
td {
    border-top: 0px !important;
}

.mat-dialog-container {

    color: var(--bs-bodyTxt) !important;
}

.profile-title {
    padding-top: 5px;
    padding-bottom: 5px;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: var(--bs-even-row-color);
}

.submenu .expanded {
    background: var(--bs-light-primary);
}


.cdk-overlay-pane.mat-tooltip-panel .mat-tooltip {
    color: var(--bs-white);
    position: relative;
    background-color: var(--bs-light-primary);
    border-radius: 4px;
    height: auto;
    font-size: 15px;
    padding-top: 5px;
    z-index: 1000;
    left: -14px;
    max-width: 800px !important;
}

.notify-no-record {
    height: 306px;
    color: var(--bs-bodyTxt);
    width: 293px;
    padding-top: 38px;
    left: 0px;
    top: 30px;
    position: relative;
    background: url(../images/no-record.png) no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-size: contain;
    margin: auto;
}

.notify-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 53px;
    line-height: 35px;
    max-width: 211px;
    margin-left: -68px;
    text-align: center;
}

.main-sidenav .menu-button {
    transition: 300ms ease-in-out;
    transform: rotate(0deg);
}

.main-sidenav .menu-button.rotated {
    transform: rotate(180deg);
}

.L1submenu .expanded {
    transform: scaleY(1);
}

.L1submenu.expanded:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    cursor: pointer;
}

.mat-nav-list .mat-list-item:hover {
    background: none !important;
    text-decoration: none;
}

.L1submenu {
    overflow-y: hidden;
    transition: transform 300ms ease;
    transform: scaleY(0);
    transform-origin: top;
    padding-left: 65px;
    display: none;
}

.L1submenu a.mat-list-item.mat-focus-indicator {
    padding-bottom: 0px !important;
    height: 35px !important;
}

.main-sidenav .mat-list-base .mat-icon {
    color: #fff !important;
    margin-top: 10px;
    vertical-align: middle;
    font-size: 28px;
    height: auto;
    width: auto;
}

.mat-list-item,
.mat-list-option {
    font-family: inherit;
}

.l1menu-txt {
    margin-top: 18px;
    margin-left: 8px;
    margin-right: 15px;
}

.main-sidenav .mat-list-base {
    min-width: 84px;
    margin-top: 10px;
}

.main-sidenav.mat-drawer.mat-drawer-side {
    background: var(--bs-primary) !important;
    position: fixed;
    min-width: 84px;
    z-index: 999;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    top: 16px;
    height: calc(100% - 30px);

}

.main-sidenav .mat-nav-list .mat-list-item {
    color: #fff !important;
    padding-top: 8px;
    margin-top: 10px;
    cursor: pointer !important;
	height: 46px;

}
.main-sidenav .mat-nav-list .mat-list-item:first-child{
  padding-top:0px;  
  margin-top:8px;
}

.mat-list-item.mat-list-item.active mat-icon {
    color: var(--bs-secondary) !important;
}

.main-sidenav .mat-list-base .mat-list-item .mat-list-icon,
.mat-list-base .mat-list-option .mat-list-icon {
    padding: 8px !important;
    cursor: pointer !important;
}

.main-sidenav .main.nav .mat-list-item-content {
    padding-bottom: 18px !important;
    width: 356px;
}

.main-sidenav .mat-list-base .mat-list-item.mat-list-item-with-avatar,
.mat-list-base .mat-list-option.mat-list-item-with-avatar {
    height: 50px !important;
}

.main-sidenav .mat-list-base .mat-list-item .mat-list-item-ripple,
.mat-list-base .mat-list-option .mat-list-item-ripple {
    cursor: pointer !important;
}

.L1submenu.expanded {
    transform: scaleY(1);
    background: var(--bs-light-primary) !important;
    display: block !important;
}

.submenu-arrow {
    padding: 8px 13px 9px 8px;
    position: absolute;
    top: 0px;
    right: 0px;
}

.submenu-arrow i {
    font-size: 11px;
}

.mat-sidenav .mat-tooltip-panel .mat-tooltip {
    color: pink;
    background-color: white;
    border: 1px solid var(--bs-light-primary);
    border-radius: 3px;
    font-size: 15px;
    padding: 10px;
    width: 100%;
}

.mat-sidenav .mat-tooltip-panel:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    display: block;
    border-color: transparent var(--bs-light-primary);
}

.auto-srch-panel-height .mat-option {
    height: 100% !important;
    /*padding-top: 8px !important; */
}

.auto-srch-panel-height {
    max-height: 550px !important;
    height: 100%;
    width: 511px !important;
    left: 10px;
    box-sizing: none;
    box-shadow: 1px 2px 8px #eaeaea !important;
    border-radius: 0px 0px 15px 15px;
    background: var(--bs-card-background);
}

.auto-srch-panel-height .mat-option:hover {
    background: var(--bs-even-row-color);
}

.auto-srch-img {
    height: 30px !important;
    width: 30px !important;
    margin-top: 4px;
    position: relative;
}

.search-icon {
    position: relative;
    right: 32px;
    top: 8px;
    width: 24px;
    height: 24px;
    font-size: 24px;
    cursor: pointer;
}

.auto-srch .mat-form-field-appearance-outline .mat-form-field-outline {
    display: none !important;
}

.auto-srch .mat-form-field-appearance-outline .mat-form-field-infix {
    padding: 0px !important;
}

.auto-srch .mat-form-field-appearance-outline .mat-form-field-wrapper {
    margin: opx !important
}

.auto-srch .mat-form-field-wrapper {
    margin: 0 !important;
    padding: 0 !important;
}

.mandatorystar {
    color: red;
    position: relative;

}

.field-mandatory {
    color: red;
}

.exit-widget {
    margin-left: 5px;
    padding-top: 18%;
    max-width: 40%;
}

.exitimage {
    position: fixed;
    bottom: 0px;
    left: 40%;
}

#notify {
    display: none;
    position: absolute;
    left: 52%;
    float: right;
    min-width: 500px;
    max-height: 495px;
}

.notify-tab .tab-content {
    margin: auto !important;
    max-height: 430px;

}


.notify-tab .nav-item .nav-link {
    text-align: center;
    height: 40px !important;
    min-width: 240px;
    display: block;
}

.notify-tab .nav-tabs {
    padding-top: 10px;
    padding-left: 10px;
    cursor: pointer;
}

.notify-tab .nav-tabs .nav-link.active {
    color: var(--bs-white) !important;
    background: var(--bs-primary) !important;
}

.notify-tab .nav-tabs .nav-link {
    border-top-left-radius: 2.25rem;
    border-top-right-radius: 6.25rem;
}

.notify-tab .nav-tabs .nav-link.active:after {
    border-bottom: 10px solid #e7e7e7;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 28px;
    width: 0;
}

.notify-tab .tab-content {
    margin: auto !important;
    max-height: 430px;

}


.notify-tab .nav-item .nav-link {
    text-align: center;
    height: 40px !important;
    min-width: 240px;
    display: block;
}

.notify-tab .nav-tabs {
    padding-top: 10px;
    padding-left: 10px;
    cursor: pointer;
}

.notify-tab .nav-tabs .nav-link.active {
    color: var(--bs-white) !important;
    background: var(--bs-primary) !important;
}

.notify-tab .nav-tabs .nav-link {
    border-top-left-radius: 2.25rem;
    border-top-right-radius: 6.25rem;
}

.notify-tab .nav-tabs .nav-link.active:after {
    border-bottom: 10px solid #e7e7e7;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 28px;
    width: 0;
}

.mat-header-row,
.mat-table-sticky {
    background: var(--bs-odd-row-color);
    border-radius: 8px 8px 0px 0px !important;
}

.ceo-popup .mat-dialog-container {
    /* background: url(assets/themes/default/images/model-ceo.jpg) !important;  */
    background-size: cover !important;
    background-repeat: no-repeat !important;

}

.popup-message {
    background-color: #fff;
    top: 86%;
    width: 980px;
    right: 193px;
    height: 40px;
    position: absolute;
}

.popup-txt {
    line-height: 26px;
    height: 264px;
    overflow: auto;
}

.mat-row,
.mat-header-row,
.mat-footer-row {
    border-bottom-width: 0px;
}

.AeSGridCheckboxHeader,
.AeSGridCheckboxItem {
    max-width: 50px;
}

.AeSGridMoreOptionsHeader,
.AeSGridMoreOptionsItem {
    max-width: 100px;
    text-align: grid;
}

.popover__title {
    font-size: 24px;
    line-height: 36px;
    text-decoration: none;
    color: rgb(228, 68, 68);
    text-align: center;
    padding: 15px 0;
}

.popover__wrapper {
    position: relative;
    margin-top: 1.5rem;
    display: inline-block;
}

.popover__content {
    opacity: 0;
    visibility: hidden;
    position: relative;
    transform: translate(0, 10px);
    background: var(--bs-primary);
    padding: 8px 9px 8px 8px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    width: 300px;
    border-radius: 10px;
    z-index: 1000;

}

.popover__content .mat-form-field-appearance-outline .mat-form-field-outline-start {
    background-color: white !important;
}

.ppopover__content .mat-form-field-appearance-outline .mat-form-field-outline-gap {
    background-color: white !important;
}

.popover__content .mat-form-field-appearance-outline .mat-form-field-outline-end {
    background-color: white !important;
}

.popover__content .mat-form-field mat-label {
    background-color: rgba(255, 255, 255, 0.9);
}

.popover__content .mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-form-field-flex:hover .mat-form-field-outline {
    opacity: 1 !important;
}

.popover__content:before {
    position: absolute;
    z-index: -1;
    content: "";
    right: calc(50% - 10px);
    top: -8px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent var(--bs-primary) transparent;
    transition-duration: 0.3s;
    transition-property: transform;
}

.popover__wrapper:hover .popover__content {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(0, -20px);
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
}

.popover__message {
    text-align: left;
    color: var(--bs-white);
}

.popover__title2 {
    font-size: 24px;
    line-height: 36px;
    text-decoration: none;
    color: var(--bs-bodyTxt);
    text-align: center;
    padding: 15px 0;
}

.popover__wrapper2 {
    position: relative;
    /* margin-top: 1.5rem; */
    /* display: inline-block; */
}

.popover__content2 {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    transform: translate(0, 10px);
    background: var(--bs-secondary);
    /* padding: 0px 8px 8px 8px; */
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 26%);
    width: 215px;
    border-radius: 10px;
    left: -75px;
    height: 40px;
}

.popover__content2:before {
    position: absolute;
    z-index: -1;
    content: "";
    right: calc(50% - 10px);
    top: -8px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent var(--bs-bodyTxt) transparent;
    transition-duration: 0.3s;
    transition-property: transform;
}

.popover__wrapper2:hover .popover__content2 {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(0, -20px);
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
}

.popover__message2 {
    text-align: center;
    color: var(--bs-bodyTxt);
    margin-top: 10px;
}

/*POPOVER 2 END */

/* Chat css */

.chat {
    width: 440px;
    height: 457px;
    float: left;
    background: var(--bs-white);
    border-radius: 15px 15px 0px 0px;
    color: #434651;
}

.chat .chat-header {
    padding: 10px;
    background: var(--bs-secondary);
    border-radius: 15px 15px 0px 0px;
}

.chat .chat-header img {
    float: left;
}

.chat .chat-header .chat-about {
    float: left;
    padding-left: 10px;
    margin-top: 6px;
}

.chat .chat-header .chat-with {
    font-weight: bold;
    font-size: 16px;
}

.chat .chat-header .chat-num-messages {
    padding: 6px 0px 6px 0px !important;
}

.chat .chat-header i {
    float: right;
    color: var(--bs-primary) !important;
    cursor: pointer;
    font-size: 20px;
    margin-top: 3px;
    padding-right: 10px;
}

.chat .chat-history {
    padding: 0px 16px 20px;
    border-bottom: 2px solid white;
    overflow-y: scroll;
    height: 457px;
    background: var(--bs-white);
    display: flex;
    flex-direction: column-reverse;
    overflow-x: hidden;
}

.chat-history .chat-image {
    position: relative;
    top: 57px;
    right: 10px;
}

.chat-history .chat-attach {
    position: relative;
    top: 12px;
    left: 20px;
}

.chat .chat-history .message-data {
    margin-bottom: 15px;
}

.chat .chat-history .message-data-time {
    color: var(--bs-bodyTxt-light);
    padding-left: 6px;
    padding-bottom: 6px;
}

.chat .chat-history .message {
    padding: 0px 12px;
    padding-top: 6px;
    line-height: 26px;
    font-size: 16px;

    margin-bottom: 20px;
    width: 90%;
    position: relative;
}


.chat .chat-history .my-message {
    background: var(--bs-primary-bg);
    width: 250px;
    border-radius: 0px 12px 12px 12px;
}

.chat .chat-history .other-message {
    background: var(--bs-primary-bg);
    border-radius: 12px 0px 12px 12px;
}

.chat .chat-message {
    background: var(--bs-secondary);
}

.chat .chat-message .box {
    width: 356px !important;
    border: none;
    padding: 5px 10px 2px 12px;
    margin-top: 9px;
    margin-bottom: 14px;
    margin-left: 12px;
    border-radius: 50px;
    resize: none;
    height: 44px;
    background: #fff;
}

.box .mat-form-field-appearance-outline .mat-form-field-outline {

    color: transparent;
}

.chat .chat-message .fa-file-o,
.chat .chat-message .fa-file-image-o {
    font-size: 16px;
    color: gray;
    cursor: pointer;
}

.chat .chat-message button {
    float: right;
    color: #94c2ed;
    font-size: 16px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    font-weight: bold;
    background: #f2f5f8;
}

.chat .chat-message button:hover {
    color: #75b1e8;
}

.online,
.offline,
.me {
    margin-right: 3px;
    font-size: 10px;
}

.chat-online {
    color: #86bb71;
}

.chat-offline {
    color: #e38968;
}

.chat-image {
    height: 50px;
    width: 50px;
    border-radius: 50%;
}

.chat-image-md {
    float: right;
    position: relative;
    right: 100px;
    top: 10px;
}

.chat-attach-md {
    position: relative;
    float: right;
    top: 15px;
    right: 50px;
}

.chat-send {
    font-size: 22px;
    text-align: center;
    height: 40px;
    width: 40px;
    border: 1px solid var(--bs-primary);
    border-radius: 50%;
    margin-top: 12px;
    position: absolute;
    margin-left: 16px;
    background: var(--bs-primary);
    cursor: pointer;
}

.chat-send i {
    padding-top: 8px;
    color: var(--bs-white);
}

.divider {
    display: flex;
}

.divider:before,
.divider:after {
    content: "";
    flex: 1;
}

.line {
    align-items: center;
    margin: 1em -1em;
}

.line:before,
.line:after {
    height: 1px;
    margin: 0 1em;
}

.one-line:before,
.one-line:after {
    background: black;
}

.razor:before,
.razor:after {
    box-shadow: 0 0.5px 0 rgb(116 116 141 / 30%);
}

.double-razor:before,
.double-razor:after {
    height: 3px;
    box-shadow: 0 -0.5px 0 black, 0 0.5px 0 black;
    border-width: 0;
}

.glow:before,
.glow:after {
    height: 6px;
    -webkit-filter: blur(5px);
    border-radius: 5px;
}

.glow:before {
    background: linear-gradient(to right, blue, hotpink);
}

.glow:after {
    background: linear-gradient(to left, blue, hotpink);
}

.gradient {
    align-items: stretch;
    margin: 1em 0;
    height: 2em;
    line-height: 2em;
    color: white;
    background: black;
}

.gradient:before {
    background: linear-gradient(to right, white, black);
}

.gradient:after {
    background: linear-gradient(to left, white, black);
}

.donotcross {
    overflow: hidden;
    align-items: center;
    background: #ffd500;
    color: black;
    height: 2em;
    line-height: 2em;
}

.donotcross:before,
.donotcross:after {
    background: white;
    padding: 50px 0;
    height: 0;
    transform: rotate(45deg);
}

.chatinput .mat-form-field-underline {
    display: none !important;
}

.chatinput .mat-form-field-suffix {
    display: inline-flex !important;
    padding-top: 5px;
}

.chatinput .mat-form-field-wrapper {
    margin-top: -18px !important;
}

.chat-input-icons {
    position: absolute;
    float: right;
    width: 100%;
    margin-left: 80%;
    margin-top: -20px;
    cursor: pointer;
}

.chatmenu {
    margin-left: 165px;
    margin-top: 1px;
    color: #fff;
}

.chat-message input {
    max-width: 280px;

}

span.chat-menu {
    margin-left: 178px;
    padding-top: 10px;
    height: auto;
    width: 100%;
    position: absolute;
}

.chat-frame {
    background: var(--bs-secondary);
    float: right;
    z-index: 999;
    /* top: 264px; */
    height: 600px;
    position: fixed;
    left: 60%;
    bottom: 94px;
    width: auto;
    text-align: r;
    box-shadow: 1px 11px 19px 9px #cccc;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.chat-close {
    position: relative;
    left: 97%;
    top: 165px;
    z-index: 10003;
}

.chat-footer {
    border-top: 1px solid var(--bs-table-head);
    height: 100p;
    background: var(--bs-secondary);
    padding-top: 20px;
}

span.chat-menu .material-icons {

    color: #FAFAFA !important;
}

.chat-redflag {
    background-color: var(--bs-red-flag) !important;
}

.calendar-table.table {
    border-collapse: inherit;
    border-spacing: 0px;
}

.calendar-table tbody tr td:first-child {
    background-color: var(--bs-even-row-color);
}

.calendar-table thead tr th:first-child {
    background-color: var(--bs-even-row-color);
}

.calendar-table tbody tr td:last-child {
    background-color: var(--bs-even-row-color);
}

.calendar-table thead tr th:last-child {
    background-color: var(--bs-even-row-color);
}

.calendar-table.table tr:first-child th:first-child {
    border-top-left-radius: 10px !important;
}

.calendar-table.table tr:first-child th:last-child {
    border-top-right-radius: 10px !important;
}

.calendar-table.table tr:last-child td:last-child {
    border-bottom-right-radius: 10px !important;
}

.calendar-table.table tr:last-child td:first-child {
    border-bottom-left-radius: 10px !important;
}

.emp-name-limit {
    max-width: 80px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.main-sidenav .mat-nav-list {
    /*  height: 665px !important; */
    overflow-x: hidden;
    overflow: auto;
    top: 10px;
    position: relative;
    overflow: auto;

}

.main-sidenav .mat-nav-list::-webkit-scrollbar {
    width: 10px;
    border: 0px;
}

.main-sidenav .mat-nav-list::-webkit-scrollbar-track {
    background: unset !important;

}

.main-sidenav .mat-nav-list::-webkit-scrollbar-thumb {
    background: var(--bs-secondary) !important;
    /* height:50px !important; */
    /* border: 0px; */
    border-radius: 15px;
}

.main-sidenav .mat-drawer-inner-container {
    position: relative;
    bottom: 10px
}

.dynamic-table .mat-form-field-wrapper {
    padding-bottom: 0px;
    min-width: 243px;

}

.dynamic-table thead:first-child tr:first-child th:first-child {
    border-top-left-radius: 10px !important;
}

.dynamic-table thead:first-child tr:first-child th:last-child {
    border-top-right-radius: 10px !important;
}

.dynamic-table table tr td:first-child {
    /*border-top-left-radius:10px; */
}

.dynamic-table table tr:first-child td:last-child {
    /*border-top-right-radius:10px; */
}

.dynamic-table tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
}

.dynamic-table tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

.dynamic-table thead {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table th {
    border-top: 0px !important;
}


.dynamic-table tbody tr:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

.dynamic-table tbody tr:nth-child(even) {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table.table-striped tbody tr:nth-child(odd) {
    background: var(--bs-even-row-color);
}

.dynamic-table.table-striped tbody tr:nth-child(even) {
    background: var(--bs-odd-row-color);
}

app-things-to-know-group .dynamic-table tr:nth-child(odd){
	background: var(--bs-odd-row-color);
}
	
app-things-to-know-group .dynamic-table tr:nth-child(even){
	background: var(--bs-even-row-color);
}

.dynamic-table th {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;
}

.dynamic-table thead tr th {
    border-bottom: 0px !important;
    padding: 12px;
}


.formula {
    height: 87px;
    width: 100%;
}

.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),
.cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),
.cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

.mat-datepicker-toggle-active {
    color: var(--bs-primary) !important;
}

button.confirmClose {
    float: right;
    top: -20px;
    position: absolute;
    position: relative;
    left: 20px;
}

button.BtnSubmit {
    min-width: 160px !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

.uploadLabel {
    top: -9px;
    left: 1px;
    position: relative;
    font-weight: 700;
    color: var(--bs-primary);
}

.ngfile-upload-label{
    position: relative;
    top: -4px;
}

.wf-legend {
    margin-top: 10px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;
}

.wf-outer {
    max-height: 460px;
    overflow-x: hidden;
    overflow-y: scroll;
    max-width: 850px;
}

.wf-inner {
    max-width: 830px;
}

.wf-date {
    text-align: right;
}

.view-workflow2 {
    max-width: 935px;
    margin: auto;
    margin-left: 130px;
}

.workflow {
    padding-top: 24px;
}

.wf-profile {
    background: var(--bs-profile-bg);
    border-radius: 15px 0px 0px 15px;
    margin-bottom: 3px;
    height: 132px;
}

.wf-profile img {
    border-radius: 50%;
    height: 70px;
}

/* .wf-Approved{   
    border-top: 0px solid transparent;
    border-bottom: 0px solid transparent;
    border-left: 5px solid #92d050;
    
}
.wf-Reject{
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  border-left: 5px solid #ff0000;

}

.wf-Pending{
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  border-left: 5px solid #ffc000;
  
}

.wf-AdhocApprove{  
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  border-left: 5px solid #40409a;

}

.wf-AdhocPending{ 
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  border-left: 5px solid #bababa;
 
} */

/* .wf-AdhocReject{  
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  border-left: 5px solid #000000;
 
} */
/* wf legend */

.wf-Approved {
    background: var(--bs-chipapproved);
    color: var(--bs-white);
    width: auto;
    padding: 3px 10px 3px 10px;
    border-radius: 34px;
    text-align: center;
    margin-right: 5px;
}

.wf-Reject {
    color: #ff0000;
    padding-right: 37px;
}

.wf-Pending {
    background: var(--bs-chippending);
    color: var(--bs-white);
    width: auto;
    padding: 3px 10px 3px 10px;
    border-radius: 34px;
    text-align: center;
    margin-right: 5px;
}


.wf-AdhocApprove {
    color: #40409a;
    padding-right: 37px;
}

.wf-AdhocPending {
    color: #bababa;
    padding-right: 37px;
}

.wf-AdhocReject {
    color: #000000;
    padding-right: 37px;
}

.wf-details {
    background: var(--bs-left-tab-bg);
}

.wf-details th,
td {
    border-top: 0px !important;
}

.wf-inner {
    padding-top: 15px;
}

.wf-legend i {
    padding-right: 5px;
}

.wf-limit {
    max-width: 536px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.wf-comments .mat-expansion-panel {
    box-shadow: none !important;
}

.wf-comments {
    padding: 10px 20px;
}

.wf-comments .mat-expansion-panel-header {
    height: 150px;
    margin-bottom: 50px;

}

.wf-comments .mat-expansion-panel-header.mat-expanded {
    height: 150px;
}

.wf-level {
    border-right: 1px solid #e8e8e8;
    background: var(--bs-even-row-color);
    border-bottom: 1px solid #e2e2e2;
}

.wf-level-txt {
    position: relative;
    top: 25px;

}

.wf-card {
    background: #FDFDFD;
    box-shadow: 0px 0px 5px #eaeaea;
    border-radius: 15px;
    min-height: 100px;
    margin-bottom: 20px;
    min-width: 265px;
    margin-left: 12px;
    position: relative;
    top: 10px;
}

.wkflw-grid {
    min-height: 200px;
    /* max-height: 95vh; */
    overflow-x: hidden;
    overflow-y: auto;
    margin-left: 10px;
}

.wkflw-grid-outer {
    max-height: 85vh;
    overflow-x: hidden;
    overflow-y: auto;
    margin-left: 10px;

}

.wf-name-limit {
    /* max-width: 175px; */
    display: inline-block;
    /* white-space: nowrap; */
    text-overflow: ellipsis;
    overflow: hidden;
    position: relative;
    top: -5px;
}

.wf-card img {
    height: 35px;
    width: 35px;
    border-radius: 50%;
    margin-left: 10px;
}

.wf-name {
    padding-left: 10px;
}

.wf-desig {
    padding-left: 48px;
    margin-top: -16px
}

.wf-image {
    padding-left: 25px;
    padding-top: 5px;
}

.wf-name {
    padding-left: 10px;
    padding-top: 5px;
}

.wf-card .circle {
    position: absolute;
    top: -5px;
    right: 8px;
    width: 20px;
    height: 20px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    background: var(--bs-primary);
    color: var(--bs-white);
    text-align: center;
}

.line-height {
    line-height: 20px;
}

.wf-disabled {
    opacity: 0.6 !important;
}

.wf-status {
    border: 2px solid var(--bs-primary);
}

/*
.wf-card.wf-pending {
  border: 1px solid var(--bs-primary);
}
*/
.chip-more mat-icon {
    height: 33px;
    width: 34px;
    padding-top: 3px;
    border: 2px solid var(--bs-primary);
    border-radius: 50%;
    text-align: center;
    cursor: pointer;
    /* top: 55px; */
    position: relative;
    float: left;
}

.notify-approve .list-group-item a {

    cursor: pointer !important;
}

.notify-approve .list-group-item {


    padding: 2px 6px 0px 8px !important;
    background-color: transparent !important;
    border: none !important;
    color: var(--bs-primary) !important;
}

.main-content-section-pims .mat-tab-body-content {
    padding-left: 0px !important;
    padding-top: 20px !important;
}

.main-content-section .mat-tab-body-content {
    padding-left: 0px !important;
    padding-top: 20px !important;
    /* margin-left: -11px; */
}

.dynamicInformation-txt mat-tab-header.mat-tab-header {
    margin-left: 0px;
}

.balance-data {
    background: var(--bs-odd-row-color);
    border-radius: 8px;
    padding: 10px 10px;
    /* height: 65px; */
    max-width: 100%;
    margin: auto;
    /* margin-bottom: 10px; */
}

.mat-form-field-appearance-legacy .mat-form-field-infix {
    padding: 14px 0;
}

.edit-photo {

    padding-bottom: 30px;
    cursor: pointer;
}

.edit-photo img {
    height: 200px;
    width: 200px;
    border-radius: 50%;
    cursor: pointer;
    object-fit: cover;
}

.team-cal-table table th,
td {
    padding: 5px;
    /*  min-width: 60px; */
    /*  height: 90px; */

}

.team-cal-table .calendar-table td {
    padding: 5px;
    min-width: 35px;
    height: 85px;
    color: var(--bs-bodyTxt-light);
    font-size: 9px;
}

.team-calendar.Aesmenu {
    position: relative;
    left: 10px;
}

.team-cal-table .today-link {
    position: relative;
    top: 5px;
    left: -19px;
}

.icons_team_ntTime {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    bottom: 0;
    margin-top: 5px;
    /* left: 10px; */
    /* position: relative; */
}

.icons_team_time {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    bottom: 0;
}

.team-cal-table table {
    width: 100%;
}

.team-cal-table {
    max-width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
    margin-bottom: 20px;
}

.team-cal-table td {
    padding: 5px;
}

.team-calendar-legend {
    margin-top: 10px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;

}

.team-calendar-legend i {
    padding-right: 5px;
}

.calendar-header {
    width: 100%;
    margin-top: 10px;
}

.team-cal-table table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--bs-even-row-color);
}

.team-cal-table table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    /* background: var(--bs-white); */
}

aesdropdownlist.noborderFormfield.team-calendar.Aesmenu .mat-select-value-text {
    font-size: 14px;
}

aesdropdownlist.noborderFormfield.team-calendar.Aesmenu .mat-select-arrow {
    top: 7px;
    position: relative;
    left: 6px;


}

.team-cal-img {
    width: 188px;
}

.team-cal-img img {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    margin-top: 5px;
}

.team-row {
    width: 303px;
}

.row.team-cal-width {
    max-width: 180px;
}

span.cal-usr-txt {
    margin-top: 0px;
    max-width: 155px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 15px;
    color: var(--bs-bodyTxt);
}

td.image_tbl_td {
    background: var(--bs-even-row-color);
}

span.cal-usr-id {
    padding-left: 12px;
}

table.calendar-table.table.table-bordered {
    border: 0px;
    margin-bottom: 8px;
}

.wf-widget {
    height: 555px;
    overflow-y: auto;
    overflow-x: hidden;
}

.submenu li mat-icon {
    top: 5px;
    position: relative;
}

.notify-view-all {

    padding: 10px;
    color: var(--bs-primary);
    cursor: pointer !important;
    text-align: center;
    position: relative;
    top: -8px;

}

.plus_btn i {

    color: var(--bs-primary);
    font-size: 24px;
}

.plus_btn {

    width: 45px;
    height: 45px;
    border: 1px solid var(--bs-primary);
    border-radius: 50%;
    text-align: center;
    font-size: 24px;
    display: inline-block;
    margin-left: 20px;
    vertical-align: middle;
    padding: 4px 9px 8px 10px;
    cursor: pointer;

}

/*
.mat-expansion-panel-header.mat-expanded {

 height:20px !important;
}
*/



.mat-select-panel {

    margin-top: 27px;

    background: #fff;

    max-height: 300px;

    min-width: 100% !important;

}

.calendar-control-2 {
    color: var(--bs-bodyTxt);
    margin-left: 1px;
    margin-top: -33px;
}

.faci-card {
    background: #FDFDFD;
    box-shadow: 0px 4px 16px #eaeaea;
    border-radius: 15px;
    min-height: 165px;
    margin-bottom: 20px;
    padding: 15px;

}

.faci-card img {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    /* margin-left: 10px; */
}

.faci-image {
    padding-left: 18px;
    padding-top: 5px;
}

.faci-list li {
    border: none;
}


.facitem .list-group {
    display: inline-block;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 0.25rem;
}

.faci-name {
    padding-left: 15px;
    position: relative;
    display: inherit;
    width: 120px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.faci-name-popup {
    position: relative;
    top: 10px;
    /*width: 120px!important;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.facitem .list-group-item {
    position: relative;
    display: block;
    padding: 0.25rem 1.25rem;
    background-color: #fff;
    border: 0px;
    display: inline-block;
}

.faci-popup {
    height: 410px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 10px;
}

.ngxp__container.ngxp__animation {
    max-width: 230px;
}

.hover_box select {
    max-width: 170px;
    float: right;
}

.data-divider {

    border-right: 1px solid #74748d4d;
}

.cdk-overlay-pane:has(.mat-select-panel-wrap) {

    transform: none !important;

    overflow-x: hidden;

    box-sizing: content-box;

    padding: 4px 4px 10px 5px;

    margin-left: -5px;

    margin-top: -2px;

}

.button-chip {
    padding: 13px 24px;
    height: 40px;
    background: var(--bs-primary);
    border-radius: 100px;
    color: var(--bs-white);
    cursor: pointer;
}

.dynamic-buttons .list-group-item {
    padding: 5px 10px !important;
    background-color: #fff;
    border: 0px !important;
}

.button-chip i {
    padding-right: 5px;
}

.mat-tab-group,
.mat-tab-label,
.mat-tab-link {
    font-family: inherit !important;
}

span.btn-menu-list mat-icon {
    top: -6px;
    right: 5px;
    position: relative;
    float: left;
    color: unset !important;
}

.moreMenu mat-icon {
    top: 12px;
    position: relative;
}

.chat-trigger i {
    font-size: 25px;
    padding: 12px;
    height: 50px;
    width: 50px;
    color: var(--bs-primary);
    border: solid 1px var(--bs-primary);
    border-radius: 50%;

}

.badge-circle {
    display: inline-block;
    padding: 69px 47px 15px 49px;
    border-radius: 50%;
    text-align: center;
    background: var(--bs-primary);
    color: var(--bs-white);
}

.faci-type-txt {
    position: relative;
    top: 23px;
}

.onbehalfempname {
    max-width: 300px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    top: 3px;
}

.faci-badge {
    display: inline-block;
    padding: 0.25em 0.4em;
    padding: 13px 4px !important;
    font-size: 79%;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50px !important;
    height: 50px !important;
    width: 50px !important;
    background: var(--bs-primary);
    color: var(--bs-white);
    cursor: pointer;
}

.fileuploadText {
    cursor: pointer;
    margin-bottom: 0rem !important;
}

.title-grey {
    padding-bottom: 4px;
    color: var(--bs-bodyTxt-light);
}

.aes-popup-nofooter .mat-dialog-actions {
    display: none;
}

.more-chip {
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 25px;
    padding-right: 25px;
    cursor: pointer;
    margin-left: 17px;
    margin-right: 15px;
    margin-bottom: 20px;
    border-radius: 100px;
    border: 2px solid var(--bs-primary);
    color: var(--bs-primary);
    float: left;
}

.more-chip:hover {
    background: var(--bs-secondary);
    color: var(--bs-white);
    border-color: var(--bs-secondary);
    text-decoration: none;
}

.dynamic-input {
    min-width: 243px;

}

.dynamic-table {
    max-width: 100% !important;
    overflow: auto;
}

.dynamic-table::-webkit-scrollbar {
    height: 6px;
    cursor: pointer;
}

.viewicon i {
    padding-top: 18px;
    font-size: 20px;
    color: var(--bs-primary);
    cursor: pointer;
}

.report-card {

    max-width: 97%;

    margin: 10px;

    border-radius: 15px 15px 15px 15px;

    border: #ececec 3px;

    box-shadow: 0px 0px 13px 6px #ececec;

}



.report-card .mat-card-title-group {

    display: flex;

    justify-content: space-between;

    background-color: #28a745;

    padding: 10px;

    margin-bottom: 10px;

    border-radius: 15px 15px 0px 0px;

}



#reportPanel .mat-card {

    margin-left: 20px !important;

    padding: 0px !important;

}

div#reportPanel .col-lg-6 {
    margin-top: 10px
}

.report-card .mat-card-content {



    padding: 20px !important;

}

.card-columns {

    column-count: 2 !important;

}

.widget-title_2 {
    font-weight: 700;
    padding-top: 21px !important;
    border-radius: 15px 15px 0px 0px;
    padding-bottom: 21px;
    padding-left: 19px;
    float: left;
    background: var(--bs-light-secondary);
}

#reportPanel .card-columns .card {
    margin-bottom: 24px;
}

select.dropdown_html {
    height: 40px;
    border: solid #bbbbbb;
    border-radius: 8px;
}

.mat-form-field-appearance-outline .mat-form-field-outline-thick .mat-form-field-outline-start,
.mat-form-field-appearance-outline .mat-form-field-outline-thick .mat-form-field-outline-end,
.mat-form-field-appearance-outline .mat-form-field-outline-thick .mat-form-field-outline-gap {
    border-width: 1px !important;
}

.clk-delete {
    position: relative;
    top: 3px;
    padding-right: 11px;
}

.AeSAttachControl mat-icon {
    position: relative;
    top: 7px;
}

.AeSAttachControl {
    font-weight: 600;
    color: var(--bs-primary);
    cursor: pointer;
}

.attach_count {
    position: absolute;
    margin-left: -6px;
    margin-top: -15px;
    font-size: 12px !important;
    transform: scale(0.8);
    background: var(--bs-primary);
}

.main-counter-box .TextField {
    color: var(--bs-bodyTxt-light);
    padding: 8px;
}

.counter-number h1 {
    font-family: 'Montserrat-Regular', sans-serif !important;
    font-weight: 700 !important;

}

.main-counter-box.aesprogresscircle.aesprogressactive h1 {
    font-family: 'Montserrat-Bold', Arial !important;
}

.data-chip {
    padding: 5px 5px 1px 5px;
    background: var(--bs-even-row-color);
    width: 185px;
    text-align: center;
    border-radius: 25px;
}

.data-chip i {
    position: relative;
    left: 5px;
    cursor: pointer;
    top: -4px;
}

.data-card-wgt {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 25px;
    margin-left: 0px;
    border-radius: 4px 0px 0px 4px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 120px;
    padding: 10px;
}

.data-limit {
    width: 85px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.dynamic-table td {
    height: 40px !important;
    padding: 0px 10px 0px 10px;
}

.num-box {
    width: 126px !important;
    position: relative;
    top: 15px;
}

.sheet-add {
    position: relative;
    top: 15px;
}

.sheet-delete {
    position: relative;
    right: 20px;
    top: 31px;
}

.photo-upload-widget {
    height: 120px;
    background: #FDFDFD;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 8px;
    margin-bottom: 10px;
}

.user-photo-upload {
    font-size: 100px;
    color: #ccc;
    position: relative;
    left: 190px;
    top: -27px;
}

.add-usr-photo {
    margin-top: 65px;
    position: absolute;
    margin-left: 158px;
}

.add-usr-photo i {
    font-size: 15px;
    height: 32px;
    width: 32px;
    background: var(--bs-primary);
    color: var(--bs-white);
    border-radius: 32px;
    padding-top: 9px;
    padding-left: 9px;
    cursor: pointer !important;
}

.user-photo-upload img {
    height: 100px;
    border-radius: 59%;
    width: 100px;
}

.photo-label {
    position: relative;
    left: 210px;
    top: -49px;
}

.centered-popup-att {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: inherit !important;
    background: #fff;
}

.common-announcement-links {
    position: absolute;
    top: 93%;
}

.common-announcement img {
    width: 350px;

}

.dynamic-div {
    background: var(--bs-odd-row-color);
}

.dynamic-div .mat-form-field-appearance-outline .mat-form-field-outline {
    background: var(--bs-white);
}


.mandatory-color {
    color: red;
}

.table-mandatory {
    color: red;
}

.message-chip {
    padding: 2px 5px 3px;
    background: rgb(239, 243, 248);
    text-align: center;
    border-radius: 25px;

}

.afdbreadcrumb {
    margin-left: -16px;
    /* margin-bottom: -10px; */
    cursor: pointer;
    color: var(--bs-primary);
}

.Afd-hyperLink{
	cursor: pointer;
    color: var(--bs-primary);
}

.Afd-hyperLink:hover{
	color: var(--bs-primary)
}

app-aes-hyperlink span {
    color: var(--bs-primary);
    text-decoration: none !important;
}

app-aes-hyperlink span:hover{
    text-decoration: underline !important;
}

.afdbreadcrumb a:hover {
    text-decoration: underline;
}

/*.ViewWorkflowLink {
    position: relative;
    top: 15px !important;
} */

#addedfromapproval .ViewWorkflowLink {
    top: -16px;
}

.mat-checkbox-layout .mat-checkbox-label {
    padding-right: 10px;
}

.time-sheet thead:first-child tr:first-child th:first-child {
    border-top-left-radius: 10px !important;
}

.time-sheet thead:first-child tr:first-child th:last-child {
    border-top-right-radius: 10px !important;
}

.time-sheet tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
}

.time-sheet tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

.time-sheet thead {
    background-color: var(--bs-dynamic-thead);
}

.time-sheet th {
    border-top: 0px !important;
}

.time-sheet li {
    background: var(--bs-even-row-color);
}

.time-sheet li:nth-child(odd) {
    background: var(--bs-odd-row-color);
}

.time-sheet thead tr th {
    border-bottom: 0px !important;
}

.time-sheet .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;
    border-radius: 5px;
}

.time-sheet th {
    background-color: var(--bs-table-head);
}

.time-sheet .mat-form-field-wrapper {
    padding-bottom: 0px;
}

.candidate-widget {
    position: relative;
    box-sizing: border-box;
    width: 240px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
    margin-bottom: 20px;
}

.candidate-widget table {
    width: 100%;
    margin-bottom: 0;
}

.cand-active {

    border: 2px solid var(--bs-secondary-rgb) !important;

}

.candidate-photo {
    position: relative;
    text-align: center;
}

.candidate-table .table td {
    padding: 0.45rem !important;

}

.candidate-header {
    box-sizing: border-box;
    width: 238px;
    height: 32px;
    padding: 4px 2px 2px 9px;
    background: var(--bs-odd-row-color);
    border-radius: 4px 4px 0px 0px;
    border-bottom: 1px solid rgba(116, 116, 141, 0.3);

}

.cand-active .candidate-header {

    width: 236px;
}

.data-widget-multi-no-top-border {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0px;
    border-radius: 4px 0px 0px 4px;
}

.candidate-photo img {
    width: 90px;
    top: 7px;
    margin-bottom: 16px;
    position: relative;
    height: 90px;
    border-radius: 4px;
}

.interview-row {
    background: var(--bs-table-head);
}

.info-icon {
    position: relative;
    left: 5px;
}

.info-icon i {
    color: var(--bs-primary);
}

.padd-right10 {
    position: relative;
    right: 10px;
}

.cand-limit-qual {
    max-width: 150px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.cand-limit {
    max-width: 220px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.ToasterNavPrevious {

    color: var(--bs-bodyTxt);
}

.DragDrop {
    border: 1px solid var(--bs-primary) !important;
    padding: 10px;
    border-radius: 7px;
}

#AfdIframe {
    /*height: calc(100vh - 63px); */
    height: 100%;
    margin: 0px !important;
    position: absolute !important;
    top: 0px !important;
    right: 0px !important;
    bottom: 0px !important;
    left: 0px !important;
    width: 100%;
}

.left-tab-bg .mat-list-base {
    padding-top: 0px;

}

.left-tab-bg .mat-list-text {
    padding-left: 10px !important;
}

.main-toggle {
    font-size: 27px !important;
}

.AeSMatTable .mat-cell,
.mat-footer-cell {
    margin-left: 3px;
    white-space: normal;
}

.AeSMatTable .mat-checkbox {
    position: relative;
    top: 4px;
}

.mat-table {
    border-spacing: 0;
    white-space: pre-wrap;
}

/*
.mat-dialog-content {
max-height: unset !important;
overflow: unset !important;
}
*/
.AeSFilename {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;

}

aesfileupload .pt-4 {
    padding-top: 0px !important;
}

.grid-file-remove {
    position: relative;
    top: 8px;
    left: 5px;
}

.gridFileList {
    position: relative;
    top: -4px;
}

.wf-link-fullwidth {
    position: relative;
    top: -14px;
    left: 0px;
}

.BtnSave.MisBtn .mat-button {
    margin-left: 0 !important;
}

.apprv-usr-img {
    position: relative;
    top: 4px;
    left: -17px;
}

.review-title {
    position: relative;
    left: -25px;
    top: 16px;
}

.calendar-control-2 .mat-form-field-wrapper {
    padding-bottom: 0px !important;
    position: relative !important;
    top: 20px !important;
}

.vflw3 {
    position: relative;
    left: 5px;
}

.chat-icons {
    color: var(--bs-white);
    /* padding: 5px; */
    position: relative;
    top: 6px;
}

.chat-controls .mat-form-field-wrapper {
    position: relative;
    top: -7px;
    height: 30px;
    border: 1px solid #efefef;
    border-radius: 5px;
}

.chat-controls .mat-form-field-infix {
    padding: 0px;
    position: relative;
    left: 5px;

}

.chat-controls .mat-select {
    position: relative;
    top: -3px;
}

.chat-checkbox {
    position: relative;
    top: -4px;
}

.chat-controls .mat-select-arrow {
    position: relative;
    left: -6px;
}

.file-drag {
    width: 100px;
    height: 100px;
    background-color: #ddd;
    margin: auto;
    border-radius: 50%;
}

.file-drag i {
    position: relative;
    top: 23px;
    font-size: 51px;
    color: var(--bs-white);
}

.file-icon-drag {
    position: relative;
    top: 20px;
    left: 67px;
    height: 30px;
    width: 30px;
    background: var(--bs-primary);
    border-radius: 50%;
}

.file-icon-drag i {
    font-size: 19px;
    position: relative;
    top: 6px;
    color: var(--bs-white);

}

.clip-verti i {
    transform: rotate(316deg) !important;
}

.attach_count-grid {
    position: absolute;
    margin-left: -10px;
    margin-top: -16px;
    font-size: 12px !important;
    transform: scale(0.8);
    background: var(--bs-primary);
}


.grid-badge {
    display: inline-block;
    /* padding: 0.25em 0.4em; */
    padding: 8px 6px !important;
    font-size: 75%;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50px !important;
    height: 25px !important;
    width: 25px !important;
    background: var(--bs-secondary);
    color: var(--bs-white);
}

.dynamic-table tr>td.table-column-fixed:last-child {
    position: sticky;
    right: 0;
    z-index: 1;
    background-color: var(--bs-even-row-color);
}

.dynamic-table tr>td.table-column-fixed:nth-last-child(2) {
    position: sticky;
    right: 52px;
    z-index: 1;
    background: var(--bs-odd-row-color);
}

.dynamic-table.Afd-EditableTable .edit_table table thead tr th {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table.Afd-EditableTable .edit_table table tbody tr:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}
.dynamic-table.Afd-EditableTable .edit_table table tbody tr:nth-child(even) {
    background-color: var(--bs-odd-row-color);
}	

.chat-controls-inner {
    background: #fff;
    position: relative;
    top: 11px;
    height: 48px;
    margin-bottom: 10px;
    width: 93%;
    /* margin: auto; */
    left: 14px;
    border-radius: 8px;
}

.chat-upload .AeSFilename {
    position: relative;
    top: -60px !important;
    right: 90px !important;
    max-width: 190px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.chat-upload .clk-delete {
    position: relative;
    top: -58px;
    right: 108px;
}

.year-calendar-legend {
    margin-top: 10px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;
    padding-right: 9px;
}

.year-calendar-legend li i {
    padding-right: 6px;
}

.fullblock .mat-form-field-label {

    left: 14px;
}

.fullblock .mat-form-field-infix {
    padding-left: 15px;
}

.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
    color: var(--bs-bodyTxt);
}

.drag-drop-widget {
    height: 100%;
    padding-top: 20px;
    background: #FAFAFA;
    /* border: 1px solid rgba(116, 116, 141, 0.3); */
    border-radius: 15px;
    margin-top: 32px;
}

.modal-dialog {
    max-width: 100% !important;
    margin: 0px !important;
}

.afd-dialog-full .modal-content,
.afd-dialog-half .modal-content {
    height: 100vh;
    border: 0px !important;
    /* width: 95% !important;
    margin: 0px !important;
    height: 100vh;
    z-index: 1051;
    position: fixed;
    background:var(--bs-white);
    top: 0;
    left: 0;*/
}

.afd-dialog-full .modal-header {
    display: none;
}

.afd-dialog-full .modal-dialog {
    max-width: 100% !important;
}

.afd-dialog-half .modal-dialog {
    max-width: 100% !important;
}

.afd-dialog-half {
    width: 75%;
}

.afd-title-no-padding,
.afd-title-no-padding p {
    margin: 0px;
}

.GridAddRow {
    right: 0px;
    position: relative;
    width: 100% !important;
    text-align: right;
    top: 40px;
    min-height: 65px;
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 14px !important;
}

.GridAddRow i {
    padding-right: 3px;
}

.afd-grid-noscroll .Afd-EditableTable {
    overflow: auto;
    font-size: 12px;
}

.afd-Editabletable-norecord {
    text-align: center;
}

.afd-dialog-full .modal,
.afd-dialog-half .modal {
    height: unset;
    background: var(--bs-white);
    padding-left: 20px;
}

.total-box {
    min-width: 195px;
}

/*.afd-navmenucol {
    position: relative;
    left: -5px;
} */
.afd-navmenucol {
    position: relative;
    /* left: -5px; */
    padding-right: 30px;
    padding-left: 30px;
}

.aesRadioLabel {
    font-weight: 600;
    padding-right: 10px;
    position: relative;
    top: -2px;
}

.afdformtitle {
    position: relative;
    left: 0px;
}

.full-screen-modal {
    max-width: unset !important;
    width: 1366px;
    height: 100%;
}

.admin-dialog-close {
    top: -17px;
    /* float: right; */
    text-align: right;
    /* left: -9px; */
    right: 0px;
    position: absolute;
    z-index: 9999;
    /* width: 100%; */
    color: var(--bs-bodyTxt) !important;
}

/*aesworkflow {
    bottom: 8px;
    position: relative;
} */

.aspxiframeContainerClass {
    display: block;
    /* margin-top: 64px; */
    top: 0px;
    padding-left: 20px;
    overflow-x: hidden;
    /* height: calc(100vh - 63px); */
}

.login-profilemail {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 20px;
}

/*
 .dynamicField {
    position: relative;
    left: 10px;
}
*/
.smalldesc {
    min-height: 350px;
    overflow: hidden;
    transition: all .5s ease;
}

.smalldesc.expand {
    /* height: 472px !important;  */
    overflow: hidden;
    height: 100%;
}


.dash-toggle {
    min-height: 350px;
    overflow: hidden;
    transition: all .3s ease;
}

.dash-toggle.expand {
    /* height: 565px !important;  */
    overflow: hidden;
    height: 100%;
}


.smalldesc1 {
    min-height: 350px;
    overflow: hidden;
    transition: all .5s ease;
}

.smalldesc1.expand {
    /* height: 472px !important;  */
    overflow: hidden auto;
    height: 100%;
}


.dash1-toggle {
    min-height: 350px;
    overflow: hidden;
    transition: all .3s ease;
}

.dash1-toggle.expand {
    /* height: 565px !important;  */
    overflow: hidden;
    height: 100%;
}



/*.top-arrow:after {
    content: '';
    position: absolute;
    left: 2px;
    right: 0;
    margin: 0 auto;
    width: 3px;
    height: 2px;
    border-bottom: 12px solid var(--bs-primary);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
} */

.top-arrow {
    z-index: 995;
    position: relative;
    width: 43px;
    height: 18px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    margin: 0 auto;
    background: var(--bs-white);
    padding: 0px;
}

/* .avatar {
  display: inline-block;
  border-radius: 50%;
  overflow: hidden;
  width: 75px;
  cursor: pointer;
}

.avatar:not(:first-child) {
  margin-left: -60px;
  -webkit-mask:radial-gradient(circle 55px at 5px 50%,transparent 99%,#fff 100%);
          mask:radial-gradient(circle 55px at 5px 50%,transparent 99%,#fff 100%);
}

.avatar img {
  width: 100%;
  display: block;
  
} */

span.avatars {
    padding: 17px 28px;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    width: 75px;
    cursor: pointer;
    border: 3px solid var(--bs-secondary);
    height: 75px;
    margin-left: -30px;
    -webkit-mask: radial-gradient(circle 40px at -10px 50%, transparent 99%, #fff 100%);
    /* mask: radial-gradient(circle 55px at 5px 50%,transparent 99%,#fff 100%); */
}

span.avatars mat-icon {
    top: -35px;
    left: 10px;
    position: relative;
}

.avatar {
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    width: 75px;
    cursor: pointer;
    border: 3px solid var(--bs-secondary);
    height: 75px;
    background: #f0f0f0;
}

.avatar:not(:first-child) {
    margin-left: -30px;

}

.avatar img {
    width: 100%;
    display: block;
    height: 100%;
}

.avatar:hover {
    transform: scale(1.2);
    position: relative;
    z-index: 10003;
    transition: 0.20s;
}

/* body {
  background:pink
} */

#dvthingsneedtoknow.row.active .main-widget-bottom.col-xl-12.h12.px-0,
#dvthingsneedtoknow.row.active .main-widget-bottom.col-xl-12.h12.px-0 .card-cnt.shadow {
    height: 100% !important;
}

#dvthingsineedto.row.active .main-widget.top.col-xl-12.h12.px-0,
#dvthingsineedto.row.active .main-widget.top.col-xl-12.h12.px-0 .card-cnt1.shadow {
    height: 100% !important;
}

.mat-select-disabled .mat-select-value {
    color: rgba(0, 0, 0, 0.38) !important;
}

.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label {
    color: rgba(0, 0, 0, .38) !important;
}

.mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {
    color: rgba(0, 0, 0, .38) !important;
}

.mat-menu-panel {
    max-width: unset !important;
}

input::file-selector-button {

    color: var(--bs-white);
    padding: 10px 15px 10px 15px;
    border: 0px;
    border-radius: 54px !important;
    background: var(--bs-primary)
}

#addedfromapproval .aesRadioLabel {
    display: block;
    position: relative;
    margin-bottom: 5px;
}

.grdTxtSearch {
    min-height: 65px;
}

.mat-primary .mat-pseudo-checkbox-checked,
.mat-primary .mat-pseudo-checkbox-indeterminate {
    background: var(--bs-primary) !important;
}

.mat-sort-header-content {
    text-align: left !important;
}

.scrollableTable .mat-sort-header-content {
    min-width: 175px;
}

.data-uploadGrid .mat-sort-header-content {
    min-width: unset !important;
}

.app-history img {
    height: 35px;
    width: 35px;
    border-radius: 50%;
    margin-left: 10px;
}

.app-history {
    background: var(--bs-left-tab-bg);
    border-radius: 15px;
    margin-bottom: 20px;
    padding: 10px;
}

.app-history.active {

    border: 1px solid var(--bs-secondary);
}

.app-history-name {
    max-width: 220px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.dynamic-radio-list .pr-3 {
    padding-right: unset !important;
}

.timesheet-week-selector.mat-form-field-appearance-fill .mat-form-field-flex {
    background-color: transparent !important;
    ;
    height: 40px !important;
}

.timesheet-week-selector.mat-form-field-wrapper {
    padding-bottom: 0px !important;
    ;
    height: 0px !important;
    ;
}

.timesheet-week-selector.mat-datepicker-toggle {
    top: -36px;
    color: var(--bs-primary) !important;
    position: relative;
}


.timesheet-week-selector .mat-date-range-input {
    display: none !important;
}

.timesheet-week-selector .mat-icon-button {
    position: relative;
    top: -19px;
    right: 32px;
}

.timesheet-week-selector .mat-datepicker-content .mat-calendar-previous-button {

    height: 40px !important;
    width: 40px !important;
}

.timesheet-week-selector .mat-form-field-underline {
    display: none;
}

.timesheet-week-selector .mat-form-field-wrapper {
    padding-bottom: 0px !important;
}

.timesheet-week-selector .mat-form-field-underline {
    display: none;
}

.fua-inner {
    width: 350px;
    padding-top: 30px;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.fua-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    line-height: 35px;
    text-align: center;
}

.card-bodyChat.expand {
    overflow: hidden !important;
    height: 100%;
}

.video-widget {
    height: 240px;
    margin-bottom: 27px;
    width: 91%;
    text-align: center;
    position: relative;
    left: 22px;
    border: 1px solid var(--bs-low-light-grey);
}

.video-widget video {
    height: 240px !important;
    padding: 0px !important;
    width: 100% !important;

}

.ChipPending2 {

    background: var(--bs-chippending) !important;
    border-radius: 34px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 3px;
    padding-bottom: 7px;
    text-align: center;
    color: var(--bs-white);
}

.chat-frame.disable {
    height: 510px;
    ;
}

.no-conversations {
    text-align: center;
    top: 50%;
    position: relative;
    right: 0;
    height: 100%;
}

#rotateoverlay {
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--bs-secondary);
    z-index: 1004;
    cursor: pointer;
}

.rotate-text {

    color: white;
}

#rotate-img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    text-align: center;
    margin: 0;
}

span[css=AeSPackageVersion] {
    display: none;
}

.AeSPackageVersion {
    display: none;
}

.panelOnbehalfOf .mat-dialog-container {
    height: 106vh;
    overflow: hidden;
}

.exceedRecord-inner {
    height: 320px;
    width: auto;
    padding-top: 30px;
    /* background: url(../images/no-record.png) no-repeat; */
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}


.exceedRecord-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 106px;
    line-height: 40px;
    text-align: center;
}

.checkBox_Themecolor .col-6 {
    max-width: 24% !important;
}

.checkBox_Themecolor .col-2 {
    max-width: 100% !important;
    flex: 207px;

}

/* Iphone SE Media css */
@media only screen and (max-device-width: 812px)and (max-device-height: 375px) {
    .main-widget.top {

        max-width: 50% !important;
        /* left: 71px; */
        margin: auto 8%;

    }

    .main-widget-bottom {
        max-width: 56% !important;
        /* left: 71px; */
        margin: auto 8%;


    }

    .main-widget.top-right {
        max-width: 56% !important;
        left: 5.5%;
        /* height: 550px; */
        /* bottom: 30px; */
    }

    .main-widget.right {
        max-width: 56% !important;
        left: 5.5%;

    }

    .header-logo {
        margin-left: 8px !important;
    }



    .topbar .navbar-search {
        width: 400px;

    }

    .topbar {
        min-width: 100% !important;
    }

    .searchbar {
        display: block !important;
        margin-top: 27px;
        position: relative;
        margin-left: -200px;
    }

    li.searchbar i {
        left: 111px;
        top: -12px;
    }

    .togglesearch {

        display: block;
    }

    .topbar .navbar-search {
        margin-top: -40px !important;
        margin-left: 180px;

    }
}

.navScroll-240 {
    width: 240px;
    height: 60px;
    overflow-y: hidden;
    overflow-x: scroll;
}


.data-limit-240 {
    max-width: 240px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.dash-thumb-Header-Text {
    white-space: nowrap;
    pointer-events: none;
    overflow: hidden;
    text-align: left;
    -webkit-user-select: none;
    width: 225px;
    user-select: none;
    cursor: default;
    opacity: 1;
    position: absolute;
    left: 12px;
    top: 10px;
    opacity: 0.8;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.dashboard-columns {
    column-count: 1 !important;
}

.widget-data-limit {
    width: 100%;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.full-screen-modal {
    max-width: unset !important;
    width: 100%;
    height: 100%;
}

.full-screen-modal .mat-dialog-container {
    max-width: 100vw;
    max-height: 100vh;
    height: 100%;
    width: 100%;
}

.full-screen-modal .mat-dialog-container .mat-dialog-content {
    max-height: unset !important;
}

.l0menu-icon.menuactive {
    color: var(--bs-secondary);
}

.videopopup {
    top: 200px;
    position: relative;
    z-index: 99;
    width: calc(100% - 50%) !important;
}

.noticarousel .carousel-inner {
    background-color: unset !important;
}

.noticarousel .carousel-item {
    height: 100% !important;
    min-height: 400px !important;
}

.noticarousel .carousel-indicators li {
    border: solid 2px var(--bs-secondary) !important;
}

.noticarousel .carousel-indicators li.active {
    background-color: var(--bs-secondary) !important;
}

.carousel {
    position: relative;
    width: 100% !important;
}

.aes-main-popup.thingstodo {
    top: 100px;
    position: relative;
    z-index: 99;
    width: calc(100% - 50%) !important;
}

.aes-main-popup.thingstoknow {
    top: 100px;
    position: relative;
    z-index: 99;
    width: calc(100% - 50%) !important;
}

.card-bodyChat.expand {
    overflow: hidden !important;
    height: 100%;
}

.card-bodyChat:hover {
    overflow: hidden !important;
}

.mat-calendar-body-selected {
    background-color: var(--bs-secondary) !important;

}

.noMap-inner {
    height: 320px;
    padding-top: 30px;
    background: url(../images/no-record.png) no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}

.noMap-msg {
    font-family: 'Pompiere';
    font-size: 32px !important;
    margin-top: 106px;
    line-height: 40px;
    margin-left: 206px;
    text-align: center;
}

.not-upload {
    cursor: not-allowed !important;
}

.not-allowed {
    cursor: not-allowed !important;
}

@media only screen and (max-width: 768px) {
    .aes-main-popup.thingstodo {
        top: 0 !important;
        position: relative;
        height: 350px !important;
        width: 74% !important;
        z-index: 99;

    }

    .col.login-bg+.col {
        display: none !important;
    }

    .maintenance-msg {
        /* max-width: 349px; */
    }

    .login-bg {
        background: unset !important;
    }

    .wrapper {
        margin-left: 25% !important;
    }

    .wrapper .card {
        width: 75% !important;
        max-width: 100% !important;

    }

    .maintenance-msg {
        margin: 0px;
    }

    .lang-menu {
        margin-left: 89%;
        margin-top: -25%;
    }



    .lang-icon {
        margin-top: 80%;
        padding-left: 82%;
        padding-right: 5px;
        font-size: 16px;
    }

    .BtnLogin .mat-button {
        width: 350px;
        max-width: 100%;
    }
}



.dashboard-modal {
    max-width: unset !important;
    width: 100%;
    height: 100%;
    margin: 0;
}

.dashboard-modal .mat-dialog-container {
    padding: 0px !important;
    border-radius: 0px !important;
}

.dashboard-modal .iframeContainerClass2 {
    margin: 0px !important;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    height: 100% !important;
}

.mat-dialog-actions.mat-dialog-actions .row {
    width: 600px;
    text-align: center;
}

.mat-dialog-actions .row .col.text-left {
    text-align: center !important;
}

.mat-dialog-actions .row .col.text-right {
    text-align: center !important;
}

.disabledNoOfCasesDiv {
    pointer-events: none;
    opacity: 2.0;
    background-color: var(--bs-disable-stat) !important;

}



span.AeSPackageVersion {

    display: none;

}


i.fas.fa-plus.ml-2.add_icon {
    padding-bottom: 10px;
}

.fa-regular,
.far {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 400;
}


/* Note: Background changed for freezed columns */
.table-column-fixed {
    position: sticky;
    right: 0;
    z-index: 1;
    background: inherit;
}

/* For tree node css */

.tree-arrow {
    position: relative;
    top: -4px;
}

.tree-box {
    border: 1px solid #ccc;
    margin-top: 10px;
    padding: 5px;
    height: 485px;
    overflow-x: auto;
    overflow-y: auto;
}

.line-tab .mat-tab-label-active:before {
    display: none !important;

}

.line-tab .mat-tab-label-active {
    border-bottom: 4px solid var(--bs-primary);
}

.line-tab .mat-tab-label:before {
    display: none !important;
}

.line-tab .mat-tab-header {
    border-bottom: 4px solid var(--bs-even-row-color) !important;

}


.line-tab .mat-tab-label-content {
    color: var(--bs-primary) !important;
    font-family: 'OpenSans-Regular' !important;

    font-size: 16px !important;
}

.line-tab .mat-tab-label-active {

    font-weight: 700 !important;
}

.counter-number h1 {
    padding-bottom: 0px !important;
}

.divDialogCloseOuter {
    position: relative;
    right: 5px;
}

.border-box {
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
    padding: 20px 26px 20px 26px;
    margin-bottom: 28px;
}

.view-more-lablel {
    position: relative;
    top: -12px;
    right: 2px;
}

div#DynamicFields .form-main-title {
    margin-bottom: 0px !important;
}

.calendar-table.table tr:first-child th {
    font-family: 'OpenSans-Bold';
    color: var(--bs-Widget-Duration);
}

.circle-counter {
    border-radius: 50%;
    width: 25px;
    height: 25px;
    padding: 20px;
    background: var(--bs-secondary);
    color: var(--bs-white);
    text-align: center;
    font-size: 11px;
    font-weight: bold;
}

/*.mat-dialog-title {
    margin: 0 0 0px !important;
    font-family: 'Montserrat-Bold' !important;
    font-size: 28px !important;
}
*/
.pointerevent {
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.4;
}

.iframe600 {
    width: 100%;
    height: 600px;
    border: 0px;
}

.game-bg {
    background: var(--bs-secondary);
}

.mat-form-field-label {
    color: var(--bs-Widget-Duration) !important;
    letter-spacing: 0.25px;
}

.dashboardmenu {
    position: absolute;
    top: 3px;
    padding: 5px;
    right: 5px;
    border-radius: 50px;
}

.dashboardmenu:hover {
    background-color: var(--bs-secondary);
    border: 1px solid var(--bs-secondary);
}

.AeSGridMoreOptionsItem {
    position: relative;
    /* left: 10px; */
    text-align: right;
    width: 100%;
    display: block;
    top: 11px;
}

aesgrid .AeSGridMoreOptionsItem {
    top: unset !important;
}

aesgrid .AeSGridMoreOptionsItem mat-icon {
    top: 18px;
    text-align: right !important;
    position: relative;
}

.container-fluid.sub-title {
    padding-top: 0px;
    padding-bottom: 0px;
}

.mat-dialog-title {
    margin: 0 0 0px !important;
}

.toggle-bar {
    color: var(--bs-white);
    position: relative;
    top: 25px;
    left: 15px;
}

.timepicker-overlay,
.timepicker-backdrop-overlay {
    z-index: 100002 !important;
}

.dynamic-buttons li.list-inline-item.moreMenu mat-icon {
    background: var(--bs-primary);
    height: 38px;
    border-radius: 50%;
    color: #fff !important;
    padding: 7px;
    width: 38px;
    top: 5px;
}

.dynamic-buttons li.list-inline-item.moreMenu mat-icon:focus {
    background: var(--bs-secondary);

}

div#v-pills-tabContent aesworkflow {
    position: relative;
    top: 5px;
}

i.AeSTexboxPwdIcon {
    color: var(--bs-primary);
    font-weight: 600;
    position: relative;
    top: -5px;
}

#loginpanel .mat-checkbox-label {
    color: var(--bs-darkgrey) !important;
}

.admin-overview-modal {
    display: contents;
}

.admin-overview-modal .iframeContainerClass2 {
    margin-top: 30px !important;
    width: 100%;
    position: absolute;
    top: 35px;
    right: 1px;
    bottom: 1px;
    left: 0px;
    height: 100% !important;
}

.admin-overview-modal.aes-popup mat-dialog-container {
    height: 100% !important;

}

.fullwidth-dialog-close {
    top: -3px;
    float: right;
    text-align: right;
    right: 14px;
    position: absolute;
    z-index: 9999;
    width: 100%;
    color: var(--bs-bodyTxt) !important;
}

.mat-tab-group {

    margin-top: 24px;
}

.mat-form-field-appearance-outline .mat-form-field-outline-thick {
    color: var(--bs-primary) !important;
}

div#addedfromapproval aesworkflow {
    position: relative;
    top: -16px;
}

span.mat-expansion-indicator {
    padding-right: 0px;
}

.calender_time {
    font-size: 10px;
    color: var(--bs-Widget-Duration);
}

#addedfromapproval .top_header {
    padding-top: 18px;
}

aesfileupload .p {
    margin-top: 0;
    margin-bottom: 0rem;
}

span.clk-delete .material-icons {
    font-size: 16px !important;
}

lib-aeswrapperdialog aesworkflow {
    position: relative;
    top: -15px;
}

.mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick,
.mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {
    color: #f44336 !important;
}

.tab-badge {
    /* position: absolute; */
    /* z-index: 1000000; */
    display: block;
    height: 24px;
    width: 24px;
    background: var(--bs-white);
    border-radius: 50%;
    border: 1px solid var(--bs-primary);
    font-size: 10px;
    color: var(--bs-primary);
	text-align: center;
	align-content: center;
    margin-left: 8px;
    color: var(--bs-primary);
}

.line-tab .mat-tab-label-active .tab-badge {
    height: 24px;
    width: 24px;
    background: var(--bs-secondary);
    border: 1px solid var(--bs-secondary);
    border-radius: 50%;
    font-size: 10px;
    color: var(--bs-white);
	text-align: center;
	align-content: center;
    margin-left: 8px;
}

.popup-title h2 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 28px !important;
    /* padding-bottom: 10px !important; */
}

.print-btn {
    color: var(--bs-primary);
}

.print-btn:hover {
    opacity: 0.6;
    color: var(--bs-primary);
}

.pillsSubmenu {
    width: 588px;
    position: relative;
    top: 15px;
}

.angular-editor-textarea {
    overflow: auto !important;
}

lib-aesconfirmpopup {
    display: block;
    position: relative;
    height: auto !important;
    display: block;
    bottom: 0;
}



lib-aesconfirmpopup .mat-dialog-content {
    margin-bottom: 140px;
    padding-top: 22px;
    /*  padding-left: 0px; */
    text-align: justify;
    padding-right: 0px;
}

#addedfromapproval .dynamic-table td {
    /* max-width: 179px;*/
}

.accordin-desc {
    line-height: 25px;
}

.BtnPopupSubmit2 .mat-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial;
}

.BtnPopupSubmit2 .mat-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}

aesbutton.BtnPopupSubmit2 {
    width: 100% !important;
    background: none;
}

.BtnPopupSubmit {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial;
}

/* mobile responsive table */
@media screen and (max-width: 600px) {
    .responsive-tables table {
        border: 0;
    }

    .responsive-tables table caption {
        font-size: 1.3em;
    }

    .responsive-tables table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .responsive-tables table tr {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }

    .responsive-tables table td {
        border-bottom: 1px solid #ddd;
        display: block;
        /* font-size: .8em; */
        text-align: right;
        padding-top: 12px;
    }

    .responsive-tables table td::before {
        /*
      * aria-label has no advantage, it won't be read inside a table
      content: attr(aria-label);
      */
        content: attr(data-label);
        float: left;
		font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 14px !important;
    }

    .responsive-tables table td:last-child {
        border-bottom: 0;
    }

    .form-title {
        white-space: normal !important;
        padding-left: 12px;
        margin-bottom: 0px;
        padding-top: 0px;
    }

}

/* Rating star recruitment */
.star-full {
    background: var(--bs-primary);
}

.star-half {
    background: var(--bs-primary);
}

.star-empty {
    background: var(--bs-primary);
}

.mat-action-menu {
    position: relative;
    right: 10px;
}

.chip-maticon {
    font-size: 20px;
    position: relative;
}

.data-popup .popup-title h2 {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 28px !important;

}

.tab-content.notify2 {
    min-width: unset !important;
}

.maxwidth-425 {
    max-width: 425px !important;
}

.balance-count {
    position: relative;
    top: -23px;
    float: right;
}

.aesgrid-add-btn-top {
    position: relative;
    top: 62px;
    /* right: 17px; */
    z-index: 10000;
}

.date-column-grid {

    white-space: nowrap !important;
}

.user-img-box .dynamic-table {
    overflow: hidden;
}

.user-img-box .dynamic-table .mat-form-field-wrapper {
    min-width: unset !important;
}

/* onboarding app mobile view:*/

@media only screen and (max-width: 768px) {

    /* css for lta-reimbursement */

    lib-aesconfirmpopup {
        max-height: 80vh !important;
    }

    .multi-data-Widget .border-right {
        border-right: none !important;
    }

    .cdk-overlay-pane.aes-popup {
        width: 100% !important;
        max-width: 100% !important;
    }

    .aes-popup .mat-dialog-container {

        max-height: unset !important;
    }

    body {
        overflow-y: auto;
    }

    .tab-content {
        min-width: unset !important;
    }

    /* For mobile view breadcrumb */

    .BreadCrumLink {
        display: none;
    }

    app-dashboard-overview .BreadCrumLink {
        display: block !important;
    }

    app-personal-information-management-system .BreadCrumLink {
        display: block !important;
    }

    app-onboarding .BreadCrumLink {
        display: block !important;
    }

    /* For mobile view breadcrumb END */

    #wrapper {
        padding-bottom: 100px;
    }

    [class*="col-"] {
        max-width: 100% !important;
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    [class*="col"] {
        max-width: 100% !important;
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    ::-webkit-scrollbar {
        width: 0px !important;
        height: 0px !important;
    }


    .main-sidenav.mat-drawer.mat-drawer-side {
        display: none;
    }

    button.floatbar-toggle.transparent-btn {
        display: none !important;
    }

    .iframeContainerLanding {

        padding-left: unset !important;
        height: calc(117vh - 63px) !important;

    }

    .horizontal-progress {

        margin-left: 30px;
        margin-bottom: 20px;

    }

    /* Profile view mobile  */
    .wf-level-txt {
        position: relative !important;
        top: -7px !important;
        height: 100% !important;
    }


    .col-2.wf-level {
        flex: 100% !important;
        margin-top: unset !important;
    }

    .wf-image {
        padding-left: 15px !important;
        padding-top: 5px !important;
        text-align: center !important;
    }

    .wf-name {
        text-align: center !important;
        top: -4px !important;
        position: relative !important;
    }

    .wf-card {
        min-width: 206px !important;

    }

    /*
  .onbehalf {   
    display: none!important;
}
*/

    aesonbehalfof {
        display: none !important;
    }

    .divDialogCloseInner {
        top: -50px !important;
        left: -6px !important;
    }

    .datagrid-add {
        position: relative !important;
        right: 16px !important;
    }

    .AeSToasterValidation .mat-dialog-container {

        width: 94% !important;
        margin: auto !important;

    }

    .AeSToasterSuccess .mat-dialog-container {

        width: 94% !important;
        margin: auto !important;
    }

    .AeSToasterWarning .mat-dialog-container {
        width: 94% !important;
        margin: auto !important;
    }

    .AeSToasterWarning .tittle span {
        margin-left: unset !important;
    }

    .AeSToasterValidation .tittle span {
        margin-left: unset !important;
        ;
    }

    /* body {
    overflow-x: hidden !;
    background: rgb(255 255 255);
} */


    .row.horizontal-cards {
        width: 100% !important;
        margin: auto;
        padding: 12px 12px 12px 13px !important;
    }

    .scrollable2 {
        height: calc(84vh - 63px);
        overflow-y: auto !important;
    }

    .dynamic-approvals {
        max-height: unset !important;
        overflow-x: unset !important;
        overflow-y: unset !important;
    }
	

    .main-counter-box {
        margin-right: 24px;
        padding-top: 20px;
        border-radius: 15px;
        margin-top: 13px;
        margin-bottom: 10px;
        width: 160px;
        height: 120px;
        text-align: center;
        background: var(--bs-card-background);
        box-shadow: 0px 4px 16px #EAEAEA;
        border-radius: 15px;
        display: inline-block;
        float: unset !important;
        transition: transform .2s;
    }

    aeskpiwidget .hello {
        text-align: center;
    }

}

/* onboarding app mobile view END:*/


/* For drop down zoom text trim issue 
  .mat-form-field {
    line-height: initial !important; 
}
*/
/* For drop down zoom text trim issue */
.aes-popup .BtnSubmit .mat-button {
    margin-left: unset !important;
    /* min-width:unset !important; */
    width: 100% !important;
}

.aes-popup .BtnSave .mat-button {
    margin-left: unset !important;
    /* min-width:unset !important; */
    width: 100% !important;
}

div#loginpanel .mat-checkbox-inner-container {
    height: 20px !important;
    width: 20px !important;
}

aeslabel.forgotpassword {
    cursor: pointer;
    color: var(--bs-darkgrey) !important;
}

.dashboard-helptext {
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: 80px;
    z-index: 1000;
}

#datasourcevisible .aesRadioLabel {
    display: block;
    position: relative;
    margin-bottom: 5px;
}

.app-text {
    width: 300px;
    /* padding-right: 0px; */
}

table.app-table td {
    padding-right: 0px;
}

.AeSGridExport {
    position: relative;
    right: 5px;
    font-size: 20px;
}

.approve-actions {
    min-width: 80px;
}

app-approval .counter-number h1 {
    font-family: 'Montserrat-Bold', Arial !important;
}

.new_subtitle {
    padding-top: 30px;

}

.new_subtitle2 {
    font-family: 'Montserrat-Medium', Arial !important;
    font-size: 16px !important;
    font-weight: 500;
    padding-top: 20px;
    padding-bottom: 20px;
}

.new_formtitle {
    padding-left: 14px;

}

.form-panel {
    padding-top: 20px;
}

.multi-accordion .card-header {
    height: 85px;
    padding: 10px 0px;
    background: transparent;
    border-top: 1px solid #cfcfcf6b;
    border-bottom: 0px;
}

.Competency_accordion .card:first-child .card-header:first-child {
    border-top: unset
}

.Competency_accordion .card-body .col-12 {
    padding: 0px 0px;
}

.Competency_accordion .card-body .col-12 .row .col-12 {
    padding: 0px 8px !important;
}

.multi-accordion .card-header:after {
    position: relative;
    top: 20px;
    /*   font-family: 'FontAwesome';
    content: "\f068";
    float: right;
    color: var(--bs-primary); */
    font-family: 'FontAwesome';
    content: "\2039";
    float: right;
    color: var(--bs-primary);
    transform: rotate(90deg);
}

.multi-accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    /*  content: "\f067"; */
    content: "\2039";
    transform: rotate(270deg);
}

.empty.card-header:after {

    display: none;

}

.empty.card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    display: none;
}

.accordin-add-btn {
    position: relative;
    top: 6px;
    left: 4px;
    padding: 6px 14px;
    align-items: center;
    /* border-radius: 100px; */
    /* border: 2px solid var(--bs-primary); */
    color: var(--bs-primary);
}

.Btnsmall-Trans .mat-button {
    min-width: 92px;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 0px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    padding: 0px;
}

.multi-accordin-title {
    position: relative;
    top: 12px;

}

.accordin-add-btn.empty {
    display: none;
}

.multi-accordion .card-body {
    padding: 0px;
}

.accordin-add-btn:hover {
    opacity: 0.5;
}

.mat-button:hover {
    background-color: none !important;
}

.mat-button-focus-overlay {
    background: none;
}

.grid-add-link {
    padding-top: 20px;
    padding-bottom: 25px;
}

@media only screen and (max-width: 600px) {

    .aesRadioLabel {
        padding-right: 0px !important;
    }

    mat-label.aesRadioLabel.h11.pr-3.align-top {
        padding-right: 0px !important;
    }
}

span.NavListAddRow.clicker {
    font-weight: 600;
    position: relative;
    bottom: 10px;
}

.horizontal-cards .col.text-right {
    -ms-flex: 0 0 auto !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 100% !important;
}

/* year planner css */
.year-table.table {
    border-collapse: inherit;
    border-spacing: 0px;
}

.year-table.table tr:first-child th:first-child {
    border-top-left-radius: 10px !important;
}

.year-table.table tr:first-child th {
    font-family: 'OpenSans-Bold';
    color: var(--bs-Widget-Duration);
}

.year-table.table tr:first-child th:last-child {
    border-top-right-radius: 10px !important;
}

.year-table.table td,
.year-table.table th {
    padding: 4px;
    text-align: center;
    background: var(--bs-card-background);
}

.year-circle-icon i {
    font-size: 10px;
    text-align: center;
}

.year-calendar-legend2 {
    margin-top: 10px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;
    padding-right: 17px;
}

.year-calendar-legend2 li i {
    padding-right: 10px;
}

.att_color_holiday i {
    color: #ffbf00;
}

.att_color_Approved_Plan_Leave i {
    color: #7ddd33;
}

.att_color_Pending_Plan_Leave i {
    color: #c9c9c9;
}

.yearcal-bg-month {
    background: var(--bs-even-row-color) !important;
}

table.table.year-table.table-bordered th {
    border: 1px solid #ebeef1;
}

table.table.year-table.table-bordered td {
    border: 1px solid #ebeef1;
}

.yearcal-bg-month {
    border: 1px solid #dee2e6 !important;
}


/* year planner css END */
.highlight {
    color: var(--bs-highlight-text);
}

.mat-header-cell:first-of-type {
    padding-left: 26px;
}

.onbehalf-two-column {
    padding-right: 37px;
}

.ireport-dialog-close {
    top: -25px;
    float: right;
    text-align: right;
    right: -20px;
    position: absolute;
    z-index: 9999;
    width: 100%;
    color: var(--bs-bodyTxt) !important;
}

.admin-overview-modal .ireportContainerClass2 {
    margin-top: 0px !important;
    width: 100%;
    position: absolute;
    top: 35px;
    right: 1px;
    bottom: 1px;
    left: 0px;
}

.phl_base {
    width: 100%;
    margin: auto;
}

/*For mobile app login */
.mobile-app-download {
    overflow: hidden;
    background: #CAE3F3;
    height: 100%;
    position: relative;
    margin: auto;
    width: 100%;
    /* height: 136vh; */
}

.mobile-app-logo img {
    position: relative;
    top: 15px;
    width: 140px;
    height: 140px;
    flex-shrink: 0;
}

.app-message {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 15px !important;
    font-weight: 600;
    text-align: center;
    line-height: 24px;
    /* 150% */
}

.app-message2 {
    overflow-wrap: normal;
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 14px !important;
    font-weight: 500;
    text-align: center;
    line-height: 24px;
    max-width: 235px;
    margin: auto;
}

.appimg {
    position: relative;
    top: 40px;
}

.mobile-app-screen1 img {
    position: relative;
    top: 40px;
    right: 50px;
    transform: rotate(352deg);
    height: 157px;
    width: 72px;
    ;
}

.mobile-app-screen2 img {
    transform: rotate(6deg);
    position: relative;
    top: -132px;
    left: 25px;
    height: 157px;
    width: 72px;
}

.app_btn img {
    height: 58px;
    width: 184px;
}

.app-login .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white !important;
    border-radius: 10px;
}

/*UAE CSS */
.uae-parent-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.uae-app-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* 	height: 100vh; */
    max-width: 494px;
    width: 100%;
    margin-left: 15px;
    margin-right: 15px;
}

.uae-uaepass-logo {
    max-width: 180px;
    object-fit: contain;
    width: 100%;
    height: 120%;
}

.uae-polling-authentication {
    width: 100%;
    height: auto;
    margin: 20px 0 11px;
    /* 	padding: 31px 43px 56px; */
    padding: 0px 60px 30px 60px;
    border-radius: 12px;
    border: solid 1px #d8d8d8;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.uae-polling-identity-confirmation {
    margin-bottom: 5px;
    margin-top: 10px;
    text-align: center;
    color: var(--bs-primary);
}

.uae-polling-service-provider {
    /* 	height: 24px; */
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 1.33;
    text-align: center;
    letter-spacing: normal;
}

.uae-polling-authentication-png {
    max-width: 203.9px;
    height: auto;
    width: 100%;
    margin-top: 5px;
    object-fit: contain;
}

.uae-open-uaepass-app {
    width: 408px;
    height: 24px;
    margin: 15px 0 5px;
    object-fit: contain;
    line-height: 1.14;
    text-align: center;
    letter-spacing: normal;
}

.uae-headerImageLink {
    margin-top: 30px;
    margin-bottom: 10px
}

.uae-notification-message {
    width: 100%;
    max-width: 300px;
    height: 48px;
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 1.5;
    text-align: center;
    letter-spacing: normal;
    line-height: 1.5;
}

.uae-wait-gif {
    width: 120px;
    height: auto;
}

.uae-waiting {
    margin: 8px 0 0;
    font-size: 0.85;
    line-height: 1.41;
    text-align: center;
    color: #78849e;
}


.uae-ids-logo {
    width: 14px;
    height: 10px;
    object-fit: contain;
    position: absolute;
    left: 0;
    margin-bottom: 1em;
}


.uae-polling-footer {
    position: relative;
    width: 100%;
}

@media only screen and (max-width: 600px) {

    .uae-uaepass-logo {
        max-width: 120px;
    }

    .uae-polling-authentication-png {
        max-width: 150px;
    }

    .uae-polling-authentication {
        padding: 25px;
        max-width: 280px;
    }
}


@media only screen and (max-width: 360px) {

    .uae-uaepass-logo {
        max-width: 110px;
    }

    .uae-polling-authentication-png {
        margin-top: 5px;
        max-width: 120px;
    }

    .uae-polling-authentication {
        padding: 20px;
        max-width: 280px;
    }

    .uae-polling-footer {
        position: relative;
        width: 80%;
    }
}

.phl_base .container-fluid {
    padding-right: 33px;
    padding-left: 33px;
}

.absense-calendar .mat-tab-body-content {
    min-height: 130vh;
}

/*for aspx iframe */
@media (-webkit-min-device-pixel-ratio: 1.25) {

    .iframeContainerClass1 {
        min-height: 170vh;

    }
}

table.calendar-table tr td:last-child .ngxp__container {
    margin-right: 220px !important;
}

table.calendar-table tr:last-child td .ngxp__container {
    margin-top: -20px !important;
    margin-right: 150px !important;
}

@media only screen and (max-device-width: 1366px) {

    .login-logo img {
        /* height: 30px; */
        max-height: 60px !important;
        max-width: 150px;
    }

    .absense-calendar .mat-tab-body-content {
        min-height: 170vh;
    }

    table.calendar-table .ngxp__container {

        margin-right: 150px !important;
    }
}

.mat-dialog-content {

    max-height: unset !important;
}

#AfdIframe.AeSToasterWarning {
    margin-top: 260px !important;
    width: 563px !important;
    max-width: 563px !important;
    position: absolute !important;
    top: 0px !important;
}

/*new css 18/8/2023 */
.line-tab-dash .mat-tab-label {
    min-width: unset !important;
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 20px !important;
    color: var(--bs-bodyTxt) !important;
    padding: 0px !important;
    margin-right: 30px;


}

.line-tab-dash .mat-tab-label-content {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 20px !important;
    color: var(--bs-bodyTxt) !important;
    padding: 0px !important;

}

.line-tab-dash .mat-tab-header {
    width: 100%;
    margin: auto;
}

.mfa-chip-pin {
    display: inline-block;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 32px;
    padding-right: 2px;
    cursor: pointer;
    margin-left: 17px;
    margin-right: 5px;
    margin-bottom: 20px;
    border-radius: 100px;
    border: 2px solid var(--bs-primary);
    color: var(--bs-primary);
    float: left;


}

.mfa-chip-pin .chip-pin {
    position: relative;
    top: 2px;
}

.mfa-chip-pin:hover {
    background: var(--bs-secondary);
    color: var(--bs-white);
    border-color: var(--bs-secondary);
    text-decoration: none;
}

.pin-badge {
    position: relative;
    /* z-index: 1000000; */
    display: block;
    height: 24px;
    width: 24px;
    background: var(--bs-primary);
    border-radius: 50%;
    border: 1px solid var(--bs-primary);
    font-size: 10px;
    color: var(--bs-primary);
    padding: 4px 4px 4px 4px;
    margin-left: 8px;
    color: var(--bs-white);
    float: right;
    top: -17px;
    left: 4px;
}

.pin-badge i {
    position: relative;
    top: -2px;
    left: 1px;
    transform: rotate(45deg);
    font-size: 12px;
}

span.pin-chip {
    position: relative;
    top: 2px;
    display: inline-block;
    max-width: 354px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.pin-message {
    color: var(--bs-darkgrey);
    padding: 10px;
    margin-bottom: -6px;
    position: relative;
    top: -18px;
    left: 4px;
}


/*pin badge 2 */
.pin-badge2 {
    position: relative;
    /* z-index: 1000000; */
    display: block;
    text-align: center;
    height: 24px;
    width: 24px;
    top: 15px;
    background: var(--bs-white);
    border-radius: 50%;
    border: 1px solid var(--bs-primary);
    font-size: 10px;
    color: var(--bs-white);
}

.pin-badge2.pinned {
    background: var(--bs-primary);
}

.pin-badge2.pinned i {

    color: var(--bs-white);
}

.pin-badge2 i {
    position: relative;
    top: 3px;
    text-align: center;
    color: var(--bs-primary);
    top: 5px;
    left: -2px;
    transform: rotate(45deg);
    font-size: 12px;
}

/*pip pop badge */
.pin-badge-pop {
    position: relative;
    /* z-index: 1000000; */
    display: block;
    height: 24px;
    width: 24px;
    color: var(--bs-primary);
    float: right;

}

.pin-badge-pop i {
    display: inline-block;
    border-radius: 60px;
    background: var(--bs-primary);
    padding: 7px 7px;
    color: var(--bs-white);
    margin-left: 1px;
    transform: rotate(45deg);
    position: relative;
    top: -22px;
    height: 24px;
    width: 24px;
}

.mfa-chip-pin-pop {
    display: inline-block;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 32px;
    padding-right: 2px;
    cursor: pointer;
    margin-right: 20px;
    margin-bottom: 20px;
    border-radius: 100px;
    border: 2px solid var(--bs-primary);
    color: var(--bs-primary);
}

.pin-badge-button i {
    font-size: 12px;
    display: inline-block;
    border-radius: 60px;
    background: var(--bs-primary);
    padding: 7px 7px;
    color: var(--bs-white);
    margin-left: 1px;
    transform: rotate(45deg);
    position: relative;
    margin-left: 5px;
    height: 24px;
    width: 24px;
    vertical-align: middle;

}

.page-title_new {
    margin-bottom: 10px;
}

/*payroll */


.page-search-icon {
    border: 1px solid var(--bs-secondary);
    padding: 2;
    display: inline-block;
    border-radius: 50%;
    padding: 10px 10px;
    position: relative;
    top: 4px;
    font-size: 16px;
    color: var(--bs-primary);
}


.line-tab .mat-tab-label-active {
    font-weight: 700 !important;
}

.line-tab .mat-tab-label-active {
    border-bottom: 5px solid var(--bs-primary);
}

.mat-ripple:not(:empty) {
    transform: translateZ(0);
}

.mat-tab-group,
.mat-tab-label,
.mat-tab-link {
    font-family: inherit !important;
}

.mat-tab-label-active {
    color: var(--bs-white) !important;
    font-weight: 700;
}

.mat-tab-label {
    height: 40px !important;
    border-top-left-radius: 5px;
    background: transparent;
    opacity: 6.6 !important;
    z-index: 9999;
    position: relative !important;
    /* min-width: 248px !important; */
    letter-spacing: 0.04em;
}

.v2.mat-tab-label {
    padding: 0 0px !important;
}

.line-tab.mat-tab-header {
    margin-left: 0px !important;
}

.grid-sort i {
    color: var(--bs-primary);
    font-size: 12px;
    font-weight: 600;
}

.process-chip {
    padding: 2px 12px 4px 12px;
    background: var(--bs-light-primary);
    border-radius: 34px;
    font-size: 10px;
    color: var(--bs-white);

}

.processed-chip {
    padding: 2px 12px 4px 12px;
    background: var(--bs-secondary);
    border-radius: 34px;
    font-size: 10px;
    color: var(--bs-white);

}

.new-grid-srch .mat-form-field-wrapper {
    padding-bottom: 0px !important;
}

/* .flag-menu {
    min-width: 100px;
    max-width: 100%;
} */

.flag-menu-img {
    border-radius: 28px;
    width: 28px;
    height: 28px;
}

.flag-menu .mat-select-value {
    display: contents;
    position: relative;
    left: 10px;
}

.flag-menu .mat-select-value-text {
    padding-right: 3px;
}

.new-calendar-menu .mat-select-value {
    display: contents;
    position: relative;
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
    color: var(--bs-primary) !important;
}

.new-cal-heading {
    position: relative;
    top: 2px;
}

.mat-table {
    font-family: inherit !important;
}

.mat-table thead th:last-child {
    border-top-right-radius: 8px !important;
}

.grid-chk-box {
    position: relative;
    top: 3px;
}

.grid-head {
    position: relative;
    top: 4px;
}

/*compensation overview */
.horizontal-widget-top {
    height: 88px;
    border-radius: 8px;
    border: 1px solid var(--bs-secondary);
    background: var(--bs-card-background);
}

.express-widget {
    background: var(--bs-light-secondary);
    width: 170px;
    height: 56px;
    border-radius: 8px;
    float: right;
    margin: 16px;
    text-align: center;
}

.express-title {
    max-width: 140px;
    position: relative;
    top: 8px;
    left: 12px;
    right: 12px;
    bottom: 12px;
    text-align: center;


}

.pay-widget-left-image img {
    width: 94px;
    height: 98px;
    position: relative;
    top: -19px;
}

.pay-widget-text {
    position: relative;
    top: 12px;
    color: var(--bs-darkgrey);
}

.pay-asterisk li {
    padding: 5px;
    position: relative;
    top: 15px;

}

.pay-toggle {
    position: relative;
    top: 10px;
    color: var(--bs-darkgrey);
    font-size: 12px;
}

.pay-toggle2 {
    position: relative;

    color: var(--bs-darkgrey);
    font-size: 12px;
}

.mat-slide-toggle-content {
    font-family: inherit !important;
}

.pay-down-icon {
    color: var(--bs-primary);
}

.pay-table.mat-table thead th {
    padding-left: 20px !important;
    font-family: 'OpenSans-SemiBold', Arial !important;
    font-size: 14px !important;
}

.pay-table.mat-table tr td {
    padding-left: 20px !important;
    white-space: normal;
}

.pay-table.dynamic-table tbody tr:nth-child(odd) {
    background: var(--bs-even-row-color);
}

.pay-table.dynamic-table tbody tr:nth-child(even) {
    background: var(--bs-odd-row-color);
}

.pay-total-desc {

    height: 60px;
    border-radius: 8px;
    background: var(--bs-odd-row-color);
}

.pay-desc {
    position: relative;
    left: 22px;
    top: 8px;
}

.fin-fact {
    max-width: 359px;
    height: 256px;
    border-radius: 15px;
    background: var(--bs-light-primary);
}

.fin-fact-text {
    position: relative;
    left: 25%;
    top: 30px;
}

.filter-widget {

    border-radius: 8px;
    border: 1px solid var(--bs-text-field-border);
    background: var(--bs-filter-widget-bg);
    padding-left: 16px;
    padding-top: 25px;
    min-height: 104px;

}

.wd140 {
    width: 155px;
}

.wd83 {
    width: 83px;
}

.from-date-label {
    position: absolute;
    top: -10px;
    color: var(--bs-darkgrey);
}

.to-date-label {
    position: absolute;
    top: -10px;
    color: var(--bs-darkgrey);
}

.apply-link {
    position: relative;
    left: 21px;
    top: -37px;
}

.line-tab-all .mat-tab-label {
    min-width: unset !important;
    /* color: var(--bs-bodyTxt) !important; */
    padding: 0px !important;
    margin-right: 30px;


}

.line-tab-all .mat-tab-label-content {

    /* color: var(--bs-bodyTxt) !important; */
    padding: 0px !important;

}

.line-tab-all .mat-tab-header {
    width: 100%;
    margin: auto;
}

.loan-data-widget {
    min-height: 84px;
    border-radius: 8px;
    flex-shrink: 0;
    background: var(--bs-filter-widget-bg);
    box-shadow: 0px 1px 6px 0px #EAEAEA;
    border: 1px solid var(--bs-low-light-grey);
    padding: 24px;
}

.RatingClassNorm {
    padding-left: 100px;

}

.NormCurveSetup {
    display: inline-block;

}

/*ADDED 30.08.23 */

/* .donut-chart {    
    display: block;
    width: 66px;
    height: 66px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);   
    border: 10px solid #EAA9A9;
    border-top: 10px solid #EAA9A9;
    border-left: 10px solid #2C6691;    
    border-radius: 100%;
} */


/*----------------*/
.donut-chart-svg-item {
    transform: rotate(253deg);
    width: 100%;
    font-size: 16px;
    margin: 0 auto;
    animation: donutfade 1s;
}

@keyframes donutfade {

    /* this applies to the whole svg item wrapper */
    0% {
        opacity: .2;
    }

    100% {
        opacity: 1;
    }
}

@media (min-width: 992px) {
    .donut-chart-svg-item {
        width: 80%;
    }
}

.donut-chart-donut-ring {
    stroke: var(--bs-primary);
}

.donut-chart-donut-segment {
    transform-origin: center;
    stroke: #FF6200;
}

.donut-chart-donut-segment-2 {
    stroke: #FCD139;
    animation: donut1 3s;
}

/* .donut-chart-donut-segment-3 {
    stroke: #d9e021;
    animation: donut2 3s;
}

.donut-chart-donut-segment-4 {
    stroke: #ed1e79;
    animation: donut3 3s;
} */

.donut-chart-segment-1 {
    fill: #ccc;
}

.donut-chart-segment-2 {
    fill: aqua;
}

.donut-chart-segment-3 {
    fill: #d9e021;
}

.donut-chart-segment-4 {
    fill: #ed1e79;
}

.donut-chart-donut-percent {
    animation: donutfadelong 1s;
}

@keyframes donutfadelong {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes donut1 {
    0% {
        stroke-dasharray: 0, 100;
    }

    100% {
        stroke-dasharray: 69, 31;
    }
}

@keyframes donut2 {
    0% {
        stroke-dasharray: 0, 100;
    }

    100% {
        stroke-dasharray: 30, 70;
    }
}

@keyframes donut3 {
    0% {
        stroke-dasharray: 0, 100;
    }

    100% {
        stroke-dasharray: 1, 99;
    }
}

.donut-chart-donut-text {
    font-family: Arial, Helvetica, sans-serif;
    fill: #FF6200;
}

.donut-chart-donut-text-1 {
    fill: aqua;
}

.donut-chart-donut-text-2 {
    fill: #d9e021;
}

.donut-chart-donut-text-3 {
    fill: #ed1e79;
}

.donut-chart-donut-label {
    font-size: 0.28em;
    font-weight: 700;
    line-height: 1;
    fill: #000;
    transform: translateY(0.25em);
}

.donut-chart-donut-percent {
    font-size: 0.5em;
    line-height: 1;
    transform: translateY(0.5em);
    font-weight: bold;
}

.donut-chart-donut-data {
    font-size: 0.12em;
    line-height: 1;
    transform: translateY(0.5em);
    text-align: center;
    text-anchor: middle;
    color: #666;
    fill: #666;
    animation: donutfadelong 1s;
}




/* ---------- */
/* just for this presentation */

.donut-chart-svg-item {
    display: inline-block;
}

.loan-data-widget2 {
    height: 84px;
    border-radius: 8px;
    flex-shrink: 0;
    background: var(--bs-odd-row-color);
    border: 1px solid var(--bs-low-light-grey);
    margin-top: 16px;
}

.donut-data-content-bold {
    font-weight: 600;
}

.donut-data-content-data {
    position: relative;
    top: 5px;
    color: var(--bs-darkgrey);
    width: 97px;
    left: 7px;
    line-height: 17px !important;
}

.donut-data-divider2 {
    border-right: 1px solid #74748D;
    opacity: 0.16;
    height: 41px;
    position: absolute;
    top: 20px;
    left: 2px;
}

.donut-chip-primary {
    border-radius: 34px;
    display: flex;
    width: 60px;
    padding: 2px 12px;
    align-items: center;
    gap: 10px;
    background: var(--bs-primary) !important;
    color: var(--bs-white);
    font-size: 10px;

    line-height: 10px;
    /* 100% */
}

.donut-chip-rejected {
    border-radius: 34px;
    color: var(--bs-white);
    font-size: 10px;
    line-height: 10px;
    /* 100% */
    display: flex;
    width: 60px;
    padding: 2px 12px;
    align-items: center;
    gap: 10px;
    background: var(--bs-chiprejected) !important;
}

.donut-popover {
    display: none;
    width: 110px;
    height: 97px;
    flex-shrink: 0;
    border-radius: 8px;
    border: 1px solid var(--bs-light-blue);
    background: var(--bs-table-light-grey);
}

.donut-popover-show {
    position: relative;
    top: -3px;
    cursor: pointer;
}

.donut-popover-legend1 {
    width: 4px;
    height: 28px;
    border-radius: 10px;
    background: var(--bs-primary);
    position: relative;
    left: 10px;
    top: 10px;
}

.donut-popover-legend2 {
    width: 4px;
    height: 28px;
    border-radius: 10px;
    background: var(--bs-chiprejected) !important;
    position: relative;
    left: 10px;
    top: 0px;

}

.donut-popover-show:hover .donut-popover {

    display: block !important;
    z-index: 100000;
    position: absolute;
    top: -98px;


}

.donut-popover li {
    display: inline;
}

.donut-popover-amt {
    position: relative;
    top: -16px;
    left: -30px;

}

.donut-popover-desc {
    color: var(--bs-bodyTxt-light);
    position: relative;
    top: -16px;
    left: -14px;
    padding-top: 4px;
}

.donut-popover-amt1 {
    position: relative;
    top: -24px;
    left: -30px;
}

.donut-popover-desc1 {
    position: relative;
    top: -24px;
    left: -14px;
    padding-top: 4px;
}

.left-nav-status-date {
    position: absolute;
    right: 10px;
    float: right;
    top: 48px;
    z-index: 100000;
    width: 100%;
    text-align: right;
    color: var(--bs-bodyTxt-light);
}

.new-calendar-menu2 .mat-select-value {
    display: contents;
    position: relative;
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
    color: var(--bs-primary) !important;
}

.new-calendar-menu2 .mat-select {
    position: relative !important;
    top: -3px !important;
}



/*Dynamic table 2 */
.dynamic-table2 {
    border: 0px;
}

.dynamic-table2 table thead th {

    border: 0px !important;
}

.dynamic-table2 thead:first-child tr:first-child th:first-child {
    border-top-left-radius: 10px !important;
}

.dynamic-table2 thead:first-child tr:first-child th:last-child {
    border-top-right-radius: 10px !important;
}

.dynamic-table2 tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
}

.dynamic-table2 tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

.dynamic-table2 thead {
    background-color: var(--bs-dynamic-thead);
}

/* .dynamic-table  th {
    border-top:0px !important;
} */


.dynamic-table2 tr:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

.dynamic-table2 tr:nth-child(even) {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table2 th {
    background-color: var(--bs-odd-row-color);
}

.dynamic-table2 .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;
}

/* .dynamic-table2 thead tr th {
    border-bottom: 0px !important;
    padding: 12px;
} */
.dynamic-table2 .longtext {
    min-width: 422px;
}

.dynamic-table2 .longbox {
    min-width: 187px;
}

.dynamic-table2 .dynamic-amt {
    max-width: 120px;
}

.dynamic-table2 .mat-form-field-appearance-outline .mat-form-field-wrapper {
    margin: 0;
}

.dynamic-table2 .mat-form-field-wrapper {
    padding-bottom: 0px;
}

.dynamic-table2 .table td,
th {
    vertical-align: middle;
}

.dynamic-table2 .table th {
    vertical-align: middle;
}

.dynamic-table2 .table tr {
    padding-left: 4px;
}

.responsive-tables .dynamic-table.mat-table tbody tr:nth-child(odd) {
    background: var(--bs-even-row-color);
}

.responsive-tables .dynamic-table.mat-table tbody tr:nth-child(even) {
    background: var(--bs-odd-row-color);
}

.disable-link {
    color: var(--bs-disable-stat);
}

.accordin-title_new {
    position: relative;
    top: 20px;
}

.grid-file-count {
    width: 18px;
    height: 18px;
    line-height: 20px;
    border-radius: 50%;
    color: var(--bs-white);
    text-align: center;
    display: block;
    background: var(--bs-secondary);
    padding-top: 4px;
    position: relative;
    left: 18px;
    top: 10px;
}

/* PAYROLL CSS */
.sticky-table.pay-table {

    width: 100%;
    overflow-x: scroll;
}

.sticky-table table * {
    border: none;
}

.sticky-table td {
    min-width: 140px;
    text-wrap: nowrap;
}

.sticky-table th {
    min-width: 140px;
    text-wrap: nowrap;
}

.sticky-table table thead tr {
    color: #2d3748;
    font-size: 1rem;
    font-weight: 500;
    text-align: left;
}

.sticky-table table thead tr th {
    background: var(--bs-odd-row-color) !important;
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
}

.sticky-table table tbody tr:nth-child(odd) td {
    background-color: var(--bs-even-row-color);
}

.sticky-table table tbody tr:nth-child(even) td {
    background-color: var(--bs-odd-row-color);
}

.sticky-table table tbody td {
    text-align: left;
    vertical-align: middle;
    padding-left: 24px;
}

.sticky-table table tr:last-child td:first-child {
    border-bottom-left-radius: 0.5rem;
}

.sticky-table table th:first-child {
    border-top-left-radius: 0.5rem;
}

.sticky-table table tr:last-child td:last-child {
    border-bottom-right-radius: 0.5rem;
}

.sticky-table table th:last-child {
    border-top-right-radius: 0.5rem;
}

/* .sticky-table table tr > th:first-child, table tr > td:first-child {
    position: sticky;
    min-width: 200px;
    left: 0;
  } */

.sticky-table table tr td:nth-child(2),

/* .sticky-table table th:nth-child(2) { 
     position: -webkit-sticky;
    position: sticky;   
    left: 200px;
    min-width: 200px;
  } */


.sticky-table tr {
    height: 48px;
}


.sticky-section {
    background-color: var(--bs-table-primary-header);
    height: 24px !important;
    position: sticky !important;
}

.section-height {
    height: 31px !important;
}

.sticky-shadow {
    box-shadow: 9px 0 16px -8px #bebebe;
    height: 522px;
    width: 302px;
    position: absolute;
    z-index: 10000;
    border-radius: 10px;
    top: 0;
    display: initial;

}

.sticky-table.pay-table {

    overflow-x: scroll;
}


/*PF table */

.pf-table {
    max-width: 320px;
}

.pf-table table thead tr th {
    background: var(--bs-odd-row-color);
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
    text-wrap: nowrap;
}

.pf-table table tbody td {
    text-align: left;
    vertical-align: middle;
    padding-left: 24px;
    padding-right: 10px;
}

.pf-table table tbody tr {
    height: 48px;
}

.pf-table table tbody tr:nth-child(odd) td {
    background-color: var(--bs-even-row-color);
}

.pf-table table tbody tr:nth-child(even) td {
    background-color: var(--bs-odd-row-color);
}

.pf-table-header {

    background-color: var(--bs-table-primary-header);
}

.noiconnection-overlay {
    max-width: 1366px;
    width: 100%;
    margin: auto;
    z-index: 10000;
    height: 100%;
    position: absolute;
    top: 0;
    background: rgb(255 255 255) !important;
}

/* added 9/13/23  */
.data-divider {
    border-right: 1px solid #bebebe4d !important;
}

.data-widget-center {
    width: 70% !important;
}

.data-wd-80 {
    width: 80px;
    text-align: center !important;
    position: relative;
    left: 15px;
}

.data-wd-70 {
    width: 70px;
    text-align: center !important;
    position: relative;
    left: 20px;
}

.grid-input-number .mat-form-field-wrapper {


    height: 54px;
    width: 91px;
    /* padding-bottom: 27px; */
    min-width: unset !important;
}



.grid-input-number .mat-form-field-appearance-outline .mat-form-field-outline {
    background: #fff;
    height: 40px;
    top: 12px
}



.pop-grid-controls .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;

}

.pop-grid-controls .mat-form-field-wrapper {
    padding-bottom: 4px;
    padding-top: 4px;
}

.width119 {
    width: 119px;
}

.width150 {
    min-width: 150px;
}

.width220 {

    min-width: 220px;
}

.width300 {
    min-width: 300px !important;
}

.width230 {
    width: 230px;
}

.width180 {
    width: 180px;
}

.width200 {
    width: 200px;
}


.shadow-widget-data {
    height: 88px;
    position: relative;
    padding-top: 23px;
    border-radius: 8px;
    background: var(--bs-card-background);
    box-shadow: 0px 1px 6px 0px #EAEAEA;
}

#iframe_yzuk {
    width: 100%;
}

.iframeControl {
    width: 100%;
}

.cntrl-note-text {
    position: relative;
    top: -20px;
    left: 9px;

}

.search-form {
    right: 200px;
    top: 200px;
}

.search-field {
    background-color: transparent;

    cursor: pointer;
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 24px 24px;
    border: none;
    cursor: pointer;
    height: 40px;
    margin: 3px 0;
    padding: 0 0 0 34px;
    position: relative;
    -webkit-transition: width 400ms ease, background 400ms ease;
    transition: width 400ms ease, background 400ms ease;
    width: 0px;
    cursor: pointer;
}

.search-field:focus {
    border-radius: 30px;
    border: 1px solid #C6CF58;
    background: transparent;
    cursor: text;
    outline: 0;
    width: 250px;
    position: relative;
    left: -38px;
    top: 4px;
    padding-left: 45px;


}

.page-search-icon:focus {
    border-top: 0px solid var(--bs-secondary);
    /* border-top: 1px solid var(--bs-secondary); */

}

.search-form .search-submit {
    display: none;
}

.Filter-widget {
    background: var(--bs-filter-widget-bg);
    border-radius: 8px;
    padding: 10px 10px;
    min-height: 96px;
    max-width: 100%;
    margin: auto !important;
    /* margin-bottom: 10px; */
    border: 1px solid rgba(116, 116, 141, 0.30) !important;
}

.Filter-widget .mat-form-field-wrapper {
    padding-bottom: 0px;
    width: 140px;
}

.Filter-widget .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;
}

.BtnFilter .mat-button {
    min-width: unset !important;
    height: 40px !important;
    /* border-radius: 54px!important; */
    border-radius: 100px !important;
    margin: auto !important;
    /* margin-bottom: 20px!important; */
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial;
    /* padding: 32px 13px 13px 32px; */
    padding: 0px 32px;
}


.Filter-widget2 {
    background: var(--bs-filter-widget-bg);
    border-radius: 8px;
    padding: 10px 10px;
    min-height: 96px;
    max-width: 100%;
    margin: auto !important;
    /* margin-bottom: 10px; */
    border: 1px solid rgba(116, 116, 141, 0.30) !important;
}

.Filter-widget5 {
    background: var(--bs-filter-widget-bg);
    border-radius: 8px;
    padding: 10px 10px;   
    max-width: 100%;
    margin: auto !important;
    /* margin-bottom: 10px; */
    border: 1px solid rgba(116, 116, 141, 0.30) !important;
}

.Filter-widget2 .mat-form-field-wrapper {
    padding-bottom: 0px;
}

.Filter-widget2 .mat-form-field-appearance-outline .mat-form-field-outline {
    background-color: white;
}

.grid-data-limit170 {

    max-width: 300px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 14px;
}

.datarow-widget {
    padding: 5px 5px 5px 15px;
    border-radius: 4px;
    border: 1px solid var(--Text-field-border, rgba(116, 116, 141, 0.30));
    background: var(--bs-even-row-color);
}

tr.mat-row.cdk-row.calculation-footer-row {
    background: var(--bs-even-row-color);

}

.calculation-footer-row td.mat-footer-cell {

    border-bottom-width: 0px !important;
}

.billable-disabled {
    min-width: 299px;
}

.total-box-disabled {
    min-width: 199px;
}

.report-title {
    background: var(--bs-table-head);
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 12px;
    font-weight: 600;
}

.reportlist .list-group-item {

    padding: 0px 2px 10px 11px !important;

}

ul.note-list {
    padding: 10px;
    max-width: 316px;
    padding-left: 20px;
}

ul.note-list li {
    line-height: 23px;
    padding-bottom: 24px
}

.calcualtion-table tr:last-child {
    font-weight: 600;
}

.calcualtion-row {
    font-weight: bold;

}

.width175 {
    width: 175px;
}

.mat-tab-group.mat-tab-group.line-tab.line-tab-all {
    margin-top: 0px;
}

/*added 10/10/23 */
.ver-divider {
    border-right: 1px solid #74748d4d;
    padding-left: 10px;

}

.shadow-widget {
    border-radius: 15px;
    background: var(--card-background, #FDFDFD);
    box-shadow: 0px 4px 20px 0px #EAEAEA;
}

.shadow-widget-title {
    padding: 24px;
}

.shadow-widget-list {

    padding-left: 24px;
    padding-bottom: 24px;
}

.new-calendar-menu2 {
    position: relative;
    top: -8px !important;
}

.toggle-search-form {
    position: relative;
    top: -10px;
}

.td-width-45 {
    WIDTH: 45%;
}

.td-width-45 {
    WIDTH: 45%;
}

.td-width-10 {
    WIDTH: 10%;
}

.td-width-35 {
    WIDTH: 35%;
}

.td-width-35 {
    WIDTH: 35%;
}

.td-width-20 {
    WIDTH: 20%;
}

.td-width-10 {
    WIDTH: 10%;
}

.icons-24px {
    font-size: 24px;
    padding-right: 5px;
    color: var(--bs-primary);
}

.filter-left-padding {
    position: relative;
    left: 18px;
}

.BtnFilter {
    font-weight: 600 !important;
    letter-spacing: 1px;
}

.multi-accordin-title2 {
    position: relative;
    top: 20px;
}

.disable-link {
    color: var(--bs-disable-stat) !important;
    cursor: not-allowed !important;
}

.select-all {
    padding-left: 18px !important;
}

.status-Active {
    color: var(--bs-success-green);
}

.status-Inactive {
    color: var(--bs-Error-red);
}

.tblcol-small .mat-form-field-wrapper {
    width: 60px !important;
    margin-right: 10px;
    min-width: unset;
}

.tblcol-medium .mat-form-field-wrapper {
    width: 150px !important;
    margin-right: 10px;
    min-width: unset;
}

.tblcol-large .mat-form-field-wrapper {
    width: 400px !important;
    margin-right: 10px;
    min-width: unset;
}

.OrgCharttopExport {
    text-align: right;
}

.tax-preview-Box {

    min-height: 468px;

    border: 1px solid var(--Text-field-border, rgba(116, 116, 141, 0.30));
    background: var(--Text-white, #FAFAFA);
}

.no-record-msg {

    width: 260px;
    margin: auto;
    padding-bottom: 19px;
}

.mat-h1,
.mat-headline,
.mat-typography h1 {

    margin: 0 0 5px !important;
}

.admin-steps {
    width: 170px;
    min-height: 56px;
    background: var(--bs-light-secondary);
    float: right;
    border-radius: 10px;
    box-shadow: 0px 2px 6px 0px var(--bs-topbar-shadow);
}

.admin-steps i {
    font-size: 30px;
    float: left;
    padding: 13px 12px 13px 12px;
    color: var(--bs-primary);
}

.admin-steps-label {
    position: relative;
    top: 8px;
}

app-aes-select mat-form-field .mat-form-field-flex {
    min-width: 160px !important
}

app-aes-date mat-form-field .mat-form-field-flex {
    min-width: 160px !important
}

.left-tab2-bg {
    background: var(--bs-left-tab-bg);
    max-width: 303px;
    overflow-x: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}


.rectangle-count-widget {
    min-width: 377px;
    min-height: 84px;
    background: var(--bs-card-background);
    border-radius: 15px;
    box-shadow: 0px 4px 16px 0px #EAEAEA;
}

.count-processed {
    color: var(--bs-Light-green);
    position: relative;
    top: 15px;

    letter-spacing: 1.4px;
}

.count-pending {
    color: var(--bs-Error-pink);
    position: relative;
    top: 15px;
    letter-spacing: 1.4px;
}

.count-status {
    position: relative;
    top: 33px;
    color: var(--bs-primary);
}

.chip-button .mat-button {

    display: inline-flex;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: var(--bs-primary);
}

.stats-widget {
    min-width: 180px;
    min-height: 84px;
    flex-shrink: 0;
    border-radius: 8px;
    background: var(--bs-even-row-color);
    box-shadow: 0px 4px 10px 0px #DAE1E9;
}

.stats-widgetTXT {
    padding-top: 4px;
    color: var(--bs-primary);
    text-align: center;
}

.pay-table .mat-checkbox {
    position: relative;
    top: 5px;
}

.col-auto.text-switch {
    color: var(--bs-white);
    min-width: 283px;
    min-height: 36px;
    border-radius: 50px;
    background: var(--Light-blue, #CAE3F3);
    box-shadow: 0px 0px 8px 0px #A9C9DD inset;
}


.text-switch-on {
    text-align: center;
    cursor: pointer;
    margin-top: 6px;
    margin-left: 5px;
    padding: 6px 8px;
    color: var(--bs-white);
    min-width: 100px;
    min-height: 28px;
    flex-shrink: 0;
    border-radius: 50px;
    background: var(--bs-light-primary);
}

.text-switch-off {
    text-align: center;
    padding: 12px 8px;
    color: var(--bs-darkgrey);
    min-width: 100px;
    min-height: 28px;
    flex-shrink: 0;
    border-radius: 50px;
}

.disable-color {

    color: var(--bs-disable-stat) !important;
}


.module-table .mat-header-cell .mat-checkbox-label {
    font-weight: 700 !important;
}

.detail-preview-Box {
    min-height: 468px;
    border: 1px solid var(--Text-field-border, rgba(116, 116, 141, 0.30));
    background: var(--bs-card-background);
    border-radius: 5px;
}

.detail-preview-list {
    background: var(--bs-even-row-color);
    padding: 8px;
    border-radius: 5px;
}

select[multiple]:focus option:checked {
    background: var(--bs-secondary) linear-gradient(var(--bs-secondary), var(--bs-secondary));
    color: red !important;
}

.weekly-cal {
    width: 100%;
    min-height: 32px;
    background: var(--bs-light-secondary);
    border-radius: 10px;
    box-shadow: 0px 2px 6px 0px var(--bs-topbar-shadow);
    float: left;
    padding: 13px 12px 13px 12px;


}

.weekly-cal.active {

    background: var(--bs-secondary);
}


.week-text-switch {

    /* min-width: 283px; */
    min-height: 40px;
    border-radius: 50px;
    background: var(--bs-table-primary-header);
   /* box-shadow: 0px 0px 8px 0px var(--bs-light-primary) inset; */
    margin-top: 60px;
}



.week-text-switch-on {
    color: var(--bs-white);
    text-align: center;
    cursor: pointer;
    margin-top: 4px;
    margin-left: 5px;
    margin-bottom: 5px;
    padding: 6px 8px;
    color: var(--bs-white);
    min-height: 28px;
    flex-shrink: 0;
    border-radius: 50px;
    background: var(--bs-light-primary);
    box-shadow: 2px 2px 5px 0px #A9C9DD;
}

.week-text-switch-off {
    text-align: center;
    cursor: pointer;
    margin-top: 4px;
    margin-left: 5px;
    margin-bottom: 5px;
    padding: 6px 8px;
    min-height: 28px;
    flex-shrink: 0;
    border-radius: 50px;
}

.width90 {
    width: 90px !important;
}

.drag-drop-image-widget2 {
    width: 303px;
    height: 280px;
    flex-shrink: 0;
    background: #FAFAFA;
    border-radius: 15px;
}


.drag-drop-container2 {
    width: 80px;
    height: 80px;
    padding: 22px 18px 22px 17.47px;
    flex-shrink: 0;
    background-color: rgba(116, 116, 141, 0.30);
    border-radius: 50%;
    margin: auto;
    position: relative;
    top: 61px;
}

.drag-image2 {
    width: 44.531px;
    height: 36px;
    flex-shrink: 0;
    font-size: 40px;
    color: white;
    transform: scaleX(-1);
}

.drag-drop-text2 {
    position: relative;
    top: 84px;
}

.loan-data-widget.disabled {
    pointer-events: none;
    opacity: 0.6;
}

.Pshadow-table {
    box-shadow: 9px 0 16px -8px #bebebe;
    z-index: 10000;
    position: relative;
}

.Pstatic-table {
    position: relative;
    left: 33px;
    z-index: 99;
}


.settings-card {
    pointer-events: none !important;
    min-width: 385px;
    min-height: 160px;
    border-radius: 8px;
    background: var(--bs-card-background);
    box-shadow: 0px 4px 20px 0px #EAEAEA;

}

.sys-limit {
    pointer-events: auto !important;
    max-width: 220px;
    display: inline-block;
    cursor: pointer;
    color: var(--bs-primary);
    font-weight: 600;
    letter-spacing: 0.5px;
}

.sys-txt-limit {
    max-width: 220px;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.settings-card.disabled {
    opacity: 0.5;
    cursor: not-allowed !important;
    box-shadow: 0px 0px 2px 0px #676767 !important;

}

.settings-card-left {
    min-width: 128px;
    height: 160px;
    background-image: url(../images/admin/BG.png);
    background-repeat: no-repeat;
}

.settings-icon {
    padding: 40px 22px 30px 22px;
}

.settings-list li {
    font-family: inherit !important;
    list-style-type: disc;
    line-height: 25px;
    position: relative;
    left: 10px;

}

.fin-font1 {
    font-family: 'Wendy One' !important;
    color: #85CFFE !important;
    font-size: 68px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.fin-font2 {
    font-family: 'Wendy One' !important;
    color: #3477A9 !important;
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    position: relative;
    text-align: center;
    top: 16px;
}

.fin-button {
    position: relative;
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    top: 25%;
    text-align: center;
    padding: 10px 32px;
    border-radius: 50px;
    border: 2px solid #FFF;
    max-width: 256px;
    margin: auto;
    color: #fff;
    cursor: pointer;

}


.donut-chart-svg-item.donut-type2 {
    width: 172px;
    position: relative;
    left: 24px;
    top: 24px;
    transform: rotate(139deg);
    stroke-width: 7px;
    paint-order: stroke;
    stroke: var(--bs-light-primary);
}

.loan-chip-data2 {
    color: var(--bs-white);
    font-size: 10px;
    padding: 0px 12px;
    border-radius: 34px;
    background: #FCD139;
    position: relative;
    max-width: 60px;
}

.shadow-widget2 {
    border-radius: 15px;
    background: var(--card-background, #FDFDFD);
    box-shadow: 0px 4px 20px 0px #EAEAEA;
    min-height: 256px;
}

.shadow-widget3 {
    padding: 24px;
    border-radius: 15px;
    background: var(--Table-dk-grey, var(--bs-even-row-color));
    box-shadow: 0px 4px 8px 0px #DAE1E9;
    min-height: 256px;
}

.shadow-widget-list2 {
    padding-left: 24px;
    line-height: 42px;
}

.donut-year {
    position: absolute;
    transform: rotate(221deg);
    height: 100%;
    right: 0px;
    top: -57px;
    font-size: 14px;
}


.donut-type2 .donut-chart-donut-ring {
    stroke: #FCD139 !important;
    /* border: 14px solid var(--bs-primary); */
}

.donut-type2 .donut-chart-donut-segment-2 {
    stroke: var(--bs-primary) !important;
    animation: donut1 3s;
}

.donut-chip-data1 {

    color: var(--bs-white);
    font-size: 10px;
    padding: 0px 12px;
    border-radius: 34px;
    background: var(--bs-light-primary);
    position: relative;
    margin-top: 25px;
    max-width: 96px;

}

.donut-chip-data2 {

    color: var(--bs-white);
    font-size: 10px;
    padding: 0px 12px;
    border-radius: 34px;
    background: #FCD139;
    position: relative;
    max-width: 96px;

}

.donut-chip-data3 {

    color: var(--bs-white);
    font-size: 10px;
    padding: 0px 12px;
    border-radius: 34px;
    background: var(--bs-primary);
    position: relative;
    max-width: 96px;

}

.fin-icon {
    position: absolute;
    top: 103px;
    left: 41px;
}

.video-carousel .carousel-inner {
    background: unset !important;
}

.video-carousel .carousel-item {
    height: unset !important;
    min-height: unset;
    height: 138px;
}

.video-carousel .carousel-item img {

    height: 138px;
    border-radius: 10px;
}

.video-carousel .carousel-indicators .active {
    background-color: var(--bs-secondary) !important;
}

.video-carousel .carousel-indicators li {

    border: solid 2px var(--bs-secondary) !important;
    width: 8px !important;
    height: 8px !important;
}

.voucher-card {
    display: flex;
    padding: 16px 32px 16px 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid var(--Light-blue, #CAE3F3);
    background: var(--Table-light-grey, var(--bs-odd-row-color));
    color: var(--bs-light-primary);


}

.voucher-carousel {

    min-height: 124px;
}

ul.fintools.list-group.list-group-horizontal img {
    width: 86px;
    border-radius: 50%;
    /* stroke: var(--Text-field-border, rgba(116, 116, 141, 0.30)); */
    border: 1px solid var(--bs-light-grey);
    padding: 0px;
}


ul.fintools.list-group.list-group-horizontal .list-group-item {
    border: 0px !important;
    padding: 0px 1rem !important;

}


.formula-column {
    padding: 20px;
    background: var(--bs-table-light-grey);
    border-radius: 10px;
    height: 100%;
}

.formula-box {
    overflow-wrap: anywhere;
    background: var(--bs-white);
    margin-bottom: 10px;
    flex-shrink: 0;
    border-radius: 4px;
    border: 1px solid var(--Text-field-border, rgba(116, 116, 141, 0.30));

}

.formula-builded {
    padding: 10px;
    background: var(--bs-table-light-grey);
    margin-left: 4px;
    border-radius: 4px;
    margin-bottom: 8px;

}

.flowchartB {
    max-width: 361px;
	height: 100%;
    border-radius: 4px;
    border: 1px solid var(--Text-field-border, rgba(116, 116, 141, 0.30));
    background: var(--card-background, #FDFDFD);

}

.flowchartB-header {
    width: 359px;
    height: 50px;
    background: var(--bs-odd-row-color);
    border-radius: 4px;
}

.flowchartB-header-title {
    padding: 8px 0px 0px 34px;
}

.flowchartB-data {
    padding: 8px 0px 0px 34px;
    position: relative;
    top: 16px;
}

.flowchart-opener i {
    border: 1px solid var(--bs-primary);
    border-radius: 50%;
    padding: 4px;
    height: 20px;
    width: 20px;
    text-align: center;
    font-size: 12px;
}

.flowchartB-sub {

    margin-left: 30px;
}


.flowchart-sub-line:before {
    content: "";
    display: block;
    height: 1px;
    width: 39px;
    position: absolute;
    top: 50%;
    left: -24px;
    /* background: red; */
    background: rgba(116, 116, 141, 0.30)
}

.flowchart-sub-line:before {
    content: " ";
    display: block;
    height: -39.7px;
    width: 40px;
    position: absolute;
    top: 50%;
    left: -25px;
    border: 1px solid;
    color: #ccc;
}



.tax-panel .mat-expansion-panel-header[aria-disabled=true] {
    color: unset !important;

}

.tax-panel .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: unset !important;
    border: 1px solid var(--bs-Topbar-border);
}

.mat-fulltable .mat-table {
    overflow-x: scroll;
    display: table;
    width: 100%;
}

.mat-fulltable .mat-cell,
.mat-fulltable .mat-header-cell {
    word-wrap: initial;
    display: table-cell;
    padding: 0px 4px 4px 4px;
    line-break: unset;
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: middle;
}

.mat-fulltable .mat-row,
.mat-fulltable .mat-header-row {
    display: table-row;
}

/* .wconfig-select{ */
/* width: 100% !important; */
/* word-wrap: normal!important; */
/* border: none!important; */
/* background: #ccc!important; */
/* overflow: auto!important;    */
/* } */

.wconfig-select {
    width: 100% !important;
    word-wrap: normal !important;
    border: none !important;
    overflow: auto !important;
    outline: none !important;
    height: 100vh;

}

.tab-unscrollable .mat-tab-body-content {
    overflow: hidden !important;
}

.dynamic-table3 .mat-form-field-wrapper {
    background: #fff !important;
    padding-bottom: 0px !important;
    margin-right: 10px !important;
}

.dynamic-table3 th {
    min-width: 212px;
}

.dynamic-table3 td {

    min-width: 212px;
}

.noRecord-inner-widget {
    height: 194px;
    width: 350px;
    padding-top: 30px;
    background: url(../images/no-record.png) no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    margin: auto;
}



tr.matheader2.mat-header-row th.mat-header-cell {
    border-radius: 0px !important;
    background-color: var(--bs-table-primary-header);
}

tr.matheader2.mat-table thead th:not(:last-child) {
    border-top-right-radius: 0px !important;
}

tr.matheader2.mat-header-row th.mat-header-cell:first-child {
    border-top-left-radius: 8px !important;
}


tr.matheader2.mat-header-row th.mat-header-cell:last-child {
    border-top-right-radius: 8px !important;
}

.sticky-shadow1 {

    box-shadow: 9px 0 16px -8px #bebebe;
    position: absolute;
    z-index: 10000;
    border-radius: 10px;
    top: 0;
}


.horizontal-widget-top.disabled {
    height: 88px;
    border-radius: 8px;
    border: 1px solid var(--bs-secondary);
    background: var(--bs-card-background);
    opacity: 0.3;
    cursor: not-allowed;
}

.pay-toggle2.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.pay-down-icon.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.planning-legend {
    margin-top: 16px;
    float: right;
    color: var(--bs-bodyTxt-light);
    font-weight: 400;

}

.planning-legend i {
    padding-right: 8px;
}

ul.list-inline.planning-legend li {
    padding-left: 4px;
}

.planning-colour1 i {
    color: var(--bs-planning-colour1);
}

.planning-colour2 i {
    color: var(--bs-planning-colour2);
}

.planning-colour3 i {
    color: var(--bs-planning-colour3);
}

.planning-colour4 i {
    color: var(--bs-planning-colour4);
}

.planning-colour5 i {
    color: var(--bs-planning-colour5);
}

.planning-colour6 i {
    color: var(--bs-planning-colour6);
}

.planning-colour7 i {
    color: var(--bs-planning-colour7);
}

.planning-colour8 i {
    color: var(--bs-planning-colour8);
}

.planning-colour9 i {
    color: var(--bs-planning-colour9);
}

.planning-colour10 i {
    color: var(--bs-planning-colour10);
}

/* Planning box bg */


.planningbg-colour1 {
    background: var(--bs-planning-colour1)!important;
    /* padding-right:20px !important; */
}

.planningbg-colour2 {
    background: var(--bs-planning-colour2)!important;
    /* padding-right:20px !important;*/
}

.planningbg-colour3 {
    background: var(--bs-planning-colour3)!important;
    /* padding-right:20px !important; */
}

.planningbg-colour4 {
    background: var(--bs-planning-colour4)!important;
    /*	padding-right:20px !important; */
}

.planningbg-colour5 {
    background: var(--bs-planning-colour5)!important;
    /*	padding-right:20px !important; */
}

.planningbg-colour6 {
    background: var(--bs-planning-colour6)!important;
    /*	padding-right:20px !important; */
}

.planningbg-colour7 {
    background: var(--bs-planning-colour7)!important;
    /*padding-right:20px !important; */
}

.planningbg-colour8 {
    background: var(--bs-planning-colour8)!important;
    /*padding-right:20px !important; */
}

.planningbg-colour9 {
    background: var(--bs-planning-colour9)!important;
    /*padding-right:20px !important; */
}

.planningbg-colour10 {
    background: var(--bs-planning-colour10)!important;
    /*	padding-right:20px !important; */
}

.card-header:not(.collapsed) .rotate-icon {
    transform: rotate(180deg);
}

.multiselect-checkbox-widget .list-group-item {
    padding: 0.75rem 1.25rem;

    border: 0px !important;
}

.multiselect-checkbox-widget {
    border-radius: 0px 0px 8px 8px;
    background: var(--card-background, #FDFDFD);
    box-shadow: 1px 2px 8px 0px #EAEAEA;
}

.apply-button {
    text-align: center;
    background: var(--bs-primary);
    color: var(--bs-white);
    border-radius: 0px 0px 8px 8px;
    cursor: pointer;
}

.color-div {
    width: 40px;
    height: 20px;
}

.color-div-code {
    position: relative;
    top: -2px;
}

.dynamic-minwidth {
    min-width: 270px;
}

.AeSMatTable .mat-sort-header-content {
    white-space: normal;
}

/* toggle button */

.icon-switch2 {
    color: var(--bs-white);
    width: 67.999px;
    height: 34px;
    border-radius: 4px;
    background: var(--bs-even-row-color);
    /* box-shadow: 0px 0px 8px 0px #A9C9DD inset;    */
}


.icon-switch-on2 {
    text-align: center;
    cursor: pointer;
    padding: 4px 5px;
    color: var(--bs-white);
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    border-radius: 4px;
    background: var(--bs-primary);
    /* box-shadow: 2px 2px 5px 0px #A9C9DD; */
}

.icon-switch-off2 {
    text-align: center;
    padding: 4px 5px;
    color: var(--bs-darkgrey);
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: 4px;
}

.landscape-toggle {
    width: 24.286px;
    height: 16.286px;
    border: 2px solid var(--bs-primary);
    border-radius: 4px;
    position: relative;
    top: 5px;
}

.portrait-toggle {
    width: 24.286px;
    height: 16.286px;
    border: 2px solid var(--bs-primary);
    border-radius: 4px;
    position: relative;
    top: 5px;
    transform: rotate(90deg);
}

.portrait-toggle.active {
    border: 2px solid var(--bs-white);
}

.landscape-toggle.active {
    border: 2px solid var(--bs-white);
}

.tkgcard-cnt {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--bs-card-background);
    background-clip: border-box;
    border-radius: 1.35rem;
    height: 100% !important;
}

app-aes-table .mat-table {
    display: grid;
    width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
}

app-aes-table .mat-table .mat-sort-header-content {
    min-width: 175px;
}


.matrix-color1 {
    background: #FDF0C2;
    border-radius: 2.807px;
    width: 46px;
    height: 46px;
}
  .matrix-color1 aescheckbox .mat-checkbox-label{
        display:none;
    }
	
.matrix-color2 {
    border-radius: 2.807px;
    background: #FDB056;
    width: 46px;
    height: 46px;
}

.matrix-color3 {
    border-radius: 2.807px;
    background: #EAA9A9;
    width: 46px;
    height: 46px;
}

.matrix-color4 {
    border-radius: 2.807px;
    background: #C6CF58;
    width: 46px;
    height: 46px;
}

.matrix-color5 {
    border-radius: 2.807px;
    background: #FDF0C2;
    width: 46px;
    height: 46px;
}

.matrix-color6 {
    border-radius: 2.807px;
    background: #CAE3F3;
    width: 46px;
    height: 46px;
}

.matrix-preview-box {
    border-radius: 4px;
    background-color: var(--bs-table-light-grey);
    width: 195px;
    height: 220px;
}

.matrix-text {

    top: 24px;
    transform: rotate(270deg);
    top: 107px;
    /* top: 22px; */
    position: relative;
    text-wrap: nowrap;
    right: 10px;
}

.multi-grid-accordion .mat-expansion-indicator {
    margin-right: 10px;

}

.multi-grid-accordion .mat-expansion-panel-header {
    flex-direction: row-reverse;
}

.multi-grid-accordion li:nth-child(odd) {
    background: var(--bs-even-row-color) !important;
    display: block;
}

.multi-grid-accordion li:nth-child(even) {
    display: block;
    background: var(--bs-odd-row-color) !important;
}


.multi-grid-accordion li:first-child {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.multi-grid-accordion mat-expansion-panel {
    background: unset !important;

}

.multi-grid-accordion .mat-content {
    padding-left: 10px;
    margin-top: 5px;
}

.multi-grid-accordion .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: unset !important;
}

.multi-grid-accordion .mat-expansion-panel-header-title,
.mat-expansion-panel-header-description {
    display: block !important;
}

.multi-grid-accordion ul li:nth-child(odd) {
    background: var(--bs-primary-bg) !important;
}

.multi-grid-accordion ul li:nth-child(even) {
    background: var(--bs-table-light-grey) !important;
}

.multi-grid-accordion .mat-expansion-panel {
    background: unset !important;
}




.multigrid-inner-table {
    padding-left: 28px;
}

.row-striped {
    padding-top: 10px;
    padding-bottom: 10px;
}

.row-striped:nth-of-type(odd) {
    background: var(--bs-primary-bg) !important;
}

.row-striped:nth-of-type(even) {
    background: var(--bs-table-light-grey) !important;
}

.prevent-expand {
    pointer-events: none;
    cursor: pointer;
}

.rating-indicator {
    padding: 25px 10px;
    border: 1px solid rgba(116, 116, 141, 0.30);
    background: #FFF3B8;
}

.amount-indicator {
    padding: 25px 10px;
    border: 1px solid rgba(116, 116, 141, 0.30);
    background: #E2CFC4;
}

.user-profile-widget .profile-section {
    padding: 0px 15px;
    width: 278px;
    height: 150px;
    border-radius: 4px;
    border: 1px solid rgba(116, 116, 141, 0.30);
    position: relative;
}

.profile-footer-content {
    position: absolute;
    bottom: 0;
    top: 130px;
}

.user-profile-widget .profile-section header {
    position: relative;
    top: -50px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.user-profile-widget .profile-section header .uprofile-img {
    width: 60px;
    height: 60px;
    border-radius: 50px;
    overflow: hidden;
    position: relative;
    bottom: 15px;
}

.user-profile-widget .profile-section header .uprofile-img img {
   width: 100%;
    height: 100%;
    object-fit: cover;
}
.nominee-header aescheckbox .mat-checkbox-inner-container{

    position:relative;
    z-index:1;
}

.nominee-header aescheckbox .mat-checkbox-label{
    display:none;
}

.user-profile-widget .profile-section header .uprofile-img-content {
    width: 60px;
    position: relative;
}

.user-profile-widget .profile-section header .uprofile-img-content:after {
    content: " ";
    width: 10px;
    height: 10px;
    background-color: #00ff11;
    position: absolute;
    top: 2px;
    right: 3px;
    border-radius: 50px;
    border: 2px solid #fff;
}

.user-profile-widget .profile-section header h1 {
    margin-top: 30px;
    margin-bottom: 0;
    color: #565555;
    font-weight: 500;
}

.user-profile-widget .profile-section header p {
    color: #898a8e;
    margin: 3px 0 0 0;
    font-weight: 300;
}

.user-profile-widget .profile-section .main-content {
    display: flex;
    justify-content: space-around;
    text-align: center;
    margin: 0 30px 50px 30px;
}

.user-profile-widget .profile-section .main-content div.line {
    height: 30px;
    background-color: #898a8e;
    width: 2px;
}

.user-profile-widget .profile-section .main-content div p {
    margin: 0;
    font-size: 13px;
}

.user-profile-widget .profile-section .main-content div p:first-child {
    color: #898a8e;
    font-weight: 300;
}

.user-profile-widget .profile-section .main-content div p:last-child {
    color: #565555;
    margin-top: 5px;
    font-weight: 500;
}

.nominee-header {
    height: 32px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

app-aes-table .mat-table {
    display: grid;
    overflow-y: auto;
    width: 100%;
}

.user-profile-widget .mat-checkbox-inner-container {
    background: #fff !important;
}

@media screen and (max-width: 320px) {
    .profile-section {
        margin: 0 10px;
    }

    .profile-section .main-content {
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
}

.cCurrent {
    border: 3px solid var(--bs-light-secondary);
    background: var(--bs-light-secondary);
    color: #ffffff;


}

.cPrevious {
    border: 3px solid #F0B46D;
    background: #F0B46D;
    color: #ffffff;


}

.cAvailable {
    border: 3px solid var(--bs-light-primary);
    background: var(--bs-light-primary) !important;
    color: #ffffff;


}

/***************** PARAMS SECTION ******************/
/* horizontal arrows */
.line-horizontal {
    height: 1px;
    width: 144px;
    /* margin-left: 20px; */
    margin-top: 20px;
}

/* vertical arrows */
.line-vertical {
    width: 1px;
    height: 140px;
    margin-left: 5px;
    float: left;
    top: -5px;

}

/*********************** CSS *************************/
/* common arrow styles */
.line-vertical,
.line-horizontal {
    position: relative;
    background: rgba(116, 116, 141, 0.30);
}

.arrow-up:after,
.arrow-down:before,
.arrow-left:after,
.arrow-right:before {
    content: "";
    position: absolute;
    width: 0px;
    height: 0px;
    border: 5px solid transparent;
}

/* vertical arrows */
.arrow-up:after,
.arrow-down:before {
    left: -4px;
}

.arrow-up:after {
    top: -7px;
    border-bottom: 5px solid #aaa;
}

.arrow-down:before {
    bottom: -15px;
    border-top: 15px solid #aaa;
}

/* horizontal arrows */
.arrow-left:after,
.arrow-right:before {
    top: -4px;
}

.arrow-left:after {
    left: -15px;
    border-right: 15px solid #aaa;
}

.arrow-right:before {
    right: -4px;
    border-left: 5px solid #aaa;
}


.ranking-preview-panel {
    width: 195px;
    padding-left: 26px;
    height: 220px;
    border-radius: 4px;
    background: var(--bs-table-light-grey);
}

.role-table {
    height: 500px;
    overflow-y: auto;
}

.description textarea {
    height: 100px;
}

.matrixClr1 {
    background: #D60B0B !important;
}

.matrixClr2 {
    background: #E86161!important;
}

.matrixClr3 {
    background: #EAA9A9!important;
}

.matrixClr4 {
    background: #FF922E!important;
}

.matrixClr5 {
    background: #FEC600!important;
}

.matrixClr6 {
    background: #FDF0C2!important;
}

.matrixClr7 {
    background: #6EC937!important;
}

.matrixClr8 {
    background: #C6CF58!important;
}

.matrixClr9 {
    background: #E8ECBC!important;
}

.nineBoxcolor1 {
    background: #FDF0C2;
}

.nineBoxcolor2 {
    background: #FDB056;
}

.nineBoxcolor3 {
    background: #EAA9A9;
}

.nineBoxcolor4 {
    background: #C6CF58;
}

.nineBoxcolor5 {
    background: #CAE3F3;
}

.status-chart-frame {
    border: 1px solid rgba(116, 116, 141, 0.30);
    width: 96px;
    height: 80px;
    border-radius: 4px;
}

.status-chart-frame:after {
    display: inline-block;
    content: "";
    border-top: 2px solid #ccc;
    width: 32px;
    position: absolute;
    top: 35px;
    left: 110px;
}

.status-chart-frame.last:after {
    display: none;

}

.status-chart-frame-text {
    width: 80px;
    margin: auto;
}

.status-state-complete {
    background: var(--bs-secondary) ! important;
    margin: 0;
    color: #ffffff;
    padding: 4px 24px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;

}

.status-state-inprogress {
    background: var(--bs-light-primary) ! important;
    margin: 0;
    color: #ffffff;
    padding: 4px 20px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;

}

.status-state-pending {
    background: var(--bs-light-grey) ! important;
    margin: 0;
    color: #ffffff;
    padding: 4px 24px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;

}

.filters-expanel mat-expansion-panel {
    margin-bottom: 12px;
    border: 1px solid rgba(116, 116, 141, 0.30);
    border-radius: 4px;
}

.filters-expanel .mat-expansion-panel-header {

    padding: 0 18px;
}

.filters-expanel .mat-content {
    padding-top: 0.5rem !important;
}

.filters-expanel .mat-expansion-panel:not([class*=mat-elevation-z]) {

    box-shadow: none !important;
}

.filters-expanel .mat-expansion-panel-header-title {
    color: inherit !important;
    position: relative;
    top: 2px;
    left: 8px;
}

.filters-expanel .mat-expansion-indicator {
    padding-right: 0px;
    border: 2px solid var(--bs-primary);
    border-radius: 50%;
    height: 20px;
    width: 20px;
    text-align: center;

}

.filters-expanel .mat-expansion-indicator::after {
    border-style: solid;
    border-width: 0px 2px 2px 0px;
    content: "";
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    vertical-align: middle;
    position: relative;
    top: -5px;
}

.Filter-list-background {

    background: var(--bs-odd-row-color);
    border-radius: 8px;
    padding: 10px 10px;
    min-height: 96px;
    max-width: 100%;
    margin: auto !important;
    height: 100%;

}

.mat-slider-horizontal .mat-slider-wrapper,
.mat-slider-track-wrapper,
.mat-slider-track-background {
    height: 8px !important;
    background: var(--bs-odd-row-color) !important;
}

.mat-slider-track-fill {
    height: 8px !important;
    background: var(--bs-darkgrey) !important;
}

.mat-slider-thumb {

    right: -11px !important;
    bottom: -11px !important;
    width: 24px !important;
    height: 24px !important;
    background-color: var(--bs-darkgrey) !important;
}

.slider-seprator {
    width: 8px;
    height: 2px;
    border-radius: 2px;
    background: rgba(116, 116, 141, 0.30);
    position: absolute;
    bottom: 50px;
}

.mat-slider-horizontal {

    width: 100% !important;
}

.mat-slider:not(.mat-slider-disabled):not(.mat-slider-sliding) .mat-slider-thumb-label,
.mat-slider:not(.mat-slider-disabled):not(.mat-slider-sliding) .mat-slider-thumb {

    border: 6px solid #ccc !important;
}

.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {

    border: solid 4px #E6ECF4 !important;
}

.Filter-list-background .mat-checkbox-label {

    text-wrap: wrap;
}

.nopadding {
    padding: 0 !important;
}

.Filter-list-background .mat-expansion-panel-body {
    padding: 0 !important;
}

.mat-expansion-panel-header {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: 400;
}

.multiselect-checkbox-widget.mat-menu-panel {
    background: #FDFDFD !important;

    padding: 0px !important;
    max-height: unset !important;
    overflow: hidden !important;
}

.multiselect-checkbox-widget .list-group-item {
    background: #FDFDFD !important;
}

.multiselect-checkbox-widget .mat-menu-content:not(:empty) {
    padding-bottom: 0px !important;
}

.Filter-widget.Filter-list-background {
    background: var(--bs-table-light-grey) ! important;
    border: none ! important;
}

.readiness_risk_high {
    display: inline-flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: #6EC937;
}

.readiness_risk_low {
    display: inline-flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: #E86161;
}

.readiness_risk_medium {
    display: inline-flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: #FEC600;
}

.onbehalf-new-srchbox {
    width: 100% !important;
    /* height: 36px; */
    padding: 8px 0px !important;
    position: relative;
    border: 1px solid #ccc !important;
    border-left: 0px !important;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    outline: none !important;
    margin-top: 0px !important;
    font-size: inherit !important;
    padding-left: 5px !important;
    text-align: left !important;
}

.onbehalf-new-for {
    padding: 8px 10px;
    /* height: 38px; */
    position: relative;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-left: 1px solid;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-color: #ccc;
    background: var(--bs-even-row-color);
}

aesonbehalfof i {
    position: relative;
    top: -9px;
    font-size: 20px;
}

.mat-option {
    font-size: inherit !important;
}

.onbehalf-content {
    display: none;
    position: relative;
    top: 0px;
    left: -42px;
    padding: 19px;
    margin-right: -42px;
    border-radius: 0px 0px 8px 8px;
    background: #FDFDFD;
    box-shadow: 1px 2px 8px 0px #EAEAEA;
    text-align: left;
}

.onbehalf-new-srchbox:focus+.onbehalf-content {
    display: block;
    position: absolute;
    z-index: 10000;
    top: 48px;
    width: 340px;
}

.onbehalf-new-srchbox::placeholder {

    font-size: 12px;
    color: var(--bs-darkgrey);
    padding-left: 3px;
}

.onbehalf-data-limit {
    width: 300px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;

}

.Filter-widget.customized-widget1 {
    min-height: 0 !important;
    border-radius: 0;
    padding: 0px;
}

/* Journal Chat css */
.journal-chat-frame {
    height: 600px;
    bottom: 94px;
    width: auto;
    border: 1px solid rgba(116, 116, 141, 0.30);
    border-radius: 8px;
}

.journal-chat {
    /* width: 440px; */
    height: 457px;
    /* float: left; */
    background: var(--bs-white);
    border-radius: 15px 15px 0px 0px;
    color: #434651;
}

.journal-chat .chat-header {
    padding: 10px;
    background: var(--bs-light-secondary);
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.journal-chat .chat-header img {
    float: left;
}

.journal-chat .chat-header .chat-about {
    float: left;
    padding-left: 10px;
    margin-top: 6px;
}

.journal-chat .chat-header .chat-with {
    font-weight: bold;
    font-size: 16px;
}

.journal-chat .chat-header .chat-num-messages {
    padding: 6px 0px 6px 0px !important;
}

.journal-chat .chat-header i {
    float: right;
    color: var(--bs-primary) !important;
    cursor: pointer;
    font-size: 20px;
    margin-top: 3px;
    padding-right: 10px;
}

.journal-chat .journal-chat-history {
    padding: 0px 16px 20px;
    border-bottom: 2px solid white;
    overflow-y: auto;
    height: 457px;
    background: var(--bs-white);
    display: flex;
    flex-direction: column-reverse;
    overflow-x: hidden;
}

.journal-chat-history .chat-image {
    position: relative;
    top: 57px;
    right: 10px;
}

.journal-chat-history .chat-attach {
    position: relative;
    top: 12px;
    left: 20px;
}

.journal-chat .journal-chat-history .message-data {
    margin-bottom: 15px;
}

.journal-chat .journal-chat-history .message-data-time {
    color: var(--bs-bodyTxt-light);
    padding-left: 6px;
    padding-bottom: 6px;
}

.journal-chat .journal-chat-history .message {
    padding: 0px 12px;
    padding-top: 6px;
    line-height: 26px;
    font-size: 16px;

    margin-bottom: 20px;
    width: 90%;
    position: relative;
}


.journal-chat .chat-history .my-message {
    background: var(--bs-primary-bg);
    width: 250px;
    border-radius: 0px 12px 12px 12px;
}

.journal-chat .journal-chat-history .other-message {
    background: var(--bs-primary-bg);
    border-radius: 12px 0px 12px 12px;
}

.chat .chat-message {
    background: var(--bs-secondary);
}

.journal-chat .chat-message .box {
    border: none;
    padding: 5px 10px 2px 12px;
    margin-top: 9px;
    margin-bottom: 14px;
    margin-left: 12px;
    border-radius: 4px;
    resize: none;
    height: 44px;
    background: #fff;
}

.journal-chart-footer {
    background: var(--bs-light-secondary);
    padding: 8px;
    border-radius: 8px;
    border: 1px solid rgba(116, 116, 141, 0.30);
    position: relative;
    bottom: 30px;
}

.left-tab-new {
    padding: 24px 16px;
    background: var(--bs-primary-bg);
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.AeSGridHeaderHorz1,
.AeSGridItemHorz1 {

    min-width: 70px;
    text-align: right;
}

.AeSGridHeaderHorz2,
.AeSGridItemHorz2 {
    min-width: 140px;
    text-align: right;
}

.AeSGridHeaderHorz3,
.AeSGridItemHorz3 {

    min-width: 210px;
    text-align: right;
}

.AeSGridHeaderHorz4,
.AeSGridItemHorz4 {
    min-width: 280px;
    text-align: right;
}

.mat-expansion-panel.Filter-widget.customized {
    min-height: auto ! important;
}

.flowchartB-header.customized2 {
    width: auto ! important;
    height: auto ! important;
}

.AeSGridItemHorz3 div a.clicker.h10.mr-3 {
    cursor: pointer !important;
    text-decoration: none !important;
}

.AeSGridItemHorz3 div a:hover {
    cursor: pointer !important;
    text-decoration: none !important;
}

.additional_popover__title {
    font-size: 24px;
    line-height: 36px;
    text-decoration: none;
    text-align: center;
    padding: 15px 0;
}

.additional_popover__wrapper {
    position: relative;
    display: inline-block;
}

.additional_popover__content {
    box-shadow: 2px 1px 12px 1px rgba(0, 0, 0, 0.26);
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: -40px;
    transform: translate(0, 10px);
    min-width: 340px;
    border-radius: 8px;
}

.additional_popover__content:before {
    position: absolute;
    z-index: -1;
    content: "";
    right: calc(50% - 10px);
    top: -8px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent var(--bs-even-row-color) transparent;
    transition-duration: 0.3s;
    transition-property: transform;
}

.additional_popover__wrapper:hover .additional_popover__content {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    background-color: #E6ECF4;
    transform: translate(0, -20px);
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
    left: -10px;
}


.additional_popover__wrapper.nominee_popover .row:nth-child(even) {
    background-color: var(--bs-even-row-color);
    padding-bottom: 5px;
    padding-top: 5px;
}

.additional_popover__wrapper.nominee_popover .row:nth-child(odd) {
    background-color: var(--bs-odd-row-color);
    padding-bottom: 5px;
    padding-top: 5px;
}

/*
  lib-aeswrapperdialog .mat-dialog-content {
    padding-left: 5px;
}

.popup-title .mat-dialog-title {
    position: relative;
    left: 17px;
}
*/
.content-accordin-nopadding .mat-expansion-panel {
    padding: 15px 0px 10px 0px !important;
}

.breadcrumb {
    background: unset !important;
}

.pin-badge-page i {
    display: inline-block;
    border-radius: 60px;
    padding: 6px 6px;
    color: var(--bs-primary);
    margin-left: 1px;
    transform: rotate(45deg);
    position: relative;
    top: 3px;
    height: 24px;
    width: 24px;
    border: 1px solid;
}

.pin-badge-page i active {

    background: var(--bs-primary);
    color: var(--bs-white);
}

.unpined-pop {
    opacity: 0.5;
}


.calendar-chip-complete {

    height: 24px;
    border-radius: 4px;
    background: var(--bs-Light-green);
    text-align: left;
    padding-left: 4px;
    cursor: pointer;

}

.calendar-chip-pending {

    height: 24px;
    border-radius: 4px;
    background: #F0B46D;
    text-align: left;
    padding-left: 4px;
    cursor: pointer;

}

.calendar-chip-pass {

    height: 24px;
    border-radius: 4px;
    background: #EAA9A9;
    text-align: left;
    padding-left: 4px;
    cursor: pointer;

}

.calendar-chip-cancel {

    height: 24px;
    border-radius: 4px;
    background: #B0B0B0;
    text-align: left;
    padding-left: 4px;
    cursor: pointer;

}

.multiple-calendar-chip {

    height: 24px;
    border-radius: 4px;
    background: #CAE3F3;
    text-align: left;
    padding-left: 4px;
    cursor: pointer;

}

.calendar-chip-content {
    width: 156px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
    line-height: unset !important;
}

.training-complete i {
    color: #AECD9B;
}

.training-pending i {
    color: #F0B46D;
}

.training-pass i {
    color: #EAA9A9;
}

.training-cancel i {
    color: #B0B0B0;
}


aesaggrid .col-lg-8 .clicker {
    /* color: red; */
    position: relative;
    left: 30px;
    line-height: 37px;
}

.pay-table.chart-table th {
    padding-left: 11px;
    font-size: 14px;
    font-weight: unset;
}

.pay-table.chart-table tr:first-child th:first-child {

    border-top-left-radius: 8px;
}

.pay-table.chart-table tr:last-child th:first-child {

    border-bottom-left-radius: 8px;
}



.pay-table.chart-table tr:first-child td:last-child {

    border-top-right-radius: 8px;
}

.pay-table.chart-table tr:last-child td:last-child {

    border-bottom-right-radius: 8px;
}

.Filter-widget.chart-tree-main {
    background: #CAE3F3 !important;
}

.vertical-radio-group {
    display: flex;
    flex-direction: column;
}

.vertical-radio-groupmlmShow {
    display: flex;
    flex-direction: column;
}

button.mat-menu-trigger {
    border: none;
    color: var(--bs-primary);
    outline: none;
    background: none !important;
}

button {
    outline: none !important;
    border: none;
    background: none;
}

.filter-dropDown-icon {
    position: relative;
    top: 6px;
    right: 7px;

}

/*AG grid Css */

ag-grid-angular .ag-cell.ag-cell-first-right-pinned:not(.ag-cell-range-left):not(.ag-cell-range-single-cell) {
    border-left: none !important;

    /* For checkbox overflow ellipse hiiden */
}

[col-id="Checkbox"].ag-cell {
    overflow: visible;
}

.ag-ltr .ag-cell-focus:not(.ag-cell-range-selected):focus-within{
	border: none !important;
    border-color: none !important;
}

ag-grid-angular .ag-pinned-right-header {
    border-left: none !important;
}

.ag-theme-alpine .ag-header {
    background-color: unset !important;
    background-color: var(--ag-header-background-color, #f8f8f8);
    border-bottom: 0px !important;
    border-bottom-color: unset !important;
}

.ag-theme-alpine {
    -webkit-font-smoothing: antialiased;
    color: var(--bs-bodyTxt) !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    line-height: 20px !important;

}

.ag-header-row {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background:  var(--bs-odd-row-color);
    height: 52px !important;
    color: var(--bs-bodyTxt) !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 700 !important;


}

.ag-theme-alpine .ag-row {

  /*  height: 52px !important; */
    background-color: var(--bs-even-row-color);

    color: inherit !important;

    border-width: unset !important;
    border-color: unset !important;
    border-bottom-style: unset !important;
}


.ag-theme-alpine .ag-row-odd {
    background-color: var(--bs-odd-row-color);

}

.ag-theme-alpine .ag-root-wrapper {
    border: unset !important;
    border-color: unset !important;
}

.ag-theme-alpine .ag-checkbox-input-wrapper.ag-checked:after {
    color: #2d668f !important;
}
.ag-theme-alpine .ag-checkbox-input-wrapper.ag-checked.ag-disabled:after {
color: #74748D !important;
}

.ag-checkbox-input-wrapper.ag-disabled::after {
color: #74748D !important;
}

.ag-row-even.ag-row-no-focus.ag-row.ag-row-level-0.ag-row-position-absolute.ag-row-last {

    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/*license AG grid hide */
.ag-aria-description-container {
    display: none;
}

.ag-watermark{
	
display:none;

} 

/* .ag-header-cell-text { *AG CELL TEXT/
    /* text-transform: lowercase; */
/* } */

/* .ag-header-cell-text:first-letter{ */
    /* text-transform:capitalize; */
/* } */
.ag-theme-alpine .ag-tab-selected {
    color: var(--bs-primary) !important;
    border-bottom-color: var(--bs-primary);
}

.ag-theme-alpine .ag-compact-menu-option-active,
.ag-theme-alpine .ag-menu-option-active {

    background-color: var(--bs-primary) !important;
    color: white !important;
}

.ag-theme-alpine .ag-chart-menu-icon:hover,
.ag-theme-alpine .ag-chart-settings-next:hover,
.ag-theme-alpine .ag-chart-settings-prev:hover,
.ag-theme-alpine .ag-column-group-icons:hover,
.ag-theme-alpine .ag-column-select-header-icon:hover,
.ag-theme-alpine .ag-filter-toolpanel-expand:hover,
.ag-theme-alpine .ag-floating-filter-button-button:hover,
.ag-theme-alpine .ag-group-contracted .ag-icon:hover,
.ag-theme-alpine .ag-group-expanded .ag-icon:hover,
.ag-theme-alpine .ag-group-title-bar-icon:hover,
.ag-theme-alpine .ag-header-cell-menu-button:hover,
.ag-theme-alpine .ag-header-expand-icon:hover,
.ag-theme-alpine .ag-panel-title-bar-button:hover,
.ag-theme-alpine .ag-side-button-button:hover,
.ag-theme-alpine .ag-tab:hover {

    color: var(--bs-primary) !important;
}

.ag-theme-alpine .ag-radio-button-input-wrapper.ag-checked:after {

    color: var(--bs-primary) !important;

}

.ag-theme-alpine .ag-date-time-list-page-entry-is-current {
    background-color: var(--bs-primary) !important;

}

.ag-theme-alpine,
.ag-theme-alpine-dark {
    --ag-alpine-active-color: var(--bs-primary) !important;
    --ag-selected-row-background-color: :var(--bs-primary) !important;
    --ag-row-hover-color: unset !important;
    --ag-column-hover-color: :unset !important;
    --ag-input-focus-border-color: :var(--bs-primary) !important;
    --ag-range-selection-background-color: :var(--bs-primary) !important;
    --ag-range-selection-background-color-2: :var(--bs-primary) !important;
    --ag-range-selection-background-color-3: :var(--bs-primary) !important;
    --ag-range-selection-background-color-4: :var(--bs-primary) !important;

    --ag-checkbox-background-color: :var(--bs-primary) !important;
    --ag-checkbox-checked-color: v:var(--bs-primary) !important;
    --ag-range-selection-border-color: :var(--bs-primary) !important;
}

.ag-theme-alpine .ag-row-hover.ag-full-width-row.ag-row-group:before,
.ag-theme-alpine .ag-row-hover:not(.ag-full-width-row):before {

    background-color: unset !important;

}
/*
.ag-theme-alpine .ag-cell,
.ag-theme-alpine .ag-full-width-row .ag-cell-wrapper.ag-row-group {
    line-height: 52px !important;
}
*/

/* for ireporter height fix*/
app-misform .iframeContainerClass1 {
    height: 200vh !important;
}

/* For CTC height fix */
.commonsidewidthCTC .iframeContainerClass3 {
    height: 175vh !important;
}

/* toggle button without click */
.invToggle .mat-button-toggle-label-content {
    line-height: 36px !important;
}

.invToggle.mat-button-toggle-group-appearance-standard {
    border-radius: 15px !important;
    border: none !important;
}

.invToggle .mat-button-toggle-checked {
    background: var(--bs-primary) !important;
    color: rgb(255, 255, 255);
}

.invToggle mat-button-toggle-group {
    display: block;
}

.invToggle .mat-button-toggle-appearance-standard {
    background: var(--bs-wrapper-card-bg);
}

.invToggle [type=button].mat-button-toggle-button {
    cursor: default !important;
    pointer-events: none !important;
}

.invToggle.mat-button-toggle-button:hover {
    background: none !important;
}

.AgGridMoreContainer {
    text-align: right;
}

.horizontal-radio .aesRadioLabel {
    padding-right: 0px !important;
}

.stepMoverBackBtn {
    width: 40px;
    height: 40px;
    border: 2px solid var(--bs-primary);
    border-radius: 50%;
    color: var(--bs-primary);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

button.stepMoverBackBtn {
    background-color: rgb(255, 255, 255) !important;
    color: var(--bs-primary) !important;
}

button.stepMoverBackBtn:hover {
    background-color: #ffffff !important;
    border: 2px solid var(--bs-secondary) !important;
    color: var(--bs-secondary) !important;
}

.stepMoverFrwdBtn {
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    color: var(--bs-white);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

button.stepMoverFrwdBtn {
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

button.stepMoverFrwdBtn:hover {
    background-color: var(--bs-secondary) !important;
    color: var(--bs-white) !important;
}

/*
  .stepMoverContent.dropdown-item:hover{
    background-color: unset !important;
  }
  */

.stepMoverContainer.dropdown-menu {
    border: none;
    position: relative;
    top: -10px !important;
    padding: 0px !important;
}

.MenuDiv1366 {
    display: none;
    position: absolute;
    /* width: 1000px; */
}

aesfileupload.view-only-files .AeSFilename {
    display: block;
    padding-bottom: 5px;
}

.view-only-files .AeSAttachControl {
    display: none !important;
}

.parent-card .mat-card-title {
    font-weight: 600 !important;
}

.formula-builder-tool {
    height: 670px;
    overflow-y: auto;
}

.formula-builder-tool .mat-card-title {

    font-family: inherit !important;
    font-size: 12px !important;
}


/* 
  .fmb-delete-row {
    background-color: var(--bs-primary);
    border-radius: 12px 12px 0px 0px;
    padding: 25px;
} */

.fmb-list {
    border: solid 1px var(--bs-primary);
    min-height: 60px;
    background: white;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom: 2px solid var(--bs-primary);
    overflow: hidden;
    display: block;
    padding: 5px 10px;
    border-top: 0px;
}

.fmb-delete {
    border: 1px solid var(--bs-primary);
}

.fmb-list .drop-list {
    min-height: 370px;
}

.fmb-none {
    border: 0px;
    box-shadow: 0 0px 0px 0px #CCC;
}

.fmb-list.cdk-drop-list-dragging .list-item:not(.cdk-drag-placeholder) {
    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}

.dragheader {
    margin: 1% 0%;
}

.formula-builder-tool .mat-card {
    box-shadow: none !important;
    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    position: relative;
    padding: 10px;
    border-radius: 4px;
    /* border-radius: 8px; */
    border: 1px solid #d6d6d6;
    margin-bottom: 8px;
    line-height: 12px;
}

.formula-builder-tool .mat-card-title {
    margin-bottom: 0px !important;
}

.formula-builder-tool .mat-card-header {
    margin-bottom: 0px !important;
}


.formula-builder-tool .mat-card-header-text {
    width: 100%;

}

.formula-data-limit145 {
    max-width: 145px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-top: 5px;
}



.cdk-drag-preview {
    position: relative !important;
    z-index: 9999999999 !important;
}


.mat-card-header .mat-card-title {

    font-size: 14px !important;
    font-family: inherit !important;
}

.formula-option-child {
    font-weight: 600;
}

.formula-list-container .cdk-drop-list {

    padding-left: 10px;
}

.child-card .mat-card-title {
    font-weight: 600 !important;

}

.formula-flex-col {
    flex: 1 1 100%;
    box-sizing: border-box;
    max-width: 33.33%;
}

.formula-flex-row {
    flex-direction: row;
    box-sizing: border-box;
    display: flex;
}

.formula-list-container {
    background: var(--bs-odd-row-color);
    padding: 10px;
}

.invToggle .mat-button-toggle-label-content {
    line-height: 36px !important;
}

.invToggle.mat-button-toggle-group-appearance-standard {
    border-radius: 15px !important;
    border: none !important;
}

.invToggle .mat-button-toggle-checked {
    background: var(--bs-primary) !important;
    color: rgb(255, 255, 255);
}

.invToggle mat-button-toggle-group {
    display: block;
}

.invToggle .mat-button-toggle-appearance-standard {
    background: var(--bs-wrapper-card-bg);
}

.invToggle [type=button].mat-button-toggle-button {
    cursor: default !important;
    pointer-events: none !important;
}

.invToggle.mat-button-toggle-button:hover {
    background: none !important;
}

.mat-radio-outer-circle {
    height: 16.67px !important;
    width: 16.67px !important;
}

.mat-radio-inner-circle {
    height: 16.67px !important;
    width: 16.67px !important;
}

.model-indication-active {

    padding: 6px 10px;
    background: var(--bs-primary);
    border-radius: 20px;
    color: white;
    font-size: 12px;
}

.model-indication {

    padding: 6px 10px;
    background: none;
    border-radius: 20px;
    color: black;
    font-size: 12px;
}

.model-indication-widget {
    padding: 7px 6px 9px 5px;
    border-radius: 20px;
    background: #f7f7f7;
    border: 1px solid #e3e3e3;

}

.feedback-rating {
    display: flex;
    flex-direction: row-reverse;
    /* justify-content: center */
    float: left;
}

.feedback-rating>input {
    display: none
}

.feedback-rating>label {
    position: relative;
    width: 1em;
    font-size: 30px;
    font-weight: 300;
    color: #74748D4D;
    cursor: pointer
}

.feedback-rating>label::before {
    content: "\2605";
    position: absolute;
    opacity: 0
}

.feedback-rating>input:checked~label:before {
    opacity: 1;
    color: #FFD600;
}

.feedback-rating>label:checked:before,
.feedback-rating>label:checked~label:before {
    opacity: 1 !important;
    color: #FFD600 !important;

}

.feedback-rating>input:checked~label:before {
    opacity: 1;
}

.feedback-rating:checked>input:checked~label:before {
    opacity: 0.4;
}

.Afd-File aesfileupload .AeSFilename {

    padding-right: 5px;
}

.Afd-File aesfileupload .AeSFilename::after {
    content: "|";
    padding-left: 5px;
    color: var(--bs-light-grey);
}

.Afd-File aesfileupload span:last-child.AeSFilename::after {
    content: "|";
    display: none;
    padding-left: 5px;
    color: var(--bs-darkgrey);
}
.Afd-MultiFile .AeSFilename::after {
    content: " |";
    padding-right: 5px;
    color: var(--bs-light-grey);  
    line-height: 25px !important;
  
}

.tabContent-popup {
    min-width: unset !important;
}

ag-grid-angular .MoreOptionsIcon {
    float: right;
}

/* Tree grid css */


.tf-tree {

    overflow: auto;
    text-align: center;
    padding: 30px 0
}

.tf-tree * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

.tf-tree ul {
    display: inline-flex
}

.tf-tree li {
    align-items: center;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 0 1em;
    position: relative
}

.tf-tree li ul {
    margin: 4em 0
}

.tf-tree li li:before {
    border-top: .0625em solid var(--bs-primary);
    content: "";
    display: block;
    height: .0625em;
    left: -.03125em;
    position: absolute;
    top: -2.03125em;
    width: 100%
}

.tf-tree li li:first-child:before {
    left: calc(50% - .03125em);
    max-width: calc(50% + .0625em)
}

.tf-tree li li:last-child:before {
    left: auto;
    max-width: calc(50% + .0625em);
    right: calc(50% - .03125em)
}

.tf-tree li li:only-child:before {
    display: none
}

.tf-tree li li:only-child>.tf-nc:before,
.tf-tree li li:only-child>.tf-node-content:before {
    height: 2.0625em;
    top: -34px
}

.tf-tree .tf-nc,
.tf-tree .tf-node-content {
    border: .0625em solid var(--bs-primary);
    display: inline-block;
    padding: .5em 1em;
    position: relative
}

.tf-tree .tf-nc:before,
.tf-tree .tf-node-content:before {
    top: -2.03125em
}

.tf-tree .tf-nc:after,
.tf-tree .tf-nc:before,
.tf-tree .tf-node-content:after,
.tf-tree .tf-node-content:before {
    border-left: .0625em solid var(--bs-primary);
    content: "";
    display: block;
    height: 2em;
    left: calc(50% - .03125em);
    position: absolute;
    width: .0625em
}

.tf-tree .tf-nc:after,
.tf-tree .tf-node-content:after {
    top: calc(100% + .03125em)
}

.tf-tree .tf-nc:only-child:after,
.tf-tree .tf-node-content:only-child:after,
.tf-tree>ul>li>.tf-nc:before,
.tf-tree>ul>li>.tf-node-content:before {
    display: none
}

.tf-tree.tf-gap-sm li {
    padding: 0 .6em
}

.tf-tree.tf-gap-sm li>.tf-nc:before,
.tf-tree.tf-gap-sm li>.tf-node-content:before {
    height: .6em;
    top: -.6em
}

.tf-tree.tf-gap-sm li>.tf-nc:after,
.tf-tree.tf-gap-sm li>.tf-node-content:after {
    height: .6em
}

.tf-tree.tf-gap-sm li ul {
    margin: 1.2em 0
}

.tf-tree.tf-gap-sm li li:before {
    top: -.63125em
}

.tf-tree.tf-gap-sm li li:only-child>.tf-nc:before,
.tf-tree.tf-gap-sm li li:only-child>.tf-node-content:before {
    height: .6625em;
    top: -.6625em
}

.tf-tree.tf-gap-lg li {
    padding: 0 1.5em
}

.tf-tree.tf-gap-lg li>.tf-nc:before,
.tf-tree.tf-gap-lg li>.tf-node-content:before {
    height: 1.5em;
    top: -1.5em
}

.tf-tree.tf-gap-lg li>.tf-nc:after,
.tf-tree.tf-gap-lg li>.tf-node-content:after {
    height: 1.5em
}

.tf-tree.tf-gap-lg li ul {
    margin: 3em 0
}

.tf-tree.tf-gap-lg li li:before {
    top: -1.53125em
}

.tf-tree.tf-gap-lg li li:only-child>.tf-nc:before,
.tf-tree.tf-gap-lg li li:only-child>.tf-node-content:before {
    height: 1.5625em;
    top: -1.5625em
}

.tf-tree li.tf-dotted-children .tf-nc:after,
.tf-tree li.tf-dotted-children .tf-nc:before,
.tf-tree li.tf-dotted-children .tf-node-content:after,
.tf-tree li.tf-dotted-children .tf-node-content:before {
    border-left-style: dotted
}

.tf-tree li.tf-dotted-children li:before {
    border-top-style: dotted
}

.tf-tree li.tf-dotted-children>.tf-nc:before,
.tf-tree li.tf-dotted-children>.tf-node-content:before {
    border-left-style: solid
}

.tf-tree li.tf-dashed-children .tf-nc:after,
.tf-tree li.tf-dashed-children .tf-nc:before,
.tf-tree li.tf-dashed-children .tf-node-content:after,
.tf-tree li.tf-dashed-children .tf-node-content:before {
    border-left-style: dashed
}

.tf-tree li.tf-dashed-children li:before {
    border-top-style: dashed
}

.tf-tree li.tf-dashed-children>.tf-nc:before,
.tf-tree li.tf-dashed-children>.tf-node-content:before {
    border-left-style: solid
}

.tf-tree li.nonode .treechild:after {
    display: none
}

.tf-tree::-webkit-scrollbar {
    width: 6px;
    height: 4px
}

.tf-tree::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, .3)
}

.tf-tree::-webkit-scrollbar-thumb {
    background-color: var(--bs-primary);
    outline: #708090 solid 1px;
    border-radius: 3px
}

.example .tf-nc {
    width: 190px;
    text-align: center;
    padding: 0;
    align-items: stretch;
    cursor: pointer;
    position: relative;
    background: var(--bs-odd-row-color);
}

.example .tf-nc .mat-icon {
    vertical-align: middle
}

.example .tf-nc .group-icons {
    position: absolute;
    top: -29px;
    left: 0;
    right: 0;
    background: var(--bs-primary-bg);
    width: 80%;
    margin: auto;
    z-index: 999;
    padding: 2px
}

.example .tf-nc .group-icons mat-icon {
    margin: 0 5px
}

.example .tf-nc .add-icon {
    position: absolute;
    bottom: -45px;
    left: 0;
    right: 0;
    width: 24px;
    margin: auto;
    background: #e8ecbc;
    border-radius: 24px;
    z-index: 999
}

.example .tf-nc .add-icon::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    margin: auto;
    width: 2px;
    height: 22px;
    background: #2c6691
}

.tf-tree ul li.parent-list {
    position: relative
}

.tf-tree ul li.parent-list::before {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 31px;
    width: 100%;
    border-top: .0625em solid #2c6691
}

.tf-tree ul li.parent-list:first-child::before {
    left: inherit;
    width: 50%
}

.tf-tree ul li.parent-list:last-child::before {
    right: inherit;
    width: 50%
}

.tf-tree ul li.parent-list:only-child::before {
    display: none
}

.tf-tree ul li div.tf-nc.active {
    border: 2px solid #2c6691;
    font-weight: 700
}

.tf-tree li div.tf-nc.parent {
    border-radius: 5px
}

.tf-tree li div.tf-nc.parent .treechild {
    min-height: 60px
}

.tf-tree li div.tf-nc.parent .treechild:after {
    position: absolute;
    content: "";
    left: 52%;
    top: 84%;
    border-top: 6px solid var(--bs-primary);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    margin-left: 5px
}

.tf-tree li div.tf-nc.child {
    border: 1px solid var(--bs-primary);
    max-width: 150px;
    min-height: 55px;
    border-radius: 5px
}

.tf-tree .treechild {
    min-height: 45px;
    padding: 5px;
    position: relative;
    word-break: break-word
}

.tf-tree .dot-icon {
    /*background: #e8ecbc;*/
    min-height: 98%;
    margin-top: 2%;
    max-width: 98%;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px
}

.tf-tree .child .treechild::after {
    position: absolute;
    content: "";
    left: 50%;
    top: 90%;
    border-top: 6px solid var(--bs-primary);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    margin-left: 5px
}

.tf-tree .parent.active .group-icons.ng-star-inserted,
.tf-tree .tf-nc.child.active .group-icons.ng-star-inserted {
    top: -30px
}

#tree {
    display: inline-block;
    padding: 10px;
}

#tree * {
    box-sizing: border-box;
}

#tree .branch {
    padding: 5px 0 5px 20px;
}

#tree .branch:not(:first-child) {
    margin-left: 170px;
}

#tree .branch:not(:first-child):after {
    content: "";
    width: 20px;
    border-top: 1px solid #ccc;
    position: absolute;
    left: 150px;
    top: 50%;
    margin-top: 1px;
}

.entry {
    position: relative;
    min-height: 42px;
    display: block;
}

.entry:before {
    content: "";
    height: 100%;
    border-left: 1px solid #ccc;
    position: absolute;
    left: -20px;
}

.entry:first-child:after {
    height: 10px;
    border-radius: 10px 0 0 0;
}

.entry:first-child:before {
    width: 10px;
    height: 50%;
    top: 50%;
    margin-top: 1px;
    border-radius: 10px 0 0 0;
}

.entry:after {
    content: "";
    width: 20px;
    transition: border 0.5s;
    border-top: 1px solid #ccc;
    position: absolute;
    left: -20px;
    top: 50%;
    margin-top: 1px;
}

.entry:last-child:before {
    width: 10px;
    height: 50%;
    border-radius: 0 0 0 10px;
}

.entry:last-child:after {
    height: 10px;
    border-top: none;
    transition: border 0.5s;
    border-bottom: 1px solid #ccc;
    border-radius: 0 0 0 10px;
    margin-top: -9px;
}

.entry:only-child:after {
    width: 10px;
    height: 0px;
    margin-top: 1px;
    border-radius: 0px;
}

.entry:only-child:before {
    display: none;
}

.entry span {
    border: 1px solid #ccc;
    display: block;
    min-width: 150px;
    padding: 5px 10px;
    line-height: 20px;
    text-align: center;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -15px;
    font-size: 14px;
    display: inline-block;
    border-radius: 5px;
    transition: all 0.5s;
}

#tree .entry span:hover,
#tree .entry span:hover+.branch .entry span {
    background: #e6e6e6;
    color: #000;
    border-color: #a6a6a6;
}

#tree .entry span:hover+.branch .entry::after,
#tree .entry span:hover+.branch .entry::before,
#tree .entry span:hover+.branch::before,
#tree .entry span:hover+.branch .branch::before {
    border-color: #a6a6a6;
}

.row .horizontal-cards-new:nth-child(even) {
    background: var(--bs-even-row-color);
    border-radius: 8px 8px 0px 0px;

}

.row .horizontal-cards-new:nth-child(odd) {
    background: var(--bs-odd-row-color);

}

.row .horizontal-cards-new:first-child {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.row .horizontal-cards-new:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

/* multi accordion grid with checkbox */
.matheader3 {
    background-color: var(--bs-table-primary-header);
    padding-left: 0.7rem !important;
}

.acivte-rowtab {
    background: var(--bs-secondary) !important;
}

.selected-row {
    background: var(--bs-secondary);
    color: white;
}

mat-accordion.mat-accordion.accordin-grid .mat-content {
    display: block !important;
}

.accordion-scroll {
    overflow-x: hidden;
    overflow-y: auto;
    /*height: 155px; */
}

.accordin-row-active {
    border: 2px solid var(--bs-secondary);
}

.accordion-panelgrid.mat-accordion .mat-expansion-panel:last-of-type {
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.accordion-panelgrid.mat-accordion .mat-expansion-panel:first-of-type {
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}

.accordion-panelgrid mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: none !important;
}



.accordin-grid .mat-expansion-panel-header {
    padding: 0px 32px;
}


/* .accordin-grid .mat-expansion-panel-header > span.mat-content {
        order: 2;    
        display: block;
    }
	*/
.multi-option-panel .mat-content {
    display: block !important;
    order: 2 !important;
}


.accordin-grid .mat-expansion-panel {
    background: none !important;
}


.accordion-head-row {
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
    background-color: var(--bs-table-primary-header);
    height: 56px;
    padding-top: 10px;
}

.firstheader-title {
    color: var(--bs-bodyTxt) !important;


}

.header-checkbox {
    font-family: 'OpenSans-SemiBold' !important;
    font-weight: 600;
    position: relative;
    left: 2px;
}

.grid-accordion-inner .mat-expansion-indicator {
    padding-right: 0px;
    height: 24px;
    width: 24px;
    position: relative;
    right: 10px;
    text-align: center;
    border: 2px solid;
    color: var(--bs-primary);
    border-radius: 50%;
}

.grid-accordion-inner .mat-expansion-panel-header-title {
    position: relative;
    top: 9px;
    cursor: auto;
}


.mat-accordion .mat-expansion-panel:first-of-type {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}

.accordion-panelgrid li:nth-child(odd) {
    background: var(--bs-odd-row-color);
    display: block;
}

.accordion-panelgrid li:nth-child(even) {
    display: block;
    background: var(--bs-even-row-color);
}

.accordion-panelgrid mat-expansion-panel {
    background: unset !important;

}

.accordion-head-row .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: unset !important;
}

.accordion-head-row .col:nth-child(2) {
    position: relative;
    left: 13px;
}

.accordion-head-row .col:nth-child(3) {
    position: relative;
    left: 10px;
}

.accordion-head-row .col:nth-child(4) {
    position: relative;
    left: 8px;
}

.accordion-panelgrid .mat-expansion-panel-body {
    padding-right: 0px !important;
}

.accordion-scroll .col:nth-child(2) {
    position: relative;
    left: 5px;
}

aesaggrid aesmoremenu button {
    float: right !important;

}

.section-expander .mat-content {
    display: unset !important;
}

.section-expander .mat-expansion-panel-header {
    background: var(--bs-even-row-color) !important;
    padding: 40px 10px !important;
    border-bottom: 5px solid #fff;
}

.section-expander .mat-expansion-panel-header-title {
    color: inherit;
}
 
.section-expander .mat-expansion-panel-body table.mat-table td{
    color: inherit;
    font-family: 'OpenSans-Regular', Arial !important ;
    font-size: inherit;
}

.section-expander .mat-expansion-panel-body {
    margin-top: 10px !important;
    padding: unset !important;
}

.section-expander .mat-expansion-panel {
    box-shadow: unset !important;
}

.ag-header-icon.ag-header-cell-menu-button {
    opacity: 1 !important;
}

.bookmark-control-list {
    height: 50vh;
    overflow-y: auto;
}

.scrollableTable {

    overflow-x: auto !important;
    overflow-y: hidden !important;

}

.icon-switch {
    color: var(--bs-white);
    width: 60px;
    height: 28px;
    border-radius: 4px;
    background: var(--Light-blue, #CAE3F3);
    box-shadow: 0px 0px 8px 0px #A9C9DD inset;
}


.icon-switch-on {
    text-align: center;
    cursor: pointer;
    padding: 4px 5px;
    color: var(--bs-white);
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: 4px;
    background: var(--bs-light-primary);
    box-shadow: 2px 2px 5px 0px #A9C9DD;
}

.icon-switch-off {
    text-align: center;
    padding: 4px 5px;
    color: var(--bs-darkgrey);
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: 4px;
}

app-aes-table .mat-table {
    display: grid;
    width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
}

.tab-content-popup {
    min-width: unset !important;
}

.childnode.workflow-approval {
    background: #FDF0C2 !important;
}

.childnode.workflow-notify {
    background: #CAE3F3 !important;
}

.childnode.workflow-escalate {
    background: #F5EAFD !important;
}

.ag-body-vertical-scroll-viewport {
    overflow-y: hidden !important;
}

.agGridAddRowSection {

    padding-bottom: 10px;
}


.step-counter {
    padding: 7px 16px 7px 8px;
    background: var(--bs-light-secondary);
    border-radius: 4px;
}




span.stepMoverContent.dropdown-item {
    position: relative;
    right: 222px;
    background: #fff;
    border: 1px solid var(--bs-secondary);
    border-radius: 8px;
}

span.stepMoverContent-left.dropdown-item {
    position: relative;
    background: #fff;
    border: 1px solid var(--bs-secondary);
    border-radius: 8px;
}


h5#exampleModalLongTitle {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 28px !important;
    margin-top: 10px;
}

.modal-header.p4 {
    padding-bottom: 0px !important;
    margin-top: 10px;
}

.width100 {
    width: 100px;
}

.card-widget-footer {
    position: absolute;
    bottom: 0;
    top: 130px;
}

.icon-switch.switch-position {
    position: relative;
    left: 28px;
}

.afd-dialog-half .close:not(:disabled):not(.disabled):focus,
.close:not(:disabled):not(.disabled):hover {
    opacity: unset !important;
}

.gridCheckbox {
    width: 50px;
}

.Filter-widget2.customized-widget2 {
    padding: unset !important;
    min-height: unset !important;
}

.table-accordin-icon .mat-expansion-indicator {
    position: absolute;
}

.table-header-custom.h11 {
    padding-left: 24px;
    line-height: 52px;
    padding-top: 2px;
    /* border-radius: 8px; */
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background-color: var(--bs-table-primary-header);
    font-weight: bold;
    /* position: relative; */
}

.BtnDropDown-menu button {
    background: #2C6691;
    border: none !important;
    color: white;
    font-family: Open Sans;
    font-size: 14px;
    font-weight: 700;
    line-height: 14px;
}

.BtnDropDown-menu button {
    width: 190px !important;
    height: 40px !important;
    border-radius: 50px !important;
    position: relative;
    z-index: 1000;
}

.BtnDropDown-menu ul {
    position: relative;
    display: none;
    width: 190px;
    height: 100%;
    border-radius: 20px 20px 8px 8px;
    background-color: var(--bs-light-primary);
    top: 0px;
    padding: 8px;
    font-family: Open Sans;
    font-size: 14px;
    font-weight: 700;
    line-height: 14px;
    letter-spacing: 0em;
    text-align: left;
    color: white;
}

.BtnDropDown-menu button:focus+ul {
    display: block;
    top: -30px;

}

.BtnDropDown-menu ul li {
    line-height: 25px;
    height: 100%;
    position: relative;
    left: 10px;
}

.payrollSummaryLegend1 {
    width: 8px;
    height: 20px;
    border-radius: 30px;
    background: var(--bs-light-primary);
}

.payrollSummaryLegend2 {
    width: 8px;
    height: 20px;
    border-radius: 30px;
    background: #FCD139;
}

.payrollSummaryLegend3 {
    width: 8px;
    height: 20px;
    border-radius: 30px;
    background: #2C6691;
}

.pay-table-with-ctrl.mat-table tr td {
    padding-left: 10px !important;
    white-space: normal;
}

.panel-title-limit {
    width: 210px;
    display: inline-block !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* allocation charts */
.budgetflowChart {
    width: 361px;
    border-radius: 4px;
    border: 1px solid #74748D4D;
    background: #FDFDFD;
    box-shadow: none;
}

.budgetflowChartHeader {
    width: 360px;
    height: 50px;
    background-color: var(--bs-odd-row-color) !important;
}

.budgettree-chart span.mat-expansion-indicator {
    height: 27px;
    width: 27px;
    border: 2px solid var(--bs-primary);
    text-align: center;
    border-radius: 50%;
    position: relative;
    left: 15px;
}

.arth-operator input {
    height: 34px;
    width: 75px;
}

.formula-builder-tool2.mat-card-title {

    font-family: inherit !important;
    font-size: 12px !important;
}

.formula-builder-tool2 .mat-card {
    box-shadow: none !important;
    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    position: relative;
    padding: 10px;
    border-radius: 4px;
    /* border-radius: 8px; */
    border: 1px solid #d6d6d6;
    margin-bottom: 8px;
    line-height: 12px;
}

.formula-builder-tool2 .mat-card-title {
    margin-bottom: 0px !important;
}

.formula-builder-tool2 .mat-card-header {
    margin-bottom: 0px !important;
}


.formula-builder-tool2 .mat-card-header-text {
    width: 100%;

}

li.liststyle.arth-operator {
    padding-top: 4px;
}

.fixed-panel {
    height: 280px !important;
    padding: 10px;
    border: 1px solid var(--bs-low-light-grey);
    margin: 5px;
    position: absolute;
    overflow-x: hidden;
    overflow-y: auto;
    width: 90%
}

.popup-tab-content {
    min-width: unset !important;
}

.role-table2 {
    height: 800px;
    overflow-y: auto;
}

/* cost table */


.cost-table {
    border-collapse: separate;
    border-spacing: 0;
}

.cost-table th {
    background: var(--bs-even-row-color);
    padding: 8px 12px 8px 12px;
    text-align: center;
    border: 1px solid;
    border-color: rgba(116, 116, 141, 0.3);
}

.cost-table td {

    text-align: center;
    border: 1px solid;
    border-color: rgba(116, 116, 141, 0.3);
}


.cost-table th:first-child {
    border-top-left-radius: 8px !important;
}

.cost-table th:last-child {
    border-top-right-radius: 8px !important;
}

.cost-table td:last-child {
    border-bottom-right-radius: 8px !important;
}

.cost-table td:first-child {
    border-bottom-left-radius: 8px !important;
    background: var(--bs-even-row-color);
}

.BtnCircle {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--bs-primary);
    text-align: center;
    line-height: 16px;
}

.cost-table td {
    text-align: center;
    border: 1px solid;
    border-color: rgba(116, 116, 141, 0.3);
    background: #fff;
}

.mail-content-wrapper .angular-editor-textarea {
    background: #fff !important;
    border-radius: 8px;
}

/*accordion grid expansion pannel pointer event change*/
.accordion-panelgrid mat-expansion-panel-header {
    cursor: auto !important;
}

.accordion-panelgrid .mat-expansion-indicator {
    cursor: pointer !important;
}

.multi-option-panel .mat-expansion-panel-header {
    cursor: auto;
}

.tree-view-panel {
    min-height: 570px !important;
    width: 95%;
}

.emp-mail-limit {
    overflow-x: hidden;
    overflow-y: auto;
}

.check-with-input .mat-checkbox-label {
    text-wrap: wrap;
}

.ag-cell aesmoremenu button {
    position: relative;
    left: 13px;
}

.width100 {
    min-width: 100px;
}

.angular-editor-toolbar i {
    color: var(--bs-primary) !important;
}

.angular-editor-toolbar .ae-font .ae-picker-label svg .ae-stroke {
    stroke: var(--bs-primary);
}

.angular-editor-toolbar .angular-editor-toolbar-set .background {
    font-size: smaller;
    background: #FCD139 !important;
    color: var(--bs-primary) !important;
    padding: 3px;
}

img.logo-list-img {
    height: 36px;
    width: 36px;
    border-radius: 4px;
    border: solid 1px #74748D;
}

.dynamic-table4 .mat-form-field-wrapper {
    padding-bottom: 5px;
    margin-top: 5px;
    min-width: 140px;
}

.data-column-border {
    border: 1px solid #f5f5f5 !important;
}

/*
textarea.mat-input-element {
    min-height: 80px !important;
}
*/


.Afdtxt-area-five textarea {
    min-height: 80px;
}

.mat-tree-node,
.mat-nested-tree-node {
    /*font-weight: 600 !important; */
    /*  font-size: 12px !important; */
}

/* workflow tree */


.displaynode {
    padding: 9px;
    min-width: 78px;
    padding: 4px 4px 4px 8px;
    border-radius: 4px;
    border: 1px solid #74748D4D;
    text-align: center;
    background: var(--bs-odd-row-color);
}



.tree-lvl1:after {

    content: "";
    height: 2px;
    border: 1px groove !important;
    width: 100%;
    top: 50%;
}

.tree-plus {
    position: relative;
    top: 2px;

}


.workflow-tree .mat-icon-button {
    height: unset !important;
    width: unset !important;
}

/* Shift roster css */


/* .grouprosterTable.shift-time-Droptable { */
/* overflow-x: hidden !important; */
/* } */

.hideShiftContent .cdk-drop-list {
    pointer-events: none;
}

.selectedShiftContent span {
    display: none;
}

.showShiftContent {
    display: none;
}

.hideShiftContent:hover .showShiftContent {
    display: block;
    color: #74748D;
}

.hideShiftContent:hover .showShiftContent span {
    display: block;
}

.hideShiftContent:hover:hover {
    border: 0;
}

.selectedShiftcell .selectedShiftContent {
    display: block;
    color: grey;
    cursor: pointer;

    height: 80px;
    background-color: #E6ECF4 !important;
    box-shadow: unset !important;
}

.selectedShiftcell .selectedShiftContent span {
    display: block;
}

.ShiftColorIndicator {
    display: none;
}

.ShiftDropped {
    pointer-events: none !important;
}


.ShiftDropped .ShiftColorIndicator {
    display: block;
    position: relative;
    padding: 0px;
    margin: auto;
    width: 100%;
    height: 25px !important;
    top: -5px !important;
}

.deleteShift {
    position: relative;
    text-align: right;
    top: 2px;
    right: 8px;

}

.deleteShift mat-icon {
    cursor: pointer !important;
    color: #fff !important;
    opacity: 0.8 !important;
    pointer-events: auto !important;
}

.deleteShift span mat-icon {
    font-size: 20px;
    color: #c9c9c9 !important;
    cursor: pointer !important;
}

.ShiftCellContainer .cdk-drop-list {
    padding-left: unset !important;
    padding-right: unset !important;
}

.shiftHeader {
    border-radius: 8px 8px 0px 0px;
    border: 1px solid #74748D4D;
    background: var(--bs-odd-row-color);
}

.shiftCalendarTable table {

    width: 100% !important;

}

.shiftCalendarTable th {
    border: 1px solid #74748D4D;
}

.shiftCalendarTable td {
    min-width: 175px !important;
    height: 80px !important;
}

.adhocShiftTable .ShiftDropped .ShiftColorIndicator {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center;
    padding: 0px 5px !important;
    position: relative;
    margin: auto;
    width: 100%;
    height: 25px !important;
    top: -5px !important;
}

.adhocShiftTable .deleteShift.shiftDeleteIcon mat-icon {
    position: absolute !important;
    text-align: right;
    top: 50px !important;
    right: 0px !important;
    left: 0px;
}

.adhocShiftTable .shiftHourIndicator {
    position: relative;
    left: 7px;
    top: -2px;
}

.adhocShiftTable .deleteShift.shiftDeleteIcon span.moveDeleteicon mat-icon {
    position: relative;
    left: 10px;
}

.disableDiv {
    pointer-events: none;
}

.blinking {
    background: var(--bs-light-secondary) !important;
}


.drop-cnt {
    position: relative;
    top: 33px;
}

.shiftCalendarTable {
    overflow-x: auto;

}

.droppable-item {
    list-style-type: none !important;
    height: 56px;
    border-radius: 4px;
    padding: 18px;
    border: 1px solid #74748D4D;
    background: #FDFDFD;
    margin-bottom: 8px;
    pointer-events: none;
}

.ShiftListColorIndicator {
    display: block;
    width: 15px;
    height: 15px;
}

.ShiftCellContainer {
    width: 175px !important;
    height: 116px !important;
    border: 1px solid #74748D4D !important;
    background-color: #FDFDFD;
    box-shadow: unset !important;
    padding: 0px !important;
    font-size: 12px;
}

.SelectedShiftCell {
    display: block !important;
    width: 175px !important;
    height: 116px !important;
    border: 1px solid #74748D4D !important;
    background-color: #E6ECF4 !important;
    box-shadow: unset !important;
}

.shift-time-drag {
    height: 550px;
    overflow-y: auto;
    overflow-x: hidden;
}

.shift-time-Droptable {
    height: 550px;
    overflow-y: auto;
    overflow-x: auto;
}

.date-lable-limit {
    max-width: 100px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.name-limit2 {
    width: 140px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.rosteremp-limit {
    width: unset;
    /* width: 120px; */
    /* display: inline-block; */
    /* white-space: nowrap; */
    /* text-overflow: ellipsis; */
    /* overflow: hidden; */
}

.shift-dragger {
    pointer-events: auto !important;
}

.shiftCalendarTable table tr td:first-child {
    display: table-cell;
    min-width: 150px !important;
    padding-left: 5px !important;
}

.rostedragremp-limit {
    width: 120px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.shiftCalendarTable table tr:first-child td {
    height: 24px !important;
    padding: 12px !important;
}



.fc .fc-scrollgrid-liquid {
    height: 100%;
    border: 1px solid #74748D4D;
}

.fc-col-header-cell.fc-day {
    padding: 12px 0px !important;
}

.fc-scrollgrid-sync-inner .fc-col-header-cell-cushion {
    color: var(--bs-darkgrey) !important;
    text-decoration: none !important;
    cursor: auto;
    font-size: 14px !important;
    font-weight: 700;
    font-family: OpenSans-Regular;
    line-height: 14px !important;
}

/* .fc .fc-toolbar { */
/* align-items: normal !important; */
/* display: block !important; */
/* justify-content: normal !important; */
/* } */

.fc-header-toolbar.fc-toolbar h2 {
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.fc-toolbar-chunk .fc-today-button {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px;
}

.fc-toolbar-chunk .fc-next-button {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.fc-toolbar-chunk .fc-prev-button {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.fc .fc-button-primary {
    background-color: var(--bs-white) !important;
    border-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    padding-left: 0px;
}

.fc .fc-day-other .fc-daygrid-day-top {
    color: #B0B0B0 !important;
}

.fc .fc-daygrid-day-number {
    padding: 0px 8px 0px 0px !important;
    position: relative;
    z-index: 4;
    color: var(--bs-bodyTxt) !important;
    text-decoration: none !important;
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 20px !important;
}

.fc-prev-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-next-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-today-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-today-button {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px !important;
    text-transform: capitalize !important;
}

.fc .fc-button-group {
    display: inline-flex;
    position: relative;
    vertical-align: middle;
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.fc .fc-button:disabled {
    opacity: unset !important;
}

.fc-direction-ltr .fc-daygrid-event.fc-event-end {
    margin-right: unset !important;
}

.fc-direction-ltr .fc-daygrid-event.fc-event-start {
    margin-left: unset !important;
}

.fc .fc-daygrid-event {
    margin-top: unset !important;
}

.fc-daygrid-event {
    border-radius: 0px;
    font-size: 14px !important;
    height: 32px !important;
    position: relative;
    white-space: nowrap;
}

.fc-h-event {
    background-color: var(--fc-event-bg-color);
    border: none !important;
    display: block;
}

.fc .fc-daygrid-day.fc-day-today {
    background: var(--bs-light-secondary) !important;
}

.fc-h-event .fc-event-title-container {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0px;
    padding: 5px;
}

.fc .fc-scrollgrid-liquid {
    height: 100%;
    border: 1px solid #74748D4D;
}

.fc-col-header-cell.fc-day {
    padding: 12px 0px !important;
}

.fc-scrollgrid-sync-inner .fc-col-header-cell-cushion {
    color: var(--bs-darkgrey) !important;
    text-decoration: none !important;
    cursor: auto;
    font-size: 14px !important;
    font-weight: 700;
    font-family: OpenSans-Regular;
    line-height: 14px !important;
}

/* .fc .fc-toolbar { */
/* align-items: normal !important; */
/* display: block !important; */
/* justify-content: normal !important; */
/* } */

.fc .fc-button-primary {
    background-color: var(--bs-white) !important;
    border-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    padding-left: 0px;
}

.fc .fc-day-other .fc-daygrid-day-top {
    color: #B0B0B0 !important;
}

.fc .fc-daygrid-day-number {
    padding: 0px 8px 0px 0px !important;
    position: relative;
    z-index: 4;
    color: var(--bs-bodyTxt) !important;
    text-decoration: none !important;
    font-family: 'Montserrat-Regular', Arial !important;
    font-size: 20px !important;
}

.fc-prev-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-next-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-today-button.fc-button.fc-button-primary:focus {
    box-shadow: none !important;
}

.fc-today-button {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px !important;
    text-transform: capitalize !important;
}

.fc .fc-button-group {
    display: inline-flex;
    position: relative;
    vertical-align: middle;
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 18px !important;
    font-weight: 600;
}

.fc .fc-button:disabled {
    opacity: unset !important;
}

.fc-direction-ltr .fc-daygrid-event.fc-event-end {
    margin-right: unset !important;
}

.fc-direction-ltr .fc-daygrid-event.fc-event-start {
    margin-left: unset !important;
}

.fc .fc-daygrid-event {
    margin-top: unset !important;
}

.fc-daygrid-event {
    border-radius: 0px;
    font-size: 14px !important;
    height: 32px !important;
    position: relative;
    white-space: nowrap;
}

.fc-daygrid-body {
    width: 100% !important;
    height: 100% !important;
}


.fc-h-event {
    background-color: var(--fc-event-bg-color);
    border: none !important;
    display: block;
}

.fc .fc-daygrid-day.fc-day-today {
    background: var(--bs-light-secondary) !important;
}

.fc-h-event .fc-event-title-container {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0px;
    padding: 5px;
}

.fc-scrollgrid-sync-table {
    width: 100% !important;
    height: 100% !important;
}

.fc-col-header {
    width: 100% !important;
}


/* Interview verification link */

.interview-login-card {

    margin: auto;
    border-radius: 15px;
    background: var(--bs-login-bg);
    padding: 0.8rem;
    width: 350px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


.interview-login-content {
    padding-left: 30px;
    padding-right: 30px;
}

.interview-verify-captcha img {
    height: 30px;
}

.comments-date.h15 {
    font-size: 14px !important;
    line-height: normal !important;
}


/* interview page css */

.interviewInnerHeader {
    display: block !important;
    padding: 25px !important;
    background: white;
    box-shadow: 0px 4px 12px var(--bs-topbar-shadow);
    height: 64px !important;
}

.interviewInnerHeader img {
    position: relative;
    top: -10px;
    cursor: pointer;
}

.pdf-viewer-panel {

    position: relative !important;
    height: 100vh !important;
    width: 100% !important;
}


/* External Interview page */


.interviewInnerHeader-menu {
    width: 450px !important;
    box-shadow: 1px 2px 8px #EAEAEA !important;
    position: relative;
    top: 15px;
}

.profile-header-external {
    background-color: var(--bs-table-head);
    height: 86px;
    position: relative;
    top: -15px;

}


.interviewInnerHeader.mat-menu-content:not(:empty) {
    padding-top: 0px !important;
}

.interviewInnerHeader.mat-menu-panel {
    position: relative;
    top: 15px;
}

html {
    background: #f0f0f0 !important;
	/* scroll-behavior: auto !important; */
}

.BtnTransL .mat-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    width: 100%;
    border-radius: 54px !important;
    margin: auto !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.srch-viewmore {
    position: relative;
    right: 20px;
}

.formula-data-limit170 {
    max-width: 170px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-top: 5px;
}

.agGridHyperlink {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px;
}

/* admin additional forms */

.accordion-list-checkbox0 {
    position: relative;
    left: 38px;
}

.accordion-list-checkbox1 {
    position: relative;
    left: 5px;
}

.accordion-list-checkbox2 {
    position: relative;
    right: 6px;
}

/* lta-reimbursement css */

.multi-data-Widget {
    margin: auto;
    border-radius: 8px;
    flex-shrink: 0;
        background: var(--bs-filter-widget-bg);
    border: 1px solid var(--bs-low-light-grey);
    display: flex;
    justify-content: center;
    padding: 15px !important;
}

.customPagination {
    line-height: 0px !important;
    padding: 3px 15px !important;
    font-size: 12px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    position: relative;
    top: 2px;
}

.customPaginationBtn {
    width: 25px;
    height: 25px;
    border: 2px solid var(--bs-primary);
    border-radius: 50%;
    color: var(--bs-primary);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 10px;
}

.ComphistoryPreviewer {
    border: 1px solid #e0e0e0;
    padding: 15px;
}

.Footer-row-Bg {
    background-color: var(--bs-odd-row-color) !important;
}

.left-nav-position {

    position: relative;
    top: 3px;
}

.ag-checkbox-input-wrapper::after {

    color: var(--bs-primary) !important;

}

/* formula builder css */

.formulaDropArea {
    width: 100% !important;
    border: none !important;
}

/* Employee summary form mapping dropdown  */
.mat-select-panel .mat-option {
    height: unset;
    line-height: 1.3 !important;
    /*important given for dropdown to set default line heihgt */
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 18px;
    white-space: normal;
}

/* ------------X--------------- */

/* system setup  */

.sys-drop-container {
    /* width: 415px; */
    height: 236px;
    background: #FAFAFA;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
}

.sys-file-input {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.sys-image-container {
    position: relative !important;
    display: inline-block;
    margin: 5px;
    top: -140px;
}

.sys-close-icon {
    width: 16px;
    height: 16px;
    border-radius: 50px;
    position: relative;
    top: -63px;
    right: -84px;
    background-color: #ffffff;
    text-align: center;
    cursor: pointer;
    border: 2px solid #2C6691;
    display: flex;
    justify-content: center;
}

.sys-upload-content {
    display: flex;
    position: relative;
    top: 20%;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.sys-imageDropicon {
    display: inline-block;
    width: 80px;
    height: 80px;
    padding: 22px 18px 22px 17.47px;
    background-color: rgba(116, 116, 141, 0.30);
    border-radius: 50%;
    text-align: center;
}

.sys-imageDropicon i {
    color: #fff;
    font-size: 40px;
}

.sys-close-icon-logout {
    width: 20px;
    height: 20px;
    border-radius: 50px;
    position: relative;
    top: -7px;
    right: 10px;
    background-color: #ffffff;
    text-align: center;
    cursor: pointer;
    border: 2px solid #2C6691;
    display: flex;
    justify-content: center;
    padding-top: 2px;
}


.ag-header-row {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.ag-pinned-right-header .ag-header-row {
    border-top-right-radius: 10px !important;
    border-top-left-radius: 0px !important;
}

.ag-center-cols-container div:last-child {
    border-bottom-right-radius: 0px !important
}

.ag-pinned-right-cols-container div:last-child {
    border-bottom-left-radius: 0px !important
}

.pay-table-inline {
    width: 100%;
    display: inline-table;
}

.mat-nested-tree-node ul {
    padding: revert;
}

.width190 {
    width: 190px;
}

app-travel-budgetary-master-new-ui .new-calendar-menu2 {
    top: -5px !important;
}

/* For laptop 1920 resolution */

@media only screen and (max-width: 1920px) and (-webkit-min-device-pixel-ratio: 1.25) {
    .wrapper {
        margin-top: 40px !important;
    }

    .languages-menu {
        margin-top: 0px !important;
    }

    body {
        zoom: auto;
        overflow: hidden;
    }
}

@media screen and (max-width: 767px) {
    body {
        overflow-y: auto !important;
    }
}

/*For login OTP */
.otp-field {
    display: flex;
}

.otp-field input {
    width: 40px;
    height: 60px;
    font-size: 24px;
    padding: 10px;
    text-align: center;
    border-radius: 8px;
    margin: 2px;
    background: var(--bs-even-row-color);
    color: var("bodty-txt");
    outline: none !important;
    margin-right: 16px;
    transition: all 0.1s;
    border: none;
}

input.otp.ng-pristine.ng-invalid.ng-touched {
    border: 1px solid red;
}

/* Manpower budgeting css */

.powerTableHeader {
    height: 24px;
    padding: 0px;
    background-color: var(--bs-table-primary-header);

}

.powerTableHeader:first-child {
    border-top-left-radius: 8px;
}


.powerTableSubHeader {
    height: 44px;
    background: #FDFDFD;

    padding: 0px;
    padding-left: 15px;
}

.powerTableContent {
    display: flex;
    padding: 0;

    height: 36px;
}

.powerTable {
    border-collapse: separate;
    border-spacing: 0;
}

.powerTable td {
    height: 36px;
    padding: 0;
}

.powerTablerow {
    background-color: var(--bs-even-row-color) !important;
}


.contentBorderTable tr td {
    border-right: 0px;
    border-left: 0px;
}

.powerTablerow .align-top.position-td {
    width: 190px;
}

.powerTablerow .category-td {
    width: 135px;
}

.powerTablerow .count-td {
    width: 270px;
}

.categoryContent {
    padding-left: 15px;
}

.costContentallign {
    padding-right: 15px;
}

.PowerTableContainer .Powermonthtable {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.Powermonthtable th {
    padding: 8px;
    text-align: left;
}

.Powermonthtable td {
    padding: 8px;
    text-align: left;
}


.Powermonthtable tr:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

.PowerTableContainer .Powermonthtable.table-bordered td {
    height: 36px;
    padding-left: 15px;
    padding-right: 15px;
    text-wrap: nowrap;
    min-width: 135px;
}

.Powermonthtable .powerTableSubHeader {
    padding: 0px 15px;
}

.AddMinusButton {
    width: 77px;
    height: 28px;
    display: flex;
    align-items: center;
    border: 1px solid #74748D4D;
    border-radius: 4px;
    overflow: hidden;
    justify-content: normal;
    background: #FFFFFF;
}

.incrementbtn {
    border-left: 1px solid #74748D4D;
    padding: 5px;
}

.decrementbtn {
    border-right: 1px solid #74748D4D;
    padding: 5px;
}

.AddMinusDisplay {
    padding: 0px 3px;
    min-width: 30px;
}

.AddMinusButton .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
    padding: unset !important;
}

.AddMinusButton .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
    line-height: unset !important;
}

.AddMinusButton .mat-button-toggle:hover {
    background: none !important;
}

.AddMinusButton .mat-button-toggle-checked {
    background: none !important;
}

.PowerTableContainer {
    overflow-x: auto;
}

.AddMinusButton {
    width: 77px;
    height: 28px;
    display: flex;
    justify-content: space-evenly;
}

.AddMinusButton .mat-button-toggle-focus-overlay {
    background: none !important;
}

.iframeContainerClass {
    display: block;
    margin-top: 64px !important;
    padding-left: 75px;
    overflow-x: hidden;
    height: calc(100vh - 63px);
}

.mb-contentContainer {
    max-width: 1366px;
    padding-right: 48px;
    height: auto;
    padding-top: 20px;
    padding-left: 7px;
}

.MpShadowWidget1 {
    /* width: 690px; */
    height: 428px;
    background: #FDFDFD;
    box-shadow: 0px 4px 20px 0px #EAEAEA;
    border-radius: 15px;
    padding: 24px;
}

.MpShadowWidget2 {
    height: 428px;
    background: #FDFDFD;
    box-shadow: 0px 4px 20px 0px #EAEAEA;
    border-radius: 15px;
    padding: 24px;
	/* width: 444px; */
}

.MpShadowWidget3 {
    height: 200px;
    border-radius: 15px;
    box-shadow: 0px 4px 20px 0px #EAEAEA;
    background: #FDFDFD;
    padding: 26px 35px;
}

.cost-table-customized tr:nth-child(even) td:last-child {
    border-bottom-right-radius: 0px !important
}

.cost-table-customized tr:nth-child(even) td:nth-child(1) {
    border-bottom-left-radius: 0px !important
}

.cost-table-customized tr:not(:first-child) th:not(:first-child) {
    border-top-right-radius: 0px !important;
}

.cost-table-customized tr:nth-child(3) th:first-child {
    border-top-left-radius: 0px !important
}

.cost-table-customized tr:nth-child(5) th:first-child {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 8px !important;
}

.cost-table-customized tr:last-child td:last-child {
    border-bottom-right-radius: 8px !important
}

.budgetDepartmentAllocTable tr:nth-child(even) {
    background-color: var(--bs-even-row-color);
}

.budgetDepartmentAllocTable tr:nth-child(odd) {
    background-color: var(--bs-odd-row-color);
}

.budgetDepartmentAllocTable .header-row {
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    background-color: var(--bs-table-primary-header);
}

.budgetDepartmentAllocTable {
    border-collapse: collapse;
    border-radius: 8px;
    overflow: hidden;
}


.budgetDepartmentAllocTable td {
    /* border: 1px solid rgba(116, 116, 141, 0.3) !important; */
    padding: 5px 10px !important;
}

.budgetaccordionData {
    padding-top: 5px;
}

.budgetaccordionData div {
    padding: 10px;
    margin-right: -10px;
    margin-left: -10px;
    margin-bottom: -5px;
}

.budgetaccordionData div:nth-child(even) {
    background-color: var(--bs-odd-row-color);
}

.budgetaccordionData div:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

/* Employee details label */

.EmpDetColordiff {
        color: var(--bs-highlight-text);
}

span.fileUploadLabel {
    position: relative;
    top: -7px;
}

/*AES COLOR PICKER */

.AeSColorPickerInput {
    width: 100px !important;
    height: 35px !important;
    padding: 5px 10px !important;
    padding-left: 0px !important;
}
 
.AesColorPickerSpan {
    vertical-align: middle;
    margin-bottom: 15px;
    display: inline-block;
}
 
.AeSColorPicker .mat-form-field-infix {
    padding: unset !important;
}
 
.AeSColorPicker .mat-form-field-suffix {
    top: -3px !important;
    cursor: pointer;
}

/* AES HELP CONTROL */
.Aeshelp-control {
    position: relative;
    top: 13px;

}


.Aeshelp-txt {
    position: relative;
    top: -3px;
}

/* For checkbox BAckground color 
aescheckbox .mat-checkbox-inner-container {
    background: var(--bs-white) !important;
    border-radius: 2px;
}
*/
.customized-mat-row {
    height: 67px;
}

.master-widget-container {
    border: 1px solid #74748D4D;
    padding: 15px;
    padding-bottom: 0px;
    border-radius: 8px;
}

.addedMasterLabel {
    padding: 8px 20px 8px 20px;
    background: var(--bs-even-row-color);
    border-radius: 100px;
    margin-bottom: 15px;
}

/*Custom file control */
.CustomizedFileUpload {
    position: relative;
    top: -6px;
}




/*ORG CHART CSS */
/* ORG Chart css */

.chkScrollEnable {
    position: absolute;
    left: 270px;
    top: 15px;
    z-index: 9;
}

#OrgGroupchart .boc-edit-form,#OrgOUchart .boc-edit-form,#OrgPositionChart .boc-edit-form {
    margin-right:0px;
}
 

.AeSOrgChartCommon .boc-search-image-td {
    display: none;
}

.boc-search-text-td mark {
    padding-top: 0px;
}

td.boc-search-text-td {
    padding: 10px;
}

.boc-form-field .boc-link {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px;
    color: var(--bs-primary);
    text-decoration: none;
    font-weight: 600;
}

/* #hierarchalChart line{ */
/* stroke:var(--bs-primary) !important; */
/* } */
/* #hierarchalChart text { */
/* fill:var(--bs-primary) !Important; */
/* font-size:14px !important; */
/* font-weight:600; */
/* font-family:inherit !important; */
/* } */
/* #hierarchalChart tspan{ */
/* fill: var(--bs-darkgrey) !important;  */
/* font-weight:500; */

/* } */

.boc-edit-form-header {
    background: var(--bs-secondary) !important;
    border-bottom-left-radius: 0px !important;
    ;
    border-bottom-right-radius: 0px !important;
    ;

}

.boc-edit-form {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    margin-right: 10px;


}

.boc-edit-form-title {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 20px !important;
    font-weight: 600;
    letter-spacing: 1px;
    max-width: 355px;
    position: relative;
    left: 30px;
    /* display: flex; */
}

.boc-img-button {
    background: var(--bs-primary) !important;
}

.boc-img-button svg {
    position: relative !important;
    ;
    top: 8px !important;
    ;
}

.boc-dark input,
.boc-dark select,
.boc-light input,
.boc-light select {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
}

.boc-button.transparent {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;

    min-width: 160px;
    border-radius: 54px !important;
    margin: auto !important;

    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.boc-button {
    height: 40px !important;

    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;

    min-width: 200px;
    border-radius: 54px !important;
    margin: auto !important;

    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.boc-light .boc-chart-menu {
    cursor: pointer;
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    font-family: 'OpenSans-Regular', Arial !important;
}

.boc-light .boc-chart-menu [data-item]:hover {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    font-family: 'OpenSans-Regular', Arial !important;
}

.boc-edit-form {
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
    /* box-shadow: rgba(0, 0, 0, .2) 0 6px 6px 0, rgba(0, 0, 0, .19) 0 13px 20px 0; */
    display: flex;
    flex-direction: column;
    height: 99% !important;
    width: 400px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.boc-edit-form {

    width: 400px !important;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px !important;
}

.companyPolicyPanel ul li:nth-child(even) mat-expansion-panel {
    background: var(--bs-odd-row-color) !important;
}

.companyPolicyPanel ul li:nth-child(odd) mat-expansion-panel {
    background: var(--bs-even-row-color) !important;

}

.boc-search {
    position: absolute;
    width: 100%;
    left: 15px !important;
}

.boc-form-field {
    width: 500px;
}


.boc-light .boc-input>input:focus,
.boc-light .boc-input>select:focus {
    border-color: var(--bs-primary) !important;
    background-color: unset !important;
}

.boc-dark .boc-input>label.focused,
.boc-light .boc-input>label.focused {
    color: unset !important;
}

.boc-link-boc-button {
    color: unset !important;
    top: 10px !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-weight: normal !important;
}

.boc-light .boc-input>input,
.boc-light .boc-input>select {
    color: var(--bs-bodyTxt) !important;
}

.rectShadow {

    stroke: var(--bs-primary);
    stroke-width: 3px;

}

/* ORG CHART CSS END */



/* BUDGET CONSOLE TABLE CSS */

.InnerContentTable tr td {
    border-top: 0px;
    border-right: 0px;
    border-left: 0px;
}

.InnerContentTable tr:last-child td:last-child {
    border-bottom: 0px;
}

.budgetTableContainer table tr:nth-child(odd):not(.InnerContentTable tr) {
    background: var(--bs-odd-row-color);
}

.budgetTableContainer table tr:nth-child(even):not(.InnerContentTable tr) {
    background: var(--bs-even-row-color);
}


.budgetTableContainer table tr td:first-child,
.budgetTableContainer table td:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 9 !important;
}

.budgetTableContainer table tr td:first-child {
    z-index: 100000 !important;
    background: inherit;
}

.budgetTableContainer table tr td:nth-child(2),
.budgetTableContainer table td:nth-child(2) {
    position: sticky !important;
    left: 212px !important;
    z-index: 9 !important;
}

.budgetTableContainer table tr td:nth-child(2) {
    z-index: 100000 !important;
    background: inherit;
}

.budgetTableContainer table tr td {
    position: sticky;
    top: 0;
    z-index: 999 !important;
}

.budgetTableContainer {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    width: 100%;
    overflow: scroll !important;
    overflow-y: auto !important;
}

.budgetTableContainer table td {
    min-width: 270px;
    /* padding-top: 12px; */
    /* padding-bottom: 12px; */
    line-height: 28px;
}

.budgetTableContainer table tr:first-child:not(.InnerContentTable tr) {
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    background-color: var(--bs-table-primary-header);
}

.ExpanderPosition{
  position: relative;
  top: -5px;
}

.budgetTableContainer table tr td:first-child::after {
  content: "";
  position: absolute;
  right: -2px;
  top: 0;
  height: 100%;
  width: 2px;
  background: #dee2e6;
  z-index: 1;
}

.budgetTableContainer table tr td:first-child::before {
  content: "";
  position: absolute;
  top: 0;
  left: -1px;
  height: 100%;
  width: 1px;
  background: #dee2e6;
  z-index: 1;
}

.budgetTableContainer .InnerContentTable tr td:first-child::before {
  content: none;
}

.budgetTableContainer .InnerContentTable tr td:first-child::after {
  content: none;
}

.budgetTableContainer table tr td:nth-child(2)::after{
  content: "";
  position: absolute;
  right: -1px;
  top: 0;
  height: 100%;
  width: 1px;
  background: #dee2e6;
  z-index: 1;
}

.budgetTableContainer.Customized table tr td:first-child:not(.InnerContentTable tr td) {
    min-width: 212px !important;
}

.budgetTableContainer.Customized table tr td:nth-child(2) {
    min-width: 212px !important;
}

.budgetTableContainer.Customized table tr td {
    min-width: 125px !important;
}

.cost-table tbody tr:nth-child(4) td:nth-child(2){
  background: var(--bs-even-row-color) !important;
}
.cost-table tbody tr:nth-child(4) td:last-child{
  background: var(--bs-even-row-color) !important;
}

/* ORG chart row data */



.boc-light .boc-search table {
    background-color: #fff;
    color: var(--bs-bodyTxt) !important;
    width: 39%;
    font-family: 'OpenSans-Regular';
    font-size: 14px;
}

.boc-light .boc-search [data-search-item-id]:hover,
.boc-light .boc-search [data-selected=yes] {
    background-color: unset !important;
    color: unset !important;
}

.boc-form-fieldset .row:nth-child(odd) {
    background: var(--bs-odd-row-color);
}

.boc-form-fieldset .row:nth-child(even) {
    background: var(--bs-even-row-color);
}

.boc-form-fieldset .row {

    padding-left: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
}

.boc-edit-form-instruments {

    min-height: unset !important;
}

.boc-dark ::-webkit-scrollbar,
.boc-light ::-webkit-scrollbar {
    width: 8px !important;

}

.boc-light ::-webkit-scrollbar-thumb {
    background: var(--bs-primary) !important;
}

.boc-light ::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary);
}


.AeSOrgChartCommon .boc-search {
    background: white !important;
    top: -19px !important;
    padding-top: 30px;
}

#OrgPositionChart [data-l='0'] rect {
    fill: #FDF0C2;
}

#OrgPositionChart [data-l='1'] rect {
    fill: #CAE3F3;
}

#OrgPositionChart [data-l='2'] rect {
    fill: #E8ECBC;
}

#OrgPositionChart [data-l='3'] rect {
    fill: #F0B46D;
}

#OrgPositionChart [data-l='4'] rect {
    fill: #E2CFC4;
}

#OrgPositionChart [data-l='5'] rect {
    fill: #ECCEFF;
}

#OrgPositionChart [data-l='6'] rect {
    fill: #FBD1AB;
}

#OrgPositionChart [data-l='7'] rect {
    fill: #C5DEDD;
}

#OrgPositionChart [data-l='8'] rect {
    fill: #C1D3FE;
}

#OrgPositionChart [data-l='9'] rect {
    fill: #FFE2E0;
}

/* END */


/* .AeSOrgChartCommon .boc-form-fieldset { */
/* display: flex; */
/* flex-direction: column; */
/* } */

/* #OrgGroupchart line{ */
/* stroke:var(--bs-primary) !important; */
/* } */
/* #OrgGroupchart text { */
/* fill:var(--bs-primary) !Important; */
/* font-size:14px !important; */
/* font-weight:600; */
/* font-family:inherit !important; */
/* } */
/* #OrgGroupchart tspan{ */
/* fill: var(--bs-darkgrey) !important;  */
/* font-weight:500; */

/* } */

/*Common org chart CSS */
.AeSOrgChartCommon .boc-form-fieldset {
    display: unset;
}

.AeSOrgChartCommon rect[rx='50'][ry='50'] {
    rx: 1px;
    ry: 1px;
}

.AeSOrgChartCommon .boc-search {
    background: white !important;
    top: -19px !important;
    padding-top: 30px;
}

.AeSOrgChartCommon hr {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    background: var(--bs-primary) !important;
    visibility: hidden;
}

.AeSOrgChartCommon .boc-edit-form-close {
    z-index: 999 !important;
}

.AeSOrgChartCommon .group {
    cursor: pointer;
}



.AeSOrgChartCommon {
    font-family: 'OpenSans-Regular', Arial !important;
}

.boc-loading-dots {
    display: none !important;
}

.company-policy-grid .mat-expansion-indicator {
    padding-right: 0px;
    height: 24px;
    width: 24px;
    position: relative;
    right: 10px;
    text-align: center;
    margin-right: 0px !important;
    border: 2px solid;
    color: var(--bs-primary);
    border-radius: 50%;
}

.company-policy-grid .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover:not([aria-disabled=true]) {
    background-color: inherit !important;
}

.company-policy-grid .mat-expansion-panel-content {
    font-family: inherit !important;
}

.company-policy-grid mat-expansion-panel-header {
    pointer-events: none;
}

.company-policy-grid .mat-expansion-indicator,
.PolicyCategoryName {
    pointer-events: auto !important;
}

.surveyScoreCard {
    width: 180px;
    height: 96px;
    background: #CAE3F3;
    border-radius: 8px;
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.mat-footer-cell {

    color: var(--bs-bodyTxt) !important;
}

.mat-expansion-panel {
    color: var(--bs-bodyTxt) !important;

}

/* SURVEY CSS */

.SurveyImgGallary {
    padding: 15px;
    background: #FAFAFA;
    height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 15px;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.SurveyImageCloseIcon {
    width: 20px;
    height: 20px;
    border-radius: 50px;
    position: relative;
    top: 12px;
    background-color: #ffffff;
    text-align: center;
    cursor: pointer;
    border: 2px solid #2C6691;
    display: flex;
    justify-content: center;
    padding-top: 2px;
    left: 140px;
}

.SurveyImgGallary img {
    height: 100px;
    width: 150px;
}

.SurveyImageSelected {
    border: 4px solid var(--bs-primary);
}

input:checked {
    border: 4px solid var(--bs-primary);
}

.template-img img {

    border-radius: 4px;
    border: 5px solid var(--bs-topbar-shadow);
}

.CustomFileUpload {
    position: relative;
    top: -8px;
}

.surveystyleSelected {
    padding: 5px !important;

    background: var(--bs-wrapper-card-bg);
}

.TableDisplayGrid th {
    background: var(--bs-odd-row-color);
    padding: 18px 24px;
}

.TableDisplayGrid th:first-child {
    border-top-left-radius: 8px;
}

.TableDisplayGrid th:last-child {
    border-top-right-radius: 8px;
}



.TableDisplayGrid tr td {
    padding: 18px 24px;
}

.TableDisplayGrid tr:nth-child(even) {
    background: var(--bs-odd-row-color);
}

.TableDisplayGrid tr:nth-child(odd) {
    background: var(--bs-even-row-color);
}


/* Default template structure */

.survey-section-name {
    padding: 10px 20px 10px;
    background: var(--bs-odd-row-color);
}

.question-container {
    padding-bottom: 10px;
}

label.img_control img {
    height: 125px;
    border-radius: 8px;
    width: 230px;

}

.draggable-answer {
    padding-top: 10px;
    padding-left: 10px;
    border: 1px solid #ffffff;
    cursor: move;
    /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -webkit-grab;
    /* Chrome 1-21, Safari 4+ */
    cursor: -moz-grab;
    /* Firefox 1.5-26 */
    cursor: grab;
    /* W3C standards syntax, should come least */
}

.draggable-answer:nth-child(odd) {

    background: var(--bs-odd-row-color);
}

.draggable-answer:nth-child(even) {

    background: var(--bs-even-row-color);
}


.PageStyleControls span {
    padding: 8px 5px;
}

.PageStyleControls .active {
    background: var(--bs-low-light-grey);
}


.cursorPointer {
    cursor: pointer;
}
.Filter-list-background ul li.list-group-item{
    border-radius: 4px
}
.Filter-list-background ul li.list-group-item.selectedListItem{
    background: var(--bs-table-primary-header);
}
.Filter-list-background ul li.list-group-item.selectedListItem aeslabel{
    font-weight: 600;
}



ngx-mat-timepicker-standalone {
    background: #ffffff !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
}

ngx-mat-timepicker-content .timepicker .timepicker-header {
    background: var(--bs-primary) !important;
}

ngx-mat-timepicker-content .timepicker .mat-toolbar {
    background: var(--bs-secondary);
}

ngx-mat-timepicker-content .mat-mini-fab.mat-primary {
    background: var(--bs-secondary);
}

ngx-mat-timepicker-face .clock-face {
    background: radial-gradient(var(--bs-table-light-grey), var(--bs-table-light-grey)) !important;
}

.ngx-mat-timepicker-standalone-actions div:first-child {
    border-radius: 54px !important;
    background-color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    margin-right: 10px
}

.ngx-mat-timepicker-standalone-actions div:last-child {
    border-radius: 54px !important;
    background-color: var(--bs-primary) !important;
}



.ngx-mat-timepicker-standalone-actions div:first-child .mat-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-primary) !important;
}

.ngx-mat-timepicker-standalone-actions div:last-child .mat-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-white) !important;
}

/* IOS APPROVAL POPUP */

@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) {
    lib-aesconfirmpopup .mat-dialog-content {
        padding-right: 24px;
    }
}

/* AES STEPPER */

.AeSStepper {
    background: var(--bs-odd-row-color) !important;
    border-top-left-radius: 8px !Important;
    border-top-right-radius: 8px !Important;
}

.AeSStepper .mat-step-header.cdk-keyboard-focused,
.mat-step-header.cdk-program-focused,
.mat-step-header:hover:not([aria-disabled]),
.mat-step-header:hover[aria-disabled=false] {
    background: inherit;
}

.AeSStepper .mat-step-header .mat-step-icon-selected,
.mat-step-header .mat-step-icon-state-done,
.mat-step-header .mat-step-icon-state-edit {
    background-color: #fff;
    color: #580b0b;
    width: 24px;
    height: 24px;
    border: 3px solid var(--bs-secondary);
}

.AeSStepper .mat-step-icon-content span {
    visibility: hidden !important;
}

.AeSStepper .mat-step-header .mat-step-icon:not(.mat-step-icon-selected) {
    width: 10px;
    height: 10px;
    margin-right: 26px;
    position: relative;
    left: 7px;
    background: #B0B0B0;
}

.AeSStepper mat-step-header {
    z-index: 10;
    cursor: pointer;
}

.AeSStepper .mat-stepper-vertical-line::before {
    content: "";
    position: absolute;
    left: -1px;
    bottom: -31px;
    top: -31px;
    border-left-width: 2px;
    border-left-style: solid;
}

.AeSStepper .mat-step-icon-state-edit.mat-step-icon .mat-icon {
    visibility: hidden !important;
}

.AeSStepper .mat-step-icon.mat-step-icon-state-done:not(.mat-step-icon-selected) {
    left: 0;
    width: 24px !important;
    height: 24px !important;
    border: unset !important;
    margin-right: 13px;
    background: var(--bs-secondary);

}

.AeSStepper .mat-step-icon.mat-step-icon-state-done .mat-icon {
    color: #fff !important;
}

.AeSStepper .mat-vertical-content {
    display: none;
}

.AeSStepper .mat-step-text-label {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 18px !important;

}

.AeSStepper .mat-step-text-label {
    color: var(--bs-darkgrey);
}

/* Login page zoom FIX */

@media only screen and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 1.25) and (orientation: landscape),
only screen and (max-width:1366px) and (orientation: landscape) and (min-resolution: 1.25dppx) {
    .languages-menu {
        margin-left: 30px !important;
    }

    .lang-icon {
        position: relative !important;
        left: 50px !important;
    }

    .wrapper {
        position: relative;
        margin-left: 0px !important;
        left: 65px;
        top: 10px;
    }

    .maintenance-msg {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .col.login-bg+.col {
        display: block !important;
    }

    .carousel-inner {
        display: block !important;
    }
}

@media only screen and (min-resolution: 1.50dppx) {
    .languages-menu {
        margin-left: 58px !important;
    }

    .lang-icon {
        position: inherit !important;
        left: inherit !important;
    }
}

.approvalCommentsWidget {
    width: 100%;
    height: auto;
    padding: 24px;
    background: var(--bs-odd-row-color);
    border-radius: 8px;
}


/*Survey CSS */

.SurveyImgGallary {
    padding: 15px;
    background: #FAFAFA;
    height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 15px;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.SurveyImageCloseIcon {
    width: 20px;
    height: 20px;
    border-radius: 50px;
    position: relative;
    top: 12px;
    background-color: #ffffff;
    text-align: center;
    cursor: pointer;
    border: 2px solid #2C6691;
    display: flex;
    justify-content: center;
    padding-top: 2px;
    left: 140px;
}

.SurveyImgGallary img {
    height: 100px;
    width: 150px;
}

.SurveyImageSelected {
    border: 4px solid var(--bs-primary);
}



.template-img img {

    border-radius: 4px;
    border: 5px solid var(--bs-topbar-shadow);
}

.CustomFileUpload {
    position: relative;
    top: -8px;
}

.surveystyleSelected {
    padding: 5px !important;

    background: var(--bs-wrapper-card-bg);
}

.TableDisplayGrid th {
    background: var(--bs-even-row-color);
    padding: 18px 24px;
}

.TableDisplayGrid th:first-child {
    border-top-left-radius: 8px;
}

.TableDisplayGrid th:last-child {
    border-top-right-radius: 8px;
}



.TableDisplayGrid tr td {
    padding: 18px 24px;
}

.TableDisplayGrid tr:nth-child(even) {
    background: var(--bs-odd-row-color);
}

.TableDisplayGrid tr:nth-child(odd) {
    background: var(--bs-even-row-color);
}


/* Default template structure */

.survey-section-name {
    padding: 10px 20px 10px;
    background: var(--bs-odd-row-color);
}

.question-container {
    padding-bottom: 10px;
}



.draggable-answer {
    padding-top: 10px;
    padding-left: 10px;
    border: 1px solid #ffffff;
    cursor: move;
    /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -webkit-grab;
    /* Chrome 1-21, Safari 4+ */
    cursor: -moz-grab;
    /* Firefox 1.5-26 */
    cursor: grab;
    /* W3C standards syntax, should come least */
}

.draggable-answer:nth-child(odd) {

    background: var(--bs-odd-row-color);
}

.draggable-answer:nth-child(even) {

    background: var(--bs-even-row-color);
}


.PageStyleControls span {
    padding: 8px 5px;
}

.PageStyleControls .active {
    background: var(--bs-low-light-grey);
}


.cursorPointer {
    cursor: pointer;
}




ngx-mat-timepicker-standalone {
    background: #ffffff !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
}

ngx-mat-timepicker-content .timepicker .timepicker-header {
    background: var(--bs-primary) !important;
}

ngx-mat-timepicker-content .timepicker .mat-toolbar {
    background: var(--bs-secondary);
}

ngx-mat-timepicker-content .mat-mini-fab.mat-primary {
    background: var(--bs-secondary);
}

ngx-mat-timepicker-face .clock-face {
    background: radial-gradient(var(--bs-table-light-grey), var(--bs-table-light-grey)) !important;
}

.ngx-mat-timepicker-standalone-actions div:first-child {
    border-radius: 54px !important;
    background-color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    margin-right: 10px
}

.ngx-mat-timepicker-standalone-actions div:last-child {
    border-radius: 54px !important;
    background-color: var(--bs-primary) !important;
}



.ngx-mat-timepicker-standalone-actions div:first-child .mat-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-primary) !important;
}

.ngx-mat-timepicker-standalone-actions div:last-child .mat-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-white) !important;
}

.SurveyClosBtn {
    position: absolute;
    right: 0;
    padding-right: 20px;
    top: 10px;
}

.SurveyClosBtn i {
    color: var(--bs-white);
    font-size: 16px;
    cursor: pointer;
}

.onloadPopupScroll {
    display: block;
    height: 100vh;
    overflow: scroll;
}

.SurveySuccessWidget {
    margin: 0 auto;
    align-content: center;
}

.SurveySuccessWidget img {
    max-height: 40px;
}


.surveySuccessImage {
    position: absolute;
    top: 0px;
    padding-top: 24px;
    padding-left: 24px;
    float: left;
}

.SurveyCompletionScore {
    background: #FDFDFD;
    padding: 48px 0px;
    margin: 0px 48px;
    text-align: center;
    position: relative;
    top: 68px;
    border: 1px solid #74748D4D;
    border-radius: 8px;
    border-top: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

app-employee-surveys {
    height: 100vh;
    overflow: auto;
    display: block;
}

.FixedBtnFooter {
    position: absolute;
    bottom: -13px;
    left: 0;
    right: 38px;
    /* color: white; */
}

ngx-extended-pdf-viewer .html .body {
    background: white !important;
}

ngx-extended-pdf-viewer #viewerContainer {

    background: white !important;
}

.declaraiframe {

    height: 100%;
    position: absolute !important;
    margin: auto;
    padding: 0px !important;
    max-width: 1366px !important;

}

.iframe-button {

    position: relative;

    top: 16px;

}

.iframe-full-popup mat-dialog-container,
.iframe-pdf-popup mat-dialog-container {

    max-width: 1280px;

    margin: auto !important;

    right: 0;

    left: 0;

    top: 0;

    bottom: 0;

    position: absolute;

    overflow: hidden;

    max-height: 85vh;

}

.cdk-overlay-pane.iframe-pdf-popup {

    max-width: 67vw;

    width: 88%;

    height: 90%;

    position: static;

    margin-top: 0px;

    margin-left: 0px;

}

.iframe-container iframe {

    right: 0;

    padding-top: 60px;

    position: absolute;

    top: -60px;

    left: 0;

    width: 100%;

    height: 98vh;

    border: none;

    max-width: 1366px;

    margin: auto;

}

.iframe-container-form {

    position: relative !important;

}

.iframe-container-form iframe {

    height: 93vh !important;

}


.iframe-fixed-footer {

    position: fixed;

    left: 0;

    right: 0;

    bottom: 0;

    width: 100%;

    color: white;

    /* text-align: center; */

    padding-bottom: 9px;

    /* padding-top: 10px; */

    display: flex;

    margin: auto;

    max-width: 1366px;

    justify-content: flex-end;

    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

    padding-right: 30px;

}

.iframe-full-popup {

    max-width: 100vw !important;

}


.pdfwrapper {

    height: 80% !important;

    width: 96% !important;

    position: absolute !important;

}
/*Angular 18 additional css */

.pdfwrapper pdf-shy-button svg {
    color: white;
}
 
.pdfwrapper .toolbarLabel {    
    color:white !important;
}
 
.pdfwrapper ngx-extended-pdf-viewer button:focus {  
    border: unset;
}




/* RESPONSIVE ANGULAR MATERIAL TABLE */
@media screen and (max-width: 768px) {

    .pay-table-responsive .mat-mdc-header-row {
        display: none
    }

    .pay-table-responsive .mat-mdc-cell {
        display: block;
        text-align: right;
		padding-right: 20px !important;
        border-bottom: 1px solid #ddd !important;
        height: 50px;
        align-content: center;
    }

    .pay-table-responsive .mat-mdc-cell:before {

        content: attr(data-label);
        float: left;
        font-family: 'OpenSans-SemiBold', Arial !important;
        font-size: 14px !important;

    }

    .pay-table-responsive .mat-mdc-cell:last-child {
        height: 58px;
        border-bottom: 20px solid #ffffff !important;      
    }
	
	
		.pay-table-responsive tbody .mat-mdc-row:nth-child(even) {
   
    border-bottom: 10px solid #fff;
}
	.pay-table-responsive tbody .mat-mdc-row:nth-child(odd) {
   
    border-bottom: 10px solid #fff;
}
		/* angular 12 table control */
	.pay-table-responsive thead{
		display: none;
	}
	.pay-table-responsive .mat-header-row {
        display: none
    }

    .pay-table-responsive .mat-cell {
        display: block;
        text-align: right;
		padding-right: 20px !important;
        border-bottom: 1px solid #ddd !important;
        height: 50px;
        align-content: center;
    }

    .pay-table-responsive .mat-cell:before {

        content: attr(data-label);
        float: left;
        font-family: 'OpenSans-SemiBold', Arial !important;
        font-size: 14px !important;

    }

    .pay-table-responsive .mat-cell:last-child {
        height: 58px;
    }
	.responsive-ctrl-column{
	
		height:90px !important;
	
	}
	
	.pay-table-responsive tbody .mat-row:nth-child(even) {
   
    border-bottom: 10px solid #fff;
}
	.pay-table-responsive tbody .mat-row:nth-child(odd) {
   
    border-bottom: 10px solid #fff;
}

}



/* RESPONSIVE ANGULAR MATERIAL TABLE END */


.ReviewTitleLimit {
    max-width: 165px;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    overflow: hidden;
    position: relative;
    top: 3px;
}
/*license grid css */
.Filter-widget2 .mat-mdc-form-field-subscript-wrapper {
    display: none;
}

/*
.license-grid .ag-icon-tree-closed::before {
    position: relative;
    top: 5px;
}
*/
/*
.license-grid .ag-icon-tree-open::before {
    position: relative;
    top: 5px;
}
*/
.newpms-flag{
	position:relative;
	top:6px;
}
.newpms-flag-red{
	position:relative;
	top:6px;
	color:red;
}
.ExpansionTable1 aesmenu mat-icon{
	position:relative;
	top:5px;
}

.ExpansionTable1 td.mat-column-Action .row .col:last-child{
    padding-left: 0px;
}

.data-widget-withborder {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
}

.data-widget-with-highlight {
    width: 100%;
    background: var(--bs-odd-row-color);
    box-sizing: border-box;
    margin-left: 0px;
    border: 1px solid rgba(116, 116, 141, 0.3);
    border-radius: 4px;
	padding-right: 14px;
    padding-left: 14px;
}
/* aesradiobuttonlist .aesRadioLabel { */
    /* padding-right: 0px !important; */
/* } */

aesradiobuttonlist mat-label.aesRadioLabel:empty{
    display: none;
}

div.col-12.pl-0 aesradiobuttonlist {
    padding-left:15px
}
div.col.pl-0 aesradiobuttonlist {
    padding-left:15px
}
div.col.pl-0.pr-0 aesradiobuttonlist {
    padding-left:15px
}
div.col.pr-0 aesradiobuttonlist {
    padding-left:0px
}

app-malaysia-tax-decleration .content-accordin.content-accordin-nopadding .col.pl-0 aesradiobuttonlist{
    padding-left: 15px;
}

.text-with-hover:hover {
    cursor: pointer !important;
    text-decoration: none !important;
}

table.custom-dynamic-table.dynamic-table3 thead th:last-child {
    min-width: 80px !important;
}
 
table.custom-dynamic-table.dynamic-table3 tr td:last-child {
    min-width: 80px !important;
}
.profile-details .table-striped {
    min-height: 200px;
}
.profile-widget-history {
    background: var(--bs-profile-bg);
    height: 100%;
}
.profile-history-row{
    min-height: 200px;
}
 .level-indication-button-group {
    gap: 8px;
    border-radius: 0px;
}

.level-indication-button-group.mat-button-toggle-group-appearance-standard{
    border: 0px;
    height: 51px;
}

.level-indication-button-group.mat-button-toggle-group-appearance-standard .mat-button-toggle+.mat-button-toggle{
    border: 0px;
}

.level-indication-button-group .mat-button-toggle-appearance-standard .mat-button-toggle-label-content{
    padding: 6px 16px;
}

.level-indication-button-group .mat-button-toggle-button{
    border-radius: 4px;
    height: 34px;
    box-shadow: 1px 2px 5px 0px #E7EEF3;
}

.level-indication-button-group .mat-button-toggle-button .mat-button-toggle-label-content{
    font-family: 'OpenSans-Regular', Arial !important;
    line-height: 20px;
}

.adjusted-clr {
    height: fit-content;
    border-radius: 4px;
}


/*??????????????????????????????????? MATERIAL 18 CSS CODE ONLY ?????????????????????????????? */
/* ANGULAR 18 CSS */

/* .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__leading, .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__notch, .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mdc-notched-outline__trailing */

 /* { */
    /* border-width: 1px !important; */
/* } */


/*For disabled checkbox border */

.mat-mdc-checkbox-disabled .mdc-checkbox__background {
    border-color: #ccc !important;

}
/*For ouliine iunput label alignment */
.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
    --mat-mdc-form-field-label-transform: translateY(calc(calc(4.75px + var(--mat-form-field-container-height) / 2) * -1)) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75))  !important;
    transform: var(--mat-mdc-form-field-label-transform) !important;
}

/*Absense */
.Timesheet-Div .mat-mdc-text-field-wrapper{

   padding:0px;
}
.mat-mdc-notch-piece.mdc-notched-outline__notch:has(.mdc-floating-label mat-label:empty)  {
    display: none;
}

.dynamic-table thead tr th:first-child:has(aescheckbox){
    float: left;
}
 
.dynamic-table thead tr th:first-child aescheckbox .mat-mdc-checkbox .mdc-form-field{
    margin-bottom: 0;
}
 
.Timesheet-Div .mdc-line-ripple{

   display:none;
}

.time-sheet .mat-mdc-text-field-wrapper {
    background-color: white;
    border-radius: 5px;
}
 
.time-sheet .mat-mdc-form-field-subscript-wrapper {
    /* margin-bottom: 0px; */
    display: block;
    margin-bottom: -15px;
}
 
.AeSGridItemHorz3 {
    display: grid;
}
 
.calendar-header .mdc-checkbox {
    height: 16px;
    width: 16px;
    flex: none;
}
 
.calendar-header .mat-mdc-checkbox .mdc-form-field {
   margin-bottom: 0px;
}
 
.calendar-header .mdc-label{
    font-weight: normal;
    font-family: 'OpenSans-Regular';
    color: var(--bs-primary);
}



/*Calendar dropdown control */

aesdropdownlist.team-calendar-dropdown .mat-mdc-form-field-subscript-wrapper,
aesdropdownlist.team-calendar-dropdown .mdc-line-ripple{
    display: none;
}
aesdropdownlist.team-calendar-dropdown .mat-mdc-form-field-infix{
    padding: 0px;
    min-height: unset;
}
aesdropdownlist.team-calendar-dropdown .mat-mdc-select-min-line{
    font-family: 'Montserrat-Bold', Arial !important;
    font-weight: 700;
}
 
aesdropdownlist.team-calendar-dropdown .mat-mdc-select-arrow-wrapper{
    width: 24px;
}
 
aesdropdownlist.team-calendar-dropdown .mat-mdc-select-value{
    width:fit-content;
}
 
aesdropdownlist.team-calendar-dropdown .mat-mdc-select-arrow{
    all: unset;
}
 
aesdropdownlist.team-calendar-dropdown .mat-form-field-appearance-fill .mat-mdc-select-arrow-wrapper{
    transform: unset;
}
 
aesdropdownlist.team-calendar-dropdown .mat-mdc-select-arrow svg{
    position: unset;
    transform: unset;
}
 
aesdropdownlist.team-calendar-dropdown .mat-mdc-text-field-wrapper{
    height: fit-content !important;
}

/*end */

.left-accordin .mat-mdc-list-base .mat-mdc-list-item, .mat-mdc-list-base .mat-mdc-list-option {
    display: block;
    height: 80px !important;
    border-bottom: 1px solid #74748D4D;
    background: var(--bs-odd-row-color);
    align-content:center;
}
/* Tool tip */
.mat-mdc-tooltip-surface{
    color: var(--bs-white);
    background: var(--bs-light-primary);
    font-size: 12px;
    font-family: inherit;
}

.cdk-overlay-pane.mat-mdc-dialog-panel.float-right{
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

input[type="time"] {
    border: none;
    outline: none;
    padding-left: 10px;
}

.mat-mdc-tab-body-content {
    overflow: hidden !important;
}

.mat-mdc-row {
    color: inherit !important;
    font-family: inherit !important;
}

.mat-mdc-paginator-page-size-label {
    margin: 0 4px;
    min-width: 100px !important;
    white-space: nowrap !important;
}
.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label {
    top: 26px !important;
    font-family: inherit !important;
    font-size: inherit !important;
   
}
.mdc-text-field--outlined .mdc-floating-label {
    font-family: inherit !important;
    font-size: inherit !important;
    top: 28px !important;
    
}


.mat-mdc-paginator,
.mat-mdc-paginator-page-size .mat-mdc-select-trigger {
    color: #0000008a !important;
}

.mat-mdc-paginator-page-size-select {
    margin: 6px 4px 0 4px !important;
    min-width: 66px !important;
}

.mat-mdc-paginator-page-size .mdc-notched-outline {
    height: 80% !important;
    outline: none !important;
    border: none !important;
}

.mat-pseudo-checkbox.mat-mdc-option-pseudo-checkbox.mat-pseudo-checkbox-checked {
    background-color: transparent !important;
}

.mat-pseudo-checkbox-minimal.mat-pseudo-checkbox-checked::after {
    color: var(--bs-primary) !important;
}

.mat-mdc-select-panel .mat-mdc-option {
    height: unset;
    line-height: 1.3 !important;
    padding-top: 8px;
    padding-bottom: 8px;
    color: inherit !important;
    font-size: inherit !important;
    white-space: normal;
}

.mdc-list-item__primary-text {
    color: inherit !important;
}

.mat-mdc-form-field {
    font-family: 'OpenSans-Regular' !important;
    font-size: inherit !important;
}


.chat-controls .mat-mdc-form-field-wrapper {
    position: relative;
    top: -7px;
    height: 30px;
    border: 1px solid #efefef;
    border-radius: 5px;
}

.chat-controls .mat-mdc-form-field-infix {
    padding: 0px;
    position: relative;
    left: 5px;

}

.chat-controls .mat-mdc-select {
    position: relative;
    top: -3px;
}

.chat-controls .mat-mdc-select-arrow {
position: relative;
    left: 5px;
    top: 10px;
}

.chat-controls .mat-mdc-form-field-subscript-wrapper{
	display: none;
}

.chat-controls .mdc-line-ripple::before{
	border-bottom-width: 0px;
}

.chat-controls .mat-mdc-form-field-focus-overlay{
	background-color: inherit;
}

.chat .chat-message .box .mat-mdc-form-field-subscript-wrapper{
	display: none;
}
.chat .chat-message .box .mdc-text-field--no-label .mat-mdc-form-field-infix{
	padding-top: 5px;
}
.chat .chat-message .box .mdc-line-ripple::before{
	border-bottom-width: 0px;
}
.NewInputChat input {
    max-width: 245px;
}

.dynamic-table4 .mat-form-field-wrapper {
    background: #fff !important;
    padding-bottom: 0px !important;
    margin-right: 10px !important;
}

.dynamic-table4 th {
    min-width: 100px;
}

.dynamic-table4 td {

    min-width: 100px;
}

/* AlertWatoaster mat css end */


/* MAT TAB */

.mdc-tab__ripple {
    display: none;
}

.mat-mdc-tab-nav-bar,
.mat-mdc-tab-header {
    border-bottom: 3px solid var(--bs-secondary) !important;
}

.mat-mdc-tab {
    letter-spacing: unset !important;
}

.mat-mdc-tab-ripple {

    border-top-left-radius: 4px;
}

.mdc-tab .mat-ripple.mat-mdc-tab-ripple:before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    border-bottom: none !important;
    border-radius: 0.4em 0.4em 0 0 !;
    -webkit-transform: skewX(40deg) !important;
    transform: skewX(40deg) !important;
    transform-origin: bottom left;
    background: var(--bs-even-row-color);
    border-top-right-radius: 7px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom: 0px !important;
}

.mdc-tab--active .mat-ripple.mat-mdc-tab-ripple:before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    border-bottom: none !important;
    border-radius: 0.4em 0.4em 0 0 !;
    -webkit-transform: skewX(40deg) !important;
    transform: skewX(40deg) !important;
    transform-origin: bottom left;
    background: var(--bs-secondary);
    border-top-right-radius: 7px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom: 0px !important;
}

.mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs>.mat-mdc-tab-header .mat-mdc-tab {
    flex-grow: 0 !important;
}


.mat-mdc-tab.mdc-tab {
    height: 40px !important;
    border-top-left-radius: 5px;
    background: transparent;
    color: var(--bs-bodyTxt) !important;
    opacity: 6.6 !important;
    z-index: 9999;
    position: relative !important;
    min-width: 248px !important;
    width: auto !important;
}

.mdc-tab__text-label {
    z-index: 10 !important;
    font-family: 'OpenSans-Regular';
    font-size: 16px;
    padding-right: 20px;
}

.mat-mdc-tab.mdc-tab--active .mdc-tab__text-label {
    font-weight: 700;
    color: white !important;
}


.mat-mdc-tab-labels {
    display: flex;
    flex: 1 0 auto;

}

.mat-mdc-tab-group {
    margin-top: 24px;
}

.mat-mdc-tab-body-content {
    height: 100%;
    overflow: auto;
    padding-top: 16px !important;
    padding-left: 0px !important;
}

.mdc-tab-indicator {
    display: none !important;
}

.mdc-tab-indicator .mdc-tab-indicator__content {
    transition: none !important;
}

.mat-mdc-tab .mdc-tab__text-label {
    color: var(--bs-bodyTxt) !important;
    transition: none !important;
}

/* line tab css */

.line-tab .mat-mdc-tab-nav-bar,
.line-tab .mat-mdc-tab-header {
    border-bottom: 4px solid var(--bs-even-row-color) !important;
}


.line-tab .mdc-tab .mat-ripple.mat-mdc-tab-ripple:before {
    font-weight: 700 !important;
    background: inherit;
}

.line-tab .mdc-tab-indicator--active {
    border-bottom: 4px solid var(--bs-primary) !important;
}

.line-tab .mat-mdc-tab.mdc-tab--active .mdc-tab__text-label {
    color: var(--bs-primary) !important;
}

.line-tab .mat-mdc-tab .mdc-tab__text-label {
    color: var(--bs-primary) !important;
}



.line-tab .mat-tab-label-content {
    color: var(--bs-primary) !important;
    font-family: 'OpenSans-Regular' !important;
    font-size: 16px !important;
}

.line-tab .mat-tab-label-active {
    font-weight: 700 !important;
}

.line-tab .mat-tab-label-content {
    color: var(--bs-primary) !important;
    font-family: 'OpenSans-Regular' !important;
    font-size: 16px !important;
}


.line-tab .mat-mdc-tab.mdc-tab--active .tab-badge {
    display: block;
    height: 24px;
    width: 24px;
    background: var(--bs-secondary);
    border-radius: 50%;
    border: 1px solid var(--bs-secondary);
    font-size: 10px;
    color: var(--bs-primary);
    margin-left: 8px;
    color: var(--bs-white);
    display: flex;
    justify-content: center;
    align-items: center;
}

.line-tab .mdc-tab__text-label .tab-badge {
    display: block;
    height: 24px;
    width: 24px;
    background: var(--bs-white);
    border-radius: 50%;
    border: 1px solid var(--bs-primary);
    font-size: 10px;
    color: var(--bs-primary);
    margin-left: 8px;
    color: var(--bs-primary);
    display: flex;
    justify-content: center;
    align-items: center;
}

.mdc-tab__text-label .tab-badge {
    display: block;
    height: 24px;
    width: 24px;
    background: var(--bs-white);
    border-radius: 50%;
    border: 1px solid var(--bs-primary);
    font-size: 10px;
    color: var(--bs-primary);
    margin-left: 8px;
    color: var(--bs-primary);
    display: flex;
    justify-content: center;
    align-items: center;
}


/* MAT TAB END **********************************************************************/

/* MAT INPUT FIELDS */

.mdc-notched-outline--notched .mdc-notched-outline__notch{
    padding-right: 0px;
}

.mat-mdc-form-field {
    width: 100% !important;
}

.mat-mdc-form-field-infix {
    width: auto !important;
}

.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mat-mdc-notch-piece {
    border-color: #74748D4D;
}
[textmode="Multiline"] .mat-mdc-text-field-wrapper {
    height: auto !important;
}

.mat-mdc-text-field-wrapper {
    height: 51px !important;
}

.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label {
    top: 28px;
}

.mdc-text-field--outlined .mdc-floating-label {
    font-family: inherit !important;
    font-size: inherit !important;
}

.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input {
    color: var(--mdc-outlined-text-field-input-text-color, var(--mat-app-on-surface));
    caret-color: var(--bs-primary) !important;
    font-size: 14px !important;
}


.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused) .mdc-floating-label {
    letter-spacing: 0.25px !important;
}

.mat-mdc-form-field-label {
    position: absolute;
    left: 0;
    font-size: 14px !important;
    font-family: 'OpenSans-Regular', Arial !important;
}

input.mat-mdc-input-element {

    font-size: 16px !important;
}

aesonbehalfof input.mat-mdc-input-element {

    font-size: inherit !important;
}


.mat-mdc-form-field-appearance-outline .mat-mdc-form-field-outline-thick {
    color: var(--bs-primary) !important;
}


.panelOnbehalfOf .mat-mdc-dialog-container {
    height: 106vh;
    overflow: hidden;
}


.mat-mdc-dialog-container {
    display: block;
    padding: 24px;
    border-radius: 4px;
    box-sizing: border-box;
    overflow: auto;
    outline: 0;
    width: 100%;
    height: 100%;
    min-height: inherit;
    max-height: inherit;
}

.mat-mdc-dialog-container {
    color: var(--bs-bodyTxt) !important;
}

.mat-mdc-dialog-container {

    border-radius: 8px !important;
    /* min-height: 352px !important; */
}

.mat-mdc-dialog-surface {
    box-shadow: none !important;
}

.mat-mdc-dialog-container {
    background: #fff;
}

.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label {

    color: #74748D !important;

}

.mdc-text-field--outlined:not(.mdc-text-field-disabled).mdc-text-field--focused .mdc-floating-label {

    color: #74748D;


}

.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,
.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,
.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing {
    border-color: var(--bs-primary);
}

.mat-mdc-form-field-appearance-outline .mat-mdc-form-field-outline {
    color: #0000001f !important;
}

.mat-mdc-tab {
    cursor: pointer;
}

.mat-mdc-form-field-appearance-outline:not(.mat-mdc-form-field-disabled) .mat-mdc-form-field-flex:hover .mat-mdc-form-field-outline {
    opacity: 0;
    transition: opacity 600ms cubic-bezier(0.25, 0.8, 0.25, 1);
}

.mdc-text-field--focused .mat-mdc-notch-piece {
    border-width: 1px !important
}

.mdc-text-field--focused:hover .mat-mdc-notch-piece {
    border-color: var(--bs-primary);
}

.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch {
    border-left: 0px solid rgba(0, 0, 0, 0) !important;
}

.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mat-mdc-notch-piece{
	border-color: var(--bs-primary);
}

/* MAT INPUT END */

/* MAT RADIO */

.mat-mdc-list-option .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle,
.mat-mdc-list-option .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__inner-circle {
    border-color: var(--bs-primary) !important;
}

.mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled])~.mdc-radio__background .mdc-radio__outer-circle{
	border-color: var(--bs-primary) !important;
}

.mdc-checkbox__ripple {
    display: none;
}

.mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element,
.mat-mdc-radio-button.mat-mdc-radio-checked .mdc-radio__background::before {
    background-color: inherit !important;
}

.mat-mdc-radio-button .mdc-radio__background::before {
    background-color: inherit !important;
}

.mat-mdc-radio-button .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle,
.mat-mdc-radio-button .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__inner-circle {
    border-color: var(--bs-primary) !important;
}

.mat-mdc-radio-button .mdc-form-field .mdc-label {
    padding-right: 20px !important;
	color: var(--bs-bodyTxt);
}

.mat-mdc-radio-button {
    font-family: inherit !important;
}

.horizontal-radio .aesRadioLabel {
    padding-right: 0px !important;
}

.mat-mdc-radio-button .mdc-radio {
    padding: 0px 10px 10px 0px !important;
}

.mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled])~.mdc-radio__background .mdc-radio__outer-circle {
    border-color: #0000008a;
}

.aesRadioLabel {
    font-weight: 600;
    padding-right: 10px;
    position: relative;
    top: -2px;
}
/* text control */

html{
	--mdc-outlined-text-field-outline-color: #74748D4D;
	--mdc-outlined-text-field-hover-outline-color: var(--bs-primary);
	--mdc-outlined-text-field-focus-outline-color: var(--bs-primary);
	--mdc-outlined-text-field-focus-label-text-color: #74748D;
	--mat-option-label-text-font: 'OpenSans-Regular', Arial;
	--mdc-radio-disabled-selected-icon-color: #74748D4D;
    --mdc-radio-disabled-unselected-icon-color: #74748D4D;
    --mdc-radio-unselected-hover-icon-color: #74748D4D;
	--mat-table-header-headline-color: #38385C;
	--mdc-radio-unselected-hover-icon-color: #2C6691;
	--mdc-radio-unselected-icon-color: #2C6691;
	--mat-select-enabled-trigger-text-color:var(--bs-bodyTxt);
      -mat-select-trigger-text-font:'OpenSans-Regular', Arial !important;	
--mdc-list-list-item-label-text-font: 'OpenSans-Regular', Arial !important;;
   --mat-select-trigger-text-size:14px !important;
   --mat-stepper-header-hover-state-layer-color: inherit;
   --mat-radio-label-text-color: inherit;

}


/* AES TOASTER */
.AeSToasterValidation .tittle mat-icon {
    padding-right: 325px;
    margin-top: -10px;
    position: relative;
    font-size: 28px;
}

.AeSToasterSuccess .tittle span {
    padding-left: 10px !important;
}

.AeSToasterWarning mat-mdc-dialog-container {
    z-index: 999;
    background: #EAA9A9 !important;
    background: #EAA9A9 !important;
    border: 1px solid #F5753E;
    border-radius: 15px;
    overflow: hidden;
}

.AeSToasterWarning .mat-mdc-dialog-surface {
    display: flex !important;
    justify-content: space-between;
    background: unset !important;
    overflow: unset;
    color: white !important;
}

.AeSToasterValidation .mat-mdc-dialog-surface {
    display: flex !important;
    justify-content: space-between;
    background: unset !important;
    overflow: unset;
    color: white !important;
}

.AeSToasterSuccess .mat-mdc-dialog-surface {
    display: flex !important;
    justify-content: space-between;
    background: unset !important;
    overflow: unset;
    color: white !important;
}

.AeSToasterWarning .mat-mdc-dialog-surface .mat-icon {
    height: inherit !important;
    /* width: inherit !important; */
}

.AeSToasterSuccess .mat-mdc-dialog-surface .mat-icon {
    height: inherit !important;
    width: inherit !important;
}

.AeSToasterValidation .mat-mdc-dialog-surface .mat-icon {
    height: inherit !important;
    /* width: inherit !important; */
}


/* MAT DIALOG */


.mat-mdc-dialog-title::before {
    all: unset !important;
}

.mat-mdc-dialog-container {
    color: var(--bs-bodyTxt) !important;
    box-shadow: var(--bs-wrapper-card-shadow) !important;
    border-radius: 8px !important;
}

.mat-mdc-dialog-content {
    max-height: unset !important;
    padding: 0px 24px;
    overflow: unset !important;
}

.mat-mdc-dialog-container-with-actions .mat-mdc-dialog-content {
    padding: 0px 0px !important;
}

.cdk-global-overlay-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

.mat-mdc-dialog-surface {
    background: unset !important;
    border-radius: unset !important;
    overflow: unset !important;
}



/* MAT Buttons */
.mat-mdc-button {
    letter-spacing: unset !important;
}

.BtnSave .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    max-width: 100%;
    border-radius: 54px !important;
    margin: auto !important;
    margin-left: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    margin-bottom: 30px !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnNext-forgetpwd .mat-mdc-button {
    max-width: 224px !important;
}

.BtnLogin .mat-mdc-button {
    min-width: 244px !important;
}

.BtnLogin .mat-mdc-button {
    min-width: 100% !important;
}

.BtnLogin .mat-mdc-button {
    min-width: 100% !important;
}

.BtnSubmit .mat-mdc-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    border-radius: 54px !important;
    margin: auto !important;
	min-width: 160px !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
}

.BtnSubmitL .mat-mdc-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
}

.BtnSecond .mat-mdc-button {
    min-width: 160px;
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
}

.BtnSecond .mat-mdc-button:hover {
    opacity: 0.8;
}


.BtnSubmit .mat-mdc-button:hover {
    opacity: 0.8;
}

.BtnSubmit .mat-mdc-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}


.BtnSave .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    max-width: 100%;

    border-radius: 54px !important;
    margin: auto !important;
    margin-left: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    margin-bottom: 30px !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilter .mat-mdc-button {
    border-radius: 100px;
    padding: 13px 32px;
    display: inline-flex;
    height: 40px;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilterTrans .mat-mdc-button {
    border-radius: 100px;
    padding: 13px 32px;
    display: inline-flex;
    height: 40px;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnDisable .mat-mdc-button {
    min-width: 160px;
    height: 40px !important;
    border-radius: 54px !important;
    cursor: none;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-disable-stat) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnSave .mat-mdc-button:hover {
    opacity: 0.8;
}

.BtnSave .mat-mdc-button:disabled {
    background-color: var(--bs-disable-stat) !important;
    padding-left: 32px;
    padding-right: 32px;
}

.BtnLogin .mat-mdc-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    min-width: 353px !important;
    max-width: 100%;

    border-radius: 54px !important;
    margin: 0 auto !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
    font-weight: 700;
}

.BtnLogin .mat-mdc-button:hover {

    opacity: 0.8;
}

.BtnLogin {
    margin-top: 60px;
}

.BtnDelete .mat-mdc-button {
    min-width: 160px !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnDelete .mat-mdc-button:hover {
    opacity: 0.8;
}

.BtnDelete .mat-mdc-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}

.BtnNext .mat-mdc-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}


.BtnNext .mat-mdc-button:hover {
    opacity: 0.5;
}

.BtnNext .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnBack .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;

    min-width: 160px;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;


}

.BtnBack .mat-mdc-button:hover {
    opacity: 0.5;
}

.BtnBack .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

/* Transparent button */
.BtnTrans .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px;
    max-width: 100%;

    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnTrans .mat-mdc-button.mat-mdc-button-disabled .mdc-button__label{
	color: #B0B0B0 !important;
}


.BtnTrans .mat-mdc-button:hover {
    opacity: 0.5;
}

.BtnTrans .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

/* BAckground filled Button */

.BtnFilled .mat-mdc-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnFilled .mat-mdc-button:hover {
    opacity: 0.8;
}

.BtnFilled .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnCancel .mat-mdc-button {

    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    min-width: 160px !important;

    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    margin-left: 20px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    border: 1px solid !important;
    font-family: 'OpenSans-Bold' !important;
}

.BtnCancel .mat-mdc-button:hover {
    opacity: 0.5;
}

.BtnCancel .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnLoginCancel .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    border: 1px solid var(--bs-primary) !important;
    color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold', Arial !important;
}

.BtnLoginCancel .mat-mdc-button:hover {
    opacity: 0.5;
}

.BtnLoginCancel .mat-mdc-button:disabled {
    border-color: var(--bs-disable-stat) !important;
    color: var(--bs-disable-stat);
}

.BtnNext-forgetpwd .mat-mdc-button {
    width: 100% !important;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 0px !important;
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
}

.profile-menu-btn .mat-mdc-button {
    height: 40px !important;
}

#cal .mat-mdc-button-wrapper {

    font-size: inherit !important;
    border: none !important;
}

.BtnSave.MisBtn .mat-mdc-button {
    margin-left: 0 !important;
}

.BtnPopupSubmit2 .mat-mdc-button {
    width: 100%;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 20px !important;
    /* margin-left: 20px!important; */
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    font-family: 'OpenSans-Regular', Arial;
}

.BtnPopupSubmit2 .mat-mdc-button:disabled {
    background-color: var(--bs-disable-stat) !important;
}


.Btnsmall-Trans .mat-mdc-button {
    min-width: 92px;
    height: 40px !important;
    border-radius: 54px !important;
    margin: auto !important;
    margin-bottom: 0px !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    padding: 0px;
}

.mat-mdc-button:hover {
    background-color: none !important;
}

.mat-mdc-button-focus-overlay {
    background: none;
}

.chip-button .mat-mdc-button {

    display: inline-flex;
    padding: 13px 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: var(--bs-primary);
}

.invToggle .mat-mdc-button-toggle-label-content {
    line-height: 36px !important;
}

.invToggle.mat-mdc-button-toggle-group-appearance-standard {
    border-radius: 15px !important;
    border: none !important;
}

.invToggle .mat-mdc-button-toggle-checked {
    background: var(--bs-primary) !important;
    color: rgb(255, 255, 255);
}

.invToggle mat-mdc-button-toggle-group {
    display: block;
}

.invToggle .mat-mdc-button-toggle-appearance-standard {
    background: var(--bs-wrapper-card-bg);
}

.invToggle [type=button].mat-mdc-button-toggle-button {
    cursor: default !important;
    pointer-events: none !important;
}

.invToggle.mat-mdc-button-toggle-button:hover {
    background: none !important;
}

/* .invToggle .mat-mdc-button-toggle-label-content {
    line-height: 36px !important;
}

.invToggle.mat-mdc-button-toggle-group-appearance-standard {
    border-radius: 15px !important;
    border: none !important;
}

.invToggle .mat-mdc-button-toggle-checked {
    background: var(--bs-primary) !important;
    color: rgb(255, 255, 255);
} */

/* .invToggle mat-mdc-button-toggle-group {
    display: block;
}

.invToggle .mat-mdc-button-toggle-appearance-standard {
    background: var(--bs-wrapper-card-bg);
}

.invToggle [type=button].mat-mdc-button-toggle-button {
    cursor: default !important;
    pointer-events: none !important;
}

.invToggle.mat-mdc-button-toggle-button:hover {
    background: none !important;
} */

.BtnTransL .mat-mdc-button {
    height: 40px !important;
    line-height: 0px !important;
    padding: 13px 32px 13px 32px !important;
    font-size: 14px !important;
    width: 100%;
    border-radius: 54px !important;
    margin: auto !important;
    background-color: var(--bs-white) !important;
    color: var(--bs-primary) !important;
    border: 2px solid;
    border-color: var(--bs-primary) !important;
    font-family: 'OpenSans-Bold' !important;
}

.AddMinusButton .mat-mdc-button-toggle-appearance-standard .mat-mdc-button-toggle-label-content {
    padding: unset !important;
}

.AddMinusButton .mat-mdc-button-toggle-appearance-standard .mat-mdc-button-toggle-label-content {
    line-height: unset !important;
}

.AddMinusButton .mat-mdc-button-toggle:hover {
    background: none !important;
}

.AddMinusButton .mat-mdc-button-toggle-checked {
    background: none !important;
}

.AddMinusButton .mat-mdc-button-toggle-focus-overlay {
    background: none !important;
}

.ngx-mat-timepicker-standalone-actions div:first-child .mat-mdc-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-primary) !important;
}

.ngx-mat-timepicker-standalone-actions div:last-child .mat-mdc-button-wrapper {
    font-family: 'OpenSans-Bold' !important;
    font-size: 14px !important;
    color: var(--bs-white) !important;
}

@media (max-width:768px) {

    .BtnLogin .mat-mdc-button {
        width: 350px;
        max-width: 100%;
    }

    .aes-popup .BtnSubmit .mat-mdc-button {
        margin-left: unset !important;
        /* min-width:unset !important; */
        width: 100% !important;
    }

    .aes-popup .BtnSave .mat-mdc-button {
        margin-left: unset !important;
        /* min-width:unset !important; */
        width: 100% !important;
    }
}


/* calendar control */

.calendar-control .mat-mdc-text-field-wrapper {
    height: unset !important;
}

.calendar-control .mat-mdc-select-arrow {
    left: 0px;
    margin-left: 4px;
    position: relative;
    color: var(--bs-primary) !important;
    position: relative;

}

.calendar-control .mat-select-min-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 347px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.calendar-control i {
    float: left;
    position: absolute;
    padding-left: 10px;
}


.calendar-control-2 .mat-mdc-text-field-wrapper {
    height: unset !important;
    margin-top: 20px;
}

.calendar-control-2 .mat-mdc-form-field-subscript-wrapper {
    display: none;
}

.calendar-control-2 .mat-mdc-select-arrow {
    top: 6px;
    left: 0px;
    margin-left: 4px;
    position: relative;
    color: var(--bs-primary) !important;
    position: relative;

}

.calendar-control-2 .mat-mdc-text-field-wrapper {
    padding-bottom: 0px !important;
    position: relative !important;
    top: 20px !important;
}

.calendar-control-2 .mat-select-min-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 347px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.calendar-control-2 i {
    float: left;
    position: absolute;
    padding-left: 10px;
}

.calendar-control-date {
    color: var(--bs-bodyTxt);
    padding: 0px;
    margin-top: -4px;
    margin-left: -212px;
    font-size: 20px;
    font-family: 'Montserrat-Bold', Arial;

}

.calendar-dropdown {
    font-family: 'OpenSans-Regular';
    margin-top: -8px;
    width: 100%;
    height: 24px;
}

.calendar-dropdown {
    margin-left: -50px;
    padding-right: 23px;
    float: left;
    margin-top: -25px;
}

.calendar-dropdown .mat-mdc-select-arrow {
    margin-top: 20px;
    margin-right: 10px;
}

.calendar-dropdown .mat-mdc-form-field-infix {
    width: 130px;
}

.mat-mdc-form-field-infix {
    width: auto !important;
}

.Aesmenu .mat-mdc-select-value {
    display: contents !important;
    max-width: 0;
    width: 100%;
    overflow: visible !important;
    text-overflow: none !important;
    white-space: nowrap;
}

.calendar-control .noborderFormfield .mat-mdc-select-min-line {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px;
    font-weight: 700;
}

.calendar-control .mat-mdc-form-field-focus-overlay {
    background: unset !important;
}

.calendar-control .mdc-text-field--filled:not(.mdc-text-field--disabled) {
    background: unset !important;
}

.calendar-control .mat-mdc-form-field-infix {
    min-height: unset !important;
}

.calendar-control .mdc-text-field {
    padding: unset !important;
}

.calendar-control .mdc-line-ripple::before,
.mdc-line-ripple::after {
    border-bottom: 0px !important;
}

.calendar-control-2 .noborderFormfield .mat-mdc-select-min-line {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px;
    font-weight: 700;
}

.calendar-control-2 .mat-mdc-form-field-focus-overlay {
    background: unset !important;
}

.calendar-control-2 .mdc-text-field--filled:not(.mdc-text-field--disabled) {
    background: unset !important;
}

.calendar-control-2 .mat-mdc-form-field-infix {
    min-height: unset !important;
    padding: .5em 0 !important;
}

.calendar-control-2 .mdc-text-field {
    padding: unset !important;
}

.calendar-control-2 .mdc-line-ripple::before,
.mdc-line-ripple::after {
    border-bottom: 0px !important;
}

/* calender-control css end */

/* spinner control */

.mat-mdc-progress-spinner .mdc-circular-progress__determinate-circle,
.mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic {
    stroke: var(--bs-secondary) !important;
}

/* MAT TABLE */
tr.mat-mdc-header-row {
    height: 56px;
}

td.mat-mdc-cell {
    border-bottom-style: none !important;
    letter-spacing: unset !important;
}


.mat-mdc-row,
.mat-mdc-header-row,
.mat-mdc-footer-row {
    border-bottom-width: 0px;
    font-family: var(--bs-font);
}

.mat-mdc-row {
    font-family: var(--bs-font) !important;
}

.mat-mdc-header-row,
.mat-mdc-table-sticky {
    background: var(--bs-odd-row-color) !important;
    border-radius: 8px 8px 0px 0px !important;
}

.mat-mdc-table .mat-mdc-row:last-child {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

tbody .mat-mdc-row:nth-child(odd) {
    background-color: var(--bs-even-row-color);
}

tbody .mat-mdc-row:nth-child(even) {
    background-color: var(--bs-odd-row-color) !important;
}

.mat-mdc-header-cell {
    border-bottom: unset !important;
}

/* Mat Radio */
.mat-mdc-radio-button {
    font-family: inherit !important;
}

.mat-mdc-radio-button.mat-mdc-accent.mat-mdc-radio-checked .mat-mdc-radio-outer-circle {
    border-color: var(--bs-primary) !important;
}

.mat-radio-mdc-button.mat-mdc-accent .mat-mdc-radio-inner-circle {
    background: var(--bs-primary) !important;
}

.comment-box .mat-mdc-radio-label {
    padding-right: 50px !important;
}

.mat-mdc-radio-persistent-ripple {
    background-color: var(--bs-primary) !important
}

.mat-mdc-radio-label-content {

    padding-right: 20px !important;
}

.mat-mdc-radio-outer-circle {
    height: 16.67px !important;
    width: 16.67px !important;
}

.mat-mdc-radio-inner-circle {
    height: 16.67px !important;
    width: 16.67px !important;
}

/* mat radio css end */

/* checkbox css  */


.mat-mdc-checkbox-touch-target {
    height: unset !important;
    width: unset !important;
}


.mdc-checkbox {
    font-family: 'OpenSans-Regular' !important;
    margin: auto !important;
    margin-right: 8px !important;
    padding: 0px !important;
}

.mat-mdc-checkbox .mdc-form-field {
    margin-bottom: .5rem;
}


.mdc-checkbox__background {
    border-color: var(--bs-primary) !important;
    position: unset !important;
}

.mdc-checkbox__checkmark {
    color: var(--bs-white) !important;
    height: 14px;
    width: 14px !important;
    margin: 0 auto;
    top: 2px !important;
}

.mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background {
    background-color: var(--bs-primary) !important;

}

.mat-ripple.mat-mdc-checkbox-ripple.mat-mdc-focus-indicator {
    display: none;
}


.mdc-checkbox .mdc-checkbox__native-control {
    height: 18px !important;
    width: 18px !important;
}

.mdc-checkbox .mdc-checkbox__native-control:focus~.mdc-checkbox__ripple {
    background: var(--bs-primary) !important;
}

.mat-mdc-checkbox .mat-internal-form-field {
    font-family: inherit !important;
}

.mat-mdc-checkbox .mdc-label {
    margin-bottom: 0px !important;
    padding-right: 10px;
}

/* checkbox css end */

/* dropdown and multiselect dropdown css  */


.mat-mdc-option-multiple .mat-pseudo-checkbox.mat-mdc-option-pseudo-checkbox.mat-pseudo-checkbox-checked {
    background-color: var(--bs-primary) !important;
}

/* dropdown css end */

.mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-focus-overlay {
    background: inherit !important;
}

.mdc-text-field--filled:not(.mdc-text-field--disabled) {
    background: inherit !important;
}

.mdc-text-field--filled:not(.mdc-text-field--disabled):hover {
    background: inherit !important;

}

.mdc-text-field--filled {
    background: none !important;
}

.mat-mdc-form-field .mat-mdc-select-arrow {
    color: var(--bs-primary);
}

/* calendar icon ripple */
.mat-mdc-icon-button .mat-mdc-button-persistent-ripple::before {
    background: transparent !important;
}

/* Aes mneu */

.mat-mdc-menu-panel {
    max-width: unset !important;
}

button {
    outline: none !important;
    border: none;
    background: none;
}

.mat-mdc-menu-item {
    color: var(--bs-bodyTxt-light) !important;

}

.mat-mdc-menu-item-text {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 14px !important;
}

.mat-mdc-menu-item {
    line-height: 25px !important;
    min-height: unset !important;
    height: 30px !important;
}


/* File upload */

aesfileupload .pt-4 {
    padding-top: 0px !important;
}

/* aesfileupload .mat-icon { */
    /* display: contents !important; */

/* } */

body .material-icons {
    font-family: 'Material Icons';
}

span.clk-delete .material-icons {
    font-size: 16px !important;
}

.onbehalfRadioList .mdc-label {
    font-family: 'OpenSans-Bold', Arial !important;
    font-size: 14px !important;
    line-height: 20px;

}

/*  MDC toggle switch component */

.mdc-switch {
    margin-right: 8px !important;
}

.mat-mdc-slide-toggle .mdc-switch:enabled+.mdc-label {
    cursor: pointer;
    padding-left: 0px;
    margin-bottom: 0px;
    font-family: 'OpenSans', Arial !important;
    font-size: 14px !important;

}

.mat-mdc-dialog-container .mat-mdc-dialog-content {
    color: var(--bs-bodyTxt) !important;
    letter-spacing: unset !important;
    font-size: 14px !important;
    font-family: 'OpenSans-Regular' !important;
}

.mdc-switch__track::after {
    background: var(--bs-light-secondary) !important;
}

.mdc-switch--selected:enabled .mdc-switch__handle::after {
    background: var(--bs-secondary) !important;
}

.mdc-switch--unselected:enabled .mdc-switch__handle::after {
    background: #fafafa !important;
}

.mdc-switch--unselected .mdc-switch__icon {
    fill: #838383 !important;
}

.mdc-switch__ripple {

    display: none !important;
}

/* aesstepper css */

/* mat tabel css */

aesgrid .mat-header-row {
    z-index: 1 !important;
}


aesgrid .mat-mdc-table .AeSGridMoreOptionsItem {
    top: unset !important;
}

aesgrid .mat-mdc-table .AeSGridMoreOptionsItem mat-icon {
    top: 18px;
    text-align: right !important;
    position: relative;
}



aesgrid .AeSGridMoreOptionsItem {
    top: unset !important;
}

aesgrid .AeSGridMoreOptionsItem mat-icon {
    top: 18px;
    text-align: right !important;
    position: relative;
}

aesgrid .AeSGridMoreOptionsItem.mdc-data-table__cell {
    text-align: right !important;
}

aesgrid .mat-mdc-cell {
    letter-spacing: inherit !important;
}

aesgrid .mat-mdc-table {
    font-family: inherit !important;
    border-spacing: 0;
    white-space: pre-wrap;
}

aesgrid .mat-mdc-row,
aesgrid.mat-mdc-header-row,
aesgrid.mat-md-footer-row {
    border-bottom-width: 0px;
}

aesgrid .mat-mdc-cell {
    border-bottom: unset !important;
}

.mat-mdc-table {
    border-spacing: 0;
    white-space: pre-wrap;
}

aesgrid .mat-mdc-header-cell:first-of-type {
    padding-left: 26px;
}

aesgrid .mat-mdc-header-cell {
    color: var(--bs-bodyTxt) !important;
}

aesgrid .mat-mdc-row:nth-child(even) {
    background-color: var(--bs-even-row-color);
}

aesgrid .mat-mdc-row:nth-child(odd) {
    background-color: var(--bs-odd-row-color);
}

aesgrid .mat-mdc-header-row,
aesgrid.mat-mdc-table-sticky {
    background: var(--bs-odd-row-color) !important;
    border-radius: 8px 8px 0px 0px !important;
}

.AeSMatTable .mat-mdc-sort-header-content {
    white-space: normal;
}

.AeSMatTable .mat-mdc-cell,
.mat-mdc-footer-cell {
    margin-left: 3px;
    white-space: normal;
}

aesgrid.mat-mdc-sort-header-content {
    text-align: left !important;
}

.AeSGridMoreOptionsHeader,
.AeSGridMoreOptionsItem {
    max-width: 100px;
    text-align: grid;
}

/* Mat menu list left */

.left-accordin .mat-mdc-list-item[aria-selected="true"] {
    background-color: var(--bs-secondary) !important;
}


.left-accordin .mdc-list-item:focus::before {
    background-color: var(--bs-secondary) !important;
    opacity: unset !important;
}

.left-accordin .mdc-list-item:hover::before {
    background-color: var(--bs-secondary) !important;
    opacity: unset !important;
}

.pop-grid-controls .mat-mdc-text-field-wrapper {
    background-color: white;
    margin-top: 10px;
    margin-bottom: 10px;

}


/* material css */

.mat-mdc-radio-button .mat-internal-form-field {
    font-family: inherit !important;
}

.mat-mdc-dialog-container .mat-mdc-dialog-title {
    color: inherit !important;
}


.mat-mdc-dialog-title {
    padding: 0px 15px !important;
}

.mat-mdc-table tr:first-child th:first-child {
    border-top-left-radius: 8px;
}

.mat-mdc-table tr:first-child th:last-child {
    border-top-right-radius: 8px;
}

.mat-mdc-table tr:last-child td:first-child {
    border-bottom-left-radius: 8px;
}


.mat-mdc-table tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
}


/***PMS *****/

.ReviewCardContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
}

.ReviewCard {
    width: 350px;
    height: 78px;
    padding: 16px;
    border-radius: 15px;
    box-shadow: 0px 4px 16px 0px #EAEAEA;
    position: relative;
    cursor: pointer;
}

.ReviewCardCarousel {
    width: 360px;
    padding: 16px 33px;
}

.CardConnector1 {
    position: relative;
    top: 22px;
    border-bottom: 1px solid #74748D4D;
}


.CardSelected {
    border: 2px solid var(--bs-secondary);
}

.ForwardCardBtn {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    text-align: center;
    align-content: center;
    position: absolute;
    background: var(--bs-white) !important;
    right: -15px;
    top: 21px;
    z-index: 2;
    cursor: pointer;
    border: 2px solid #74748D4D;
}

.BackwardCardBtn {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    text-align: center;
    align-content: center;
    position: absolute;
    background: var(--bs-white);
    left: -15px;
    top: 21px;
    z-index: 2;
    cursor: pointer;
    border: 2px solid #74748D4D;
}

.ForwardCardBtn.active,
.BackwardCardBtn.active {
    border-color: var(--bs-secondary);
}

.ForwardCardBtn.disabled,
.BackwardCardBtn.disabled {
    border-color: #74748D4D;
}

.ForwardCardBtn.disabled i,
.BackwardCardBtn.disabled i {
    color: #74748D4D;
}

.ForwardCardBtn.active i,
.BackwardCardBtn.active i {
    color: var(--bs-primary);
}

.ExpansionTable1 tr.Etable-expand-row {
    height: 0;
}


.ExpansionTable1 .example-element-row td {
    border-bottom-width: 0;
}

.ExpansionTable1 .example-element-detail {
    overflow: hidden;
    
}



.ExpansionTable1 .Etable-expand-row:nth-child(even) {
    background: var(--bs-even-row-color) !important;
}

.ExpansionTable1 .Etable-expand-row:nth-child(4n) {
    background: var(--bs-odd-row-color) !important;
}

.ExpansionTable1 .Etable-data-row:nth-child(n) {
    background: var(--bs-even-row-color) !important;
}

.ExpansionTable1 .Etable-data-row:nth-child(4n-1) {
    background: var(--bs-odd-row-color) !important;
}

.ExpansionTable1 .mat-mdc-cell {
    border-bottom: unset;
}

.ExpansionTable1 .mat-mdc-header-cell {
    border-bottom: unset;
}

.ExpansionTable1 .mat-mdc-header-row {
    background: var(--bs-odd-row-color);
}

.ExpansionTable1 .mat-mdc-icon-button.mat-mdc-button-base {
    all: unset;
}

.TabelExpanderIcon {
    padding: 0px 6px;
    border-radius: 100%;
    border: 2px solid var(--bs-primary);
    cursor: pointer;
}

.TabelExpanderIcon i {
    font-size: 12px;
    color: var(--bs-primary);
}



.YearCalendarControl .mat-mdc-select-arrow {
    top: 0px;
    left: 0px;
    margin-left: 5px;
    position: relative;
    color: var(--bs-primary) !important;
}

.YearCalendarControl .mat-mdc-select-value-text {
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
}

.YearCalendarControl .mat-mdc-select {
    color: inherit !important;
}

.YearCalendarControl.primary .mat-mdc-select {
    color: var(--bs-primary) !important;
}
 
.YearCalendarControl.primary .mdc-text-field--outlined .mat-mdc-form-field-infix {
    padding: 0px;
}
.YearCalendarControl.primary .mat-mdc-form-field-icon-suffix {
    display: none;
}
.YearCalendarControl.primary .mdc-text-field--outlined {
    padding-left: 0px;
}
.YearCalendarControl.primary .mat-mdc-notch-piece.mdc-notched-outline__leading,
.YearCalendarControl.primary .mat-mdc-notch-piece.mdc-notched-outline__notch,
.YearCalendarControl.primary .mat-mdc-notch-piece.mdc-notched-outline__trailing {
    border: 0px ;
}
 
.YearCalendarControl.primary .mdc-notched-outline,
.YearCalendarControl.primary .mat-mdc-form-field-flex,
.YearCalendarControl.primary .mat-mdc-text-field-wrapper
{
    height: unset !important;
}
 
.YearCalendarControl.primary .mat-mdc-form-field-infix {
    min-height: unset !important;
}
 
/* normal year calendar with aesdropdownlist */
 
.YearCalendarControl .mdc-text-field--outlined .mat-mdc-form-field-infix {
    padding: 0px;
}
.YearCalendarControl .mat-mdc-form-field-icon-suffix {
    display: none;
}
.YearCalendarControl .mdc-text-field--outlined {
    padding-left: 0px;
}
.YearCalendarControl .mat-mdc-notch-piece.mdc-notched-outline__leading,
.YearCalendarControl .mat-mdc-notch-piece.mdc-notched-outline__notch,
.YearCalendarControl .mat-mdc-notch-piece.mdc-notched-outline__trailing {
    border: 0px ;
}
 
.YearCalendarControl .mdc-notched-outline,
.YearCalendarControl .mat-mdc-form-field-flex,
.YearCalendarControl .mat-mdc-text-field-wrapper
{
    height: unset !important;
}
 
.YearCalendarControl .mat-mdc-form-field-infix {
    min-height: unset !important;
}

.FilterWidget3 {
    width: 100%;
    border: 1px solid #74748D4D;
    border-radius: 4px;
    padding: 0px 12px;
}


.FilterWidget4 {
    background: #FDFDFD !important;
    border-radius: 4px;
    max-width: 100%;
    border: 1px solid rgba(116, 116, 141, 0.30) !important;
}

.DataLimit1 {
    text-wrap: nowrap;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 393px;
    position: relative;
    top: 3px;
}

.PmsIcons{
	position: relative;
	top: 20px;
}

.PMSactionMenu.actions-menu{
	padding-top: 0px;
	position: relative;
    top: -12px;
}

.ExtendedGoalView {
    display: flex;
    position: relative;
    top: 14px;
}

.mat-mdc-tab-header {
    margin: 0px 15px;
}

.line-tab .mat-mdc-tab-header {
    margin: 0px 15px;
}


.ReviewCard1 {
    width: 267px;
    height: 78px;
    border-radius: 15px;
    box-shadow: 0px 4px 16px 0px #EAEAEA;
    background: #FDFDFD;
    padding: 16px;
    cursor: pointer;
}

.ReviewCardGroup {
    width: 605px;
    height: 102px;
    border-radius: 16px;
    padding: 12px;
    background: var(--bs-odd-row-color);
}

.ReviewCardGroup .ReviewCard1 {
    padding: 16px 16px 16px 24px;
}


.CardConnector2 {
    position: relative;
    top: 33px;
    border-bottom: 1px solid #74748D4D;
}

.GroupCardFrwdBtn {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    text-align: center;
    align-content: center;
    position: absolute;
    background: var(--bs-white) !important;
    right: -8px;
    top: 35px;
    z-index: 2;
    cursor: pointer;
    border: 2px solid #74748D4D;
}

.GroupCardBackwrdBtn {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    text-align: center;
    align-content: center;
    position: absolute;
    background: var(--bs-white);
    left: -8px;
    top: 35px;
    z-index: 2;
    cursor: pointer;
    border: 2px solid #74748D4D;
}

.GroupCardFrwdBtn.active,
.GroupCardBackwrdBtn.active {
    border-color: var(--bs-secondary);
}

.GroupCardFrwdBtn.disabled,
.GroupCardBackwrdBtn.disabled {
    border-color: #74748D4D;
}

.GroupCardFrwdBtn.disabled i,
.GroupCardBackwrdBtn.disabled i {
    color: #74748D4D;
}

.GroupCardFrwdBtn.active i,
.GroupCardBackwrdBtn.active i {
    color: var(--bs-primary);
}

/* add goal css */

.AddGoalExpansionList {
    width: 303px;
    height: 100vh;
    background: var(--bs-odd-row-color);
    overflow: hidden;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.GoalListContentContainer {
    max-height: 90vh;
    overflow-y: auto;
}

.GoalListContentContainer.GlType2{
	 max-height: 60vh;
}

.AddGoalExpansionList mat-expansion-panel-header {
    height: 54px;
    padding: 16px 16px 16px 24px;
    pointer-events: none;
    background: var(--bs-even-row-color) !important;
}

.AddGoalExpansionList mat-panel-title {
    pointer-events: none !important;
}

.AddGoalExpansionList .mat-expansion-indicator {
    pointer-events: auto !important;
}



.AddGoalExpansionList .mat-accordion .mat-expansion-panel:first-of-type {
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}


.AddGoalExpansionList .mat-expansion-panel:not([class*=mat-elevation-z]) {
    box-shadow: unset;
}


.AddGoalExpansionList .mat-accordion .mat-expansion-panel:last-of-type {
    border-bottom-right-radius: unset;
    border-bottom-left-radius: unset;
}

.AddGoalExpansionList .mat-expansion-panel-body {
    padding: unset;
}

.AddGoalExpansionList .mat-expansion-panel-content {
    font: inherit;
}

.AddGoalExpansionList .mat-expansion-panel-header-title {
    color: inherit;
}

.AddGoalExpansionList .GoalListContent {
    background: var(--bs-odd-row-color);
    min-height: 103px;
    border-bottom: 1px solid #74748D4D;
    padding: 16px 16px 16px 24px;
    cursor: pointer;
}


.AddGoalExpansionList .AddGoalLabel {
    position: relative;
    left: 90px;
    pointer-events: auto !important;
}

.AddGoalExpansionList .mat-expansion-indicator {
    position: relative;
    left: -160px;
}

.GoalListContent.selected {
    background: var(--bs-secondary);
}

.ChipNew {
    white-space: nowrap;
    display: inline-block !important;
    width: inherit !important;
    background: var(--bs-white) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 34px;
    padding-top: 4px;
    padding-bottom: 4px;
    text-align: center;
    color: var(--bs-light-primary);
}

.Multiline-data-limit {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 3em;
    line-height: 1.5em;
}

/* horizontal stepper for 12*/

.AeSStepper.AeSStepper.AeSStepperHorizontal {
    border-radius: 8px;
}

.AeSStepper.AeSStepperHorizontal .mat-horizontal-content-container {
    display: none;
}

.AeSStepper.AeSStepperHorizontal .mat-horizontal-stepper-header {
    padding: 16px;
	z-index:1;
}


.AeSStepper.AeSStepperHorizontal .mat-step-text-label {
    font-family: 'OpenSans-Regular', Arial !important;
    font-size: 12px !important;
    font-weight: 400;
    line-height: 16.34px;
    color: var(--bs-darkgrey);
}

.AeSStepper.AeSStepperHorizontal .mat-horizontal-stepper-header .mat-step-label {
    padding: 6px 0 0 0 !important;
    text-align: center;
    width: 100%;
    text-wrap: wrap !important;
}

.AeSStepper.AeSStepperHorizontal .mat-step-header .mat-step-icon:not(.mat-step-icon-selected) {
    margin: 6px;
    position: relative;
    left: -3px;
    z-index: 2;
}

.AeSStepper.AeSStepperHorizontal mat-step-header::after {
    top: 27px !important;
    width: calc(67% - 14px) !important;
}

.AeSStepper.AeSStepperHorizontal mat-step-header::before {
    top: 27px !important;
    width: calc(67% - 20px) !important;
}

.AeSStepper.AeSStepperHorizontal .mat-step-icon-state-done {
    margin: 0px !important;
    z-index: 2;
}

.AeSStepper.AeSStepperHorizontal .mat-step-icon-selected {
    z-index: 2;
}

.ReviewApprovalContainer {
    background: var(--bs-odd-row-color) !important;
    border-radius: 8px !important;
    padding: 24px !important;
}
 
.ReviewApprovalContainer .mat-mdc-text-field-wrapper {
    border-radius: 5px;
    background: var(--bs-white);
}
 
 
.AddGoalExpansionList .mat-expansion-panel-spacing {
    margin: 0px;
}
 
.AddGoalExpansionList mat-expansion-panel {
    border-bottom: 1px solid #74748D4D
}
 
.AddGoalExpansionList.forView .mat-expansion-indicator {
    all: unset;
}
 
.AddGoalExpansionList.forView .mat-content {
    flex: unset;
}
 
.GoalViewerWidget {
    background: var(--bs-odd-row-color);
    padding: 16px;
    border-radius: 8px;
}

.DisContinueGoalIcon{
    position: relative;
}

.NotifyDot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50px;
    background: var(--bs-primary);
    position: relative;
    left: -7px;
    top: -17px;
    border: 2px solid var(--bs-white);
}

.accordin-name-limit2 {
  position: absolute;
  max-width: 256px;
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-top: -12px !important;
}

.mat-mdc-dialog-actions .mat-mdc-button:hover .mat-mdc-button-persistent-ripple::before{
    opacity: unset !important;
}
.mat-mdc-dialog-actions .mat-mdc-button .mat-mdc-button-persistent-ripple::before{
    background-color: inherit !important;
}

.mat-mdc-dialog-actions .mdc-button{
    pointer-events: none !important;
}

lib-aesconfirmpopup .mat-mdc-dialog-actions .mdc-button{
	pointer-events: auto !important;
}

lib-aeswrapperdialog .mat-mdc-dialog-title {
    padding: 0px !important;
}

lib-aesconfirmpopup .confirmClose.mdc-icon-button{
    position: relative;
    z-index: 2;
    pointer-events: none;
}

lib-aesconfirmpopup .confirmClose.mdc-icon-button mat-icon{
    pointer-events: auto !important;
}


lib-aesconfirmpopup .mat-mdc-dialog-content {
    margin-bottom: 100px;
    padding-top: 22px;
    text-align: justify;
    padding-right: 0px;
}

lib-aesconfirmpopup .mat-mdc-dialog-actions{
    display: block;
}

/* MATERIAL 18 CSS END????????????????????????????????????????????????????????????????????? */


/* Navi CSS */



.GPTcontainer {
    text-align: center;
    font-family: inherit !important;
    margin: auto;
    position: relative;
    padding-bottom: 80px;
}

.GPTbody {

    height: 450px;
    width: 675px;
    margin: auto;
    overflow-y: auto;
    padding-left: 42px;
    padding-right: 42px;

}

.GPTtitle {
    padding-left: 42px;
    padding-top: 25px;
}

.GPTcard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    justify-items: center;
}

.GPTcard {
    border: 1px solid #CAE3F3 !important;
    box-shadow: 0px 4px 12px 0px #DEE7ED;
    transition: background-color 0.2s;
    border-radius: 8px;
    padding: 15px 20px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100px;
    width: 100%;
}

.GPTcard p {
    margin: 0;
    word-wrap: break-word;
}

.GPTinput-box {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.GPTfooter {
    position: relative;
    height: 80px;
    background-color: white;
    display: flex;
    align-items: center;
    padding: 0 15px;
    padding-left: 42px;
    box-shadow: -1px -8px 6px -1px rgba(0, 0, 0, 0.1);
}

.GPTtextarea {
    width: 100%;
    padding: 15px;
    border-radius: 30px;
    border: 1px solid #e2e6ea;
    padding-right: 50px;
    padding-left: 15px;
    outline: none;
    background-color: #f8f9fa;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    height: 50px;
    resize: none;
    overflow: hidden;
    max-height: 150px;
}

.GPTtextarea::placeholder {
    color: #999;
}

.GPTmic-icon {
    position: absolute;
    right: 15px;
    cursor: pointer;
}

.GPTmic-icon i {

    color: var(--bs-primary);
    font-size: 24px;
    position: relative;
    top: 1px;
}

@media screen and (max-width: 768px) {
    .GPTcard-grid {
        grid-template-columns: 1fr;
    }

    .GPTcard {
        min-height: 80px;
    }
}

@media screen and (max-width: 480px) {
    .GPTinput-box {
        max-width: 100%;
    }
}

.ButtonFlexContainer {
    display: flex;
    flex-direction: row;
    gap: 16px;
}

.AIOptionButton {
    min-width: 100px;
    height: 40px;
    padding: 8px 16px;
    display: flex;
    flex-direction: row;
    gap: 10px;
    border-radius: 6px;
    border: 1px solid var(--bs-secondary);   
    cursor: pointer;
	color:var(--bs-bodyTxt);
}

.ButtonFlexContainer div:first-child:not(.AIOptionIcon) {
    padding-left: 8px !important;
}

.AIOptionIcon {
    width: 24px;
    height: 24px;
    border: 1.5px solid;
    border-radius: 5px;
	color:var(--bs-secondary);
}

.clickertoggle {
    display: flex;
    justify-content: center;
    align-items: center;
}

.clickertoggle i {
    color: var(--bs-primary);
}

 .GPTclose-icon {
        cursor: pointer;
        float: right;
        font-size: 24px;
        color: var(--bs-primary);
        margin-left: 10px;
        position: relative;
        padding-top: 18px;
        right: 40px;
        z-index: 2;
    }
	
	    .GPTcontainer {
        padding-bottom: 0px !important;
    }

    .GPTbody {
        padding-left: 24px !important;
    }
	
	    .Navpopper {
        position: fixed;
        width: 718px;
        background: white;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     z-index:3;
        display: none;
    }

.Navarrow {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 25px solid transparent;
    border-right: 35px solid #fff;
    border-top: 60px solid #fff;
    top: 50%;
    transform: rotateZ(45deg);
    right: -10px;
    z-index: 2;
    box-shadow: 1px 2px 10px 6px #cccc;
}

	.AiStarterLine {
    border-top: 3px solid #dee2e6 !important;
}

.naviStepper div.mat-step:first-child mat-step-header .mat-step-icon-content:before{
        content:"";
        position: absolute;
        left: 45%;
        top: -50%;
        width: 3px;
        background: var(--bs-primary);
        height: 100%;
}

.AeSNaviContainer {
    /* Outer circle setup */
    .outer-circle {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
        background-color: #fff;
    }
 
    /* Rotating ring effect using pseudo-element */
    .outer-circle::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background-image: linear-gradient(135deg, #E8ECBC 0%, #C6CF58 30%, #C6CF58 27%, #2C6691 85%, #2C6691 100%);
        z-index: -1;
        animation: rotate-ring 5s linear infinite;
    }
 
    /* Inner circle with stars (non-rotating) */
    .inner-circle {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background: white;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
 
    /* Individual star styling with unique class names */
    .star1,
    .star2,
    .star3 {
        clip-path: polygon(16% 41%, 43% 37%, 51% 9%, 58% 37%, 89% 42%, 58% 50%, 52% 80%, 44% 51%);
        background: #2C6691;
        margin: 0px;
        border-radius: 10px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
    }
 
    /* Star colors can be customized per class */
    .star1 {
        background: #2C6691;
        width: 10px;
        height: 8px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 0s;
        position: relative;
        left: 2px;
    }
 
    .star2 {
        background: #2C6691;
        width: 10px;
        height: 8px;
        position: relative;
        top: -3px;
        left: 2px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 0.5s;
    }
 
    .star3 {
        width: 6px;
        height: 6px;
        background: #2C6691;
        position: relative;
        top: 4px;
        right: 5px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 1s;
    }
 
    /* Animate the gradient ring rotation */
    @keyframes rotate-ring {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    /* Zoom and Fade effect for stars */
    @keyframes zoom-fade-star {
        0% {
            transform: scale(1);
            opacity: 0.3;
        }

        50% {
            opacity: 1;
        }

        100% {
            transform: scale(1.5);
            opacity: 0.3;
        }
    }

    /* STEPPER CSS */
    .mat-stepper-vertical-line::before {
        content: "";
        position: absolute;
        left: -2px !important;
        border-left-width: 3px !important;
        border-left-style: solid !important;
    }

    .mat-stepper-vertical-line::before {
        border-left-color: var(--bs-primary) !important;
    }

    .mat-step-header[ng-reflect-selected="true"],
    .mat-step-header[aria-selected="true"] {
        background-color: transparent !important;
    }

    .mat-step-text-label {
        text-overflow: ellipsis;
        overflow: hidden;
        padding: 3px 10px 3px 10px;
        border-radius: 0px 18px 18px 0px !important;
        background: var(--bs-even-row-color);
        position: relative !important;
        right: -1px !important;
        z-index: 1 !important;
    }

    .mat-vertical-stepper-header .mat-step-icon {
        z-index: 2 !important;
    }

    .mat-step-label {
        margin-left: -12px;
    }

    .mat-step-icon-selected .inner-circle {
        background-color: var(--bs-primary) !important;
    }

    .mat-step-icon-selected .inner-circle .star1 {
        background: #fff;
    }

    .mat-step-icon-selected .inner-circle .star2 {
        background: #fff;
    }

    .mat-step-icon-selected .inner-circle .star3 {
        background: #fff;
    }

    .mat-step-icon-selected .outer-circle {
        box-shadow: 1px 2px 8px #aaa;
    }

    .mat-step-icon-selected .outer-circle::before {
        background-image: unset !important;
    }

    .mat-stepper-vertical,
    .mat-stepper-horizontal {
        font-family: inherit !important;
    }

    .example-sidenav-content {
        display: flex;
        height: 100%;
        align-items: center;
        justify-content: center;
    }

    .mat-vertical-stepper-content {
        display: none;
    }

    .iconNav {
        cursor: pointer;
        font-size: 24px;
        padding: 20px;
        position: fixed;
        bottom: 50px;
        right: 250px;
        z-index: 5;
        display: flex;
        justify-content: flex-end;
        flex-direction: row;
    }

    #iconCircleNavi {
        cursor: pointer;
        position: fixed;
        bottom: 100px;
        right: 100px;
        z-index: 5;
    }

    .overlay,
    .sidebarNavAI {
        transition: opacity 1s ease, visibility 1s ease;
    }

    .overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(56, 56, 92, 0.8) !important;
        z-index: 1;
        opacity: 0;
        visibility: hidden;
    }

    .overlay.active {
        opacity: 1;
        visibility: visible;
    }

    .sidebarNavAI {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        width: 270px;
        height: 85%;
        background: white;
        z-index: 2;
        opacity: 0;
        visibility: hidden;
    }

    .sidebarNavAI.active {
        opacity: 1;
        visibility: visible;
    }

    .close-btn {
        cursor: pointer;
        background-color: #f44336;
        color: white;
        border: none;
        padding: 10px;
        margin-top: 20px;
        display: block;
    }

    .clickertoggle {
        border: 2px solid #2C6691;
        height: 30px;
        width: 30px;
        text-align: center;
        border-radius: 50%;
        background-color: #fff;
    }

    .clickertoggle i {
        font-size: 18px;
        text-align: center;
    }

    .home-outer-circle {
        width: 53px;
        height: 53px;
        border-radius: 50%;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
    }

    .home-inner-circle {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: white;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }

    .home-outer-circle::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background-image: linear-gradient(135deg, #E8ECBC 0%, #C6CF58 30%, #C6CF58 27%, #2C6691 85%, #2C6691 100%);
        z-index: -1;
        animation: rotate-ring 5s linear infinite;
    }

    .home-inner-circle .star1 {
        background: #2C6691;
        width: 17px;
        height: 13px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 0s;
        position: relative;
        left: 5px;
    }

    .home-inner-circle .star2 {
        background: #2C6691;
        width: 14px;
        height: 10px;
        position: relative;
        top: -5px;
        left: 2px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 0.5s;
    }

    .home-inner-circle .star3 {
        width: 10px;
        height: 7px;
        background: #2C6691;
        position: relative;
        top: 8px;
        right: 10px;
        animation: zoom-fade-star 2s ease-in-out infinite alternate;
        animation-delay: 1s;
    }

    .naviStepper .mat-step {
        height: 125px;
    }

    .mat-stepper-vertical-line::before {
        top: -43px !important;
        bottom: -71px !important;
    }

    .stepper {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        margin: 50px;
    }

    .step {
        display: flex;
        align-items: center;
        cursor: pointer;
        margin: 20px 0;
    }

    .circle-button {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: #007bff;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 18px;
        position: relative;
    }

    .step-label {
        margin-left: 10px;
    }


    .AeSMatTable .mat-header-row {
        z-index: 0 !important;
    }

    .AIHeader {
        padding-left: 35px;
    }

    .mat-step-icon-state-edit .outer-circle::before {
        background-image: unset !important;
        background-color: #fff;
    }

    .mat-step-icon-state-edit .outer-circle {
        box-shadow: 1px 2px 8px #aaa;
    }

    .mat-step-icon-state-edit .inner-circle {
        background-color: var(--bs-secondary);
        color: #fff;
        width: 25px;
        height: 25px;
    }

    .mat-step-icon-state-edit .inner-circle i {
        font-size: larger;
    }

    .hide {
        display: none !important;
    }
}

/* Container styling to mimic Angular Material form-field */
.Navitextarea-container {
    position: relative;
    margin: 20px 0;
    padding: 0 42px;
    font-family: inherit !important;
  }
 
  /* Label styling */
  .Navitextarea-container label {
    position: absolute;
    top: 10px;
    left: 56px;
    font-size: 14px;
    color: #757575; /* Gray color */
    transition: all 0.2s ease;
    pointer-events: none;
  }
 
  /* Textarea base styling */
  .Navitextarea-container textarea {
    width: 100%;
    padding: 20px 12px 8px;
    font-size: 16px;
    font-family: inherit;
    border: 1px solid #bdbdbd;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.2s ease;
    resize: vertical; /* Limit resizing to vertical only */
  }
 
  /* Focus state for textarea */
  .Navitextarea-container textarea:focus {
    border-color: var(--bs-primary); /* Primary color */
  }
 
  /* When textarea is focused, move the label up */
  .Navitextarea-container textarea:focus + label,
  .Navitextarea-container textarea:not(:placeholder-shown) + label {
    top: -8px;
    left: 54px;
    font-size: 12px;
    color: var(--bs-primary); /* Match the focused border color */
    background: var(--bs-white);
    padding: 0 4px;
  }

.AiStationContainer .AiStartStation:before{
    content: '';
    width: 15px;
    height: 15px;
    border: 3px solid #C6CF58;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 78px;
    left: 28px;
    box-shadow: 0px 0px 0px 4px #2c6691;
    z-index: 3;
}

.naviStepper div.mat-step:first-child mat-step-header{
    padding-top: 28px
}

/* Navi css End */


/* video center popup css */


.AeSVdo
{
    height:480px;width:100%;
}
.carousel-indicators
{
    bottom: -10px !important;
}
/* video center popup css */
 
@media only screen and (max-device-width: 1366px) {
    .video-display-popup{
        height: 549px !important;
        overflow: hidden !important;
    }
    .AeSVdo{
        width: 100% !important;
        height: 356px !important;
    }
	.embed-responsive-16by9{
        padding-top: 0px;
    }
    .embed-responsive{
        height: 356px;
    }
}
 
.video-display-popup .carousel-indicators{
    margin-bottom: 8px;
}
 
.video-display-popup .embed-responsive-16by9{
        padding-top: 0px;
    }
    .video-display-popup .embed-responsive{
        height: 356px;
   }


/* @media only screen and (max-device-width: 1366px) { */
    /* .video-display-popup{ */
        /* height: 549px !important; */
        /* overflow: hidden !important; */
    /* } */
    /* .AeSVdo{ */
        /* width: 100% !important; */
        /* height: 356px !important; */
    /* } */
	/* .embed-responsive-16by9{ */
        /* padding-top: 0px; */
    /* } */
    /* .embed-responsive{ */
        /* height: 356px; */
    /* } */
/* } */

/* .video-display-popup .carousel-indicators{ */
    /* margin-bottom: 8px; */
/* } */

/* .video-display-popup .embed-responsive-16by9{ */
        /* padding-top: 0px; */
    /* } */
    /* .video-display-popup .embed-responsive{ */
        /* height: 356px; */
   /* } */
   


/* temporary css */



.path-icon {
    height: 28px;
    width: 28px;
    display: inline-block;
    background: var(--bs-white);
    text-align: center;
    align-content: center;
    font-size: 16px;
    border-radius: 50%;
    color: #74748D;
    flex-shrink: 0;
    position: relative;
  }
   
  .path-list-widget li {
    display: flex;
    gap: 12px;
    padding-bottom: 20px;
    position: relative;
  }
   
  .path-list-widget li:not(:last-child)::before {
    content: "";
    border: 1px solid #74748D4D;
    text-align: center;
    position: absolute;
    left: calc(7% - 13px);
    top: 0;
    bottom: 0;
    width: 1px;
  }
  
  
.emp-table{
  width: 100%;
  height: 100%;
  border: 1px solid #74748D4D;
  border-radius: 8px;
  background: #FDFDFD;
  padding: 0px 15px;
}

.emp-table-header{
  background: var(--bs-odd-row-color);
}

.emp-table-pad{
  padding-top: 12px;
  padding-bottom: 12px;
}

.emp-table .emp-table-header:first-child{
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
}

.emp-profile-image{
  height: 90px;
  width: 90px;  
}

.emp-profile-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.emp-path-detail-container{
  height: 100%;
  width: 100%;
  padding: 24px;
  background: var(--bs-even-row-color);
  border-radius: 8px;
}

.emp-path-detail-container .line-tab .mat-tab-header{
  border-bottom: 4px solid #74748D4D !important;
}

app-hierarchal .AeSOrgChartCommon div:nth-child(6)::-webkit-scrollbar {
    width:12px !important;      
}

app-hierarchal .AeSOrgChartCommon .boc-edit-form {
    position: absolute;
    border-radius: 10px;
    margin-left: 100px;
    right: -10px !important;
	top: 7px;
    z-index: 3;
}

.alternative-cards:nth-child(odd) {
  padding: 10px;
  background: var(--bs-odd-row-color);
}

.alternative-cards:nth-child(even) {
  padding: 10px;
  border:2px solid var(--bs-even-row-color);
}

/* .afd-contact-label .Afd-CheckBox aeslabel { */
    /* display: none; */
/* } */

/* File viewer */
.FileChipContainer {
    background: var(--bs-odd-row-color);
    border: 1px solid var(--bs-even-row-color);
    border-radius: 8px;  /* Rounded corners */
    padding: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px; /* Minimal space between chips */
  }
  .FileViewContainer {
    background: var(--bs-odd-row-color);
    border: 1px solid var(--bs-even-row-color);
    border-radius: 8px;  /* Rounded corners */
    padding: 20px;
    display: flex;
    flex-wrap: wrap;
    min-height: 500px;
    gap: 8px; /* Minimal space between chips */
    text-align: center;
  }
.FileWarningTXT{
    width: 100%;
    display: flex;
  justify-content: center; /* Horizontally center */
  align-items: center;     /* Vertically center */
      /* Adjust the height as needed, 100vh for full screen height */
        text-align: center;   
        color: var(--bs-error-red);   
}
  .FileChip {
    background-color: var(--bs-card-background);
    border-radius: 16px;  /* Rounded corners for the chip */
    padding: 8px 16px;  /* Padding inside the chip */
    font-size: 14px;  /* Text size */
    margin-right: 10px;
    margin-top: 5px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    display: inline-block;
  }
  .FileChip.Chipselected {
    background: var(--bs-secondary);
	color:white;
 
}

/*survey list controls */
.control-list .Filter-list-background:has(ul li:is(.list-group-item.disabled)) {
    background: #fafafa !important;
}
.control-list .Filter-list-background ul li:is(.list-group-item.disabled.selectedListItem){
    background: #ffffff !important;
}
.control-list .Filter-list-background ul li:is(.list-group-item.disabled) i{
    color: #74748D !important;
}
 
.control-list .Filter-list-background ul li:is(.list-group-item.disabled):not(.list-group-item.disabled.selectedListItem){
    opacity: 0.4;
}
.mat-accordion.section-expander mat-expansion-panel-header aestextbox input{

    color: var(--bs-bodyTxt);

}
 
.td-width-15 {
    WIDTH: 15%;
}
 

/* online test template */
 .preview-img-name-limit {
    max-width: 150px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    position: relative;
    top: 6px;
}
 
 
 /* horizontal stepper type full width for Angular 12*/

.AeSStepper.AeSStepper.AeSStepperHorizontal2 {
  border-radius: 8px;
}

.AeSStepper.AeSStepperHorizontal2 .mat-horizontal-content-container {
  display: none;
}

.AeSStepper.AeSStepperHorizontal2 .mat-horizontal-stepper-header {
  padding: 16px;
  z-index: 1;
  width: 100%;
}


.AeSStepper.AeSStepperHorizontal2 .mat-step-text-label {
  font-family: 'OpenSans-Regular', Arial !important;
  font-size: 16px !important;  
  color: var(--bs-primary);
}


.AeSStepper.AeSStepperHorizontal2 .mat-step-header .mat-step-icon:not(.mat-step-icon-selected) {
  margin: 6px;
  position: relative;
  left: -3px;
  z-index: 2;
}

.AeSStepper.AeSStepperHorizontal2 mat-step-header::after {
  top: 27px !important;
  width: calc(60% - 20px) !important;
}

.AeSStepper.AeSStepperHorizontal2 mat-step-header::before {
  top: 27px !important;
  width: calc(58% - 20px) !important;
}

.AeSStepper.AeSStepperHorizontal2 .mat-step-icon-state-done {
  margin: 0px !important;
  z-index: 2;
}

.AeSStepper.AeSStepperHorizontal2 .mat-step-icon-selected {
  z-index: 2;
}

.AeSStepperHorizontal2 .mat-stepper-horizontal-line {
  border-top-width: unset !important;
  border-top-style: unset !important;
  flex: unset !important;
  height: unset !important;
  margin: unset !important;
  min-width: unset !important;
}

.AeSStepperHorizontal2 .mat-step-label-selected {
  font-size: 14px;
  font-weight: 600;
}


/*Timeline CSS */

  html {
      --theme1-font-color: #FAFAFA !important;
      --theme2-font-color: #344F3A !important;
      --theme3-font-color: #5E5012 !important;
      --theme1-overlay-color: linear-gradient(180deg, rgba(8, 22, 50, 1) 0%, rgba(8, 22, 50, 1) 50%, rgba(8, 22, 50, 0) 100%) !important;
      --theme2-overlay-color: linear-gradient(180deg, rgba(124, 212, 233, 1) 0%, rgba(124, 212, 233, 1) 50%, rgba(124, 212, 233, 0) 100%) !important;
      --theme3-overlay-color: linear-gradient(180deg, rgba(249, 223, 126, 1) 0%, rgba(249, 223, 126, 1) 50%, rgba(249, 223, 126, 0) 100%) !important;
    }
 
 
    .timeline-events-widget {
      width: fit-content;
      height: auto;
      display: flex;
      flex-direction: row;
      gap: 10px;
      position: absolute;
      opacity: 1;
      /* All boxes are visible by default */
      transition: transform 0.5s ease, opacity 0.5s ease;
    }
 
    .timeline-events-widget.changedirection {
 
      flex-direction: row-reverse;
 
      .timeline-event-content:before {
        left: unset;
        right: 0;
      }
 
      .timeline-event-content {
        text-align: right;
        padding-inline-start: 0px;
        padding-inline-end: 20px;
      }
 
    }
 
    .timeline-events-widget .timeline-event-image {
      flex: 0 0 auto;
      width: 130px;
      align-content: center;
      justify-items: center;
    }
 
    .timeline-event-image img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
 
    .timeline-events-widget .timeline-event-content {
      --_theme-font-color: var(--themefnt-color, inherit);
      --_seperator-color: var(--themesep-color, inherit);
      flex: 1 0 0%;
      width: 350px;
      position: relative;
      padding-inline-start: 20px;
      padding-block: 15px;
      height: auto;
      align-content: center;
      color: var(--_theme-font-color);
    }
 
    .timeline-event-content:before {
      content: "";
      width: 5px;
      height: 70%;
      position: absolute;
      top: 50%;
      left: 0;
      translate: -50% -50%;
      background: var(--_seperator-color);
      border-radius: 100px;
    }
 
    .seperator-right {
      border-right: 1px solid;
    }
 
    .timeline-event-content .seperator-right {
      border-color: var(--_seperator-color);
    }
 
 
    .timeline-event-content.theme1:not(:is(.clicker)) {
      --themefnt-color: var(--theme1-font-color);
      --themesep-color: var(--theme1-font-color);
    }
 
    .timeline-event-content.theme1 .seperator-right {
      --themesep-color: var(--theme1-font-color);
    }
 
    .timeline-event-content.theme2:not(:is(.clicker)) {
      --themefnt-color: var(--theme2-font-color);
      --themesep-color: var(--theme2-font-color);
    }
 
    .timeline-event-content.theme2 .seperator-right {
      --themesep-color: var(--theme2-font-color);
    }
 
    .timeline-event-content.theme3:not(:is(.clicker)) {
      --themefnt-color: var(--theme3-font-color);
      --themesep-color: var(--theme3-font-color);
    }
 
    .timeline-event-content.theme3 .seperator-right {
      --themesep-color: var(--theme3-font-color);
    }
 
 
    .timeline-div-container {
      width: 100%;
      /* height: 100%; */
      position: absolute;
      top: 0;
      left: 0;
    }
 
    .timeline-div-container img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
 
    .timeline-user-overlay {
      --_theme-font-color: var(--themefnt-color, inherit);
      --_theme-background-color: var(--themebackgroundclr, inherit);
      width: 100%;
      height: 200px;
      padding-inline: 38px;
      position: absolute;
      top: 0;
      align-content: center;
      background: var(--_theme-background-color);
      color: var(--_theme-font-color);
    }
 
    .timeline-user-overlay aesswitch label {
      color: var(--_theme-font-color);
    }
 
    .timeline-user-overlay.theme1 {
      --themefnt-color: var(--theme1-font-color);
      --themebackgroundclr: var(--theme1-overlay-color);
    }
 
    .timeline-user-overlay.theme2 {
      --themebackgroundclr: var(--theme2-overlay-color);
    }
 
    .timeline-user-overlay.theme3 {
      --themebackgroundclr: var(--theme3-overlay-color);
    }
 
    .timeline-profile-image {
      width: 28px;
      height: 28px;
    }
 
    .timeline-profile-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
 
    .path-icon.completed {
      background: var(--bs-secondary);
      color: white;
    }
 
    .data-change.icon-container {
      display: flex;
      align-items: center;
    }
 
    .data-change.icon {
      width: 16px;
      /* Set width of the square */
      height: 16px;
      /* Set height of the square */
      background-color: var(--bs-light-secondary);
      /* Green background */
      border-radius: 0px;
      /* Optional: for rounded corners */
    }
 
    .data-change.text {
      margin-left: 6px;
      /* Space between icon and text */
    }
 
    .compare-timeline .mat-expansion-panel {
      background: #eff3f8;
      padding: 0px 0px 0px 0px !important;
    }
 
    /* FOR TIMELINE NEED to ADD in CSS */
    .compare-timeline .mat-expansion-panel {
      background: #eff3f8;
      padding: 0px 0px 0px 0px !important;
    }
 
    .compare-timeline .mat-expansion-panel:not([class*=mat-elevation-z]) {
      box-shadow: none !important;
    }
 
    .compare-timeline .mat-expansion-panel-header {
      padding-left: 0px !important;
      border: 1px solid #f6f9fc;
    }
 
    .compare-timeline .mat-expansion-panel:not([class*=mat-elevation-z]) {
      box-shadow: none !important;
    }
 
    .compare-timeline .mat-expansion-panel-header-title {
      color: var(--bs-bodyTxt) !important;
    }
 
    .compare-timeline .mat-expansion-panel-body {
      padding: 0px !important;
    }
 
    .compare-timeline .mat-expansion-panel-spacing {
      margin: 0px 0 !important;
    }
/*  */
    .Timeline-header .mat-slide-toggle-bar {
      background-color: rgb(77 80 85) !important;
    }
 
    .timeline-dropdown .mat-select-min-line {  
      font-size: 14px !important;
    }
    .Timeline-header {
      color: #FAFAFA;
    }
   
 
   
/* NEW TIMELINE CSS */
.TimLine_popup {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  background: rgba(56, 56, 92, 0.8) !important;
  display: flex;
  /* Use flexbox for centering */
  justify-content: center;
  /* Center horizontally */
  align-items: center;
  /* Center vertically */
}
 
/* Popup content */
.TimLine_popup-content {
  font-size: 12px;
  background-color: #fefefe;
  padding: 20px;
  border: 1px solid #888;
  max-width: 90%;
  width: 943px;
  height: 619px;
  overflow: auto;
  /* background: url('./assets/timeline/theme1.png') no-repeat center center; */
  background-size: contain;
  box-sizing: border-box;
  position: relative;
  margin: auto;
}
 
.TimLine_moving-object {
  display: none;
}
 
.TimLine_moving-object0 {
  position: absolute;
  top: 440px !important;
  left: 269px;
  transition: 1s ease-in-out;
}
 
.TimLine_moving-object1 {
  position: absolute;
  top: 304px !important;
  left: 64px;
  opacity: 0.5;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving-object2 {
  position: absolute;
  top: 239px !important;
  left: 625px;
  opacity: 0.4;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving-object3 {
  position: absolute;
  top: 159px !important;
  left: 329px;
  opacity: 0.3;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving-object4 {
  position: absolute;
  top: 91px !important;
  left: 630px;
  opacity: 0.1;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving-object1 h2 {
  font-size: 16px !important;
}
 
.TimLine_moving-object2 h2 {
  font-size: 14px !important;
}
 
.TimLine_moving-object3 h2 {
  font-size: 12px !important;
}
 
.TimLine_moving-object4 h2 {
  font-size: 10px !important;
}
 
.TimLine_moving-object0 img {
  height: 130px;
}
 
.TimLine_moving-object1 img {
  height: 90px;
}
 
.TimLine_moving-object2 img {
  height: 80px;
}
 
.TimLine_moving-object3 img {
  height: 75px;
}
 
.TimLine_moving-object4 img {
  height: 60px;
}
 
 
.TimLine_moving-object1 .event-details {
  font-size: 12px !important;
}
 
.TimLine_moving-object2 .event-details {
  font-size: 12px !important;
}
 
.TimLine_moving-object3 .event-details {
  font-size: 11px !important;
}
 
.TimLine_moving-object4 .event-details {
  font-size: 11px !important;
}
 
 
.TimLine_event {
  width: 350px;
}
 
.TimLine_event-details {
  color: #fff;
}
 
.TimLine_event-details a {
  color: #48AAF3;
}
 
.TimLine_event-details h2 {
   font-size: 15px;
}
 
/* Close button */
.TimLine_close {
  position: absolute;
  top: 10px;
  /* Adjust as needed */
  right: 10px;
  /* Adjust as needed */
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
  z-index: 2;
  /* Ensure it stays above other content */
}
 
 
 
 
 
 
 
 
.TimLine_moving2-object0 {
  position: absolute;
  top: 440px !important;
  left: 172px;
  transition: 1s ease-in-out;
}
 
.TimLine_moving2-object1 {
  position: absolute;
  top: 320px !important;
  left: 210px;
  opacity: 0.5;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving2-object2 {
  position: absolute;
  top: 256px !important;
  left: 622px;
  opacity: 0.4;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving2-object3 {
  position: absolute;
  top: 202px !important;
  left: 329px;
  opacity: 0.3;
  transition: 1s ease-in-out;
 
}
 
.TimLine_moving2-object4 {
  position: absolute;
  top: 130px !important;
  left: 630px;
  opacity: 0.2;
  transition: 1s ease-in-out;
 
}
 
 
.TimLine_moving2-object1 h2 {
  font-size: 16px !important;
}
 
.TimLine_moving2-object2 h2 {
  font-size: 14px !important;
}
 
.TimLine_moving2-object3 h2 {
  font-size: 12px !important;
}
 
.TimLine_moving2-object4 h2 {
  font-size: 10px !important;
}
 
.TimLine_moving2-object0 img {
  height: 130px;
}
 
.TimLine_moving2-object1 img {
  height: 90px;
}
 
.TimLine_moving2-object2 img {
  height: 80px;
}
 
.TimLine_moving2-object3 img {
  height: 75px;
}
 
.TimLine_moving2-object4 img {
  height: 60px;
}
 
 
.TimLine_moving2-object1 .event-details {
  font-size: 12px !important;
}
 
.TimLine_moving2-object2 .event-details {
  font-size: 12px !important;
}
 
.TimLine_moving2-object3 .event-details {
  font-size: 11px !important;
}
 
.TimLine_moving2-object4 .event-details {
  font-size: 11px !important;
}
 
.p-bottom0 .mat-form-field-wrapper {
  padding-bottom: 0px !important;
}
 
.timeline-dropdown .mat-form-field-wrapper{
  padding-bottom: 0px !important;
}
 
.view-by-filter{
 
  color: inherit !important;
}
.Timeline-header .calendar-control .mat-select-arrow{
  top: 10px !important;
}
 
/* Theme based css */
 
.Ttheme2 .Timeline-header {
  color: var(--bs-body-txt);
}
 
.Ttheme2 .Timeline-header {
  color: #344F3A;
}
 
.Ttheme3 .Timeline-header {
  color: #5E5012;
}
 
 
 
.Ttheme1 .TimLine_event-details {
  color: #fff;
}
 
.Ttheme2 .TimLine_event-details {
  color: #344F3A;
}
 
.Ttheme3 .TimLine_event-details {
  color: #5E5012;
}
.Ttheme1 .Timeline-header .calendar-control .mat-select-arrow {
  color: #FAFAFA !important;
}
 
.Ttheme2 .Timeline-header .calendar-control .mat-select-arrow {
  color:var(--bs-body-txt) !important;
}
.Ttheme3 .Timeline-header .calendar-control .mat-select-arrow {
  color:var(--bs-body-txt) !important;
}
 
 
 
 
.Ttheme1 .timeline-dropdown .mat-select-min-line {
  color: #ffffff !important;
 
}
 
.Ttheme2 .timeline-dropdown .mat-select-min-line {
  color: #344F3A !important;    
}
 
.Ttheme3 .timeline-dropdown .mat-select-min-line {
  color: var(--bs-body-txt) !important;
 
}

/* Block Calendar CSS */

.chip-calendar-block.selected {
   
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    display: inline-block !important;
    background: var(--bs-light-secondary) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 4px;
    padding-top: 2px;
    border: 1px solid var(--bs-low-light-grey);
    padding-bottom: 2px;
    text-align: center;
    color: var(--bs-primary);
    margin-right: 10px;
    font-weight: 600;
    box-shadow: 1px 2px 8px #EAEAEA;
}

.chip-calendar-block {
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    display: inline-block !important;
    background: var(--bs-card-background) !important;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 4px;
    padding-top: 2px;
    border: 1px solid var(--bs-low-light-grey);
    padding-bottom: 2px;
    text-align: center;
    color: var(--bs-primary);
    margin-right: 10px;
    font-weight: 600;
    box-shadow: 1px 2px 8px #EAEAEA;
}

/*Online question template CSS */

table.pay-table.matrix-question-table input[type="radio"] {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    cursor: pointer;
    accent-color: var(--bs-primary);
}
 
table.pay-table.matrix-question-table.pop-grid-controls .mat-form-field-appearance-outline .mat-form-field-outline {
    border-radius: 4px;
}
 
table.pay-table.matrix-question-table.dynamic-table .mat-form-field-wrapper {
    min-width: 125px;
}
 
.control-list.disabled-list .Filter-list-background ul li{
    pointer-events: none;
}
 
.control-list.disabled-list .Filter-list-background:has(ul li:is(.list-group-item)) {
    background: #fafafa !important;
}
 
.control-list.disabled-list .Filter-list-background ul li:is(.list-group-item.selectedListItem) {
    background: #ffffff !important;
}
 
.control-list.disabled-list .Filter-list-background ul li:is(.list-group-item) i {
    color: #74748D !important;
}
 
.control-list.disabled-list .Filter-list-background ul li:is(.list-group-item):not(.list-group-item.selectedListItem) {
    opacity: 0.4;
}
/*For candidate history popup view */
.data-popup mat-dialog-content app-candidatedetails #content-wrapper {
    max-width: 100%;
}
.data-popup mat-dialog-content app-candidatedetails #content-wrapper mat-tab-group mat-tab-body .mat-tab-body-content .container-fluid .row .container {
    max-width: 100%;
}

/* For hide dynamic Field */

.hide{
	
	display:none !important;
}

/*Angular 18 landing login css */

/* Landing css */

.auto-srch .mat-mdc-form-field-subscript-wrapper{
    display:none;
}

 .auto-srch .mdc-notched-outline__leading, .auto-srch .mdc-notched-outline__notch, .auto-srch .mdc-notched-outline__trailing{ 
 display:none; 
 } 

.auto-srch .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input,
.auto-srch .mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control {
    height: 36px;
    position: relative;
    top: -10px;
    width: 515px;
}
.auto-srch .mat-mdc-text-field-wrapper {
    height: 36px;
}
.main-sidenav .mat-mdc-icon-button{
    color:var(--bs-white);
}
/*For angular 18 carsousel support */
.noticarousel .carousel-indicators  .active {
    background-color: var(--bs-secondary) !important;
    opacity: 1 !important;
}
 
.noticarousel .carousel-indicators [data-bs-target] {
    box-sizing: content-box;
    border-radius: 50%;
    flex: 0 1 auto;
    width: 10px;
    height: 10px;
    padding: 0;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: var(--bs-text-field-border);
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: .5;
    transition: opacity .6s ease;
}
/* Landing css END */


/*L0 Menu */

.main-sidenav .mat-mdc-list-base {
    min-width: 84px;
    margin-top: 10px;
}

.mat-sidenav .toggle-bar {   
    top: 20px;    
}
.main-sidenav .mat-mdc-nav-list .mat-mdc-list-item {
    color: #fff !important;
    padding-top: 8px;
    margin-top: 10px;
    cursor: pointer !important;
}

.main-sidenav .mdc-list-item__content {
    padding-bottom: 24px;
}

.main-sidenav .L1submenu .mdc-list-item__content {
    padding-bottom: 0px;
}

.main-sidenav .L1submenu .mat-mdc-list-item{
    text-decoration:none;
     
}

.main-sidenav .L1submenu  .mat-mdc-list-item {
    padding-top: 0px;
    margin-top: 0px;
    
    }

.main-sidenav .mat-mdc-nav-list::-webkit-scrollbar-track {
    background: unset !important;
}

.mat-sidenav .mdc-list-item__content .l0menu-icon i {
    
    top: 0px;
    position: relative;
   
}
.main-sidenav .mat-mdc-nav-list::-webkit-scrollbar-track {
    background: unset !important;
}
.main-sidenav .mat-mdc-nav-list::-webkit-scrollbar-thumb {
    background: var(--bs-secondary) !important;  
    border-radius: 15px;
}
.L1submenu .mdc-list-item:hover::before {
background-color:unset;
}
/*L0 menu end */

.languages-menu .mdc-line-ripple{
    display: none;
}

.lang-menu .mat-mdc-select-arrow {
    margin-top: 0px !important;
    margin-left: 10px !important;
}


.lang-menu .mdc-text-field {
    padding:0px;
}

.languages-menu .mdc-line-ripple{
    display: none;
}

.lang-menu .mat-mdc-select-arrow {
    margin-top: 0px !important;
    margin-left: 10px !important;
}
.mat-mdc-form-field-icon-suffix  i.AeSTexboxPwdIcon {
    color: var(--bs-primary);
    font-weight: 600;
    position: relative;
    top: 0;
    right: 10px;
}

.lang-menu .mdc-text-field {
    padding:0px;
}

#loginpanel .mat-mdc-checkbox .mdc-label {
    color: var(--bs-darkgrey) !important;
}

.languages-menu .mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{
    opacity:0;
}

 .loginBody .mat-mdc-select-panel {
    background: #fff;
    max-height: 300px;
    min-width: 150px !important;
   
} 

.mat-sidenav .main-toggle{
    color:var(--bs-white) ;
}
.mat-mdc-tooltip-surface {
    border-radius: 4px;
    height: auto;
    font-size: 15px;
    padding-top: 5px;
    z-index: 1000;
    left: -14px;
    max-width: 800px !important;
	color:var(--bs-white) !important;
    background-color: var(--bs-light-primary) !important;
   font-family:inherit !important;
    font-size: inherit !important;
    font-weight: var(--mdc-plain-tooltip-supporting-text-weight, var(--mat-app-body-small-weight));
    line-height: inherit !important;
    letter-spacing: inherit !important;
}
.auto-srch-panel-height .mat-mdc-option {
    height: 100% !important;
    /* line-height: 53px; */
    padding-top: 5px;
    padding-bottom: 5px;
}

.auto-srch-panel-height .mat-mdc-option:hover {
    background: var(--bs-even-row-color);
}


.auto-srch-panel-height .mat-mdc-option {
    height: 100% !important;
    /* line-height: 53px; */
    padding-top: 5px;
    padding-bottom: 5px;
}
.mat-mdc-autocomplete-panel.auto-srch-panel-height {
    position: relative;
    left: 18px;
    top: -8px;
    width: 514px !important;
}

/*Angular 18 Payroll */
.HeaderDropdown .mat-mdc-select {
    width: auto;
}
 
.HeaderDropdown .mat-mdc-select-value {
    display: contents;
    position: relative;
    font-family: Montserrat-Bold,Arial!important;
    font-size: 18px!important;
   
}
 
.HeaderDropdown .mat-mdc-select-arrow {
    position: relative;
    left: 10px;
    color:var(--bs-primary) !important;
   
}

.pop-grid-controls .mat-mdc-form-field-subscript-wrapper{
    display:none;
}
.formula-builder-tool .mat-mdc-card-title, .formula-builder-tool .mat-mdc-card-subtitle {
    
    font-size: 14px !important;
    font-family: inherit !important;
    line-height:inherit ;
    letter-spacing:inherit;
}

.formula-builder-tool .mat-mdc-card {
    box-shadow: none !important;
    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    position: relative;
    padding: 10px;
    border-radius: 4px;
    /* border-radius: 8px; */
    border: 1px solid #d6d6d6;
    margin-bottom: 8px;
    line-height: 12px;
}

.formula-builder-tool .mat-mdc-card-header {
    margin-top: 0px !important;
        padding: 0px 16px 0;
}

.formula-builder-tool .mat-mdc-card-header-text {
    width: 100%;
}

.mat-card-header .mat-mdc-card-title {
    font-size: 14px !important;
    font-family: inherit !important;
}

.parent-card .mat-mdc-card-title {
    font-weight: 600 !important;
}

.child-card .mat-mdc-card-title {
    font-weight: 600 !important;
}

.fmb-drop-list .mat-mdc-input-element{

    outline:none;
    width:100%;
    border:none;
}

.loan-data-widget .mat-mdc-text-field-wrapper{
    background:var(--bs-white);


}
.dynamic-table .mat-mdc-text-field-wrapper{
    background:var(--bs-white);
    margin-bottom: 7px !important;
    margin-top: 7px !important;

}

.dynamic-table .mat-mdc-form-field-subscript-wrapper {
    display: none;
}
/*payroll end */
/* Angualr 18 travel */
.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay {
    opacity: 0 !important;   
}


/* Succession planning Angualr 18 */
tr.matheader2.mat-mdc-header-row th.mat-mdc-header-cell {
    border-radius: 0px !important;
    background-color: var(--bs-table-primary-header);
}
.mdc-slider__track--inactive {
    background-color: #b3b5b7;
}

.mdc-slider__thumb-knob {
	
    border-width: 3px !important;
}
.mdc-slider__tick-mark--inactive {
  
   background-color: unset;
}

.mdc-slider__tick-mark--inactive {
   
   background-color: unset;
}

.mdc-slider__track--active_fill {

    border-color:var(--bs-primary) !important;
}

.mdc-slider__thumb-knob {
    width: 16px !important;
    height: 16px !important;

}
.mdc-slider__thumb--focused .mdc-slider__thumb-knob {
    background: var() !important;
    border-color: #cfcfd0 !important;
}

.mdc-slider__thumb-knob {
    background: #74748c !important;
    border-color: #cfcfd0 !important;
}

.mat-mdc-slider .mdc-slider__tick-marks {
	display:none;
}


/*Base admin Angular 18 css */
 
.A18-module-admin-table .mdc-data-table__cell:first-child, .mdc-data-table__header-cell:first-child{
	padding-right:0px;
}
 
.A18-module-admin-table .mat-mdc-checkbox .mdc-label {
      padding-right: 0px;
      /* display: none; */
}
 
.A18-module-admin-table .selected-row {
    background: var(--bs-secondary) !important;
    color: white;
}
 
.A18-module-admin-table.mat-mdc-table tr:first-child th:first-child {
    border-top-left-radius: 8px !important;
}
.A18-module-admin-table.mat-mdc-table tr:last-child th:last-child {
border-top-right-radius: 8px !important;
}
 
.A18-module-access-panel .mat-expansion-panel-header {
    position: relative;
    left: 5px;
}
 
 
 
.A18-module-access-panel .accordion-panelgrid li .mat-content aescheckbox {
    position: relative;
    left: -7px;
}
 
 
.A18-module-access-panel .accordion-panelgrid li ul li aescheckbox {
    position: relative;
    left: -7px;
}
 
.Filter-widget2 .mat-mdc-text-field-wrapper{
	background:white;
}


.A18-module-access-panel .head-col-title {
    position: relative;
    left: 7px;
}


.A18-module-access-panel .header-checkbox {
    position: relative;
    left: 3px;
}


.A18-module-access-panel .header-checkbox2 {
    position: relative;
    left: 7px;
}
.A18-module-empmaping-panel .header-checkbox-mapping{
	position: relative;
    left: 8px
}
.freez-unfreez-table .mat-mdc-checkbox .mdc-form-field {
    margin-bottom: 0px !important;
}
.freez-unfreez-table .mat-mdc-radio-button .mdc-radio {
    padding: 0px 10px 0px 0px !important;
}


/* Compensation planning tool Angular 18 css */


.line-tab-all .mat-mdc-tab.mdc-tab {
    min-width: unset !important;
   
    padding: 0px !important;
    margin-right: 30px;
 
 
}
 
.line-tab-all .mdc-tab__text-label

 {
    z-index: 10 !important;
    font-family: 'OpenSans-Regular';
    font-size: 16px;
    padding-right: 0px;
} 
.line-tab-all .mat-mdc-tab-header {
    margin: 0px 0px !important;
}
 
.mat-fulltable .mat-mdc-cell, .mat-fulltable .mat-mdc-header-cell {
    word-wrap: initial;
    display: table-cell;
    padding: 0px 4px 4px 4px;
    line-break: unset;
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: middle;
}
 
.mat-fulltable .mat-mdc-cell, .mat-fulltable .mat-mdc-header-cell {
    word-wrap: initial;
    display: table-cell;    
    line-break: unset;
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: middle;
}
 
 
.new-calendar-menu2 .mat-mdc-select-value {
    display: contents;
    position: relative;
    font-family: 'Montserrat-Bold', Arial !important;
    font-size: 20px !important;
    color: var(--bs-primary) !important;
}
 
.mat-mdc-select-arrow {
    width: 10px;
    height: 5px;
    position: relative;
    color: var(--bs-primary);
}
 
tr.matheader2.mat-mdc-header-row th.mat-mdc-header-cell:first-child {
    border-top-left-radius: 8px !important;
}
 
tr.matheader2.mat-mdc-header-row th.mat-mdc-header-cell:last-child {
    border-top-right-radius: 8px !important;
}



.multiselect-checkbox-widget {
    overflow: hidden !important;
}
.multiselect-checkbox-widget .mat-mdc-menu-content{
    padding:0px !important;;
}
/*Core angular 18 css adhoc approval popup*/
app-view-adhoc.mat-mdc-dialog-component-host {
    display: unset;
}
/*core end */


/*******Approval forms mobile view *****/



@media (max-width: 768px) {

app-confirmation-appraisal-approval .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;
}
	app-compensation-history .colr .col-6 {
    max-width: 100%;
}
	app-confirmation-appraisal-approval .pay-table td .row {
		margin:unset;

}


		app-confirmation-appraisal-approval .page-footer .col {
		text-align:center !Important;

}
			app-confirmation-appraisal-approval .page-footer .col .pl-3 {
		padding-left:0px !important;

}
				app-confirmation-appraisal-approval .page-footer .BtnSave {
		margin-left:0px !important;

}



app-employee-creation-approval .apprv-usr-img {
    position: relative;
    top: 1px;
    left:unset;
}

app-compensation-history .colr .col-6 {
    max-width: 100%;
}


.mat-mdc-dialog-panel {
    max-width: 100% !important;
    width: 100vw !important;
}

.mat-mdc-dialog-panel .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;


}
app-leave-ticket-approval .pay-table {
  display: flow;         
  overflow-x: auto; 
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  width:100%;
}
app-leave-ticket-approval .pay-table .mat-form-field-wrapper {

  background:white;
  padding-bottom:0px
}

}

/*Manpower Angular 18 css */
.budgetDepartmentAllocTable tr:not(:nth-child(1),:nth-child(2)) td:not(td:first-child) {
    
    vertical-align: text-top; 
}

.budgetDepartmentAllocTable tr td:first-child .budgetaccordionData div{

    height: 41px !important;
}

.budgetDepartmentAllocTable tr td:first-child .budgetaccordionData{
    padding-top: unset
}

/*Pulse center dialog container */

.social-center-dialog .mat-mdc-dialog-container {   
    min-height: unset !important;
}

/********Approval forms mobile view *****/



@media (max-width: 768px) {

app-confirmation-appraisal-approval .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;
}
	app-compensation-history .colr .col-6 {
    max-width: 100%;
}
	app-confirmation-appraisal-approval .pay-table td .row {
		margin:unset;

}


		app-confirmation-appraisal-approval .page-footer .col {
		text-align:center !Important;

}
			app-confirmation-appraisal-approval .page-footer .col .pl-3 {
		padding-left:0px !important;

}
				app-confirmation-appraisal-approval .page-footer .BtnSave {
		margin-left:0px !important;

}



app-employee-creation-approval .apprv-usr-img {
    position: relative;
    top: 1px;
    left:unset;
}

app-compensation-history .colr .col-6 {
    max-width: 100%;
}


.mat-mdc-dialog-panel {
    max-width: 100% !important;
    width: 100vw !important;
}

.mat-mdc-dialog-panel .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;


}
app-leave-ticket-approval .pay-table {
  display: flow;         
  overflow-x: auto; 
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  width:100%;
}
app-leave-ticket-approval .pay-table .mat-form-field-wrapper {

  background:white;
  padding-bottom:0px
}

}

app-leave-ticket-approval .pay-table .mat-form-field-wrapper {

  background:white;
  padding-bottom:0px
}
/* Mobile view End */


.grid-input-number .mat-mdc-text-field-wrapper {
  
    height: 54px;
    width: 91px;   
    min-width: unset !important;
}

.year-calendar-width {
    min-width: 170px;
}
.new-calendar-menu2 .mat-mdc-select-arrow {
    padding-left:25px;
    color:var(--bs-primary);
}

/* ngModel Validation error line  */
 
/* angular 12 */
.invalid-input.ng-invalid .mat-form-field-appearance-outline .mat-form-field-outline,
.ng-invalid.invalid-input .mat-form-field-wrapper .mat-form-field-outline,
.invalid-input.ng-invalid .mat-form-field-appearance-outline .mat-form-field-outline-thick,
.invalid-input.ng-invalid span.mat-placeholder-required.mat-form-field-required-marker {
  color: #f44336 !important;
}
 
/* angular 18 */
 
.ng-invalid.invalid-input .mat-form-field-appearance-outline .mdc-text-field--outlined .mat-mdc-form-field-flex .mdc-notched-outline .mat-mdc-notch-piece {
  border-color: #f44336 !important;
}
 
 
/* For schedule online test view result page: */
 
.showHideData {
  width: 178px;
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
 
/* For Malaysia claims page and New flexible table  */
 
.flexi-table .mat-form-field-wrapper {
  padding-bottom: 5px;
  margin-top: 5px;
  min-width: 140px;
}
 
.flexi-table .mat-form-field-wrapper {
  background: #fff !important;
  padding-bottom: 0px !important;
  margin-right: 10px !important;
}
 
.flexi-table td {
  height: 80px;
}
 
.flexi-table td {
  min-width: 100px;
}
 
.flexi-table td.number-field {
  min-width: 120px;
}
 
.flexi-table td:has(aesdatepicker) {
  min-width: 180px;
}
 
.flexi-table td:has(aesdropdownlist) {
  min-width: 220px;
}
 
.flexi-table td:has(aestextbox) {
  min-width: 250px;
}
 
@media only screen and (max-width: 768px) {
  .claim-dynamic-form .row .col-md.border-right {
    border-right: unset !important;
  }
 
  .claim-dynamic-form .row .col:has(table.pay-table.flexi-table) {
    margin-inline: 5px !important;
    padding-inline: unset !important;
  }
 
  .claim-dynamic-form table.pay-table.flexi-table tbody tr td.mat-cell.table-column-fixed .row {
    justify-content: center !important;
  }
}

/********Approval forms mobile view fix *****/
 
 
@media (max-width: 768px) {
 
app-confirmation-appraisal-approval .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;
}
	app-compensation-history .colr .col-6 {
    max-width: 100%;
}
	app-confirmation-appraisal-approval .pay-table td .row {
		margin:unset;
 
}
 
 
		app-confirmation-appraisal-approval .page-footer .col {
		text-align:center !Important;
 
}
			app-confirmation-appraisal-approval .page-footer .col .pl-3 {
		padding-left:0px !important;
 
}
				app-confirmation-appraisal-approval .page-footer .BtnSave {
		margin-left:0px !important;
 
}
 
 
app-employee-creation-approval .apprv-usr-img {
    position: relative;
    top: 1px;
    left:unset;
}
 
app-compensation-history .colr .col-6 {
    max-width: 100%;
}
 
 
.mat-mdc-dialog-panel {
    max-width: 100% !important;
    width: 100vw !important;
}
 
.mat-mdc-dialog-panel .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;
 
 
}
app-leave-ticket-approval .pay-table {
  display: flow;         
  overflow-x: auto; 
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  width:100%;
}
app-leave-ticket-approval .pay-table .mat-form-field-wrapper {
 
  background:white;
  padding-bottom:0px
}
app-apply-loan-approval-me .pay-table {
  display: flow;           /* Makes the table a block container */
  overflow-x: auto;         /* Enables horizontal scroll */
  white-space: nowrap;      /* Prevents cell contents from wrapping */
  -webkit-overflow-scrolling: touch; /* Smooth scroll on iOS */
  width:100%;
}
 
}
 
app-leave-ticket-approval .pay-table .mat-form-field-wrapper {
 
  background:white;
  padding-bottom:0px
}