/* Styles Here */

.hl-heading{
    font-size: 30px;
    color: #00b6ff;
    font-weight: 600;
}

/* Widget styles Here */

.hl-widget-background{
    background-color: #cfcfcf;
    color: red;
} 
.xp-public.default-theme{
    background-color: var(--vs-trade-fair-background-color);
}
.default-theme{
    background-color: var(--dc-skin-light-bg);
}

.overlay-text-tf-card :is(h1, h2, h3, h4, h5, h6) {
    color: var(--vs-trade-fair-primary-text-color);
}

.tf-card-heading:is(h1, h2, h3, h4, h5, h6) {
    color: var(--vs-trade-fair-primary-text-color);
}

#product-title:is(h1, h2, h3, h4, h5, h6) {
    color: var(--vs-trade-fair-primary-text-color);
}

b, strong {
    font-weight: bold !important;
}

a:hover{
    color: inherit !important;
}

.clearfix,
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
    content: none !important;
    display: none !important;
}

.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
    clear: none !important;
}

.xp-public .dc-body-wrap .dc-auth-panel .dc-cp-h-logo img{
    width: 240px;
    max-width: 240px;
}
.xp-public .dc-body-wrap .dc-conf-panel.dc-auth-panel .dc-cp-body{
    color: #ffffff;
    border: 1px solid #ffffff;
    background: transparent;
}

.xp-public .dc-body-wrap .dc-conf-panel.dc-auth-panel .dc-cp-b-header .dc-cp-b-h-title{
    color: #ffffff;
}

.xp-public .dc-auth-panel .dc-cp-body .dcui-fld-label{
    color: #ffffff;
}

.xp-public .dc-auth-panel .dc-cp-body .dcui-button{
    border: 1px solid var(--vs-trade-fair-primary-color);
    background-color:  var(--vs-trade-fair-primary-color);
}
.xp-public .dc-auth-panel .dc-cp-body .dcui-button:hover{
    background-color: #2826a8;
    border-color: #2826a8;
}

.xp-public .dc-auth-panel .dc-cp-body  .dcui-inline-links .dcui-text-link{
    color: #ffffff;
}
.xp-public .dc-body-wrap .dc-conf-panel.dc-auth-panel .acp-footer{
    color: #ffffff;
}

.xp-public .dc-body-wrap .dc-conf-panel.dc-auth-panel .dcui-button.doing-ajax {
    pointer-events: none;
    border-color: var(--vs-trade-fair-primary-color);
    background-color:  var(--vs-trade-fair-primary-color);
}
.xp-public .dc-body-wrap .dc-conf-panel.dc-auth-panel .dcui-button.doing-ajax .dcui-ajax-ellipsis-wrap{
    background-color:  var(--vs-trade-fair-primary-color);
}

.gap-5{
    gap: 5px;
} :root {
    --vs-trade-fair-background-color: #0c0c11;
    --vs-trade-fair-primary-color: #3431d4;
    --vs-trade-fair-primary-text-color: #fff;
}

.product-main-image {
    pointer-events: auto;
}

.fade-enter-active, .fade-leave-active {
    transition: opacity 0.5s;
}

.fade-enter, .fade-leave-to /* .fade-leave-active in <2.1.8 */
{
    opacity: 0;
}

.product-details {
    padding-bottom: 30px;
}

.vst-upload-image {
    width: 135px;
    height: 135px;
    object-fit: cover;
    border-radius: 8px;
    object-position: top;
}

.vst-inputs-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 15px;
    flex: 1;
}

.vst-image-container {
    flex: 0 0 180px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.vst-form-container {
    display: flex;
    justify-content: space-between;
    padding: 25px 0 15px;
    gap: 10px;
    align-items: flex-start;
    flex-direction: row;
}

.vst-delete-popup-text.head{
    font-size: 17px;
    font-weight: 600;
}

.vst-form-container.column.vst-update-link-popup{
    min-height: 350px;
}

.vst-update-link-select-page-container{
    gap: 15px;
}

.vst-delete-popup-text.description{
    font-size: 16px;
    font-weight: 500;
}


.vst-form-container.column{
    flex-direction: column;
}

.vst-form-container .dcui-basic-tabs{
    width: 100%;
}

.vst-image-fnc-container{
    display: flex;
    width: 100%;
    justify-content: center;
}

.vst-upd-service-tab-container{
    display: flex;
    align-items: flex-start;
    min-height: 470px;
}

.vst-inputs-container .services .tab_2{
    display: flex;
    flex-direction: column;
}

.vst-image-upload-container {
    display: flex;
    align-items: center;
    width: 350px;
    min-height: 130px;
    padding: 10px;
    max-height: 100%;
    border: 1px solid gainsboro;
    border-radius: 5px;
    justify-content: space-around;
}

.vst-inputs {
    min-width: 350px;
    width: 350px;
    display: flex;
}

.vst-inputs .dcui-form-group{
    width: 100%;
}

.dcui-button.vst-red-no-fill {
    border-color: var(--dcui-danger-color);
    color: var(--dcui-danger-color);
}

.dcui-button.vst-red-no-fill:hover {
    background-color: var(--dcui-danger-color);
}

.dcui-button.vst-red-no-fill .dcui-ajax-ellipsis-wrap{
    background-color: var(--dcui-danger-color);
}


/*.tf-card .vst-loading{*/

/*}*/

/*:root {*/
/*    --loading-grey: #15151e;*/
/*}*/

/*.vst-loading.tf-card,*/
/*.vst-loading img,*/
/*.vst-loading .tf-card-heading,*/
/*.vst-loading .tf-card-body,*/
/*.vst-loading.tf-video-wrapper-card,*/
/*.vst-loading .tf-card-button{*/
/*    background-color: var(--loading-grey) !important;*/
/*    background: linear-gradient(*/
/*            90deg,*/
/*            rgba(255, 255, 255, 0) 40%,*/
/*            rgba(255, 255, 255, .5) 50%,*/
/*            rgba(255, 255, 255, 0) 60%*/
/*    ) var(--loading-grey);*/
/*    background-size: 200% 100%;*/
/*    background-position-x: 180%;*/
/*    animation: 1s vst-anim-loading ease-in-out infinite;*/
/*}*/

/*@keyframes vst-anim-loading {*/
/*    to {*/
/*        background-position-x: -20%;*/
/*    }*/
/*}*/

/*.vst-loading .tf-card-heading {*/
/*    min-height: 2rem;*/
/*    max-width: 12.6rem;*/
/*    border-radius: 6px;*/
/*    animation-delay: .05s;*/
/*    margin-bottom: 5px;*/
/*}*/

/*.vst-loading .overlay-text-tf-card .tf-card-heading {*/
/*    min-height: 2rem;*/
/*    height: 41px;*/
/*    max-width: 482px;*/
/*    width: 482px;*/
/*    border-radius: 6px;*/
/*    animation-delay: .05s;*/
/*    margin-bottom: 5px;*/
/*}*/

/*.vst-loading .overlay-text-tf-card .tf-card-body{*/
/*    min-height: 1.8rem;*/
/*    height: 28px;*/
/*    width: 476px;*/
/*    border-radius: 4px;*/
/*    animation-delay: .06s;*/
/*}*/

/*.vst-loading.tf-video-wrapper-card{*/
/*    animation-delay: .06s;*/
/*    border-radius: 4px;*/
/*    min-height: 107px;*/
/*    width: 1276px;*/
/*}*/

/*.vst-loading .tf-card-body {*/
/*    min-height: 1.8rem;*/
/*    border-radius: 4px;*/
/*    animation-delay: .06s;*/
/*}*/

/*.vst-loading .tf-card-button {*/
/*    min-height: 3.2rem;*/
/*    min-width: 8rem;*/
/*    border-radius: 25px;*/
/*    animation-delay: .06s;*/
/*}*/ @font-face {
    font-family: 'Mulish';
    src: url('/apps/vs_trade_fair/assets/fonts/Mulish-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body { 
    height: 100%;
    margin: 0;
    /*overflow-x: hidden;*/
    font-family: 'Mulish', sans-serif;
}

a{
    display: block;
    color: inherit;
    text-decoration: none;
    background: none;
    border: none;
}

.xp-public{
    background-color: var(--vs-trade-fair-background-color);
}

.xp-public.bg-def {
    background-color: #3a3a3d;
    transition: background-color 1s ease;
}

.xp-public.bg-dark {
    background-color: #0c0c11;
    transition: background-color 1s ease;
}

#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loader {
    text-align: center;
}

.loader .spinner {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: #FF3D00;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation-tf-loader 1s linear infinite;
}

@keyframes rotation-tf-loader {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


body:not(#page-loader) #content {
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}

#tf-content{
    transition: filter 0.2s ease-in;
}
.tf-brightness{
    filter: brightness(0.8);
}

/* Container */

.container {
    width: calc(100% - 70px);
    max-width: 1336px;
    margin: 45px auto;
}

/* Row */
.row {
    display: flex;
    flex-wrap: wrap;
    margin: 15px 15px -25px;
    justify-content: space-between;
}

.row-home {
    height: calc(100vh - 300px);
}

.row-rel {
    position: relative;
}

/* Column */
.col {
    padding: 15px;
    box-sizing: border-box;
}
.col-12 {
    flex: 0 0 100%;
    max-width: 100%;
}

.screen-saver {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.background-video, .video-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1);
    z-index: -1;
}

.overlay-text {
    color: #fff;
    font-size: 2em;
    z-index: 1;
    padding: 20px;
    text-align: center;
}
.overlay-text-tf-card {
    color: #fff;
    font-size: 2em;
    z-index: 1;
    padding: 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    height: 100%;
}

.overlay-text .tf-logo {
    position: absolute;
    top: 10%;
    left: 10%;
    width: 300px;
    height: auto;
}

.overlay-text .tf-logo img{
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
}

.tf-tap-act {
    position: absolute;
    bottom: 5%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-wrap: nowrap;
    color: #fff;
    font-size: 22px;
    padding: 10px;
    overflow: hidden;
    white-space: nowrap;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5),
    0 0 10px rgba(255, 255, 255, 0.5),
    0 0 15px rgba(255, 255, 255, 0.5);
}

.tf-tap-letter {
    display: inline-block;
    opacity: 0;
    font-size: 20px;
    font-weight: 100;
    padding-right: 2px;
    animation: slideAndFade 3.5s infinite;
}

.tf-tap-letter-space{
    width: 5px;
}


.tf-toggle-sidebar{
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: 9;
    cursor: pointer;
}
.tf-toggle-sidebar i{
    color: #ffffff;
    transition: color 0.2s ease-in
}
.tf-toggle-sidebar i:hover{
    color: #c7c7cb;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
        clip-path: inset(0 80% 0 0);
    }
    50% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
    }
    100% {
        opacity: 0;
        clip-path: inset(0 80% 0 0);
    }
}
@keyframes slideAndFade {
    0% {
        transform: translateX(-100%);
        clip-path: inset(0 80% 0 0);
        opacity: 0;
    }
    50% {
        transform: translateX(0);
        clip-path: inset(0 0 0 0);
        opacity: 1;
    }
    100% {
        transform: translateX(100%);
        clip-path: inset(0 80% 0 0);
        opacity: 0;
    }
}

/* Add staggered animation delay for each tf-tap-letter */
.tf-tap-letter:nth-child(1) { animation-delay: 0s; }
.tf-tap-letter:nth-child(2) { animation-delay: 0.1s; }
.tf-tap-letter:nth-child(3) { animation-delay: 0.2s; }
.tf-tap-letter:nth-child(4) { animation-delay: 0.3s; }
.tf-tap-letter:nth-child(5) { animation-delay: 0.4s; }
.tf-tap-letter:nth-child(6) { animation-delay: 0.5s; }
.tf-tap-letter:nth-child(7) { animation-delay: 0.6s; }
.tf-tap-letter:nth-child(8) { animation-delay: 0.7s; }
.tf-tap-letter:nth-child(9) { animation-delay: 0.8s; }
.tf-tap-letter:nth-child(10) { animation-delay: 0.9s; }
.tf-tap-letter:nth-child(11) { animation-delay: 1s; }
.tf-tap-letter:nth-child(12) { animation-delay: 1.1s; }
.tf-tap-letter:nth-child(13) { animation-delay: 1.2s; }


.tf-card {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: #1f1f23;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: calc(33.33% - 20px);
    margin:16px 0 0 0;
    height: 100%;
}

.tf-card a{
    display: flex;
    align-items: flex-end;
}

.tf-card-image {
    width: 100%;
    height: 80vh;
    object-fit: cover;
    display: block;
    border-radius: 8px;
    /*filter: blur(2px) brightness(0.7);*/
    filter: brightness(0.7);
    transition: transform 0.2s ease-in, filter 0.2s ease-in;
}

.tf-card:hover .tf-card-image {
    transform: scale(1.05);
    /*filter: blur(1.5px) brightness(0.4);*/
    filter: brightness(0.4);
}


.tf-card-content {
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    padding: 0 20px;
    background: transparent;
    color: #fff;
    text-align: start;
}

.tf-card-heading {
    font-size: 36px;
    font-weight: 700;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tf-card-body {
    font-size: 16px;
    font-weight: 400;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    white-space: normal;
}

.tf-card-button {
    padding: 15px 25px;
    background-color: #3431d4;
    color: #fff;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s ease;
    margin-top: 1rem;
    font-family: 'Mulish', sans-serif;
    font-weight: 600;
    width: auto;
    display: inline-block;
    text-align: center;
}


.tf-card-button:hover {
    background-color: #645ff7;
}


.tf-card-video{
    position: relative;
    overflow: hidden;
    margin: 0 15px;
    z-index: 0;
}

.tf-video-wrapper-card {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    width: 100%;
    height: auto;
    padding: 30px 0;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}



/* css style for side bar */

.tf-sidebar {
    position: fixed;
    top: 0;
    right: -220px;
    width: 220px;
    height: 100%;
    background-color: #333338;
    color: #fff;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.3);
    transition: right 0.3s ease;
    z-index: 999;
    border-radius: 10px 0 0 10px;
}

.tf-sidebar-header {
    text-align: center;
    background-color: #494950;
    border-radius: 50px;
    height: 50px;
    width: 50px;
    float: right;
    cursor: pointer;
    transform: translate(-15px, 15px);
    transition: all 0.2s ease-in;
}

.tf-sidebar-header:hover{
    background-color: #29292b;
}

.tf-sidebar-close-btn {
    width: 100%;
    height: 100%;
    background: none;
    border: none;
    color: #fff;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    /*transform: translateY(2px);*/
    cursor: pointer;
}

.tf-sidebar-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: calc(100% - 60px);
    width: 100%;
}

.tf-sidebar-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: left;
}

.tf-sidebar-content li {
    position: relative;
    font-size: 18px;
    transition: all 0.2s ease-in;
}

.tf-sidebar-content li::after {
    content: "";
    position: absolute;
    left: 15px;
    bottom: 0;
    width: calc(100% - 30px);
    border-bottom: 1px solid #5c5c5c;
}

.tf-sidebar-content li:last-child::after {
    border-bottom: none;
}

.tf-sidebar-content li:hover , .tf-sidebar-footer:hover{
    background-color: #2a2a2e;
}

.tf-sidebar-content i{
    font-size: 22px;
    transform: translateY(2px);
    margin-right: 14px;
}


.tf-sidebar-footer {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
    z-index: 1;
    cursor: pointer;
    transition: all 0.2s ease-in;
}

.tf-sidebar-footer a, .tf-sidebar-content li a{
    padding: 25px 30px;
}

.tf-sidebar-footer::before {
    content: "";
    position: absolute;
    left: 15px;
    top: -1px;
    width: calc(100% - 30px);
    border-top: 1px solid #5c5c5c;
    z-index: -1;
}

.tf-sidebar.show {
    right: 0;
}

/* css style for nav bar */
.tf-navbar {
    width: 100%;
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto 20px;
}

.tf-navbar ul {
    list-style-type: none;
    margin: 0;
    padding: 0 0 12.5px 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #b6b6b6a8;
}

.tf-navbar .tf-logo img {
    height: 30px;
}

.tf-home-icon {
    margin-left: auto;
}

.tf-home-icon i {
    font-size: 16px;
    color: #fff;
    margin-bottom: 12px;
}

/* style for markts card */

.tf-am-card {
    background-color: #333338;
    border-radius: 8px;
    overflow: hidden;
    width: calc(33.33% - 15px);
    margin-bottom: 25px;
    color: white;
    display: flex;
    flex-direction: column;
    position: relative;
    min-height: 270px;
    height: 270px;
    max-height: 270px;
}

.tf-am-card a {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
    align-items: center;
    width: 100%;
}

.tf-am-card-image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.2s ease-in;
}

.tf-am-card-image-container img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.2s ease-in;
}

.tf-am-card-heading {
    background-color: rgba(0, 0, 0, 0.6);
    padding: 20px 15px;
    text-align: center;
    width: 100%;
    transition: all 0.2s ease-in;
    position: absolute;
    bottom: 0;
}

.tf-am-card-heading h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: white;
    transition: all 0.2s ease-in-out;
}

.tf-am-card:hover .tf-am-card-image-container img{
    transform: scale(1.08);
}

.tf-am-card:hover .tf-am-card-heading{
    background-color: rgba(0, 0, 0, 0.35);
}

.tf-am-card:hover .tf-am-card-heading h2 {
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.2),
    0 0 10px rgba(255, 255, 255, 0.2),
    0 0 15px rgba(255, 255, 255, 0.2);
}

/* style for Services card */

.tf-as-card {
    background-color: #333338;
    border-radius: 8px;
    overflow: hidden;
    width: calc(50% - 12px);
    margin-bottom: 25px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    transition: all 0.2s ease-in;
    min-height: 290px;
}

.tf-as-card a {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
    width: 100%;
    align-items: stretch;
}

.tf-as-card-image-container {
    flex-grow: 1;
    height: 100%;
    overflow: hidden;
    transition: all 0.2s ease-in;
}

.tf-as-card-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.2s ease-in;
}


.tf-as-card-heading {
    background-color: rgba(0, 0, 0, 0.4);
    padding: 20px 15px;
    text-align: center;
    width: 100%;
    transition: all 0.2s ease-in;
}

.tf-as-card-heading h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    color: white;
    transition: all 0.2s ease-in-out;
}

.tf-as-card:hover .tf-as-card-image-container img {
    transform: scale(1.08);
}

.tf-as-card:hover .tf-as-card-heading {
    background-color: rgba(0, 0, 0, 0.35);
}

.tf-as-card:hover .tf-as-card-heading h2 {
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.2),
    0 0 10px rgba(255, 255, 255, 0.2),
    0 0 15px rgba(255, 255, 255, 0.2);
}

/* css style for single markets page */

.tf-sm-wrapper {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
    transition: all 0.5s ease;
    height: calc(100vh - 270px);
}

.tf-sm-wrapper .vst-update_markers{
    height: calc(100vh - 260px);
}

.tf-sm-card {
    position: relative;
    background: rgba(255, 255, 255, 0.1);
    width: 100%;
    min-width: 502px;
    display: inline-block;
    overflow: hidden;
    border-radius: 8px;
    max-width: 1366px;
    transition: all 0.5s ease;
    /*max-height: 750px;*/
    /*min-height: 750px;*/
    height: 100%;
}

.tf-sm-card-compatibility {
    display: none;
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {

    .tf-card-image{
        object-position: 0 -350px;
    }

    .tf-sm-wrapper {
        max-height: 540px;
    }

    .tf-sm-card {
        background-color: #181818;
    }

    .tf-sm-card-compatibility {
        display: block;
        width: 100%;
        height: 100%;
        background-color: #181818;
        text-align: center;
        position: relative;
        z-index: 11;
    }

    .tf-sm-card-compatibility-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        color: whitesmoke;
    }

    .tf-sm-card-compatibility-container__icon {
        font-size: 4rem;
    }

    .tf-sm-card-compatibility-container__text {
        font-size: 16px;
        width: 453px;
    }

    .tf-zoombar {
        display: none !important;
    }

}

.tf-sm-card img {
    max-width: 100%;
    object-fit: contain;
    height: 100%;
    width: 100%;
}

.tf-back-button {
    position: absolute;
    display: flex;
    top: 10px;
    left: 10px;
    background-color: rgba(255, 255, 255, 0.2);;
    color: white;
    border: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    width: 50px;
    height: 50px;
    font-size: 20px;
    transition: background-color 0.2s ease;
    z-index: 1002;
}

.tf-back-button.tf-fancyBtn {
    background-color: #0c0c11; /* Change to desired active color */
    color: white; /* Change text color if needed */
}

.tf-back-button:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.tf-zoombar {
    display: flex;
    flex-direction: column;
    background-color: transparent;
    align-items: center;
    margin-left: 25px;
}

.tf-zoombar a {
    color: white;
    padding: 16px 12px;
    text-align: center;
    text-decoration: none;
    border: 1px solid #707070;
    font-size: 14px;
    transition: background-color 0.2s ease;
}

.tf-zoom-in{
    border-radius: 50px 50px 0 0;
    border-bottom: none;
}
.tf-zoom-out{
    border-radius: 0 0 50px 50px;
}

.tf-zoombar a:hover {
    background-color: #494950;
    color: white !important;
}

.product-details {
    color: white;
    width: 90%;
    max-width: 1336px;
    margin-top: 20px;
}

.product-details h1 {
    font-size: 24px;
    margin-bottom: 10px;
}

.product-details p {
    font-size: 16px;
    line-height: 1.5;
    font-weight: 100;
}

.image-markers {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.tf-sm-card img,
.tf-sm-card .image-markers {
    transition: all 0.2s ease-in-out;
}


.marker-wrapper {
    position: absolute;
    transform: translate(-50%, -50%);
    /*transition: all 1s ease;*/
    transition:height 1s ease-in-out, width 1s ease-in-out;
}

.marker {
    position: absolute;
    width: 35px;
    height: 35px;
    background-color: #3431d4;
    border: 4px solid #0c0c11;
    border-radius: 50%;
    z-index: 10;
    cursor: pointer;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.3s ease-in,height 0.3s ease-in;
}

.marker-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    opacity: 0;
    transition: all 0.3s ease-in;
}
.marker-description {
    position: absolute;
    /*background-color: transparent;*/
    /*padding: 3px 5px;*/
    font-size: 16px;
    color: white;
    border-radius: 18px;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9;
    transition: all 0.3s ease-in;
    width: fit-content;
    display: flex;
    background-color: var(--vs-trade-fair-primary-color);
    padding: 7px 15px;
    font-weight: 600;
    white-space: nowrap;
}

a.marker-description:hover,a.modal-product-description:hover{
    color: #d7d7d7 !important;
}

.marker-lines {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    transition: all 0.3s ease-in;
}

.marker-line-vertical, .marker-line-horizontal {
    position: absolute;
    background-color: white;
}

.marker-line-vertical.black-lines, .marker-line-horizontal.black-lines{
    background-color: black;
}

/* Vertical line */
.marker-line-vertical {
    width: 2px;
    top: 0;
    height: 100%;
    left: 50%;
    transform: translateX(-50%);
}

/* Horizontal line */
.marker-line-horizontal {
    height: 2px;
    left: 0;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
}

/*!* Example positions for the description, these are set by JS dynamically *!*/
.marker-description.description-top-left {
    top: -105px;
    left: -160px;
    justify-content: end;
}

.marker-description.description-top-right {
    top: -105px;
    left: 150px;
    justify-content: start;
}

.marker-description.description-bottom-left {
    top: 90px;
    left: -160px;
    justify-content: end;
}

.marker-description.description-bottom-right {
    top: 90px;
    left: 150px;
    justify-content: start;
}

/*.marker-line-horizontal::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 8px; !* Size of the dot *!*/
/*    height: 8px; !* Size of the dot *!*/
/*    background-color: #ffffff; !* Example dot color *!*/
/*    border-radius: 50%;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*}*/

.description-top-left .marker-line-horizontal::after,
.description-bottom-left .marker-line-horizontal::after {
    left: 0;
}

.description-top-right .marker-line-horizontal::after,
.description-bottom-right .marker-line-horizontal::after {
    right: 0;
}

.maker-35{
    width: 35px;
    height: 35px;
}
.marker-95 {
    width: 95px;
    height: 95px;
}
.marker-150 {
    width: 150px;
    height: 150px;
    transition: width 0.6s ease, height 0.6s ease;
}

/* fancy box */
/*.tf-fancy-box .tf-fancy-marker{*/
/*    position: absolute;*/
/*    z-index: 1000;*/
/*    !*top: 0;*!*/
/*    !*left: 0;*!*/
/*    width: 100%;*/
/*    !*height: calc(100vh - 170px);*!*/
/*    height: 100%;*/
/*    overflow: hidden;*/
/*    !*transition: all 1s ease;*!*/
/*    transition:width 1s ease, height 1s ease, border-radius 2s cubic-bezier(0.85, 0, 0.15, 1);*/
/*    border-radius: 0;*/
/*    transform-origin: center;*/
/*}*/

.tf-fancy-box .tf-fancy-marker{
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: width 0.2s ease, height 0.2s ease, border-radius 0.2s linear;
    border-radius: 0;
    border: 0;
    transform-origin: center;
}

.tf-fancy-box .tf-fancy-marker .marker-image{
    border-radius: 0;
}

/* Modal styles */

.tf-modal {
    position: absolute;
    left: 0;
    top: -2px;
    width: 100%;
    /*height: calc(100vh - 170px);*/
    height: 100%;
    overflow: hidden;
    transition: opacity 1s ease;
    opacity: 0;
    z-index: -1;
    transform: scale(1);
}

.tf-modal-container{
    width: 100%;
    height: 100%;
}

.tf-modal-content {
    margin: 0 auto;
    border-radius: 8px;
    position: relative;
    display: flex;
    width: 100%;
    min-width: 502px;
    overflow: hidden;
    max-width: 1366px;
    height: 100%;
    justify-content: center;
    align-items: center;
    padding: 12%;
}

.tf-modal-wrapper {
    position: absolute;
    transform: translate(-50%, -50%);
}

.modal-product-description{
    position: absolute;
    color: #fff;
    width: fit-content;
    display: flex;
    /*background-color: var(--vs-trade-fair-primary-color);*/
    padding: 7px 15px;
    font-weight: 700;
    white-space: nowrap;
    /*border-radius: 18px;*/
}

.modal-product-description.description-top-left {
    top: -105px;
    left: -240px;
}

.modal-product-description.description-top-right {
    top: -105px;
    left: 120px;
}

.modal-product-description.description-bottom-left {
    top: 90px;
    left: -240px;
}

.modal-product-description.description-bottom-right {
    top: 90px;
    left: 120px;
}

.tf-modal-content .marker-line-horizontal::after {
    content: '';
    position: absolute;
    width: 15px; /* Size of the dot */
    height: 15px; /* Size of the dot */
    background-color: #ffffff; /* Example dot color */
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
}

.tf-modal-content .marker-line-horizontal.black-lines::after {
    background-color: black;
}

.tf-modal-content .marker-line-vertical::after {
    content: '';
    position: absolute;
    width: 10px; /* Size of the dot */
    height: 10px; /* Size of the dot */
    background-color: #ffffff; /* Example dot color */
    border-radius: 50%;
    top: 50%;
    transform: translate(-39%, -75%);
}

.tf-modal-content .marker-line-vertical.black-lines::after {
    background-color: black;
}



.description-top-left .marker-line-horizontal::after,
.description-bottom-left .marker-line-horizontal::after {
    left: 0;
}

.description-top-right .marker-line-horizontal::after,
.description-bottom-right .marker-line-horizontal::after {
    right: 0;
}

.description-top-left .marker-line-vertical::after,
.description-top-right .marker-line-vertical::after {
    top: 100%;
}

.description-bottom-left .marker-line-vertical::after,
.description-bottom-right .marker-line-vertical::after {
    top: 0;
}
.tf-sm-card #product-image{
    object-fit: cover;
}
#product-image, #image-markers {
    transition: transform 0.3s ease;
}

#modal-product-details {
    width: 100%;
    height: 100%;
    position: relative;
}

/* #modal-product-image, #modal-product-details{
    opacity: 0;
} */
@media (max-width: 1024px) and (orientation: portrait) {
    .tf-card {
        width: 100%;
        margin-bottom: 12.5px;
    }

    .row-home {
        flex-direction: column;
        flex-wrap: nowrap;
    }
}


@media (max-width: 767px) {
    .tf-card {
        width: calc(100%);
    }
    .tf-card-heading {
        font-size: 32px;
    }

    .tf-as-card-heading h2{
        font-size: 16px;
    }

    .tf-am-card-heading h2 {
        font-size: 16px;
    }
    .mobile-message {
        display: flex;
        position: absolute;
        z-index: 9999;
        background: rgb(0, 0, 0, 0.9);
        height: 100%;
        color: #d8d802;
        text-align: center;
        align-items: center;
        justify-content: center;
        padding: 35px;
        backdrop-filter: blur(10px);
        width: 100%;
    }
}

@media (min-width: 768px) {
    .col-6, .col-4,.col-3  {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .mobile-message {
        display: none;
    }

}

@media (min-width: 820px) {

}

@media (min-width: 992px) {

}

@media (min-width: 1024px) {

}

@media (min-width: 1194px) {

}

@media (min-width: 1366px) {

}

@media (min-width: 1367px) {

}


 /*
Theme Name: Variosystems
Theme URI: https://variosystems.com/
Author: DoMedia
Author URI: https://domedia.lk
Description: DoMedia Templates brings your site to life.
Version: 3.0
Last Update: 10th May 2023
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ---------------------------------
    Normalize 
   --------------------------------- */
:root {
    /* --fs-7xl: 120px; */
    --fs-7xl: 106px;
    --fs-6xl: 96px;
    --fs-5xl: 65px;
    /* --fs-4xl: 64px; */
    --fs-4xl: 52px;
    /* --fs-3xl: 48px; */
    --fs-3xl: 40px;
    --fs-2xl: 34px;
    --fs-xl: 29px;
    --fs-lg: 24px;
    --fs-md: 17px;
    --fs-sm: 15px;
    --fs-xs: 12px;

    --lh-xs: 17px;
    --lh-sm: 26px;
    --lh-md-dense: 24px;
    --lh-md: 26px;
    --lh-lg: 30px;
    --lh-xl: 37px;
    --lh-2xl: 42px;
    /* --lh-5xl: 76px; */
    --lh-6xl: 102px;
    /* --lh-7xl: 130px; */
    --lh-7xl: 115px;
    --lh-5xl: 69px;
    --lh-4xl: 60px;
    --lh-3xl: 52px;

    --spc-4xl: 96px;
    --spc-3xl: 64px;
    --spc-2xl: 48px;
    --spc-2xl-neg: -48px;
    --spc-xl: 32px;
    --spc-xl-neg: -32px;
    --spc-lg: 24px;
    --spc-lg-neg: -24px;
    --spc-md: 16px;
    --spc-md-neg: -16px;
    --spc-sm: 8px;
    --spc-xs: 4px;
    --spc-2xs: 2px;

    --img-zoom-half: 1.05;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: 100%;
    --wp--preset--font-size--normal: 16px;
    --wp--preset--font-size--huge: 42px;
    --wp--preset--aspect-ratio--square: 1;
    --wp--preset--aspect-ratio--4-3: 4/3;
    --wp--preset--aspect-ratio--3-4: 3/4;
    --wp--preset--aspect-ratio--3-2: 3/2;
    --wp--preset--aspect-ratio--2-3: 2/3;
    --wp--preset--aspect-ratio--16-9: 16/9;
    --wp--preset--aspect-ratio--9-16: 9/16;
    --wp--preset--color--black: #000000;
    --wp--preset--color--cyan-bluish-gray: #abb8c3;
    --wp--preset--color--white: #ffffff;
    --wp--preset--color--pale-pink: #f78da7;
    --wp--preset--color--vivid-red: #cf2e2e;
    --wp--preset--color--luminous-vivid-orange: #ff6900;
    --wp--preset--color--luminous-vivid-amber: #fcb900;
    --wp--preset--color--light-green-cyan: #7bdcb5;
    --wp--preset--color--vivid-green-cyan: #00d084;
    --wp--preset--color--pale-cyan-blue: #8ed1fc;
    --wp--preset--color--vivid-cyan-blue: #0693e3;
    --wp--preset--color--vivid-purple: #9b51e0;
    --wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%);
    --wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg, rgb(122, 220, 180) 0%, rgb(0, 208, 130) 100%);
    --wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg, rgba(252, 185, 0, 1) 0%, rgba(255, 105, 0, 1) 100%);
    --wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg, rgba(255, 105, 0, 1) 0%, rgb(207, 46, 46) 100%);
    --wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg, rgb(238, 238, 238) 0%, rgb(169, 184, 195) 100%);
    --wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 20%, rgb(207, 42, 186) 40%, rgb(238, 44, 130) 60%, rgb(251, 105, 98) 80%, rgb(254, 248, 76) 100%);
    --wp--preset--gradient--blush-light-purple: linear-gradient(135deg, rgb(255, 206, 236) 0%, rgb(152, 150, 240) 100%);
    --wp--preset--gradient--blush-bordeaux: linear-gradient(135deg, rgb(254, 205, 165) 0%, rgb(254, 45, 45) 50%, rgb(107, 0, 62) 100%);
    --wp--preset--gradient--luminous-dusk: linear-gradient(135deg, rgb(255, 203, 112) 0%, rgb(199, 81, 192) 50%, rgb(65, 88, 208) 100%);
    --wp--preset--gradient--pale-ocean: linear-gradient(135deg, rgb(255, 245, 203) 0%, rgb(182, 227, 212) 50%, rgb(51, 167, 181) 100%);
    --wp--preset--gradient--electric-grass: linear-gradient(135deg, rgb(202, 248, 128) 0%, rgb(113, 206, 126) 100%);
    --wp--preset--gradient--midnight: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
    --wp--preset--font-size--small: 13px;
    --wp--preset--font-size--medium: 20px;
    --wp--preset--font-size--large: 36px;
    --wp--preset--font-size--x-large: 42px;
    --wp--preset--spacing--20: 0.44rem;
    --wp--preset--spacing--30: 0.67rem;
    --wp--preset--spacing--40: 1rem;
    --wp--preset--spacing--50: 1.5rem;
    --wp--preset--spacing--60: 2.25rem;
    --wp--preset--spacing--70: 3.38rem;
    --wp--preset--spacing--80: 5.06rem;
    --wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
    --wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
    --wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);
    --wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);
    --wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);
    --fs-7xl: 106px;
    --fs-6xl: 96px;
    --fs-5xl: 65px;
    --fs-4xl: 52px;
    --fs-3xl: 40px;
    --fs-2xl: 34px;
    --fs-xl: 29px;
    --fs-lg: 24px;
    --fs-md: 17px;
    --fs-sm: 15px;
    --fs-xs: 12px;
    --lh-xs: 17px;
    --lh-sm: 26px;
    --lh-md-dense: 24px;
    --lh-md: 26px;
    --lh-lg: 30px;
    --lh-xl: 37px;
    --lh-2xl: 42px;
    --lh-6xl: 102px;
    --lh-7xl: 115px;
    --lh-5xl: 69px;
    --lh-4xl: 60px;
    --lh-3xl: 52px;
    --spc-4xl: 96px;
    --spc-3xl: 64px;
    --spc-2xl: 48px;
    --spc-2xl-neg: -48px;
    --spc-xl: 32px;
    --spc-xl-neg: -32px;
    --spc-lg: 24px;
    --spc-lg-neg: -24px;
    --spc-md: 16px;
    --spc-md-neg: -16px;
    --spc-sm: 8px;
    --spc-xs: 4px;
    --spc-2xs: 2px;
    --img-zoom-half: 1.05;
    --bagels-container-size: 1350px;
    --bagels-pg-margin: calc((1920px - 1350px + 15px) / 2);
    --bagels-pg-margin-cont-negated: calc(((100vw - 1350px + 15px) / 2 + 6px) * -1);
    --bagels-pg-margin-cont: calc(((1920px - 1350px + 15px) / 2) + 6px);
    --bagels-dark: #0c0c11;
    --bagels-light: #ffffff;
    --bagels-text-danger: #f4524d;
    --bagels-transparent: rgba(0, 0, 0, 0);
    --bagels-neutral_50: #f5f5f6;
    --bagels-neutral_100: #e3e3e5;
    --bagels-neutral_200: #c7c7cb;
    --bagels-neutral_300: #acacb2;
    --bagels-neutral_400: #929298;
    --bagels-neutral_500: #797980;
    --bagels-neutral_600: #606067;
    --bagels-neutral_700: #494950;
    --bagels-neutral_800: #333338;
    --bagels-neutral_900: #1f1f23;
    --bagels-bright_color_a_100: #e2e2fa;
    --bagels-bright_color_a_200: #b7b6f4;
    --bagels-bright_color_a_300: #8c8bed;
    --bagels-bright_color_a_400: #645ff7;
    --bagels-bright_color_a_500: #3431d4;
    --bagels-bright_color_a_600: #1c1a87;
    --bagels-bright_color_a_700: #08073f;
    --bagels-bright_color_b: #eb4752;
    --bagels-bright_color_c: #ff7448;
    line-height: 1.42857143;
    font-family: "Mulish", sans-serif;
    font-size: var(--fs-sm);
    font-weight: 400;
    color: var(--bagels-light);
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    flex-direction: column;
    min-height: calc(100vh - 80px);
    background-color: #0c0c11;
}

/* h2 line height */
.h2-l-h {
    line-height: 52px;
}

.vs-tf-reverse-direction {
    display: flex;
    flex-direction: row;
    align-items: center !important;
}

.vs-tf-sub-page-reverse-direction {
    display: flex;
    flex-direction: row;
    align-items: center !important;
}

.vs-tf-sub-page-mt-c1 {
    margin-top: 0px;
}

.vs-tf-iconic-img{
    margin-top: -135px;
}

.vs-tf-mb-0-pb-0{
    margin-bottom: 0px !important;
}

.b-h-auto-md {
    border-radius: 8px; 
}
@media (min-width: 768px) {
    :root {
        --bagels-container-size: 750px;
        --bagels-pg-margin: calc(((100vw - 750px + 15px) / 2) + 6px);
        --bagels-pg-margin-cont-negated: calc(((100vw - 720px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((100vw - 720px + 15px) / 2) + 6px);
    }
}

@media (min-width: 992px) {
    :root {
        --bagels-container-size: 970px;
        --bagels-pg-margin: calc((100vw - 970px + 15px) / 2 + 6px);
        --bagels-pg-margin-cont-negated: calc(((100vw - 940px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((100vw - 940px + 15px) / 2) + 6px);
    }
}

@media (min-width: 1200px) {
    :root {
        --bagels-container-size: 1170px;
        --bagels-pg-margin: calc((100vw - 1170px + 15px) / 2);
        --bagels-pg-margin-cont-negated: calc(((100vw - 1170px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((100vw - 1170px + 15px) / 2) + 6px);
    }
}

@media (min-width: 1440px) {
    :root {
        --bagels-container-size: 1280px;
        --bagels-pg-margin: calc((100vw - 1280px + 15px) / 2);
        --bagels-pg-margin-cont-negated: calc(((100vw - 1280px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((100vw - 1280px + 15px) / 2) + 6px);
    }
}

@media (min-width: 1600px) {
    :root {
        --bagels-container-size: 1350px;
        --bagels-pg-margin: calc((100vw - 1350px + 15px) / 2);
        --bagels-pg-margin-cont-negated: calc(((100vw - 1350px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((100vw - 1350px + 15px) / 2) + 6px);
    }
}

@media (min-width: 1920px) {
    :root {
        --bagels-pg-margin: calc((1920px - 1350px + 15px) / 2);
        --bagels-pg-margin-cont-negated: calc(((100vw - 1350px + 15px) / 2 + 6px) * -1);

        /* If container padding is taken in to consideration */
        --bagels-pg-margin-cont: calc(((1920px - 1350px + 15px) / 2) + 6px);
    }
}

@media (max-width: 1199px) {
    :root {
        --fs-7xl: 88px;
        --fs-xl: 27px;

        --lh-xl: 36px;
        --lh-7xl: 99px;
    }
}

@media (min-width: 500px) and (max-width: 991px) {
    :root {
        --lh-5xl: 59px;
        --fs-5xl: 55px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    :root {
        --fs-5xl: 55px;
        --lh-5xl: 60px;
    }
}

@media (max-width: 991px) {
    :root {
        --fs-7xl: 93px;
        --fs-4xl: 48px;
        --fs-3xl: 36px;
        --lh-7xl: 107px;
        --lh-4xl: 55px;
    }

    .h2-l-h {
        line-height: 44px;
    }

    .vs-tf-reverse-direction {
        display: flex;
        flex-direction: column-reverse;
        align-items: start !important;
    }

    .vs-tf-sub-page-reverse-direction {
        display: flex;
        flex-direction: column-reverse !important;
        align-items: end !important;
    }


    .vs-tf-sub-page-mt-c1 {
        margin-top: 230px !important;
    }

    .vs-tf-iconic-img{
        margin-top: -125px;
    }

    .vs-tf-mb-0-pb-0{
        margin-bottom: 0px !important;
        padding-bottom: 0px !important;
    }
}

@media (max-width: 499px) {
    :root {
        /* --fs-7xl: 44px; */
        --fs-7xl: 52px;
        --fs-6xl: 42px;
        --fs-5xl: 40px;
        --fs-4xl: 36px;
        --fs-3xl: 31px;
        --fs-2xl: 28px;
        --fs-xl: 24px;
        --fs-lg: 20px;
        /* --fs-md: 18px; */
        --fs-md: 16px;
        --fs-sm: 14px;
        --fs-xs: 12px;
        --fs-3xl-mobile: 28px;
        --fs-xl-mobile: 24px;
        --fs-sm-mobile: 16px;

        --lh-7xl: 57px;
        --lh-6xl: 48px;
        --lh-5xl: 47px;
        --lh-4xl: 42px;
        --lh-3xl: 40px;
        --lh-2xl: 36px;
        --lh-xl: 30px;
        --lh-lg: 27px;
        --lh-md: 26px;
        --lh-3xl-mobile: 36px;
        --lh-xl-mobile: 30px;
        --lh-md-dense: 22px;

        --b-w-100-mobile: 100%;
    }
}

@media (max-width: 420px) {
    :root {
        --fs-5xl: 36px;
        --fs-4xl: 32px;
        /* --fs-md: 15px; */
        --fs-md: 16px;
        --lh-5xl: 45px;
        --lh-md: 24px;
    }
}




.light,
.light a {
    color: var(--bagels-light);
}

.light-grey,
.light-grey a {
    color: var(--bagels-neutral_400);
}

.dark,
.dark a {
    color: var(--bagels-dark);
}

.dark-grey,
.dark-grey a {
    color: var(--bagels-neutral_600);
}

.light-bg {
    background-color: var(--bagels-light);
}

.light-grey-bg {
    background-color: var(--bagels-neutral_400);
}

.dark-bg {
    background-color: var(--bagels-dark);
}

.dark-grey-bg {
    background-color: var(--bagels-neutral_600);
}




a,
.bagels-pseudo-theme-button .bptb-1 {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    -webkit-text-decoration-skip: objects;
}

a {
    color: var(--bagels-dark);
    text-decoration: none;
}

.bagels-dark-theme a {
    /* color: var(--bagels-light); */
}

a:active,
a:hover,
a:focus {
    outline-width: 0;
    text-decoration: none;
    outline: 0;
    cursor: pointer;
}

a:hover {
    color: var(--bagels-bright_color_a_600);
}

a:focus {
    color: var(--bagels-dark);
}

.light a:focus {
    color: var(--bagels-neutral_400);
}

.bagels-dark-theme a:focus {
    /* color: var(--bagels-light); */
}

a:focus-visible {
    outline: 0;
}


p {
    /* line-height: 1.5; */
    line-height: 26px;
    font-size: var(--fs-sm);
    -webkit-font-smoothing: antialiased;
}

abbr[title] {
    border-bottom: 1px #767676 dotted;
    text-decoration: none;
}

ul>li,
ol>li {
    margin-bottom: 3px;
}

ul>li:last-child,
ol>li:last-child {
    margin-bottom: 0;
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

dfn {
    font-style: italic;
}

mark {
    background-color: #eee;
    color: #222;
}

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

audio,
video {
    display: inline-block;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

img {
    border-style: none;
    max-width: 100%;
    height: auto;
}

svg:not(:root) {
    overflow: hidden;
}

button {
    border: 1px solid;
}

button:focus-visible {
    outline: none;
}

button,
input,
optgroup,
select,
textarea {
    font-family: "Mulish", sans-serif;
    font-size: 100%;
    margin: 0;
}

button,
input {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

button,
html [type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

fieldset {
    border: 1px solid #bbb;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

legend {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}

progress {
    display: inline-block;
    vertical-align: baseline;
}

textarea {
    overflow: auto;
}

input[type="text"],
input[type="email"],
input[type="date"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="file"],
select,
textarea,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="date"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="file"]:focus,
select:focus,
textarea:focus,
input[type="text"]:focus-within,
input[type="email"]:focus-within,
input[type="date"]:focus-within,
input[type="tel"]:focus-within,
input[type="url"]:focus-within,
input[type="number"]:focus-within,
input[type="file"]:focus-within,
select:focus-within,
textarea:focus-within,
input[type="text"]:focus-visible,
input[type="email"]:focus-visible,
input[type="date"]:focus-visible,
input[type="tel"]:focus-visible,
input[type="url"]:focus-visible,
input[type="number"]:focus-visible,
input[type="file"]:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 0;
    border: 1px solid;
}

input::placeholder,
textarea::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #CECECE;
    opacity: 1;
    /* Firefox */
    font-size: var(--fs-sm);
    color: var(--bagels-neutral_400);
    font-weight: 400;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #CECECE;
    font-size: var(--fs-sm);
    color: var(--bagels-neutral_400);
    font-weight: 400;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #CECECE;
    font-size: var(--fs-sm);
    color: var(--bagels-neutral_400);
    font-weight: 400;
}

[type="checkbox"],
[type="radio"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

details,
menu {
    display: block;
}

summary {
    display: list-item;
}

canvas {
    display: inline-block;
}

template {
    display: none;
}

[hidden] {
    display: none;
}

/* ---------------------------------
    Framework Styles 
   --------------------------------- */

/*Extended container*/
/* @media (min-width: 1150px) and (max-width: 1199px){
        .extended-container{
            margin-left: -50px;
            margin-right: -50px;
        }
    }

    @media (min-width: 1366px){
        .extended-container{
            margin-left: -60px;
            margin-right: -60px;
        }
    }

    @media (min-width: 1440px){
        .extended-container{
            margin-left: -70px;
            margin-right: -70px;
        }
    }

    @media (min-width: 1600px){
        .extended-container{
            margin-left: -160px;
            margin-right: -160px;
        }
    }

    @media (min-width: 1920px){
        .extended-container{
            margin-left: -230px;
            margin-right: -230px;
        }
    }

    @media (max-width: 767px){
        .extended-container{
            padding-left: 6px;
            padding-right: 6px;
        }
    } */

.bagels-container {
    max-width: 100%;
    width: 100%;
}

@media (min-width: 768px) {
    .bagels-container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .bagels-container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .bagels-container {
        width: 1170px;
    }
}

/* @media (min-width: 1024px){
        .bagels-container {
            width: 1000px;
        }
    } */

@media (min-width: 1440px) {
    .bagels-container {
        width: 1280px;
    }
}

@media (min-width: 1600px) {
    .bagels-container {
        width: 1350px;
    }
}

@media (min-width: 500px) and (max-width: 767px) {
    .bagels-container {
        width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media (min-width: 1920px) {
    /* .bagels-container{
            margin-left: -230px;
            margin-right: -230px;
        } */
}

/*Extended container*/

/* ---------------------------------
    Helpers 
   --------------------------------- */
.tc-light,
.tc-light * {
    color: var(--bagels-light);
}

.tc-dark,
.tc-dark * {
    color: var(--bagels-dark);
}

.tc-neutral_50,
.tc-neutral_50 * {
    color: var(--bagels-neutral_50);
}

.tc-neutral_100,
.tc-neutral_100 * {
    color: var(--bagels-neutral_100);
}

.tc-neutral_200,
.tc-neutral_200 * {
    color: var(--bagels-neutral_200);
}

.tc-neutral_300,
.tc-neutral_300 * {
    color: var(--bagels-neutral_300);
}

.tc-neutral_400,
.tc-neutral_400 * {
    color: var(--bagels-neutral_400);
}

.tc-neutral_500,
.tc-neutral_500 * {
    color: var(--bagels-neutral_500);
}

.tc-neutral_600,
.tc-neutral_600 * {
    color: var(--bagels-neutral_600);
}

.tc-neutral_700,
.tc-neutral_700 * {
    color: var(--bagels-neutral_700);
}

.tc-neutral_800,
.tc-neutral_800 * {
    color: var(--bagels-neutral_800);
}

.tc-neutral_900,
.tc-neutral_900 * {
    color: var(--bagels-neutral_900);
}

.bright-color-b {
    color: var(--bagels-bright_color_b);
}

.bagels-elem-hide {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 0 !important;
    height: 0 !important;
}

.b-pos-relative {
    position: relative;
}

.b-pos-absolute {
    position: absolute;
}

.b-overflow-hidden {
    overflow: hidden;
}

.b-trans-p-2 {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.hover-scale-s1:focus {
    transform: scale(1.05);
}

.bg-sprite-icon-image {
    filter: invert(4%) sepia(2%) saturate(6786%) hue-rotate(202deg) brightness(97%) contrast(98%);
}

.bg-sprite-icon-image.icon-light {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(71deg) brightness(101%) contrast(106%);
}

@supports (display: -webkit-box) and (-webkit-line-clamp: 2) and (-webkit-box-orient: vertical) {
    .b-line-clamp-default {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

@supports (-webkit-line-clamp: 3) {
    .b-line-clamp-3 {
        -webkit-line-clamp: 3;
    }
}

@supports (-webkit-line-clamp: 4) {
    .b-line-clamp-4 {
        -webkit-line-clamp: 4;
    }
}

@supports (-webkit-line-clamp: 5) {
    .b-line-clamp-5 {
        -webkit-line-clamp: 5;
    }
}

.b-cover-img-wrapper {
    position: relative;
    overflow: hidden;
}

.b-cover-img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
    z-index: 0;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

img.b-pos-center {
    object-position: center;
}

img.b-pos-left {
    object-position: left;
}

img.b-pos-top {
    object-position: top;
}

img.b-pos-bottom {
    object-position: bottom;
}

img.b-pos-right {
    object-position: right;
}

.b-device-height {
    min-height: calc(100vh);
}

.z-index_0 {
    z-index: 0;
}

.z-index_1 {
    z-index: 1;
}

.z-index_2 {
    z-index: 2;
}

.z-index_3 {
    z-index: 3;
}

.h-p-ul-m-0 ul,
.h-p-ul-m-0 p,
.h-p-ul-m-0 h1,
.h-p-ul-m-0 h2,
.h-p-ul-m-0 h3,
.h-p-ul-m-0 h4,
.h-p-ul-m-0 h5,
.h-p-ul-m-0 h6 {
    margin: 0;
    padding: 0;
}

.txt-center {
    text-align: center;
}

.txt-danger {
    color: var(--bagels-text-danger);
}

.disp-inline-block {
    display: inline-block;
}

.bagels-block {
    display: block;
}

.bagels-disp-none {
    display: none;
}

.bagels-disp-none-imp {
    display: none !important;
}

.flex-parent {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.flex-justify-space-between {
    justify-content: space-between;
}

.flex-justify-center {
    justify-content: center;
}

.flex-justify-flex-end {
    justify-content: flex-end;
}

.flex-justify-flex-start {
    justify-content: flex-start;
}

.flex-align-flex-start {
    align-items: flex-start;
}

.flex-align-flex-end {
    align-items: flex-end;
}

.flex-align-center {
    align-items: center;
}

.flex-wrap-wrap {
    flex-wrap: wrap;
}

.flex-direction-col {
    flex-direction: column;
}


.bagels-visible-xxs {
    display: none;
}

.bagels-visible-smm {
    display: none;
}

.bagels-smm-md-visible {
    display: none;
}

.bt-blurr-offset-scale-up {
    transform: scale(1.01);
}


.mt-0 {
    margin-top: 0;
}

.mb-0 {
    margin-bottom: 0;
}

.ml-0 {
    margin-left: 0;
}

.mr-0 {
    margin-right: 0;
}

.mt-3xl {
    margin-top: var(--spc-3xl);
}

.mr-3xl {
    margin-right: var(--spc-3xl);
}

.mb-3xl {
    margin-bottom: var(--spc-3xl);
}

.ml-3xl {
    margin-left: var(--spc-3xl);
}

.mt-2xl {
    margin-top: var(--spc-2xl);
}

.mr-2xl {
    margin-right: var(--spc-2xl);
}

.mb-2xl {
    margin-bottom: var(--spc-2xl);
}

.ml-2xl {
    margin-left: var(--spc-2xl);
}

.mt-xl {
    margin-top: var(--spc-xl);
}

.mr-xl {
    margin-right: var(--spc-xl);
}

.mb-xl {
    margin-bottom: var(--spc-xl);
}

.mb-xl-neg {
    margin-bottom: var(--spc-xl-neg);
}

.ml-xl {
    margin-left: var(--spc-xl);
}

.mt-lg {
    margin-top: var(--spc-lg);
}

.mr-lg {
    margin-right: var(--spc-lg);
}

.mb-lg {
    margin-bottom: var(--spc-lg);
}

.ml-lg {
    margin-left: var(--spc-lg);
}

.mt-md {
    margin-top: var(--spc-md);
}

.mr-md {
    margin-right: var(--spc-md);
}

.mb-md {
    margin-bottom: var(--spc-md);
}

.mb-md-neg {
    margin-bottom: var(--spc-md-neg);
}

.ml-md {
    margin-left: var(--spc-md);
}

.mt-sm {
    margin-top: var(--spc-sm);
}

.mr-sm {
    margin-right: var(--spc-sm);
}

.mb-sm {
    margin-bottom: var(--spc-sm);
}

.ml-sm {
    margin-left: var(--spc-sm);
}

.mt-xs {
    margin-top: var(--spc-xs);
}

.mr-xs {
    margin-right: var(--spc-xs);
}

.mb-xs {
    margin-bottom: var(--spc-xs);
}

.ml-xs {
    margin-left: var(--spc-xs);
}

.mt-2xs {
    margin-top: var(--spc-2xs);
}

.mr-2xs {
    margin-right: var(--spc-2xs);
}

.mb-2xs {
    margin-bottom: var(--spc-2xs);
}

.ml-2xs {
    margin-left: var(--spc-2xs);
}


.pb-8 {
    padding-bottom: 8px;
}

.pl-32 {
    padding-left: var(--spc-xl);
}

.pl-64 {
    padding-left: var(--spc-3xl)
}

.pt-md {
    padding-top: var(--spc-md);
}

.pb-md {
    padding-bottom: var(--spc-md);
}


.fs-7xl {
    font-size: var(--fs-7xl);
    line-height: var(--lh-7xl)
}

.fs-6xl {
    font-size: var(--fs-6xl);
    line-height: var(--lh-6xl)
}

.fs-5xl {
    font-size: var(--fs-5xl);
    line-height: var(--lh-5xl)
}

.fs-4xl {
    font-size: var(--fs-4xl);
    line-height: var(--lh-4xl)
}

.fs-3xl {
    font-size: var(--fs-3xl);
    line-height: var(--lh-3xl)
}

.fs-2xl {
    font-size: var(--fs-2xl);
    line-height: var(--lh-2xl)
}

.fs-xl {
    font-size: var(--fs-xl);
    line-height: var(--lh-xl)
}

.fs-lg {
    font-size: var(--fs-lg);
    line-height: var(--lh-lg)
}

.fs-md {
    font-size: var(--fs-md);
    line-height: var(--lh-md)
}

.fs-sm {
    font-size: var(--fs-sm);
    line-height: var(--lh-sm)
}

.fs-xs {
    font-size: var(--fs-xs);
    line-height: var(--lh-xs)
}


.lh-xs {
    line-height: var(--lh-xs);
}

.lh-sm {
    line-height: var(--lh-sm);
}

.lh-md-dense {
    line-height: var(--lh-md-dense);
}

.lh-md {
    line-height: var(--lh-md);
}

.lh-lg {
    line-height: var(--lh-lg);
}

.lh-xl {
    line-height: var(--lh-xl);
}

.lh-2xl {
    line-height: var(--lh-2xl);
}

/* .lh-5xl{ line-height: var(--lh-5xl); } */
.lh-5xl {
    line-height: var(--lh-5xl);
}

.lh-4xl {
    line-height: var(--lh-4xl);
}

.lh-3xl {
    line-height: var(--lh-3xl);
}


.fw-800 {
    font-weight: 800;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}


.owl-carousel .owl-item .b-w-14px,
.b-w-14px {
    width: 14px;
}

.owl-carousel .owl-item .b-w-20px,
.b-w-20px {
    width: 20px;
}


.b-w-auto {
    width: auto;
}

.b-w-20 {
    width: 20%;
}

.b-w-25 {
    width: 25%;
}

.b-w-39 {
    width: 39%;
}

.b-w-50 {
    width: 50%;
}

.b-w-48 {
    width: 48%;
}

.b-w-70 {
    width: 70%;
}

.b-w-75 {
    width: 75%;
}

.b-w-80 {
    width: 80%;
}

.b-w-100 {
    width: 100%;
}

.b-w-device {
    width: 100vw;
    max-width: 1920px;
}

.b-cmn-img-h-1 {
    height: 720px;
}

.b-h-auto {
    height: auto;
}

.b-h-480 {
    height: 480px;
}

.b-h-full {
    height: 100%;
}


.b-br-8 {
    border-radius: 8px;
}

.b-br-50p {
    border-radius: 50%;
}

@media (min-width: 992px) {
    .hover-scale-s1:hover {
        transform: scale(1.05);
    }

    .b-cover-img-lg {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: center;
        z-index: 0;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .b-full-height-nav {
        min-height: calc(100vh - 80px);
    }

    .b-h-auto-md {
        height: auto;
    }

    .light a:hover {
        color: var(--bagels-neutral_400);
    }
}

@media (min-width: 1921px) {
    .b-full-height-nav {
        /* min-height: 1080px; */
        min-height: 900px;
    }
}

@media (max-width: 1365px) {
    .b-md-w-auto-max-1365 {
        width: auto;
    }
}

@media (max-width: 1199px) {
    .b-w-sl-auto {
        width: auto;
    }

    .b-cmn-img-h-1 {
        height: 550px;
    }
}

@media (max-width: 991px) {
    .b-device-height {
        min-height: 55vh;
    }

    .b-md-w-auto-max-991 {
        width: auto;
    }

    .hover-scale-s1:active {
        transform: scale(1.05);
    }

    .light a:active {
        color: var(--bagels-neutral_400);
    }
}

@media (max-width: 991px) and (orientation: portrait) {
    .b-full-height-ipad-nav {
        min-height: 70vh;
    }
}

@media (max-width: 499px) {
    .bagels-visible-xxs {
        display: block;
    }

    .bagels-hidden-xxs {
        display: none;
    }

    .bagels-block-mobile {
        display: block;
    }


    .mt-3xl-mobile {
        margin-top: var(--spc-3xl);
    }

    .mr-3xl-mobile {
        margin-right: var(--spc-3xl);
    }

    .mb-3xl-mobile {
        margin-bottom: var(--spc-3xl);
    }

    .ml-3xl-mobile {
        margin-left: var(--spc-3xl);
    }

    .mt-2xl-mobile {
        margin-top: var(--spc-2xl);
    }

    .mr-2xl-mobile {
        margin-right: var(--spc-2xl);
    }

    .mb-2xl-mobile {
        margin-bottom: var(--spc-2xl);
    }

    .ml-2xl-mobile {
        margin-left: var(--spc-2xl);
    }

    .mt-xl-mobile {
        margin-top: var(--spc-xl);
    }

    .mr-xl-mobile {
        margin-right: var(--spc-xl);
    }

    .mb-xl-mobile {
        margin-bottom: var(--spc-xl);
    }

    .mb-xl-neg-mobile {
        margin-bottom: var(--spc-xl-neg);
    }

    .ml-xl-mobile {
        margin-left: var(--spc-xl);
    }

    .mt-lg-mobile {
        margin-top: var(--spc-lg);
    }

    .mr-lg-mobile {
        margin-right: var(--spc-lg);
    }

    .mb-lg-mobile {
        margin-bottom: var(--spc-lg);
    }

    .ml-lg-mobile {
        margin-left: var(--spc-lg);
    }

    .mt-md-mobile {
        margin-top: var(--spc-md);
    }

    .mr-md-mobile {
        margin-right: var(--spc-md);
    }

    .mb-md-mobile {
        margin-bottom: var(--spc-md);
    }

    .mb-md-neg-mobile {
        margin-bottom: var(--spc-md-neg);
    }

    .ml-md-mobile {
        margin-left: var(--spc-md);
    }

    .mt-sm-mobile {
        margin-top: var(--spc-sm);
    }

    .mr-sm-mobile {
        margin-right: var(--spc-sm);
    }

    .mb-sm-mobile {
        margin-bottom: var(--spc-sm);
    }

    .ml-sm-mobile {
        margin-left: var(--spc-sm);
    }

    .mt-xs-mobile {
        margin-top: var(--spc-xs);
    }

    .mr-xs-mobile {
        margin-right: var(--spc-xs);
    }

    .mb-xs-mobile {
        margin-bottom: var(--spc-xs);
    }

    .ml-xs-mobile {
        margin-left: var(--spc-xs);
    }

    .mt-2xs-mobile {
        margin-top: var(--spc-2xs);
    }

    .mr-2xs-mobile {
        margin-right: var(--spc-2xs);
    }

    .mb-2xs-mobile {
        margin-bottom: var(--spc-2xs);
    }

    .ml-2xs-mobile {
        margin-left: var(--spc-2xs);
    }


    .pl-0-mobile {
        padding-left: 0px;
    }

    .pb-8-mobile {
        padding-bottom: 8px;
    }

    .pb-10-mobile {
        padding-bottom: 10px;
    }



    .fs-7xl-mobile {
        font-size: var(--fs-7xl);
    }

    .fs-6xl-mobile {
        font-size: var(--fs-6xl);
    }

    .fs-5xl-mobile {
        font-size: var(--fs-5xl);
    }

    .fs-4xl-mobile {
        font-size: var(--fs-4xl);
    }

    .fs-3xl-mobile {
        font-size: var(--fs-3xl);
    }

    .fs-2xl-mobile {
        font-size: var(--fs-2xl);
    }

    .fs-xl-mobile {
        font-size: var(--fs-xl);
    }

    .fs-3xl-mobile {
        font-size: var(--fs-3xl-mobile);
        line-height: var(--lh-3xl-mobile);
    }

    .fs-xl-mobile-alt {
        font-size: var(--fs-xl-mobile);
    }

    .fs-lg-mobile {
        font-size: var(--fs-lg);
    }

    .fs-md-mobile {
        font-size: var(--fs-md);
    }

    .fs-sm-mobile {
        font-size: var(--fs-sm);
    }

    .fs-xs-mobile {
        font-size: var(--fs-xs);
    }


    .lh-5xl-mobile {
        line-height: var(--lh-5xl);
    }

    .lh-xl-mobile {
        line-height: var(--lh-xl-mobile);
    }

    .lh-md-mobile {
        line-height: var(--lh-md);
    }

    .lh-md-dense-mobile {
        line-height: var(--lh-md-dense);
    }


    .b-w-100-mobile {
        width: var(--b-w-100-mobile)
    }

    .b-w-auto-mobile {
        width: auto
    }

    .mobile-flex-justify-flex-end {
        justify-content: flex-end;
    }

    .b-cover-img-mobile {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: center;
        z-index: 0;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .b-h-auto-xxs {
        height: auto;
    }


    img.b-pos-center-mobile {
        object-position: center;
    }

    img.b-pos-left-mobile {
        object-position: left;
    }

    img.b-pos-top-mobile {
        object-position: top;
    }

    img.b-pos-bottom-mobile {
        object-position: bottom;
    }

    img.b-pos-right-mobile {
        object-position: right;
    }
}

@media (max-width: 420px) {
    .fs-5xl-mobile {
        font-size: var(--fs-5xl);
    }

    .fs-md-mobile {
        font-size: var(--fs-md);
    }


    .lh-5xl-mobile {
        line-height: var(--lh-5xl);
    }

    .lh-md-mobile {
        line-height: var(--lh-md);
    }
}

@media (min-width: 992px) {
    .bagels-hidden-md-above {
        display: none;
    }

    .bagels-hidden-md-above-imp {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .b-md-w-100 {
        width: 100%;
    }

    .b-md-w-49 {
        width: 49%;
    }

    .b-md-w-90 {
        width: 90%;
    }

    .b-md-w-80 {
        width: 80%;
    }


    .fs-md-md {
        font-size: 18px;
    }

    .fs-3xl-md {
        font-size: 39px;
    }


    .lh-3xl-md {
        line-height: 53px;
    }
}

@media (min-width: 1200px) {
    .b-lg-w-100 {
        width: 100%;
    }
}

@media (min-width: 1200px) and (max-width: 1365px) {
    .b-w-ml-auto {
        width: auto;
    }

    .b-w-ml-90 {
        width: 90%;
    }

    .b-w-ml-75 {
        width: 75%;
    }
}

@media (max-width: 991px) {
    .bagels-hidden-sm-below-imp {
        display: none !important;
    }
}

@media (min-width: 500px) and (max-width: 991px) {
    .b-smm-md-w-90 {
        width: 90%;
    }

    .bagels-smm-md-visible {
        display: block;
    }

    .bagels-hidden-smm-md {
        display: none;
    }

    .bagels-hidden-smm-md-imp {
        display: none !important;
    }

    .ipad-flex-justify-flex-end {
        justify-content: flex-end;
    }

    .b-cover-img-ipad {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: center;
        z-index: 0;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .b-h-auto-smm-md {
        height: auto;
    }


    img.b-pos-center-ipad {
        object-position: center;
    }

    img.b-pos-left-ipad {
        object-position: left;
    }

    img.b-pos-top-ipad {
        object-position: top;
    }

    img.b-pos-bottom-ipad {
        object-position: bottom;
    }

    img.b-pos-right-ipad {
        object-position: right;
    }
}

@media (min-width: 500px) and (max-width: 767px) {
    .bagels-visible-smm {
        display: block;
    }

    .bagels-hidden-smm {
        display: none;
    }

    .bagels-hidden-smm-imp {
        display: none !important;
    }

    .b-smm-w-100 {
        width: 100%;
    }
}

@media (max-width: 499px) {
    .b-xxs-w-100 {
        width: 100%;
    }
}

/* Archive filter */
.bagels-filter-parent .bfp-sin-filter {
    margin-right: var(--spc-md);
    margin-bottom: var(--spc-md);
}

.bagels-filter-parent .bfp-1 {
    margin-bottom: var(--spc-md-neg);
}

.bagels-filter-parent .bfp-sin-filter:last-child {
    margin-right: 0;
}

/* Archive filter */

/* Content width setter */
@media (min-width: 500px) {
    .ws-middle {
        display: flex;
        justify-content: center;
    }

    .ws-right {
        display: flex;
        justify-content: flex-end;
    }

    .ws-left {
        display: flex;
        justify-content: flex-start;
    }

    .ws-32 {
        width: 55%;
    }

    .ws-50 {
        width: 74%;
    }

    .ws-45 {
        width: 66%;
    }

    .ws-55 {
        width: 85%;
    }

    .ws-90 {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .ws-50 {
        width: 50%;
    }

    .ws-45 {
        width: 65%;
    }

    .ws-55 {
        width: 75%;
    }

    .ws-32 {
        width: 40%;
    }

    .ws-70 {
        width: 70%;
    }
}

@media (min-width: 1200px) {
    .ws-50 {
        width: 40%;
    }

    .ws-32 {
        width: 32%;
    }

    .ws-45 {
        width: 45%;
    }

    .ws-55 {
        width: 55%;
    }

    .ws-65 {
        width: 65%;
    }

    .ws-75 {
        width: 75%;
    }

    .ws-90 {
        width: 90%;
    }
}

/* Content width setter */

.bagels-scrollbar-s1::-webkit-scrollbar {
    width: 5px;
    /* width of the entire scrollbar */
}

.bagels-scrollbar-s1::-webkit-scrollbar-track {
    background-color: #ededed;
    /* color of the tracking area */
}

.bagels-scrollbar-s1::-webkit-scrollbar-thumb {
    background-color: #a4a3a3;
    /* color of the scroll thumb */
    border-radius: 5px;
    /* roundness of the scroll thumb */
    border: none;
    /* creates padding around scroll thumb */
}

/*Firefox*/
.bagels-scrollbar-s1 {
    scrollbar-width: thin;
    /* "auto" or "thin" */
    scrollbar-height: thin;
    /* "auto" or "thin" */
    scrollbar-color: #a4a3a3 #ededed;
    /* scroll thumb and track */
}

/*Future-Proof */
/* Works on Firefox */
.bagels-scrollbar-s1 {
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-height: thin;
    scrollbar-color: #a4a3a3 #ededed;
}

/* Works on Chrome, Edge, and Safari */
.bagels-scrollbar-s1::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.bagels-scrollbar-s1::-webkit-scrollbar-track {
    background-color: #ededed;
}

.bagels-scrollbar-s1::-webkit-scrollbar-thumb {
    background-color: #a4a3a3;
    border-radius: 5px;
    border: none;
}

/*Future-Proof */

.bagels-scrollbar-s2::-webkit-scrollbar {
    width: 5px;
    /* width of the entire scrollbar */
}

.bagels-scrollbar-s2::-webkit-scrollbar-track {
    background-color: #353535;
    /* color of the tracking area */
}

.bagels-scrollbar-s2::-webkit-scrollbar-thumb {
    background-color: #0c0c11;
    /* color of the scroll thumb */
    border-radius: 5px;
    /* roundness of the scroll thumb */
    border: none;
    /* creates padding around scroll thumb */
}

/*Firefox*/
.bagels-scrollbar-s2 {
    overflow: auto;
    scrollbar-width: thin;
    /* "auto" or "thin" */
    scrollbar-height: thin;
    /* "auto" or "thin" */
    scrollbar-color: #0c0c11 #353535;
    /* scroll thumb and track */
}

/*Future-Proof */
/* Works on Firefox */
.bagels-scrollbar-s2 {
    scrollbar-width: thin;
    scrollbar-height: thin;
    scrollbar-color: #0c0c11 #353535;
}

/* Works on Chrome, Edge, and Safari */
.bagels-scrollbar-s2::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.bagels-scrollbar-s2::-webkit-scrollbar-track {
    background-color: #353535;
}

.bagels-scrollbar-s2::-webkit-scrollbar-thumb {
    background-color: #0c0c11;
    border-radius: 5px;
    border: none;
}

/*Future-Proof */

/* Button styles */
.bagels-theme-button a,
.bagels-pseudo-theme-button .bptb-1,
#left-sidebar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a,
.wpcf7 input[type="submit"] {
    min-height: 45px;
    text-align: center;
    /* padding: 13px 24px; */
    padding: 11px 24px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: var(--fs-sm);
    outline-width: 2px;
    outline-style: solid;
    outline-offset: 0px;
    outline-color: transparent;
    border-radius: 50px;
    border-width: 2px;
    border-style: solid;
}

.bagels-theme-button a,
.bagels-pseudo-theme-button .bptb-1,
#left-sidebar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a {
    min-width: 110px;
}

.wpcf7 input[type="submit"] {
    padding-top: 9px;
    padding-bottom: 9px;
}

.bagels-pseudo-theme-button .btb-icon {
    display: flex;
}

.bagels-theme-button a.fw-800,
.bagels-pseudo-theme-button .bptb-1.fw-800,
.wpcf7 .form-group.fw-800 input[type="submit"] {
    font-weight: 800;
}

#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a {
    border-color: var(--bagels-transparent);
}

#left-sidebar .pll-parent-menu-item.open>a,
.bagels-dark-theme #left-sidebar .pll-parent-menu-item.open>a {
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-theme-button a,
.wpcf7 input[type="submit"],
.bagels-pseudo-theme-button .bptb-1,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    outline-color: transparent;
    outline-offset: 0px;
    outline-style: solid;
    outline-width: 2px;
    border-width: 2px;
    border-style: solid;
    align-items: center;
    justify-content: center;
    border-color: transparent;
    display: inline-flex;
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    text-align: center;
}

.bagels-theme-button.left a,
.bagels-pseudo-theme-button.left .bptb-1 {
    text-align: left;
}

.bagels-theme-button.right a,
.bagels-pseudo-theme-button.right .bptb-1 {
    text-align: right;
}

.bagels-theme-button.center a,
.bagels-pseudo-theme-button.center .bptb-1 {
    text-align: center;
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    background-color: var(--bagels-neutral_100);
    border-color: var(--bagels-neutral_100);
    color: var(--bagels-dark);
}

.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-next:focus {
    border-color: var(--bagels-neutral_100);
}

/* .owl-carousel .owl-nav button.owl-prev:focus,
    .owl-carousel .owl-nav button.owl-next:focus{
        background-color: var(--bagels-neutral_100);
    } */

.bagels-theme-button a,
.bagels-pseudo-theme-button .bptb-1 {
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
}


.bagels-theme-button a.tb-small,
.bagels-pseudo-theme-button .bptb-1.tb-small,
.wpcf7 .form-group.tb-small input[type="submit"] {
    padding: var(--spc-xs) var(--spc-md);
    min-width: 98px;
    min-height: 31px;
}


.bagels-theme-button .btb-icon {
    width: 14px;
}

.bagels-theme-button .btb-icon.icon-large {
    width: 20px;
}

.bagels-theme-button .btb-icon.icon-large.il-icon-dog-eared-page {
    width: 17px;
}

.bagels-theme-button .btb-icon.btb-i-left {
    display: flex;
}

.bagels-theme-button .btb-icon:first-child,
.bagels-pseudo-theme-button .btb-icon:first-child {
    /* margin-right: 7px; */
    margin-right: 4px;
}

.bagels-theme-button .btb-icon:last-child,
.bagels-pseudo-theme-button .btb-icon:last-child {
    /* margin-left: 7px; */
    margin-left: 4px;
}

.bagels-theme-button a:focus,
.bagels-pseudo-theme-button .bptb-1:focus,
.bagels-theme-button a,
.bagels-pseudo-theme-button .bptb-1,
.wpcf7 input[type="submit"]:focus,
.wpcf7 input[type="submit"] {
    color: var(--bagels-light);
}

.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next:focus,
.owl-carousel .owl-nav button.owl-next {
    color: var(--bagels-dark);
}

.bagels-theme-button a:focus,
.bagels-pseudo-theme-button .bptb-1:focus,
.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-next:focus,
#left-sidebar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a,
.wpcf7 input[type="submit"]:focus {
    outline-offset: 3px;
}

.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-next:focus {
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-theme-button a.tb-plain:focus,
.bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
.tb-plain.owl-carousel .owl-nav button.owl-prev:focus,
.tb-plain.owl-carousel .owl-nav button.owl-next:focus,
.wpcf7 .form-group.tb-plain input[type="submit"]:focus {
    outline-offset: 0px;
}

.bagels-theme-button a.tb-transparent,
.wpcf7 .form-group.tb-transparent input[type="submit"] {
    background-color: var(--bagels-transparent);
    color: var(--bagels-dark);
    border-color: var(--bagels-transparent);
}

.bagels-theme-button a.tb-transparent.tb-dark,
.wpcf7 .form-group.tb-transparent.tb-dark input[type="submit"] {
    color: var(--bagels-light);
    background-color: var(--bagels-transparent);
    border-color: var(--bagels-transparent);
}

.bagels-theme-button.left,
.bagels-pseudo-theme-button.left {
    text-align: left;
}

.bagels-theme-button.center,
.bagels-pseudo-theme-button.center {
    text-align: center;
}

.bagels-theme-button.right,
.bagels-pseudo-theme-button.right {
    text-align: right;
}

#left-sidebar .pll-parent-menu-item.active>a,
#left-sidebar .pll-parent-menu-item>a,
#left-sidebar .pll-parent-menu-item.active>a:focus,
#left-sidebar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item.active>a,
#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a:focus,
#secondary-navbar .pll-parent-menu-item>a:focus {
    background-color: var(--bagels-transparent);
}

#left-sidebar .pll-parent-menu-item>a:active,
#left-sidebar .pll-parent-menu-item.active>a:active {
    outline-color: var(--bagels-transparent);
}

#left-sidebar .pll-parent-menu-item.active>a:focus,
#left-sidebar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item.open>a,
#secondary-navbar .pll-parent-menu-item.active>a:focus {
    outline-color: var(--bagels-bright_color_a_500);
}

#secondary-navbar .pll-parent-menu-item.active>a,
#secondary-navbar .pll-parent-menu-item>a,
#secondary-navbar .pll-parent-menu-item.active>a:focus,
#secondary-navbar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item.active>a:hover,
#secondary-navbar .pll-parent-menu-item>a:hover,
#secondary-navbar .pll-parent-menu-item.active>a:active,
#secondary-navbar .pll-parent-menu-item>a:active {
    color: var(--bagels-dark);
}

#left-sidebar .pll-parent-menu-item>a:active:focus,
#left-sidebar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item>a:hover:focus,
#secondary-navbar .pll-parent-menu-item>a:focus {
    background-color: var(--bagels-transparent);
}

#left-sidebar .pll-parent-menu-item.open>a,
#left-sidebar .pll-parent-menu-item.open>a:focus,
#secondary-navbar .pll-parent-menu-item.open>a,
#secondary-navbar .pll-parent-menu-item.open>a:focus {
    background-color: var(--bagels-neutral_200);
}

.bagels-theme-button a:focus,
.bagels-pseudo-theme-button .bptb-1:focus,
.footer-widget-area .fwb-logo .bagels-theme-button a:focus,
.bagels-theme-button a.tb-plain:focus,
.bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
.wpcf7 .form-group input[type="submit"]:focus,
.wpcf7 .form-group.tb-plain input[type="submit"]:focus {
    border-color: var(--bagels-bright_color_a_500);
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-theme-button a.tb-transparent,
.wpcf7 .form-group.tb-transparent input[type="submit"] {
    border-color: var(--bagels-transparent);
}

/* .bagels-theme-button a.tb-transparent.tb-dark{
        color: var(--bagels-light);
    } */

.bagels-dark-theme #left-sidebar .pll-parent-menu-item.open>a,
.bagels-dark-theme #left-sidebar .pll-parent-menu-item.open>a:focus

/* ,
    .bagels-dark-theme #site-header #secondary-navbar .pll-parent-menu-item.open > a,
    .bagels-dark-theme #site-header #secondary-navbar .pll-parent-menu-item.open > a:focus */
    {
    background-color: var(--bagels-neutral_700);
}

#left-sidebar .pll-parent-menu-item>a:focus,
#secondary-navbar .pll-parent-menu-item>a:focus,
#left-sidebar .pll-parent-menu-item>a:active:focus,
#secondary-navbar .pll-parent-menu-item>a:active:focus,
#left-sidebar .pll-parent-menu-item>a:active,
#secondary-navbar .pll-parent-menu-item>a:active:hover {
    background-color: var(--bagels-transparent);
}

.bagels-theme-button a.tb-dark,
.bagels-pseudo-theme-button .bptb-1.tb-dark,
.tb-dark.owl-carousel .owl-nav button.owl-prev,
.tb-dark.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-dark input[type="submit"] {
    background-color: var(--bagels-dark);
    border-color: var(--bagels-dark);
}

.bagels-theme-button a.tb-plain,
.bagels-pseudo-theme-button .bptb-1.tb-plain,
.tb-plain.owl-carousel .owl-nav button.owl-prev,
.tb-plain.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-plain input[type="submit"] {
    padding: 0 5px 1px 5px;
    min-width: auto;
    min-height: auto;
    border: none;
    outline: none;
    position: relative;
    outline: solid 2px transparent;
    border-radius: 5px;
}

.bagels-theme-button a.tb-plain,
.bagels-pseudo-theme-button .bptb-1.tb-plain,
.wpcf7 .form-group.tb-plain input[type="submit"] {
    padding: 0 0 0.3px 0;
    position: relative;
}

.bagels-theme-button a.tb-plain:before,
.bagels-pseudo-theme-button .bptb-1.tb-plain:before,
.bagels-theme-button a.tb-plain:after,
.bagels-pseudo-theme-button .bptb-1.tb-plain:after,
.wpcf7 .form-group.tb-plain input[type="submit"]:before,
.wpcf7 .form-group.tb-plain input[type="submit"]:after {
    position: absolute;
    content: '';
    background-color: var(--bagels-transparent);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.bagels-theme-button a.tb-plain:before,
.bagels-pseudo-theme-button .bptb-1.tb-plain:before,
.wpcf7 .form-group.tb-plain input[type="submit"]:before {
    left: -6px;
    top: -3px;
    right: -6px;
    bottom: -3px;
    border: 2px solid var(--bagels-transparent);
    border-radius: 5px;
}

.bagels-theme-button a.tb-plain:after,
.bagels-pseudo-theme-button .bptb-1.tb-plain:after,
.wpcf7 .form-group.tb-plain input[type="submit"]:after {
    width: 100%;
    height: 1px;
    left: 0;
    /* bottom: 0; */
    bottom: -1px;
}

/* .bagels-theme-button a.tb-plain:after{
        position: absolute;
        content: "";
        bottom: 0;
        left: 0;
        right: 0;
        height: 1px;
        background-color: var(--bagels-transparent);
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    } */

.bagels-theme-button a.tb-plain,
.bagels-pseudo-theme-button .bptb-1.tb-plain,
.bagels-theme-button a.tb-plain:hover,
.bagels-pseudo-theme-button .bptb-1.tb-plain:hover,
.bagels-theme-button a.tb-plain:focus,
.bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
.bagels-theme-button a.tb-plain:active,
.bagels-pseudo-theme-button .bptb-1.tb-plain:active,
.bagels-theme-button a.tb-outline,
.bagels-pseudo-theme-button .bptb-1.tb-outline,
.bagels-theme-button a.tb-outline:hover,
.bagels-pseudo-theme-button .bptb-1.tb-outline:hover,
.bagels-theme-button a.tb-outline:focus,
.bagels-pseudo-theme-button .bptb-1.tb-outline:focus,
.bagels-theme-button a.tb-outline:active,
.bagels-pseudo-theme-button .bptb-1.tb-outline:active,
.tb-plain.owl-carousel .owl-nav button.owl-prev,
.tb-plain.owl-carousel .owl-nav button.owl-prev:hover,
.tb-plain.owl-carousel .owl-nav button.owl-prev:focus,
.tb-plain.owl-carousel .owl-nav button.owl-prev:active,
.tb-outline.owl-carousel .owl-nav button.owl-next,
.tb-outline.owl-carousel .owl-nav button.owl-next:hover,
.tb-outline.owl-carousel .owl-nav button.owl-next:focus,
.tb-outline.owl-carousel .owl-nav button.owl-next:active,
.wpcf7 .form-group.tb-plain input[type="submit"],
.wpcf7 .form-group.tb-plain input[type="submit"]:hover,
.wpcf7 .form-group.tb-plain input[type="submit"]:focus,
.wpcf7 .form-group.tb-plain input[type="submit"]:active,
.wpcf7 .form-group.tb-outline input[type="submit"],
.wpcf7 .form-group.tb-outline input[type="submit"]:hover,
.wpcf7 .form-group.tb-outline input[type="submit"]:focus,
.wpcf7 .form-group.tb-outline input[type="submit"]:active {
    background-color: var(--bagels-transparent);
}


.bagels-theme-button a.tb-outline,
.bagels-pseudo-theme-button .bptb-1.tb-outline,
.tb-outline.owl-carousel .owl-nav button.owl-prev,
.tb-outline.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-outline input[type="submit"] {
    border-color: var(--bagels-dark);
    color: var(--bagels-dark);
}

.bagels-theme-button a.tb-outline.tb-dark,
.bagels-pseudo-theme-button .bptb-1.tb-outline.tb-dark,
.tb-outline.tb-dark.owl-carousel .owl-nav button.owl-prev,
.tb-outline.tb-dark.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-outline.tb-dark input[type="submit"] {
    border-color: var(--bagels-neutral_50);
    color: var(--bagels-neutral_100);
}

.bagels-theme-button a.tb-outline.tb-dark,
.bagels-pseudo-theme-button .bptb-1.tb-outline.tb-dark,
.wpcf7 .form-group.tb-outline.tb-dark input[type="submit"] {
    color: var(--bagels-light);
}

.bagels-theme-button a.tb-outline:focus,
.bagels-pseudo-theme-button .bptb-1.tb-outline:focus,
.tb-outline.owl-carousel .owl-nav button.owl-prev:focus,
.tb-outline.owl-carousel .owl-nav button.owl-next:focus,
.wpcf7 .form-group.tb-outline input[type="submit"]:focus {
    border-color: var(--bagels-dark);
}

.bagels-theme-button a.tb-outline.tb-dark:focus,
.bagels-pseudo-theme-button .bptb-1.tb-outline.tb-dark:focus,
.tb-outline.tb-dark.owl-carousel .owl-nav button.owl-prev:focus,
.tb-outline.tb-dark.owl-carousel .owl-nav button.owl-next:focus,
.wpcf7 .form-group.tb-outline.tb-dark input[type="submit"]:focus {
    border-color: var(--bagels-neutral_50);
    /* background-color: var(--bagels-neutral_700); */
    color: var(--bagels-light);
}


.bagels-theme-button a.dark,
.bagels-pseudo-theme-button .bptb-1.dark,
.oc-dark.owl-carousel .owl-nav button.owl-prev,
.oc-dark.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.dark input[type="submit"] {
    color: var(--bagels-light);
}

.bagels-theme-button a.light,
.bagels-pseudo-theme-button .bptb-1.light,
.oc-light.owl-carousel .owl-nav button.owl-prev,
.oc-light.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.light input[type="submit"] {
    color: var(--bagels-dark);
}


.bagels-theme-button a.tb-plain,
.bagels-pseudo-theme-button .bptb-1.tb-plain,
.tb-plain.owl-carousel .owl-nav button.owl-prev,
.tb-plain.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-plain input[type="submit"] {
    color: var(--bagels-light);
}

.bagels-theme-button .btb-icon:first-child,
.bagels-pseudo-theme-button .btb-icon:first-child {
    margin-left: -2px;
}

.bagels-theme-button .btb-icon.icon-large:first-child,
.bagels-pseudo-theme-button .btb-icon.icon-large:first-child {
    margin-left: -3px;
}

.bagels-theme-button .btb-icon.icon-large:last-child,
.bagels-pseudo-theme-button .btb-icon.icon-large:last-child {
    margin-left: 4px;
}

.bagels-theme-button .btb-i-img {
    margin-bottom: 1px;
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(71deg) brightness(101%) contrast(106%);
}

.bagels-theme-button.right .btb-i-img {
    margin-right: 0;
}

.bagels-theme-button .btb-icon.btb-i-right.il-icon-chevron-right {
    /* This is to eliminate the gap between the chevron right icon and the button's right border */
    margin-right: -4px;
    margin-top: 3px;
    display: flex;
}

.bagels-theme-button .btb-cw.tb-dark .btb-i-img,
.bagels-theme-button .btb-cw.tb-bordered .btb-i-img,
.bagels-theme-button .btb-cw.tb-outline .btb-i-img {
    filter: invert(4%) sepia(2%) saturate(6786%) hue-rotate(202deg) brightness(97%) contrast(98%);
}

.bagels-theme-button .btb-cw.tb-dark.default-type .btb-i-img,
.bagels-theme-button .btb-cw.tb-bordered.tb-dark .btb-i-img,
.bagels-theme-button .btb-cw.tb-outline.tb-dark .btb-i-img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(71deg) brightness(101%) contrast(106%);
}

.bagels-theme-button a.tb-plain.tb-dark,
.bagels-pseudo-theme-button .bptb-1.tb-plain.tb-dark,
.tb-plain.tb-dark.owl-carousel .owl-nav button.owl-prev,
.tb-plain.tb-dark.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-plain.tb-dark input[type="submit"] {
    color: var(--bagels-dark);
}

.bagels-theme-button a.tb-bordered,
.bagels-pseudo-theme-button .bptb-1.tb-bordered,
.tb-bordered.owl-carousel .owl-nav button.owl-prev,
.tb-bordered.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-bordered input[type="submit"] {
    background-color: var(--bagels-neutral_100);
    border-color: var(--bagels-neutral_100);
    color: var(--bagels-dark);
}

.bagels-theme-button a.tb-bordered.tb-dark,
.bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark,
.tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev,
.tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next,
.wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"] {
    background-color: var(--bagels-neutral_800);
    border-color: var(--bagels-neutral_800);
    color: var(--bagels-light);
}

/* .tb-bordered.owl-carousel .owl-nav button.owl-prev,
    .tb-bordered.owl-carousel .owl-nav button.owl-next{
        outline-style: none;
    } */

.tb-bordered.owl-carousel .owl-nav button.owl-prev:not(:focus),
.tb-bordered.owl-carousel .owl-nav button.owl-next:not(:focus) {
    outline-color: transparent;
}

.tb-bordered.owl-carousel .owl-nav button.disabled:focus.owl-prev,
.tb-bordered.owl-carousel .owl-nav button.disabled:focus.owl-next,
.tb-bordered.owl-carousel .owl-nav button.disabled.owl-prev,
.tb-bordered.owl-carousel .owl-nav button.disabled.owl-next {
    outline-color: transparent;
    outline-offset: -2px;
}

/* .tb-bordered.owl-carousel .owl-nav button.owl-prev,
    .tb-bordered.owl-carousel .owl-nav button.owl-next{
        outline-color: transparent;
    } */

@media (min-width: 992px) {

    .bagels-theme-button a:hover,
    .bagels-pseudo-theme-button .bptb-1:hover,
    .owl-carousel .owl-nav button.owl-prev:hover,
    .owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group input[type="submit"]:hover {
        background-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-light);
    }

    .bagels-theme-button a:hover,
    .wpcf7 .form-group input[type="submit"]:hover {
        border-color: var(--bagels-bright_color_a_600);
    }

    .owl-carousel .owl-nav button.owl-prev:hover,
    .owl-carousel .owl-nav button.owl-next:hover {
        border-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-dark);
    }

    .owl-carousel .owl-nav button.owl-prev:hover,
    .owl-carousel .owl-nav button.owl-next:hover {
        border-color: var(--bagels-neutral_200);
        background-color: var(--bagels-neutral_200);
    }

    #left-sidebar .pll-parent-menu-item.active>a:hover,
    #left-sidebar .pll-parent-menu-item>a:hover,
    /* .bagels-theme-button a:hover, */
    #secondary-navbar .pll-parent-menu-item.active>a:hover,
    #secondary-navbar .pll-parent-menu-item>a:hover {
        background-color: var(--bagels-neutral_200);
    }

    .bagels-dark-theme .bagels-theme-button a:hover,
    .bagels-dark-theme .bagels-pseudo-theme-button .bptb-1:hover,
    .footer-widget-area .fwb-logo .bagels-theme-button a:hover,
    .wpcf7 .form-group input[type="submit"]:hover {
        background-color: var(--bagels-bright_color_a_400);
        border-color: var(--bagels-bright_color_a_400);
    }

    .bagels-dark-theme .bagels-theme-button a:hover:focus,
    .bagels-dark-theme .bagels-pseudo-theme-button .bptb-1:hover:focus,
    .footer-widget-area .fwb-logo .bagels-theme-button a:hover:focus,
    .wpcf7 .form-group input[type="submit"]:hover:focus {
        background-color: var(--bagels-bright_color_a_500);
        border-color: var(--bagels-bright_color_a_500);
    }

    .bagels-theme-button a.tb-transparent:hover:focus,
    .bagels-theme-button a.tb-transparent.tb-dark:hover:focus,
    .wpcf7 .form-group.tb-transparent input[type="submit"]:hover:focus,
    .wpcf7 .form-group.tb-transparent.tb-dark input[type="submit"]:hover:focus {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-dark:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-dark:hover,
    .tb-dark.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-dark.owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group.tb-dark input[type="submit"]:hover {
        background-color: var(--bagels-neutral_800);
        border-color: var(--bagels-neutral_800);
    }

    .bagels-theme-button a.tb-dark:focus:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-dark:focus:hover,
    .bagels-theme-button a.tb-dark:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-dark:focus,
    .tb-dark.owl-carousel .owl-nav button.owl-prev:focus:hover,
    .tb-dark.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-dark.owl-carousel .owl-nav button.owl-next:focus:hover,
    .tb-dark.owl-carousel .owl-nav button.owl-next:focus,
    .wpcf7 .form-group.tb-dark input[type="submit"]:focus:hover,
    .wpcf7 .form-group.tb-dark input[type="submit"]:focus {
        background-color: var(--bagels-dark);
        border-color: var(--bagels-dark);
        /* outline-color: var(--bagels-dark); */
    }

    .bagels-theme-button a.tb-plain:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus {
        background-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-dark:focus:active,
    .bagels-pseudo-theme-button .bptb-1.tb-dark:focus:active,
    .tb-dark.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-dark.owl-carousel .owl-nav button.owl-next:focus:active,
    .wpcf7 .form-group.tb-dark input[type="submit"]:focus:active {
        background-color: var(--bagels-dark);
        border-color: var(--bagels-dark);
        /* outline-color: var(--bagels-dark); */
    }

    /* .bagels-theme-button a.tb-plain:hover, */
    .tb-plain.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-plain.owl-carousel .owl-nav button.owl-next:hover {
        outline-color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-plain:hover:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:hover:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:hover:after {
        background-color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-plain.tb-dark:hover:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain.tb-dark:hover:after,
    .wpcf7 .form-group.tb-plain.tb-dark input[type="submit"]:hover:after {
        background-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-plain:focus:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:after,
    .bagels-theme-button a.tb-plain:hover:focus:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:hover:focus:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:hover:focus:after {
        background-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-plain:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus {
        outline-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-plain:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:hover,
    .bagels-theme-button a.tb-plain:focus:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:hover,
    .tb-plain.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-plain.owl-carousel .owl-nav button.owl-prev:focus:hover,
    .tb-plain.owl-carousel .owl-nav button.owl-next:hover,
    .tb-plain.owl-carousel .owl-nav button.owl-next:focus:hover,
    .wpcf7 .form-group.tb-plain input[type="submit"]:hover,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:hover {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-transparent);
    }

    .tb-plain.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-plain.owl-carousel .owl-nav button.owl-next:hover:focus,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-next:hover:focus {
        outline-color: var(--bagels-bright_color_a_500);
    }

    .bagels-theme-button a.tb-plain:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:hover:focus,
    .bagels-theme-button a.tb-plain.tb-dark:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain.tb-dark:hover:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:hover:focus,
    .wpcf7 .form-group.tb-plain.tb-dark input[type="submit"]:hover:focus {}

    .bagels-theme-button a.tb-plain:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:hover:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:hover:focus {
        outline-color: var(--bagels-transparent);
    }

    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-next:hover {
        outline-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-plain:focus:before,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:before,
    .bagels-theme-button a.tb-plain:focus:hover:before,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:hover:before,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:before,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:hover:before {
        border-color: var(--bagels-bright_color_a_500);
    }

    .bagels-theme-button a.tb-outline:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-outline:hover,
    .tb-outline.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-outline.owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group.tb-outline input[type="submit"]:hover {
        background-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
        border-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-outline:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-outline:hover:focus,
    .tb-outline.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-outline.owl-carousel .owl-nav button.owl-next:hover:focus,
    .wpcf7 .form-group.tb-outline input[type="submit"]:hover:focus {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-outline.tb-dark:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-outline.tb-dark:hover,
    .tb-outline.tb-dark.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-outline.tb-dark.owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group.tb-outline.tb-dark input[type="submit"]:hover {
        border-color: var(--bagels-neutral_50);
        background-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-transparent:hover,
    .wpcf7 .form-group.tb-transparent input[type="submit"]:hover {
        background-color: var(--bagels-neutral_200);
        border-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-transparent.tb-dark:hover,
    .wpcf7 .form-group.tb-transparent.tb-dark input[type="submit"]:hover {
        background-color: var(--bagels-neutral_700);
        border-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
    }


    .bagels-theme-button a.tb-bordered:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:hover,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:hover {
        background-color: var(--bagels-neutral_200);
        border-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-bordered:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:focus,
    .bagels-theme-button a.tb-bordered:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:hover:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:hover:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:hover:focus {
        background-color: var(--bagels-neutral_100);
        border-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-bordered.tb-dark,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"] {
        background-color: var(--bagels-neutral_800);
        border-color: var(--bagels-neutral_800);
    }

    .bagels-theme-button a.tb-bordered.tb-dark:hover,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark:hover,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev:hover,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"]:hover {
        background-color: var(--bagels-neutral_700);
        border-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-bordered.tb-dark:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark:hover:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next:hover:focus,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"]:hover:focus {
        background-color: var(--bagels-neutral_800);
    }

    .bagels-theme-button a.tb-bordered:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:focus,
    .bagels-theme-button a.tb-bordered:hover:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:hover:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:hover:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:hover:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:hover:focus {
        outline-color: var(--bagels-bright_color_a_500);
        border-color: var(--bagels-transparent);

    }
}

@media (min-width: 1200px) {
    #secondary-navbar .navbar-nav>li.bagels-theme-button a {
        padding-top: 11px;
        padding-bottom: 11px;
    }
}

@media (max-width: 1199px) {

    .bagels-theme-button a,
    .bagels-pseudo-theme-button .bptb-1,
    #left-sidebar .pll-parent-menu-item>a,
    #secondary-navbar .pll-parent-menu-item.active>a,
    #secondary-navbar .pll-parent-menu-item>a,
    .navbar-nav>li.bagels-theme-button a {
        min-width: 100px;
    }

    .bagels-theme-button a,
    .bagels-pseudo-theme-button .bptb-1,
    #left-sidebar .pll-parent-menu-item>a,
    #secondary-navbar .pll-parent-menu-item.active>a,
    #secondary-navbar .pll-parent-menu-item>a,
    .navbar-nav>li.bagels-theme-button a,
    .wpcf7 .form-group input[type="submit"] {
        font-size: var(--fs-sm);
        padding: 10px 18px;
        min-height: 42px;
    }

    .wpcf7 .form-group input[type="submit"] {
        padding-top: 9px;
        padding-bottom: 9px;
        min-width: 90px;
    }

    .bagels-theme-button a.tb-plain,
    .bagels-pseudo-theme-button .bptb-1.tb-plain,
    .wpcf7 .form-group.tb-plain input[type="submit"] {
        font-size: var(--fs-sm);
    }
}

@media (max-width: 991px) {

    .bagels-dark-theme .bagels-theme-button a:active,
    .bagels-dark-theme .bagels-pseudo-theme-button .bptb-1:active,
    .footer-widget-area .fwb-logo .bagels-theme-button a:active,
    .bagels-dark-theme .wpcf7 .form-group input[type="submit"]:active {
        background-color: var(--bagels-bright_color_a_400);
        border-color: var(--bagels-bright_color_a_400);
    }

    .bagels-theme-button a,
    .bagels-pseudo-theme-button .bptb-1,
    .owl-carousel .owl-nav button.owl-prev,
    .owl-carousel .owl-nav button.owl-next {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .bagels-theme-button a:hover,
    .bagels-pseudo-theme-button .bptb-1:hover,
    .owl-carousel .owl-nav button.owl-prev:hover,
    .owl-carousel .owl-nav button.owl-next:hover,
    .wpcf7 .form-group input[type="submit"]:hover {
        /* outline-offset: 2px; */
    }

    #left-sidebar .pll-parent-menu-item>a {
        width: 100%;
        font-size: var(--fs-sm);
        color: var(--bagels-dark);
        border-color: var(--bagels-transparent);
    }

    .bagels-dark-theme #left-sidebar .pll-parent-menu-item>a {
        color: var(--bagels-light);
    }

    .bagels-theme-button a:active,
    .bagels-pseudo-theme-button .bptb-1:active,
    .owl-carousel .owl-nav button.owl-prev:active,
    .owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group input[type="submit"]:active {
        border-color: var(--bagels-bright_color_a_600);
        background-color: var(--bagels-bright_color_a_600);
    }

    .owl-carousel .owl-nav button.owl-prev:active,
    .owl-carousel .owl-nav button.owl-next:active {
        border-color: var(--bagels-neutral_200);
        background-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
    }

    #left-sidebar .pll-parent-menu-item>a:active,
    #left-sidebar .pll-parent-menu-item.active>a:active {
        background-color: var(--bagels-neutral_200);
    }

    #left-sidebar .pll-parent-menu-item>a:active:focus,
    #left-sidebar .pll-parent-menu-item.active>a:active:focus {
        background-color: var(--bagels-transparent);
    }

    /* #left-sidebar .pll-parent-menu-item.open > a, */
    #left-sidebar .pll-parent-menu-item.bagels-open>a,
    /* #left-sidebar .pll-parent-menu-item.open > a:focus, */
    #left-sidebar .pll-parent-menu-item.bagels-open>a:focus,
    #secondary-navbar .pll-parent-menu-item.active>a:active,
    #secondary-navbar .pll-parent-menu-item>a:active,
    /* #secondary-navbar .pll-parent-menu-item.open > a, */
    #secondary-navbar .pll-parent-menu-item.bagels-open>a,
    /* #secondary-navbar .pll-parent-menu-item.open > a:focus, */
    #secondary-navbar .pll-parent-menu-item.bagels-open>a:focus {
        background-color: var(--bagels-neutral_200);
    }

    #left-sidebar .pll-parent-menu-item>a:active,
    #secondary-navbar .pll-parent-menu-item>a:active {
        background-color: var(--bagels-neutral_700);
    }

    .bagels-dark-theme #left-sidebar .pll-parent-menu-item>a:hover,
    .bagels-dark-theme #left-sidebar .pll-parent-menu-item.active>a:hover {
        color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-dark:active,
    .bagels-pseudo-theme-button .bptb-1.tb-dark:active,
    .tb-dark.owl-carousel .owl-nav button.owl-prev:active,
    .tb-dark.owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group.tb-dark input[type="submit"]:active {
        background-color: var(--bagels-neutral_800);
        border-color: var(--bagels-neutral_800);
    }

    .bagels-theme-button a.tb-transparent:active:focus,
    .bagels-theme-button a.tb-transparent.tb-dark:active:focus,
    .wpcf7 .form-group.tb-transparent input[type="submit"]:active:focus,
    .wpcf7 .form-group.tb-transparent.tb-dark input[type="submit"]:active:focus {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-transparent);
    }


    /* .bagels-theme-button a.tb-plain:active, */
    /* .bagels-pseudo-theme-button .bptb-1.tb-plain:active, */
    .tb-plain.owl-carousel .owl-nav button.owl-prev:active,
    .tb-plain.owl-carousel .owl-nav button.owl-next:active {
        outline-color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-plain:active:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:active:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:active:after {
        background-color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-plain.tb-dark:active:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain.tb-dark:active:after,
    .wpcf7 .form-group.tb-plain.tb-dark input[type="submit"]:active:after {
        background-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-plain:focus:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:after,
    .bagels-theme-button a.tb-plain:active:focus:after,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:active:focus:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:after,
    .wpcf7 .form-group.tb-plain input[type="submit"]:active:focus:after {
        background-color: var(--bagels-transparent);
    }


    .bagels-theme-button a.tb-plain:active,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:active,
    .bagels-theme-button a.tb-plain:focus:active,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:active,
    .tb-plain.owl-carousel .owl-nav button.owl-prev:active,
    .tb-plain.owl-carousel .owl-nav button.owl-prev:focus:active,
    .tb-plain.owl-carousel .owl-nav button.owl-next:active,
    .tb-plain.owl-carousel .owl-nav button.owl-next:focus:active,
    .wpcf7 .form-group.tb-plain input[type="submit"]:active,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:active {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-transparent);
    }

    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-prev,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-next {
        outline-color: var(--bagels-dark);
    }

    .tb-plain.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-plain.owl-carousel .owl-nav button.owl-next:active:focus,
    .tb-plain.tb-dark.owl-carousel .owl-nav button.owl-next:active:focus {
        outline-color: var(--bagels-bright_color_a_500);
    }

    .bagels-theme-button a.tb-plain:active:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:active:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:active:focus {
        outline-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-plain:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus,
    .bagels-theme-button a.tb-plain:focus:active,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:active,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:active {
        outline-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-plain:focus:before,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:before,
    .bagels-theme-button a.tb-plain:focus:active:before,
    .bagels-pseudo-theme-button .bptb-1.tb-plain:focus:active:before,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:before,
    .wpcf7 .form-group.tb-plain input[type="submit"]:focus:active:before {
        border-color: var(--bagels-bright_color_a_500);
    }

    .bagels-theme-button a.tb-transparent:active,
    .wpcf7 .form-group.tb-transparent input[type="submit"]:active {
        background-color: var(--bagels-neutral_200);
        border-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-transparent.tb-dark:active,
    .wpcf7 .form-group.tb-transparent.tb-dark input[type="submit"]:active {
        background-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
        border-color: var(--bagels-neutral_700);
    }


    .bagels-theme-button a.tb-outline:active,
    .bagels-pseudo-theme-button .bptb-1.tb-outline:active,
    .tb-outline.owl-carousel .owl-nav button.owl-prev:active,
    .tb-outline.owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group.tb-outline input[type="submit"]:active {
        background-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
        border-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-outline:active:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-outline:active:focus,
    .tb-outline.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-outline.owl-carousel .owl-nav button.owl-next:active:focus,
    .wpcf7 .form-group.tb-outline input[type="submit"]:active:focus {
        background-color: var(--bagels-transparent);
        border-color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-outline.tb-dark:active,
    .bagels-pseudo-theme-button .bptb-1.tb-outline.tb-dark:active,
    .tb-outline.tb-dark.owl-carousel .owl-nav button.owl-prev:active,
    .tb-outline.tb-dark.owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group.tb-outline.tb-dark input[type="submit"]:active {
        border-color: var(--bagels-neutral_50);
        background-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
    }


    .bagels-theme-button a.tb-bordered:active,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:active,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:active,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:active {
        background-color: var(--bagels-neutral_200);
        border-color: var(--bagels-neutral_200);
        color: var(--bagels-dark);
    }

    .bagels-theme-button a.tb-bordered:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:focus,
    .bagels-theme-button a.tb-bordered:active:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:active:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:active:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"].tb-bordered:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:active:focus {
        background-color: var(--bagels-neutral_100);
        border-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-bordered.tb-dark:active,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark:active,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev:active,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next:active,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"]:active {
        background-color: var(--bagels-neutral_700);
        border-color: var(--bagels-neutral_700);
        color: var(--bagels-light);
    }

    .bagels-theme-button a.tb-bordered.tb-dark:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark:focus,
    .bagels-theme-button a.tb-bordered.tb-dark:active:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered.tb-dark:active:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next:focus,
    .tb-bordered.tb-dark.owl-carousel .owl-nav button.owl-next:active:focus,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"]:focus,
    .wpcf7 .form-group.tb-bordered.tb-dark input[type="submit"]:active:focus {
        background-color: var(--bagels-neutral_800);
        border-color: var(--bagels-transparent);
    }

    .bagels-theme-button a.tb-bordered:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:focus,
    .bagels-theme-button a.tb-bordered:active:focus,
    .bagels-pseudo-theme-button .bptb-1.tb-bordered:active:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-prev:active:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:focus,
    .tb-bordered.owl-carousel .owl-nav button.owl-next:active:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:focus,
    .wpcf7 .form-group.tb-bordered input[type="submit"]:active:focus {
        outline-color: var(--bagels-bright_color_a_500);
    }
}

@media (max-width: 499px) {

    .bagels-theme-button a,
    .bagels-pseudo-theme-button .bptb-1 {
        min-width: 121px;
    }

    .bagels-theme-button a,
    .bagels-pseudo-theme-button .bptb-1,
    .wpcf7 .form-group input[type="submit"] {
        font-size: var(--fs-sm);
        padding: 6px 19px;
        min-height: 40px;
    }

    .wpcf7 .form-group input[type="submit"] {
        /* min-width: auto; */
    }

    .bagels-theme-button a.mobile-full-w,
    .bagels-pseudo-theme-button .bptb-1.mobile-full-w,
    .wpcf7 .form-group.mobile-full-w input[type="submit"] {
        width: 100%;
    }

    .bagels-theme-button a.tb-plain,
    .bagels-pseudo-theme-button .bptb-1.tb-plain,
    .wpcf7 .form-group.tb-plain input[type="submit"] {
        font-size: var(--fs-sm);
        border-radius: 3px;
    }
}

.bagels-theme-button a.disabled,
.bagels-pseudo-theme-button .bptb-1.disabled,
.owl-carousel .owl-nav button.owl-prev.disabled,
.owl-carousel .owl-nav button.owl-next.disabled,
.wpcf7 .form-group.disabled input[type="submit"] {
    background-color: var(--bagels-neutral_200) !important;
    border-color: var(--bagels-neutral_200) !important;
    color: var(--bagels-neutral_500) !important;
    outline: none;
    pointer-events: none;
}

.owl-carousel .owl-nav button i {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.owl-carousel.tb-dark .owl-nav button i {
    color: var(--bagels-light);
}

.owl-carousel .owl-nav button.disabled i {
    color: var(--bagels-neutral_500);
}

.bagels-theme-button a.tb-dark.disabled,
.bagels-pseudo-theme-button .bptb-1.tb-dark.disabled,
.owl-carousel.tb-dark .owl-nav button.owl-prev.disabled,
.owl-carousel.tb-dark .owl-nav button.owl-next.disabled,
.wpcf7 .form-group.tb-dark input[type="submit"].disabled {
    background-color: var(--bagels-neutral_900) !important;
    border-color: var(--bagels-neutral_900) !important;
    color: var(--bagels-neutral_600) !important;
}

.bagels-theme-button a.tb-plain.disabled,
.bagels-theme-button a.tb-transparent.disabled,
.bagels-pseudo-theme-button .bptb-1.tb-plain.disabled,
.owl-carousel.tb-plain .owl-nav button.owl-prev.disabled,
.owl-carousel.tb-plain .owl-nav button.owl-next.disabled,
.wpcf7 .form-group.tb-plain.disabled input[type="submit"],
.wpcf7 .form-group.tb-transparent.disabled input[type="submit"] {
    background-color: var(--bagels-transparent) !important;
    border-color: var(--bagels-transparent) !important;
}

.bagels-theme-button a.tb-transparent.tb-dark.disabled,
.wpcf7 .form-group.tb-transparent.tb-dark.disabled input[type="submit"] {
    color: var(--bagels-neutral_600);
}

/* Button styles */

/* Owl Carousel Pagination dots */
.owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
    display: inline;
}

.owl-dots .owl-dot span {
    width: 8px;
    height: 8px;
    margin: 0 2px;
    background: transparent;
    border: 2px solid var(--bagels-neutral_200);
    display: block;
    -webkit-backface-visibility: visible;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-radius: 100%;
}


.bagels-dark-theme .owl-dots .owl-dot span {
    border-color: var(--bagels-neutral_800);
}


/* Owl Carousel Navigation Text */
.owl-nav>button {
    position: absolute;
    top: 0;
    /* background-color: var(--bagels-neutral_100); */
    padding: 6px 7px;
    outline: 0;
    width: 48px;
    height: 48px;
    /* color: var(--bagels-dark); */
    border-radius: 50%;
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    font-size: 19px;
    padding: 6px 7px !important;
    /* background-color: rgba(255,255,255,0.8); */
}

.owl-nav>button.owl-prev {
    right: 56px;
}

.owl-nav>button.owl-next {
    right: 0;
}

@media (min-width: 992px) {
    .slides-more-than-2 .owl-stage-outer {
        padding-top: 64px;
    }
}

@media (min-width: 1200px) {
    .slides-more-than-1 .owl-stage-outer {
        padding-top: 64px;
    }
}

@media (min-width: 992px) {
    .owl-dots .owl-dot:hover span {
        border-color: var(--bagels-neutral_600);
    }

    .owl-dots .owl-dot.active span {
        border-color: var(--bagels-neutral_600);
        background-color: var(--bagels-neutral_600);
    }

    .bagels-dark-theme .owl-dots .owl-dot:hover span {
        border-color: var(--bagels-neutral_400);
    }

    .bagels-dark-theme .owl-dots .owl-dot.active span {
        border-color: var(--bagels-neutral_400);
        background-color: var(--bagels-neutral_400);
    }
}

@media (max-width: 991px) {
    .owl-dots .owl-dot:active span {
        border-color: var(--bagels-neutral_600);
    }

    .owl-dots .owl-dot.active span {
        border-color: var(--bagels-neutral_600);
        background-color: var(--bagels-neutral_600);
    }

    .bagels-dark-theme .owl-dots .owl-dot:active span {
        border-color: var(--bagels-neutral_400);
    }

    .bagels-dark-theme .owl-dots .owl-dot.active span {
        border-color: var(--bagels-neutral_400);
        background-color: var(--bagels-neutral_400);
    }

    .fce-news-boxes .fce-nb-1 .owl-nav>button {
        top: unset;
        bottom: 0;
    }

    .owl-nav>button {
        top: unset;
        bottom: -40px;
    }

    .slides-more-than-1 .owl-stage-outer {
        padding-bottom: 10px;
    }

    .slides-more-than-1 .owl-stage-outer {
        padding-top: 0;
    }

    .fce-news-boxes .fce-nb-1.ipad-slider.slides-more-than-2 {
        /* padding-top: 57px; */
    }
}

@media (max-width: 499px) {
    .owl-nav>button {
        width: 48px;
        height: 48px;
        bottom: -53px;
    }

    .owl-carousel .owl-nav button.owl-prev,
    .owl-carousel .owl-nav button.owl-next {
        font-size: 19px;
        padding-bottom: 5px !important;
    }

    .owl-nav>button.owl-prev {
        right: 57px;
    }


}

/* ---------------------------------
    Swiper carousel 
   --------------------------------- */
.bagles-swiper-wrapper {
    position: relative;
}

.swiper-button-next,
.swiper-button-prev {
    font-size: 30px;
    background-color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.3);
    color: #000;
    color: var(--bagels-dark);
}

.bagels-dark-theme .swiper-button-next,
.bagels-dark-theme .swiper-button-prev {
    color: var(--bagels-light);
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 23px;
}

.swiper-button-prev {
    left: -25px;
}

.swiper-button-next {
    right: -25px;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 0.65;
    pointer-events: auto;
}

.swiper-pagination-bullet {
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.3);
}

.swiper-pagination-bullet-active {
    background-color: #fff;
}

@media (min-width: 992px) {

    .swiper-button-next:hover,
    .swiper-button-prev:hover {
        color: var(--bagels-bright_color_a_600);
    }
}

@media (max-width: 991px) {
    .swiper-button-prev {
        left: 15px;
    }

    .swiper-button-next {
        right: 15px;
    }

    .swiper-button-next,
    .swiper-button-prev {
        width: 40px;
        height: 40px;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after {
        font-size: 17px;
    }

    .swiper-button-next:active,
    .swiper-button-prev:active {
        color: var(--bagels-bright_color_a_600);
    }
}

/* Heading styles */
.bagels-heading {
    display: flex;
}

.bagels-heading.left {
    text-align: left;
    justify-content: flex-start;
}

.bagels-heading.center {
    text-align: center;
    justify-content: center;
}

.bagels-heading.right {
    text-align: right;
    justify-content: flex-end;
}

.bagels-heading .bh-1 {
    font-weight: 800;
}

@media (min-width: 500px) and (max-width: 991px) {
    .bagels-heading.left-ipad {
        text-align: left;
        justify-content: flex-start;
    }

    .bagels-heading.center-ipad {
        text-align: center;
        justify-content: center;
    }

    .bagels-heading.right-ipad {
        text-align: right;
        justify-content: flex-end;
    }
}

@media (max-width: 499px) {
    .bagels-heading.left-mobile {
        text-align: left;
        justify-content: flex-start;
    }

    .bagels-heading.center-mobile {
        text-align: center;
        justify-content: center;
    }

    .bagels-heading.right-mobile {
        text-align: right;
        justify-content: flex-end;
    }
}

/* Heading styles */

/* Tab buttons */
.b-tab-wrapper {
    display: flex;
}

.b-tab-wrapper .b-tab-link {
    font-weight: 800;
    padding-left: 17px;
    padding-right: 17px;
    display: flex;
}

.b-tab-wrapper .b-tab-link,
.b-tab-wrapper .b-tab-link:active,
.b-tab-wrapper .b-tab-link:hover,
.b-tab-wrapper .b-tab-link:focus {
    color: var(--bagels-dark);
}

.b-tab-wrapper.light .b-tab-link,
.b-tab-wrapper.light .b-tab-link:active,
.b-tab-wrapper.light .b-tab-link:hover,
.b-tab-wrapper.light .b-tab-link:focus {
    color: var(--bagels-light);
}

.b-tab-wrapper .b-tab-text {
    position: relative;
    padding-top: 19px;
    padding-bottom: 19px;
    max-width: 230px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.b-tab-wrapper .b-tab-text:after {
    position: absolute;
    content: '';
    bottom: 1px;
    left: 0;
    right: 0;
    height: 3px;
    background-color: transparent;
    /* -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out; */
}

.b-tab-wrapper .b-tab-item.b-tab-show .b-tab-text:after {
    background-color: var(--bagels-bright_color_a_500);
}

@media (min-width: 500px) {
    .b-tab-wrapper {
        justify-content: center;
    }
}

@media (min-width: 992px) {
    .b-tab-wrapper .b-tab-link:hover .b-tab-text:after {
        background-color: var(--bagels-bright_color_a_500);
    }
}

@media (max-width: 991px) {
    .b-tab-wrapper .b-tab-link:active .b-tab-text:after {
        background-color: var(--bagels-bright_color_a_500);
    }

    /* Hide scrollbar for Chrome, Safari and Opera */
    .b-tab-wrapper::-webkit-scrollbar {
        display: none;
    }

    /* Hide scrollbar for IE, Edge and Firefox */
    .b-tab-wrapper {
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */
    }

    .b-tab-wrapper::-webkit-scrollbar {
        width: 0px;
        /* width of the entire scrollbar */
    }

    .b-tab-wrapper::-webkit-scrollbar-track {
        background-color: transparent;
        /* color of the tracking area */
    }

    .b-tab-wrapper::-webkit-scrollbar-thumb {
        background-color: transparent;
        /* color of the scroll thumb */
        border-radius: 0;
        /* roundness of the scroll thumb */
        border: none;
        /* creates padding around scroll thumb */
    }

    /*Firefox*/
    .b-tab-wrapper {
        overflow: auto;
        scrollbar-width: thin;
        /* "auto" or "thin" */
        scrollbar-height: thin;
        /* "auto" or "thin" */
        scrollbar-color: transparent transparent;
        /* scroll thumb and track */
    }

    /*Future-Proof */
    /* Works on Firefox */
    .b-tab-wrapper {
        scrollbar-width: thin;
        scrollbar-height: thin;
        scrollbar-color: transparent transparent;
    }

    /* Works on Chrome, Edge, and Safari */
    .b-tab-wrapper::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    .b-tab-wrapper::-webkit-scrollbar-track {
        background-color: transparent;
    }

    .b-tab-wrapper::-webkit-scrollbar-thumb {
        background-color: transparent;
        border-radius: 0;
        border: none;
    }
}

@media (max-width: 499px) {
    .b-tab-wrapper .b-tab-text {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}

/* Tab buttons */




.page-loader .pgl-spinner:after,
.spinner:after {
    content: '';
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid #3e3e3e;
    border-color: #3e3e3e transparent #3e3e3e transparent;
    animation: pgl-dual-ring 1.2s linear infinite;
}

.spinner {
    display: none;
}

.spinner:after {
    width: 20px;
    height: 20px;
    border: 2px solid #fff;
    border-color: #fff transparent #fff transparent;
}

.loading .spinner {
    display: block;
}


@-webkit-keyframes pgl-dual-ring {
    0% {
        -webkit-transform: rotate(0deg);
    }

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

@-moz-keyframes pgl-dual-ring {
    0% {
        -moz-transform: rotate(0deg);
    }

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

@keyframes pgl-dual-ring {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }

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

/* ---------------------------------
    Header
   --------------------------------- */
#site-header {
    background-color: var(--bagels-light);
}

.bagels-dark-theme #site-header {
    background-color: var(--bagels-dark);
}

#site-header>.container {
    height: 100%;
}

#site-header>.container>.flex-parent {
    height: 100%;
    align-items: center;
    justify-content: space-between;
}

.sh-navbar .nb-left {
    align-items: center;
}

#site-header .navbar-nav .dropdown-toggle>i {
    -webkit-transition: transform 0.2s ease-in-out;
    -moz-transition: transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out;
}

#site-header .navbar-nav>.bagels-theme-button a {
    color: var(--bagels-light);
}

.header-logo {
    display: block;
    padding: 0;
    height: auto;
}

.header-logo img {
    max-width: 200px;
    max-height: 70px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

/* Navbar Search */
.nav-search {
    float: right;
    position: relative;
    padding-left: 15px;
}

.nav-search-field {
    position: absolute;
    display: none;
    width: 260px;
    right: 0;
    top: 100%;
    padding: 8px;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 999;
    margin-top: 15px;
}

.nav-search-field .input-group .form-control:focus {
    box-shadow: none;
    outline: 0 none;
    border-color: #ccc;
}

.nav-search-field .input-group .input-group-btn .btn-default {
    height: 35px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.nav-search-field .input-group .input-group-btn .btn-default:hover {
    background-color: #4d4f50;
    background-color: var(--bagels-dark);
    border-color: #4d4f50;
    border-color: var(--bagels-dark);
    color: #fff;
    outline: 0;
}

.nav-search-field .input-group .input-group-btn .btn-default:focus {
    outline: 0;
    background-color: #fff;
    border-color: #ccc;
    color: #333;
}

#site-header {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    /* box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5); */
    border-bottom: 1px solid var(--bagels-neutral_100);
}

.bagels-dark-theme #site-header {
    /* box-shadow: 0px 0px 10px 0px var(--bagels-neutral_800); */
    border-bottom-color: var(--bagels-neutral_800);
}

#site-header .navbar-nav>.bagels-theme-button a:focus {
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-dark-theme #site-header .dropdown-menu {
    background-color: var(--bagels-neutral_900);
    border-color: var(--bagels-neutral_800);
}

.bagels-dark-theme #site-header .navbar-nav>.bagels-theme-button a:focus {
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-dark-theme #left-sidebar .second-menu .bagels-theme-button a:focus {
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    outline-color: var(--bagels-bright_color_a_500);
}

.bagels-dark-theme .sidebar-nav>.navbar-nav>li>a {
    color: var(--bagels-light);
}

@media (min-width: 768px) {

    .navbar>.container .navbar-brand,
    .navbar>.container-fluid .navbar-brand {
        margin-left: 0;
    }

    #secondary-navbar>ul {
        margin-right: 0;
    }
}

@media (min-width: 992px) {

    /* #site-header{
        border-color: transparent;
    }
     */
    #main-navbar>ul>.menu-item>a,
    #site-header {
        height: 80px;
    }

    #site-header .navbar-collapse {
        flex: 1;
    }

    #site-header .menu-item a {
        font-size: var(--fs-sm);
        font-weight: 700;
    }

    #main-navbar>ul>li {
        margin-right: var(--spc-xl);
    }

    #main-navbar>ul>li:nth-child(n+5) {
        display: none;
    }

    #main-navbar>ul>li:last-child {
        margin-right: 0;
    }

    #main-navbar>ul>li.current-menu-item>a:before {
        background-color: var(--bagels-bright_color_a_500);
    }

    #main-navbar>ul>.menu-item>a {
        padding-left: 0;
        display: flex;
        align-items: center;
    }

    #site-header .navbar-nav>li>a {
        color: var(--bagels-dark);
    }

    #site-header .navbar-nav>.open>a,
    #site-header .navbar-nav>.open>a:focus,
    #site-header .navbar-nav>.open>a:hover

    /* ,
    #site-header .navbar-nav>.active>a,
    #site-header .navbar-nav>.active>a:focus,
    #site-header .navbar-nav>.active>a:hover */
        {
        color: var(--bagels-bright_color_a_600);
    }

    #site-header .navbar-nav>li>a:hover,
    #site-header .navbar-nav>li>a:focus,
    #site-header .navbar-nav>.active>a,
    #site-header .navbar-nav>.active>a:focus,
    #site-header .navbar-nav>.active>a:hover,
    #site-header .navbar-nav>.open>a,
    #site-header .navbar-nav>.open>a:focus,
    #site-header .navbar-nav>.open>a:hover {
        background-color: transparent;
    }

    #site-header .navbar-nav>.active.bagels-theme-button>a,
    #site-header .navbar-nav>.active.bagels-theme-button>a:focus {
        background-color: var(--bagels-bright_color_a_600);
    }

    #site-header #secondary-navbar .pll-parent-menu-item>a:hover {
        background-color: var(--bagels-neutral_200);
    }

    .bagels-dark-theme #site-header #secondary-navbar .pll-parent-menu-item>a:hover {
        background-color: var(--bagels-neutral_700);
    }

    #site-header #secondary-navbar .pll-parent-menu-item>a:hover:focus {
        background-color: var(--bagels-transparent);
    }

    .bagels-dark-theme #site-header .navbar-nav>li>a,
    .bagels-dark-theme #site-header .navbar-nav>.active>a,
    .bagels-dark-theme #site-header .navbar-nav>.active>a:focus,
    .bagels-dark-theme #site-header .navbar-nav>.active>a:hover,
    .bagels-dark-theme #site-header .navbar-nav>.open>a,
    .bagels-dark-theme #site-header .navbar-nav>.open>a:focus,
    .bagels-dark-theme #site-header .navbar-nav>.open>a:hover {
        color: var(--bagels-light);
    }

    #site-header.sticky .header-logo img {
        max-width: 170px;
    }

    #site-header .header-buttons-wrapper {
        display: none;
    }

    #site-header #toggle-search {
        font-size: 22px;
    }

    #main-navbar {
        margin-left: var(--spc-3xl);
    }

    #main-navbar>ul>li,
    #secondary-navbar>ul>li {
        margin-bottom: 0;
    }

    #main-navbar .menu-item:first-child .nav-link {
        padding-left: 0;
    }

    #main-navbar>ul>li>a {
        position: relative;
        padding-right: 0;
    }

    #main-navbar>ul>li>a:before {
        content: "";
        height: 4px;
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        background-color: transparent;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    #main-navbar>ul>li.open>a:before,
    #main-navbar>ul>li>a:hover:before,
    #main-navbar>ul>li>a:focus:before {
        background-color: var(--bagels-bright_color_a_500);
    }

    /* Dropdown menu */
    #site-header .dropdown-menu {
        margin-top: 20px;
        right: auto;
        left: 0;
        min-width: 240px;
        max-width: 240px;
        border-radius: 8px;
        padding: 10px;
        opacity: 0;
        visibility: hidden;
        display: block;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        box-shadow: none;
        border-color: var(--bagels-neutral_100);
    }

    #site-header .menu-item.open .dropdown-menu {
        opacity: 1;
        visibility: visible;
    }

    #site-header .pll-parent-menu-item .dropdown-menu {
        margin-top: 38px;
    }

    .bagels-dark-theme #site-header .dropdown-menu .menu-item a {
        color: var(--bagels-light);
    }

    #site-header .dropdown-menu .menu-item a {
        font-weight: 400;
        border-radius: 4px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    #site-header.sticky .dropdown-menu {
        margin-top: 23px;
    }

    /* #site-header .menu-item-has-children > .dropdown-menu:before{
        content: "";
        position: absolute;
        left: 15px;
        height: 0;
        width: 0;
        filter: drop-shadow(0px 0px 0px black);
        top: -10px;
        border-left: 11px solid transparent;
        border-right: 11px solid transparent;
        border-bottom: 10px solid #fff;
        z-index: 1;
        pointer-events: none;
    } */

    .dropdown-menu>li {
        margin-bottom: 0;
    }

    .dropdown-menu>li>a {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .dropdown-menu>li>a:focus,
    .dropdown-menu>li>a:hover,
    .dropdown-menu>.active>a,
    .dropdown-menu>.active>a:focus,
    .dropdown-menu>.active>a:hover {
        background-color: var(--bagels-neutral_100);
        /* color: #fff; */
    }

    .bagels-dark-theme .dropdown-menu>li>a:focus,
    .bagels-dark-theme .dropdown-menu>li>a:hover,
    .bagels-dark-theme .dropdown-menu>.active>a,
    .bagels-dark-theme .dropdown-menu>.active>a:focus,
    .bagels-dark-theme .dropdown-menu>.active>a:hover {
        background-color: var(--bagels-bright_color_a_500);
    }

    /* Dropdown menu > Dropdown menu */
    .dropdown-submenu {
        position: relative;
    }

    .dropdown-submenu .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -6px !important;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .dropdown-submenu:hover .dropdown-menu {
        display: block;
    }

    .dropdown-submenu>a:after {
        content: '\f105';
        font-family: 'Font Awesome 6 Pro';
        font-weight: 400;
        position: absolute;
        top: 10px;
        right: 10px;
    }

    /* sticky Header */
    #site-header.sticky {
        background-color: #fff;
        height: 70px;
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, .5);
    }

    #site-header.slide-up {
        top: -80px;
        box-shadow: none;
    }

    .header-logo,
    .nav-search,
    .navbar-collapse {
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    #secondary-navbar>ul>li:not(.bagels-theme-button)>a {
        padding-right: 40px;
    }

    #secondary-navbar>ul {
        display: flex;
        align-items: center;
    }

    #left-sidebar .pll-parent-menu-item>ul>li>a,
    #secondary-navbar .pll-parent-menu-item>ul>li>a {
        padding-left: 32px;
    }

    #secondary-navbar .pll-parent-menu-item>a {
        position: relative;
    }

    #secondary-navbar .pll-parent-menu-item>a:before {
        position: relative;
        content: "\f0ac";
        font-family: 'Font Awesome 6 Pro';
        margin-right: var(--spc-sm);
        font-size: 15px;
        top: 0px;
    }

    #left-sidebar .pll-parent-menu-item .dropdown-menu>li,
    #secondary-navbar .pll-parent-menu-item .dropdown-menu>li {
        margin-bottom: 0;
    }

    #left-sidebar .pll-parent-menu-item .dropdown-menu>.current-lang>a,
    #secondary-navbar .pll-parent-menu-item .dropdown-menu>.current-lang>a {
        position: relative;
    }

    #left-sidebar .pll-parent-menu-item .dropdown-menu>.current-lang>a:before,
    #secondary-navbar .pll-parent-menu-item .dropdown-menu>.current-lang>a:before {
        position: absolute;
        content: "\f00c";
        font-family: 'Font Awesome 6 Pro';
        top: calc(50% + 1px);
        transform: translateY(-50%);
        left: 10px;
        font-size: 14px;
        font-weight: 600;
    }

    #site-header .navbar-nav>.bagels-theme-button a:hover {
        background-color: var(--bagels-bright_color_a_600);
        border-color: var(--bagels-bright_color_a_600);
    }

    .bagels-dark-theme #site-header .navbar-nav>.bagels-theme-button a:hover {
        background-color: var(--bagels-bright_color_a_400);
        border-color: var(--bagels-bright_color_a_400);
    }

    .bagels-dark-theme #site-header .navbar-nav>.bagels-theme-button a:hover:focus {
        background-color: var(--bagels-bright_color_a_500);
        border-color: var(--bagels-bright_color_a_500);
    }

    .bagels-dark-theme .header-ham-icon:focus span,
    .bagels-dark-theme .header-ham-icon:hover span {
        background-color: var(--bagels-light);
    }

    #left-sidebar {
        display: none;
    }
}

@media (min-width: 1200px) {

    #left-sidebar .pll-parent-menu-item>a:before,
    #secondary-navbar .pll-parent-menu-item>a:before {
        font-size: var(--fs-sm);
        top: 0px;
    }

    #secondary-navbar>ul>li {
        margin-right: 20px;
    }

    #secondary-navbar>ul>li:last-child {
        margin-right: 0;
    }
}

@media (max-width: 1199px) {
    .header-logo img {
        max-width: 190px;
    }

    #site-header .menu-item a {
        font-size: 14px;
    }

    #main-navbar {
        margin-left: var(--spc-2xl);
    }

    #main-navbar>ul>li {
        margin-right: var(--spc-lg);
    }

    #main-navbar .navbar-nav>li.menu-item-has-children>a,
    #main-navbar .navbar-nav>li.mi-mega-menu>a {
        padding-right: 19px;
    }

    #main-navbar .navbar-nav>li.menu-item-has-children>a:after,
    #main-navbar .navbar-nav>li.mi-mega-menu>a:after {
        font-size: 13px;
    }

    #secondary-navbar>ul>li {
        margin-right: var(--spc-md);
    }

    #secondary-navbar>ul>li:last-child {
        margin-right: 0;
    }
}

@media (max-width: 991px) {
    :root {
        --mob-lang-menu-height: 200px;
    }

    #site-header {
        background-color: #fff;
        height: 70px;
        border-top: none;
        border-left: none;
        border-right: none;
    }

    #site-header.sticky {
        background-color: #fff;
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, .5);
    }

    .header-logo img {
        max-height: none;
        max-width: 250px;
    }

    #site-header .header-buttons-wrapper {
        display: flex;
        align-items: center;
        flex-grow: 1;
        justify-content: flex-end;
    }

    #site-header.slide-up:not(.disable-slide-up) {
        top: -70px;
        box-shadow: none;
    }

    #left-sidebar .pll-parent-menu-item>a {
        position: relative;
    }

    #left-sidebar .pll-parent-menu-item>a:before {
        position: relative;
        content: "\f0ac";
        font-family: 'Font Awesome 6 Pro';
        margin-right: 6px;
        font-size: 16px;
        top: 0px;
    }

    .bagels-dark-theme #site-header .navbar-nav>.bagels-theme-button a:active {
        background-color: var(--bagels-bright_color_a_400);
        border-color: var(--bagels-bright_color_a_400);
    }

    .bagels-dark-theme #left-sidebar .second-menu .bagels-theme-button a:hover {
        background-color: var(--bagels-bright_color_a_500);
        border-color: var(--bagels-bright_color_a_500);
    }

    .bagels-dark-theme .header-ham-icon:active span {
        background-color: var(--bagels-light);
    }

    #left-sidebar .pll-parent-menu-item>a:active {
        background-color: var(--bagels-neutral_200);
    }

    .bagels-dark-theme #left-sidebar .pll-parent-menu-item>a:active {
        background-color: var(--bagels-neutral_700);
    }

    #left-sidebar .pll-parent-menu-item>a:active:focus {
        background-color: var(--bagels-transparent);
    }

    /* 
    *
    Bootstrap navbar collapse override 
    Mobile Menu Open in iPads also
    */
    .navbar-header {
        float: none;
        flex: 1;
        display: flex;
        align-items: center;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-nav {
        float: none !important;
        margin: 7.5px -15px;
    }

    .navbar {
        max-height: 350px;
        overflow-y: auto;
    }

    .navbar-nav>li {
        float: none;
    }

    #left-sidebar>ul>li {
        border-bottom: 2px solid var(--bagels-neutral_100);
    }

    .bagels-dark-theme #left-sidebar>ul>li {
        border-bottom: 2px solid var(--bagels-neutral_800);
    }

    .navbar-text {
        float: none;
        margin: 15px 0;
    }

    /* since 3.1.0 */
    .navbar-collapse.collapse.in {
        display: block !important;
    }

    .collapsing {
        overflow: hidden !important;
    }

    #left-sidebar>ul>li.bagels-open>ul {
        display: block;
    }

    .navbar-nav .bagels-open .dropdown-menu,
    .navbar-nav .bagels-open .dropdown-menu,
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .navbar-nav>li>a,
    .navbar-nav .open .dropdown-menu>li>a {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .navbar-nav>.active>a,
    .navbar-nav>.active>a:focus,
    .navbar-nav>.active>a:hover,
    .navbar-nav>.open>a:focus,
    .navbar-nav>.open>a:hover,
    .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-nav>.bagels-open>a:focus,
    .navbar-nav>.bagels-open>a:hover,
    .navbar-nav .bagels-open .dropdown-menu>.active>a,
    .navbar-nav .bagels-open .dropdown-menu>.active>a:focus,
    .navbar-nav .bagels-open .dropdown-menu>.active>a:hover,
    .current-menu-parent.dropdown>a {
        /* background-color: transparent !important; */
    }

    .sidebar-nav .nav .bagels-open>a,
    .sidebar-nav .nav .bagels-open>a:focus,
    .sidebar-nav .nav .bagels-open>a:hover,
    .sidebar-nav .nav .open>a,
    .sidebar-nav .nav .open>a:focus,
    .sidebar-nav .nav .open>a:hover {
        background-color: transparent !important;
    }

    .dropdown>a .caret:after {
        font-family: 'Font Awesome 6 Pro';
        content: '\f105';
        position: absolute;
        right: 10px;
        font-size: 25px;
        top: 15px;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .dropdown.bagels-open>a .caret:after,
    .dropdown.open>a .caret:after {
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    /* Inverse Navbar (Dark theme) */
    .navbar-inverse .navbar-nav>li>a,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>li>a,
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
        color: #fff;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        word-wrap: break-word;
        white-space: pre-wrap;
    }

    .navbar-inverse .navbar-nav>.open>a:focus,
    .navbar-inverse .navbar-nav>.bagels-open>a:focus,
    .navbar-inverse .navbar-nav>.open>a:hover,
    .navbar-inverse .navbar-nav>.bagels-open>a:hover,
    .navbar-inverse .navbar-nav>.active>a,
    .navbar-inverse .navbar-nav>.active>a:focus,
    .navbar-inverse .navbar-nav>.active>a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a:focus,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a:hover,
    .navbar-inverse .current-menu-parent.dropdown>a {
        /* color: #4d4f50; */
        color: var(--bagels-bright_color_a_600);
    }

    .navbar-inverse .navbar-nav>.active>a,
    .navbar-inverse .navbar-nav>.active>a:focus,
    .navbar-inverse .navbar-nav>.active>a:hover,
    .navbar-inverse .navbar-nav>.open>a:focus,
    .navbar-inverse .navbar-nav>.open>a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-inverse .navbar-nav>.bagels-open>a:focus,
    .navbar-inverse .navbar-nav>.bagels-open>a:hover,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a:focus,
    .navbar-inverse .navbar-nav .bagels-open .dropdown-menu>.active>a:hover,
    .navbar-inverse .current-menu-parent.dropdown>a {
        border-color: rgba(255, 255, 255, 0.08);
    }

    .navbar-inverse .dropdown>a .caret {
        color: #222;
    }

    .navbar-inverse .dropdown>a .caret:after {
        color: #fff;
    }

    /* Default Navbar (Light theme) */
    .navbar-default .navbar-nav>li>a,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>li>a,
    .navbar-default .navbar-nav .open .dropdown-menu>li>a {
        color: #777;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        word-wrap: break-word;
        white-space: pre-wrap;
    }

    .navbar-default .navbar-nav>.active>a,
    .navbar-default .navbar-nav>.active>a:focus,
    .navbar-default .navbar-nav>.active>a:hover,
    .navbar-default .navbar-nav>.open>a:focus,
    .navbar-default .navbar-nav>.open>a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-default .navbar-nav>.bagels-open>a:focus,
    .navbar-default .navbar-nav>.bagels-open>a:hover,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a:focus,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a:hover,
    .navbar-default .current-menu-parent.dropdown>a {
        border-color: rgba(0, 0, 0, 0.05);
    }

    .navbar-default .navbar-nav>.active>a,
    .navbar-default .navbar-nav>.active>a:focus,
    .navbar-default .navbar-nav>.active>a:hover,
    .navbar-default .navbar-nav>.open>a:focus,
    .navbar-default .navbar-nav>.open>a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-default .navbar-nav>.bagels-open>a:focus,
    .navbar-default .navbar-nav>.bagels-open>a:hover,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a:focus,
    .navbar-default .navbar-nav .bagels-open .dropdown-menu>.active>a:hover,
    .navbar-default .current-menu-parent.dropdown>a {
        /* color: #4d4f50; */
        color: var(--bagels-bright_color_a_600);
    }



    .navbar-default .dropdown>a .caret {
        color: #fff;
    }

    .navbar-default .dropdown>a .caret:after {
        color: #777;
    }

    .navbar-default .navbar-brand,
    .navbar-default .navbar-brand:focus,
    .navbar-default .navbar-brand:hover {
        color: var(--bagels-dark);
    }

    .bagels-dark-theme .navbar-default .navbar-brand,
    .bagels-dark-theme .navbar-default .navbar-brand:focus,
    .bagels-dark-theme .navbar-default .navbar-brand:hover {
        color: var(--bagels-light);
    }

    /* Side Navbar */
    .sidebar-nav .navbar-nav>li>a,
    .sidebar-nav .navbar-nav .open .dropdown-menu>li>a,
    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li>a {
        color: #fff;
        color: var(--bagels-dark);
        background-color: transparent;
        /* border-bottom: 1px solid rgba(255,255,255,0.08);  */
        word-wrap: break-word;
        white-space: pre-wrap;
    }

    .sidebar-nav .dropdown>a .caret {
        color: #282f37;
    }

    .sidebar-nav .dropdown>a .caret:after {
        color: #fff;
    }

    .dropdown-submenu>a,
    .dropdown>a {
        position: relative;
    }

    .dropdown>a:after,
    .dropdown-submenu>a:after {
        content: '\f107';
        font-family: 'Font Awesome 6 Pro';
        position: absolute;
        right: 0;
        top: 15px;
        font-size: 19px;
        font-weight: 500;
    }

    .dropdown-submenu>a:after {
        top: 5px;
    }

    .dropdown-submenu.open>a:after {
        top: 7px;
    }

    .sidebar-nav .second-menu .dropdown>a:after {
        display: none;
    }

    .dropdown.bagels-open>a .fa,
    .dropdown-submenu.bagels-open>a:after,
    .dropdown.bagels-open>a:after,
    .dropdown.open>a .fa,
    .dropdown-submenu.open>a:after,
    .dropdown.open>a:after {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .sidebar-nav .navbar-nav>li>a,
    .sidebar-nav .navbar-nav .open .dropdown-menu>li>a,
    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li>a {
        padding: 9px 0px;
    }

    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li>a,
    .sidebar-nav .navbar-nav .open .dropdown-menu>li>a {
        color: var(--bagels-dark);
    }

    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li.current-menu-item>a,
    .sidebar-nav .navbar-nav .open .dropdown-menu>li.current-menu-item>a {
        color: var(--bagels-bright_color_a_500);
    }

    .sidebar-nav .navbar-nav .open .dropdown-menu a:focus,
    .sidebar-nav .navbar-nav .open .dropdown-menu a:hover,
    .sidebar-nav .navbar-nav .open .dropdown-menu>li.open>a,
    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu a:focus,
    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu a:hover,
    .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li.open>a {
        color: var(--bagels-bright_color_a_500);
    }

    .bagels-dark-theme .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li>a,
    .bagels-dark-theme .sidebar-nav .navbar-nav .open .dropdown-menu>li>a {
        color: var(--bagels-neutral_400);
    }

    .bagels-dark-theme .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li.current-menu-item>a,
    .bagels-dark-theme .sidebar-nav .navbar-nav .open .dropdown-menu>li.current-menu-item>a {
        color: var(--bagels-neutral_100);
    }

    .bagels-dark-theme .sidebar-nav .navbar-nav .open .dropdown-menu a:focus,
    .bagels-dark-theme .sidebar-nav .navbar-nav .open .dropdown-menu a:hover,
    .bagels-dark-theme .sidebar-nav .navbar-nav .open .dropdown-menu>li.open>a,
    .bagels-dark-theme .sidebar-nav .navbar-nav .bagels-open .dropdown-menu a:focus,
    .bagels-dark-theme .sidebar-nav .navbar-nav .bagels-open .dropdown-menu a:hover,
    .bagels-dark-theme .sidebar-nav .navbar-nav .bagels-open .dropdown-menu>li.open>a {
        color: var(--bagels-neutral_200);
    }

    .sidebar-nav>.navbar-nav>li>a:after {
        top: 22px;
    }

    .sidebar-nav>.navbar-nav>li>a {
        padding-bottom: 20px;
        padding-top: 20px;
        -webkit-transition: all 0.2s ease-in-out, padding-bottom 0s ease-in-out;
        -moz-transition: all 0.2s ease-in-out, padding-bottom 0s ease-in-out;
        transition: all 0.2s ease-in-out, padding-bottom 0s ease-in-out;
    }

    .sidebar-nav>.navbar-nav>li.bagels-open>a,
    .sidebar-nav>.navbar-nav>li.open>a {
        padding-bottom: 10px;
    }

    .sidebar-nav>.navbar-nav>li.bagels-open,
    .sidebar-nav>.navbar-nav>li.open {
        padding-bottom: 10px;
    }

    .sidebar-nav .second-menu {
        margin-top: var(--spc-2xl);
    }

    .sidebar-nav .second-menu .bagels-theme-button a {
        font-size: var(--fs-sm);
    }

    #left-sidebar .pll-parent-menu-item>a,
    .sidebar-nav .second-menu .nav>li.bagels-theme-button a {
        min-height: 48px;
    }

    #site-header .navbar-nav>.bagels-theme-button a:active {
        background-color: var(--bagels-bright_color_a_600);
    }

    .sidebar-nav .second-menu .nav>li.bagels-theme-button a:hover {
        background-color: var(--bagels-bright_color_a_500);
    }

    .sidebar-nav .second-menu .nav>li.bagels-theme-button a:active,
    .sidebar-nav .second-menu .nav>li.bagels-theme-button a:hover:active {
        background-color: var(--bagels-bright_color_a_600);
    }

    .bagels-dark-theme #left-sidebar .second-menu .bagels-theme-button a:active {
        background-color: var(--bagels-bright_color_a_400);
        border-color: var(--bagels-bright_color_a_400);
    }

    .sidebar-nav .second-menu .nav>li.bagels-theme-button a:focus

    /* ,
    .sidebar-nav .second-menu .nav > li.bagels-theme-button a:hover */
        {
        color: var(--bagels-light);
        background-color: var(--bagels-bright_color_a_500);
    }

    .sidebar-nav .second-menu .nav>li.bagels-theme-button a:focus {
        outline-color: var(--bagels-bright_color_a_500);
    }

    .bagels-dark-theme .sidebar-nav .second-menu .nav>li.bagels-theme-button a:hover {
        color: var(--bagels-light);
    }

    #site-header .navbar-nav>.bagels-theme-button a:active {
        border-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-light);
    }

    .sidebar-nav .second-menu ul>li:not(:last-child),
    .sidebar-nav .second-menu ol>li:not(:last-child) {
        margin-bottom: var(--spc-lg);
    }

    .bagels-dark-theme .sidebar-nav .navbar-right li>a {
        /* color: var(--bagels-neutral_400); */
    }



    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu {
        background-color: var(--bagels-neutral_800);
        border-color: var(--bagels-neutral_700);
    }

    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .dropdown-item {
        color: var(--bagels-light);
    }

    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .menu-item {
        border-color: var(--bagels-neutral_700);
    }

    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .menu-item:focus,
    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .menu-item:hover {
        border-color: var(--bagels-transparent);
    }

    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .menu-item:focus+.menu-item,
    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .menu-item:hover+.menu-item {
        border-top-color: var(--bagels-transparent);
    }

    .bagels-dark-theme #left-sidebar .second-menu .pll-parent-menu-item .dropdown-menu .bagels-theme-button a.tb-bordered {
        background-color: var(--bagels-neutral_600);
        border-color: var(--bagels-neutral_600);
        color: var(--bagels-light);
    }

    /* End side navbar */

    /* End Overrides */

    /* Sidebar navigation */



    /* Mobile menu icon */
    .header-ham-icon {
        /* float: right; */
        /* margin-top: 15px; */
        width: 28px;
        height: 26px;
        position: relative;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        cursor: pointer;
    }

    .header-ham-icon span {
        display: block;
        position: absolute;
        height: 3px;
        width: 100%;
        background: #4d4f50;
        border-color: var(--bagels-neutral_600);
        border-radius: 9px;
        opacity: 1;
        left: 0;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

    .bagels-dark-theme .header-ham-icon span {
        background-color: var(--bagels-neutral_400);
    }

    .header-ham-icon span:nth-child(1) {
        top: 1px;
    }

    .header-ham-icon span:nth-child(2),
    .header-ham-icon span:nth-child(3) {
        top: 11px;
    }

    .header-ham-icon span:nth-child(4) {
        top: 22px;
    }

    .header-ham-icon.open span:nth-child(1) {
        top: 18px;
        width: 0%;
        left: 50%;
    }

    .header-ham-icon.open span:nth-child(2) {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .header-ham-icon.open span:nth-child(3) {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .header-ham-icon.open span:nth-child(4) {
        top: 18px;
        width: 0%;
        left: 50%;
    }

}

@media (max-width: 767px) {
    .sidebar-nav {
        top: 60px;
    }

    .sidebar-nav>ul,
    .sidebar-nav .second-menu>ul {
        margin-left: 20px;
        margin-right: 20px;
    }

    #left-sidebar .pll-parent-menu-item>a,
    .sidebar-nav .second-menu .nav>li.bagels-theme-button a {
        min-height: 46px;
    }

    .header-logo img {
        max-width: 169px;
    }

    .header-ham-icon {
        width: 22px;
        height: 20px;
    }

    .header-ham-icon span {
        height: 2px;
    }

    .header-ham-icon span:nth-child(2),
    .header-ham-icon span:nth-child(3) {
        top: 9px;
    }

    .header-ham-icon span:nth-child(4) {
        top: 17px;
    }

    #site-header {
        height: 60px;
    }
}

@media (max-width: 499px) {
    .sidebar-nav {
        width: 100%;
    }

    .sidebar-nav>.navbar-nav>li>a {
        padding-bottom: 15px;
        padding-top: 12px;
    }

    .sidebar-nav>.navbar-nav>li>a:after {
        top: 14px;
    }

    #left-sidebar .second-menu .pll-parent-menu-item>.bagels-dropdown-backdrop {
        width: 100%;
    }
}

.bagels-news-letter-widget #nlw-f-b-submit {
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    color: var(--bagels-light);
}

body.bagels-abtw-light-background .bagels-news-letter-widget #nlw-f-b-submit {
    border: 1px solid;
}

body.bagels-abtw-light-background #footer-bottom {
    border-top: 1px solid;
}

body.bagels-abtw-light-background .page-header-banner {
    border-bottom: 1px solid;
}

@media (max-width: 991px) {
    .bagels-news-letter-widget #nlw-f-b-submit:active {
        border-color: var(--bagels-bright_color_a_600);
        background-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-light);
    }
}

/* Mega menu */
/* #main-navbar .dropdown-menu.bmm-wrapper{
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        padding: 0;
    } */

.bagels-mega-menu {
    border-radius: 5px;
    padding: 15px;
}

.bagels-dark-theme #site-header .dropdown-menu.bagels-mega-menu {
    background-color: var(--bagels-dark);
}

/* .bagels-mega-menu .b-mega-1 {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: -5px;
        max-height: 360px;
        overflow-y: auto;
    } */

@media (min-width: 992px) {
    #site-header {
        max-width: 1920px;
        left: 50%;
        transform: translateX(-50%);
        right: auto;
        width: 100vw;
    }

    .bagels-mega-menu {
        width: calc(970px - 30px);
        width: calc(1170px - 30px);
        width: 100vw;
        min-height: 505px;
        background-color: var(--bagels-light);
    }

    #site-header .bagels-mega-menu {
        max-width: 1920px;
        margin-top: 1px;
        border-top: 0;
        padding: 0;
        overflow: auto;
        max-height: calc(100vh - 80px);
        border-radius: 0;
    }

    #site-header.slide-up .bagels-mega-menu {
        max-height: calc(100vh);
    }

    .bagels-mega-menu .mi-mm-m-1 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #main-navbar .mi-mega-menu {
        position: static;
    }

    /* #menu-header-menu .mi-mega-menu{
            position: static;
        }
        
        #menu-header-menu .menu-item.menu-item-has-children .dropdown-toggle > i,
        #menu-header-menu .menu-item.mi-mega-menu .dropdown-toggle > i{
            display: none;
        } */

    #main-navbar .navbar-nav>li.menu-item-has-children>a,
    #main-navbar .navbar-nav>li.mi-mega-menu>a {
        padding-right: 23px;
    }

    #main-navbar .navbar-nav>li.menu-item-has-children>a:after,
    #main-navbar .navbar-nav>li.mi-mega-menu>a:after {
        position: absolute;
        content: "\f078";
        font-family: 'Font Awesome 6 Pro';
        top: calc(50% + 1px);
        transform: translateY(-50%);
        font-size: var(--fs-sm);
        font-weight: 500;
        right: 0px;
        -webkit-transition: transform 0.2s ease-in-out;
        -moz-transition: transform 0.2s ease-in-out;
        transition: transform 0.2s ease-in-out;
    }

    #main-navbar .navbar-nav>li.menu-item-has-children.open>a:after,
    #main-navbar .navbar-nav>li.mi-mega-menu.open>a:after {
        transform: rotateZ(180deg) translateY(50%);
    }

    .bagels-mega-menu .mi-mm-m-cols {
        width: calc(100% / 3);
        padding: var(--spc-sm) 18px;
        position: relative;
    }

    .bagels-mega-menu .mi-mm-m-cols:last-child:after {
        width: 0;
    }

    .bagels-mega-menu .mi-mm-m-cols:first-child,
    .bagels-mega-menu .mi-mm-m-cols.mi-mm-m-col-1 {
        padding-left: 0;
    }

    .bagels-mega-menu .mi-mm-m-cols.mi-mm-m-col-3 {
        padding-right: 0;
    }

    .bagels-mega-menu .mi-mm-m-col-1:after,
    .bagels-mega-menu .mi-mm-m-col-2:after {
        content: "";
        right: 0;
        top: 0;
        bottom: 0;
        width: 1px;
        background-color: var(--bagels-neutral_100);
        position: absolute;
    }

    .bagels-mega-menu .mi-mm-m-c-title {
        margin-bottom: var(--spc-sm);
    }

    .bagels-mega-menu .mi-mm-m-c-descr {
        margin-bottom: var(--spc-lg);
        font-size: 15px;
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi,
    .bagels-mega-menu .mi-mm-m-c-m-mi {
        list-style: none;
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-descr,
    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link,
    .bagels-mega-menu .mi-mm-m-c-m-m-l-descr {
        color: var(--bagels-neutral_600);
    }

    body.bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-descr,
    body.bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link,
    body.bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-m-l-descr {
        color: var(--bagels-neutral_400);
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-descr,
    .bagels-mega-menu .mi-mm-m-c-m-m-l-descr {
        font-size: var(--fs-xs);
    }

    .bagels-mega-menu .mi-mm-m-c-m-m-l-title,
    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-title {
        font-size: var(--fs-md);
    }

    .bagels-mega-menu .mi-mm-m-c-menu.has-sub-menu:not(:last-child) {
        margin-bottom: var(--spc-lg);
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi,
    .bagels-mega-menu .mi-mm-m-c-m-m-link {
        margin-bottom: 2px;
    }

    .bagels-mega-menu .mi-mm-m-c-m-m-l-title {
        font-weight: 800;
        color: var(--bagels-dark);
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link:hover {
        color: var(--bagels-dark);
    }

    body.bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-m-l-title,
    body.bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link:hover {
        color: var(--bagels-neutral_50);
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-title,
    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-l-descr,
    .bagels-mega-menu .mi-mm-m-c-m-m-l-descr {
        font-weight: 400;
    }

    .bagels-mega-menu .mi-mm-m-c-m-m-link,
    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link {
        display: block;
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link,
    .bagels-mega-menu .mi-mm-m-c-m-m-link {
        padding: 6px 10px;
        border-radius: 5px;
    }

    .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link:hover,
    .bagels-mega-menu .mi-mm-m-c-m-m-link:hover {
        background-color: var(--bagels-neutral_100);
    }

    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-title .bagels-heading .bh-1,
    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-descr {
        color: var(--bagels-neutral_100);
    }

    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-mi-sm-mi-link:hover,
    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-c-m-m-link:hover,
    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-col-1:after,
    .bagels-dark-theme .bagels-mega-menu .mi-mm-m-col-2:after {
        background-color: var(--bagels-neutral_800);
    }
}

@media (min-width: 1200px) {
    .bagels-mega-menu .mi-mm-m-cols {
        padding-left: var(--spc-xl);
        padding-right: var(--spc-xl);
    }

    .bagels-mega-menu .mi-mm-m-1 {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .bagels-mega-menu .mi-mm-m-c-descr {
        font-size: var(--fs-md);
    }
}

@media (min-width: 1366px) {
    .bagels-mega-menu {
        /* width: calc( 1170px + 60px - 30px ); */
    }
}

@media (min-width: 1440px) {
    .bagels-mega-menu {
        /* width: calc( 1170px + 100px - 30px ); */
    }
}

@media (min-width: 1600px) {
    .bagels-mega-menu {
        /* width: calc( 1170px + 180px - 30px ); */
    }
}

@media (max-width: 1679px) {
    .bagels-mega-menu {
        padding: 15px;
    }
}

@media (max-width: 1365px) {}

/* Mega menu */

/* ---------------------------------
    Theme Button
    .wp-block-button__link: From Gutenberg editor
   --------------------------------- */
.wp-block-button__link {
    border-radius: 5px;
    padding: 13px 15px;
    min-width: 140px;
    font-size: 17px;
    text-align: center;
    display: inline-block;
    /* background-color: #8d8f90; */
    background-color: var(--bagels-bright_color_a_500);
    border-color: var(--bagels-bright_color_a_500);
    /* color: #fff; */
    color: var(--bagels-light);
    font-weight: 500;
}

@media (min-width: 992px) {
    .wp-block-button__link:hover {
        background-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-light);
    }
}

@media (max-width: 991px) {
    .wp-block-button__link:active {
        border-color: var(--bagels-bright_color_a_600);
        background-color: var(--bagels-bright_color_a_600);
        color: var(--bagels-light);
    }
}

/* ---------------------------------
    Page Header Banner
   --------------------------------- */
.page-header-banner {
    position: relative;
    width: 100%;
    margin-top: 80px;
}

.page-header-banner .phb-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.page-header-banner .phb-content {
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
    text-align: center;
}

.page-header-banner .phb-heading {
    margin-top: 0;
    margin-bottom: 0;
    /* font-size: 50px; */
    /* color: #fff; */
    /* font-weight: 300; */
}

.page-header-banner .phb-bg:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

@media (max-width: 1199px) {
    .page-header-banner .phb-content {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

@media (max-width: 991px) {
    .page-header-banner {
        margin-top: 60px;
    }

    .page-header-banner .phb-content {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .page-header-banner .phb-heading {
        font-size: 40px;
    }
}

@media (max-width: 767px) {
    .page-header-banner .phb-content {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .page-header-banner .phb-heading {
        font-size: 35px;
    }
}

/* ---------------------------------
    Page Layout
   --------------------------------- */
.body-wrap {
    max-width: 1920px;
    margin: 0 auto;
    overflow: hidden;
    background-color: var(--bagels-light);
}

.bagels-dark-theme .body-wrap {
    background-color: var(--bagels-dark);
}

.page-container {
    /* padding-top: 40px; */
    /* padding-bottom: 40px; */
    margin-top: 80px;
}

.page-container.pg-home,
.page-container.has-breadcrumbs {
    margin-top: 80px;
}

.page-container.has-breadcrumbs {
    padding-top: var(--spc-md);
    padding-bottom: var(--spc-md);
}

@media (min-width: 992px) {
    .pc-margin-top {
        margin-top: 80px;
    }
}

@media (min-width: 1921px) {
    body {
        background-color: #fafafa;
    }
}

@media (max-width: 991px) {
    /* .page-container.pg-home{
        margin-top: 60px;
    } */

    .page-container,
    .pc-margin-top,
    .page-container.pg-home,
    .page-container.has-breadcrumbs {
        margin-top: 70px;
    }
}

@media (max-width: 767px) {
    .page-container {
        /* padding-top: 20px; */
        padding-top: 0px;
        padding-bottom: 20px;
    }

    /* .page-container.pg-home{ */
    .page-container {
        padding-bottom: 0;
    }

    .page-container,
    .pc-margin-top,
    .page-container.pg-home,
    .page-container.has-breadcrumbs {
        margin-top: 60px;
    }
}

/*-----------------------------------
    Breadcumb
 ------------------------------------ */
.breadcumb-container {
    /* background-color: #f8f8f8; */
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 13px;
}

.bc-breadcrumbs {
    position: relative;
    z-index: 100;
}

.bc-breadcrumbs #crumbs {
    position: absolute;
    padding: var(--spc-md) 0;
}

.bc-breadcrumbs.truncate-right #crumbs {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    padding-right: 30px;
}

#crumbs a {
    text-decoration: underline;
    text-decoration-color: transparent;
}

/* .bc-breadcrumbs #crumbs,
.bc-breadcrumbs #crumbs a{
    color: var(--bagels-neutral_400);
} */

.bc-breadcrumbs #crumbs .crumb-i-img {
    /* filter: invert(65%) sepia(5%) saturate(251%) hue-rotate(202deg) brightness(89%) contrast(87%); */
    filter: invert(94%) sepia(88%) saturate(3%) hue-rotate(176deg) brightness(105%) contrast(100%);
    width: 18px;
    position: relative;
    top: -3px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.bc-breadcrumbs #crumbs a {
    position: relative;
}

.bc-breadcrumbs #crumbs a:after {
    content: ' ';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 1px;
    background-color: transparent;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.bc-breadcrumbs #crumbs a:focus {
    color: var(--bagels-light);
}

.bc-breadcrumbs #crumbs a:focus:after {
    background-color: var(--bagels-light);
}

.bc-breadcrumbs.light-grey #crumbs a:focus {
    color: var(--bagels-neutral_400);
}

.bc-breadcrumbs.light-grey #crumbs a:focus:after {
    background-color: var(--bagels-neutral_400);
}

.bc-breadcrumbs.dark-grey #crumbs a:focus {
    color: var(--bagels-neutral_600);
}

.bc-breadcrumbs.dark-grey #crumbs a:focus:after {
    background-color: var(--bagels-neutral_600);
}

.bc-breadcrumbs.dark #crumbs a:focus {
    color: var(--bagels-dark);
}

.bc-breadcrumbs.dark #crumbs a:focus:after {
    background-color: var(--bagels-dark);
}


.bc-breadcrumbs #crumbs a:hover {
    color: var(--bagels-light);
}

.bc-breadcrumbs #crumbs a:hover:after {
    background-color: var(--bagels-light);
}

.bc-breadcrumbs.light-grey #crumbs a:hover {
    color: var(--bagels-neutral_400);
}

.bc-breadcrumbs.light-grey #crumbs a:hover:after {
    background-color: var(--bagels-neutral_400);
}

.bc-breadcrumbs.dark-grey #crumbs a:hover {
    color: var(--bagels-neutral_600);
}

.bc-breadcrumbs.dark-grey #crumbs a:hover:after {
    background-color: var(--bagels-neutral_600);
}

.bc-breadcrumbs.dark #crumbs a:hover {
    color: var(--bagels-dark);
}

.bc-breadcrumbs.dark #crumbs a:hover:after {
    background-color: var(--bagels-dark);
}


.bc-breadcrumbs.light-grey #crumbs .crumb-i-img {
    filter: invert(65%) sepia(5%) saturate(251%) hue-rotate(202deg) brightness(89%) contrast(87%);
}

/* .bc-breadcrumbs.light-grey #crumbs a:focus .crumb-i-img{
    filter: invert(94%) sepia(88%) saturate(3%) hue-rotate(176deg) brightness(105%) contrast(100%);
} */

/* .bc-breadcrumbs.bc-dark #crumbs,
.bc-breadcrumbs.bc-dark #crumbs a{
    color: var(--bagels-neutral_600);
} */

.bc-breadcrumbs.dark-grey #crumbs,
.bc-breadcrumbs.dark-grey #crumbs a {
    color: var(--bagels-neutral_600);
}

/* .bc-breadcrumbs.bc-dark #crumbs .crumb-i-img{
    filter: invert(33%) sepia(1%) saturate(2950%) hue-rotate(202deg) brightness(113%) contrast(97%);
} */

.bc-breadcrumbs.dark-grey #crumbs .crumb-i-img {
    filter: invert(33%) sepia(1%) saturate(2950%) hue-rotate(202deg) brightness(113%) contrast(97%);
}

.bc-breadcrumbs.dark #crumbs .crumb-i-img {
    filter: invert(4%) sepia(2%) saturate(6786%) hue-rotate(202deg) brightness(97%) contrast(98%);
}

/* .bc-breadcrumbs.bc-dark #crumbs a:focus .crumb-i-img{
    filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
} */

/* .bc-breadcrumbs.dark-grey #crumbs a:focus .crumb-i-img{
    filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
} */

/* .bc-breadcrumbs.light-grey #crumbs a:focus{
    color: var(--bagels-light);
    text-decoration-color: var(--bagels-light);
} */

/* .bc-breadcrumbs.bc-dark #crumbs a:focus{
    color: var(--bagels-dark);
    text-decoration-color: var(--bagels-dark);
} */

/* .bc-breadcrumbs.dark-grey #crumbs a:focus{
    color: var(--bagels-dark);
    text-decoration-color: var(--bagels-dark);
} */

#crumbs .crumb-element {
    margin-right: 10px;
}

#crumbs .crumb-element:first-child {
    margin-right: 7px;
}

#crumbs .crumb-element:last-child {
    margin-right: 0;
}

#crumbs .ce-icon {
    position: relative;
    top: -1px;
    font-size: 13px;
}

@media (min-width: 992px) {
    /* .bc-breadcrumbs.light-grey #crumbs a:hover{
        color: var(--bagels-light);
        text-decoration-color: var(--bagels-light);
    }

    .bc-breadcrumbs.light-grey #crumbs a:hover .crumb-i-img{
        filter: invert(94%) sepia(88%) saturate(3%) hue-rotate(176deg) brightness(105%) contrast(100%);
    } */

    /* .bc-breadcrumbs.bc-dark #crumbs a:hover{
        color: var(--bagels-dark);
        text-decoration-color: var(--bagels-dark);
    } */

    /* .bc-breadcrumbs.dark-grey #crumbs a:hover{
        color: var(--bagels-dark);
        text-decoration-color: var(--bagels-dark);
    } */

    /* .bc-breadcrumbs.bc-dark #crumbs a:hover .crumb-i-img{
        filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
    } */

    /* .bc-breadcrumbs.dark-grey #crumbs a:hover .crumb-i-img{
        filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
    } */
}

@media (max-width: 991px) {
    /* .bc-breadcrumbs.light-grey #crumbs a:active{
        color: var(--bagels-light);
        text-decoration-color: var(--bagels-light);
    } */

    /* .bc-breadcrumbs.light-grey #crumbs a:active .crumb-i-img{
        filter: invert(94%) sepia(88%) saturate(3%) hue-rotate(176deg) brightness(105%) contrast(100%);
    } */

    /* .bc-breadcrumbs.bc-dark #crumbs a:active{
        color: var(--bagels-dark);
        text-decoration-color: var(--bagels-dark);
    }
    
    .bc-breadcrumbs.bc-dark #crumbs a:active .crumb-i-img{
        filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
    } */

    /* .bc-breadcrumbs.dark-grey #crumbs a:active{
        color: var(--bagels-dark);
        text-decoration-color: var(--bagels-dark);
    }
    
    .bc-breadcrumbs.dark-grey #crumbs a:active .crumb-i-img{
        filter: invert(2%) sepia(18%) saturate(2838%) hue-rotate(208deg) brightness(103%) contrast(93%);
    } */

    .bc-breadcrumbs #crumbs a:active {
        color: var(--bagels-light);
    }

    .bc-breadcrumbs #crumbs a:active:after {
        background-color: var(--bagels-light);
    }

    .bc-breadcrumbs.light-grey #crumbs a:active {
        color: var(--bagels-neutral_400);
    }

    .bc-breadcrumbs.light-grey #crumbs a:active:after {
        background-color: var(--bagels-neutral_400);
    }

    .bc-breadcrumbs.dark-grey #crumbs a:active {
        color: var(--bagels-neutral_600);
    }

    .bc-breadcrumbs.dark-grey #crumbs a:active:after {
        background-color: var(--bagels-neutral_600);
    }

    .bc-breadcrumbs.dark #crumbs a:active {
        color: var(--bagels-dark);
    }

    .bc-breadcrumbs.dark #crumbs a:active:after {
        background-color: var(--bagels-dark);
    }

    .bc-breadcrumbs #crumbs {
        /* margin-top: 70px; */
    }
}

@media (max-width: 767px) {
    #crumbs .ce-icon {
        font-size: 11px;
    }

    .bc-breadcrumbs #crumbs {
        /* margin-top: 55px; */
    }
}

/* ---------------------------------
    404 Page
   --------------------------------- */
.page-404 {
    text-align: center;
    padding-bottom: 135px;
    padding-top: 95px;
}

.page-404 .error-404 {
    font-size: 100px;
}

/* --------------------------------------
    Contact form 7
   -------------------------------------- */
.wpcf7-form-control-wrap {
    margin-bottom: 0;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="date"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 input[type="file"],
.wpcf7 select,
.wpcf7 textarea {
    /* border: 1px solid #a2a2a2; */
    /* background-color: rgba(255,255,255,0.9); */
    /* padding: 8px 10px; */
    max-width: 100%;
    width: 100%;
    /* border-radius: 3px; */
    /* font-size: 14px; */
    font-weight: normal;
    /* height: 40px; */
    font-family: "Mulish", sans-serif;
    /* color: #262626; */

    border: 1px solid var(--bagels-neutral_100);
    background-color: var(--bagels-light);
    padding: 0 22px;
    height: 54px;
    outline: none;
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 15px;
}

.wpcf7 textarea {
    height: 140px;
    max-height: 140px;
    margin-bottom: 0 !important;
    margin: 0;
    resize: none;
    padding-top: 12px;
    padding-bottom: 12px;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="date"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="url"]:focus,
.wpcf7 input[type="number"]:focus,
.wpcf7 input[type="file"]:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
    outline: 0;
    /* border-color: var(--bagels-dark); */
    border-color: var(--bagels-neutral_300);
}

.wpcf7 input[type="text"]::placeholder,
.wpcf7 input[type="email"]::placeholder,
.wpcf7 input[type="date"]::placeholder,
.wpcf7 input[type="tel"]::placeholder,
.wpcf7 input[type="url"]::placeholder,
.wpcf7 input[type="number"]::placeholder,
.wpcf7 input[type="file"]::placeholder,
.wpcf7 select::placeholder {
    color: #9f9595;
}

.theme-contact-form .row {
    margin-left: -5px;
    margin-right: -5px;
}

.theme-contact-form .row>div[class*=col-] {
    padding-left: 5px;
    padding-right: 5px;
}

.wpcf7-form-control-wrap {
    position: relative;
    display: block;
    margin-bottom: 10px;
}

div.wpcf7-response-output {
    margin: 0 0 2em;
    color: var(--bagels-light);
    font-size: 15px;
}

.wpcf7 span.wpcf7-not-valid-tip {
    font-size: 13px;
}

.wpcf7 input[type="submit"] {
    /* background-color: #4d4f50; */
    /* background-color: var(--bagels-bright_color_a_500); */
    /* color: var(--bagels-light); */
    /* padding: 8px 25px; */
    display: inline-flex;
    /* height: 40px; */
    /* font-family: inherit; */
    /* text-decoration: none; */
    /* border: 0; */
    /* border-radius: 50px; */
    /* font-size: var(--fs-sm); */
    /* font-weight: 800; */
    /* line-height: 1; */
    /*  -webkit-appearance: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; */
}

.wpcf7 input[type="submit"]:focus {
    /* outline: 0; */
}

.wpcf7 input[type="submit"]:hover {
    color: #fff;
    /* background-color: #3c3c3c; */
    background-color: var(--bagels-bright_color_a_600);
}

div.wpcf7 .ajax-loader {
    background-image: none !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    position: absolute;
    top: 9px;
    right: 15px;
}

div.wpcf7 .ajax-loader:after {
    content: '';
    border: 2px solid #fff;
    border-top: 2px solid transparent;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    margin: 0 auto;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-animation: spin 1s linear infinite;
    -moz-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output {
    margin: 25px 0 0;
    border: 0;
    border-radius: 3px;
    color: var(--bagels-light);
    padding: 13px 17px;
    display: inline-block;
    min-width: 50%;
}

div.wpcf7-response-output:before,
div.wpcf7-validation-errors:before {
    display: table;
    content: '';
    clear: both;
}

div.wpcf7-response-output,
div.wpcf7-validation-errors {
    background-color: #f4524d;
}

.wpcf7 form.sent .wpcf7-response-output {
    background-color: #6dab3c;
}

span.wpcf7-not-valid-tip {
    display: none;
}

.wpcf7 input[aria-invalid="true"],
.wpcf7 select[aria-invalid="true"],
.wpcf7 textarea[aria-invalid="true"] {
    border-color: #f4524d !important;
    border-width: 1px !important;
}

.wpcf7-form.submitting input[type="submit"] {
    color: transparent !important;
}

@media (min-width: 992px) {
    #site-header .navbar-nav .open>.dropdown-toggle>i {
        transform: rotateZ(180deg);
    }
}

@media (max-width: 991px) {

    .wpcf7 form.invalid .wpcf7-response-output,
    .wpcf7 form.unaccepted .wpcf7-response-output,
    .wpcf7 form.payment-required .wpcf7-response-output,
    .wpcf7 form.sent .wpcf7-response-output {
        min-width: 100%;
    }
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg)
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

/* Popup Form */
#popup-quote {
    display: none;
    padding: 25px;
}

@media (min-width: 768px) {
    #popup-quote {
        min-width: 500px;
        width: 500px;
    }
}

@media(max-width: 991px) {

    .wpcf7 input[type="text"],
    .wpcf7 input[type="email"],
    .wpcf7 input[type="date"],
    .wpcf7 input[type="tel"],
    .wpcf7 input[type="url"],
    .wpcf7 input[type="number"],
    .wpcf7 input[type="file"],
    .wpcf7 select,
    .wpcf7 textarea {
        padding-left: 17px;
        padding-right: 17px;
    }

    .wpcf7 input,
    .wpcf7 textarea,
    .wpcf7 select {
        -webkit-appearance: none;
        -moz-appearance: none;
    }
}

/* ---------------------------------
    Footer CTA Banner
   --------------------------------- */
.cta-banner {
    padding: 64px 0 67px;
}

@media (min-width: 500px) and (max-width: 991px) {
    .cta-banner {
        padding: 64px 0 67px;
    }
}

@media(max-width: 767px) {
    .cta-banner {
        padding: 40px 0 54px;
    }
}

/* ---------------------------------
    Footer 
   --------------------------------- */

/*
Footer Widget Area
*/
.footer-widget-area {
    padding-top: 128px;
    padding-bottom: 126px;
    background-color: var(--bagels-dark);
    color: var(--bagels-light);
}

.footer-widget-area a {
    color: var(--bagels-light);
}

.footer-widget-area .fwa-2 {
    width: 20%;
    padding-right: var(--spc-3xl);
}

.footer-widget-area .widget-nav-list .menu-item {
    list-style: none;
}

/* .bagels-dark-theme .footer-widget-area .widget-nav-list a{ */
.footer-widget-area .widget-nav-list a {
    color: var(--bagels-neutral_400);
}

/* .bagels-dark-theme .footer-widget-area .widget-nav-list a:focus{ */
.footer-widget-area .widget-nav-list a:focus {
    color: var(--bagels-light);
}

.footer-logo {
    max-width: 175px;
    /* max-height: 80px; */
}

.footer-logo:not(:last-child) {
    margin-bottom: var(--spc-3xl);
}

.footer-widget-box .widget-title {
    margin-bottom: 20px;
}

.footer-widget-box a {
    word-wrap: break-word;
}

.footer-widget-box .fwa-wt-link {
    display: block;
}

.footer-widget-box .widget-para-link {
    color: var(--bagels-dark);
}

.footer-widget-box .widget-social-list li a:hover {
    border-color: var(--bagels-dark);
}

/*
Footer Bottom
*/
#footer-bottom {
    background-color: var(--bagels-dark);
}

/* .bagels-dark-theme #footer-bottom a{ */
#footer-bottom a {
    color: var(--bagels-neutral_400);
}

/* .bagels-dark-theme #footer-bottom a:focus{ */
#footer-bottom a:focus {
    color: var(--bagels-light);
}

#footer-bottom .fb-extended-container {
    padding-top: 14px;
    padding-bottom: 60px;
    border-top: 1px solid var(--bagels-neutral_800);
}

#footer-bottom .developer-note a {
    font-size: 12px;
}

#footer-bottom .developer-note img {
    width: 25px;
    height: 25px;
    opacity: 0.8;
    margin-right: 7px;
}

#footer-bottom .copyright-note {
    margin-bottom: 0;
}

#footer-bottom .fb-site-creater,
#footer-bottom .fb-sc-link {
    display: flex;
    align-items: center;
}

#footer-bottom .fb-sc-link {
    font-weight: 600;
}

#footer-bottom .fb-sc-text {
    margin-right: 10px;
    position: relative;
}

#footer-bottom .fb-sc-l-img {
    max-width: 23px;
    margin-right: 5px;
}

#footer-bottom .fb-sc-l-name {
    position: relative;
    top: 1px;
}

ul.footer-bottom-menu {
    margin-bottom: -10px;
}

.footer-bottom-menu {
    padding-left: 0;
}

.footer-bottom-menu .menu-item {
    margin-bottom: 5px;
    margin-right: var(--spc-lg);
    list-style: none;
    max-width: 100%;
}

.footer-bottom-menu .menu-item:last-child {
    margin-right: 0;
}

.footer-bottom-menu .menu-item .nav-link {
    font-weight: 300;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
    max-width: 100%;
}

/*
Scroll Top
*/
#scroll-top {
    display: none;
    width: 30px;
    height: 30px;
    position: fixed;
    bottom: 20px;
    right: 15px;
    cursor: default;
    z-index: 999;
}

#scroll-top img {
    width: 100%;
    height: 100%;
    opacity: 0.8;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

#scroll-top:hover img {
    opacity: 1;
}

.footer-cta-strip {
    background-color: var(--bagels-dark);
}

.footer-widget-box .widget-nav-list li.active a {
    color: var(--bagels-neutral_100);
}

.footer-widget-area .fwb-nav-wrapper {
    border-color: var(--bagels-neutral_800);
}

@media(min-width: 500px) {
    .footer-widget-box .fwa-wt-link {
        pointer-events: none;
    }
}

@media(min-width: 768px) {
    .footer-cta-strip>.container>.row {
        display: flex;
        align-items: center;
    }

    .footer-cta-strip .strip-text {
        margin-bottom: 0;
        font-size: 20px;
    }

    #footer-bottom .developer-note {
        text-align: right;
    }

    #footer-bottom .fb-site-creater {
        margin-left: 15px;
        position: relative;
    }

    #footer-bottom .fb-site-creater:before {
        content: "";
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: -8px;
        width: 1px;
        height: 1em;
        background-color: #fff;
    }

    #scroll-top {
        width: 35px;
        height: 35px;
        bottom: 90px;
        right: 6%;
    }
}

@media(min-width: 992px) {
    #footer-bottom .fb-menu {
        padding-right: 30px;
        width: calc(100% - 220px);
    }

    /* .bagels-dark-theme #footer-bottom a:hover{ */
    #footer-bottom a:hover {
        color: var(--bagels-light);
    }

    /* .bagels-dark-theme .footer-widget-area .widget-nav-list a:hover{ */
    .footer-widget-area .widget-nav-list a:hover {
        color: var(--bagels-light);
    }
}

@media(min-width: 1200px) {
    .footer-widget-area .fwa-1>.fwb-explore-wrapper {
        display: none;
    }

    .footer-widget-area .fwa-2:nth-child(5n) {
        padding-right: 0;
    }
}

@media(max-width: 1365px) {
    .footer-widget-area .fwa-2 {
        padding-right: 50px;
    }
}

@media(max-width: 1199px) {
    .footer-widget-area .career-n-explore>.fwb-explore {
        display: none;
    }

    .footer-widget-area .fwa-2 {
        width: 25%;
    }
}

@media(min-width: 992px) and (max-width: 1199px) {
    .footer-widget-area .fwa-2:nth-child(4n) {
        padding-right: 0;
    }

}

@media(max-width: 991px) {
    #footer-bottom .fb-1 {
        flex-direction: column;
        align-items: center;
    }

    #footer-bottom .fb-menu {
        margin-bottom: 30px;
    }

    .footer-widget-area {
        padding-top: 78px;
        padding-bottom: 76px;
    }

    .footer-widget-area .fwa-2 {
        width: calc(100% / 3);
    }

    /* .bagels-dark-theme #footer-bottom a:active{ */
    #footer-bottom a:active {
        color: var(--bagels-light);
    }

    /* .bagels-dark-theme .footer-widget-area .widget-nav-list a:active{ */
    .footer-widget-area .widget-nav-list a:active {
        color: var(--bagels-light);
    }
}

@media(min-width: 768px) and (max-width: 991px) {
    .footer-widget-area .fwa-2:nth-child(3n) {
        padding-right: 0;
    }
}

@media(max-width: 767px) {
    #footer-bottom {
        font-size: 13px;
        padding-top: 15px;
    }

    #footer-bottom .fb-site-creater {
        justify-content: center;
    }

    #footer-bottom .fb-site-creater:not(:first-child) {
        margin-top: 10px;
    }

    #footer-bottom .fb-1 {
        text-align: center;
        flex-direction: column;
    }

    #footer-bottom .fb-sc-l-img {
        max-width: 18px;
    }

    #footer-bottom .fb-sc-text {
        margin-right: 6px;
    }
}

@media(max-width: 499px) {
    .footer-widget-area {
        padding-top: 50px;
        padding-bottom: 48px;
    }

    .footer-widget-area .fwa-2 {
        width: 100%;
        padding-right: 0;
    }

    .footer-logo {
        max-width: 50%;
    }

    .footer-logo:not(:last-child) {
        margin-bottom: var(--spc-xl);
    }

    .footer-widget-box .widget-title {
        margin-bottom: 27px;
    }

    .footer-widget-area .fwb-nw-1 {
        overflow: hidden;
        height: 0px;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .footer-widget-area .widget-nav-list {
        margin-top: 10px;
        margin-bottom: 12px;
    }

    .footer-widget-area .widget-nav-list>.menu-item {
        margin-bottom: 20px;
    }

    .footer-widget-area .widget-nav-list>.menu-item:last-child {
        margin-bottom: 0px;
    }

    .footer-widget-box .widget-title {
        margin-bottom: 0;
    }

    .footer-widget-area .fwb-nav-wrapper {
        border-bottom: 2px solid var(--bagels-neutral_800);
        margin-bottom: 0;
    }

    .footer-widget-area .fwa-wt-link {
        padding-bottom: 14px;
        padding-top: 14px;
    }

    .footer-widget-area .fwa-wt-link {
        position: relative;
    }

    .footer-widget-area .fwa-wt-link:after {
        content: '\f107';
        font-family: 'Font Awesome 6 Pro';
        position: absolute;
        right: 0;
        top: 13px;
        font-weight: 500;
        font-size: 17px;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .footer-widget-area .fwb-nav-wrapper.open .fwa-wt-link:after {
        transform: rotate(180deg);
        top: 11px;
    }

    #footer-bottom {
        padding-top: 0;
    }

    #footer-bottom .fb-extended-container {
        padding-top: 0;
    }

    #footer-bottom .fb-extended-container {
        border-top: none;
    }

    #footer-bottom .fb-menu {
        margin-bottom: 22px;
    }
}


/* ---------------------------------
    Custom Pagination 
   --------------------------------- */
.pagination-wrapper {
    margin-bottom: 20px;
}

.pagination-wrapper:before {
    display: table;
    content: '';
    clear: both;
}

.pagination-wrapper span,
.pagination-wrapper a {
    display: inline-block;
    padding: 2px 10px;
}

.pagination-wrapper a.page-numbers,
.pagination-wrapper .current {
    background-color: #ebebeb;
    color: #4d4f50;
    color: var(--bagels-dark);
    width: 30px;
    height: 30px;
    border-radius: 50px;
    line-height: 26px;
    text-align: center;
    margin-bottom: 5px;
    font-size: 14px;
}

.pagination-wrapper a.prev,
.pagination-wrapper a.next {
    width: auto;
}

.pagination-wrapper a.page-numbers:hover {
    background-color: #4d4f50;
    background-color: var(--bagels-dark);
    color: #fff;
}

.pagination-wrapper span.page-num {
    margin-right: 10px;
    padding: 0 15px;
    height: 30px;
    line-height: 32px;
    text-align: center;
    background-color: #ebebeb;
    border-radius: 50px;
    font-size: 14px;
}

.pagination-wrapper span.dots {
    padding: 0;
    color: gainsboro;
}

.pagination-wrapper .current {
    background-color: #4d4f50;
    background-color: var(--bagels-dark);
    /* color: #fff !important; */
    color: var(--bagels-dark);
}

ul.pagination li.active a {
    background-color: var(--bagels-dark);
    border-color: var(--bagels-dark);
}

/* ---------------------------------
    Adjacent navigation links
   --------------------------------- */
.pg-sin-post-nav-links {
    margin-top: 80px;
    margin-bottom: 80px;
}

.bagels-post-nav .bpn-l-0 {
    max-width: calc(50% - 10px);
}

.bagels-post-nav .bagels-theme-button .btb-1 {
    width: 100%;
}

.bagels-post-nav .bagels-theme-button .btb-text {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.bagels-post-nav .bpn-l-0:first-child {
    margin-right: 5px;
}

.bagels-post-nav .bpn-l-0:last-child {
    margin-left: 5px;
}

@media (max-width: 991px) {
    .pg-sin-post-nav-links {
        margin-top: 60px;
        margin-bottom: 60px;
    }
}

/* Common contact form */
.common-form {
    padding: 51px 59px 59px;
    background-color: var(--bagels-neutral_50);
    color: var(--bagels-dark);
}

.common-form .cf-heading {
    margin-bottom: 18px;
}

.common-form .form-group-wrapper .form-group:last-child {
    margin-right: 0;
}

.common-form .cf-label {
    font-weight: 800;
    font-size: var(--fs-sm);
    line-height: var(--lh-sm);
    margin-bottom: 4px;
}

.common-form .cf-button {
    margin-bottom: 0;
}

.common-form .cf-button>p {
    position: relative;
    display: inline-flex;
}

.common-form .submitting.wpcf7-form .wpcf7-spinner {
    opacity: 1;
}

.common-form .wpcf7-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    background-color: transparent;
    opacity: 0;
    visibility: visible;
    pointer-events: none;
    width: 21px;
    height: 21px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.common-form .wpcf7-spinner::before {
    /* top: 5px;
        left: 5px;
        transform-origin: 7px 7px;
        border: 2px solid #fff;
        width: 100%;
        height: 100%;
        background-color: transparent; */

    display: block;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    border: 3px solid #fff;
    border-color: #fff transparent #fff #fff;
    animation: pgl-dual-ring 1.2s linear infinite;
    transform-origin: center;
    background-color: transparent;
    top: unset;
    left: unset;
}

/* .common-form .cf-typer{
        border: 1px solid var(--bagels-neutral_100);
        background-color: var(--bagels-light);
        padding: 0 24px;
        height: 54px;
        outline: none;
        width: 280px;
        -webkit-appearance: none;
        border-radius: 0;
        font-size: 15px;
    }

    .common-form .cf-typer:focus{
        border-color: var(--bagels-neutral_300);
    } */

@media (min-width: 500px) {
    .common-form .form-group-wrapper {
        display: flex;
    }

    .common-form .form-group-wrapper .form-group {
        width: calc(100% - 24px);
        margin-right: 24px;
    }
}

@media (max-width: 991px) {
    .common-form .wpcf7-spinner {
        width: 22px;
        height: 22px;
    }

    .common-form .wpcf7-spinner::before {
        width: 22px;
        height: 22px;
    }
}

@media (max-width: 499px) {
    .common-form {
        padding: 18px 22px 24px;
    }

    .common-form .wpcf7-spinner {
        width: 20px;
        height: 20px;
    }

    .common-form .wpcf7-spinner::before {
        width: 20px;
        height: 20px;
    }
}

/* Common contact form */

/* ---------------------------------
    Contact us page template 
   --------------------------------- */
body.bagels-has-business-location .pg-temp-contact {
    padding-bottom: 0;
}

.contact-group {
    position: relative;
}

.contact-group:not(:last-child) {
    margin-bottom: 20px;
}

.pg-temp-contact .pg-tc-row {
    display: flex;
    justify-content: center;
}

.contact-group .cg-heading {
    margin-top: 0;
    margin-bottom: 5px;
    color: var(--bagels-dark);
}

.cg-heading .cg-h-icon {
    display: inline-block;
    margin-right: 5px;
    width: 15px;
    text-align: center;
}

.contact-group .cg-text {
    margin-bottom: 0;
    line-height: 1.3;
}

.contact-group .cg-text a {
    color: #444;
}

.contact-group .cg-text a:hover {
    color: var(--bagels-bright_color_a_600);
}

.contact-group .cg-socials {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.contact-group .cg-socials li {
    display: inline-block;
    margin-right: 20px;
    margin-bottom: 15px;
}

.contact-group .cg-socials li a {
    display: inline-block;
    font-size: 20px;
}

.pg-temp-contact .pg-tc-map {
    display: flex;
}

.pg-temp-contact .pg-tc-map:not(:first-child) {
    margin-top: 40px;
}

.pg-temp-contact .pg-tc-map iframe {
    width: 100%;
}

@media(max-width: 991px) {
    .pg-temp-contact .ptc-form {
        margin-bottom: 35px;
    }

    .pg-temp-contact .pg-tc-row {
        display: block;
    }

    .pg-temp-contact .ptc-form,
    .pg-temp-contact .contact-info-bar {
        max-width: 570px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Form supplementary styles */
.mail-subs-wrap .ms-response {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--bagels-light);
    text-align: left;
    display: none;
}

.mail-subs-wrap .btn-default {
    border: none;
    background-color: var(--bagels-light);
    width: 50px;
    height: 50px;
    margin-left: -5px;
    outline: none;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 20px;
    position: relative;
    overflow: hidden;
    border-radius: 0;
    color: #0079C0;
    transition: all 0.2s ease-in-out;
}

.mail-subs-wrap .btn-default>i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.mail-subs-wrap .btn-default.loading {
    pointer-events: none;
    opacity: 1;
}

.mail-subs-wrap .btn-default.loading:before {
    position: absolute;
    content: '';
    background-color: #054F86;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mail-subs-wrap .btn-default.loading:after {
    position: absolute;
    content: '';
    display: block;
    top: 15px;
    left: 14px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 2px solid var(--bagels-light);
    border-color: var(--bagels-light) transparent var(--bagels-light) transparent;
    animation: pgl-dual-ring 1.2s linear infinite;
}

.mail-subs-wrap .btn-default:hover {
    background-color: #054F86;
    color: var(--bagels-light);
}

.mail-subs-wrap .ms-input {
    border: 1px solid var(--bagels-neutral_100);
    background-color: var(--bagels-light);
    padding: 0 24px;
    height: 54px;
    outline: none;
    width: 280px;
    /* float: left; */
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 15px;
}

.ms-select-wrap select.ms-input {
    padding-right: 40px;
}

.mail-subs-wrap .ms-input:focus {
    border-color: var(--bagels-neutral_300);
}

.mail-subs-wrap .ms-wrap-inner {
    display: inline-block;
}

.mail-subs-wrap {
    position: relative;
}

.mail-subs-wrap .ms-fld-wrap {
    display: flex;
}

.ms-fw-fg-label {
    margin-bottom: 2px;
}

.ms-input-check input {
    position: relative;
    width: 0;
    height: 0;
}

.ms-input-check input:before,
.ms-input-check input:after {
    position: absolute;
}

.ms-input-check input:after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Pro';
    z-index: 1;
    opacity: 0;
    top: 3px;
    left: 3px;
    font-size: 13px;
}

.ms-input-check input:checked:after {
    opacity: 1;
}

.ms-input-check input:before {
    content: '';
    background-color: var(--bagels-light);
    border: 1px solid var(--bagels-neutral_100);
    width: 19px;
    height: 19px;
    border-radius: 2px;
    left: 0;
    top: -1px;
}

.ms-select-tag-wrap {
    position: relative;
}

.ms-select-tag-wrap:after {
    content: '\f107';
    font-family: 'Font Awesome 6 Pro';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
    font-size: 20px;
    pointer-events: none;
}

@media (max-width: 499px) {
    .mail-subs-wrap .ms-wrap-inner {
        width: 100%;
    }

    .mail-subs-wrap .ms-input {
        width: calc(100% - 45px);
        height: 50px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .ms-select-tag-wrap:after {
        right: 11px;
        font-size: 17px;
    }

    .ms-select-wrap select.ms-input {
        padding-right: 30px;
    }
}

/* Form supplementary styles */

/* Newsletter popup */
.popup-newletter {
    display: none;
    max-width: 620px;
    background-color: var(--bagels-neutral_50);
    color: var(--bagels-dark);
    padding: 0;
}

.popup-newletter .pn-heading {
    margin-top: 0;
    margin-bottom: 15px;
    color: initial;
}

.popup-newletter h4.pn-heading {
    color: inherit;
    margin-bottom: 5px;
}

.popup-newletter .fancybox-close-small {
    width: 55px;
    height: 55px;
}

.popup-newletter .mail-subs-wrap .ms-wrap-inner {
    width: 100%;
    display: block;
}

.popup-newletter .mail-subs-wrap .ms-fld-wrap {
    margin-bottom: 20px;
}

.popup-newletter .mail-subs-wrap .ms-input {
    color: inherit;
    width: 100%;
}

.popup-newletter .mail-subs-wrap .ms-input::placeholder,
.popup-newletter .mail-subs-wrap select.ms-input:invalid {
    color: #9f9595;
}

.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input,
.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input-wrap,
.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-select-wrap {
    width: calc(100% - 24px);
    margin-right: 24px;
}

.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input:last-child,
.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input-wrap:last-child,
.popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-select-wrap:last-child {
    margin-right: 0;
}

.popup-newletter .mail-subs-wrap .ms-input-check {
    display: flex;
    margin-bottom: 25px;
    position: relative;
}

.popup-newletter .mail-subs-wrap .ms-input-check span {
    font-weight: initial;
    padding-left: 25px;
    display: block;
    line-height: 1.2;
}

.popup-newletter .mail-subs-wrap .ms-input-check input[type=checkbox] {
    /* position: absolute; */
    margin-top: 0;
}

.popup-newletter .vs-btn .btn {
    line-height: 1;
    margin-left: 0;
    width: 100%;
    display: block;
    border: none;
    outline: none;
    font-size: 14px;
}

.popup-newletter .mail-subs-wrap .ms-response {
    color: #619500;
    font-size: 14px;
    text-align: center;
    line-height: 1.2;
    margin-top: 20px;
}

.popup-newletter .mail-subs-wrap .btn-default.loading:after {
    top: 16px;
    left: calc(50% - 7.5px);
}

.popup-newletter .mail-subs-wrap .ms-terms-text {
    margin-bottom: 25px;
}

.popup-newletter .mail-subs-wrap .ms-terms-text a {
    /* color: #0079c0; */
    text-decoration: underline;
}

.popup-newletter .mail-subs-wrap .ms-terms-text a:hover {}

.popup-newletter .pn-wrap-main {
    position: relative;
    overflow: hidden;
    display: flex;
}

.pn-wrap-main .pn-step-form,
.pn-wrap-main .pn-step-response {
    flex: 0 0 100%;
    transition: margin-left 0.5s ease-in-out;
    padding: 59px;
}

.pn-wrap-main .pn-step-form {
    padding-top: 51px;
}

.pn-wrap-main .pn-step-response {
    text-align: center;
    align-self: center;
}

.pn-wrap-main .pn-step-response .pn-sr-graphic {
    margin: 0 auto 10px;
    font-size: 60px;
}

.popup-newletter.active-response .pn-wrap-main .pn-step-form {
    margin-left: -100%;
}

.popup-newletter .pn-sr-descr {
    margin-top: 22px;
}

@media (max-width: 499px) {

    .pn-wrap-main .pn-step-form,
    .pn-wrap-main .pn-step-response {
        padding: 30px 25px;
    }

    .pn-wrap-main .pn-step-form {
        padding-top: 21px;
    }

    .pn-wrap-main .pn-step-response {
        display: none;
    }

    .popup-newletter .pn-heading {
        padding-right: 25px;
    }

    .popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input,
    .popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-input-wrap,
    .popup-newletter .mail-subs-wrap .ms-fld-wrap.col-2>.ms-select-wrap {
        width: calc(100% - 10px);
        margin-right: 10px;
    }
}

/* Newsletter popup */ /*
Theme Name: Bagels
Description: Specific styles of the theme relative ti this website.
*/

/* Theme elements */
    /* Main section */
    .fce-section .fce-s-content-wrapper{
        padding-left: 15px;
        padding-right: 15px;
    }
/* Main section */

/* Columnar section */
    .bagels-col-wrapper .fc-c-column:last-child{
        margin-right: 0;
    }

    .bagels-col-wrapper a.fc-c-column:focus{
        opacity: 0.9;
    }

    
    @media (min-width: 992px){
        .bagels-col-wrapper .fc-c-column{
            width: 100%;
        }

        .bagels-col-wrapper.desktop-cols-1 .fc-c-column{
            margin-right: 0;
        }

        .bagels-col-wrapper a.fc-c-column:hover{
            opacity: 0.9;
        }

        /* .bagels-col-wrapper.col-count-2 .fc-c-column,
        .bagels-col-wrapper.desktop-cols-2 .fc-c-column{
            width: 50%;
            max-width: 50%;
        }

        .bagels-col-wrapper.col-count-3 .fc-c-column,
        .bagels-col-wrapper.desktop-cols-3 .fc-c-column {
            width: calc(100% / 3);
            max-width: calc(100% / 3);
        }

        .bagels-col-wrapper.col-count-4 .fc-c-column,
        .bagels-col-wrapper.desktop-cols-4 .fc-c-column {
            width: 25%;
            max-width: 25%;
        } */
    
        .bagels-col-wrapper .bcw-1 {
            display: flex;
        }
        
        .bagels-col-wrapper.align-center .bcw-1 {
            align-items: center;
        }
    }

    @media (max-width: 1439px) {
        /* .bagels-col-wrapper .fc-c-column{
            padding-left: 0 !important;
            padding-right: 0 !important;
        } */
    }

    @media (max-width: 991px){
        .bagels-col-wrapper .bcw-1{
            display: flex;
            /* margin-bottom: -50px; */
        }

        .bagels-col-wrapper a.fc-c-column:active{
            opacity: 0.9;
        }
        
        .bagels-col-wrapper.switch-sides{
            display: flex;
            flex-direction: column-reverse;
        }

        /* .bagels-col-wrapper .fc-c-column {
            margin-bottom: 50px;
        }

        .bagels-col-wrapper .fc-c-column:not(:first-child) {
            margin-top: 30px !important;
        } */
    }

    @media (max-width: 499px){
        .bagels-col-wrapper .bcw-1{
            /* margin-bottom: var(--spc-xl-neg); */
        }

        /* .bagels-col-wrapper .fc-c-column {
            margin-bottom: var(--spc-xl);
        } */

        .bagels-col-wrapper .fc-c-column {
            width: 100%;
        }

        /* .bagels-col-wrapper.mobile-cols-2 .fc-c-column {
            width: 50%;
        } */

        .bagels-col-wrapper.mobile-cols-1 .fc-c-column{
            margin-right: 0;
        }
    }

    @media (min-width: 992px) and (max-width: 1199px) {
        .bagels-col-wrapper .fc-c-column:first-child{
            /* padding-right: 40px !important; */
        }

        .bagels-col-wrapper .fc-c-column:last-child{
            /* padding-left: 40px !important; */
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .bagels-col-wrapper .fc-c-column {
            width: 100%;
        }

        .bagels-col-wrapper.tab-cols-1 .fc-c-column{
            margin-right: 0;
        }

        /* .bagels-col-wrapper.tab-cols-4 .fc-c-column {
            width: 25%;
        }

        .bagels-col-wrapper.tab-cols-3 .fc-c-column {
            width: calc( 100% / 3 );
        }

        .bagels-col-wrapper.tab-cols-2 .fc-c-column {
            width: 50%;
        } */
    }
/* Columnar section */

/* Sub columns */
    .fce-sub-cols .fce-sc-c-heading {
        margin-bottom: 14px;
    }

    @media (min-width: 500px) {
        .fce-sub-cols .fce-sc-column:first-child{
            margin-right: 40px;
        }
    }

    @media (min-width: 992px) {
        .fce-sub-cols .fce-sc-column:first-child{
            margin-right: 20px;
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .fce-sub-cols .bcw-1 {
            display: flex;
        }

        /* .bagels-col-wrapper.fce-sub-cols .fc-c-column {
            margin-top: 0px !important;
        } */
    }

    @media (max-width: 499px) {
        .bagels-col-wrapper.fce-sub-cols .bcw-1{
            /* margin-bottom: 50px; */
        }
    }
/* Sub columns */

/* VS stage boxes */
    .bagels-vs-box{
        width: 50%;
        padding-top: 90px;
        padding-bottom: 90px;
        padding-left: var(--bagels-pg-margin);
        padding-right: var(--bagels-pg-margin);
    }

    .bagels-vs-box .bvsb-heading{
        margin-bottom: 27px;
    }
    
    .bagels-vs-box .bvsb-description{
        margin-bottom: 54px;
    }

    @supports ( display: -webkit-box ) and ( -webkit-line-clamp: 2 ) and ( -webkit-box-orient: vertical ) {
        .bagels-vs-box .bagels-heading .bh-1{
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            word-break: break-word;
        }
    }

    @supports ( display: -webkit-box ) and ( -webkit-line-clamp: 10 ) and ( -webkit-box-orient: vertical ) {
        .bagels-vs-box .fce-text-area > p{
            display: -webkit-box;
            -webkit-line-clamp: 10;
            -webkit-box-orient: vertical;
            overflow: hidden;
            word-break: break-word;
        }
    }

    .bagels-vs-box.boxes-1{
        width: 100%;
    }

    @media (min-width: 1366px) {

        /* .bagels-vs-box.boxes-3:nth-child(3){
            width: 100%;
        }

        .bagels-vs-box:not(.boxes-3):not(.boxes-1):nth-child( odd ){
            padding-right: 95px;
        }

        .bagels-vs-box:nth-child( even ){
            padding-left: 95px;
        } */
         
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box{
            width: 25%;
        }
         
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-4,
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-3,
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-3,
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-4{
            padding: 60px 50px;
        }

        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box,
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-3,
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-3{
            width: calc( 100% / 3 );
        }
         
        .fce-colored-boxes.boxes-per-line-2 .bagels-vs-box,
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-2,
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-2{
            width: 50%;
        }
         
        .fce-colored-boxes.boxes-per-line-1 .bagels-vs-box,
        .fce-colored-boxes.boxes-per-line-2 .bagels-vs-box.boxes-1,
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-1,
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-1,
        .bagels-vs-box.boxes-3:nth-child(3){
            width: 100%;
        }

        /* .bagels-vs-box:not(.boxes-3):not(.boxes-1):nth-child( odd ){
            padding-right: 95px;
        } */

        .fce-colored-boxes.boxes-per-line-2 .bagels-vs-box:nth-child( odd ),
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-2:nth-child( odd ),
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-2:nth-child( odd ),
        .bagels-vs-box.boxes-2:nth-child( odd ){
            padding-right: 95px;
        }

        .fce-colored-boxes.boxes-per-line-1 .bagels-vs-box,
        .fce-colored-boxes.boxes-per-line-2 .bagels-vs-box:last-child{
            padding-right: var(--bagels-pg-margin);
        }

        /* .bagels-vs-box:nth-child( even ){
            padding-left: 95px;
        } */

        .fce-colored-boxes.boxes-per-line-2 .bagels-vs-box:nth-child( even ),
        .fce-colored-boxes.boxes-per-line-4 .bagels-vs-box.boxes-2:nth-child( even ),
        .fce-colored-boxes.boxes-per-line-3 .bagels-vs-box.boxes-2:nth-child( even ),
        .bagels-vs-box.boxes-2:nth-child( even ){
            padding-left: 95px;
        }
        
        .fce-colored-boxes.boxes-per-line-4.boxes-remainder-3 .bagels-vs-box:nth-last-child( -n+3 ){
            width: calc( 100% / 3 );
        }
        
        .fce-colored-boxes.boxes-per-line-3.boxes-remainder-2 .bagels-vs-box:nth-last-child( -n+2 ),
        .fce-colored-boxes.boxes-per-line-4.boxes-remainder-2 .bagels-vs-box:nth-last-child( -n+2 ){
            width: 50%;
        }
        
        .fce-colored-boxes.boxes-per-line-2.boxes-remainder-1 .bagels-vs-box:last-child,
        .fce-colored-boxes.boxes-per-line-4.boxes-remainder-1 .bagels-vs-box:last-child,
        .fce-colored-boxes.boxes-per-line-3.boxes-remainder-1 .bagels-vs-box:last-child{
            width: 100%;
        }

        .fce-colored-boxes.boxes-per-line-1 .bagels-vs-box{
            padding-left: var(--bagels-pg-margin);
        }
    }

    @media (max-width: 1199px) {
        .bagels-vs-box{
            padding-top: 45px;
            padding-bottom: 45px;
            min-height: 480px !important;
        }
    }

    @media (max-width: 991px) {
        .bagels-vs-box{
            width: 100%;
        }
    }

    @media (max-width: 767px) {
        .bagels-vs-box{
            /* padding-left: 21px; */
            /* padding-right: 21px; */
            padding-left: 30px;
            padding-right: 30px;
            padding-top: 26px;
            padding-bottom: 40px;
        }

        @supports ( -webkit-line-clamp: 12 ){
            .bagels-vs-box .fce-text-area > p{
                -webkit-line-clamp: 12;
            }
        }
    }

    @media (max-width: 499px) {
        .bagels-vs-box{
            padding-left: 15px;
            padding-right: 15px;
        }
        
        .bagels-vs-box .bvsb-heading{
            margin-bottom: 20px;
        }

        .bagels-vs-box .bvsb-description{
            margin-bottom: 48px;
        }
    }
/* VS stage boxes */

/* News boxes */
    .bagels-news-box {
        width: calc( ( 100% / 3) - ( ( var(--spc-2xl) * 2 ) / 3 ) );
        margin-right: var(--spc-2xl);
        margin-bottom: var(--spc-2xl);
        overflow: hidden;
        border-radius: 8px;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .bagels-news-box.hover-zoom:focus {
        transform: scale(1.02);
    }

    .bagels-news-box .bnb-l-img .b-cover-img{
        object-position: left;
    }

    .bagels-news-box .bnb-link:focus .bnb-l-img img{
        /* transform: scale(1.02); */
    }

    .bagels-news-box .bnb-link{
        background-color: var(--bagels-neutral_50);
        height: 100%;
    }

    .bagels-news-box.dark .bnb-link{
        background-color: var(--bagels-neutral_900);
    }

    .bagels-news-box.hover-bg-col-change .bnb-link:focus{
        background-color: var(--bagels-neutral_100);
    }

    .bagels-news-box.hover-bg-col-change.dark .bnb-link:focus{
        background-color: var(--bagels-neutral_800);
    }

    .bagels-news-box .bnb-l-content {
        padding: var(--spc-xl);
        height: calc( 100% - 250px );
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .bagels-news-box .bnb-l-img {
        height: 250px;
    }

    .bagels-news-box .bnb-link:focus .bnb-l-img > .section-overlay{
        opacity: 0;
    }

    .bagels-news-box .bnb-l-c-date {
        margin-top: var(--spc-md);
        color: var(--bagels-neutral_600);
        font-size: var(--fs-sm);
        line-height: var(--lh-sm);
    }
    
    .bagels-news-box.dark .bnb-l-c-date {
        color: var(--bagels-neutral_400);
    }
    
    .bagels-news-box .bnb-l-c-read-more {
        margin-top: var(--spc-3xl);
        color: var(--bagels-dark);
    }

    .bagels-news-box .bnb-l-c-rm-i-img {
        margin-left: 5px;
    }
    
    .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1{
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    
    .bagels-news-box.dark .bnb-l-c-read-more,
    .bagels-news-box.dark .bnb-l-c-cat .bagels-heading .bh-1,
    .bagels-news-box.dark .bnb-l-c-title .bagels-heading .bh-1{
        color: var(--bagels-neutral_50);
    }
    
    @supports ( display: -webkit-box ) and ( -webkit-line-clamp: 4 ) and ( -webkit-box-orient: vertical ) {
        .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1{
            display: -webkit-box;
            -webkit-line-clamp: 4;
            -webkit-box-orient: vertical;  
            white-space: normal;
            text-overflow: unset;
        }
    }

    @media (min-width: 992px) {
        .bagels-news-box .bnb-link:hover .bnb-l-img > .section-overlay{
            opacity: 0;
        }

        .bagels-news-box.hover-bg-col-change .bnb-link:hover{
            background-color: var(--bagels-neutral_100);
        }

        .bagels-news-box.hover-bg-col-change.dark .bnb-link:hover{
            background-color: var(--bagels-neutral_800);
        }

        .bagels-news-box.hover-zoom:hover {
            transform: scale(1.02);
        }

        .bagels-news-box .bnb-link:hover .bnb-l-img img{
            /* transform: scale(1.02); */
        }
         
        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child {
            width: 100%;
            margin-right: 0;
        }
        
        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-link {
            display: flex;
            height: 390px;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-img {
            height: 100%;
            min-width: 50%;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-c-title {
            margin-top: 5px;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-c-title .bagels-heading .bh-1{
            font-size: var(--fs-xl);
            line-height: var(--lh-xl);
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box .bnb-l-content{
            height: 100%;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box .bnb-l-content {
            padding: 23px 33px 28px;
        }
    }

    @media (min-width: 1200px) {
        .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child( 3n + 1 ),
        .bagels-news-box:nth-child( 3n ) {
            margin-right: 0;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child( 3n ) {
            margin-right: var(--spc-2xl);
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-link {
            height: 540px;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-c-title .bagels-heading .bh-1{
            font-size: var(--fs-3xl);
            line-height: var(--lh-3xl);
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-c-cat .bagels-heading .bh-1,
        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-c-date{
            font-size: var(--fs-md);
            line-height: var(--lh-md);
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:first-child .bnb-l-content {
            padding: var(--spc-3xl);
        }
    }

    @media (max-width: 1679px) {
        .bagels-news-box .bnb-l-img {
            height: 240px;
        }

        .bagels-news-box .bnb-l-content {
            height: calc( 100% - 240px );
        }
    }

    @media (max-width: 1439px) {
        .bagels-news-box .bnb-l-content {
            padding: 18px 20px;
        }
    }

    @media (max-width: 1365px) {
        .bagels-news-box{
            width: calc( ( 100% / 3 ) - ( ( var(--spc-xl) * 2 ) / 3 ) );
            margin-right: var(--spc-xl);
            margin-bottom: var(--spc-xl);
        }
    }

    @media (max-width: 1199px) {
        .bagels-news-box{
            width: calc( ( 100% / 3 ) - ( ( 20px * 2 ) / 3 ) ) ;
            margin-right: 20px;
        }

        .bagels-news-box .bnb-l-img {
            height: 180px;
        }

        .bagels-news-box .bnb-l-content {
            height: calc( 100% - 180px );
        }

        .bagels-news-box .bnb-l-c-read-more{
            margin-top: 50px;
        }
        
        .bagels-news-box .bnb-l-content{
            padding: 20px;
        }
    }

    @media (max-width: 991px) {
        .bagels-news-box .bnb-link:active .bnb-l-img > .section-overlay{
            opacity: 0;
        }

        .bagels-news-box.hover-zoom:active {
            transform: scale(1.02);
        }

        .bagels-news-box.hover-bg-col-change .bnb-link:active{
            background-color: var(--bagels-neutral_100);
        }

        .bagels-news-box.hover-bg-col-change.dark .bnb-link:active{
            background-color: var(--bagels-neutral_800);
        }

        .bagels-news-box {
            width: calc( ( 100% / 2 ) - ( ( var(--spc-xl) ) / 2 ) );
        }

        .bagels-news-box:nth-child(2n){
            margin-right: 0;
        }

        .pg-temp-news .bagels-news-box .bnb-l-img {
            height: 210px;
        }
        
        @supports ( display: -webkit-box ) and ( -webkit-line-clamp: 2 ) and ( -webkit-box-orient: vertical ){
            .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1{
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                white-space: normal;
                text-overflow: unset;
            }
        }
    }

    @media (max-width: 499px) {
        .bagels-news-box{
            width: 100%;
            margin-right: 0;
            margin-bottom: var(--spc-lg);
        }

        .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1{
            /* font-size: var(--fs-xl); */
        }

        .bagels-news-box .bnb-l-content{
            padding: 25px;
        }
    }

    @media (min-width: 1200px) and (max-width: 1365px) {
        .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1 {
            font-size: 29px;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child( 3n ) {
            margin-right: var(--spc-xl);
        }
    }

    @media (min-width: 992px) and (max-width: 1365px) {
        /* .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child( 2n + 1 ), */
        .bagels-news-box:nth-child(3n){
            margin-right: 0;
        }
    }

    @media (min-width: 992px) and (max-width: 1199px) {
        .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child(3n){
            margin-right: 20px;
        }

        .fce-news-boxes.highlight-first-box .bagels-news-box:nth-child(3n + 1){
            margin-right: 0px;
        }
    }

    @media (min-width: 768px) and (max-width: 991px) {
        .pg-temp-news .bagels-news-box:nth-child(odd){
            margin-right: var(--spc-xl);
        }
    }

    @media (min-width: 500px) and (max-width: 1199px) {
        .bagels-news-box .bnb-l-c-title .bagels-heading .bh-1 {
            font-size: 23px;
            line-height: 30px;
        }
        
        .bagels-news-box .bnb-l-c-cat .bagels-heading .bh-1,
        .bagels-news-box .bnb-l-c-read-more,
        .bagels-news-box .bnb-l-c-date{
            font-size: 14px;
        }
    }
/* News boxes */

/* Company boxes */
    .bagels-company-box.hover-zoom:focus {
        transform: scale(1.01);
    }

    .bagels-company-box .bcb-link {
        background-color: var(--bagels-neutral_50);
    }

    .bagels-company-box.dark .bcb-link {
        background-color: var(--bagels-neutral_900);
    }

    .bagels-company-box.hover-bg-col-change a.bcb-link:hover {
        background-color: var(--bagels-neutral_100);
    }

    .bagels-company-box.hover-bg-col-change.dark a.bcb-link:hover {
        background-color: var(--bagels-neutral_800);
    }

    .bagels-company-box .bcb-l-img{
        min-width: 50%;
    }

    .bagels-company-box:hover a.bcb-link .bcb-l-img .section-overlay{
        opacity: 0;
    }

    .bagels-company-box .bcb-l-text {
        padding: 60px 55px 55px;
        min-height: 540px;
    }

    .bagels-company-box .bcb-l-t-company {
        margin-bottom: 7px;
    }

    .bagels-company-box .bcb-l-t-title{
        margin-bottom: var(--spc-md);
    }

    .bagels-company-box .bcb-l-c-read-more {
        margin-top: 18px;
        /* color: var(--bagels-light); */
    }

    .bagels-company-box .bcb-l-c-rm-icon {
        font-size: 12px;
    }

    .bagels-company-box .bcb-l-t-descr p,
    .bagels-company-box .bcb-l-t-descr {
        margin-top: 24px;
    }

    .bagels-company-box .bcb-l-t-bottom-text {
        margin-top: 15px;
        font-size: 14px;
    }

    .bagels-company-box .bcb-l-t-descr p:first-child{
        margin-top: 0;
    }

    .bagels-company-box .bcb-l-t-descr,
    .bagels-company-box .bcb-l-t-descr p{
        font-size: var(--fs-md);
    }
    
    @media (min-width: 992px) {
        .bagels-company-box.hover-zoom:hover {
            transform: scale(1.01);
        }

        .bagels-company-box.hover-bg-col-change a.bcb-link:hover {
            background-color: var(--bagels-neutral_100);
        }

        .bagels-company-box.hover-bg-col-change.dark a.bcb-link:hover {
            background-color: var(--bagels-neutral_800);
        }
    }
    
    @media (min-width: 1200px) {
        .bagels-company-box .bcb-link.switch-boxes{
            flex-direction: row-reverse;
            justify-content: space-between;
        }
    }
    
    @media (min-width: 1440px) {
        .bagels-company-box .bcb-link {
            /* width: 85vw; */
        }
    }

    @media (min-width: 1680px) {
        /* .fce-common-slider .fce-cb-1 .owl-item{
            width: 95%;
        }

        .bagels-company-box{
            width: 100%;
        } */

        .bagels-company-box .bcb-link {
            /* width: 79vw; */
            /* width: auto; */
        }
    }        

    @media (max-width: 1365px) {
        .bagels-company-box .bcb-l-text{
            padding: 50px 45px 45px;
        }
    }

    @media (max-width: 1199px) {
        .bagels-company-box .bcb-l-img {
            min-width: 50%;
        }

        .bagels-company-box .bcb-l-text{
            min-height: 395px;
        }
    }

    @media (max-width: 991px) {
        .bagels-company-box.hover-zoom:active {
            transform: scale(1.01);
        }

        .bagels-company-box.hover-bg-col-change a.bcb-link:active {
            background-color: var(--bagels-neutral_100);
        }

        .bagels-company-box.hover-bg-col-change.dark a.bcb-link:active {
            background-color: var(--bagels-neutral_800);
        }

        .bagels-company-box .bcb-l-text{
            min-height: 350px;
        }
    }

    @media (max-width: 499px) {
        .bagels-company-box .bcb-link{
            width: 100%;
            flex-direction: column;
        }

        .bagels-company-box .bcb-l-text {
            padding: 30px 25px;
            min-height: 260px;
        }

        .bagels-company-box .bcb-l-img {
            height: 240px;
        }

        .bagels-company-box .bcb-l-t-title .bagels-heading .bh-1{
            -webkit-line-clamp: 3;
        }
    }

    @media (min-width: 992px) and (max-width: 1199px) {
        .bagels-company-box .bcb-link{
            /* width: 54vw; */
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .bagels-company-box .bcb-link{
            /* width: 80vw; */
        }
    }
/* Company boxes */

/* Background image box */
    .bagels-i-bg-box-single {
        width: calc( ( 100% / 3 ) - ( var(--spc-2xl) * 2 / 3 ) );
        margin-right: var(--spc-2xl);
        margin-bottom: var(--spc-2xl);
        min-height: 540px;
    }

    .bagels-i-bg-box-single .b-i-bg-bs-0{
        /* padding: var(--spc-2xl); */
        padding: var(--spc-xl);
    }

    .bagels-i-bg-box-single .bagels-i-bg-box-s-r-descr {
        margin-top: var(--spc-md);
    }

    .bagels-i-bg-box-single .b-i-bg-box-s-row-2 {
        margin-top: var(--spc-xl);
    }
    
    .bagels-i-bg-box-single .b-i-bg-box-s-r-sub-heading {
        margin-bottom: 6px;
    }

    .bagels-i-bg-box-single .b-i-bg-box-s-r-heading .bh-1,
    .bagels-i-bg-box-single .bagels-i-bg-box-s-r-descr,
        .bagels-i-bg-box-single .b-i-bg-box-s-r-sub-heading .bh-1 {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .bagels-i-bg-box-single .b-i-bg-box-s-r-heading .bh-1 {
        -webkit-line-clamp: 3;
    }
    
    .bagels-i-bg-box-single .bagels-i-bg-box-s-r-descr{
        -webkit-line-clamp: 4;
    }

    .bagels-i-bg-box-single .b-i-bg-bs-0:focus > .section-overlay{
        opacity: 0.3 !important;
    }

    .bagels-i-bg-box-single .b-i-bg-bs-0:focus .b-cover-img{
        filter: blur(2.5px) !important;
    }

    @media (min-width: 992px) {
        .bagels-i-bg-box-single:nth-child(3n) {
            margin-right: 0;
        }

        .bagels-i-bg-box-single .b-i-bg-bs-0:hover > .section-overlay{
            opacity: 0.3 !important;
        }

        .bagels-i-bg-box-single .b-i-bg-bs-0:hover .b-cover-img{
            filter: blur(2.5px) !important;
        }
    }

    @media (max-width: 1365px) {
        .bagels-i-bg-box-single{
            min-height: 460px;
        }
        
        .bagels-i-bg-box-single .b-i-bg-bs-0{
            padding: var(--spc-xl);
        }
    }

    @media (max-width: 1199px) {
        .bagels-i-bg-box-single{
            margin-right: var(--spc-xl);
            margin-bottom: var(--spc-xl);
            width: calc( ( 100% / 3 ) - ( var(--spc-xl) * 2 / 3 ) );
        }

        .bagels-i-bg-box-single .b-i-bg-box-s-r-heading .bagels-heading .bh-1{
            font-size: var(--fs-xl);
            line-height: var(--lh-xl);
        }

        .bagels-i-bg-box-single .b-i-bg-box-s-r-sub-heading .bagels-heading .bh-1{
            font-size: var(--fs-sm);
            line-height: var(--lh-sm);
        }

        .bagels-i-bg-box-single .bagels-i-bg-box-s-r-descr{
            font-size: var(--fs-sm);
            line-height: var(--lh-sm);
        }
    }

    @media (max-width: 991px) {
        .bagels-i-bg-box-single{
            width: calc( 50% - ( var(--spc-lg) / 2 ) );
            margin-right: var(--spc-lg);
            margin-bottom: var(--spc-lg);
        }
        
        .bagels-i-bg-box-single .b-i-bg-bs-0:active > .section-overlay{
            opacity: 0.3 !important;
        }

        .bagels-i-bg-box-single .b-i-bg-bs-0:active .b-cover-img{
            filter: blur(2.5px) !important;
        }
    }

    @media (max-width: 499px) {
        .bagels-i-bg-box-single{
            width: 100%;
            margin-right: 0;
            margin-bottom: var(--spc-xl);
        }

        .bagels-i-bg-box-single .b-i-bg-box-s-r-heading .bagels-heading .bh-1 {
            font-size: var(--fs-3xl);
            line-height: var(--lh-3xl);
        }

        .bagels-i-bg-box-single .b-i-bg-box-s-r-sub-heading .bagels-heading .bh-1 {
            font-size: var(--fs-md);
            line-height: var(--lh-md);
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .bagels-i-bg-box-single:nth-child(2n) {
            margin-right: 0;
        }

    }
/* Background image box */
/* Theme elements */

/* Flexible content */
.fce-full-width{
    margin-left: calc( ( 100vw - 100% ) / -2 );
    margin-right: calc( ( 100vw - 100% ) / -2 );
    width: 100vw;
}

@media (min-width: 992px) {
    .fce-full-width-lg{
        margin-left: calc( ( 100vw - 100% ) / -2 );
        margin-right: calc( ( 100vw - 100% ) / -2 );
        width: 100vw;
    }
}

@media (min-width: 1920px) {
    .fce-full-width{
        margin-left: calc( ( 1920px - 100% ) / -2 );
        margin-right: calc( ( 1920px - 100% ) / -2 );
    }
}

@media (min-width: 500px) and (max-width: 991px) {
    .fce-full-width-ipad{
        margin-left: calc( ( 100vw - 100% ) / -2 );
        margin-right: calc( ( 100vw - 100% ) / -2 );
        width: 100vw;
    }
}

@media (max-width: 499px) {
    .fce-full-width-mobile{
        margin-left: calc( ( 100vw - 100% ) / -2 );
        margin-right: calc( ( 100vw - 100% ) / -2 );
        width: 100vw;
    }
}

/* Text area */
    .fce-text-area{
        display: flex;
    }

    .fce-text-area.left{
        text-align: left;
        /* justify-content: flex-start; */
    }

    .fce-text-area.center{
        text-align: center;
        /* justify-content: center; */
    }

    .fce-text-area.right{
        text-align: right;
        /* justify-content: flex-end; */
    }
    
    @media (min-width: 500px) {
        .fce-text-area.ws-middle{
            display: flex;
            justify-content: center;
        }
    }
/* Text area */

/* Simple text line */
    .fce-simple-text{
        display: flex;
    }

    .fce-simple-text.left{
        text-align: left;
        /* justify-content: flex-start; */
    }

    .fce-simple-text.center{
        text-align: center;
        /* justify-content: center; */
    }

    .fce-simple-text.right{
        text-align: right;
        /* justify-content: flex-end; */
    }
    
    @media (min-width: 500px) {
        .fce-simple-text.ws-middle{
            display: flex;
            justify-content: center;
        }
    }
/* Simple text line */

/* Heading */
    .fce-title .sub-title{
        margin-bottom: 2px;
    }
/* Heading */

/* News boxes */
    .fce-news-boxes .fce-nb-1{
        margin-bottom: calc( var(--spc-2xl) * -1 );
    }

    @media (max-width: 1365px) {
        .fce-news-boxes .fce-nb-1{
            margin-bottom: calc( var(--spc-xl) * -1 );
        }
    }

    @media (max-width: 991px) {
        .fce-news-boxes .fce-nb-1.ipad-slider{
            margin-bottom: 0;
        }

        .fce-news-boxes .fce-nb-1.ipad-slider .owl-stage-outer{
            padding: 7px 0px 7px 5px;
            margin-left: -5px;
        }

        .fce-news-boxes .fce-nb-1.slides-more-than-2.ipad-slider .owl-stage-outer{
            padding-bottom: 65px;
        }

        .fce-news-boxes .fce-nb-1.ipad-slider .bagels-news-box{
            margin-right: 0;
            margin-bottom: 0;
            /* width: auto; */
            width: 44vw;
        }
    }

    @media (max-width: 499px) {
        .fce-news-boxes .fce-nb-1{
            margin-bottom: calc( var(--spc-lg) * -1 );
        }
        
        .fce-news-boxes .fce-nb-1.ipad-slider{
            margin-bottom: 0;
        }

        .fce-news-boxes .fce-nb-1.ipad-slider .bagels-news-box{
            width: 86vw;
        }

        .fce-news-boxes .fce-nb-1.slides-more-than-2.ipad-slider .owl-stage-outer,
        .fce-news-boxes .fce-nb-1.slides-more-than-1.ipad-slider .owl-stage-outer{
            /* padding-bottom: 50px; */
            padding-bottom: 60px;
        }
    }
/* News boxes */

/* Company boxes */
    .fce-common-slider{
        position: relative;
    }

    .fce-common-slider .fce-cb-1.overflow-right .owl-stage-outer{
        /* padding: 7px;
        margin: -7px;
        margin-right: 0; */
        overflow: visible;
    }

    /* .fce-common-slider .fce-cb-1.slides-more-than-2 .owl-stage-outer {
        padding-top: 64px;
    } */

    .fce-common-slider .fce-cb-1 .owl-dots{
        justify-content: center;
        display: flex;
        margin-top: 24px;
    }

    .fce-common-slider .fce-cb-1 .owl-dots.disabled{
        margin-top: 0;
        display: none;
    }

    @media (min-width: 768px) {
        .fce-common-slider .fce-cb-left-blocker{
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            width: var(--bagels-pg-margin-cont);
            left: var(--bagels-pg-margin-cont-negated);
            z-index: 2;
        }
    }

    @media (min-width: 1200px) {
        /* .fce-common-slider .fce-cb-1.slides-more-than-1 .owl-stage-outer {
            padding-top: 64px;
        } */
    }

    @media (max-width: 1199px) {
        .fce-common-slider .bagels-company-box .bcb-link{
            flex-direction: column;
        }

        .fce-common-slider .bagels-company-box .bcb-l-img{
            height: 310px;
        }

        .fce-common-slider .bagels-company-box .bcb-l-text {
            padding: 40px 35px 35px;
        }
    }

    @media (max-width: 499px) {
        .fce-common-slider .bagels-company-box .bcb-link{
            /* width: 86vw; */
            width: 89vw;
        }

        .fce-common-slider .bagels-company-box .bcb-l-img {
            height: 240px;
        }

        .fce-common-slider .bagels-company-box .bcb-l-text {
            padding: 30px 25px;
        }
    }

    @media (min-width: 992px) and (max-width: 1199px) {
        .fce-common-slider .bagels-company-box .bcb-l-img {
            height: 290px;
        }

        .fce-common-slider .bagels-company-box .bcb-l-text{
            min-height: 390px;
        }
    }

    @media (min-width: 992px) and (max-width: 1199px) {
        .fce-common-slider .bagels-company-box .bcb-l-t-title .bagels-heading .bh-1{
            font-size: 36px;
            line-height: 47px;
        }

        .fce-common-slider .bagels-company-box .bcb-l-t-company .bagels-heading .bh-1{
            font-size: 16px;
            line-height: 21px;
        }
    }

    @media (min-width: 768px) and (max-width: 991px) {
        .fce-common-slider .bagels-company-box .bcb-l-img {
            height: 380px;
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .fce-common-slider .bagels-company-box .bcb-link {
            width: 85vw;
        }

        .fce-common-slider .bagels-company-box .bcb-l-text {
            min-height: 450px;
        }
    }

    /* @media (max-width: 499px) {
        .fce-common-slider .fce-cb-1.slides-more-than-1 .owl-stage-outer {
            padding-top: 51px;
        }
    } */
/* Company boxes */

/* Common slider section */
    .fce-common-slider-1{
        /* padding-top: 80px; */
        /* padding-bottom: 95px; */
    }
    
    /* .fce-common-slider-1.circle-img .bcb-l-img{
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .fce-common-slider-1.circle-img .bcb-1{
        overflow: hidden;
        border-radius: 50%;
        position: relative;
    } */

    @media (min-width: 1200px) {
        .fce-common-slider-1.circle-img .bcb-l-img{
            padding: 50px 0 45px 45px;
            min-width: 454px;
            justify-content: flex-end;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .fce-common-slider-1.circle-img .bagels-company-box .bcb-link.switch-boxes .bcb-l-img{
            padding-right: 45px;
            padding-left: 0;
        }

        .fce-common-slider-1.circle-img .bcb-1{
            width: 400px;
            height: 400px;
            overflow: hidden;
            border-radius: 50%;
            position: relative;
        }

        .fce-common-slider-1.circle-img .bcb-l-text{
            min-height: auto;
        }
    }

    @media (min-width: 1366px) {
        .fce-common-slider-1.circle-img .bcb-l-img{
            padding: 54px 0 54px 54px;
        }

        .fce-common-slider-1.circle-img .bagels-company-box .bcb-link.switch-boxes .bcb-l-img{
            padding-right: 54px;
            padding-left: 0;
        }
    }

    @media (max-width: 1199px) {
        /* .fce-common-slider-1.circle-img .bcb-1{
            width: 410px;
            height: 410px;
            margin-top: 45px;
        }

        .fce-common-slider-1.circle-img .fce-common-slider .bagels-company-box .bcb-l-img{
            height: auto;
        } */
    }

    @media (max-width: 991px) {
        /* .fce-common-slider-1.circle-img .bcb-1{
            width: 500px;
            height: 500px;
        } */
    }

    @media (max-width: 499px) {
        /* .fce-common-slider-1.circle-img .bcb-1 {
            width: 272px;
            height: 272px;
            margin-top: 25px;
        } */
    }
/* Common slider section */

/* Section image */
    @media (min-width: 1366px) and (max-width: 1439px) and (max-height: 700px) and (orientation: landscape) {
        .fce-img .fce-i-1{
            max-height: 610px;
        }
    }
/* Section image */

/* Background image */
    .fce-img-bg-0{
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }
/* Background image */

/* Success stories logo slider */
    .fce-success-story-slider img.fce-ss-iw-l-img{
        width: auto;
        max-height: 48px;
    }

    .fce-success-story-slider .fce-ss-1 .owl-stage-outer {
        padding: 10px;
    }

    @media (min-width: 992px) {
        .fce-success-story-slider .fce-ss-iw-1:focus .fce-ss-iw-l-img,
        .fce-success-story-slider .fce-ss-iw-1:hover .fce-ss-iw-l-img{
            transform: scale(1.1);
        }
    }

    @media (max-width: 991px) {
        .fce-success-story-slider .fce-ss-iw-1:active .fce-ss-iw-l-img{
            transform: scale(1.1);
        }
    }
/* Success stories logo slider */

/* Image slider */
    .fce-image-slider .fce-is-link:focus .fce-is-l-img{
        transform: scale(1.05);
    }

    .fce-image-slider .fce-is-2.slides-more-than-1 .owl-stage-outer {
        padding-top: 64px;
    }

    .fce-image-slider .fce-is-link {
        height: 485px;
        width: 100%;
    }

    @media (min-width: 992px) {
        .fce-image-slider .fce-is-link:hover .fce-is-l-img{
            transform: scale(1.05);
        }
    }

    @media (max-width: 991px) {
        .fce-image-slider .fce-is-link:active .fce-is-l-img{
            transform: scale(1.05);
        }

        .fce-image-slider .fce-is-2.slides-more-than-1 .owl-stage-outer {
            padding-top: 0px;
            /* padding-bottom: 65px; */
            padding-bottom: 75px;
        }

        .fce-image-slider .fce-is-2 .owl-nav > button{
            /* bottom: 0; */
            bottom: 7px;
        }

        .fce-image-slider .fce-is-link {
            height: 410px;
        }
    }

    @media (max-width: 767px) {
        .fce-image-slider .fce-is-2.slides-more-than-1 .owl-stage-outer {
            padding-top: 0;
        }
    }

    @media (max-width: 499px) {
        .fce-image-slider .fce-is-2.slides-more-than-1 .owl-stage-outer{
            padding-bottom: 65px;
        }

        .fce-image-slider .fce-is-link {
            height: 230px;
        }
    }
/* Image slider */

/* Services animated section */
    .bagels-service-anim-section .bsas-col-1{
        margin-right: 140px;
    }

    .bagels-service-anim-section .bsas-img{
        width: 480px;
    }
    
    .bagels-service-anim-section{
        padding-top: 90px;
        padding-bottom: 90px;
    }

    .bagels-service-anim-section .fce-link-buttons .fce-lb-1{
        width: 100%;
    }

    @media (min-width: 1366px) {
        .bagels-service-anim-section .bsas-text {
            width: 37%;
        }
    }

    @media (min-width: 1440px) {
        .bagels-service-anim-section .bsas-text{
            width: 34%;
        }
    }

    @media (max-width: 1365px) {
        .bagels-service-anim-section .bsas-col-1{
            margin-right: 90px;
        }
    }

    @media (max-width: 1199px) {
        .bagels-service-anim-section .bsas-img{
            width: 400px;
        }
    }

    @media (max-width: 991px) {
        .bagels-service-anim-section{
            flex-direction: column;
        }

        .bagels-service-anim-section .bsas-col-1 {
            margin-right: 0px;
            margin-bottom: 60px;
        }

        .bagels-service-anim-section.has-text-first{
            flex-direction: column-reverse;
        }

        .bagels-service-anim-section.has-text-first .bsas-col-1 {
            margin-bottom: 0;
        }

        .bagels-service-anim-section.has-text-first .bsas-col-2 {
            margin-bottom: 60px;
        }

        .bagels-service-anim-section .bsas-text {
            width: 75%;
        }
    }

    @media (max-width: 499px) {
        .bagels-service-anim-section {
            padding-top: 55px;
            padding-bottom: 55px;
        }

        .bagels-service-anim-section .bsas-text {
            width: 100%;
        }

        .bagels-service-anim-section .bsas-img {
            width: 275px;
        }

        .bagels-service-anim-section .bsas-col-1,
        .bagels-service-anim-section.has-text-first .bsas-col-2 {
            margin-bottom: 40px;
        }

        .bagels-service-anim-section.has-text-first .bsas-col-1 {
            margin-bottom: 0;
        }
    }
/* Services animated section */

/* Text cubes */
    .bagels-text-cube {
        background-color: var(--bagels-neutral_50);
        border-radius: 8px;
        overflow: hidden;
        padding: var(--spc-lg);
    }

    .bagels-text-cube .btc-icon {
        margin-bottom: 8px;
        font-size: 23px;
        color: var(--bagels-bright_color_a_500);
    }
    
    .bagels-text-cube .btc-title {
        margin-bottom: 10px;
    }

    .bagels-text-cube .btc-descr{
        color: var(--bagels-neutral_600);
    }

    .bagels-text-cube .btc-descr.light{
        color: var(--bagels-neutral_400);
    }
/* Text cubes */

/* Custom lists */
    .fce-custom-list-element .fce-cle-list{
        margin-bottom: -4px;
        padding-left: 20px;
    }
    
    .fce-custom-list-element.has-icon-alt .fce-cle-list{
        padding-left: 0;
    }

    /* .fce-custom-list-element.has-icon .fce-cle-list{
        padding-left: 12px;
    } */

    .fce-custom-list-element .fce-cle-l-item{
        margin-bottom: 7px;
    }

    .fce-custom-list-element.has-icon .fce-cle-l-item{
        list-style: none;
    }

    .fce-custom-list-element.has-icon-alt .fce-cle-l-item::marker{
        content: '';
    }

    .fce-custom-list-element.has-icon .fce-cle-l-item{
        padding-left: 0px;
        display: flex;
        align-items: baseline;
    }

    .fce-custom-list-element .fce-cle-l-i-img {
        width: 16px;
        margin-right: 5px;
        top: 3px;
        position: relative;
    }

    .fce-custom-list-element .fce-cle-l-i-link {
        text-decoration: underline;
    }

    .fce-custom-list-element .fce-cle-l-i-link:focus{
        color: var(--bagels-bright_color_a_600);   
    }

    .fce-custom-list-element.light .fce-cle-l-i-link:focus{
        color: var(--bagels-neutral_200);
    }

    .fce-custom-list-element.has-icon .fce-cle-l-item::marker {
        font-family: 'Font Awesome 6 Pro';
        font-weight: 600;
        position: absolute;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }
    
    .fce-custom-list-element.li-check .fce-cle-l-item::marker {
        content: '\f00c';
    }
    
    .fce-custom-list-element.li-page-dog-eared .fce-cle-l-item::marker {
        content: '\f15b';
    }

    .fce-custom-list-element .fce-cle-l-item:hover::marker,
    .fce-custom-list-element .fce-cle-l-i-link:hover {
        color: var(--bagels-bright_color_a_600);
    }

    .fce-custom-list-element.light .fce-cle-l-i-link:hover{
        color: var(--bagels-neutral_200);
    }

    @media (min-width: 992px) {

        /* .fce-custom-list-element .fce-cle-l-item:hover .fce-cle-l-i-img {
            filter: invert(10%) sepia(62%) saturate(6692%) hue-rotate(245deg) brightness(73%) contrast(102%);
        } */
    }

    @media (max-width: 991px) {
        .fce-custom-list-element .fce-cle-l-item:active::marker,
        .fce-custom-list-element .fce-cle-l-i-link:active {
            color: var(--bagels-bright_color_a_600);
        }

        .fce-custom-list-element.light .fce-cle-l-i-link:active{
            color: var(--bagels-neutral_200);
        }

        /* .fce-custom-list-element .fce-cle-l-item:active .fce-cle-l-i-img {
            filter: invert(10%) sepia(62%) saturate(6692%) hue-rotate(245deg) brightness(73%) contrast(102%);
        } */
    }
/* Custom lists */

/* Background image boxes */
    .fce-bg-i-post-boxes .fce-bg-i-pb-og{
        margin-bottom: var(--spc-2xl-neg);
    }

    .fce-bg-i-post-boxes .fce-bg-i-pb-big-box{
        margin-bottom: var(--spc-2xl);
    }

    .fce-bg-i-post-boxes.stretched .bagels-i-bg-box-single .b-i-bg-bs-1{
        justify-content: space-between;
    }

    @media (max-width: 1199px) {
        .fce-bg-i-post-boxes .fce-bg-i-pb-og {
            margin-bottom: var(--spc-xl-neg);
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-big-box{
            margin-bottom: var(--spc-xl);
        }
    }

    @media (max-width: 991px) {
        .fce-bg-i-post-boxes .fce-bg-i-pb-og {
            margin-bottom: var(--spc-lg-neg);
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-big-box{
            margin-bottom: var(--spc-lg);
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile .owl-stage-outer{
            overflow: visible;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel .bagels-i-bg-box-single{
            width: 44vw;
            margin-right: 0;
            margin-bottom: 0;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel .bagels-i-bg-box-single{
            min-height: auto;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel .bagels-i-bg-box-single .b-i-bg-bs-1{
            min-height: 380px;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel.slides-more-than-2 .owl-stage-outer{
            padding-bottom: 65px;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile .owl-nav > button{
            bottom: 0;
        }
    }

    @media (max-width: 499px) {
        .fce-bg-i-post-boxes .fce-bg-i-pb-og {
            margin-bottom: var(--spc-xl-neg);
        }
        
        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel .bagels-i-bg-box-single{
            width: 86vw;
        }

        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel.slides-more-than-2 .owl-stage-outer,
        .fce-bg-i-post-boxes .fce-bg-i-pb-og-mobile.owl-carousel.slides-more-than-1 .owl-stage-outer{
            padding-bottom: 65px;
        }
    }
/* Background image boxes */

/* Post date */
    .fce-post-date .fce-pd-2.left{
        text-align: left;
    }

    .fce-post-date .fce-pd-2.center{
        text-align: center;
    }

    .fce-post-date .fce-pd-2.right{
        text-align: right;
    }
/* Post date */

/* Video box */
    .fce-vid-box:hover .section-overlay{
        opacity: 0.3 !important;
    }
/* Video box */

/* Multi-sized boxes */
    .fce-multi-sized-boxes .fce-msb-cell{
        padding: 70px 60px;
    }

    .fce-multi-sized-boxes .fce-msb-g-c1-right-cell,
    .fce-multi-sized-boxes .fce-msb-g-c1-left-cell,
    .fce-multi-sized-boxes .fce-msb-g-c1-wide-cell,
    .fce-multi-sized-boxes .fce-msb-g-col-2,
    .fce-multi-sized-boxes .fce-msb-g-col-1{
        width: 100%;
    }

    .fce-multi-sized-boxes .fce-msb-groups.has-wide-and-bottom-cell .fce-msb-g-c1-wide-cell,
    .fce-multi-sized-boxes .fce-msb-groups.has-right-col .fce-msb-g-col-1{
        width: calc( 100% - 33.33% );
    }

    .fce-multi-sized-boxes .fce-msb-groups.has-wide-and-bottom-cell .fce-msb-g-c1-left-cell,
    .fce-multi-sized-boxes .fce-msb-groups.has-wide-and-bottom-cell .fce-msb-g-c1-right-cell,
    .fce-multi-sized-boxes .fce-msb-groups.has-left-col .fce-msb-g-col-2{
        width: 33.33%;
    }

    .fce-multi-sized-boxes .fce-msb-groups.has-left-cell .fce-msb-g-c1-right-cell,
    .fce-multi-sized-boxes .fce-msb-groups.has-right-cell .fce-msb-g-c1-left-cell{
        width: 50%;
    }

    @media (min-width: 1024px){
        .fce-multi-sized-boxes .fce-msb-groups .fce-msb-g-col-1 > .fce-msb-g-col-2{
            display: none;
        }
    }

    @media (max-width: 1199px) {
        .fce-multi-sized-boxes .fce-msb-cell {
            padding-top: 45px;
            padding-bottom: 45px;
            padding-left: var(--bagels-pg-margin);
            padding-right: var(--bagels-pg-margin);
        }

        .fce-multi-sized-boxes .fce-msb-g-c1-right-cell,
        .fce-multi-sized-boxes .fce-msb-g-c1-left-cell{
            width: 100% !important;
        }

        .fce-multi-sized-boxes .fce-msb-groups.has-right-col .fce-msb-g-col-1 {
            width: calc( 100% - 35% );
        }
        
        .fce-multi-sized-boxes .fce-msb-groups.has-left-col .fce-msb-g-col-2 {
            width: 35%;
        }
    }

    @media (max-width: 1023px){
        .fce-multi-sized-boxes .fce-msb-groups > .fce-msb-g-col-2{
            display: none;
        }

        .fce-multi-sized-boxes .fce-msb-g-col-1 {
            width: 100% !important;
        }
    
        .fce-multi-sized-boxes .fce-msb-g-col-2,
        .fce-multi-sized-boxes .fce-msb-g-c1-right-cell,
        .fce-multi-sized-boxes .fce-msb-g-c1-left-cell{
            width: 50% !important;
        }
        
        .fce-multi-sized-boxes .fce-msb-g-c1-wide-cell{
            width: 50%;
        }
    }

    @media (max-width: 991px) {
        .fce-multi-sized-boxes .fce-msb-cell{
            padding-top: 50px;
            padding-bottom: 50px;
        }
    }

    @media (max-width: 767px) {
        .fce-multi-sized-boxes .fce-msb-cell{
            padding-left: 30px;
            padding-right: 30px;
        }
    }

    @media (max-width: 499px) {
        .fce-multi-sized-boxes .fce-msb-cell{
            padding: 45px 15px;
        }
        
        .fce-multi-sized-boxes .fce-msb-g-col-1,
        .fce-multi-sized-boxes .fce-msb-g-col-2,
        .fce-multi-sized-boxes .fce-msb-g-c1-right-cell,
        .fce-multi-sized-boxes .fce-msb-g-c1-left-cell{
            width: 100% !important;
        }

        .fce-multi-sized-boxes .fce-msb-g-c1-wide-cell {
            width: 100%;
        }
    }
/* Multi-sized boxes */

/* Element separator */
    .fc-e-element-separator .fc-e-es-1{
        height: 1px;
    }
/* Element separator */

/* Customer organizations */
    .fce-cust-orgs .fce-co-tabs{
        border-bottom: 1px solid var(--bagels-neutral_100);
    }

    .fce-cust-orgs.light .fce-co-tabs{
        border-bottom: 1px solid var(--bagels-neutral_500);
    }

    .fce-cust-orgs .fce-co-content{
        margin-top: 64px;
    }

    .fce-cust-orgs .fce-co-c-2{
        width: calc( 50% - ( 64px / 2 ) );
    }

    .fce-cust-orgs .fce-co-c-left{
        margin-right: 64px;
    }

    .fce-cust-orgs .fce-co-c-l-t-sub{
        margin-bottom: 1px;
    }

    .fce-cust-orgs .fce-co-c-l-buttons,
    .fce-cust-orgs .fce-co-c-l-descr{
        margin-top: 29px;
    }

    .fce-cust-orgs .fce-co-c-l-buttons {
        margin-bottom: -18px;
    }

    .fce-cust-orgs .fce-co-c-l-b-1 {
        margin-right: 18px;
        margin-bottom: 18px;
    }

    .fce-cust-orgs .fce-co-c-l-b-1:last-child {
        margin-right: 0;
    }

    .fce-cust-orgs .fce-co-c-right{
        height: 508px;
    }


    .fce-cust-orgs .fce-co-c-left.no-image {
        text-align: center;
        margin-right: 0;
        padding: 0;
        width: 100%;
    }

    .fce-cust-orgs .fce-co-c-left.no-image .fce-co-c-l-buttons{
        justify-content: center;
    }

    @media (min-width: 500px) {
        .fce-cust-orgs .fce-co-c-1 > .fce-co-c-right{
            display: block;
        }


        .fce-cust-orgs .fce-co-c-left.no-image .fce-co-c-l-descr,
        .fce-cust-orgs .fce-co-c-left.no-image .fce-co-c-l-title {
            max-width: 655px;
            display: table;
            margin-left: auto;
            margin-right: auto;
        }
    }

    @media (min-width: 992px) {
        .fce-cust-orgs .fce-co-c-left{
            padding-left: 64px;
        }
    }

    @media (min-width: 1200px) {
        .fce-cust-orgs .fce-co-c-left{
            padding-right: 64px;
        }
    }

    @media (max-width: 1439px) {
        .fce-cust-orgs .fce-co-c-right {
            height: 424px;
        }
    }

    @media (max-width: 1199px) {
        .fce-cust-orgs .fce-co-c-right {
            height: 338px;
        }
    }

    @media (max-width: 991px) {
        .fce-cust-orgs .fce-co-c-left{
            margin-right: 35px;
        }

        .fce-cust-orgs .fce-co-c-2 {
            width: calc( 50% - ( 35px / 2 ) );
        }

        .fce-cust-orgs .fce-co-c-right {
            height: 270px;
        }

        .fce-cust-orgs .fce-co-c-l-buttons,
        .fce-cust-orgs .fce-co-c-l-descr {
            margin-top: 23px;
        }
    }

    @media (max-width: 499px) {
        .fce-cust-orgs .fce-co-content {
            margin-top: 54px;
        }

        .fce-cust-orgs .fce-co-c-left > .fce-co-c-right{
            display: block;
            margin-top: 30px;
            margin-bottom: 30px;
        }

        .fce-cust-orgs .fce-co-c-2 {
            width: 100%;
        }
        
        .fce-cust-orgs .fce-co-c-left {
            margin-right: 0;
            text-align: center;
        }

        .fce-cust-orgs .fce-co-c-l-buttons{
            justify-content: center;
        }

        .fce-cust-orgs .fce-co-c-right {
            height: 273px;
        }
    }

    @supports ( aspect-ratio: 19/15 ) {
        .fce-cust-orgs .fce-co-c-right{
            height: auto;
            aspect-ratio: 19 / 15;
        }
    }
/* Customer organizations */
/* Flexible content */

/* Sections */
/* Service title section */

    .service-title-section .sts-col-2 {
        min-width: 45%;
    }

    .service-title-section .sts-image {
        max-width: 100%;
    }

    .service-title-section.sub-service .sts-1{
        position: relative;
    }
    
    .service-title-section.sub-service .sts-2{
        min-height: 416px;
    }

    .service-title-section.sub-service .sts-image {
        /* max-width: 595px; */
        max-width: 535px;
        position: absolute;
        top: 0;
        right: 50px;
    }

    .service-title-section .sts-description{
        margin-top: 24px;
    }

    @media (min-width: 992px) {
        .service-title-section .sts-col-1{
            margin-right: var(--spc-3xl);
            padding-top: var(--spc-3xl);
            padding-bottom: var(--spc-3xl);
            min-width: calc( 100% - 45% - var(--spc-3xl) );
        }
    }

    @media (max-width: 1199px) {
        .service-title-section.sub-service .sts-image{
            max-width: 465px;
        }
    }

    @media (max-width: 991px) {
        .service-title-section{
            padding-top: 0px;
            padding-bottom: 80px;
            min-height: 57vh;
        }

        /* .service-title-section.child-service {
            padding-top: 0;
            justify-content: flex-start;
        } */
        
        .service-title-section.no-graphics,
        .service-title-section.sub-service{
            min-height: auto;
            padding-top: 0;
            justify-content: flex-start;
        }

        .service-title-section .sts-col-1 {
            margin-top: 15px;
        }
        
        .service-title-section.sub-service .sts-col-1 {
            margin-top: 35px;
        }

        .service-title-section.sub-service .sts-col-1:first-child:last-child {
            margin-top: 75px;
        }

        .service-title-section.main-service .sts-col-1:first-child:last-child {
            margin-top: 0;
        }

        .service-title-section .sts-2{
            flex-direction: column;
        }

        .service-title-section.sub-service .sts-2{
            align-items: flex-end;
            justify-content: flex-end;
        }
        

        .service-title-section .sts-image {
            max-width: 75%;
            margin-left: auto;
            margin-right: auto;
        }

        .service-title-section.main-service .sts-col-2 .sts-image {
            padding-top: 100px;
        }

        .service-title-section.sub-service .sts-image{
            position: static;
        }

        .service-title-section.no-graphics .sts-2{
            min-height: auto;
        }
    }

    @media (max-width: 499px) {
        .service-title-section{
            padding-top: var(--spc-3xl);
            padding-bottom: var(--spc-2xl);
        }

        .service-title-section .sts-col-1 {
            margin-top: var(--spc-xl);
        }

        .service-title-section .sts-description {
            margin-top: var(--spc-md);
        }

        .service-title-section .sts-image{
            max-width: 100%;
        }

        .service-title-section.sub-service .sts-image{
            max-width: none;
            right: 35px;
        }

        .service-title-section.sub-service .sts-2 {
            min-height: auto;
        }
    }
/* Service title section */

/* Text cubes element */
    @media (min-width: 500px) {
        .fce-text-cubes{
            margin-bottom: var( --spc-xl-neg );
        }
        
        .fce-text-cubes .bagels-text-cube{
            margin-bottom: var( --spc-xl );
        }
    }

    @media (min-width: 992px) {
        .fce-text-cubes.boxes-per-line-1 .bagels-text-cube{
            width: 100%;
        }
        
        .fce-text-cubes.boxes-per-line-2 .bagels-text-cube{
            width: calc( 50% - ( var( --spc-xl ) / 2 ) );
            margin-right: var( --spc-xl );
        }
        
        .fce-text-cubes.boxes-per-line-1 .bagels-text-cube,
        .fce-text-cubes.boxes-per-line-2 .bagels-text-cube:nth-child(2n){
            margin-right: 0;
        }

        .fce-text-cubes.boxes-per-line-3 .bagels-text-cube{
            width: calc( ( 100% / 3 ) - ( ( var( --spc-xl ) * 2 ) / 3 ) );
            margin-right: var( --spc-xl );
        }
        
        .fce-text-cubes.boxes-per-line-4 .bagels-text-cube{
            width: calc( 25% - ( ( var( --spc-xl ) * 3 ) / 4 ) );
            margin-right: var( --spc-xl );
        }
        
        .fce-text-cubes.boxes-per-line-3 .bagels-text-cube:nth-child(3n),
        .fce-text-cubes.boxes-per-line-4 .bagels-text-cube:nth-child(4n){
            margin-right: 0;
        }
    }

    @media (min-width: 500px) and (max-width: 991px) {
        .fce-text-cubes .bagels-text-cube{
            width: calc( 50% - ( var( --spc-xl ) / 2 ) );
            margin-right: var( --spc-xl );
        }

        .fce-text-cubes .bagels-text-cube:nth-child(2n){
            margin-right: 0;
        }
    }

    @media (max-width: 499px) {
        .fce-text-cubes{
            margin-bottom: -27px;
        }

        .fce-text-cubes .bagels-text-cube{
            margin-bottom: 27px;
        }
    }
/* Text cubes element */
/* Sections */

/* Newsroom page */
@media (min-width: 992px) {
    .pg-temp-news .ptn-filters {
        margin-left: 60px;
    }
}

@media (max-width: 991px) {
    .pg-temp-news .ptn-title-section{
        flex-direction: column;
        align-items: flex-start;
    }
    
    .pg-temp-news .ptn-f-1{
        align-items: flex-start;
    }

    .pg-temp-news .ptn-filters {
        margin-top: 38px;
    }
}
/* Newsroom page */

/* News single */
@media (max-width: 991px) {
    .fce-news-boxes .ptn-title-section{
        flex-direction: column;
        align-items: flex-start;
    }

    .fce-news-boxes .ptn-filters{
        margin-top: 10px;
    }
}
/* News single */ 
.anim-page-main-container{
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
}
.anim-parent-container {
    scroll-snap-align: start;
}

.anim-container {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hide-container{
    display: none !important;
}

.translate-up {
    transform: translateY(-160px);
    transition: transform 0.3s ease;
}

.anim-div {
    position: relative;
    z-index: 1590;
    width: 50%;
    height: 600px;
    margin: auto;
}

.anim-background {
    width: fit-content;
    height: fit-content;

    margin: auto;
}



.anim-nav-scroll-down {
    top: -80px !important
}

.anim-svg-sec-cont {
    width: fit-content;
    height: fit-content;
    position: absolute;
    inset: 0;
    background-position-x: 0%;
    background-position-y: 0%;

    z-index: 999;
    margin: auto;
}

.svg-main {
    width: 600px;
    height: auto;
}

.svg-secondary {
    width: 600px;
    height: auto;
    scale: 1.18;
}

.svg-texts {
    width: 100px;
    text-align: right;
    line-height: 1.2em;
    direction: rtl;
    font-size: 20px;
}

.svg-texts-right {
    font-size: 20px;
    width: 120px;
    text-align: left;
    line-height: 1.2em;
}

.do-home-svg-word-div {
    width: 100%;
    height: 100%;
    font-size: 36px;

    display: flex;
    justify-content: center;
    align-items: center;
}

.pap2-requirements-txt-svg {
    position: relative;
}

@media only screen and (max-width:1200px) {
    .anim-div {
    
        margin: auto;
        width: 50%;
        /*To match the breaking point*/
    }

    .anim-background,
    .anim-svg-sec-cont {
        margin: auto;
        width: 100%;
    }

    
}

@media only screen and (max-width:992px) {


   
    .anim-div {
        
        width: 767px;

    }

    .anim-background,
    .anim-svg-sec-cont {
        margin: auto;
        width: 600px;
    }

    .svg-secondary {
        scale: 1;
    }

    
    .svg-texts {
        font-size: 20px;
        width: 120px;
        text-align: right;
        line-height: 1.2em;
        direction: rtl;
    }

    .svg-texts-right {
        font-size: 20px;
        width: 125px;
        text-align: left;
        line-height: 1.2em;
    }
}

@media only screen and (max-width:768px) {

    .anim-div {
       
        width: 730px;
        /*To match the below breaking point*/
    }

   
    .anim-background,
    .anim-svg-sec-cont {
        margin: auto;
        width: 700px;
    }

}


@media only screen and (max-width:475px) {
    .svg-texts {
        font-size: 20;
    }

    
    .svg-texts {
        width: 100px;
        text-align: right;
        line-height: 1.2em;
        direction: rtl;
    }

    .svg-texts-right {

        width: 120px;
        text-align: left;
        line-height: 1.2em;
    }

    .anim-div {

       
        width: 345px;
        height: 345px;
        /*To match the below breaking point*/
    }

    

    .anim-background,
    .anim-svg-sec-cont {
        margin: auto;
        width: 345px;
        transform: translateY(10%)
    }

   

}
 

.dcui-basic-tabs .dcui-bt-tab{
    background-color: transparent;
}
.vst-table-action-container{
    display: flex;
}

.vst-update_markers{
}

/*.main-markers.marker-line-horizontal::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 8px; !* Size of the dot *!*/
/*    height: 8px; !* Size of the dot *!*/
/*    background-color: white; !* Example dot color *!*/
/*    border-radius: 50%;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*}*/

.vst-update_markers .tf-sm-card {
    background-color:#252529;
}

.vst-update_markers .marker-description{
    color: white;
}

.vst-update_markers .main-markers.marker-line-vertical, .vst-update_markers .main-markers.marker-line-horizontal {
    position: absolute;
    background-color: white;
}

.vst-update_markers .main-markers.marker-line-vertical.black-lines, .vst-update_markers .main-markers.marker-line-horizontal.black-lines{
    background-color: black;
}

.vst-update_markers .main-markers.marker-line-vertical:hover, .vst-update_markers .main-markers.marker-line-horizontal:hover {
    cursor: grab;
}

.vst-update_markers .main-markers.marker-line-vertical:hover::after, .vst-update_markers .main-markers.marker-line-horizontal:hover::after {
    cursor: pointer;
}

.tf-modal-content .main-markers.marker-line-vertical::after {
    content: '';
    position: absolute;
    width: 10px; /* Size of the dot */
    height: 10px; /* Size of the dot */
    background-color: black; /* Example dot color */
    border-radius: 50%;
    top: 50%;
    transform: translate(-39%, -75%);
}



.vst-update_markers--input-container{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}
.vst-update_markers--input-wrapper{
    padding-top: 15px;
    padding-bottom: 15px;
}

.vst-update_markers--input-container__main,.vst-update_markers--input-container__sub{
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    width: 850px;
}

.vst-action-bar-top{
    display: flex;
    padding-bottom: 15px;
}

.vst-service-container{
}

.vst-service-back-button-container{
    position: relative;
}

.vst-dropdown li.selected {
    background-color: #d7efff;
}

.vst-dropdown .vst-dropdown-scrollable {
    max-height: 140px;
}

.vst-media-viewer-container{
    display: flex;
    align-items: flex-start;
}

.vst-medium-image{
    width: 150px;
}
.vst-large-image{
    width: 250px;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) and (orientation: portrait) {
    .tf-am-card{
        width: calc(50% - 15px);
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) and (orientation: portrait){
    .tf-am-card{
        width: calc(50% - 15px);
    }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) and (orientation: portrait) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) and (orientation: portrait) {

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) and (orientation: portrait) {

} .docld-notification-container {
    position: relative;
    min-height: 500px;
}

.docld-notification-section {
    padding-top: 30px;
}

.docld-notification-section__section-title {
    font-weight: 500;
    font-size: 15px;
}

.docld-notification-section__section-item__container {
    margin-top: 15px;
    border: 1px solid rgb(226, 226, 226);
    border-radius: 7px;
}

.docld-notification-section__section-item {
    background-color: white;
    border-bottom: 1px solid rgb(226, 226, 226);
    color: #5C5C5C;
}

.docld-notification-section__section-item__content {
    display: flex;
    justify-content: space-between;
    padding: 13px 15px;
    align-items: center;
    height: 45px;
}

.docld-notification-section__section-item__container__icon-container {
    display: flex;
    gap: 10px;
    flex: 0 0 30%;
    padding-left: 3px;
    align-items: center;
}

.docld-notification-section__section-item__container__mark_as_read_btn {
    padding: 8px 10px 9px;
    height: 30px;
    font-size: 14px;
}

.docld-notification-section__section-item__container__icon-container__icon {
    color: #112658;
}

.docld-notification-section__section-item__container__icon-container__title {

}

.docld-notification-section__section-item__container__description-container {
    display: flex;
    flex: 1;
    align-items: center;
    gap: 5px;
}

.docld-notification-section__section-item__container__description-container__user-icon {

}

.docld-notification-section__section-item__container__description-container__description {

}

.docld-notification-section__section-item__container__date-container {

}

.docld-notification-section__section-item__container__date-container__created_date {

}

.docld-notification-section__section-item__container .docld-notification-section__section-item:first-child {
    border-radius: 7px 7px 0 0;
}

.docld-notification-section__section-item__container .docld-notification-section__section-item:last-child {
    border-radius: 0 0 7px 7px;
    border-bottom: 0;
}

.docld-notification-section__section-item__container .docld-notification-section__section-item:only-child {
    border-radius: 7px 7px 7px 7px;
    border-bottom: 0;
}

.docld-notification-section__section-item:hover {
    background-color: rgba(118, 186, 232, 0.3);
    cursor: pointer;
}

.docld-notification-section__section-item__container__date-container__unread {
    color: #00a0fa;
    width: 15px;
}

.docld-notification-section__section-item__container__date-container__unread__symbol {

}

.docld-notification-section__section-item.unread {
    color: black;
    font-weight: 500;
}

.docld-notification-section__no-notification__container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 500px;
    gap: 15px;
    flex-direction: column;
}

.docld-notification-section__no-notification__container__image {
    width: 90px;
}

.docld-notification-section__no-notification__container__text {
    font-weight: 700;
    font-size: 26px;
}

@media screen and (max-width: 1025px) {
    .docld-notification-section__section-item__content {
        height: 70px;
    }
} /**
 * Declarations
 */
:root {
    
    --dark-primary-color: #181818;
    --dark-secondary-color: #242424;
    --dark-tertiary-color: #424242;
    --dark-quaternary-color: #ffffff;
    --dark-quinary-color:#000000;
    --dark-senary-color: #7b7b7b;
    --dark-seven-color: #c7c7c7;
    --dark-eight-color:#3e3e3f;
    --dark-color-text: #ffffff;
    --dark-headings-color: #ffffff;
    --dark-background-color: #515151;
    
    --light-primary-color: #181818;
    --light-secondary-color: #000000;
    --light-tertiary-color: #ffffff;
    --light-quaternary-color: #ffffff;
    --light-quinary-color:#dbdbdb;
    --light-senary-color: #7b7b7b;
    --light-color-text: #000000;
    --body-color: #000000;
    --light-headings-color: #000000;
    --success-color: #06c349;
    --error-color: #dd0707;
    --warning-color: #dd6007;
    --menu-selected-color:  rgba(0, 0, 0, 1);
}

/**
 * Normalization
 */

a {
    color: inherit;
    text-decoration: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

p {
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

img {
    max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--dc-headings-color);
}


/**
 * Helpers
 */

.validation_errors {
    background-color: rgb(131, 0, 0);
    border-radius: 3px;
    height: auto;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.4;
    max-width: 285px;
    position: absolute;
    text-align: left;
    bottom: 70px;
    width: auto;
    z-index: 99993;
    padding: 10px 0px;
}

.validation_errors:after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #700202;
    top: 100%;
    left: 50%;
}

.validation_errors ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 15px;
    list-style-type: none;
}

.validation_errors li {
    padding-right: 12px;
    word-wrap: break-word;
}

.relative {
    position: relative !important;
}

.initial {
    position: initial !important;
}

.center-div {
    margin: 0 auto;
}

.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

.f-w-400 {
    font-weight: 400;
}

.f-w-500 {
    font-weight: 500;
}

.f-w-600 {
    font-weight: 600;
}

.f-w-700 {
    font-weight: 700;
}

.f-s-20 {
    font-size: 20px;
}

.f-s-18 {
    font-size: 18px;
}

.f-s-22 {
    font-size: 22px;
}

.f-s-25 {
    font-size: 25px;
}

.f-s-30 {
    font-size: 30px;
}

.f-s-35 {
    font-size: 35px;
}
.l-h-1 {
    line-height: 1;
}

.line-height-1 {
    line-height: 1;
}

.full-width {
    width: 100%;
}

.full-height {
    height: 100%;
}

.m-10 {
    margin: 10px !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

.m-t-5 {
    margin-top: 5px !important;
}

.m-t-10 {
    margin-top: 10px !important;
}

.m-t-15 {
    margin-top: 15px !important;
}

.m-t-20 {
    margin-top: 20px !important;
}

.m-t-25 {
    margin-top: 25px !important;
}

.m-t-40 {
    margin-top: 40px !important;
}

.m-t-50 {
    margin-top: 50px !important;
}

.m-b-0 {
    margin-bottom: 0 !important;
}

.m-b-5 {
    margin-bottom: 5px !important;
}

.m-b-10 {
    margin-bottom: 10px !important;
}

.m-b-15 {
    margin-bottom: 15px !important;
}

.m-b-20 {
    margin-bottom: 20px !important;
}

.m-b-25 {
    margin-bottom: 25px !important;
}

.m-b-30 {
    margin-bottom: 30px !important;
}

.m-r-auto {
    margin-right: auto !important;
}

.m-r-0 {
    margin-right: 0px !important;
}

.m-r-5 {
    margin-right: 5px !important;
}

.m-r-10 {
    margin-right: 10px !important;
}

.m-r-15 {
    margin-right: 15px !important;
}

.m-r-20 {
    margin-right: 20px !important;
}

.m-r-30 {
    margin-right: 30px !important;
}

.m-r-50 {
    margin-right: 50px !important;
}

.m-l-auto {
    margin-left: auto !important;
}

.m-l-0 {
    margin-left: 0px !important;
}

.m-l-5 {
    margin-left: 5px !important;
}

.m-l-10 {
    margin-left: 10px !important;
}

.m-l-15 {
    margin-left: 15px !important;
}

.m-l-20 {
    margin-left: 20px !important;
}

.m-l-30 {
    margin-left: 30px !important;
}

.m-lr-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.p-5 {
    padding: 5px !important;
}

.p-10 {
    padding: 10px !important;
}

.p-15 {
    padding: 15px !important;
}

.p-20 {
    padding: 20px !important;
}

.p-25 {
    padding: 25px !important;
}

.p-30 {
    padding: 30px !important;
}

.p-t-0 {
    padding-top: 0px !important;
}

.p-t-5 {
    padding-top: 5px !important;
}

.p-t-10 {
    padding-top: 10px !important;
}

.p-t-15 {
    padding-top: 15px !important;
}

.p-t-35 {
    padding-top: 35px !important;
}

.p-b-0 {
    padding-bottom: 0px !important;
}

.p-b-2 {
    padding-bottom: 2px !important;
}

.p-b-5 {
    padding-bottom: 5px !important;
}

.p-b-10 {
    padding-bottom: 10px !important;
}

.p-b-15 {
    padding-bottom: 15px !important;
}

.p-b-20 {
    padding-bottom: 20px !important;
}

.p-b-35 {
    padding-bottom: 35px !important;
}

.p-r-0 {
    padding-right: 0px !important;
}

.p-r-5 {
    padding-right: 5px !important;
}

.p-r-10 {
    padding-right: 10px !important;
}

.p-r-15 {
    padding-right: 15px !important;
}

.p-r-20 {
    padding-right: 20px !important;
}

.p-r-35 {
    padding-right: 35px !important;
}

.p-l-0 {
    padding-left: 0px !important;
}

.p-l-5 {
    padding-left: 5px !important;
}

.p-l-10 {
    padding-left: 10px !important;
}

.p-l-15 {
    padding-left: 15px !important;
}

.p-l-20 {
    padding-left: 20px !important;
}

.p-l-35 {
    padding-left: 35px !important;
}

.p-lr-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.color-inherit {
    color: inherit;
}

.text-success {
    color: #69bb67 !important;
}

.text-warning {
    color: #dd992d !important;
}

.text-danger {
    color: #ed1010 !important;
}

.text-notice {
    color: #4e4e4e !important;
}

.text-grey {
    color: #b3b3b3 !important;
}


.line-clamp-8 {
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-7 {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-6 {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-5 {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.overflow-wrap-anywhere{
    overflow-wrap: anywhere;
}
.float-right{
    float: right;
}
.float-left{
    float: left;
}
.vertical-align-sub{
    vertical-align: sub
}
.w-20 {
    width: 20px;
}

.w-30 {
    width: 30px;
}

.w-40 {
    width: 40px;
}

.w-50 {
    width: 50px;
}

.w-70 {
    width: 70px;
}

.w-100 {
    width: 100px;
}

.w-150 {
    width: 150px;
}

.w-200 {
    width: 200px;
}

.w-250 {
    width: 250px;
}

.w-300 {
    width: 300px;
}

.w-400 {
    width: 400px;
}

.w-450 {
    width: 450px;
  }
  
.w-500 {
    width: 500px;
}

.w-550 {
    width: 550px;
}


.w-600 {
    width: 600px;
}

.w-10p {
    width: 10%;
}

.w-50p {
    width: 50%;
}

.w-60p {
    width: 60%;
}

.w-70p {
    width: 70%;
}

.min-w-50p {
    min-width: 50%;
}

.max-w-50 {
    max-width: 50px !important;
}

.max-w-100 {
    max-width: 100px !important;
}

.max-w-145 {
    max-width: 145px !important;
}

.max-w-200 {
    max-width: 200px !important;
}

.max-w-250 {
    max-width: 250px !important;
}

.max-w-300 {
    max-width: 300px !important;
}

.max-w-360 {
    max-width: 360px !important;
}

.max-w-400 {
    max-width: 400px !important;
}

.max-w-500 {
    max-width: 500px !important;
}

.max-w-600 {
    max-width: 600px !important;
}

.max-w-900 {
    max-width: 900px !important;
}

.max-h-100 {
    max-height: 100px !important;
}

.max-h-150 {
    max-height: 150px !important;
}

.max-h-200 {
    max-height: 200px !important;
}

.max-h-250 {
    max-height: 250px !important;
}

.max-h-270 {
    max-height: 270px !important;
}

.max-h-300 {
    max-height: 300px !important;
}

.max-h-350 {
    max-height: 350px !important;
}

.max-h-400 {
    max-height: 400px !important;
}

.max-h-500 {
    max-height: 500px !important;
}

.max-h-600 {
    max-height: 600px !important;
}

.h-0{
    height: 0 !important;
}

.h-75{
    height: 75px !important;
}

.h-150 {
    height: 150px !important;
}
.h-170 {
    height: 170px !important;
}
.h-200 {
    height: 200px !important;
}

.h-300 {
    height: 300px !important;
}

.h-500 {
    height: 500px !important;
}

.min-w-40 {
    min-width: 40px !important;
}

.min-w-50 {
    min-width: 50px !important;
}

.min-w-70{
    min-width: 70px !important;
}

.min-w-100 {
    min-width: 100px !important;
}

.min-w-200 {
    min-width: 200px !important;
}

.min-w-300 {
    min-width: 300px !important;
}

.min-w-360 {
    min-width: 360px !important;
}

.min-w-400 {
    min-width: 400px !important;
}

.min-w-450{
    min-width: 450px !important;
}

.min-w-500 {
    min-width: 500px !important;
}

.min-w-550 {
    min-width: 550px !important;
}

.min-w-600 {
    min-width: 600px !important;
}

.min-h-50 {
    min-height: 50px !important;
}

.min-h-100 {
    min-height: 100px !important;
}

.min-h-150 {
    min-height: 150px !important;
}

.min-h-200 {
    min-height: 200px !important;
}

.min-h-250 {
    min-height: 250px !important;
}

.min-h-270 {
    min-height: 270px !important;
}

.min-h-300 {
    min-height: 300px !important;
}

.min-h-350 {
    min-height: 350px !important;
}

.min-h-450 {
    min-height: 450px !important;
}

.min-h-500 {
    min-height: 500px !important;
}

.min-h-600 {
    min-height: 600px !important;
}

.min-h-650 {
    min-height: 650px !important;
}

.display-none {
    display: none;
}

.flex-item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.display-flex {
    display: flex;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-grow-1 {
    flex-grow: 1;
}

.flex-directions-column {
    flex-direction: column;
}

.flex-directions-row {
    flex-direction: row;
}

.gap-5{
    gap: 5px;
}

.gap-10{
    gap: 10px;
}

.gap-15{
    gap: 15px;
}

.inline-block {
    display: inline-block;
}

.inline-flex {
    display: inline-flex;
}

.align-center {
    align-items: center;
}

.align-start {
    align-items: flex-start;
}

.align-end {
    align-items: flex-end;
}

.align-baseline {
    align-items: baseline;
}

.justify-center {
    justify-content: center;
}

.justify-end {
    justify-content: flex-end;
}

.justify-space-between {
    justify-content: space-between;
}

.justify-space-around {
    justify-content: space-around;
}

.border-bottom {
    border-bottom: 1px solid #dcdcdc;
}

.red-border {
    border: 1px solid red !important;
}

.box-shadow-none {
    box-shadow: none;
}

.ellipsis {
    text-overflow: ellipsis;
    /* enables ellipsis */
    white-space: nowrap;
    /* keeps the text in a single line */
    overflow: hidden;
    /* keeps the element from overflowing its parent */
}

.text-overflow-ellipsis {
    text-overflow: ellipsis;
}

.white-space-nowrap {
    white-space: nowrap;
}

.overflow-hidden {
    overflow: hidden;
}

.no-border {
    border: none;
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
}

.r-45 {
    -ms-transform: rotate(45deg);
    /* IE 9 */
    transform: rotate(45deg);
}

.r-222 {
    -ms-transform: rotate(222deg);
    /* IE 9 */
    transform: rotate(222deg);
}


/*
* Image
*/
.object-fit_cover {
    object-fit: cover;
}

/**
 * Form elements
 */

.form-group {
    margin-bottom: 20px;
}

.form-group.horizontal {
    display: table;
    width: 100%;
}

.form-group.horizontal>* {
    display: table-cell;
}

.form-group.horizontal>.fld-label {
    width: 33%;
}

.form-group.horizontal>.fld-label.with-colon {
    position: relative;
}

.form-group.horizontal>.fld-label.with-colon:after {
    content: ':';
    position: absolute;
    right: 5px;
}

.fld-label {
    font-weight: 500;
    margin-bottom: 5px;
    display: block;
    font-size: 15px;
    color: var(--color-text);
}

.form-control {
    display: block;
    width: 100%;
    height: 40px;
    padding: 8px 10px 10px;
    font-size: 15px;
    color: #555555;
    outline: 0;
    border-radius: 3px;
    background-color: #fff;
    border: 1px solid #939393;
    -webkit-transition: border-color ease-in-out 0.15s;
    -moz-transition: border-color ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s;
}

.dark-mode .form-control {
    color: #fdfdfd;
    background-color: var(--dark-secondary-color);
}

textarea.form-control {
    min-height: 110px;
    max-width: 100%;
    max-height: 200px;
    min-width: 100%;
    line-height: 1;
}

textarea.form-control.no-resize {
    resize: none;
}

.form-control:focus {
    border-color: var(--dark-primary-color);
    background-color: #fff;
    outline: 0 !important;

}

.dark-mode .form-control:focus {
    border-color: var(--dark-primary-color);
    border: 1px solid #939393;
    background-color:  var(--dark-secondary-color);
}

.form-control:disabled {
    background-color: #606060;
}

.form-control::-webkit-input-placeholder {
    color: #c8c8c8;
    /* Chrome/Opera/Safari */
    font-weight: 300;
}

.form-control::-moz-placeholder {
    color: #c8c8c8;
    /* Firefox 19+ */
    font-weight: 300;
}

.form-control:-ms-input-placeholder {
    color: #c8c8c8;
    /* IE 10+ */
    font-weight: 300;
}

.form-control:-moz-placeholder {
    color: #c8c8c8;
    /* Firefox 18- */
    font-weight: 300;
}

.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus,
.form-control:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset;
}

.dark-mode .form-control:-webkit-autofill,
.dark-mode .form-control:-webkit-autofill:hover,
.dark-mode .form-control:-webkit-autofill:focus,
.dark-mode .form-control:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px rgb(77, 77, 77) inset;
    -webkit-text-fill-color: #ffffff;
}

.form-control.has-error {
    border-color: var(--error-color);
}

.icon-control {
    position: relative;
}

.icon-control .ic-icon {
    position: absolute;
    top: 1px;
    right: 1px;
    display: inline-block;
    width: 38px;
    height: 38px;
    line-height: 41px;
    text-align: center;
    cursor: pointer;
    font-size: 14px;
    -webkit-transition: color ease-in-out 0.15s;
    -moz-transition: color ease-in-out 0.15s;
    transition: color ease-in-out 0.15s;
}

.icon-control .ic-icon:hover {
    color: var(--dark-secondary-color);
}

.dark-mode .icon-control input{
    background-color:var(--dark-secondary-color)
}

.dark-mode .icon-control .ic-icon:hover {
    color: var(--dark-Senary-color);
}

.radio,
.checkbox {
    position: relative;
    display: block;
    margin-top: 10px;
}

.radio input[type="radio"],
.checkbox input[type="checkbox"] {
    position: absolute;
    margin-left: -20px;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 4px 0 0;
    line-height: normal;
    cursor: pointer;
    box-sizing: border-box;
}

.radio label,
.checkbox label {
    display: inline-block;
    min-height: 20px;
    cursor: pointer;
    position: relative;
    padding-left: 25px !important;
    margin-right: 15px;
    margin-bottom: 6px;
    font-size: 15px;
    line-height: 20px;
}

.radio label:before,
.checkbox label:before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.07);
}

.radio label:before {
    bottom: 2.5px;
    border-radius: 99px;
    border-color: #c2c2c2;
    -webkit-transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}

.checkbox label:before {
    top: -0.6px;
    border-radius: 3px;
    border-color: #c2c2c2;
    -webkit-transition: border 0.2s linear 0s, color 0.2s linear 0s;
    transition: border 0.2s linear 0s, color 0.2s linear 0s;
}

.radio input[type=radio]:checked+label:before {
    border-width: 5px;
    border-color: var(--light-primary-color);
}

.checkbox input[type=checkbox]:checked+label:before {
    border-width: 8.5px;
    border-color: var(--light-primary-color);
}

.checkbox label {
    -webkit-transition: border 0.2s linear 0s, color 0.2s linear 0s;
    transition: border 0.2s linear 0s, color 0.2s linear 0s;
}

.checkbox label:after {
    display: inline-block;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 3px;
    top: -2px;
    font-size: 11px;
    -webkit-transition: border 0.2s linear 0s, color 0.2s linear 0s;
    transition: border 0.2s linear 0s, color 0.2s linear 0s;
    border-radius: 3px;
}

.checkbox input[type=checkbox]:checked+label:after {
    font-family: 'Font Awesome 5 Pro';
    content: "\f00c";
    color: #fff;
    font-weight: 700;
}

.radio input[type="radio"]:disabled+label,
.checkbox input[type="checkbox"]:disabled+label {
    cursor: not-allowed;
}

.button {
    font-family: inherit;
    font-size: 15px;
    font-weight: normal;
    display: inline-block;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    margin-bottom: 0;
    height: 40px;
    border: 1px solid var(--quaternary-color);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    color: var(--primary-color);
    border-radius: 3px;
    outline: 0;
    white-space: nowrap;
    background-color: var(--quaternary-color);
    text-shadow: none;
    box-shadow: none;
    line-height: 0;
    padding: 9px 20px 8px;
    position: relative;
    -webkit-transition: all ease-in-out 0.15s;
    -moz-transition: all ease-in-out 0.15s;
    transition: all ease-in-out 0.15s;
}

.dark-mode .button.login {
    background-color: var(--dark-primary-color);
    border: 1px solid #939393 !important;
}

.dark-mode .button {
    background-color: var(--dark-primary-color);
    border: 1px solid #939393 !important;
}

.light-mode .button.login {
    background-color: var(--light-quaternary-color);
    border: 1px solid #939393 !important;
    color: black;
}

.light-mode .button {
    background-color: var(--light-primary-color);
    border: 1px solid #939393 !important;
    color: white;
}

/*
VS Button Style
 */
.button.button-blue {
     border:1px solid #025281 !important;
     color: #fff;
     background-color: #025281 !important;
 }
.button.button-blue:hover {
    background-color: #0079c0 !important;
}
.button.button-white-blue {
    border:1px solid transparent !important;
    color: #0079c0;
    background-color: #fff !important;
}
.button.button-white-blue:hover {
    background-color: #0079c0 !important;
}
.button.button-flat-transparent {
    background-color: transparent !important;
    border-color: transparent !important;
    color: #757575;
}
.button.button-flat-transparent.red-text {
    color: rgb(207 4 4);
}
.button.button-flat-transparent:hover {
    background-color: transparent !important;
    color: inherit;
}
.button.button-flat-transparent:hover.red-text {
    color: rgb(105, 9, 9);
}
.button-negative {
    background-color: #c8c8c8;
    border-color: #c8c8c8;
}

.button-transparent {
    background-color: transparent;
    border-color: #ffffff;
    color: #757575;
}

.button-flat-light {
    background-color: #0079C0;
    border-color: #0079C0;
    border-radius: 0;
}

.button-flat-transparent {
    background-color: transparent;
    border-color: transparent;
    color: #757575;
}

.button-flat-transparent.red-text {
    color: rgb(207 4 4);
}

.button.action-btn {
    padding: 3px 11px 22px 11px !important;
    height: 20px !important;
    text-align: center !important;
}

.button.action-btn:hover {
    background-color: #efefef !important;
}

.button:hover {
    background-color: var(--primary-color) !important;
    color: var(--quaternary-color);
    border-color: var(--primary-color);
}
.dark-mode .button:hover {
    background-color: var(--dark-quinary-color) !important;
    color: var(--dark-quaternary-color);
    border: 1px solid #939393 !important;
}

.light-mode .button:hover {
    background-color: var(--light-secondary-color) !important;
    color: var(--light-quaternary-color);
    border: 1px solid #939393 !important;
}

.button:active {
    -webkit-transform: translateY(2px);
    -moz-transform: translateY(2px);
    transform: translateY(2px);
}

.button-transparent:hover {
    background-color: #ededed;
    color: white;
}

.button-flat-transparent:hover {
    background-color: transparent !important;
    color: inherit;
}

.button-flat-transparent:hover.red-text {
    color: rgb(105, 9, 9);
}

.button:disabled {
    opacity: 0.5;
    pointer-events: none;
}

.button.doing-ajax {
    pointer-events: none;
    border: 1px solid var(--dark-primary-color);
}

.dark-mode .button.doing-ajax ,
.light-mode .button.doing-ajax {
    pointer-events: none;
    border: 1px solid var(--dark-primary-color);
}

.button-minwidth {
    min-width: 100px;
}

.mini-button {
    min-width: 23px;
    max-width: 23px;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    height: 15px !important;
    line-height: 1 !important;
    padding: 5px 1px 15px !important;
}

.mini-button i {
    background-color: transparent !important;
}

.button .ajax-ellipsis-wrap {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--dark-primary-color);
    border:  var(--dark-primary-color);
}

.ajax-ellipsis {
    display: inline-block;
    position: absolute;
    width: 54px;
    height: 9px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.ajax-ellipsis div {
    position: absolute;
    top: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.ajax-ellipsis div:nth-child(1) {
    left: 5px;
    animation: ajax-ellipsis1 0.6s infinite;
}

.ajax-ellipsis div:nth-child(2) {
    left: 5px;
    animation: ajax-ellipsis2 0.6s infinite;
}

.ajax-ellipsis div:nth-child(3) {
    left: 23px;
    animation: ajax-ellipsis2 0.6s infinite;
}

.ajax-ellipsis div:nth-child(4) {
    left: 41px;
    animation: ajax-ellipsis3 0.6s infinite;
}

.button.doing-ajax .ajax-ellipsis-wrap {
    display: block;
}

.dark-mode .button.doing-ajax .ajax-ellipsis-wrap,
.light-mode .button.doing-ajax .ajax-ellipsis-wrap {
    display: block;
}

@keyframes ajax-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes ajax-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes ajax-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(18px, 0);
    }
}

/**
Data loader
**/
.data-loader {
    display: inline-block;
    height: 9px;
    width: 54px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    
}

.data-loader div {
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
    background: var(--dark-secondary-color);
    border-radius: 50%;
    height: 8px;
    position: absolute;
    top: 0;
    width: 8px;
}

.data-loader div:nth-child(1) {
    animation: data-loader1 0.6s infinite;
    left: 5px;
}

.data-loader div:nth-child(2) {
    animation: data-loader2 0.6s infinite;
    left: 5px;
}

.data-loader div:nth-child(3) {
    animation: data-loader2 0.6s infinite;
    left: 23px;
}

.data-loader div:nth-child(4) {
    animation: data-loader3 0.6s infinite;
    left: 41px;
}

.data-loader-wrap {
    border-radius: 5px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: rgb(255, 255, 255);

}

@keyframes data-loader1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes data-loader3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes data-loader2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(18px, 0);
    }
}

/* Select wrapper */
.select-wrapper {
    position: relative;
}

.select-wrapper select {
    min-width: 100px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.select-wrapper:after,
.search-selection:after {
    position: absolute;
    content: '\f107';
    font-family: 'Font Awesome 5 Pro';
    font-size: 18px;
    font-weight: 400;
    z-index: 1;
    top: 2px;
    right: 2px;
    bottom: 2px;
    color: #999999;
    width: 30px;
    text-align: center;
    padding: 6px 2px;
    pointer-events: none;
    background-color: #fff;
}

.dark-mode .select-wrapper:after,
.dark-mode .search-selection:after {
    position: absolute;
    content: '\f107';
    font-family: 'Font Awesome 5 Pro';
    font-size: 18px;
    font-weight: 400;
    z-index: 1;
    top: 2px;
    right: 2px;
    bottom: 2px;
    color: #999999;
    width: 30px;
    text-align: center;
    padding: 6px 2px;
    pointer-events: none;
    background-color: var(--secondary-color);
}
.dark-mode .select-wrapper::before,
.dark-mode .search-selection:before {
    position: absolute;
    content: '\f107';
    font-family: 'Font Awesome 5 Pro';
    font-size: 18px;
    font-weight: 400;
    z-index: 1;
    top: 2px;
    right: 2px;
    bottom: 2px;
    color: #999999;
    width: 30px;
    text-align: center;
    padding: 6px 2px;
    pointer-events: none;
    background-color:  var(--secondary-color);
}

/*.select-wrapper select:invalid {
    color: #c2c3c5;
}*/
.select-wrapper.with-icon:after {
    width: 25px;
    top: 0;
    bottom: 0;
    border-left: 1px solid #c8c8c8;
    background-color: transparent;
}

.select-wrapper.with-icon select {
    padding-right: 40px;
}

/*.select-wrapper select option,
.select-wrapper select optgroup {
    color: initial;
}*/
.select-wrapper option[value='?'],
.select-wrapper option[value='? undefined:undefined ?'] {
    display: none;
}

/**
 * Media Library
 */
.ml-popup {
    top: 500px !important;
}

/**
 * UI Components
 */
.ajax-notice {
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 999;
    background-color: var(--secondary-color);
    border-radius: 3px;
    text-align: left;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.10);
    padding: 15px 15px 13px;
    width: 300px;
    max-width: 320px;
    border-left: 5px solid transparent;
    cursor: default;
    color: var(--color-text);
}

.dark-mode .ajax-notice {
    background-color: var(--dark-secondary-color);
    color: var(--dark-color-text);
}


.light-mode .ajax-notice {
    background-color: var(--light-primary-color);
    color: var(--light-quaternary-color);
}

.ajax-notice .an-message {
    padding-right: 30px;
    font-size: 14px;
}

.ajax-notice .an-dismisser {
    position: absolute;
    top: 11px;
    right: 9px;
    width: 22px;
    height: 22px;
    line-height: 26px;
    text-align: center;
    cursor: pointer;
    background-color: var(--tertiary-color);
    border-radius: 100%;
    font-size: 16px;
    font-weight: 600;
}

.ajax-notice .an-dismisser:hover {
    background-color: #c9c5c5;
}

.ajax-notice.success {
    border-left-color: var(--success-color);
}

.ajax-notice.error {
    border-left-color: var(--error-color);
}

.ajax-notice.warning {
    border-left-color: var(--warning-color);
}

/* Dropdown */
.dropdown {
    position: relative;
}

.dropdown-toggle {
    cursor: pointer;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 180px;
    padding: 5px 0;
    margin: 0;
    list-style: none;
    text-align: left;
    background-color: #fff;
    border: 0;
    border-radius: 0;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    background-clip: padding-box;
}

.dropdown-menu.right {
    left: auto;
    right: 0;
}
.dark-mode .dropdown-menu{
    background-color: #5d5d5d;
}

.dropdown-menu.table-action-left {
    left: 50px !important;
}

.dropdown .dropdown-menu.notification {
    cursor: auto;
    min-width: 410px;
    left: -340px;
    top: 71px;
    bottom: auto;
    padding: 0;
    padding-bottom: 5px;
}

.dropdown-menu.megaSearch {
    cursor: auto;
    min-width: 410px;
    left: -2x;
    top: 51px;
    bottom: auto;
    padding: 0;
    padding-bottom: 5px;
}

.dropdown-menu.bottom-left {
    left: 80px;
    top: auto;
    bottom: 0;
}

.dropdown.open .dropdown-menu {
    display: block;
}

.dropdown-menu>li {
    display: block;
    position: relative;
}

.dropdown-menu>li>a {
    display: block;
    padding: 13px 20px;
    text-align: left;
    white-space: nowrap;
    line-height: 1;
    color: inherit;
    position: relative;
}

.dropdown-menu>li>a>i {
    width: 16px;
    margin-right: 3px;
}

.dropdown-menu>li>a:hover {
    color: #fff;
    background-color: var(--secondary-color);
}

.dropdown-menu>li>a:hover .notification-icon {
    color: #fff;

}

.dark-mode .dropdown-menu>li>a:hover {
    color: #fff;
    background-color: var(--dark-quinary-color);
}

.dark-mode .dropdown-menu>li>a:hover .notification-icon {
    color: #fff;

}

.light-mode .dropdown-menu>li>a:hover {
    color: var(--light-quaternary-color);
    background-color: var(--light-secondary-color);
}

.light-mode .dropdown-menu>li>a:hover .notification-icon {
    color: var(--light-quaternary-color);
}

.dropdown-menu.light>li>a:hover {
    color: var(--secondary-color);
    background-color: rgba(0, 121, 192, 0.15);
}


.dropdown-menu>li>a.doing-ajax {
    pointer-events: none;
}

.dropdown-menu>li>a.doing-ajax .ajax-ellipsis-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--dark-quinary-color);
}

.dropdown-menu.rounded{
    border-radius: 5px;
}


/* Dropdown search */
.search-selection {
    position: relative;
}

.search-selection .output {
    cursor: default;
    padding-right: 30px;
}

.search-selection .search-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 99;
    padding: 5px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
    min-width: 160px;
    margin-bottom: 35px;
}

.search-selection.open .search-dropdown {
    display: block;
}

.search-selection .search-filter {
    padding-left: 6px;
    padding-right: 6px;
    height: 30px;
    font-size: 13px;
}

.search-selection .result-list {
    padding: 0;
    margin: 5px 0 0;
    list-style-type: none;
    max-height: 210px;
}

.search-selection .result-list li label {
    padding: 5px 10px;
    cursor: pointer;
    background-color: #fff;
    font-size: 13px;
    color: inherit;
    display: block;
    width: 100%;
    margin-bottom: 0;
    font-weight: normal;
    position: relative;
    border-bottom: 1px solid #f3f3f3;
    text-align: left;
}

.search-selection .result-list li label .rl-item-additional {
    display: block;
    font-size: 12px;
    color: #b3b3b3;
    margin-top: 2px;
}

.search-selection .result-list li:last-child label {
    border-bottom: none;
}

.search-selection .result-list li label input[type="radio"] {
    visibility: hidden;
    position: absolute;
}

.search-selection .result-list li label:hover,
.search-selection .result-list li label:focus,
.search-selection .result-list li.active label {
    background-color: #e5e5e5;
}

.flip-horizontal {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

/**
 * UI Transitions
 */
.fade-up-enter-active,
.fade-up-leave-active {
    transition: all 0.2s ease-out;
}

.fade-up-enter-from,
.fade-up-leave-to {
    transform: translateY(100px);
    opacity: 0;
}

/**
 * Layout
 */
.scroll-container {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.scroll-container::-webkit-scrollbar-track {
    background-color: transparent;
}

.scroll-container::-webkit-scrollbar {
    width: 5px;
}

.scroll-container::-webkit-scrollbar-thumb {
    background-color: #c0bdbd;
    border-radius: 10px;
}

@media screen and (min-width: 768px) {
    .row.mini-gap {
        margin-left: -7.5px;
        margin-right: -7.5px;
    }

    .row.mini-gap [class*="col-"] {
        padding-left: 7.5px;
        padding-right: 7.5px;
    }
} 
/************************
 *    XP LINK STYLES    *
 ************************/

/*********************************
 *    XP FileUploader STYLES     *
 *********************************/


.xp-file-uploader.inputfile{
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.xp-file-uploader.inputfile + label{
    max-width: 80%;
    font-size: 17px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 0.625rem 1.25rem;
}

.xp-file-uploader.style-1.inputfile + label {
    color: white;
    background-color: var(--dcui-primary-color);
}

.xp-file-uploader.style-2.inputfile + label {
    border: 1px solid var(--dcui-primary-color);
    background-color: #f1e5e6;
    padding: 0;

}

.xp-file-uploader.style-2.inputfile + label span {
    width: 200px;
    min-height: 2em;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
    color: var(--dcui-primary-color);
}

.xp-file-uploader.style-2.inputfile + label strong {
    height: 100%;
    color: #f1e5e6;
    background-color: var(--dcui-primary-color);
    display: inline-block;
}

.xp-file-uploader.style-2.inputfile + label span, .xp-file-uploader.style-2.inputfile + label strong {
    padding: 0.625rem 1.25rem;
}

.xp-file-uploader.style-1.inputfile:focus + label,
.xp-file-uploader.style-1.inputfile + label:hover {
    background-color: var(--dcui-secondary-color);
}

.xp-file-uploader.style-1.inputfile + label {
    cursor: pointer; /* "hand" cursor */
}

.xp-file-uploader.style-1.inputfile:focus + label {
    outline: 1px dotted var(--dcui-primary-color);
    outline: -webkit-focus-ring-color auto 5px;
}

.xp-file-uploader.style-2.inputfile:focus + label, .xp-file-uploader.style-2.inputfile.has-focus + label, .xp-file-uploader.style-2.inputfile + label:hover {
    border-color: var(--dcui-primary-color);
}
.xp-file-uploader.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    margin-right: 0.25em;
}

.xp-file-uploader.inputfile + label.doing-ajax {
    pointer-events: none;
}

.xp-file-uploader.inputfile + label.doing-ajax .ajax-ellipsis-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--dcui-primary-color);
}



.dcui-file-uploader-container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.dcui-file-uploader-container.mini {
    flex: none;
    margin: 5px;
}

.dcui-file-uploader-container.mini .mini-container {
    flex-grow: 1;
    border: 1px solid #d1d1d1;
    border-radius: 7px;
    margin: 5px;
}

.dcui-file-uploader-container .center-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.dcui-file-uploader-container .text-container {
    color: #5f6368;
    margin-top: 5px;
}

.dcui-file-uploader-container .text-browse {
    color: var(--dcui-primary-color);
}

.dcui-file-uploader-container.disable, .dcui-file-uploader-container.mini.disable .text-browse {
    color: #a6a8a9;
}

.dcui-file-uploader-container .upload-icon {
    font-size: 25px;
    color: #cfd1d2;
}

.dcui-file-uploader-container .hidden-input {
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
}

.dcui-file-uploader-container .file-label {
    display: block;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.dcui-file-uploader-container.disable .file-label {
    cursor: inherit;
}

.dcui-file-uploader-container .preview-card {
    display: flex;
    position: relative;
}

.dcui-file-uploader-container .preview-container{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
}

.dcui-file-uploader-container .add-media-container{
    width: 112px;
    height: 109px;
    display: flex;
    align-items: center;
}

.dcui-file-uploader-container .hidden-input {
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
}

.dcui-file-uploader-container .file-label {
    display: block;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.dcui-file-uploader-container .add-media-content {
    flex: 1;
    min-height: 105px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.dcui-file-uploader-container .upload-icon {
    font-size: 25px;
    color: #cfd1d2;
}

.dcui-file-uploader-container .text-container {
    color: #5f6368;
    margin-top: 5px;
}

.dcui-file-uploader-container .preview-container .image-container {
    border: 1px solid #a2a2a2;
    border-radius: 5px;
}

.dcui-file-uploader-container .preview-img {
    object-fit: cover;
    object-position: top;
    width: 106px;
    height: 92px;
    border-bottom: 1px solid #a2a2a2;
    background-color: #a2a2a2;
}

.dcui-file-uploader-container .preview-container .file-name-text {
    text-align: center;
}

.preview-container .preview-card .file-remove-btn {
    position: absolute;
    top: 6px;
    right: 6px;
    display: none;
}

.dcui-button.dcui-file-uploader-remove-btn {
    width: 15px;
    height: 15px;
    padding: 5px;
    border-radius: 50px;
}

.dcui-file-uploader-remove-icon-container{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 3px;
}


/**********************
 *   DC Components    *
 **********************/

.dcui-load-more-container__container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/***********************************
 *   DC Font Awesome Icon Picker   *
 ***********************************/

.dcui-font-awesome-icon-picker__container {
    width: 890px;
    max-width: 890px;
    height: 100%;
    min-height: 450px;
    padding-top: 10px;
}

.dcui-font-awesome-icon-picker__container__search-container{
    margin-bottom: 25px;
}

.dcui-font-awesome-icon-picker__container__search-container__input{
    background-color: transparent;
    color: #0F0F0F;
}

.dcui-font-awesome-icon-picker__container__search-container__input.dark{
    color: white;
}

.dcui-font-awesome-icon-picker__container__search-container__input.dark.dcui-form-control:focus{
    background-color: transparent;
}
.dcui-font-awesome-icon-picker__container__search-container .dcui-font-awesome-icon-picker__container__search-container__input--icon{
    background-color: transparent;
}

.dcui-font-awesome-icon-picker__container_icon-container {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    max-height: 370px;
    margin-top: 15px;
    justify-content: flex-start;
}

.dcui-font-awesome-icon-picker__container_icon-container__wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.dcui-font-awesome-icon-picker__container_icon-container__icon-btn {
    width: 80px;
    height: 79px;
    font-family: inherit;
    font-size: 18px;
    font-weight: normal;
    display: inline-block;
    letter-spacing: 0.01em;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid var(--dcui-primary-color);
    border-radius: var(--dcui-field-radius);
    outline: 0;
    white-space: nowrap;
    color: #fff;
    background-color: transparent;
    text-shadow: none;
    box-shadow: none;
    line-height: calc(var(--dcui-field-height) - 20px);
    padding: 9px 10px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-transition: all ease-in-out 0.15s;
    -moz-transition: all ease-in-out 0.15s;
    transition: all ease-in-out 0.15s;
}

ul.dc-breadcrumbs-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

ul.dc-breadcrumbs-list li.dc-breadcrumb-item {
    display: inline;
}

ul.dc-breadcrumbs-list li.dc-breadcrumb-item .dc-breadcrumb-icon {
    padding: 8px;
    color: #5b5e63;
}

.dcui-icon-btn-img{
    width: 21px;
    height: auto;
    max-height: 18px;
    display: block;
    margin: 0 auto;
}

.dcui-icon-btn-img-container{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    text-align: center;
    justify-content: center;
}

.dcui-blue-container{
    padding: 15px;
    background-color: #d6ecf8;
}

.dcui-info-panel-main-container{
    height: 100%;
}
.dcui-info-panel-main-container__middle-container{
    min-height: 750px;
    display: flex;
}
.dcui-info-panel-main-container__middle-container__left{
    width: 60%;
    height: calc(100vh - 266px);
    position: relative;
}
.dcui-info-panel-main-container__middle-container__left::after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 1px;
    background-color: #f4f4f4;
}
.dcui-info-panel-main-container__middle-container__right{
    width: 40%;
    margin-left: 25px;
}
.dcui-info-panel-main-container__middle-container__right-container{
    height: calc(100vh - 281px);
    background-color: #fafafa;
    padding: 15px;
    border-radius: 5px;
}

.docld-native-date-picker{
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    font-size: var(--dcui-regular-font-size);
    color: var(--dcui-body-color);
    border: 0;
    background: transparent;
    display: inline-block !important;
    visibility: visible !important;
    padding: 8px 10px;
    border-radius: 4px;
}

.docld-native-date-picker::-webkit-calendar-picker-indicator {
    filter: invert(40%) sepia(10%) saturate(250%) hue-rotate(173deg) brightness(91%) contrast(87%);
}

.docld-native-date-picker:hover{
    background-color: #eeeeee;
    cursor: pointer;
}

.docld-native-date-picker:focus,
.docld-native-date-picker:focus-visible {
    outline: 0 !important;
    box-shadow: none;
}

/***********************/
/**   Bar loader  **/
/***********************/

.docld-loading-bar-container {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
}

.docld-loading-bar {
    background-color: #3498db;
}

.docld-loading-bar-container .docld-loading-bar.hidden {
    display: none;
}

.docld-required-text{
    color: #c10808;
    padding-left: 5px;
}

/***********************/
/**   Icon Button     **/
/***********************/

.dcui-icon-actions .docld-icon-button-loading-container.docld-spinner-loader-container{
    width: 35px !important;
}

.dcui-icon-actions .docld-icon-button-loading-container.docld-spinner-loader-container .docld-spinner-loader {
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(farthest-side, var(--dcui-primary-color) 94%, #0000) top/8px 8px no-repeat,
    conic-gradient(#0000 30%, var(--dcui-primary-color));
    -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
    animation: l13 1s infinite linear;
}

/***********************/
/**   Spinner loader  **/
/***********************/

.docld-spinner-loader-container {
    background-color: white;
    position: absolute;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.docld-spinner-loader {
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(farthest-side, var(--dcui-primary-color) 94%, #0000) top/8px 8px no-repeat,
    conic-gradient(#0000 30%, var(--dcui-primary-color));
    -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 8px), #000 0);
    animation: l13 1s infinite linear;
}

@keyframes l13 {
    100% {
        transform: rotate(1turn)
    }
}


/*****************************/
/**  Auto complete field   **/
/****************************/
.autocomplete-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.autocomplete-input-wrapper {
    position: relative;
}

.autocomplete-input-wrapper > ::v-deep(.autocomplete-label) {
    display: block;
    font-size: var(--dcui-regular-font-size);
    color: var(--dcui-body-color);
    margin-bottom: 5px;
}

.autocomplete-input {

}

.autocomplete-input.focused{
    background-color: #eeeeee;
}
.autocomplete-dropdown {
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    background-color: #fff;
    border: 1px solid var(--dcui-line-color);
    border-radius: var(--dcui-field-radius);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    max-height: 200px;
    overflow-y: auto;
    z-index: 999;
}


.autocomplete-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 5px 0;
}

.autocomplete-dropdown li {
    cursor: pointer;
    display: block;
    padding: 10px 15px 9px;
    text-align: left;
    color: inherit;
    position: relative;
}

.autocomplete-dropdown li.selected {
    background-color: #eee;
}

.autocomplete-dropdown li:hover {
    background-color: #f0f0f0;
}

.dcui-select-dropdown-close{
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translate(-50%, -50%);
}


/****************************
 *   Dcui Styles Calendar   *
 ****************************/

:root {
    --dcui-calendar-picker-color: #fff;
    --dcui-calendar-input-bg-color: #fff;
    --dcui-calendar-input-bg-disable-color: rgb(245, 245, 245);
    --dcui-calendar-input-text-disable-color: #b8b8b9;
    --dcui-calendar-select-bg-color: #fff;
    --dcui-calendar-border-color: #eaeaeb;
    --dcui-calendar-triangle-color: #eaeaeb;
    --dcui-calendar-shadow: 5px 34px 80px 0px rgba(0, 0, 0, 0.15);
    --dcui-calendar-top-shadow: 5px 34px 80px 0px rgba(0, 0, 0, 0.15);
    --dcui-calendar-text-color: #000000;
    --dcui-calendar-action-color: #7b8187;
    --dcui-calendar-text-disabled-color: #b3b3b3;
    --dcui-calendar-view-button-color: #000000;
    --dcui-calendar-view-button-font-weight: 600;
    --dcui-calendar-view-button-font-size: 1rem;
    --dcui-calendar-datepicker-icon-color: #b2b3b3;
    --dcui-calendar-datepicker-icon-size: 1.1rem;
    --dcui-calendar-active-bg-color: transparent;
    --dcui-calendar-active-text-color: #657ff5;
    --dcui-calendar-active-hover-color:#657ff5;
    --dcui-calendar-active-hover-text-color:#edfff9;
    --dcui-calendar-range-bg-color: #edfff9;
    --dcui-calendar-range-text-color: #7b8187;
    --dcui-calendar-range-radius: 100%;
    --dcui-calendar-day-hover-bg-color: #eaeaeb;
    --dcui-calendar-day-width: 25px;
    --dcui-calendar-day-height: 25px;
    --dcui-calendar-day-font-size: 0.9rem;
    --dcui-calendar-day-font-weight: 650;
    --dcui-calendar-day-name-font-size: 0.9rem;
    --dcui-calendar-day-name-font-weight: 900;
    --dcui-calendar-day-name-color: #b3b3b3;
    --dcui-calendar-input-border: 1px solid #eaeaeb;
    --dcui-calendar-input-text-color: #7b8187;
    --dcui-calendar-input-font-size: 0.9rem;
    --dcui-calendar-input-font-weight: 400;
    --dcui-calendar-content-radius: 20px;
    --dcui-calendar-year-font-size: 1rem;
    --dcui-calendar-year-color: #000000;
    --dcui-calendar-year-font-weight: 450;
    --dcui-calendar-year-disabled-color: #b8b8b9;
    --dcui-calendar-year-disabled-bg-color: transparent;
    --dcui-calendar-year-padding: 10px;
    --dcui-calendar-year-border: none;
    --dcui-calendar-year-border-radius: none;
    --dcui-calendar-month-font-size: 1.1rem;
    --dcui-calendar-month-color: #000000;
    --dcui-calendar-month-font-weight: 450;
    --dcui-calendar-month-disabled-color: #b8b8b9;
    --dcui-calendar-month-disabled-bg-color: transparent;
    --dcui-calendar-month-padding: 8px;
    --dcui-calendar-month-border: none;
    --dcui-calendar-month-border-radius: none;
    --dcui-calendar-year-hover-bg-color:#eaeaeb;
    --dcui-calendar-month-hover-bg-color:#eaeaeb;
}

.dcui-calendar *:focus {
    outline: none;
}

.dcui-calendar * {
    outline: none;
}

.dcui-calendar {
    position: relative;
    width: 100% !important;
    min-width: max-content;
}

.dcui-calendar .content {
    display: flex;
    background: var(--dcui-calendar-picker-color);
    box-shadow: var(--dcui-calendar-shadow);
    position: absolute;
    top: 45px;
    z-index: 99999;
}

.dcui-calendar .input-field {
    display: flex;
    position: relative;
    min-width: 140px;
    font-weight: var(--dcui-calendar-input-font-weight);
}

.dcui-calendar .input-field .clearButton {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    color: var(--dcui-calendar-text-color);
    padding: 0;
    cursor: pointer;
    border: none;
    background: transparent;
    display: flex;
}

.dcui-calendar .input-field .clearButton i {
    fill: currentColor;
}

.dcui-calendar .input-field .clearButton,
.dcui-calendar .input-field .clearButton i {
    font-size: 16px;
}

.dcui-calendar .input-field input:disabled ~ i {
    fill: var(--dcui-calendar-text-color);
}

.dcui-calendar .input-field.long {
    min-width: 290px;
}

.dcui-calendar .input-field input {
    padding-left: 35px;
    padding-right: 20px;
    font-size: var(--dcui-calendar-input-font-size);
    min-width: inherit;
    height: 40px;
    border-radius: 6px;
    border: var(--dcui-calendar-input-border);
    background-color: var(--dcui-calendar-input-bg-color);
    color: var(--dcui-calendar-input-text-color);
    font-weight: inherit;
    cursor: pointer;
    width: 100%;
}

.dcui-calendar .input-field:hover input{
    background-color: #eeeeee;
}


.dcui-calendar .input-field input:disabled {
    background-color: var(--dcui-calendar-input-bg-disable-color);
    color: var(--dcui-calendar-input-text-disable-color);
    cursor: not-allowed;
}

.dcui-calendar .input-field i {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}

.dcui-calendar .input-field i.datepicker {
    left: 10px;
    width: var(--dcui-calendar-datepicker-icon-size);
    height: var(--dcui-calendar-datepicker-icon-size);
    text-align: center;
    cursor: pointer;
}

.dcui-calendar .calendar {
    width: 270px;
    min-height: 240px;
}

.dcui-calendar .calendar.range:first-child {
    border-right: 1px solid var(--dcui-calendar-border-color);
}

.dcui-calendar .calendar:first-child::before {
    content: "";
    position: absolute;
    bottom: 100%;
    top: -20px;
}

.dcui-calendar .calendar .selected-field {
    padding-top: 15px;
    background-color: var(--dcui-calendar-select-bg-color);
    border-radius: 20px;
}

.dcui-calendar .calendar .selected-field .selected-date {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
    padding-bottom: 7px;
    border-bottom: 1px solid rgb(228 228 229);
}

.dcui-calendar .calendar .selected-field .viewButton {
    border: 0;
    width: 100%;
    padding: 10px;
    color: var(--dcui-calendar-view-button-color);
    font-size: var(--dcui-calendar-view-button-font-size);
    font-weight: var(--dcui-calendar-view-button-font-weight);
    margin-right: 10px;
    margin-left: 10px;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
}
.dcui-calendar .calendar .selected-field .viewButton:hover {
    background: #ededed;
}

.dcui-calendar .calendar .selected-field .prevDateButton,
.dcui-calendar .calendar .selected-field .nextDateButton {
    position: relative;
    border: 0;
    background: transparent;
}

.dcui-calendar .calendar .selected-field .prevDateButton::after,
.dcui-calendar .calendar .selected-field .nextDateButton::after {
    display: inline-block;
    cursor: pointer;
    padding: 5px;
    width: 28px;
    border-radius: 10px;
    border: 2px solid #e9e9e9;
    font-family: "Font Awesome 5 Pro";
    text-align: center;
    color: #b3b3b3;
}

.dcui-calendar .calendar .selected-field .prevDateButton::after {
    content: "\f053";
}

.dcui-calendar .calendar .selected-field .nextDateButton::after {
    content: "\f054";
}

.dcui-calendar .calendar .selected-field .prevDateButton:hover::after,
.dcui-calendar .calendar .selected-field .nextDateButton:hover::after {
    border: 2px solid #cdcdcd;
    color:  #adacac;
}

.dcui-calendar .calendar .days {
    display: grid;
    grid-template-columns: repeat(7, minmax(max-content, 1fr));
    gap: 5px;
    padding-bottom: 7px;
}

.dcui-calendar .calendar .years,
.dcui-calendar .calendar .months {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    max-width: calc((var(--dcui-calendar-day-width) * 7) + 20px);
}

.dcui-calendar .calendar .years {
    min-height: 180px;
    display: flex;
    flex-wrap: wrap;
    max-width: calc((var(--dcui-calendar-day-width)* 7) + 70px);
    gap: 15px;
    justify-content: center;
    align-content: flex-start;
    align-items: center;
    padding-bottom: 10px;
}
.dcui-calendar .calendar .months {
    min-height: 170px;
    max-width: calc((var(--dcui-calendar-day-width)* 7) + 70px);
    padding-bottom: 10px;
    display: flex;
    justify-content: space-around;
}

.dcui-calendar .calendar .selected-field,
.dcui-calendar .calendar .days-selection {
    padding-left: 15px;
    padding-right: 15px;
}

.dcui-calendar .calendar .days-selection .days {
    padding-bottom: 15px;
}

.dcui-calendar .calendar .days .day,
.dcui-calendar .calendar .years .year,
.dcui-calendar .calendar .months .month {
    background: transparent;
    border: 0;
    text-align: center;
    cursor: pointer;
}

.dcui-calendar .calendar .years .year,
.dcui-calendar .calendar .months .month {
    width: max-content;
    height: max-content;
}

.dcui-calendar .calendar .months .month {
    font-size: var(--dcui-calendar-month-font-size);
    font-weight: var(--dcui-calendar-month-font-weight);
    color: var(--dcui-calendar-month-color);
    padding: var(--dcui-calendar-month-padding);
    border: var(--dcui-calendar-month-border);
    width: 70px;
}

.dcui-calendar .calendar .months .month:disabled {
    pointer-events: none;
    color: var(--dcui-calendar-month-disabled-color);
    background-color: var(--dcui-calendar-month-disabled-bg-color);
}

.dcui-calendar .calendar .days .day {
    padding: 0;
    font-size: var(--dcui-calendar-day-font-size);
    font-weight: var(--dcui-calendar-day-font-weight);
    color: var(--dcui-calendar-text-color);
    width: 100%;
    display: flex;
    justify-content: center;
    text-align: left;
}

.dcui-calendar .calendar .days .day .number {
    display: flex;
    width: var(--dcui-calendar-day-width);
    height: var(--dcui-calendar-day-height);
    align-items: center;
    justify-content: center;
    padding: 10px;
    font-size: inherit;
    border-radius: 7px;
    line-height: normal;
}

.dcui-calendar .calendar .days .day.name {
    pointer-events: none;
    font-size: var(--dcui-calendar-day-name-font-size);
    font-weight: var(--dcui-calendar-day-name-font-weight);
    color: var(--dcui-calendar-day-name-color);
    width: auto;
}

.dcui-calendar .calendar .days .day.selectedDate .number {
    background: var(--dcui-calendar-active-bg-color);
    color: var(--dcui-calendar-active-text-color);
    border: 2px solid #657ff5;
}

.dcui-calendar .calendar .days .day.circle .number {
    border-radius: 100%;
}

.dcui-calendar .calendar .days .day.selectedRange {
    background: var(--dcui-calendar-range-bg-color);
    color: var(--dcui-calendar-range-text-color);
}

.dcui-calendar .calendar:first-child .days .day.selectedDate {
    border-top-left-radius: var(--dcui-calendar-range-radius);
    border-bottom-left-radius: var(--dcui-calendar-range-radius);
}

.dcui-calendar .calendar .days .day.selectedDate:hover .number{
    background: var(--dcui-calendar-active-hover-color);
    color: var(--dcui-calendar-active-hover-text-color);
}

.dcui-calendar .calendar:last-child .days .day.selectedDate {
    border-top-right-radius: var(--dcui-calendar-range-radius);
    border-bottom-right-radius: var(--dcui-calendar-range-radius);
}

.dcui-calendar .calendar .days .day.disabledDate {
    pointer-events: none;
    color: var(--dcui-calendar-text-disabled-color);
    font-weight: 500;
}

.dcui-calendar .calendar .days .day.disabledDate.selectedRange {
    background: var(--dcui-calendar-range-bg-color);
}

.dcui-calendar .calendar .days .day:hover .number{
    background: var(--dcui-calendar-day-hover-bg-color);
}

.dcui-calendar .calendar .years .year {
    font-size: var(--dcui-calendar-year-font-size);
    font-weight: var(--dcui-calendar-year-font-weight);
    color: var(--dcui-calendar-year-color);
    padding: var(--dcui-calendar-year-padding);
    border: var(--dcui-calendar-year-border);
    border-radius: var(--dcui-calendar-year-border-radius);
}

.dcui-calendar .calendar .years .year:hover,
.dcui-calendar .calendar .months .month:hover{
    background-color: var(--dcui-calendar-month-hover-bg-color);
    border-radius: 7px;
}

.dcui-calendar .calendar .years .year:disabled {
    pointer-events: none;
    color: var(--dcui-calendar-year-disabled-color);
    background-color: var(--dcui-calendar-year-disabled-bg-color);
}

.dcui-calendar.left .content {
    left: 0;
    transform: translateY(5px);
    border-bottom-left-radius: var(--dcui-calendar-content-radius);
    border-bottom-right-radius: var(--dcui-calendar-content-radius);
    border-top-right-radius: var(--dcui-calendar-content-radius);
}

.dcui-calendar.left .calendar:first-child::before {
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent var(--dcui-calendar-triangle-color)
    transparent;
    left: 0;
}

.dcui-calendar.right .content {
    right: 0;
    transform: translateY(5px);
    border-bottom-left-radius: var(--dcui-calendar-content-radius);
    border-bottom-right-radius: var(--dcui-calendar-content-radius);
    border-top-left-radius: var(--dcui-calendar-content-radius);
}

.dcui-calendar.right .calendar:first-child::before {
    right: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent var(--dcui-calendar-triangle-color)
    transparent;
}

.dcui-calendar.top .content {
    top: 100%;
    transform: translateY(calc(-100% - 66px));
    box-shadow: var(--dcui-calendar-top-shadow);
    border-top-left-radius: var(--dcui-calendar-content-radius);
    border-top-right-radius: var(--dcui-calendar-content-radius);
    border-bottom-right-radius: var(--dcui-calendar-content-radius);
}

.dcui-calendar.top .content .calendar:first-child::before {
    border-width: 5px;
    border-style: solid;
    border-color: var(--dcui-calendar-triangle-color) transparent transparent
    transparent;
    top: 100%;
    left: 0;
}

.dcui-calendar.bottom .content {
    transform: translateY(5px);
    border-bottom-left-radius: var(--dcui-calendar-content-radius);
    border-bottom-right-radius: var(--dcui-calendar-content-radius);
    border-top-right-radius: var(--dcui-calendar-content-radius);
}

.dcui-calendar.bottom .content .calendar:first-child::before {
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent var(--dcui-calendar-triangle-color)
    transparent;
    left: 0;
}

.dcui-calendar.center .calendar:first-child::before {
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent var(--dcui-calendar-triangle-color)
    transparent;
    left: 50%;
    transform: translateX(-50%);
}

.dcui-calendar.center .content {
    transform: translateY(5px) translateX(-50%);
    left: 50%;
    border-bottom-left-radius: var(--dcui-calendar-content-radius);
    border-bottom-right-radius: var(--dcui-calendar-content-radius);
    border-top-right-radius: var(--dcui-calendar-content-radius);
}

.dc-datepicker-filed-no-outline.dcui-calendar .input-field input{
    border: transparent;
} :root {
    --content-guard: 1920px;
    --topbar-height: 70px;
    --sidebar-width: 90px;
}

html,
body,
#app,
.xp-content-guard {
    height: 100%;
    overflow-y: auto !important;
}

.dark-mode .xp-content-guard {
    max-width: var(--content-guard);
    margin: 0 auto;
    background-color: #FBFBFD;
    overflow: hidden;
    position: relative;
}

.light-mode .xp-content-guard {
    max-width: var(--content-guard);
    margin: 0 auto;
    background-color: var(--light-tertiary-color);
    overflow: hidden;
    position: relative;
}

#xp-default-banner {
    text-align: center;
    margin: 10% auto;
    max-width: 992px;
}

#xp-default-banner .xp-db-text-head {
    margin-bottom: 0;
    font-weight: 300;
    font-size: 35px;
}

#xp-default-banner .xp-db-icon {
    width: 70px;
    height: 70px;
    line-height: 70px;
    font-size: 25px;
    display: inline-block;
    border-radius: 100%;
    background-color: #eee;
    color: #959595;
}

.bg-gradient-blue {
    background: linear-gradient(261.96deg, #00578c 29.34%, #001a30 121.48%);
}

.bg-full-image {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}

.bg-full-image::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(270deg, rgba(0, 29, 53, 0) 29.44%, #001d35 94.6%);
}

.bg-full-image .graphic-circuit-lines {
    position: absolute;
    width: 200px;
    top: calc(50% - 140px);
    left: 0;
    pointer-events: none;
}

.atc-contianer {
    display: grid;
    margin-top: 0.5rem;
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.atc-content {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.atc-label {
    display: flex;
    padding: 2.5rem;
    flex-direction: column;
    border-radius: 0.5rem;
    border-width: 4px;
    border-style: dashed;
    width: 100%;
    text-align: center;
}

.atc-space {
    display: flex;
    margin-top: -2.5rem;
    flex: 1 1 auto;
    width: 40%;
    max-height: 12rem;
    justify-content: center;
    height: 30px;
}

.atc-img {
    object-position: center;
    font-size: 5rem;
}

.atc-select-file {
    color: #2563EB;
}

.atc-text-p {
    color: #6B7280;
}

.atc-txt {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.atc-select-file:hover {
    text-decoration: underline;
}

.atc-img-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    text-align: center;

}

.atc-title {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.025em;
    color: #6B7280;
}


.ve-circle-avatar {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    overflow: hidden;
}

.cp-v-card {
    border-bottom: 1px solid #4b4b4b;
    padding: 10px 0;
}

/*
* Loris
*/
.hide-input-file {
    visibility: hidden !important;
    position: absolute !important;
    height: 0 !important;
    width: 0 !important;
    opacity: 0 !important;
}

.hide-element {
    visibility: hidden !important;
    opacity: 0 !important;
}

select.form-control {
    cursor: pointer;
}

/**
 * Authentication
 */
.ve-full-page-knife-cut {
    height: 100%;
}

.ve-full-page-knife-cut .kc-columns {
    width: 100%;
    height: 100%;
    position: relative;
}

.ve-full-page-knife-cut .kc-columns::after {
    content: "";
    clear: both;
    display: table;
}

.kc-columns .kc-col-left,
.kc-columns .kc-col-right {
    float: left;
    width: calc(50% + 150px);
    height: 100%;
    display: flex;
    align-items: center;
}

.kc-columns .kc-col-left {
    justify-content: flex-start;
    padding-left: 12%;
}

.kc-columns .kc-col-right {
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    justify-content: flex-end;
    padding-right: 12%;
}

.kc-columns .kc-col-right .kc-skew {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: -1;
    overflow: hidden;
}

.kc-columns .kc-col-right .kc-skew::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(261.96deg, #00578c 29.34%, #001a30 121.48%);
    -ms-transform: skew(14deg, 0deg);
    -webkit-transform: skew(14deg, 0deg);
    transform: skew(14deg, 0deg);
    transform-origin: left top;
}

#ve-page-auth .pa-left-content {
    position: inherit;
    max-width: 480px;
    text-align: justify;
}

.pa-left-content .pa-lc-logo {
    max-width: 100%;
    height: auto;
}

.pa-left-content .pa-lc-text {
    color: #fff;
    margin-top: 10px;
}

.auth-logo {
    text-align: center;
    margin-bottom: 25px;
    height: 100%;
}

.auth-logo img {
    width: 100px;
    height: 100px;
}

.auth-card-panel {
    width: 440px;
}

.dark-mode .auth-card-panel .acp-boxer {
    background-color: var(--dark-secondary-color);
    padding: 40px;
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
    color: var(--dark-color-text);
}

.dark-mode .auth-card-panel .acp-boxer a {
    color: #faf7f7;
}

.dark-mode .auth-card-panel .acp-boxer a:hover {
    color: #808080;
}

.light-mode .auth-card-panel .acp-boxer a {
    color: #020202;
}

.light-mode .auth-card-panel .acp-boxer a:hover {
    color: #808080;
}

.light-mode .auth-card-panel .acp-boxer {
    padding: 40px;
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
    color: var(--light-color-text);
}

.auth-card-panel .acp-heading {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.dark-mode .auth-card-panel .acp-heading {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    color: var(--dark-color-text);
}

.light-mode .auth-card-panel .acp-heading {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    color: var(--light-color-text);
}

.auth-card-panel .acp-description {
    line-height: 1.3;
    color: #8d8d8d;
    font-size: 14px;
}

.dark-mode .auth-card-panel .acp-footer {
    color: var(--dark-quaternary-color);
    font-weight: 200;
    font-size: 14px;
    padding-top: 20px;
    line-height: 1;
}

.light-mode .auth-card-panel .acp-footer {
    color: var(--light-secondary-color);
    font-weight: 200;
    font-size: 14px;
    padding-top: 20px;
    line-height: 1;
}

.auth-card-panel .acp-boxer.head-tail-gapped {
    padding-top: 150px;
    padding-bottom: 150px;
}

.text-separator {
    position: relative;
    text-align: center;
    line-height: 1;
}

.text-separator span {
    display: inline-block;
    background-color: #fff;
    padding: 0 15px;
    position: relative;
}

.text-separator::before {
    position: absolute;
    content: "";
    height: 1px;
    background-color: #dedede;
    left: 10px;
    right: 10px;
    top: 48%;
}

/**
 * Top bar
 */
#app-topbar {
    width: 100%;
    height: var(--topbar-height);
    position: fixed;
    max-width: var(--content-guard);
    top: 0;
    left: 50%;
    z-index: 90;
    padding: 0 15px;
    padding-left: calc(var(--sidebar-width) + 15px);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #424242;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
}

.dark-mode #app-topbar {
    background-color: var(--dark-tertiary-color);
}

.light-mode #app-topbar {
    background-color: #c1c1c1;
}

#app-topbar .at-content {
    height: 100%;
    width: 100%;
}

.at-content .at-logo {
    max-width: 280px;
    min-width: 194px;
    height: 30px;
    display: inline-block;
}

.at-content .at-logo img {
    max-height: 100%;
    max-width: 100%;
    min-height: 30px;
}

.at-lu-content > div:not(:last-child) {
    margin-right: 13px;
}

.at-lu-content .at-lu-details span {
    display: block;
    line-height: 1;
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.at-lu-content .at-lu-details .at-lud-sub {
    font-size: 12px;
    font-weight: 200;
}

.dark-mode .at-lu-content .at-lu-details,
.dark-mode .at-lu-content .at-icon-dropdown {
    color: #fff;
}

.light-mode .at-lu-content .at-lu-details,
.light-mode .at-lu-content .at-icon-dropdown {
    color: #000000;
}

.at-content .at-elem-separator {
    width: 1px;
    height: calc(100% - 20px);
    margin: 0 25px;
    background-color: var(--dark-seven-color);
}

.light-mode .at-content .at-elem-separator {
    background-color: #999999;
}


.at-content .at-icon-item {
    position: relative;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 70px;
    text-align: center;
    cursor: pointer;
}

.at-icon-item .at-ii-icon {
    display: inline-block;
    color: #fff;
    font-size: 24px;
    line-height: 1;
    position: relative;
}

.light-mode .at-icon-item .at-ii-icon {
    color: #313131;
}

.light-mode .at-content .at-icon-item:hover {
    color: #d3d3d3;
    background-color: var(--light-senary-color);
}


.at-content .at-icon-item:hover {
    background-color: var(--dark-senary-color);
}

.at-content .at-icon-item:hover .at-ii-icon {
    color: var(--quaternary-color);
}

.icon-bubble {
    position: absolute;
    display: inline-block;
    min-width: 20px;
    height: 20px;
    line-height: 16px;
    border-radius: 100px;
    color: #fff;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    z-index: 1;
    padding: 3px;
    top: -5px;
    left: 50%;
    background-color: #fff;
    white-space: nowrap;
}

.icon-bubble.bubble-red {
    background-color: #f00;
}

.at-content .at-search {
    width: 412px;
}

.at-search .form-control {
    background-color: transparent;
    border-radius: 0;
    border-top: none;
    border-left: none;
    border-right: none;
    box-shadow: none;
    color: #fff;
    padding-right: 50px;
}

.light-mode .at-search .form-control {
    color: #000000;
}

.at-search .icon-control .ic-icon {
    background-color: transparent;
    color: #fff;
    font-size: 20px;
    width: 40px;
}

.light-mode .at-search .icon-control .ic-icon {
    background-color: transparent;
    color: #000000;
    font-size: 20px;
    width: 40px;
}

.light-mode #megaSearch::placeholder {
    color: #000;
}

#tb-mega-menu1 {
    min-height: 265px;
    position: absolute;
    background-color: #fff;
    left: 0;
    right: 0;
    padding: 40px 8%;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

#tb-mega-menu1 .tb-mm-wrap {
    flex-wrap: wrap;
}

#tb-mega-menu {
    position: absolute;
    background-color: #fff;
    left: 0;
    right: 0;
    padding: 40px 8%;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

#tb-mega-menu .tb-mm-wrap {
    flex-wrap: wrap;
}

.tb-mm-wrap .tb-mm-item {
    width: 20%;
    padding-right: 30px;
    margin-bottom: 20px;
}

.tb-mm-item > a {
    padding: 13px 13px;
}

.tb-mm-item .tb-mmi-icon {
    width: 35px;
    min-width: 35px;
    font-size: 18px;
}

.tb-mm-item .tb-mmi-text {
    color: var(--body-color);
    flex: 1;
}

.tb-mmi-text .tb-mmi-label {
    margin-bottom: 5px;
    line-height: 1;
}

.tb-mmi-text .tb-mmi-desc {
    font-size: 12px;
}

.tb-mm-item > a:hover {
    background-color: rgba(0, 121, 192, 0.15);
}

/**
* View as company top bar
*/
.viewASCompany-container {
    display: flex;
    align-items: center;
    height: 100%;
}

.viewASCompany-container .viewASCompany-logo {
    filter: drop-shadow(1px 2px 9px rgba(0, 121, 192, 0.15));
    border: 0.001em solid #3f3f3f;
    border-radius: 50px;
    height: 2.2rem;
    justify-content: center;
    overflow: hidden;
    margin-right: 10px;
    width: 2.2rem;
    min-width: 2.2rem;
}

.viewASCompany-container .viewASCompany-logo img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.viewASCompany-container .viewAsCompany-text {
    font-size: 15px;
    color: white;
    margin-right: 10px;
}

.light-mode .viewASCompany-container .viewAsCompany-text {
    font-size: 15px;
    color: inherit;
    margin-right: 10px;
}

.viewASCompany-container .viewASCompany-downArrow {
    font-size: 15px;
    color: white;
    margin-right: 10px;
}

.light-mode .viewASCompany-container .viewASCompany-downArrow {
    font-size: 15px;
    color: rgb(0, 0, 0);
    margin-right: 10px;
}

.vw-company-list {
    width: 240px;
}

.vw-container > li > a.doing-ajax {
    pointer-events: none;
}

.vw-container > li > a.doing-ajax .ajax-ellipsis-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--dark-quinary-color);
}

.dark-mode .vw-search-input {
    background-color: #5d5d5d !important;
}

.vwbar.signout {
    cursor: pointer;
    height: 44px;
    line-height: 30px;
    border-top: 1px black solid;
    text-align: center;
    margin-top: 5px;
    font-weight: 300;
}

.vwbar.signout:hover {
    background-color: black;
}

.light-mode .vwbar.signout:hover {
    background-color: #dddddd;
}

.vw-view-container {
    width: 240px;
    padding: 0;
}

.vw-company-list:hover {
    cursor: pointer;
    background-color: var(--dark-quinary-color);
}

.light-mode .vw-company-list:hover {
    cursor: pointer;
    background-color: var(--light-secondary-color);
    color: var(--light-tertiary-color);
}

.vw-search-container {
    padding: 10px 15px;
    border-bottom: 1px solid black;
}

.megasearch {
    height: 35px;
}

#tb-search .ic-icon {
    height: 35px;
    line-height: 36px;
    font-size: 15px;
}

/**
* Field set
*/
.fl-fieldset {
    border-color: #d3d3d3;
    border-width: 1px;
    padding-bottom: 5px;
}

/**
 * Side bar
 */
#app-sidebar {
    width: var(--sidebar-width);
    position: fixed;
    background-color: var(--secondary-color);
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 99;
    color: var(--color-text);
}

.dark-mode #app-sidebar {
    background-color: var(--dark-secondary-color);
    color: var(--dark-color-text);
}

.light-mode #app-sidebar {
    background-color: #999999;
    color: var(--light-color-text);
}

.as-do-logo {
    text-align: center;
    height: var(--topbar-height);
    display: flex;
    justify-content: center;
    align-items: center;
}

.as-nav .as-nav-item {
    text-align: center;
}

.dark-mode .as-nav .as-nav-item.active,
.dark-mode .as-nav .as-nav-item:hover {
    background-color: var(--menu-selected-color);
    color: var(--dark-quaternary-color) !important;
}

.light-mode .as-nav .as-nav-item.active,
.light-mode .as-nav .as-nav-item:hover {
    background-color: var(--menu-selected-color);
    color: var(--light-tertiary-color) !important;
}

.light-mode .as-nav .as-nav-item.active a,
.light-mode .as-nav .as-nav-item:hover a {
    color: var(--light-tertiary-color) !important;
}

.as-nav .as-nav-item > a {
    display: block;
    padding: 13px 5px;
}

.as-nav-item .as-ni-icon {
    font-size: 22px;
    line-height: 1;
    margin-bottom: 1px;
}

.as-nav-item .as-ni-label {
    font-size: 12px;
    line-height: 1;
    /*white-space: nowrap;*/
}

/**
*Nuwan
*/
.app-qb-thumb {
    width: 250px;
}

.app-qb-thumb.btn:hover {
    cursor: pointer;
}

.ss-app-container {
    width: 280px;
    height: 160px;
    padding: 15px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 5px;
    border: 1px solid #ffffff;
}

.dark-mode .ss-app-container {
    background-color: var(--dark-tertiary-color);
    border: 1px solid var(--dark-tertiary-color);
}

.light-mode .ss-app-container {
    background-color: #e5e5e5;
    border: 1px solid #e5e5e5;
}

.side-box {
    width: auto;
    margin-left: 100px;
    margin-top: 20px;
    margin-right: 6px;
    border: 1px solid #d3cfcf;
    padding: 24px;
}

.no-notification-icon {
    font-size: 100px;
    padding-top: 65px;
    color: var(--secondary-color);
}

/*
*Radio button
*/
/* input[type=radio].vs-Radio {
  padding: 5px;
  margin-right: 5px;
  -webkit-appearance: none;
  outline: 0.1em solid black;
  outline-offset: 0.1rem;
}

input[type=radio]:checked.vs-Radio {
  display: inline-block;
  background-color: var(--secondary-color);
} */

.two-fa {
    border: 1px solid #c8c8c8;
    padding: 10px;
}

.xp_under_construction {
    text-align: center;
}

.text-under-logo {
    display: none;
}

.text-under-logo.show {
    display: block;
    position: absolute;
    right: 0px;
    color: white;
    line-height: 1px;
    font-size: 11px;
    bottom: -7px;
}

.fa-icon {
    font-size: 25px;
    color: var(--secondary-color);
}

/*
*Assign Employees
*/
.ase_no_results {
    position: absolute;
    top: 248px;
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
    flex-direction: column;
    left: 7px;
}

.ase_no_results-container {
    width: 100px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ase_no_results-icon {
    font-size: 35px;
    color: #cbcbcb;
}

.ase_no_results-header {
    font-size: 20px;
    margin-top: 5px;
    font-weight: 500;
}

/*
*Mega Search
*/
.mega_search_no_results {
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
    flex-direction: column;
}

.mega_search_no_results-container {
    width: 100px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mega_search_no_results-icon {
    font-size: 35px;
    color: #cbcbcb;
}

.mega_search_no_results-header {
    font-size: 20px;
    margin-top: 5px;
    font-weight: 500;
}

.megaSearch .megaSearch-main-title {
    padding: 0px 15px;
    font-size: 20px;
    font-weight: 600;
    border-bottom: 1px solid #d2d5d7;
    min-height: 60px;
}

.megaSearch .megaSearch-main-item {
    padding-top: 14px;
    padding-bottom: 9px;
}

.megaSearch-bar-ul li.megaSearch-main-item {
    border-bottom: 1px solid #d2d5d7;
}

.megaSearch-bar-ul li:last-child.megaSearch-main-item {
    border-bottom: 0;
}

.megaSearch-bar-ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.megaSearch-description ul {
    list-style: none;
    padding-left: 0;
}

.megaSearch-sub-list {
    border-bottom: 1px solid #d7d7d7;
    font-size: 15px;
    font-weight: 400;
    margin: 0;
    list-style: inside;
}

.megaSearch-sub-list li {
    padding-left: 0 !important;
}

/* .notification-sub-list :hover {
  background-color:#e9f7ff;;
} */
.megaSearch-sub-list li::marker {
    font-size: 20px !important;
}

.sub-megaSearch-title {
    font-size: 15px;
}

.sub-megaSearch-date {
    font-size: 12px;
}

.megaSearch-no-results-text {
    position: absolute;
    left: 120px;
    top: 60px;
    font-size: 20px;
    font-weight: 600;
    list-style: none;
}

.megaSearch-sub-list .unread {
    color: var(--secondary-color);
    font-weight: 600;
    background-color: #f2faff;
    cursor: pointer;
}

.megaSearch-container {
    max-width: 775px;
    margin: 0 auto;
}

.megaSearch-main-date {
    font-size: 12px;
    color: #8d8d8d;
}

.megaSearch-icon-main {
    font-size: 18px;
    max-width: 18px;
    min-width: 18px;
    color: var(--secondary-color);
}

.megaSearch-main-container {
    padding-top: 15px;
    padding-bottom: 5px;
    padding-left: 30px;
}

.megaSearch-main-title {
    font-size: 20px;
    padding-left: 25px;
}

.megaSearch-icon {
    max-width: 18px;
    min-width: 18px;
    font-size: 18px;
    color: black;
}

.dark-mode .megaSearch-icon {
    color: #f7f7f7;
}

.dark-mode .megaSearch-title {
    color: #f7f7f7;
    font-size: 13px;
}

.dark-mode .megaSearch-title:hover {
    color: #8d8d8d;
}

.megaSearch-title {
    color: #000;
    font-size: 13px;
}

.megaSearch-title:hover {
    color: var(--dark-senary-color);
}

.megaSearch-description {
    font-size: small;
}

.megaSearch-description ul {
    list-style: none;
    padding-left: 0;
}

.megaSearch-description ul :last-child {
    padding-bottom: 0;
}

.megaSearch-description ul li {
    padding-left: 85px !important;
    margin-bottom: 5px;
    cursor: pointer;
}

.megaSearch-description ul li span {
    color: #8d8d8d;
}

.megaSearch-description ul li.highlight {
    color: var(--secondary-color);
    font-weight: 600;
    padding-top: 5px;
}

.dark-mode .megaSearch-description ul li.highlight {
    color: white;
}

.dark-mode .megaSearch-description ul li a {
    color: rgb(226, 226, 226);
}

.megaSearch-description ul li a {
    color: black;
}

.megaSearch-description .megaSearch-bar-ul li {
    padding-left: 15px !important;
}

.megaSearch-description ul li a:hover {
    color: #a8a8a8;
}

.dark-mode .megaSearch-description ul li a:hover {
    color: #c3c3c3;
}

/*
*Registration
*/
.registrations-action-btn {
    font-size: 20px !important;
}

/*
*Notification bar and Notifications
*/

.notification {
    list-style: none;
    padding: 0;
    margin: 5px 0;
}

.notification .notification-main-title {
    padding: 0px 15px;
    font-size: 20px;
    font-weight: 600;
    border-bottom: 1px solid #d2d5d7;
}

.notification .notification-main-item {
    padding-top: 11px;
}

.notification-bar-ul li.notification-main-item {
    border-bottom: 1px solid #d2d5d7;
}

.notification-bar-ul li:last-child.notification-main-item {
    border-bottom: 0;
}

.notification-bar-ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.notification-bar-ul li:nth-of-type(1n + 4) {
    display: none;
}

.notification-description ul {
    list-style: none;
    padding-left: 0;
}

.notification-sub-list {
    border-bottom: 1px solid #d7d7d7;
    font-size: 15px;
    font-weight: 400;
    margin: 0;
    list-style: inside;
}

.notification-sub-list li {
    padding-left: 0 !important;
}

/* .notification-sub-list :hover {
  background-color:#e9f7ff;;
} */
.notification-sub-list li::marker {
    font-size: 20px !important;
}

.sub-notification-title {
    font-size: 14px;
}

.sub-notification-date {
    font-size: 12px;
}

.notification-sub-list .unread {
    color: var(--secondary-color);
    font-weight: 600;
    background-color: #f2faff;
    cursor: pointer;
}

.notification-container {
    max-width: 775px;
    margin: 0 auto;
}

.notification-main-date {
    font-size: 12px;
    color: #8d8d8d;
}

.notification-icon-main {
    font-size: 24px;
    width: 70px;
    min-width: 70px;
    text-align: center;
    color: var(--secondary-color);
}

.notification-main-container {
    padding-top: 15px;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
}

.notification-main-title {
    font-size: 20px;
}

.notification-icon {
    max-width: 35px;
    min-width: 20px;
    font-size: 20px;
    color: var(--secondary-color);
    text-align: center;
}

.notification-description {
    font-size: small;
}

.notification-description ul {
    list-style: none;
    padding-left: 0;
}

.notification-description ul :last-child {
    padding-bottom: 0;
}

.notification-description ul li {
    padding-left: 5px !important;
    margin-bottom: 5px;
    padding-right: 5px;
    cursor: pointer;
}

.notification-description ul li span {
    color: #8d8d8d;
}

.notification-description ul li.unread {
    background-color: #f2faff;
    color: var(--secondary-color);
    font-weight: 600;
    padding-top: 10px;
}

.notification-description ul li a {
    color: black;
}

.notification-description .notification-bar-ul li {
    padding-left: 5px !important;
    padding-right: 5px;
}

.notification-description ul li a:hover {
    color: rgb(187, 187, 187);
}

.notification .mark-as-read {
    font-size: 15px;
    font-weight: 400;
    color: #2491c7;
    cursor: pointer;
}

.mark-as-read-icon {
    letter-spacing: -5px;
}

.view-all-notifcations {
    text-decoration: none;
}

.image-icon-text:hover {
    color: #e1dede;
}

.viewall-ul {
    padding: 0;
    margin: 0;
    border-top: 1px solid #d3d2d2;
    list-style: none;
}

.dark-mode .action-btns {
    color: var(--dark-quaternary-color);
}

.dark-mode .action-btns:hover {
    color: #9d9c9c;
}

.light-mode .action-btns {
    color: var(--light-primary-color);
}

.light-mode .action-btns:hover {
    color: var(--light-senary-color);
}

#xp-loader-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
}

.xp-loader {
    background-color: var(--dcui-primary-color);
    transition: width 0.5s ease;
    height: 3px;
    display: none;
}

.xp-loader.show {
    width: 0%;
    display: block;
}

.data-loader-container {
    position: relative;
    min-height: 300px;
}

.link-box {
    margin: 0 15px 15px 15px;
    padding: 22px 22px 22px 22px;
    border: 1px solid #d5d5d5;
    width: 96.6%;
}

.link-box-remove {
    position: absolute;
    right: 6px;
    top: 3px;
    font-size: 20px;
}

.link-box-remove.edit-service-link {
    right: 0 !important;
    top: -5px !important;
}

.sub-text {
    color: #8d8d8d;
    font-size: 13px;
}

.bgcolor-light-gray {
    background-color: #f1f1f1;
}

.light-gray {
    color: #787878;
}


.user-image-placeholder {
    position: relative;
    background-color: #fdfdfd;
}

.user-image-placeholder::before {
    display: inherit;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f007";
    font-size: 50px;
    color: #c5c5c5;
    text-align: center;
}

.sph-container {
    background-color: #f5f5f5;
}

/*
*No result
*/
.no-results {
    display: flex;
    justify-content: center;
    height: 500px;
    width: 100%;
    align-items: center;
    flex-direction: column;
    padding-bottom: 165px;
}

.no-results .no-results-header {
    font-size: 22px;
    margin-top: 10px;
    font-weight: 500;
}

.no-results .no-results-icon {
    font-size: 50px;
    color: #cbcbcb;
}

.no-results-icon-container {
    background: #ebebeb;
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    border: 1px solid #efefef;
}

/*
*No permissions
*/
.no-permission {
    display: flex;
    justify-content: center;
    height: 500px;
    width: 100%;
    align-items: center;
    flex-direction: column;
    padding-bottom: 165px;
}

.no-permission-icon-container {
    background: #ebebeb;
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    border: 1px solid #efefef;
}

.no-permission-header {
    font-size: 22px;
    margin-top: 10px;
    font-weight: 500;
}

.no-permission-icon {
    font-size: 50px;
    color: #cbcbcb;
}

/*
*Scroll bar
*/
.side-bar-scroll {
    height: calc(100% - 104px);
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

#show_scroll_up_down_btn {
    display: none;
}

/* .side-bar-scroll::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
} */

.side-bar-scroll::-webkit-scrollbar {
    display: none;
    /* width: 6px;
      background-color: #F5F5F5; */
}

/* .side-bar-scroll::-webkit-scrollbar-thumb
{
	background-color: #1881c6;
} */
.sidebar-bottom {
    height: 65px;
    bottom: 0;
    position: absolute;
    width: 100%;
}

.sidebar-company-logo {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    display: inline-block;
    height: 40px;
    overflow: hidden;
    width: 41px;
}

.sidebar-bottom-arrows {
    font-size: 20px;
}

.sidebar-up {
    color: #00578c;
    transition: 0.25s ease;
    transform: rotate(0deg);
}

.sidebar-arrow-animate {
    transform: rotate(180deg);
}

.sb-mega-menu-icon {
    height: 100%;
    font-size: 25px;
    text-align: center;
    line-height: 70px;
}

.sb-mega-menu-icon:hover {
    cursor: pointer;
    background-color: var(--quinary-color);
}

.side-mega-menu {
    background-color: var(--dark-tertiary-color);
    height: 100%;
    width: 100%;
    z-index: 9999999;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
}

.side-mega-container {
    width: 100%;
    height: 100%;
    padding: 60px 100px 0;
}

.side-mega-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.dark-mode .side-mega-top .close-icon {
    font-size: 30px;
    color: var(--dark-quaternary-color);
}

.dark-mode .side-mega-top .close-icon :hover {
    cursor: pointer;
    color: var(--dark-quinary-color);
}

.light-mode .side-mega-top .close-icon {
    font-size: 30px;
    color: var(--light-secondary-color);
}

.light-mode .side-mega-top .close-icon :hover {
    cursor: pointer;
    color: var(--light-quinary-color);
}

.mode .side-mega-top .close-icon {
    font-size: 30px;
    color: var(--quaternary-color);
}

.mode .side-mega-top .close-icon :hover {
    cursor: pointer;
    color: var(--quinary-color);
}

.side-mega-middle-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.side-mega-middle-boxes {
    background-color: #3e3e3f;
    width: 300px;
    height: 100px;
    flex: 0 0 19%;
    margin-right: 0.85%;
    box-sizing: border-box;
    margin-top: 15px;
}

.dark-mode .side-mega-middle-boxes {
    background-color: var(--dark-eight-color);
    color: white;
}

.light-mode .side-mega-middle-boxes {
    background-color: #e3e3e3;
    color: rgb(0, 0, 0);
}

.side-mega-middle-boxes:hover {
    background-color: var(--dark-quinary-color);
    cursor: pointer;
}

.light-mode .side-mega-middle-boxes:hover {
    background-color: var(--light-secondary-color);
    color: var(--light-tertiary-color);
}

.dark-mode .side-mega-middle-boxes:hover {
    background-color: var(--dark-quinary-color);
    color: var(--dark-color-text);
}

.smm-content {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 15px;
}

.smm-icon {
    font-size: 40px;
}

.slide-fade-right-enter-active {
    transition: all 0.1s ease-out;
}

.slide-fade-right-leave-active {
    transition: all 0.2s ease-out;
}

.slide-fade-right-enter-from,
.slide-fade-right-leave-to {
    transform: translateX(-50px);
    opacity: 0;
}

.slide-fade-top-enter-active {
    transition: all 0.1s ease-out;
}

.slide-fade-top-leave-active {
    transition: all 0.2s ease-out;
}

.slide-fade-top-enter-from,
.slide-fade-top-leave-to {
    transform: translateY(-50px);
    opacity: 0;
}

/*
*Table
*/
.th-40 {
    width: 40%;
}

.th-50 {
    width: 50%;
}

.th-60 {
    width: 60%;
}

/*
company icon
*/
.image-icon-container {
    flex-direction: row;
}

.image-icon {
    filter: drop-shadow(1px 2px 9px rgba(0, 121, 192, 0.15));
    border: 0.001em solid #e4dfdf;
    border-radius: 50px;
    height: 2.2rem;
    justify-content: center;
    overflow: hidden;
    margin-right: 5px;
    width: 2.2rem;
}

.image-icon .company-icon {
    max-width: 100%;
    object-fit: cover;
    height: 100%;
}

.image-icon-nav {
    border: 0.15em solid #e4dfdf;
    border-radius: 50px;
    height: 40px;
    justify-content: center;
    overflow: hidden;
    margin-right: 5px;
    width: 40px;
    min-width: 40px;
    min-height: 40px;
}

.image-icon-nav img {
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 100%;
    object-fit: cover;
}

/**
* table-menu
*/
.table-menu-bar {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    text-align: left;
}

.table-menu-bar a {
    margin: 25px;
}

/**
*popup open
*/
.pop-card-panel {
    background-color: #fff;
    box-shadow: 1px 2px 9px rgba(0, 121, 192, 0.15);
}

.popup {
    position: relative;
    background-color: #fff;
    min-width: 650px;
    border-radius: var(--dcui-field-radius);
    overflow: hidden;
    z-index: 1000 !important;
    padding: 30px;
    box-shadow: 0px 1px 16px -7px rgba(66, 66, 66, 0.25);
    margin: 50px auto;
    max-width: 95%;
}

.popup-blur-overlay {
    background-color: rgb(65 65 65 / 30%);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(5px);
}

.popup-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;

}


.popup-overlay {
    bottom: 0;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 999 !important;
}

.popup-close-container {
    right: 11px;
    position: absolute;
    top: 7px;
    color: #d8d8d8;
    font-size: 23px;
    cursor: pointer;
}


.popup-close-container a {
    color: inherit;
}

.popup-close-container a i {
    transform: rotate(0deg);
    transition: all 0.5s ease-in-out;
}

.popup-close-container a i:hover {
    transform: rotate(180deg);
}

/**
*Accordion
*/

.accordion {
    box-shadow: 1px 2px 9px rgb(0 121 192 / 15%);
    position: relative;
}

.accordion .head {
    align-items: center;
    background-color: #ffffff;
    color: #4d5156;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    padding: 0px 20px;
    transition: 0.2s ease-in-out;
}

.accordion .arrow {
    color: #4d5156;
    font-size: 20px;
    opacity: 1;
    transition: 0.25s ease;
    transform: rotate(-180deg);
}

.accordion .arrow-animate {
    opacity: 1;
    transform: rotate(0deg);
}

.accordion .content {
    /* opacity: 0; */
    background-color: #ffffff;
    border-top: 0.001em solid #dcdcdc;
    color: #333333;
    /* max-height: 0; */
    /* padding: 0 20px; */
    padding: 5px 20px;
    /* transition: 0.5s ease-in-out;; */
}

.accordion .content p {
    /* opacity: 0; */
    /* transition: 0.4s ease-in-out;; */
}

.accordion .content.show p {
    opacity: 1;
}

.accordion .show {
    opacity: 1;
    max-height: 10000px;
    /* height: auto; */
    padding: 5px 20px;
}

/*
* Contacts
 */
.cc-as-image-icon {
    background-size: cover;
    background-position: center;
}

.cc-as-image-icon {
    filter: drop-shadow(1px 2px 9px rgba(0, 121, 192, 0.15));
    border: 0.001em solid #e4dfdf;
    border-radius: 50px;
    height: 40px;
    justify-content: center;
    overflow: hidden;
    margin-right: 5px;
    width: 40px;
}

/*
*test
*/
.v-enter-active,
.v-leave-active {
    transition: opacity 0.5s ease;
}

.v-enter-from,
.v-leave-to {
    opacity: 0;
}

/*
*Company avatar group
*/
.avatar-group-container {
    display: flex;
    justify-content: flex-start;
}

.avatar-group {
    display: flex;
    overflow: hidden;
    margin-left: -0.5rem;
}

.avatar-group-image {
    border-radius: 9999px;
    width: 2rem;
    height: 2rem;
}

/* ********************************* */

.p-avatar {
    align-items: center;
    display: inline-flex;
    font-size: 1rem;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}

.p-avatar.p-avatar-image {
    background-color: transparent;
}

.p-avatar-circle img,
.p-avatar.p-avatar-circle {
    border-radius: 50%;
}

.p-avatar .p-avatar-icon {
    font-size: 1rem;
}

.p-avatar img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.p-avatar-group .p-avatar + .p-avatar {
    margin-left: -0.5rem;
}

.p-avatar-group {
    align-items: center;
    display: flex;
}

.p-avatar {
    background-color: #dee2e6;
    border-radius: 6px;
}

.p-avatar.p-avatar-lg {
    width: 2.2rem;
    height: 2.2rem;
    font-size: 0.8rem;
    margin-left: 0;
    cursor: auto;
}

.p-avatar.p-avatar-lg .p-avatar-icon {
    font-size: 0.8rem;
}

.p-avatar-group .p-avatar {
    border: 2px solid #ffffff;
}

/*
* App version
*/
.app-version {
    position: absolute;
    right: 5px;
    top: -25px;
    font-size: 15px;
    color: #8b8b8b;
}

/*
*view as customers
*/
.viewAsCustomers > li > a.doing-ajax {
    pointer-events: none;
}

.viewAsCustomers > li > a.doing-ajax .ajax-ellipsis-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--primary-color);
}

.viewAsCustomers {
    max-height: 300px;
    overflow-x: auto;
    list-style: none;
    padding: 0;
}

.viewAsCustomers li a {
    display: block;
    padding: 5px 10px;
    text-align: left;
    white-space: nowrap;
    line-height: 1;
    color: inherit;
    position: relative;
}

.viewAsCustomers-selected {
    background-color: #e7e7e7;
    pointer-events: none;
    cursor: default;
}

.viewAsCustomers li a:hover {
    color: var(--secondary-color);
    background-color: rgba(0, 121, 192, 0.15);
}

.viewAsCustomer-Btn {
    font-family: inherit;
    font-size: 12px;
    font-weight: normal;
    display: inline-block;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    margin-bottom: 0;
    height: 35px;
    border: 1px solid var(--primary-color);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    color: #fff;
    border-radius: 3px;
    outline: 0;
    white-space: nowrap;
    background-color: var(--primary-color);
    text-shadow: none;
    box-shadow: none;
    line-height: 1.6;
    padding: 3.5px 4px 4px;
    position: relative;
    -webkit-transition: all ease-in-out 0.15s;
    -moz-transition: all ease-in-out 0.15s;
    transition: all ease-in-out 0.15s;
}

.viewAsCustomer-Btn .close {
    font-size: 20px;
}

.viewAsCustomer-Btn .close:hover {
    color: red;
}

.viewAsCustomer-Btn.rounded-long-button {
    border-radius: 50px 50px;
    color: var(--secondary-color);
    background-color: #ffffff;
    font-size: 12px;
}

.viewAsCustomer-logo {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    overflow: hidden;
}

.viewAsCustomers.scroll-container::-webkit-scrollbar {
    position: relative;
    margin-right: 20px;
}

.dashboard-heading .dashboard-edit-dashboard-wrapper {
    opacity: 0;
    font-size: 20px;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.dashboard-heading:hover .dashboard-edit-dashboard-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

/**
*Chips
*/
.basic-chip {
    border-radius: 3px;
    display: inline-block;
    padding: 7px 6px 5px;
}

.chip_red {
    background: #f48fb1;
    color: #000000;
}

.chip_yellow {
    background: #fff176;
    color: #000000;
}

.chip_green {
    /* background: #69bb67; */
    background: #81c784;
    color: #000000;
}

.chip_blue {
    background: #4fc3f7;
    color: #000000;
}

.chip_gray {
    background: #f3f3f3;
    color: #000000;
}

/*
* Bar color
*/

.app-theme-employee #app-topbar {
    background: rgb(0, 24, 44);
    background: linear-gradient(0deg,
    rgba(0, 24, 44, 1) 0%,
    rgba(3, 91, 163, 1) 100%);
}

.app-theme-client #app-topbar {
    background: rgb(0, 24, 44);
    background: linear-gradient(0deg,
    rgba(0, 24, 44, 1) 0%,
    rgba(3, 91, 163, 1) 100%);
}

.app-theme-system-admin #app-topbar {
    background-color: #000;
}

/**
*Under maintenance
*/
.under-maintenance {
    height: 530px;
    max-width: 100%;
    overflow: hidden;
    position: relative;
}

.under-maintenance img {
    display: inline-block;
    height: 100%;
    width: auto;
    overflow: hidden;
    position: relative;
}

/* ---------------------------------
    Toggle Button
   --------------------------------- */

.tgl {
    display: none;
}

.tgl,
.tgl:after,
.tgl:before,
.tgl *,
.tgl *:after,
.tgl *:before,
.tgl + .tgl-btn {
    box-sizing: border-box;
}

.tgl::selection,
.tgl:after::selection,
.tgl:before::selection,
.tgl *::selection,
.tgl *:after::selection,
.tgl *:before::selection,
.tgl + .tgl-btn::selection {
    background: none;
}

.tgl + .tgl-btn {
    outline: 0;
    display: block;
    width: 3em;
    height: 1.6em;
    position: relative;
    cursor: pointer;
    user-select: none;
}

.tgl + .tgl-btn:after,
.tgl + .tgl-btn:before {
    position: relative;
    display: block;
    content: "";
    width: 50%;
    height: 100%;
}

.tgl + .tgl-btn:after {
    left: 0;
}

.tgl + .tgl-btn:before {
    display: none;
}

.tgl:checked + .tgl-btn:after {
    left: 50%;
}

.tgl-vario + .tgl-btn {
    background: #fbfbfb;
    border-radius: 2em;
    padding: 2px;
    transition: all 0.4s ease;
    border: 1px solid #e8eae9;
}

.tgl-vario + .tgl-btn:after {
    border-radius: 2em;
    background: #fbfbfb;
    transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275),
    padding 0.3s ease, margin 0.3s ease;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08);
}

.tgl-vario + .tgl-btn:hover:after {
    will-change: padding;
}

.tgl-vario + .tgl-btn:active {
    box-shadow: inset 0 0 0 2em #e8eae9;
}

.tgl-vario + .tgl-btn:active:after {
    padding-right: 0.8em;
}

.tgl-vario:checked + .tgl-btn {
    background: var(--secondary-color);
}

.tgl-vario:checked + .tgl-btn:active {
    box-shadow: none;
}

.tgl-vario:checked + .tgl-btn:active:after {
    margin-left: -0.8em;
}

/* ---------------------------------
    Info Tips
   --------------------------------- */
.info-tip {
    display: inline-block;
    font-size: inherit;
    color: inherit;
    cursor: pointer;
    pointer-events: all;
}

.info-tip:hover {
}

.info-tip-message {
    position: absolute;
    background-color: var(--dark-primary-color);
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    padding: 10px 15px;
    border-radius: 3px;
    text-align: left;
    z-index: 99993;
    width: auto;
    height: auto;
    max-width: 300px;
}

.info-tip-message:after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid rgb(0, 0, 0);
    top: 100%;
    left: 15px;
}

.info-tip-message.from-bottom:after {
    top: -8px;
    border-top: none;
    border-bottom: 8px solid rgb(0, 0, 0);
}

/* 
Table Dropdown
*/
.table-icon-dropdown {
    color: #000000;
}

/*
*Three Dots
*/
.three-dots:before {
    content: "\22EF";
    color: var(--secondary-color);
    font-size: 20px;
}

/*
*Overlay 
*/
.overlay-styles {
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0);
    opacity: 1;
    overflow-x: hidden;
    transition: 2s;
}

.overlay-content-styles {
    position: absolute;
    top: 40%;
    left: 25%;
    text-align: center;
    width: 50%;
    transition: 0.2s;
    z-index: 1001;
}

.overlay-content-styles > h1 {
    color: #ccc;
    border: 2px solid #ccc;
    margin: 0;
    border-radius: 20px;
    padding: 0;
}

/*
*Data exchange
*/
.dx-box-m-l {
    margin-left: -10px;
}

/*
right arrow list
*/
.arrow-list {
    color: #0b79c0;
}

/*
*Settings
*/
.settings-border {
    margin-left: -15px;
    margin-right: -35px;
    padding-right: 15px;
    margin-bottom: -30px;
    padding-bottom: 15px;
    padding-top: 15px;
}

.settings-profile-pic {
    width: 12%;
}

/*
*Settings External Apps
*/
.ss-disc-quickbooks {
    background-color: #389e2a;
    height: 40px;
    line-height: 42px;
    cursor: pointer;
    font-weight: 600;
    font-size: 17px;
    border-radius: 5px;
}

/*
*Settings Nav
*/
.se-header {
    font-size: 25px;
    font-weight: 600;
}

.se-nav .se-nav-item {
    text-align: left;
    min-width: 130px;
}

.se-nav .se-nav-item.active,
.se-nav .se-nav-item:hover {
    background-color: rgba(0, 151, 255, 0.1);
    color: rgba(0, 151, 255, 1);
}

.se-nav .se-nav-item > a {
    display: flex;
    padding: 13px 5px;
    text-align: center;
}

.se-nav-item .se-ni-icon {
    font-size: 20px;
    line-height: 1;
    margin-bottom: 1px;
}

.se-nav-item .se-ni-label {
    font-size: 15px;
    line-height: 1;
}

/*
*Image Uploader
*/
/* Photo uploader */
.app-photo-uploader {
    position: relative;
    width: 90px;
    height: 90px;
    display: block;
    text-align: center;
}

.app-photo-uploader .apu-prev {
    width: 100%;
    height: 100%;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    opacity: 0.6;
    overflow: hidden;
}

.app-photo-uploader input[type="file"] {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.app-photo-uploader .apu-icon {
    position: absolute;
    font-size: 25px;
    color: var(--dark-secondary-color);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    cursor: pointer;
    text-align: center;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    z-index: 1;
    background-color: rgba(255, 255, 255, 0.3);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    text-shadow: 0 0 11px rgba(255, 255, 255, 0.5),
    0 0 2px rgba(255, 255, 255, 0.5);
}

.app-photo-uploader.has-error .apu-icon i:before {
    content: "\f071";
}

.app-photo-uploader .apu-remove {
    position: absolute;
    width: 16px;
    height: 16px;
    z-index: 2;
    color: #fff;
    background-color: #e30c0c;
    border-radius: 100%;
    top: 0;
    right: 0;
    font-size: 12px;
    display: flex;
    visibility: hidden;
    opacity: 0;
    align-items: center;
    justify-content: center;
}

.app-photo-uploader .apu-remove:hover {
    background-color: #0097ff;
}

.app-photo-uploader:not(.loaded) .apu-icon:hover {
    background-color: rgba(255, 255, 255, 0.6);
}

.app-photo-uploader.loaded .apu-prev {
    opacity: 1;
}

.app-photo-uploader.loaded .apu-icon {
    visibility: hidden;
    opacity: 0;
}

.app-photo-uploader.loaded:hover .apu-icon,
.app-photo-uploader.loaded:hover .apu-remove {
    visibility: visible;
    opacity: 1;
}

.app-photo-uploader.boxed {
    width: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-color: #c8c8c8;
}

.app-photo-uploader.boxed .apu-prev {
    border-radius: 0;
    background-size: contain;
    background-position: center;
    width: 95%;
    height: 95%;
    max-width: 95%;
    max-height: 95%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.app-photo-uploader.boxed .apu-icon {
    border-radius: 0;
}

.app-photo-uploader.boxed .apu-remove {
    top: -10px;
    right: -10px;
}

.go-to-parent-arrow {
    display: flex;
    align-items: center;
    flex-direction: row;
}

.go-to-parent-arrow:hover {
    color: var(--dark-senary-color);
}

.go-to-parent-arrow i {
    font-size: 25px;
    margin-right: 10px;
}

/* File selector directive */
.fus1-label {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    padding: 8px 10px 5px;
    font-size: 15px;
    line-height: normal;
    color: #555555;
    outline: 0;
    border-radius: 3px;
    background-color: #fff;
    border: 1px solid #c8c8c8;
    -webkit-transition: border-color ease-in-out 0.15s;
    -moz-transition: border-color ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s;
    cursor: pointer;
}

.fus1-label .fus1-l-icon {
    margin-right: 5px;
    font-size: 16px;
}

.fus1-label .fus1-l-file-remover {
    position: absolute;
    z-index: 1;
    width: 20px;
    height: 20px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-color: #e30c0c;
    border-radius: 100%;
    top: -10px;
    right: -10px;
    font-size: 16px;
    line-height: 1.6;
    visibility: hidden;
    opacity: 0;
}

.fus1-label:hover .fus1-l-file-remover {
    visibility: visible;
    opacity: 1;
}

.fus1-label .fus1-l-file-remover:hover {
    background-color: var(--secondary-color);
}

.fus1-label .fus1-l-text {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/*
*button dashboard
*/
.dashboard_menu_btn {
    margin: 0;
    padding: 0;
}

.button-long:hover .dashboard_menu_btn {
    filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(133deg) brightness(110%) contrast(101%);
}

.dash_chart_no_results {
    position: absolute;
    top: 130px;
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: center;
    flex-direction: column;
}

.dash_chart_no_results-container {
    width: 100px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dash_chart_no_results-header {
    font-size: 20px;
    margin-top: 5px;
    font-weight: 500;
}

.dash_chart_no_results-icon {
    font-size: 35px;
    color: #cbcbcb;
}

/*
*button long
*/
.button-long {
    background-color: #fff;
    border: 1px solid transparent;
    box-shadow: none;
    cursor: pointer;
    color: var(--dark-secondary-color);
    display: inline-block;
    font-family: inherit;
    font-size: 15px;
    font-weight: normal;
    height: 40px;
    letter-spacing: 0.01em;
    line-height: 1.6;
    margin-bottom: 0;
    min-width: 160px;
    outline: 0;
    padding: 9px 14px 22px;
    position: relative;
    text-shadow: none;
    text-align: center;
    transition: all ease-in-out 0.15s;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-transition: all ease-in-out 0.15s;
    -moz-transition: all ease-in-out 0.15s;
}

.button-long:hover {
    background-color: var(--secondary-color);
    color: #fff;
}

.button-long:active {
    transform: translateY(2px);
    -webkit-transform: translateY(2px);
    -moz-transform: translateY(2px);
}

.dark-mode .button-long {
    background-color: var(--dark-secondary-color);
    color: #fff;
}

.light-mode .button-long {
    background-color: var(--light-secondary-color);
    color: #fff;
}

/**
*border left
*/
.border-right {
    border-right: 2px solid #d3d4d5;
    height: 70%;
    right: 0px;
    top: 15%;
}

/**
*Color
*/
.text-color-blue {
    color: #0079c0;
}

/**
  *pagination
  */
.pagination {
    display: flex;
    flex-wrap: wrap;
}

.pb-button {
    align-items: center;
    background: #ffffff;
    border: 1px solid transparent;
    color: #00578c;
    cursor: pointer;
    display: inline-flex;
    font-size: 1rem;
    height: 2.2rem;
    justify-content: center;
    line-height: 1;
    margin-left: 0.2rem;
    width: 2.2rem;
}

.pb-button:hover {
    background: #cfcfcf;
    color: #1881c6;
}

.pb-button:disabled {
    background-color: #ebebeb;
    opacity: 1;
    cursor: auto;
}

.pagination-item {
    display: inline-block;
}

.pagination-item .active {
    background-color: #1881c6;
    color: #ffffff;
}

.pagination .pagination-item .icons {
    font-size: 1.3rem;
}

/**
 * App elements
 */
.app-card-panel {
    border-radius: 5px;
    position: relative;
    background-color: #fff;
    box-shadow: 1px 2px 9px rgba(0, 121, 192, 0.15);
}

.dark-mode .app-card-panel {
    position: relative;
    background-color: var(--dark-secondary-color);
    box-shadow: 1px 2px 9px rgba(0, 26, 41, 0.15);
}

.light-mode .app-card-panel {
    position: relative;
    background-color: transparent;
    box-shadow: 1px 2px 9px rgba(0, 26, 41, 0.15);
}

.app-table {
    border-radius: 5px;
}

.app-table .at-table {
    width: 100%;
}

.dark-mode .app-table {
    background-color: #242424;
}

.dark-mode .at-table {
    background-color: #242424;
    color: white;
}

.app-table .at-table th,
.app-table .at-table td {
    text-align: left;
    padding: 15px 20px;
    border-bottom: 1px solid #242424;
    font-size: 14px;
}

.light-mode .app-table .at-table th,
.light-mode .app-table .at-table td {
    text-align: left;
    padding: 10px 20px;
    border-bottom: 1px solid #ffffff;
    font-size: 14px;
}

.app-table .at-table th {
    position: relative;
    color: #ffffff;
}

.app-table .at-table th div div i {
    cursor: pointer;
    color: #9d9b9b;
}

.app-table .at-table th div div i:hover {
    cursor: pointer;
    color: #696868;
}

.dark-mode .app-table .at-table th {
    position: relative;
    color: #ffffff;
}

.light-mode .app-table .at-table th {
    position: relative;
    color: var(--light-color-text);
}

.app-table .at-table th:not(:first-child):before {
    position: absolute;
    content: "";
    width: 2px;
    top: 4px;
    bottom: 4px;
    left: 3px;
    background-color: var(--dark-tertiary-color);
}

.light-mode .app-table .at-table th:not(:first-child):before {
    background-color: #dddddd;
}

.dark-mode .at-table tr:nth-child(even) {
    background-color: #2c2c2c;
}

.light-mode .at-table tr:nth-child(even) {
    background-color: #f3f3f3;
}

.dark-mode .at-table tr:not(.at-heading):not(.at-no-results):hover {
    background-color: #494949;
    color: white;
}

.light-mode .at-table tr:not(.at-heading):not(.at-no-results):hover {
    background-color: #d9d9d9;
    color: black;
}

/*
* Styles KD
*/
/* Content Tabs */
.content-tabs .ct-nav {
    margin-bottom: 25px;
    border-bottom: 1px solid var(--dark-senary-color);
}

.ct-nav .ct-nav-item {
    padding: 10px 15px;
    line-height: 1;
    color: inherit;
    position: relative;
    display: inline-block;
    cursor: pointer;
    color: #858585;
}

.ct-nav .ct-nav-item:first-child {
    padding-left: 0;
}

.ct-nav .ct-nav-item:not(:last-child):after {
    content: "";
    position: absolute;
    top: 5px;
    bottom: 5px;
    right: 0;
    width: 1px;
    background-color: #ddd;
}

.ct-nav .ct-nav-item:before {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -1px;
    height: 3px;
    background-color: transparent;
}

.ct-nav .ct-nav-item:first-child:before {
    left: 0;
}

.ct-nav .ct-nav-item.active {
    color: var(--dark-quaternary-color);
}

.light-mode .ct-nav .ct-nav-item.active {
    color: var(--dark-quinary-color);
}

.dark-mode .ct-nav .ct-nav-item:hover:before,
.dark-mode .ct-nav .ct-nav-item.active:before {
    background-color: var(--dark-quaternary-color);
}

.light-mode .ct-nav .ct-nav-item:hover:before,
.light-mode .ct-nav .ct-nav-item.active:before {
    background-color: var(--light-secondary-color);
}

.ct-nav-ellipsis {
    display: inline-block;
    width: 145px;
}

.content-tabs .ct-tab {
    display: none;
}

.content-tabs .ct-tab.active {
    display: block;
}

/* Popup Modifications */
.popup .pop-action-bottom {
    margin: 10px -25px -25px;
    padding: 15px 25px;
}

.popup .app-photo-uploader {
    width: 75px;
    height: 75px;
}

.pop-advanced .popup-close-container {
    top: 25px;
    right: 25px;
    font-size: initial;
}

.popup .popup-close-container a:hover,
.popup .popup-close-container a:focus {
    color: var(--primary-color);
}

.dark-mode .popup .popup-close-container a:hover,
.dark-mode .popup .popup-close-container a:focus {
    color: var(--dark-primary-color);
}

.light-mode .popup .popup-close-container a:hover,
.light-mode .popup .popup-close-container a:focus {
    color: var(--dark-primary-color);
}

.pop-advanced .popup-close-container .button {
    width: 25px;
    height: 25px;
    line-height: 1;
    padding: 0;
    font-size: 25px;
}

.pop-action-bottom .button-transparent {
    border-color: transparent;
}

.pop-advanced .popup-close-container .button:hover {
    background-color: transparent !important;
    color: inherit;
}

/* Photo Uploader */
.app-photo-uploader.full-boxed {
    width: 100%;
    height: 200px;
    border-radius: 2px;
    border: 1px solid #c8c8c8;
}

.app-photo-uploader.full-boxed .apu-icon {
    border-radius: 0;
}

.app-photo-uploader.full-boxed .apu-prev {
    opacity: 1;
    background-position: center;
    border-radius: 0;
}

.app-photo-uploader.full-boxed .apu-remove {
    top: -5px;
    right: -5px;
}

/* Editor view card infos */
.card-info-list > div {
    margin-bottom: 10px;
    position: relative;
    padding-left: 25px;
}

.card-info-list .cil-label {
    font-weight: 600;
}

.card-info-list .cil-icon {
    display: inline-block;
    position: absolute;
    left: 0;
    width: 20px;
    text-align: center;
}

/* Quill Editor Overwrites */
.no-padding .ql-editor {
    padding: 0;
}

/* Static Page Layout */
.static-page-layout {
    max-width: 900px;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}

.static-page-header {
    position: relative;
    /* margin-bottom: 30px; */
}

.static-page-header .sph-col-left,
.static-page-header .sph-col-right {
    width: 50%;
    position: relative;
}

.static-page-header .sph-col-left {
    z-index: 1;
    padding: 25px;
}

.static-page-header .sph-col-right:before {
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    left: -50%;
    right: 0;
    width: 50%;
    background-color: #f5f5f5;
    z-index: 0;
    box-sizing: border-box;
    transform-origin: bottom left;
    transform: skew(-20deg) !important;
    pointer-events: none;
}

.static-page-header .sph-col-left h1 {
    font-size: 35px;
    line-height: 1.1;
}

.static-page-header .sph-col-left .sub-heading {
    font-size: 14px;
    color: #8d8d8d;
}

.static-page-header .sph-image {
    width: 100%;
    height: 340px;
    overflow: hidden;
}

.static-page-header .sph-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* General Helpers */
.w-500 {
    width: 500px !important;
}

.min-w-90 {
    min-width: 90px !important;
}

.min-w-650 {
    min-width: 650px !important;
}

.min-w-360 {
    min-width: 360px !important;
}

.hori-center {
    margin: 0 auto !important;
}

.no-pointers,
.no-pointers * {
    pointer-events: none !important;
}

.button-negative-actions {
    background-color: #e7e7e7;
    border-color: #e7e7e7;
}

.button-negative-actions:hover {
    color: #fff !important;
}

.top-mega-bar {
    display: none;
}

.app-menus {
    margin-bottom: 10px;
    text-align: right;
}

.light-mode .app-menus a:hover {
    color: var(--light-senary-color);
}

.dark-mode .app-menus a:hover {
    color: #d7d7d7;
}

.ac-title-container {
    justify-content: space-between;
    display: flex;
}

.at-logged-user-logo-only {
    display: none;
}

.at-logged-details {
    display: flex;
    flex-direction: row-reverse;
    color: white;
    margin-top: 25px;
    align-items: center;
}

.light-mode .at-logged-details {
    color: black;
}

.at-logged-details .at-lu-content .at-lu-details span {
    display: block;
    line-height: 1;
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.at-logged-details > div:not(:last-child) {
    margin-left: 13px;
}

.at-logged-details .at-lu-details span {
    display: block;
    line-height: 1;
    max-width: 200px;
    overflow: hidden;
    font-size: 18px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.at-logged-details .at-lu-details .at-lud-sub {
    font-size: 13px;
    font-weight: 200;
}

.at-logged-details .ve-circle-avatar {
    display: inline-block;
    width: 53px;
    height: 53px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    overflow: hidden;
}

.cp-single-container {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.cp-single-details {
    margin-top: 5px;
    margin-bottom: 0;
    line-height: 1;
}

.cp-single-details-margin {
    margin-left: 15px;
}

.sc-container {
    display: flex;
    min-height: 650px;
    position: relative;
}

/*
* Error messages
*/
.ep-error-container-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60vh;
    margin: 0 auto;
    padding: 20px;
}

.ep-status-code-text {
    font-weight: bolder;
    font-size: 180px;
    color: #acacac;
}

.ep-error-page-background-container {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.ep-error-page-background-img {
    width: 100%;
    object-fit: cover;
}

.ep-error-container {
    flex: 1;
    margin-left: 25px;
}

.ep-error-message {
    font-size: 25px;
    font-weight: 700;
    color: #000000;
}

.ep-error-description {
    margin-top: 15px;
    color: #5c5c5c;
}

@media screen and (max-width: 480px) {
    .ep-status-code-text {
        font-size: 80px;
    }

    .ep-error-message {
        font-size: 18px;
    }

    .ep-error-description {
        font-size: 14px;
    }

    .ep-error-parent-container{
        flex-direction: column;
    }

    .ep-error-page-background-img {
        object-fit: cover;
        height: 250px;
    }

    .ep-error-page-background-container{
        bottom: 55px;
    }

    .ep-error-container-wrapper{
        height: 40vh;
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
    .ep-status-code-text {
        font-size: 120px;
    }

    .ep-error-container-wrapper {
        flex-direction: column;
        text-align: center;
        height: auto;
    }

    .ep-error-container {
        margin: 0;
        margin-top: 15px;
    }

    .ep-error-message {
        font-size: 20px;
    }

    .ep-error-description {
        font-size: 16px;
    }

    .ep-error-page-background-img {
        object-fit: cover;
        height: 250px;
    }

    .ep-error-page-background-container{
        bottom: 55px;
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
    .ep-error-container-wrapper{
        top: -70px;
        position: relative;
    }
}

@media screen and (min-width: 769px) and (max-width: 1024px){

}


.sc-sub-container {
    min-height: 650px;
}

.sc-nav {
    margin-top: 10px;
}

.viewAsCompany-select-text {
    font-size: 15px;
    color: white;
    margin-right: 10px;
}

.light-mode .viewAsCompany-select-text {
    color: var(--light-color-text);
}

.view_as_company_mobile_view {
    display: none;
}

.left-top-bar-container {
    flex: 1;
    width: 100%;
    display: flex;
    justify-content: center;
}

.mobile-search-icon-container {
    display: none;
}


/***********************/
/**     Load More     **/
/***********************/

.dc-load-more-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.dc-loading {
    position: relative;
    left: 65px;
}

.dc-no-more-items {
    text-align: center;
    padding: 10px;
}

.dc-avatar-cover {
    display: flex;

}

.dc-avatar-cover > img {
    object-fit: cover;
    object-position: top center;
}

/*****************************
 **  LV Data Loader Styles  **
 *****************************/

.data-loader-wrap.data-loader-transparent.dc-data-loader .data-loader div {
    background: var(--dcui-primary-color);
}

.data-loader-wrap.data-loader-transparent.dc-data-loader {
    background: transparent;
}


/*****************************
**     MIsc      **
*******************************/

.dcui-icon-control.xp-input-filed-no-outline, .dcui-form-control.xp-input-filed-no-outline {
    border: 0 !important;
}

.dcui-icon-control.xp-input-filed-no-outline, .dcui-form-control.xp-input-filed-no-outline:focus {
    border: 0 !important;
    box-shadow: none;
}

/***********************/
/**   Global Search  **/
/***********************/

.dc-global-search-close-popup {
    position: absolute;
    background-color: transparent;
    top: 100px;
    left: 50%;
    z-index: 999 !important;
}

.dc-global-search-close-popup .close-text a i {
    transform: rotate(0deg);
    transition: all 0.5s ease-in-out;
}

.dc-global-search-close-popup .close-text a i:hover {
    transform: rotate(180deg);
}

.dc-global-search-close-popup .close-text {
    font-size: 25px;
    color: rgba(129, 129, 129, 1);
}

.dc-global-search-close-popup .close-text {
    font-size: 25px;
    color: rgba(129, 129, 129, 1);
}

.dc-global-search-container {
    position: absolute;
    background-color: #fff;
    min-width: 780px;
    max-width: 95%;
    top: 150px;
    left: 50%;
    transform: translate(-50%, 0);
    padding: 8px;
    box-shadow: 0px 1px 16px -7px rgba(66, 66, 66, 0.25);
    border-radius: var(--dcui-field-radius);
    overflow: hidden;
    z-index: 999 !important;
}

.dc-global-search-control.dcui-icon-control .dcui-ic-icon,
.dc-global-search-control .dcui-form-control,
.dc-global-search-control .dcui-form-control:focus {
    background-color: transparent;
    font-size: 20px;
}

.dc-global-search-icon-container img {
    opacity: 0.3;
}

.dc-global-search-app-icon {
    display: flex;
}

.dc-global-search-result-text-container {
    margin-left: 15px;
    flex: 1;
}

.dc-global-search-app-icon.large img {
    width: 60px;
}

.dc-global-search-app-icon.small img {
    width: 35px;
}

.dc-global-search-app-name {
    font-size: 20px;
    color: black;
}

.dc-global-search-nav-app-name {

}

.dc-global-search-nav-item {
    margin-bottom: 5px;
    padding: 5px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.dc-global-search-nav-item.selected {
    background-color: #d7efff;
}

.dc-global-search-nav-app-name-container {
    flex: 1;
    margin-left: 10px;
}

.dc-search-result-container .dc-search-result-content {
    display: flex;
    height: 500px;
}

.dc-search-result-container .dc-global-search-nav-container {
    width: 225px;
    padding-right: 12px;
    border-right: 1px solid #f5f3f3;
}

.dc-search-result-container .dc-global-search-results {
    flex: 1;
    padding: 20px;
}

.dc-search-result-container .dc-search-result-title {
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    text-align: left;
}

.dc-search-result-container .dc-search-result-text {
    font-size: 26px;
    font-weight: 500;
    line-height: 31.2px;
    text-align: left;
    color: rgba(0, 0, 0, 1);
}

.dc-global-search-container .dc-search-container {
    height: 45px;
    background-color: rgba(242, 242, 242, 0.5);
    display: flex;
    align-items: center;
    padding-right: 5px;
}

.dc-global-search-container .dc-search-result-container {
    margin-top: 10px;
}

.dc-search-no-result-container-data-loader-container {
    height: 500px;
    position: relative;
}

.dc-global-search-container .dc-search-no-result-container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 450px;
    margin: auto;
}

.dc-global-search-no-results-container {
    flex: 1;
    display: flex;
    max-width: 450px;
    flex-wrap: wrap;
    flex-direction: column;
}

.dc-global-search-no-results-container .dc-no-result-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 36px;
    text-align: left;
}

.dc-global-search-no-results-container .dc-no-result-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    text-align: left;
    flex: 1;
    white-space: normal; /* Allow text to wrap */
    word-wrap: break-word; /* Break long words */
    overflow-wrap: break-word; /* Ensures compatibility with all browsers */
}

.dc-global-search-icon-container {
    min-width: 135px;
}

.dc-search-results-table {
    max-height: 400px;
}

/*
* Media Queries
*/
@media screen and (min-width: 1921px) {
    .ve-full-page-knife-cut {
        max-height: 1200px;
    }

    #app-sidebar {
        left: calc((100% - var(--content-guard)) / 2);
    }
}

@media screen and (max-width: 1679px) {
    .kc-columns .kc-col-left {
        padding-left: 8.5%;
    }

    .kc-columns .kc-col-right {
        padding-right: 8.5%;
    }

    #ve-page-auth .pa-left-content {
        max-width: 400px;
    }

    .bg-full-image .graphic-circuit-lines {
        width: 140px;
        top: calc(50% - 160px);
    }

    .auth-card-panel {
        width: 460px;
    }

    .auth-card-panel .acp-boxer {
        padding: 30px;
    }

    #app-container {
        padding: 50px 75px 20px;
    }

    #app-container::before {
        top: 40px;
        left: -150px;
        width: 218px;
        height: 100px;
    }
}

@media screen and (max-width: 1441px) {
    #app-container::before {
        top: 40px;
        left: -150px;
        width: 217px;
        height: 100px;
    }
}

@media screen and (max-width: 1025px) {
    #app-container::before {
        top: 40px;
        left: -150px;
        width: 200px;
        height: 100px;
    }
}

@media screen and (max-width: 991px) {

    .kc-columns .kc-col-left,
    .kc-columns .kc-col-right {
        width: 100%;
    }

    .kc-columns .kc-col-right .kc-skew {
        display: none;
    }

    .dc-global-search-container {
        min-width: 85%;
    }
}


/*
* Mobile View
*/

@media screen and (min-width: 320px) and (max-width: 766px) and (orientation: portrait) {
    .auth-card-panel {
        width: 100%;
    }

    .auth-card-panel .auth-logo {
        text-align: center;
        margin-bottom: 16px;
        height: 100px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
    }

    .dark-mode .auth-card-panel .acp-boxer,
    .light-mode .auth-card-panel .acp-boxer {
        background-color: transparent;
        padding: 40px;
        border-radius: 5px;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
        color: var(--color-text);
    }

    .light-mode .auth-card-panel .acp-boxer {
        box-shadow: none;
    }

    .dark-mode .auth-card-panel .acp-boxer .form-group {
        background-color: transparent;
    }

    .side-mega-menu {
    }

    .side-mega-menu .side-mega-container {
        padding: 30px 20px 0;
    }

    .side-mega-menu .side-mega-container .side-mega-top {
    }

    .side-mega-menu .side-mega-container .side-mega-middle-container {
        flex-direction: column;
        align-items: center;
        height: 80%;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
    }

    .side-mega-menu .side-mega-container .side-mega-middle-container .side-mega-middle-boxes {
        margin-right: 0;
        flex: 0 0 15%;
        width: 100%;
        height: 100px;
    }

    .side-mega-menu .side-mega-container .side-mega-top {
        align-items: flex-start;
    }

    #app-sidebar {
        display: none;
    }

    #app-container {
        position: relative;
        margin-left: 0;
        margin-top: var(--topbar-height);
        display: block;
        min-height: 100%;
        padding: 25px 25px;
    }

    #app-topbar {
        padding-left: 15px;
        background-color: #181818 !important;
    }

    .top-mega-bar {
        display: block;
        color: white;
        height: 50px;
        width: 50px;
    }

    .tb-mega-menu-icon {
        height: 100%;
        font-size: 30px;
        text-align: center;
        line-height: 58px;
    }

    .app-card-panel .app-table {
        overflow-x: auto;
    }

    .app-menus {
        text-align: left;
    }

    .ac-title-container {
        flex-direction: column;
    }

    .app-menus div {
        margin-top: 10px;
        width: 100%;
    }

    /*.popup {*/
    /*  width: 100%;*/
    /*  height: 100%;*/
    /*  min-width: 0;*/
    /*  top: 50%;*/
    /*  transform: translate(-50%, -50%);*/
    /*}*/
    .at-logged-user {
        display: none;
    }

    .at-logged-user-logo-only {
        display: block;
    }

    .at-profile_menu {
        display: flex;
        flex-direction: column;
        height: 80%;
        color: white;
    }

    .at-profile_sub_menu {
        flex: 1;
    }

    .at-profile_box {
        background-color: #4d4d4d;
        padding: 25px;
        color: white;
        flex-wrap: nowrap;
        display: flex;
        justify-content: space-between;
        font-size: 17px;
        position: relative;
    }

    .at-profile_box:hover {
        background-color: black;
    }

    .app-table .at-table th,
    .app-table .at-table td {
        white-space: nowrap;
    }

    .cp-single-container {
        flex-direction: column;
    }

    .cp-single-details {
        display: flex;
        flex-direction: column;
    }

    .cp-single-status {
        width: fit-content;
    }

    .cp-menu-container {
        margin-top: 15px;
        display: flex;
    }

    .cp-menu-tabs {
        margin-top: 15px;
        overflow-y: hidden;
        overflow-x: auto;
    }

    .cp-single-details-margin {
        margin-top: 10px;
    }

    .cp-single-details-margin h2 {
        overflow-wrap: anywhere;
    }

    .cp-single-wrap .app-photo-uploader {
        width: 70px;
        height: 70px;
        min-width: 70px !important;
    }

    .cp-single-userlist-container {
        height: 278px;
        overflow-y: auto;
    }

    #useraddform {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    #useraddform .content-tabs {
        height: 80%;
    }

    #useraddform .pop-action-bottom {
        flex: 0 0 130px;
    }

    #useraddform .content-tabs .ct-tab.active {
        display: block;
        height: 80%;
        overflow-x: hidden;
        overflow-y: scroll;
    }

    #usereditform {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    #usereditform .content-tabs {
        height: 80%;
    }

    #usereditform .pop-action-bottom {
        flex: 0 0 130px;
    }

    #usereditform .content-tabs .ct-tab.active {
        display: block;
        height: 80%;
        overflow-x: hidden;
        overflow-y: scroll;
    }

    .app-version {
        position: absolute;
        right: 5px;
        top: -25px;
        font-size: 15px;
        color: #8b8b8b;
    }

    .sc-container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .se-nav {
        display: flex;
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
    }

    .sc-sub-container {
        min-height: 650px;
        width: 100%;
    }

    .sc-nav {
        margin-top: 10px;
        margin-bottom: 10px;
        padding: 0 5px;
    }

    .sc-nav-container {
        margin-bottom: 15px;
    }

    .ss-app-container {
        width: 100%;
    }

    .view_as_company_mobile_view {
        display: flex;
    }

    .view_as_company_desktop_view {
        display: none;
    }

    .mobile-drop-down-close {
        display: flex;
        justify-content: flex-end;
    }

    .mobile-drop-down-close .close-icon {
        font-size: 30px;
        color: var(--quaternary-color);
    }

    .mobile-drop-down-close .close-icon :hover {
        cursor: pointer;
        color: var(--quinary-color);
    }

    .mobile-vw-search-container {
        margin-top: 15px;
    }

    .mb-vw-title {
        font-size: 25px;
        font-weight: 400;
        color: white;
    }

    .mobile-vw-container {
        width: 100%;
    }

    .mobile-view-container {
        background-color: #4d4d4d;
        padding: 0 15px;
        margin-top: 10px;
        display: flex;
        height: 60px !important;
        justify-content: space-between;
    }

    .mobile-vw-icon {
        color: white;
    }

    .mb-p-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 90%;
    }

    .mb-switch-container {
        cursor: pointer;
        height: 38px;
        line-height: 30px;
        padding: 5px 15px;
        text-align: center;
        margin-top: 5px;
        font-weight: 300;
        color: white;
        background: #454545;
    }

    .mobile-view-container:hover {
        background-color: #000;
    }

    .sc-nav-container {
        max-width: none !important;
        width: 100% !important;
    }

    .se-nav .se-nav-item > a {
        display: flex;
        padding: 13px 5px;
        text-align: center;
        width: 110px;
        height: 50px;
    }

    .left-top-bar-container {
        flex: 1;
        width: 100%;
        display: flex;
        justify-content: flex-start;
    }

    .search-container {
        display: none;
    }

    .mobile-search-icon-container {
        display: flex;
        font-size: 23px;
        line-height: 3.2;
        position: relative;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 50px;
        text-align: center;
        cursor: pointer;
    }

    .megaSearch-no-results-text {
        left: 88px;
    }

    .megaSearch-main-item {
        margin-bottom: 15px;
        margin-top: 15px;
    }

    .megaSearch-description {
        margin-top: 5px;
        margin-bottom: 15px;
    }

    .at-elem-separator {
        display: none;
    }

    #notification-icon {
        display: none;
    }

    .mark-as-red {
        font-size: 15px;
    }

    .no-notification {
        position: relative;
        top: 15px;
        height: 5vh;
    }

    .notification-container-mobile {
        max-height: 65vh;
    }

    .viewall-ul {
        position: relative;
        top: 10px;
    }

    .view-all-notifcations {
        margin-top: 10px;
        text-decoration: none;
    }
} .hsy-tooltip {
    position: relative;
    font-family: inherit;
    font-size: 10px;
  }
  .hsy-tooltip>.outlet,
  .hsy-tooltip>.tooltip {
    font-size: 1.4em;
  }
  .hsy-tooltip>.tooltip {
    display: none;
    position: absolute;
    background-color: rgb(0, 0, 0);
    color: #fff;
    border-radius: 3px;
    border: 0px;
    outline: none;
    padding: 10px 15px;
    z-index: 100;
  }
  .hsy-tooltip .arrow {
    position: absolute;
    width: 0px;
    height: 0px;
    border-style: solid;
  } 
.user-discard-btn{
    width: 42%;
}
.user-save-btn{
    width: 55%;
}

.popup.pop-card-panel.user-popup{
   width: 450px;
}
.user-info-container{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.user-icon{
    object-position: top;
}

.popup-overlay.user-remove-overlay{
    z-index: 1000 !important;
}