body { font-family: 'Poppins', sans-serif; font-size: 15px;}
body.frontend { font-family: 'Rubik', sans-serif; font-size: 16px;}
body.taskon,
body.sideon { overflow: hidden;}
body.sideon .sonover { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #222fb930;}

/* Frontend */

.homeHeader { position: relative;}
.homeHeader .homeIntro { position: relative; top: 0;}
.bg-navbar-home { background-color: #2f2cd8;}
.homeIntroBox { position: relative; background-color: #1b18ad;}
.frontend .btn-success { background-color: #00c52c; border-color: #00c52c; color: #000000;}

.hibImage { position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.hibImage1 { background: url(/assets/images/homeIntro1.jpg) no-repeat center scroll; background-size: cover;}
.hibImage.hibImage1 { opacity: 0.60;}
.hibText { position: relative; min-height: calc(100vh - 50px); z-index: auto; background-color: rgba(23, 21, 121, 0.4);}

.homeHeader .hibImage { min-height: calc(100vh - 50px);}

.homeIntro h1 > span { display: block; color: #ffffff;}

.feFooter { background-color: #2725c6; color: rgba(255, 255, 255, 0.50);}
.feFooter a { color: rgba(255, 255, 255, 0.70); transition: color 0.2s ease-in-out; text-decoration: none;}
.feFooter a:hover { color: rgba(255, 255, 255, 0.90);}

.loginImage { min-height: 100%;}
.loginImageBox { min-height: 50vh; background-color: #00000099;}

.blogArticleBox img { max-width: 100%;}

/* Backend */

a { color: #3742c0;}
a:hover { color: #1d289d;}
a.nofeedback { cursor: default;}

strong { font-weight: 500;}

.btn.btn-primary { background-color: #303dc2; border-color: #303dc2;}
.btn.btn-primary:not(:disabled):not(.disabled):hover,
.btn.btn-primary:not(:disabled):not(.disabled):focus { background-color: #1d289d; border-color: #1d289d;}

.btn.btn-primaryi { background-color: #6966bb; border-color: #6966bb; color: #ffffff;}
.btn.btn-primaryi:not(:disabled):not(.disabled):hover,
.btn.btn-primaryi:not(:disabled):not(.disabled):focus { background-color: #323db9; border-color: #323db9;}

.btn.btn-secondary { background-color: #eeeffc; border-color: #eeeffc; color: #222fb9;}
.btn.btn-secondary:not(:disabled):not(.disabled):hover,
.btn.btn-secondary:not(:disabled):not(.disabled):active,
.btn.btn-secondary:not(:disabled):not(.disabled):focus { background-color: #e3e4fd !important; border-color: #e3e4fd !important; color: #222fb9 !important;}
.border-secondary { border-color: #a7ade9 !important;}

.btn.btn-info { background-color: #6670e2; border-color: #6670e2;}
.btn.btn-info:not(:disabled):not(.disabled):hover,
.btn.btn-info:not(:disabled):not(.disabled):focus { background-color: #4e59c7; border-color: #4e59c7;}

.btn.btn-danger { background-color: #ff2625; border-color: #ff2625;}
.btn.btn-danger:not(:disabled):not(.disabled):hover,
.btn.btn-danger:not(:disabled):not(.disabled):focus { background-color: #ff5151; border-color: #ff3c3b;}

.btn.btn-ffon { border-color: #3993f3 !important;}

.btnFilters .btn.btn-light.active { background-color: #e0e9f1 !important;}
.btnFiltersOn .btn.btn-light { border-color: #96bfe7 !important;}

.btn-noeffect { outline: none !important; box-shadow: none !important;}
.btn-nofeedback { outline: none !important; box-shadow: none !important; cursor: default !important;}

.nav .nav-item .btn.btn-light.active { background-color: #303dc2; border-color: #303dc2; color: #ffffff;}

.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle { background-color: #e5e9ec;}

.btn-light:not(:disabled):not(.disabled).btn-active { background-color: #dbeafe; border-color: #bedbff;}

.btnFirstInGroup { border-right: none !important; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important;}
.btnLastInGroup { border-left: none !important; border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important;}

.btn-filterTimes:hover { border-color: #f0c0c4 !important; background-color: #ffeeef;}

.input-group-prepend.alone .input-group-text:last-child { border-top-right-radius: 3px; border-bottom-right-radius: 3px;}

select option:disabled { color: #cacaca !important;}

.badge { font-size: 80%; font-weight: 500; cursor: default;}
.badge-xs { font-size: 75%;}
.bgx-primary,.badge-primary { background-color: #c2c6f5; color: #424ece;}
.bgx-primaryi,.badge-primaryi { background-color: #ecedfc; color: #424ece;}
.bgx-secondary,.badge-secondary { background-color: #ff6175; color: #ffffff;}
.bgx-success,.badge-success { background-color: #d5f7d9; color: #21b731;}
.bgx-successi { background-color: #ebf7ec;}
.bgx-danger,.badge-danger { background-color: #ffe7e7; color: #ff2625;}
.bgx-warning,.badge-warning { background-color: #fff0e1; color: #ff7a01;}
.bgx-info,.badge-info { background-color: #f0f6fc; color: #2781d5;}
.bgx-light,.badge-light { background-color: #f4f4f4; color: #121212;}
.bgx-lighti,.badge-lighti { background-color: #f4f4f4; color: #888888;}
.bgx-dark,.badge-dark { background-color: #eeeeee; color: #333333;}
.bgx-pending { background-color: #fcf3eb; color: #9f5510;}

.bgs-primary { background-color: #e8eaf8;}
.bgs-success { background-color: #e7faea;}
.table-hover tbody tr.bgs-success:hover { background-color: #dcf1df;}
.bgs-danger { background-color: #f8e6e6;}
.bgs-warning { background-color: #faf0e5;}

.bgp-info { background-color: #64cada;}

.bg-instant-approval { background-color: #ff7a01;}
.bg-instant { background-color: #22b730;}

.badge-count { display: inline-block; background-color: #ff6175 ; color: #ffffff; border-radius: 500px;}
.btn .badge.badge-count { padding: 4px; position: relative; margin: -4px 0; flex-shrink: 0;}
.btn-group-xs .btn .badge.badge-count,
.btn-xs .badge.badge-count { min-width: 14px; margin: -6px 0;}
.btn-group-sm .btn .badge.badge-count,
.btn-sm .badge.badge-count { min-width: 16px;}

.btn:has(.badge-sup) { position: relative; margin-right: 3px;}
.badge-sup { position: absolute !important; top: -6px !important; right: -6px; font-size: 0.6rem; border-radius: 500px; z-index: 50; padding-left: 4px; padding-right: 4px;}
.badge-sup { background-color: #ff6175; color: #ffffff; min-width: 14px;}
.badge-sup.light { background-color: #dedede; color: #333333;}
.btn-success .badge-sup { box-shadow: -1px 1px 0 0 #0000001f;}

.taskbar .nav-pills .nav-link.active { background-color: #eeeffc; color: #3742c0;}

.pagination .page-item .page-link { color: #1d289d;}
.pagination .page-item.active .page-link { background-color: #222fb9; color: #ffffff; border-color: transparent;}

.modal-header .close { font-family: Arial, Helvetica, sans-serif !important;}

.htmlContent * { all: revert; }
.htmlContent p:last-child,
.alert p:last-child { margin-bottom: 0;}
.htmlContent strong,
.htmlContent b,
.alert strong,
.alert b { font-weight: 600 !important;}
.htmlContent img { max-width: 100%; height: auto;}

.app { position: relative; min-height: 100vh; max-width: 100vw !important; overflow-x: hidden;}
.sidebar { min-height: 100vh; width: 300px; background-color: #222fb9;}
.sidebar.closed { width: 60px;}

.sidebar.closed .logoText { width: 0 !important; white-space: nowrap; overflow: hidden;}
.sidebar .logo2 { color: #6670e2;}

.sideClose { display: none; background-color: rgba(255, 255, 255, 0.10); padding: 8px 12px; margin-left: auto; border-top-left-radius: 5px; border-bottom-left-radius: 5px;}

.side { /*height: calc(100vh - 78px);*/ padding-bottom: 24px; overflow-y: hidden;}
.side > ul > li.hasRight { display: flex; align-items: center; gap: 4px;}
.side > ul > li.itemSep { border-bottom: 1px solid rgba(255, 255, 255, 0.10);}
.side > ul > li > a { display: flex; flex: 1 1 auto; align-items: center; font-size: 14px; font-weight: 400; line-height: 20px; color: rgba(255, 255, 255, 0.7); text-decoration: none; border-radius: 500px; transition: 0.5s; margin-bottom: 8px;}
.side > ul > li > a .icon { width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: 0.5s;}
.side > ul > li > a .icon i { font-size: 18px;}
.side > ul > li > a .item { flex: 1 1 auto; padding: 10px 12px 10px 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.side > ul > li > a .item .badge { margin-top: 1px;}
.side > ul > li.mm-active > a,
.side > ul > li > a:hover { background-color: rgba(255, 255, 255, 0.2);}
.side > ul > li.mm-active > a .icon,
.side > ul > li > a:hover .icon { background-color: #ffffff; color: #222fb9;}
.side > ul > li > a.right { flex-shrink: 0; flex-grow: 0; line-height: 20px; padding: 12px;}
.side > ul > li > a.right.warn { background-color: tomato; justify-self: center; line-height: 14px; padding: 8px; height: 30px; min-width: 30px; display: flex; justify-content: center;}

.sidebar.closed .side { overflow-y: visible !important;}
.sidebar.closed .side > ul > li { position: relative !important;}
.sidebar.closed .side > ul > li > a .item,
.sidebar.closed .side > ul > li > a.right { display: none;}
.sidebar.closed .side > ul > li > a.has-arrow::after { display: none;}
.sidebar.closed .side > ul > li.mm-active > a,
.sidebar.closed .side > ul > li > a:hover { background-color: transparent;}

.side > ul > li > ul > li { display: flex; flex-wrap: wrap; gap: 4px;}
.side > ul > li > ul > li > a { display: flex; flex: 1 1 auto; align-items: center; font-size: 14px; color: rgba(255, 255, 255, 0.6); margin-bottom: 4px; padding: 8px 8px 8px 24px; text-decoration: none; transition: 0.3s;}
.side > ul > li > ul > li > a em { background-color: #dedede; width: 6px; height: 2px; margin-right: 18px; transition: 0.3s;}
.side > ul > li > ul > li.mm-active > a,
.side > ul > li > ul > li > a:hover { color: #ffffff;}
.side > ul > li > ul > li > a:hover em { margin-right: 24px !important;}
.side > ul > li > ul > li > a:hover em { background-color: #ffffff; width: 10px; margin-right: 14px;}
.side > ul > li > ul > li > a.right { flex-shrink: 0; flex-grow: 0; background: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.7); border-radius: 500px; text-align: center; font-size: 12px; padding: 8px 12px;}
.side > ul > li > ul > li > a.right:hover { color: #ffffff;}
.side > ul > li > ul > li > ul { display: block; width: 100%; margin-top: -8px;}
.side > ul > li > ul > li > ul > li > a { display: flex; flex: 1 1 auto; align-items: center; font-size: 12px; color: rgba(255, 255, 255, 0.6); margin-bottom: 4px; padding: 4px 8px 4px 32px; text-decoration: none; transition: 0.3s;}
.side > ul > li > ul > li > ul > li > a em { background-color: #dedede; width: 6px; height: 2px; margin-right: 18px; transition: 0.3s;}
.side > ul > li > ul > li > ul > li.mm-active > a,
.side > ul > li > ul > li > ul > li > a:hover { color: #ffffff;}
.side > ul > li > ul > li > ul > li > a:hover em { margin-right: 24px !important;}
.side > ul > li > ul > li > ul > li > a:hover em { background-color: #ffffff; width: 10px; margin-right: 14px;}

.sidebar.closed .side > ul > li > ul { display: none; position: absolute; top: 0; left: 44px; width: auto; min-width: 240px; height: auto; z-index: 999; background-color: #222fb9; padding: 12px 16px 8px 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px;}
.sidebar.closed .side > ul > li > ul > li { display: flex; white-space: nowrap !important;}
.sidebar.closed .side > ul > li:hover > ul { display: block;}

.content { position: relative; min-height: 100vh; background-color: #f1f1f1;}
.menu { box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.10);}
.mmods li { background-color: #fafafa;}
.mmods li a i,
.mmods li a svg { color: #b3b6d6;}
.mmods li.active { background-color: #e6e6e6;}
.mmods li.active a i,
.mmods li.active a svg { color: #1d289d;}
.mmods li a .item { display: none;}
.mmuser > li { position: relative;}
.mmuser > li > a.user { background-color: #ffffff; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #dedede;}
.mmuser > li > a.user > img { width: 32px; height: 32px; object-fit: cover; object-position: center; border-radius: 50%;}
.mmuser > li > .badge-count { position: absolute; top: -6px; right: -6px; background-color: #ff6175 ; color: #ffffff; border-radius: 500px; z-index: 50;}
.bottom { background-color: #e7e7e7;}

.content .ipCart { left: 0;}

@media (min-width: 768px) {

    .content .ipCart { left: 300px;}
    .content.closed .ipCart { left: 60px;}
}

.taskbar { display: flex; flex-direction: column; position: absolute; top: 76px; right: -400px; width: 400px; min-height: calc(100vh - 76px); max-height: calc(100vh - 76px); z-index: 999; background-color: #ffffff; border: 1px solid #dee2e6; border-right: none; border-bottom: none; box-shadow: -2px 3px 3px 0 #00000010; transition: 0.3s;}
.taskbar.show { right: 0;}
.taskbar .list { max-height: calc(100vh - 207px); overflow-y: scroll;}
.taskbaron .taskbarback { position: absolute; top: 76px; left: 0; right: 0; bottom: 0; background-color: #222fb930;}

.appMPF .sidebar { background-color: #dd3342;}
.appMPF .sidebar .logo2 { color: #efcb1f;}
.appMPF .side > ul > li.mm-active > a .icon,
.appMPF .side > ul > li > a:hover .icon { color: #d4303f;}

.appMIP .sidebar { background-color: #28258d;}
.appMIP .sidebar .logo2 { color: #40aaf1;}
.appMIP .side > ul > li.mm-active > a .icon,
.appMIP .side > ul > li > a:hover .icon { color: #28258d;}

.appMAPRO .sidebar { background-color: #1e1655;}
.appMAPRO .sidebar .logo2 { color: #a49bee;}
.appMAPRO .side > ul > li.mm-active > a .icon,
.appMAPRO .side > ul > li > a:hover .icon { color: #1e1655;}

.appMAT .sidebar { background-color: #8d2562;}
.appMAT .sidebar .logo2 { color: #40aaf1;}
.appMAT .side > ul > li.mm-active > a .icon,
.appMAT .side > ul > li > a:hover .icon { color: #28258d;}

.sidebar.closed .btnSwFlMode { display: none;}
.sidebar.closed .sideUser { display: none;}

.psBar { position: relative;}

#modalTask .comments .list { max-height: 30vh; overflow-y: auto;}

.modal-dialog.modal-fsx { width: calc(100% - 16px); min-width: calc(100% - 16px); height: calc(100% - 16px); margin: 8px auto; padding: 0;}
.modal-dialog.modal-fsx .modal-content { height: auto; min-height: 100%;}

.blPopBox { position: relative; z-index: 100;}
.blPopPop { position: absolute; z-index: 101; top: 0; margin-top: 35px; right: 0; height: auto; width: 480px; background-color: white; border-radius: 4px; box-shadow: 0 0 2px #000000;}
.blPopPop .results { max-height: 75vh; overflow-y: auto;}
.blPopPopRight { right: auto; left: 0;}

.popFilters label.popLabel { font-size: 9px; color: #818181; margin: 0;}
.popFilters .pfTitle { border-bottom: 1px solid #dedede; position: relative;}
.popFilters .pfTitle span { position: absolute; display: inline-block; padding: 0 4px; background-color: white; left: 50%; top: -8px; transform: translateX(-50%); font-size: 10px; color: #bebebe; text-transform: uppercase;}

@media (max-width: 767px) {

    /* Only XS Devices */
    
    .sidebar { max-height: 100vh; position: absolute; z-index: 5000; top: 0; left: -300px; transition: 0.3s;}
    .sidebar.show { left: 0;}
    .mmods { overflow-x: auto; overflow-y: hidden; height: 46px; display: flex; gap: 3px;}
    .mmods li:not(:last-child) { margin-right: 0;}
    .mmuser > li > a { width: 32px; height: 32px;}
    .mmuser > li > a > img { width: 32px; height: 32px;}

    .taskbar { top: 47px; right: -320px; width: 320px; min-height: calc(100vh - 47px); max-height: calc(100vh - 47px);}
    .taskbar .list { max-height: calc(100vh - 178px);}
    .taskbaron .taskbarback { top: 47px;}
}

@media (min-width: 768px) {

    /* MD+ Devices */

    .sidebar .sideClose { display: block;}

    .mmods li a .item { display: block;}
}

.input-group-xs input,
.input-group-xs select,
.input-group-xs .custom-file-label,
.form-control-xs { height: calc(1.5em + 0.25rem + 2px); padding: 0.1rem 0.5rem; font-size: .75rem; line-height: 1.2; border-radius: 0.2rem;}
.input-group-xs select { padding: 0.12rem 1.8rem 0.08rem 0.6rem;}
.input-group-xs .custom-file-label { padding: 0.25rem 0 0 0.5rem;}
.input-group-xs .custom-file-label::after { padding: 0.15rem 0.75rem;}
.custom-control .custom-control-label { color: #495057;}
.input-group-xs .input-group-text { padding: 0.16rem 0.5rem 0.12rem 0.5rem; font-size: .75rem; line-height: 1.2; border-radius: 0.2rem;}
.input-group-xs .btn { height: calc(1.5em + 0.25rem + 2px); padding: 0.1rem 0.125rem; font-size: .77rem; line-height: 1.2; border-radius: 0.2rem;}

.boxPriPubHov { border-radius: 0.25rem; transition: all 0.3s; padding: 8px; margin: 0 -8px; cursor: default;}
.boxPriPubHov:hover { background-color: #f6f7fd;}

.highlight { background-color: #ffff99; padding: 0 2px;}

.roCC { box-shadow: 0 0 0 #ffffff; border-radius: 50%;}
.roCC:active {
    box-shadow: 0 0 0 10px #f0ee789a,
        0 0 0 20px #f0ee789a,
        0 0 0 25px #f0ee789a,
        0 0 0 30px #f0ee789a,
        0 0 0 #ffffff;
    transition: 0.05s;
}

[x-cloak] { display: none !important;}

.revert * { all: revert; }

.contentPreview a { position: relative; text-decoration: none !important; color: #2175ad; background-color: #e8f6ff; padding: 0 3px;}
.contentPreview a::before { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; border: 1px dashed #40aaf1; cursor: pointer;}
.contentPreview a::after { content: '\f360'; font-family: 'Font Awesome 5 Free'; position: absolute; top: -4px; right: -5px; font-size: 8px; font-weight: 900; color: #36efe6;}

.popover { max-width: 90vw !important;}

.noty { background-color: #ffffff; border-left: 4px solid #ffffff; border-radius: 4px; padding: 0.75rem; box-shadow: -1px 1px 3px 2px rgba(0, 0, 0, 0.05); display: flex; align-items: center; gap: 0.75rem; z-index: 9999; position: relative; margin-bottom: 4px;}
.noty .icon { flex-shrink: 0; font-size: 14px; color: #ffffff; border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;}
.noty .title { font-size: 14px; color: #222222; font-weight: 500;}
.noty .text { flex-grow: 1; font-size: 13px; color: #999999; word-break: break-all;}
.noty .times { flex-shrink: 0; padding-left: 0.50rem;}
.noty .times .close { font-size: 36px !important; color: #787878 !important;}
.noty-success { border-left-color: #21b731;}
.noty-success .icon { background-color: #21b731;}
.noty-error { border-left-color: #ff2625;}
.noty-error .icon { background-color: #ff2625;}

.btn-group-xs > .btn,
.btn-xs { padding: 0.5rem 0.4rem; font-size: 12px; line-height: 0.6; border-radius: 0.2rem;}
.btn-xs i { font-size: 12px; line-height: 6px;}
.btn-group.btn-group-xs > .btn:first-of-type { border-top-left-radius: 0.2rem !important; border-bottom-left-radius: 0.2rem !important;}

.btn-group-title { position: relative;}
.btn-group-title > .title { position: absolute; top: -15px; left: 6px; right: 6px; font-size: 10px; height: 11px; text-align: center; z-index: 11;}
.btn-group-title > .title::before { content: ' '; position: absolute; top: 7px; left: 0; right: 0; height: 6px; border: 1px solid #dddddd; border-bottom: none; border-radius: 3px; z-index: -1;}
.btn-group-title > .title > .text { display: inline-block; background-color: #f1f1f1; color: #aaaaaa; padding: 0 6px;}

.bootstrap-select > .btn.btn-light { border-color: #dee2e6; color: #212529;}
.bootstrap-select .dropdown-item { padding: 0.25rem 0.75rem !important;}


.table-responsive { box-shadow: 0px 12px 23px 0px rgb(62 73 84 / 4%);}
.table { background-color: #ffffff; border-radius: 12px;}
.table thead tr th:first-child { border-left-color: transparent;}
.table thead tr th:last-child { border-right-color: transparent;}
.table thead tr th { font-size: 14px; font-weight: 600; color: #000000; text-transform: uppercase; padding: 16px 8px; vertical-align: middle; border-top: none;}
.table thead.thead-sm tr th { font-size: 12px; padding: 12px 8px;}
.table thead.thead-xs tr th { font-size: 11px; color: #212121; padding: 6px 0.30rem;}
.table tbody tr td { vertical-align: middle; padding: 0.60rem 0.50rem !important;}
.table.table-sm tbody tr td { padding: 0.20rem 0.30rem !important;}
.table:not(:table-sm) tbody tr td { padding-left: 8px; padding-right: 8px;}
.table tbody tr.bg-checked { background-color: #f0fcf2;}
.table tbody tr.bg-delete { background-color: #f7c7c7;}

.hsLogBox { position: fixed; top: 12px; left: 12px; max-width: 320px; max-height: 80vh; overflow-y: auto;}
.hsLogTop,
.hsLog { background-color: #fcb5ca; padding: 4px 8px; border: 1px solid #f298b3; border-radius: 5px; margin-bottom: 8px; color: #a03051;}

.supportPop { position: fixed; bottom: 16px; right: 16px;}
.supportPop.withIPC { bottom: 60px;}
.supportPopBtn { width: 60px; height: 60px; background-color: #ebc547; border-radius: 50%; box-shadow: 1px 2px 2px 1px #c7a534bb; position: relative;}
.supportPopBtn .counts { position: absolute; top: -4px; left: -4px;}

.xeList .add { font-size: 10px; cursor: pointer; opacity: 0.50; transition: all 0.2s ease-in-out;}
.xeList .add:hover { opacity: 1.00;}
.xeList .delete { cursor: pointer; opacity: 0.50; transition: all 0.3s ease-in-out;}
.xeList .delete:hover { opacity: 1.00;}
.xe { display: inline-block; border-bottom: 1px dashed #8ec2fa; cursor: pointer;}
.xe em.empty { font-size: 0.75rem; opacity: 0.25;}

.ffCourier { font-family: 'Courier New', monospace;}

.fs8 { font-size: 8px !important;}
.fs9 { font-size: 9px !important;}
.fs10 { font-size: 10px !important;}
.fs11 { font-size: 11px !important;}
.fs12 { font-size: 12px !important;}
.fs13 { font-size: 13px !important;}
.fs14 { font-size: 14px !important;}
.fs15 { font-size: 15px;}
.fs16 { font-size: 16px;}
.fs17 { font-size: 17px;}
.fs18 { font-size: 18px;}
.fs20 { font-size: 20px;}
.fs22 { font-size: 22px;}
.fs24 { font-size: 24px;}
.fs26 { font-size: 26px;}
.fs28 { font-size: 28px;}
.fs30 { font-size: 30px;}
.fs32 { font-size: 32px;}
.fs34 { font-size: 34px;}
.fs36 { font-size: 36px;}
.fs38 { font-size: 38px;}
.fs40 { font-size: 40px;}
.fs50 { font-size: 50px;}
.fs56 { font-size: 56px;}
.fs60 { font-size: 60px;}
.fs70 { font-size: 70px;}
.fs80 { font-size: 80px;}
.fs90 { font-size: 90px;}
.fs100 { font-size: 100px;}

.lh10 { line-height: 10px;}
.lh12 { line-height: 12px;}
.lh13 { line-height: 13px;}
.lh14 { line-height: 14px;}
.lh16 { line-height: 16px;}
.lh18 { line-height: 18px;}
.lh20 { line-height: 20px;}
.lh21 { line-height: 21px;}
.lh24 { line-height: 24px;}
.lh25 { line-height: 25px;}
.lh28 { line-height: 28px;}
.lh30 { line-height: 30px;}
.lh32 { line-height: 32px;}
.lh35 { line-height: 35px;}
.lh40 { line-height: 40px;}
.lh45 { line-height: 45px;}
.lh50 { line-height: 50px;}

fieldset[disabled] label.col-form-label { color: #6c757d;}
fieldset[disabled] label.btn { opacity: 0.65; cursor: default !important;}
fieldset[disabled] .btnAjaxSWIcon { opacity: 0.5; cursor: default !important;}

.clickCopy { font-size: 12px; background-color: #f0efd0; padding: 0 2px 1px 2px; border-radius: 3px; cursor: copy;}
.clickLoad { font-size: 12px; background-color: #d0ebf0; padding: 0 4px 1px 4px; border-radius: 3px; cursor: pointer;}
.clickHelp { font-size: 12px; background-color: #fcdefd; padding: 0 2px 1px 2px; border-radius: 3px; cursor: help;}
.clickHelp > span { color: #23c51e;}

.cardTitle { background-color: #edecf7; color: #3b3a50; padding: 0.5rem 0.75rem; border-radius: 5px;}
.cardTitleSM,
.cardTitleP2,
.cardTitleP3 { background-color: #f5f7f8; font-size: 12px; text-transform: uppercase; color: #5f6870; border-bottom: 1px solid #dee2e6; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem;}
.cardTitleSM { padding: 0.5rem 1.25rem; margin-top: -1.25rem; margin-left: -1.25rem; margin-right: -1.25rem;}
.cardTitleSM.inside { border-radius: 0; border-top: 1px solid #dee2e6;}
.cardTitleP2 { padding: 0.3rem 0.5rem; margin-top: -0.5rem; margin-left: -0.5rem; margin-right: -0.5rem;}
.cardTitleP3 { padding: 0.4rem 1rem; margin-top: -1rem; margin-left: -1rem; margin-right: -1rem;}
.cardTitleP3.inside { border-radius: 0; border-top: 1px solid #dee2e6; margin-top: 1rem;}
.cardTitleP0 { margin: 0 !important;}

.cardHR { margin-left: -1.25rem !important; margin-right: -1.25rem !important;}

.hrTitle { position: absolute; margin-top: -16px; background-color: rgba(0,0,0,.1); padding: 0 8px; font-size: 10px; color: rgba(0,0,0,.3); text-transform: uppercase; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px;}

.divEdit { display: block; border: 1px solid #eeeeee; padding: 6px 8px; border-radius: 0.2rem; direction: ltr !important;}
.divEdit:hover { border-color: #dedede;}
.divEdit:focus { border-color: #a7c8f3; outline: 1px solid #a7c8f3 !important;}
.divHTML * { all: revert; }
.divHTML a { text-decoration-line: underline !important; background-color: #d1e6ff;}
.divHTML h1 { font-size: 20px !important;}
.divHTML h2 { font-size: 19px !important;}
.divHTML h3 { font-size: 18px !important;}
.divHTML h4 { font-size: 17px !important;}
.divHTML h5 { font-size: 16px !important;}
.divHTML h6 { font-size: 15px !important;}
.divHTML img { max-width: 100% !important; height: auto !important;}
.divEditSim { display: block; width: 100%; outline: none;}
.divEditSim:focus { background-color: rgb(255, 255, 244);}
.divEditNoBorders { border: none; border-radius: 0;}

input[type="hidden_"] { width: 100%; border: 1px solid rgb(255, 147, 128);}

.flexBreak { flex-basis: 100%; height: 0;}
.flexCenter { display: flex; align-items: center; justify-content: center;}
.flexMW { min-width: 0;}
.flexBasis0 { flex-basis: 0;}
.flexShrink0 { flex-shrink: 0;}
.flexFill { flex: 1 1 auto;}
.flexGrow0 { flex-grow: 0;}
.breakWord { word-wrap: break-word !important;}
.imgCover { object-fit: cover !important; object-position: center;}
.imgCoverTop { object-fit: cover !important; object-position: top;}
.imgContain { object-fit: contain !important; object-position: center;}
.img169 { aspect-ratio: 16 / 9;}
.imgSquare { aspect-ratio: 1 / 1;}

.aspect-square { aspect-ratio: 1 / 1;}
.aspect-video { aspect-ratio: 16 / 9;}

.flex-item-2 { flex: 1 0 calc(50% - 12px)}
.flex-item-3 { flex: 1 0 calc(33.33% - 12px)}
.flex-item-4 { flex: 1 0 calc(25% - 12px)}
.flex-item-5 { flex: 1 0 calc(20% - 12px)}
.flex-item-6 { flex: 1 0 calc(16.66% - 12px)}
.flex-item-8 { flex: 1 0 calc(12.5% - 12px)}
.flex-item-10 { flex: 1 0 calc(10% - 12px)}
.flex-item-2,
.flex-item-3,
.flex-item-4,
.flex-item-5,
.flex-item-6,
.flex-item-8,
.flex-item-10 { margin: 6px; flex-shrink: 0; flex-grow: 0;}

.squareBox { display: block; width: 100%; padding-top: 100%; position: relative;}
.squareBox > div { position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.squareBox > div img { width: 100%; height: 100%;}

.opac00 { opacity: 0.00;}
.opac15 { opacity: 0.15;}
.opac25 { opacity: 0.25;}
.opac50 { opacity: 0.50;}
.opac60 { opacity: 0.60;}
.opac75 { opacity: 0.75;}
.opac85 { opacity: 0.85;}

.imgMW100 img,
.fieldsResults img { max-width: 100%;}
.fieldsResults quote { background-color: #dbdbdb;}

.rounded8 { border-radius: 8px;}

.img90x90 { width: 90px; height: 90px; object-fit: contain; object-position: center;}
.img80x80 { width: 80px; height: 80px; object-fit: contain; object-position: center;}
.img60x60 { width: 60px; height: 60px; object-fit: contain; object-position: center;}
.img50x50 { width: 50px; height: 50px; object-fit: contain; object-position: center;}
.img48x48 { width: 48px; height: 48px; object-fit: contain; object-position: center;}
.img42x42 { width: 42px; height: 42px; object-fit: contain; object-position: center;}
.img40x40 { width: 40px; height: 40px; object-fit: contain; object-position: center;}
.img36x36 { width: 36px; height: 36px; object-fit: contain; object-position: center;}
.img30x30 { width: 30px; height: 30px; object-fit: contain; object-position: center;}
.img24x24 { width: 24px; height: 24px; object-fit: contain; object-position: center;}
.img20x20 { width: 20px; height: 20px; object-fit: contain; object-position: center;}
.img16x16 { width: 16px; height: 16px; object-fit: contain; object-position: center;}

.imgGS { filter: grayscale(100%);}

.txtOverflow { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.txtOverflow br { display: none !important;}
.txtNoWrap { white-space: nowrap;}
.txtUpper { text-transform: uppercase;}
.txtBreakAll { word-break: break-all;}
.txtItalic { font-style: italic;}
.txtStrike { text-decoration: line-through;}
.txtStrike:hover { text-decoration: line-through;}
.txtEditable { display: inline-block; border-bottom: 1px dashed #beb678;}
.txtNoTransform { text-transform: none !important;}
.underDash { display: inline-block; position: relative;}
.underDash::after { content: ''; display: block; position: absolute; bottom: 0; width: 100%; border-bottom: 2px dashed #68a7da;}
.txtRmBr { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; white-space: nowrap; background-color: #ffffec; padding: 4px; border-radius: 4px;}
.txtRmBr:hover { background-color: transparent;}
.txtRmBr br { display: none;}
.txt900 { font-weight: 900;}
.txt800 { font-weight: 800;}
.txt700 { font-weight: 700;}
.txt600 { font-weight: 600;}
.txt500 { font-weight: 500;}
.txt400 { font-weight: 400;}
.txt300 { font-weight: 300;}
.txt200 { font-weight: 200;}
.txt100 { font-weight: 100;}

.tracking-tighter { letter-spacing: -0.05em;}
.tracking-tight { letter-spacing: -0.025em;}
.tracking-normal { letter-spacing: 0em;}
.tracking-wide { letter-spacing: 0.025em;}
.tracking-wider { letter-spacing: 0.05em;}
.tracking-widest { letter-spacing: 0.1em;}

.focusBorder { border-color: transparent;}
.focusBorder:focus { border-color: #ced4da;}
.border-input { border-color: #ced4da !important;}
.border-inputi { border-color: #e9ecf0 !important;}
.borderLight { border-color: #eeeeee !important;}
.border-primaryi { border: 1px solid #82b6ee !important;}
.border-dangeri { border: 1px solid #e77d87 !important;}
.border-warningi { border: 1px solid #f0c39a !important;}

.bgStatsRed { background-color: #fadfdf;}
.bgStatsGreen { background-color: #e6fde6;}

.bgLogos { background: repeating-conic-gradient(#eee 0% 25%, #fff 0% 50%) 50%/10px 10px;}
.bgLogos:hover { background: none;}

.bgTimes { position: relative;}
.bgTimes::after { content: '×'; font-size: 12px; opacity: 0.50; position: absolute; top: 40%; right: 50%; transform: translate(50%,-50%);}

.bgHoverGray:hover { background-color: #f2f4f7;}

.bgBackdrop { background-color: #00000055;}

.bg-sidebar { background-color: #28258d;}
.bg-sidebari { background-color: #5955c0;}
.bg-sidebar2 { background-color: #1d289d;}
.bg-border { background-color: #dee2e6;}
.bg-gray { background-color: #eaeef1;}
.bg-gray1 { background-color:#f5f8fa;}
.bg-grayi { background-color:#f8f9fa;}
.bg-black-25 { background-color: rgba(0, 0, 0, 0.25);}
.bg-black-50 { background-color: rgba(0, 0, 0, 0.50);}
.bg-black-75 { background-color: rgba(0, 0, 0, 0.75);}

.border-gray { border-color: #eaeef1 !important;}

.pfBlock { background-color: #f5f7f8; border: 1px solid #dee2e6; overflow: hidden;}
.pfbTitle { background-color: #e9eff1;}

.text-btninfo { color: #6670e2 !important;}
.text-body { color: #111111 !important;}
.text-primary { color: #222fb9 !important;}
.text-secondary { color: #ff6175 !important;}
.text-success { color: #21b731 !important;}
.text-info { color: #2781d5 !important;}
.text-warning { color: #ff7a01 !important;}
.text-star { color: #f8c047 !important;}
.text-yellow { color: #ffee01 !important;}
.text-danger { color: #ff2625 !important;}
.text-dark { color: #6e6e6e !important;}
.text-light { color: #9e9e9e !important;}
.text-front-theme { color: #121158;}
.text-front-theme1 { color: #9c9bec;}
.text-front-theme2 { color: #2f2cd8;}
.text-front-text { color: #515184;}

.color-333 { color: #333333;}
.color-sidebar { color: #222fb9;}
.color-sidebar2 { color: #1d289d;}

.custom-file-label { color: #cacaca;}

.mcDefault { cursor: default;}
.mcPointer { cursor: pointer !important;}
.mcHelp { cursor: help;}
.mcWait { cursor: wait;}
.mcSort { cursor: grab;}
.mcDeny { cursor: not-allowed;}
.mcMove { cursor: move;}

.swRowFull .dropdown-menu.inner li a.dropdown-item .text { width: 100%;}
.swRowFull .dropdown-menu.inner li.selected a.dropdown-item .text .opac50,
.swRowFull .dropdown-menu.inner li.active a.dropdown-item .text .opac50 { color: #ffffff !important;}
.dropdown-item .text { width: 100%;}
.dropdown-item.active .text-muted,
.dropdown-item.active.selected .text-muted,
.dropdown-item:active .text-muted { color: #ffffff !important;}

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

.gap2 { gap: 2px;}
.gap4 { gap: 4px;}
.gap6 { gap: 6px;}
.gap8 { gap: 8px;}
.gap12 { gap: 12px;}
.gap16 { gap: 16px;}
.gap18 { gap: 18px;}
.gap20 { gap: 20px;}
.gap24 { gap: 24px;}

.pl8px { padding-left: 8px;}
.pr8px { padding-right: 8px;}

.mt1px { margin-top: 1px;}

.leading-none { line-height: 1;}
.leading-tight { line-height: 1.25;}

.posRel { position: relative;}
.posAbs { position: absolute;}
.posFix { position: fixed;}
.inset-0 { top: 0px; right: 0px; bottom: 0px; left: 0px;}
.top-0 { top: 0px;}
.top-100 { top: 100%;}
.right-0 { right: 0px;}
.bottom-0 { bottom: 0px;}
.left-0 { left: 0px;}
.inset-x-center { left: 50%; transform: translateX(-50%);}
.inset-y-center { top: 50%; transform: translateY(-50%);}

.originalText img,
.note-editable ul,
.note-editable ol,
.note-editable li,
.note-editable table,
.note-editable tbody,
.note-editable thead,
.note-editable tfoot,
.note-editable tr,
.note-editable td,
.note-editable th,
.note-editable caption,
.note-editable col,
.note-editable colgroup,
.note-editable blockquote,
.note-editable pre,
.note-editable code,
.note-editable h1,
.note-editable h2,
.note-editable h3,
.note-editable h4,
.note-editable h5,
.note-editable h6,
.note-editable p
.note-editable em,
.note-editable i,
.note-editable strong,
.note-editable b,
.note-editable u,
.note-editable strike,
.note-editable dl,
.note-editable dt,
.note-editable dd,
.note-editable br,
.note-editable hr,
.note-editable font,
.note-editable sup,
.note-editable sub,
.note-editable ins,
.note-editable del,
.note-editable mark,
.note-editable figure,
.note-editable figcaption,
.note-editable address,
.note-editable time,
.note-editable small,
.note-editable big { all: revert !important;}
.note-editable img { max-width: 100% !important;}

.text-muted1 { color: #394147 !important;}
.text-muted11 { color: #5b6268 !important;}
.text-muted2 { color: #949ea7 !important;}
.text-muted3 { color: #b8c2ca !important;}
.text-muted4 { color: #cfd6db !important;}
.text-purple2 { color: #aa8dd4 !important;}

.custom-file-sm { padding: 0; font-size: 12px !important;}
.custom-file-sm input { padding: 0;}
.custom-file-sm label { padding: 6px 8px;}
.custom-file-sm label::after { padding: 6px 8px;}

.btn-group .btn-sm.btn-primary:not(:first-child),
.btn-group .btn-xs.btn-primary:not(:first-child),
.btn-group .btn-sm.btn-info:not(:first-child),
.btn-group .btn-xs.btn-info:not(:first-child),
.btn-group .btn-sm.btn-warning:not(:first-child),
.btn-group .btn-xs.btn-warning:not(:first-child),
.btn-group .btn-sm.btn-danger:not(:first-child),
.btn-group .btn-xs.btn-danger:not(:first-child) { border-left: 1px solid rgba(255, 255, 255, 0.25);}

.w-15p { width: 15%;}
.w-20p { width: 20%;}
.w-30p { width: 30%;}
.w-40p { width: 40%;}
.w-60p { width: 60% !important;}
.w-80p { width: 80%;}

.w4 { width: 4px;}
.w6 { width: 6px;}
.w8 { width: 8px;}
.w10 { width: 10px;}
.w12 { width: 12px;}
.w14 { width: 14px;}
.w16 { width: 16px;}
.w18 { width: 18px;}
.w20 { width: 20px;}
.w22 { width: 22px;}
.w24 { width: 24px;}
.w28 { width: 28px;}
.w32 { width: 32px;}
.w40 { width: 40px;}
.w45 { width: 45px;}
.w50 { width: 50px;}
.w55 { width: 55px;}
.w60 { width: 60px;}
.w80 { width: 80px;}
.w90 { width: 90px;}
.w120 { width: 120px;}
.w140 { width: 140px;}
.w160 { width: 160px;}
.w180 { width: 180px;}
.w320 { width: 320px;}

.mw-75 { max-width: 75% !important;}
.mw-100 { max-width: 100% !important;}
.mw120px { max-width: 120px;}
.mw160px { max-width: 160px;}
.mw200px { max-width: 200px;}
.mw240px { max-width: 240px;}
.mw300px { max-width: 300px;}
.mw400px { max-width: 400px;}

.h4 { height: 4px;}
.h6 { height: 6px;}
.h8 { height: 8px;}
.h10 { height: 10px;}
.h12 { height: 12px;}
.h14 { height: 14px;}
.h16 { height: 16px;}
.h17 { height: 17px;}
.h18 { height: 18px;}
.h20 { height: 20px;}
.h22 { height: 22px;}
.h24 { height: 24px;}
.h28 { height: 28px;}
.h32 { height: 32px;}
.h36 { height: 36px;}
.h40 { height: 40px;}
.h50 { height: 50px;}
.h60 { height: 60px;}
.h80 { height: 80px;}
.h90 { height: 90px;}
.h240 { height: 240px;}

.mh200px { max-height: 200px;}
.mh210px { max-height: 210px;}
.mh240px { max-height: 240px;}

.modal-fullscreen { padding: 0 !important;}
.modal-fullscreen .modal-dialog { width: 100%; max-width: none; height: 100%; margin: 0;}
.modal-fullscreen .modal-content { height: 100%; border: 0; border-radius: 0;}
.modal-fullscreen .modal-body { overflow-y: auto;}


@media (max-width:1569px) {
    .modal-xxl { max-width:96%;}
}
@media (min-width:1570px) {
    .modal-xxl { max-width:1320px;}
}

.noSelect { -webkit-user-select: none; user-select: none;}
.noBorder { border: none !important;}
.noMargin { margin: 0 !important;}
.noPadding { padding: 0 !important;}

.m-05 { margin: 0.125rem !important;}
.ml-05 { margin-left: 0.125rem !important;}
.mr-05 { margin-right: 0.125rem !important;}
.mb-05 { margin-bottom: 0.125rem !important;}
.mt-05 { margin-top: 0.125rem !important;}
.mx-05 { margin-left: 0.125rem !important; margin-right: 0.125rem !important;}
.my-05 { margin-top: 0.125rem !important; margin-bottom: 0.125rem !important;}
.-mb1px { margin-bottom: -1px !important;}
.-mb2px { margin-bottom: -2px !important;}
.-mb3px { margin-bottom: -3px !important;}
.-mb4px { margin-bottom: -4px !important;}

.p-05 { padding: 0.125rem !important;}
.px-05 { padding-left: 0.125rem !important; padding-right: 0.125rem !important;}
.py-05 { padding-top: 0.125rem !important; padding-bottom: 0.125rem !important;}
.pt-05 { padding-top: 0.125rem !important;}
.pb-05 { padding-bottom: 0.125rem !important;}

.p-15 { padding: 0.375rem !important;}
.px-15 { padding-left: 0.375rem !important; padding-right: 0.375rem !important;}
.py-15 { padding-top: 0.375rem !important; padding-bottom: 0.375rem !important;}
.pt-15 { padding-top: 0.375rem !important;}
.pb-15 { padding-bottom: 0.375rem !important;}

.p1px { padding: 1px;}
.p2px { padding: 2px;}
.pt2px { padding-top: 2px;}

.exlItem { display: none;}

.hoverShow .hoverShowBox,
.hoverShow .hsItem { visibility: hidden;}
.hoverShow:hover .hoverShowBox,
.hoverShow:hover .hsItem { visibility: visible;}

.hoverDNShow .hoverShowBox { display: none;}
.hoverDNShow:hover .hoverShowBox { display: block;}

.hoverOpac50t100 { opacity: 0.50;}
.hoverOpac50t100:hover { opacity: 1.00;}
.hoverOpac75t100 { opacity: 0.75;}
.hoverOpac75t100:hover { opacity: 1.00;}
.hoverOpac25t50 { opacity: 0.25;}
.hoverOpac25t50:hover { opacity: 0.50;}
.hoverOpac25t75 { opacity: 0.25;}
.hoverOpac25t75:hover { opacity: 0.75;}

.files .item:last-child { border-bottom: none !important;}

.textP { display: flex; flex-direction: column;}
.textP p { margin: 0;}

.itemCB span { display: none;}
.itemCBUsed { position: relative; z-index: 50;}
.itemCBUsed span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 51;}

.shadowBlock { box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.10);}
.shadowBlock:hover { box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);}

.shadowBlock2 { box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.10); transition: box-shadow 0.3s;}
.shadowBlock2:hover { box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.30);}

.shadowSM,
.hoverShadowSM:hover { box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.10);}
.shadowMD,
.hoverShadowMD:hover { box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.10);}

.hover-bg-primary:hover { background-color: #e8eaf9;}
.hover-bg-secondary:hover { background-color: #fffafc;}
.hover-bg-success:hover { background-color: #d5f7d9;}
.hover-bg-info:hover { background-color: #f0f6fc;}
.hover-bg-warning:hover { background-color: #fff0e1;}
.hover-bg-danger:hover { background-color: #ffe7e7;}
.hover-bg-light:hover { background-color: #f4f4f5;}
.hover-bg-gray1:hover { background-color: #f5f8fa;}
.hover-bg-dark:hover { background-color: #aeaeae;}

.trans-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;}
.trans-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;}

.overflow-x-auto { overflow-x: auto !important;}
.overflow-x-hidden { overflow-x: hidden !important;}
.overflow-y-auto { overflow-y: auto !important;}
.overflow-y-hidden { overflow-y: hidden !important;}

.invalid-feedback { font-size: 75%; font-weight: 300; line-height: 1rem;}

.freezePopLoader { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.psfChecks .btn i { color: #bec1d1;}
.psfChecks .btn.active i.fa-check-circle { color: #21b731;}
.psfChecks .btn.active i.fa-trash { color: #ff2625;}

.note-editable a { text-decoration-line: underline !important; background-color: #d1e6ff;}
.note-editable h1 { font-size: 20px !important;}
.note-editable h2 { font-size: 19px !important;}
.note-editable h3 { font-size: 18px !important;}
.note-editable h4 { font-size: 17px !important;}
.note-editable h5 { font-size: 16px !important;}
.note-editable h6 { font-size: 15px !important;}

.note-editable span.uaiMarkBegin { display: inline-block; width: 4px; height: 18px; background-color: #d6cbc9; margin: 0 8px 0 3px; position: relative; cursor: pointer;}
.note-editable span.uaiMarkBegin::after { content: ''; display: block; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid #2276dd; position: absolute; top: 0; left: 5px;}
.note-editable span.uaiMarkEnd { display: inline-block; width: 4px; height: 16px; background-color: #d6cbc9; margin: 0 3px 0 8px; position: relative; cursor: pointer;}
.note-editable span.uaiMarkEnd::after { content: ''; display: block; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 5px solid #2276dd; position: absolute; top: 0; right: 5px;}

.box-scrollbar { overflow-y: auto; position: relative; margin-right: -5px; padding-right: 5px;}
.box-scrollbar::-webkit-scrollbar { width: 6px; margin-left: 12px; visibility: hidden; position: absolute; right: -3px;}
.box-scrollbar::-webkit-scrollbar-track { background-color: #f6f6f6; border-radius: 2px;}
.box-scrollbar::-webkit-scrollbar-thumb { background: #d1dce7; border-radius: 2px;}

.hidden { display: none;}
.grid { display: grid;}
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr));}
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
.grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
.grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
.grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
.grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
.grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
.grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
.grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
.col-span-1 { grid-column: span 1 / span 1;}
.col-span-2 { grid-column: span 2 / span 2;}
.col-span-3 { grid-column: span 3 / span 3;}
.col-span-4 { grid-column: span 4 / span 4;}
.col-span-5 { grid-column: span 5 / span 5;}
.col-span-6 { grid-column: span 6 / span 6;}
.col-span-7 { grid-column: span 7 / span 7;}
.col-span-8 { grid-column: span 8 / span 8;}
.col-span-9 { grid-column: span 9 / span 9;}
.col-span-10 { grid-column: span 10 / span 10;}
.col-span-11 { grid-column: span 11 / span 11;}
.col-span-12 { grid-column: span 12 / span 12;}

.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.line-clamp-4 { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}
.line-clamp-5 { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}


.mpItem .image { overflow: hidden;}
.mpItem .image img { transition: transform 0.5s ease-in-out;}
.mpItem .image .imageHover { opacity: 0.00; transition: opacity 0.5s ease-in-out;}
.mpItem:hover .image img { transform: scale(105%); position: relative;}
.mpItem:hover .image .imageHover { opacity: 1.00;}
.mpItem .mtrItems { margin-left: -4px;}
.mpItem .mtrItem { padding: 0 4px; border-radius: 3px;}
.mpItem .mtrItem:hover { background-color: #f0f6fc;}
.modeList .image { display: none;}
.modeList .btnPublish { margin-left: auto;}
.modeColumn .mpItem > div:not(:first-child) { padding-top: 12px; margin-top: 12px; border-top: 1px solid #dedede;}
.modeColumn .btnPublish { margin-left: 0;}
.modeColumn .image { display: block;}
.modeColumn .priceOffer { display: flex; align-items: center; gap: 12px;}

.fi-en{background-image:url(//cdnjs.cloudflare.com/ajax/libs/flag-icon-css/6.6.6/flags/4x3/gb.svg)}
.fi-en.fis{background-image:url(//cdnjs.cloudflare.com/ajax/libs/flag-icon-css/6.6.6/flags/1x1/gb.svg)}

.fa-rotate-45 { transform: rotate(45deg);}
.fa-rotate-45- { transform: rotate(-45deg);}

.preFixed { white-space: pre-wrap !important; word-wrap: break-word !important;}

.bgWhiteNoHover,
.bgWhiteNoHover:hover { background-color: #ffffff !important;}

/* Small devices (landscape phones, 576px and up) */

@media (min-width: 576px) {
    
}


/* Medium devices (tablets, 768px and up) */

@media (min-width: 768px) {

    .offersList .item .image img { height: 12vw;}

    .supportPop { bottom: 24px; right: 24px;}


    /* Common */

    .fs10-md { font-size: 10px !important;}
    .fs11-md { font-size: 11px !important;}
    .fs12-md { font-size: 12px !important;}
    .fs13-md { font-size: 13px !important;}
    .fs14-md { font-size: 14px !important;}
    .fs15-md { font-size: 15px !important;}
    .fs16-md { font-size: 16px !important;}
    .fs17-md { font-size: 17px !important;}
    .fs18-md { font-size: 18px !important;}
    .fs20-md { font-size: 20px !important;}
    .fs22-md { font-size: 22px !important;}
    .fs24-md { font-size: 24px !important;}
    .fs26-md { font-size: 26px !important;}
    .fs28-md { font-size: 28px !important;}
    .fs30-md { font-size: 30px !important;}
    .fs32-md { font-size: 32px !important;}
    .fs34-md { font-size: 34px !important;}
    .fs36-md { font-size: 36px !important;}
    .fs38-md { font-size: 38px !important;}
    .fs40-md { font-size: 40px !important;}
    .fs50-md { font-size: 50px !important;}
    .fs56-md { font-size: 56px !important;}
    .fs60-md { font-size: 60px !important;}
    .fs70-md { font-size: 70px !important;}
    .fs80-md { font-size: 80px !important;}
    .fs90-md { font-size: 90px !important;}
    .fs100-md { font-size: 100px !important;}

    .w-20-md { width: 20% !important;}
    .w-25-md { width: 25% !important;}
    .w-30-md { width: 30% !important;}
    .w-35-md { width: 35% !important;}
    .w-40-md { width: 40% !important;}
    .w-50-md { width: 50% !important;}
    .w-60-md { width: 60% !important;}
    .w-75-md { width: 75% !important;}

    .w25-md { width: 25px;}
    .w30-md { width: 30px;}
    .w37-md { width: 37px;}
    .w40-md { width: 40px;}
    .w60-md { width: 60px;}
    .w100-md { width: 100px;}
    .w120-md { width: 120px;}
    .w140-md { width: 140px;}
    .w160-md { width: 160px;}
    .w200-md { width: 200px;}

    .rounded-md { border-radius: .25rem !important;}
    .rounded-md-right { border-top-right-radius: .25rem!important; border-bottom-right-radius: .25rem!important;}

    .bg-gray2-md { background-color: #f6faff;}

    .md\:grid { display: grid;}
    .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr));}
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
    .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
    .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
    .md\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
    .md\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
    .md\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
    .md\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
    .md\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
    .md\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
    .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
    .md\:col-span-1 { grid-column: span 1 / span 1;}
    .md\:col-span-2 { grid-column: span 2 / span 2;}
    .md\:col-span-3 { grid-column: span 3 / span 3;}
    .md\:col-span-4 { grid-column: span 4 / span 4;}
    .md\:col-span-5 { grid-column: span 5 / span 5;}
    .md\:col-span-6 { grid-column: span 6 / span 6;}
    .md\:col-span-7 { grid-column: span 7 / span 7;}
    .md\:col-span-8 { grid-column: span 8 / span 8;}
    .md\:col-span-9 { grid-column: span 9 / span 9;}
    .md\:col-span-10 { grid-column: span 10 / span 10;}
    .md\:col-span-11 { grid-column: span 11 / span 11;}
    .md\:col-span-12 { grid-column: span 12 / span 12;}

    .md\:max-w-40 { max-width: 40%;}
}


/* Large devices (desktops, 992px and up) */

@media (min-width: 992px) {

    .lg\:block { display: block;}
    .lg\:flex { display: flex;}
    .lg\:grid { display: grid;}
    .lg\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr));}
    .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
    .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
    .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
    .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
    .lg\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
    .lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
    .lg\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
    .lg\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
    .lg\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
    .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
    .lg\:col-span-1 { grid-column: span 1 / span 1;}
    .lg\:col-span-2 { grid-column: span 2 / span 2;}
    .lg\:col-span-3 { grid-column: span 3 / span 3;}
    .lg\:col-span-4 { grid-column: span 4 / span 4;}
    .lg\:col-span-5 { grid-column: span 5 / span 5;}
    .lg\:col-span-6 { grid-column: span 6 / span 6;}
    .lg\:col-span-7 { grid-column: span 7 / span 7;}
    .lg\:col-span-8 { grid-column: span 8 / span 8;}
    .lg\:col-span-9 { grid-column: span 9 / span 9;}
    .lg\:col-span-10 { grid-column: span 10 / span 10;}
    .lg\:col-span-11 { grid-column: span 11 / span 11;}
    .lg\:col-span-12 { grid-column: span 12 / span 12;}

    .lg\:max-w-30 { max-width: 30%;}
}


/* Extra large devices (large desktops, 1200px and up) */

@media (min-width: 1200px) {

    .table-responsive { overflow-x: visible;}

    .xl\:block { display: block;}
    .xl\:flex { display: flex;}
    .xl\:grid { display: grid;}
    .xl\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr));}
    .xl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
    .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
    .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
    .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
    .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
    .xl\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
    .xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
    .xl\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
    .xl\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
    .xl\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
    .xl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
    .xl\:col-span-1 { grid-column: span 1 / span 1;}
    .xl\:col-span-2 { grid-column: span 2 / span 2;}
    .xl\:col-span-3 { grid-column: span 3 / span 3;}
    .xl\:col-span-4 { grid-column: span 4 / span 4;}
    .xl\:col-span-5 { grid-column: span 5 / span 5;}
    .xl\:col-span-6 { grid-column: span 6 / span 6;}
    .xl\:col-span-7 { grid-column: span 7 / span 7;}
    .xl\:col-span-8 { grid-column: span 8 / span 8;}
    .xl\:col-span-9 { grid-column: span 9 / span 9;}
    .xl\:col-span-10 { grid-column: span 10 / span 10;}
    .xl\:col-span-11 { grid-column: span 11 / span 11;}
    .xl\:col-span-12 { grid-column: span 12 / span 12;}
}


/* 2XL devices (large desktops, 1500px and up) */

@media (min-width: 1500px) {

    .table-responsive { overflow-x: visible;}

    .xxl\:block { display: block;}
    .xxl\:flex { display: flex;}
    .xxl\:grid { display: grid;}
    .xxl\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr));}
    .xxl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
    .xxl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
    .xxl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
    .xxl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
    .xxl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
    .xxl\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
    .xxl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
    .xxl\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
    .xxl\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
    .xxl\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
    .xxl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
    .xxl\:col-span-1 { grid-column: span 1 / span 1;}
    .xxl\:col-span-2 { grid-column: span 2 / span 2;}
    .xxl\:col-span-3 { grid-column: span 3 / span 3;}
    .xxl\:col-span-4 { grid-column: span 4 / span 4;}
    .xxl\:col-span-5 { grid-column: span 5 / span 5;}
    .xxl\:col-span-6 { grid-column: span 6 / span 6;}
    .xxl\:col-span-7 { grid-column: span 7 / span 7;}
    .xxl\:col-span-8 { grid-column: span 8 / span 8;}
    .xxl\:col-span-9 { grid-column: span 9 / span 9;}
    .xxl\:col-span-10 { grid-column: span 10 / span 10;}
    .xxl\:col-span-11 { grid-column: span 11 / span 11;}
    .xxl\:col-span-12 { grid-column: span 12 / span 12;}
}


/* Just Mobile devices (max 768px) */

@media (max-width: 767.999px) {
    
    .filterPopup { position: absolute; top: 0; right: 0; left: 0; z-index: 9999;}
}


/* Just XS devices (max 576px) */

@media (max-width: 575.999px) {

    .hibText { min-height: calc(100vh - 86px);}
    .homeHeader .hibImage { min-height: calc(100vh - 86px);}
    .modal-header { padding: 8px 16px;}
    .modal-title { font-size: 1rem;}
    .formFilters { overflow-x: auto;}
    .formFilters.d-flex .form-control { flex-shrink: 0; max-width: 100px;}
    .paginationBox { overflow-x: auto;}
    .mobOverX { max-width: 100%; overflow-x: auto;}
    .pr-xs-0 { padding-right: 0 !important;}
}


/* Animations */

.animationFlicker { animation: flickerAnimation 0.75s infinite;}
.animationFlickerSlow { animation: flickerAnimation 1.5s infinite;}

@keyframes flickerAnimation {
    0%   { opacity: 1.0; }
    50%  { opacity: 0.5; }
    100% { opacity: 1.0; }
}

.animationOpenAIOn { animation: openAIAnimationOn 5s infinite;}

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

.animationOpenAIOff { animation: openAIAnimationOff 1s infinite;}

@keyframes openAIAnimationOff {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(30deg); }
}

@keyframes rotateBorder {
    0% { border-image: linear-gradient(0deg, #ffa500, #fffacd) 1;}
    25% { border-image: linear-gradient(90deg, #ffa500, #fffacd) 1;}
    50% { border-image: linear-gradient(180deg, #ffa500, #fffacd) 1;}
    75% { border-image: linear-gradient(270deg, #ffa500, #fffacd) 1;}
    100% { border-image: linear-gradient(360deg, #ffa500, #fffacd) 1;}
}

.border-gradient-loading {
    border-width: 1px;
    animation: rotateBorder 1.5s linear infinite;
}

/* Modal Loading */

.modal-header-loading {
    background-image: linear-gradient(-45deg, #f4f5fc 25%, transparent 25%, transparent 50%, #f4f5fc 50%, #f4f5fc 75%, transparent 75%, transparent), linear-gradient(-45deg, #f5f5f5 25%, transparent 25%, transparent 50%, #f5f5f5 50%, #f5f5f5 75%, transparent 75%, transparent);
    background-size: 50px 50px;
    background-position: 0 0;
    overflow: hidden !important;
    -webkit-animation: mhloading 10s linear infinite;
            animation: mhloading 10s linear infinite;
  }
  
@-webkit-keyframes mhloading {
    0% { background-position: 0 0;}
    100% { background-position: 100% 100%;}
}
  
@keyframes mhloading {
    0% { background-position: 0 0;}
    100% { background-position: 100% 100%;}
}

/* NU */

.workingBox {
    background-color: #fafafa;
    transition: width 0.6s ease;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem;
    animation: workingBoxStripes 3s linear infinite;
}

@keyframes workingBoxStripes {
    from { background-position: 1rem 0;}
    to { background-position: 0 0;}
}

/* BS4 Grid XXL breakpoint */

/* adding col-xxl */
.col-xxl, .col-xxl-1, .col-xxl-2, .col-xxl-3, .col-xxl-4, .col-xxl-5, .col-xxl-6, .col-xxl-7, .col-xxl-8, .col-xxl-9, .col-xxl-10, .col-xxl-11, .col-xxl-12, .col-xxl-auto {position: relative; width: 100%; padding-right: 15px; padding-left: 15px;}

@media (min-width: 1570px){
  /* expanding BS4 max-width */
    .container {max-width: 1540px;}

  /* grid columns xxl */
    .col-xxl {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%;}
    .col-xxl-auto {-webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none;}  
    .col-xxl-1 {-webkit-box-flex: 0; -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}
    .col-xxl-2 {-webkit-box-flex: 0; -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
    .col-xxl-3 {-webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
    .col-xxl-4 {-webkit-box-flex: 0; -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
    .col-xxl-5 {-webkit-box-flex: 0; -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
    .col-xxl-6 {-webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
    .col-xxl-7 {-webkit-box-flex: 0; -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
    .col-xxl-8 {-webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
    .col-xxl-9 {-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
    .col-xxl-10 {-webkit-box-flex: 0; -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
    .col-xxl-11 {-webkit-box-flex: 0; -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
    .col-xxl-12 {-webkit-box-flex: 0; -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}

  /* order xxl */
  .order-xxl-0 {-webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0;}
  .order-xxl-1 {-webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1;}
  .order-xxl-2 {-webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2;}
  .order-xxl-3 {-webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3;}
  .order-xxl-4 {-webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4;}
  .order-xxl-5 {-webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5;}
  .order-xxl-6 {-webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6;}
  .order-xxl-7 {-webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7;}
  .order-xxl-8 {-webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8;}
  .order-xxl-9 {-webkit-box-ordinal-group: 10; -ms-flex-order: 9; order: 9;}
  .order-xxl-10 {-webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10;}
  .order-xxl-11 {-webkit-box-ordinal-group: 12; -ms-flex-order: 11; order: 11;}
  .order-xxl-12 {-webkit-box-ordinal-group: 13; -ms-flex-order: 12; order: 12;}

  /* text-align xxl */
    .text-xxl-center {text-align: center!important;}
    .text-xxl-left {text-align: left!important;}
    .text-xxl-right {text-align: right!important;}  

  /* float xxl */
  .float-xxl-left {float: left!important;}
  .float-xxl-right {float: right!important;}
  .float-xxl-none {float: none!important;}

  /* display xxl */
  .d-xxl-none {display: none!important;}
  .d-xxl-inline {display: inline!important;}
  .d-xxl-inline-block {display: inline-block!important;}
  .d-xxl-block {display: block!important;}
  .d-xxl-table {display: table!important;}
  .d-xxl-table-cell {display: table-cell!important;}
  .d-xxl-table-row {display: table-row!important;}
  .d-xxl-flex {display: flex!important;}
  .d-xxl-inline-flex {display: inline-flex!important;}

  /* offsets xxl */
  .offset-xxl-1 {margin-left: 8.333333%;}
  .offset-xxl-2 {margin-left: 16.666667%;}
  .offset-xxl-3 {margin-left: 25%;}
  .offset-xxl-4 {margin-left: 33.333333%;}
  .offset-xxl-5 {margin-left: 41.666667%;}
  .offset-xxl-6 {margin-left: 50%;}
  .offset-xxl-7 {margin-left: 58.333333%;}
  .offset-xxl-8 {margin-left: 66.666667%;}
  .offset-xxl-9 {margin-left: 75%;}
  .offset-xxl-10 {margin-left: 83.333333%;}
  .offset-xxl-11 {margin-left: 91.666667%;}

  /* spacing xxl */
  .m-xxl-0{margin:0!important}.mt-xxl-0,.my-xxl-0{margin-top:0!important}.mr-xxl-0,.mx-xxl-0{margin-right:0!important}.mb-xxl-0,.my-xxl-0{margin-bottom:0!important}.ml-xxl-0,.mx-xxl-0{margin-left:0!important}.m-xxl-1{margin:.25rem!important}.mt-xxl-1,.my-xxl-1{margin-top:.25rem!important}.mr-xxl-1,.mx-xxl-1{margin-right:.25rem!important}.mb-xxl-1,.my-xxl-1{margin-bottom:.25rem!important}.ml-xxl-1,.mx-xxl-1{margin-left:.25rem!important}.m-xxl-2{margin:.5rem!important}.mt-xxl-2,.my-xxl-2{margin-top:.5rem!important}.mr-xxl-2,.mx-xxl-2{margin-right:.5rem!important}.mb-xxl-2,.my-xxl-2{margin-bottom:.5rem!important}.ml-xxl-2,.mx-xxl-2{margin-left:.5rem!important}.m-xxl-3{margin:1rem!important}.mt-xxl-3,.my-xxl-3{margin-top:1rem!important}.mr-xxl-3,.mx-xxl-3{margin-right:1rem!important}.mb-xxl-3,.my-xxl-3{margin-bottom:1rem!important}.ml-xxl-3,.mx-xxl-3{margin-left:1rem!important}.m-xxl-4{margin:1.5rem!important}.mt-xxl-4,.my-xxl-4{margin-top:1.5rem!important}.mr-xxl-4,.mx-xxl-4{margin-right:1.5rem!important}.mb-xxl-4,.my-xxl-4{margin-bottom:1.5rem!important}.ml-xxl-4,.mx-xxl-4{margin-left:1.5rem!important}.m-xxl-5{margin:3rem!important}.mt-xxl-5,.my-xxl-5{margin-top:3rem!important}.mr-xxl-5,.mx-xxl-5{margin-right:3rem!important}.mb-xxl-5,.my-xxl-5{margin-bottom:3rem!important}.ml-xxl-5,.mx-xxl-5{margin-left:3rem!important}
  .p-xxl-0{padding:0!important}.pt-xxl-0,.py-xxl-0{padding-top:0!important}.pr-xxl-0,.px-xxl-0{padding-right:0!important}.pb-xxl-0,.py-xxl-0{padding-bottom:0!important}.pl-xxl-0,.px-xxl-0{padding-left:0!important}.p-xxl-1{padding:.25rem!important}.pt-xxl-1,.py-xxl-1{padding-top:.25rem!important}.pr-xxl-1,.px-xxl-1{padding-right:.25rem!important}.pb-xxl-1,.py-xxl-1{padding-bottom:.25rem!important}.pl-xxl-1,.px-xxl-1{padding-left:.25rem!important}.p-xxl-2{padding:.5rem!important}.pt-xxl-2,.py-xxl-2{padding-top:.5rem!important}.pr-xxl-2,.px-xxl-2{padding-right:.5rem!important}.pb-xxl-2,.py-xxl-2{padding-bottom:.5rem!important}.pl-xxl-2,.px-xxl-2{padding-left:.5rem!important}.p-xxl-3{padding:1rem!important}.pt-xxl-3,.py-xxl-3{padding-top:1rem!important}.pr-xxl-3,.px-xxl-3{padding-right:1rem!important}.pb-xxl-3,.py-xxl-3{padding-bottom:1rem!important}.pl-xxl-3,.px-xxl-3{padding-left:1rem!important}.p-xxl-4{padding:1.5rem!important}.pt-xxl-4,.py-xxl-4{padding-top:1.5rem!important}.pr-xxl-4,.px-xxl-4{padding-right:1.5rem!important}.pb-xxl-4,.py-xxl-4{padding-bottom:1.5rem!important}.pl-xxl-4,.px-xxl-4{padding-left:1.5rem!important}.p-xxl-5{padding:3rem!important}.pt-xxl-5,.py-xxl-5{padding-top:3rem!important}.pr-xxl-5,.px-xxl-5{padding-right:3rem!important}.pb-xxl-5,.py-xxl-5{padding-bottom:3rem!important}.pl-xxl-5,.px-xxl-5{padding-left:3rem!important}
  .m-xxl-auto{margin:auto!important}.mt-xxl-auto,.my-xxl-auto{margin-top:auto!important}.mr-xxl-auto,.mx-xxl-auto{margin-right:auto!important}.mb-xxl-auto,.my-xxl-auto{margin-bottom:auto!important}.ml-xxl-auto,.mx-xxl-auto{margin-left:auto!important}

}