/******MainBody Tags Starts******/
/* @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); */
/* @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap"); */

@import url("https://fonts.googleapis.com/css2?family=Allura&family=Dancing+Script:wght@400..700&family=Grey+Qo&family=Playwrite+CU:wght@100..400&display=swap");
@font-face {
  font-family: "JLREmeric";
  src: url("/fonts/JLREmericWeb-Regular.woff") format("woff2");
}
@font-face {
  font-family: "JLREmericSemi";
  src: url("/fonts/JLREmericWeb-SemiBold.woff") format("woff2");
}
* {
  box-sizing: border-box;
}

body {
  font-family: "JLREmeric", sans-serif !important;
  margin: 0 !important;
  font-size: 12px !important;
  color: #000 !important;
  padding: 0 !important;
  background-color: #edf1f6 !important;
}
a {
  cursor: pointer !important;
  text-decoration: none !important;
  color: #000 !important;
}
b,
strong {
  font-family: "JLREmericSemi", sans-serif !important;
  font-weight: normal !important;
}
.fr-1 ol li strong {
  font-size: 16px;
}
.fr-1 ol {
  padding: 0;
}
.fr-1 ul {
  margin: 0;
}
.fr-1 ol li::marker {
  font-family: "JLREmericSemi", sans-serif !important;
  font-weight: normal !important;
  font-size: 16px;
}
.top-40 {
  top: 40px !important;
}
.App--Main {
  display: inline-block;
  width: 100%;
}
.Body--Main {
  padding: 0 0 0 60px;
}
.no-display {
  display: none !important;
}
.ib-display {
  display: inline-block;
}
.w-100 {
  width: 100% !important;
}
.h-100 {
  height: 100% !important;
}
.h-100.m-neg {
  position: absolute;
  top: 0;
  left: 0;
}
.w-50 {
  width: 50% !important;
}
.w-33 {
  width: 33.33% !important;
}
.w-25 {
  width: 25% !important;
}
.w-sm {
  max-width: 320px;
}
.w-sm2 {
  width: 110px !important;
}
.w-xs {
  width: 60px !important;
}
.dcc-wid {
  width: 180px;
}
.m-all0 {
  margin: 0 !important;
}
.p-all0 {
  padding: 0 !important;
}
.p-all5 {
  padding: 5px !important;
}
.p-all10 {
  padding: 10px !important;
}
.p-all4 {
  padding: 4px !important;
}
.p-lr4 {
  padding: 0 4px !important;
}
.p-lr10 {
  padding: 0 10px !important;
}
.pr-0 {
  padding-right: 0 !important;
}
.pl-0 {
  padding-left: 0 !important;
}
.pr--3 {
  padding-right: 3px !important;
}
.pr--5 {
  padding-right: 5px !important;
}
.pr--10 {
  padding-right: 10px !important;
}
.pl--10 {
  padding-left: 10px !important;
}
.pr--15 {
  padding-right: 15px !important;
}
.pr--25 {
  padding-right: 25px !important;
}
.pl--15 {
  padding-left: 15px !important;
}
.no-border {
  border: none !important;
}
.no-shadow {
  box-shadow: none !important;
}
.no-back {
  background: none !important;
}
.mr--5 {
  margin-right: 5px !important ;
}
.mt--0 {
  margin: 0 0 0 0 !important;
}
.mt--5 {
  margin: 5px 0 0 0 !important;
}
.mt--10 {
  margin: 10px 0 0 0 !important;
}
.mt--15 {
  margin: 15px 0 0 0 !important;
}
.mt--20 {
  margin: 20px 0 0 0 !important;
}
.mt--27 {
  margin: 27px 0 0 0 !important;
}
.mt--17 .btn-md {
  margin-top: 17px !important;
}
.mb--5 {
  margin: 0 0 5px 0 !important;
}
.mb--10 {
  margin: 0 0 10px 0 !important;
}
.mb--15 {
  margin: 0 0 15px 0 !important;
}
.mb--20 {
  margin: 0 0 20px 0 !important;
}
.ml--15 {
  margin-left: 15px !important;
}
.ml--20 {
  margin-left: 20px !important;
}
.rotate-180 {
  transform: rotate(180deg);
}
.rotate-90 {
  transform: rotate(90deg);
}
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.bor-bot {
  border-bottom: 1px solid #d8dde0 !important;
}
.text-underline {
  text-decoration: underline !important;
}
.text-upper {
  text-transform: uppercase;
}
.text-blue-d {
  color: #274b63 !important;
}
.z-index-up {
  z-index: 1;
}
.pt--5 {
  padding-top: 5px !important;
}
.pt--10 {
  padding-top: 10px !important;
}
.pt--15 {
  padding-top: 15px !important;
}
.pt--20 {
  padding-top: 20px !important;
}
.pb--0 {
  padding-bottom: 0px !important;
}
.pb--5 {
  padding-bottom: 5px !important;
}
.pb--10 {
  padding-bottom: 10px !important;
}
.pb--15 {
  padding-bottom: 15px !important;
}
.pb--20 {
  padding-bottom: 20px !important;
}
.reuse-color {
  color: #000 !important;
}
.max-h-350 {
  max-height: 350px !important;
}
.p-m0 p {
  margin: 0 !important;
}
select,
input,
textarea,
select option {
  font-family: "JLREmeric", sans-serif !important;
  font-size: 12px;
  border: 1px solid rgba(26, 29, 33, 0.1);
  border-radius: 6px;
  background: #fff;
  min-height: 32px;
  color: #8c8c8c;
  padding: 0 12px;
  outline: none;
  color: #1a1d21 !important;
}
select:focus,
input:focus,
textarea:focus {
  border: 1px solid rgba(36, 68, 127, 1);
  box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.15);
}
input[type="checkbox"]:focus {
  border: none !important;
  box-shadow: none !important;
}
input::placeholder,
textarea::placeholder {
  color: #8c8c8c !important;
  opacity: 1 !important;
}
button:disabled {
  opacity: 0.5;
  cursor: no-drop;
}
.min-sel {
  min-width: 120px;
}
.min-w-200 {
  min-width: 200px;
}
.descp-area {
  width: 100%;
  min-height: 350px;
  padding: 10px 10px;
}
.flex-d {
  display: flex !important;
}
.red-asteric {
  color: red;
  line-height: 15px;
}
.flex-ac {
  align-items: center;
}
.flex-as {
  align-items: flex-start;
}
.flex-ae {
  align-items: flex-end;
}
.flex-jc {
  justify-content: center;
}
.flex-js {
  justify-content: flex-start !important;
}
.flex-jis {
  justify-items: flex-start !important;
}
.flex-jis input,
.flex-jis select,
.flex-jis textarea {
  width: 100%;
}
.flex-jis .input-check {
  width: auto !important;
}
.flex-jsb {
  justify-content: space-between;
}
.flex-jse {
  justify-content: flex-end;
}
.flex-gap3 {
  gap: 3px;
}
.flex-gap5 {
  gap: 5px;
}
.flex-gap7 {
  gap: 7px;
}
.flex-gap10 {
  gap: 10px;
}
.flex-gap15 {
  gap: 15px;
}
.flex-gap20 {
  gap: 20px;
}
.flex-gap50 {
  gap: 50px;
}
.row-gap0 {
  row-gap: 0;
}
.p-relative {
  position: relative;
}
.p-absolute {
  position: absolute;
}
.top-3 {
  top: 3px;
}
.top-5 {
  top: 5px;
}
.top-10 {
  top: 10px;
}
.top-15 {
  top: 15px;
}
.top-20 {
  top: 20px;
}
.top--5 {
  top: -5px;
}
.top--10 {
  top: -10px !important;
}
.top--15 {
  top: -15px !important;
}
.top--20 {
  top: -20px !important;
}
.top--60 {
  top: -60px !important;
}
.left-0 {
  left: 0px;
}
.left-5 {
  left: 5px;
}
.left-10 {
  left: 10px;
}
.left-15 {
  left: 15px;
}
.left-20 {
  left: 20px;
}
.right-5 {
  right: 5px;
}
.right-10 {
  right: 10px;
}
.right-15 {
  right: 15px;
}
.right-20 {
  right: 20px;
}
.right--5 {
  right: -5px !important;
}
.right--10 {
  right: -10px !important;
}
.right--15 {
  right: -15px !important;
}
.right--20 {
  right: -20px !important;
}
.bold-font {
  font-family: "JLREmericSemi", sans-serif !important;
}
.grid-d {
  display: grid;
}
.grid-d-imp {
  display: grid !important;
}
.gap-01 {
  gap: 1px;
}
.fr-1 {
  grid-template-columns: 1fr;
}
.fr-11 {
  grid-template-columns: 1fr 1fr;
}
.fr-111 {
  grid-template-columns: 1fr 1fr 1fr;
}
.fr-1111 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.fr-11111 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.fr-12 {
  grid-template-columns: 1fr 2fr;
}
.fr-13 {
  grid-template-columns: 1fr 3fr;
}
.fr-1--5-3 {
  grid-template-columns: 1.5fr 3fr;
}
.fr-46 {
  grid-template-columns: 0.3fr 0.7fr;
  gap: 50px;
}
.fr-21 {
  grid-template-columns: 2fr 1fr;
}
.fr-31 {
  grid-template-columns: 3fr 1fr;
}
.fr-211 {
  grid-template-columns: 2fr 1fr 1fr;
}
.db-fr1 {
  width: 100%;
}
.db-fr11 {
  width: calc(50% - 10px);
  margin: 0 5px;
}
.db-fr111 {
  width: calc(33.33% - 10px);
  margin: 0 5px;
}
.db-fr1111 {
  width: calc(25% - 10px);
  margin: 0 5px;
}
.db-fr31 {
  width: calc(66.66% - 10px);
  margin: 0 5px;
}
.db-fr41 {
  width: calc(75% - 10px);
  margin: 0 5px;
}
.fr-row-15 {
  grid-template-rows: 1fr 4fr;
}
.auto-width {
  width: auto !important;
}
.ev-area {
  height: 80px;
}
.ev-area-lg {
  height: 80px;
}
.black-font {
  color: #000 !important;
}
.no-case {
  text-transform: none !important;
}
.w-70 {
  min-width: 70px !important;
}

/******MainBody Tags Starts******/

/**Header Starts**/
.header {
  display: flex;
  align-items: center;
  background: #fff;
  height: 55px;
  padding: 0 10px;
  z-index: 1000000000;
  justify-content: space-between;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
  /* position: relative; */
  position: sticky;
  top: 0;
}
.header--left__logo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 205px;
}
.header--menu__left {
  display: flex;
  align-items: center;
  gap: 25px;
}
.header--left__links {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 13px;
  text-transform: uppercase;
}
.header--left__links a {
  color: #fff !important;
}
.header--menu__right {
  display: flex;
  align-items: center;
  padding: 0 60px 0 0;
  gap: 20px;
}
.header--menu__right a {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: JLREmericSemi;
  color: #000 !important;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.header--menu__right a:last-child {
  margin-left: 20px;
}
.folder-inn {
  position: relative;
}
.folder-inn a {
  margin: 0 !important;
}
.floder-links {
  position: absolute;
  background: #fff;
  width: 51px;
  top: 35px;
  text-align: center;
  left: -10px;
  z-index: 100000;
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
}
.floder-links a {
  display: inline-block;
  width: 36px;
  height: 36px;
  text-align: center;
  background: #ccc;
  font-size: 8px;
  text-transform: uppercase;
  margin: 5px 0 !important;
  padding: 4px 0 0 0;
}
.floder-links a.c-1 {
  background-color: #86c745;
}
.floder-links a.c-2 {
  background-color: #fdaf17;
}
.floder-links a.c-3 {
  background-color: #f2612a;
}
.floder-links a.c-4 {
  background-color: #a436a6;
}
.floder-links a.c-5 {
  background-color: #45ad76;
}
.floder-links a.c-6 {
  background-color: #018cdd;
}
.floder-links a.c-7 {
  background-color: #175b8c;
}
.floder-links a.c-8 {
  background-color: #e8ab59;
}
.floder-links a.c-9 {
  background-color: #d1bd82;
}
.floder-links a.c-10 {
  background-color: #896fae;
}
.floder-links a.c-11 {
  background-color: #7d2c3b;
}
.floder-links a.c-12 {
  background-color: #e6927c;
}
.floder-links hr {
  margin: 0;
  height: 1px;
  border: none;
  border-top: 1px solid #f3f3f3;
}
.floder-links a span {
  display: flex;
  justify-content: center;
  margin: 2px 0 0 0;
  font-weight: 300;
  color: #fff !important;
  font-weight: 600;
}
.log-drop {
  position: relative;
}
.logout-menu {
  position: absolute;
  background: #fff;
  width: 170px;
  top: 40px;
  border: 1px solid #ccc;
  box-shadow: 0 2px 40px rgba(0, 0, 0, 0.4);
  right: 0;
}
.log-user-image {
  display: flex;
  padding: 10px;
}
.log-user-image img {
  width: 100%;
}
.setting-log {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 3px solid #cbcdce;
  padding: 3px 10px;
}
.setting-log a {
  color: #717171 !important;
  font-weight: normal;
  letter-spacing: 0;
  font-size: 13px;
}

/**Header Ends**/

/**Left Menu starts**/
.menu {
  position: fixed;
  left: 0;
  background: #274b63;
  margin: 0;
  height: 100%;
  width: 60px;
  padding: 20px 0 0 0;
  transition: all 0.3s linear;
  z-index: 100000000000;
}
.menu.hover {
  width: 270px;
  transition: all 0.3s linear;
}
.lmenu {
  margin: 0 0 41px 0;
}
.mainMenu {
  /*border-top: 1px solid #f3f3f3;*/
  display: flex;
  align-items: center;
}
.mainMenu a {
  font-size: 13px;
  padding: 0px 13px 0 17px;
  line-height: 36px;
  border-left: 3px solid #274b63;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 30px);
  position: relative;
  color: #fff !important;
}
.mainMenu a:hover {
  border-left: 3px solid #336699;
}
.subMenu {
  display: flex;
  margin: 0 0 10px 0;
  position: relative;
}
.subMenu a {
  font-size: 13px;
  line-height: 37px;
  width: 100%;
  align-items: center;
  display: flex;
  position: relative;
  color: #fff !important;
}
.lm-img {
  display: flex;
  width: 60px;
  justify-content: center;
}
.lm-img img {
  position: relative;
  left: -2px;
}
.lm-spn {
  display: flex;
  width: 0;
  overflow: hidden;
  white-space: nowrap;
  transition: all 0.3s linear;
  margin: 0 0 0 -5px;
}
.menu.hover .lm-spn {
  width: 210px;
  transition: all 0.3s linear;
}
.menu .subcat a {
  height: 24px !important;
}
.subMenu a.active {
  font-family: JLREmericSemi;
  background-color: #336699;
}

.subMenu a:hover {
  background-color: #336699;
}
.sub--menu--main {
  background: #274b63;
  max-height: calc(100vh - 85px);
  overflow-y: auto;
  overflow-x: hidden;
}
.sub--menu--main--child {
  background: #274b63;
  /* border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;*/
}
.sub-span {
  display: flex;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  padding: 0 0 0 15px;
  height: 24px;
  line-height: 14px;
  font-size: 12px;
  align-items: center;
}
.subMenu.subcat.sub-cat-l3 .sub-span {
  padding: 0 0 0 25px;
}
.sub--menu--main--child .subMenu a {
  padding-left: 38px !important;
}
.open--arrow {
  color: #fff !important;
  font-size: 18px;
  position: absolute;
  top: -2px;
  width: 20px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  right: 0;
  height: 37px;
  padding: 0;
  display: none;
  z-index: 1000;
}
.open--arrow.rotate--deg {
  transform: rotate(90deg);
  top: 0;
}
.menu.hover .open--arrow {
  display: flex;
}
.menu.hover .menu-close {
  display: inline-block;
  width: 100%;
}
.menu .menu-close {
  display: none;
  margin: 0 0 5px 0;
  padding: 0 0 0 27px;
}
.menu .menu-close a {
  display: flex;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  height: 34px;
  padding: 0 0 0 27px;
}
.menu-close .subMenu {
  margin: 0;
}
/**Left Menu Ends**/

/*Page Contents Starts*/

/*Breadcrumb Starts*/
.page--breadcrumb {
  display: flex;
  align-items: center;
  font-size: 13px;
  height: 42px;
  background: #fff;
  padding: 0 12px;
  gap: 10px;
}
.page--breadcrumb a {
  display: flex;
  align-items: center;
  color: #274b63 !important;
  gap: 5px;
  font-family: "JLREmericSemi", sans-serif !important;
  text-transform: uppercase;
}
.page--breadcrumb a:first-child {
  color: #274b63 !important;
}
.page--breadcrumb a span {
  color: #274b63 !important;
}
.bread-video {
  background: #1f3a6c;
  width: 30px;
  height: 30px;
  justify-content: center;
  border-radius: 4px;
}
/*Breadcrumb Ends*/
/*Reused classes*/
.page--data {
  display: inline-block;
  width: 100%;
  padding: 12px;
}
.shadow-section {
  display: inline-block;
  width: 100%;
  max-width: 100%;
  padding: 10px;
  /* border: 1px solid rgba(216, 221, 224, 0.6); */
  border: 1px solid rgba(26, 29, 33, 0.1);
  /* box-shadow: 0 0 3px 0 rgba(216, 221, 224, 0.4); */
  box-shadow: 0 16px 16px -12px rgba(27, 23, 65, 0.25);
  border-radius: 6px;
  background: #fff;
}
.overflow-auto {
  overflow: auto;
  max-height: calc(100vh - 220px);
  padding-bottom: 12px;
}
.overflow-auto-sm {
  max-height: calc(100vh - 345px);
}
.overflow-auto-util {
  max-height: calc(100vh - 420px);
}
.overflow-auto2 {
  overflow: auto;
  max-height: calc(100vh - 260px);
  padding-bottom: 12px;
}
.overflow-auto3 {
  overflow: auto;
  max-height: calc(100vh - 340px);
  padding-bottom: 12px;
}
.overflow-xs {
  max-height: calc(100vh - 130px);
}
.overflow-sm {
  max-height: calc(100vh - 190px);
}
.overflow-lg {
  max-height: calc(100vh - 260px);
  padding-bottom: 12px;
}
.overflow-300 {
  max-height: calc(100vh - 300px);
  padding-bottom: 12px;
}
.overflow-max-350 {
  max-height: 350px;
}
.overflow-400 {
  max-height: calc(100vh - 400px);
  padding-bottom: 12px;
}
.no-overflow {
  overflow: visible !important;
}
.hidden-overflow {
  overflow: hidden !important;
}
.overflow-auto.no-overflow {
  overflow: visible !important;
}
.pop-overflow {
  overflow: auto;
  max-height: calc(100vh - 250px);
}
.less-index-popup {
  z-index: 100000000 !important;
}
.action-last table thead tr th:last-child,
.action-last table tbody tr td:last-child {
  width: 80px !important;
}
.action-last table thead tr th.td-xxs:last-child,
.action-last table tbody tr td.td-xxs:last-child {
  width: 40px !important;
}
table.reuse-table thead tr th.td-sm,
table.reuse-table tbody tr td.td-sm {
  width: 60px !important;
}
table.sec-col-tab thead tr th.sm-th-col:nth-child(2),
table.sec-col-tab tbody tr td.sm-th-col:nth-child(2) {
  width: 40px !important;
}
table.sec-col-tab thead tr th.col-thrd:nth-child(3) {
  width: 100% !important;
  max-width: 65% !important;
}
.action-last table thead tr th.td-lg,
.action-last table tbody tr td.td-lg {
  width: 240px !important;
}
.action-last table thead tr th.td-sm,
.action-last table tbody tr td.td-sm {
  width: 60px !important;
}
.action-last table thead tr th.td-md,
.action-last table tbody tr td.td-md {
  width: 89px !important;
}
.action-last-lg table thead tr th:last-child,
.action-last-lg table tbody tr td:last-child {
  width: 150px !important;
}
.a-accord {
  padding: 6px 12px;
  font-family: JLREmericSemi;
  color: #fff !important;
  text-transform: uppercase;
  font-size: 13px;
  background: #24447f;
}
.a-accord img {
  width: 8px;
  height: auto;
}
.a-accord span {
  width: auto !important;
  padding: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
  line-height: 18px;
}
.a-accord img.rotate-90 {
  transform: rotate(90deg);
}
.com-toggle {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 15px 0 0;
}
.com-btn {
  display: flex;
  width: 44px;
  height: 22px;
  background: #eaecf0;
  border-radius: 12px;
  position: relative;
}
.disable-toggle {
  opacity: 0.6 !important;
  cursor: no-drop !important;
}
.disable-toggle2 {
  opacity: 0.2 !important;
  cursor: no-drop !important;
}
.com-btn span {
  display: flex;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 100%;
  left: 2px;
  top: 1px;
  position: absolute;
  box-shadow: 0 1px 3px 0 rgba(16, 24, 40, 0.1);
}
.com-btn.com-sel {
  background: #369;
}
.com-btn.com-sel span {
  left: auto;
  right: 2px;
}
.com-btn.com-sel2 {
  background: #369;
}
.reuse-search-input {
  background-image: url(images/icon-search.svg);
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: calc(100% - 10px) center;
  min-width: 250px;
}
.eye-drop {
  background: #fff;
  border: 1px solid rgba(216, 221, 224, 0.6);
  right: 0;
  top: 32px;
  min-width: 160px;
  border-radius: 3px;
  padding: 10px;
  display: grid;
  row-gap: 5px;
  font-size: 13px;
  max-height: 355px;
  overflow: auto;
  z-index: 111111;
}
.us-set .eye-drop {
  z-index: 1000000000;
}
.eye-drop-item span {
  white-space: nowrap;
}
.auto-width {
  width: auto !important;
}
.no-wrap {
  white-space: nowrap;
}
.highest-index {
  z-index: 2000;
}
.filter-scroll {
  max-height: 220px;
  overflow: auto;
}
.reuse-btn-md {
  background: #eeece1;
  height: 32px;
  border-radius: 3px;
  padding: 0 10px;
  font-family: JLREmericSemi;
}
.link-btn {
  color: #8c8c8c !important;
  font-family: JLREmericSemi;
  text-decoration: underline !important;
}
.link-btn-mar {
  margin-right: 10px;
}
.wrap-flex {
  flex-wrap: wrap;
}
.auto-min-width a input {
  width: auto !important;
  min-width: 250px;
}
.white-back {
  background: #fff !important;
}
.flex-1 {
  flex: 1;
}
.reuse-legend {
  display: flex;
  width: 18px;
  height: 18px;
  border-radius: 4px;
}
.legend-app-pending {
  background: #f39d2d;
}
.legend-app-overdue {
  background: #f42336;
}
.legend-overdue {
  border: 2px solid #f00;
}
.gc-drop-s {
  border: 2px solid transparent;
  padding: 0 5px;
  height: 30px;
}
.gc-drop-s:hover {
  border: 2px solid #274b63;
}
.visible-flow {
  overflow: visible !important;
}
.w-sm.visible-flow {
  overflow: visible !important;
}
.gc-drop-ab {
  z-index: 1000 !important;
  gap: 0;
  min-width: 100%;
  padding: 5px 0;
}
.gc-drop-ab a {
  padding: 5px 10px;
}
.clr-pad a {
  padding: 5px;
}
.gc-drop-ab a:hover {
  background: #f5f5f5;
}
.map-color-box {
  width: 15px;
  height: 15px;
}
.red-border {
  color: #f00 !important;
}
.stable-border {
  border: 1px solid #d8dde0 !important;
  border-radius: 3px !important;
}
.stable-border:hover {
  border: 1px solid #d8dde0 !important;
}
/* table.scrollit tbody tr td.red-border {
  color: #f00 !important;
  border-left: 2px solid #f00 !important;
  border-bottom: 2px solid #f00 !important;
  border-right: 2px solid #f00 !important;
  border-top: 2px solid #f00 !important;
} */
.txt-grey-lg {
  color: #8c8c8c;
  font-size: 12px;
}
.txt-grey {
  color: #8c8c8c;
}
.txt-blue {
  color: #369 !important;
}
.leg-milestone {
  background: #ffb3ba;
  height: 15px;
  width: 30px;
  border-bottom: 5px solid #fff;
  border-left: 5px solid #ffb3ba;
  border-right: 5px solid #ffb3ba;
}
.leg-milestone-t {
  border-bottom: 5px solid #eeece1;
}
.leg-task {
  background: #e99b03;
  height: 12px;
  width: 30px;
  border-radius: 5px;
}
.leg-completed {
  background: #e99b03;
  height: 12px;
  width: 30px;
  border-radius: 5px;
}
.leg-completed hr {
  margin: 0;
  height: 1px;
  width: 100%;
  border-top: 2px dotted green;
  opacity: 1;
}
.leg-actdate {
  background: rgb(233, 155, 3);
  height: 7px;
  width: 30px;
  box-shadow: 0px -5px 0px 0px rgba(233, 155, 3, 0.4);
}
.reuse-goback {
  color: #274b63 !important;
}
.reuse-goback a {
  color: #274b63 !important;
}
.reuse-goback span {
  color: #274b63 !important;
}
.gb-min {
  min-width: 75px;
}
.reuse-heading {
  font-size: 16px;
}
.chk-lst-input {
  width: 100%;
  max-width: 600px;
}
textarea.chk-lst-input {
  min-height: 80px;
}
.reuse-radius {
  border-radius: 3px !important;
}
.auto-max-wh {
  width: 100%;
  height: auto;
  max-width: 100%;
}
.reuse-w-13rd {
  width: 33.33%;
}
.reuse-w-400 {
  width: 400px;
}
.c-dir-w {
  width: 100%;
  max-width: 800px;
}
.reuse-w-320 {
  width: 320px !important;
}
.reuse-mw-115 {
  min-width: 115px !important;
}
.reuse-mw-120 {
  min-width: 120px !important;
}
.reuse-mw-125 {
  min-width: 125px !important;
}
.reuse-w-130 {
  width: 130px !important;
}
.reuse-w-150 {
  width: 150px;
}
.reuse-w-200 {
  width: 200px;
}
.reuse-w-260 {
  width: 260px !important;
}
.reuse-w-lg {
  width: 100%;
  max-width: 500px;
}
.fixed-layout {
  table-layout: fixed;
}
table thead tr th.reused-tdxxs,
table tbody tr td.reused-tdxxs {
  width: 70px !important;
  min-width: 70px !important;
}
table thead tr th.reused-tdxxs2,
table tbody tr td.reused-tdxxs2 {
  width: 50px !important;
  min-width: 50px !important;
}
table thead tr th.reused-tdxxs3,
table tbody tr td.reused-tdxxs3 {
  width: 25px !important;
  min-width: 25px !important;
}
table thead tr th.reused-td-white,
table tbody tr td.reused-td-white {
  width: 20px !important;
  min-width: 20px !important;
  background: #fff !important;
  border: none !important;
}
table thead tr th.reused-tdxs,
table tbody tr td.reused-tdxs {
  width: 100px !important;
  min-width: 100px !important;
}
table thead tr th.reused-tdxsv2,
table tbody tr td.reused-tdxsv2 {
  width: 110px !important;
  min-width: 110px !important;
}
table thead tr th.reused-tdxs2,
table tbody tr td.reused-tdxs2 {
  width: 130px !important;
  min-width: 130px !important;
}
table thead tr th.reused-tdxs3,
table tbody tr td.reused-tdxs3 {
  width: 144px !important;
  min-width: 144px !important;
}
table thead tr th.reused-tdsm,
table tbody tr td.reused-tdsm {
  width: 150px !important;
  min-width: 150px !important;
}
table thead tr th.reused-tdsm2,
table tbody tr td.reused-tdsm2 {
  width: 200px !important;
  min-width: 200px !important;
}
table thead tr th.reused-tdmd,
table tbody tr td.reused-tdmd {
  width: 250px !important;
  min-width: 250px !important;
}
table thead tr th.reused-tdlg,
table tbody tr td.reused-tdlg {
  width: 350px !important;
  min-width: 350px !important;
}
table thead tr th.reused-tdlg-min,
table tbody tr td.reused-tdlg-min {
  min-width: 300px !important;
}
table thead tr th.reused-tdmd-min,
table tbody tr td.reused-tdmd-min {
  min-width: 250px !important;
}
table thead tr th.reused-tdmd-min-fl,
table tbody tr td.reused-tdmd-min-fl {
  min-width: 200px !important;
}
table thead tr th.reused-tdsm-min,
table tbody tr td.reused-tdsm-min {
  min-width: 200px !important;
}
table thead tr th.reused-tdxs-min,
table tbody tr td.reused-tdxs-min {
  min-width: 100px !important;
}
table thead tr th.reused-tdsm-min2,
table tbody tr td.reused-tdsm-min2 {
  min-width: 150px !important;
}
table.ret-table thead tr th:first-child,
table.ret-table tbody tr td:first-child {
  min-width: 110px !important;
  width: 110px !important;
}
table.ret-table thead tr th:nth-child(2),
table.ret-table tbody tr td:nth-child(2) {
  min-width: 240px !important;
  width: 240px !important;
}
tr.td-para td p {
  min-width: 500px !important;
}
.td-cen-fc td:first-child {
  text-align: center;
}
/*table thead tr th.reused-tdxl,
table tbody tr td.reused-tdxl {
}
table thead tr th.reused-tdxxl,
table tbody tr td.reused-tdxxl {
} */

.row-h-34 {
  min-height: 34px;
}
.tab-area-reuse {
  border: 2px solid transparent !important;
  height: 30px !important;
}
.tab-area-reuse:hover {
  border: 2px solid #274b63 !important;
}
.h-sec-com {
  height: 350px;
}
.empty-td {
  background: #fff !important;
  padding: 0 !important;
  height: 12px !important;
}

td p {
  margin: 0 !important;
}
td select,
td input {
  padding: 0 1px !important;
}
video {
  width: 100% !important;
  height: auto;
}
.font-reg a {
  font-family: "JLREmeric", sans-serif !important;
  text-transform: none;
}
.font-reg a.font-semi {
  font-family: "JLREmericSemi", sans-serif !important;
}
.font-reg .cl-c-name {
  color: #000 !important;
  width: 160px;
}
.font-reg .cl-ot {
  width: 160px;
}
td .reuse-grid-img img {
  width: auto !important;
  height: 28px !important;
}
.xs-input {
  width: 50px;
  padding: 0 6px;
  min-height: 27px !important;
}
.xs-font {
  font-size: 9px;
}
.n-max-h {
  max-height: none !important;
}
.asteri-abs {
  color: #f42336 !important;
  right: 0;
  top: -10px;
  line-height: 10px;
  font-size: 20px !important;
  cursor: help;
}
tr:first-child .sticky-header {
  position: sticky;
  top: 0;
  z-index: 10000;
}
tr:nth-child(2) .sticky-header {
  position: sticky;
  top: 31px;
  z-index: 100;
}
.sticky-max-height {
  max-height: calc(100vh - 500px);
  min-height: 400px;
}
.border-all {
  border: 1px solid #d8dde0;
}
.cursor-p {
  cursor: pointer !important;
}
.leg-tooltip {
  background: #eeece1;
  z-index: 1000000000 !important;
  top: 45px;
  border-radius: 3px;
  padding: 10px;
  right: -10px;
  display: none;
  min-width: 200px;
}
.leg-tip-hover:hover .leg-tooltip {
  display: grid;
}
.leg-tooltip::before {
  content: "";
  position: absolute;
  top: -16px;
  right: 10px;
  transform: translateX(-50%);
  border-width: 8px;
  border-style: solid;
  border-color: transparent transparent #eeece1 transparent;
}
.hr-cont {
  margin: 10px 0;
  background: none !important;
  border: none !important;
  border-top: 1px solid #d8dde0 !important;
}
.flex-cnt .multi-ps {
  width: 100% !important;
  background: #fff;
}
.flex-cnt .multi-select {
  display: flex;
  gap: 10px;
}
.flex-cnt .multi-drop {
  top: 30px;
}
.flex-cnt .multi-drop:empty {
  display: none;
}
.sm-drop-multi .multi-select:first-child .multi-drop {
  width: 160px !important;
}
.db-table table tbody tr td,
.db-table table thead tr th {
  width: 170px !important;
}
.db-table table tbody tr td:nth-child(2),
.db-table table thead tr th:nth-child(2) {
  width: auto !important;
}
.db-table table tbody tr td:first-child,
.db-table table thead tr th:first-child {
  width: 100px !important;
}
.db-table table tbody tr td {
  text-align: right !important;
}
.db-table table tbody tr td:first-child,
.db-table table tbody tr td:nth-child(2),
.db-table table tbody tr td:nth-child(3),
.db-table table tbody tr td:nth-child(4) {
  text-align: left !important;
}
table tbody tr.inner-th td {
  min-height: 18px !important;
  height: 18px !important;
  padding: 0 !important;
}
.gap-01 span {
  background: #525252;
  height: 18px;
  align-items: center;
  color: #fff;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "JLREmericSemi";
}
.sep-col {
  border-right: 1px solid #d8dde0 !important;
  height: 32px;
}
.max-400 {
  max-width: 400px !important;
}
.dg-back {
  background-color: #525252 !important;
  height: 22px !important;
}
.ab-tr-0 {
  top: 0;
  right: 0;
}
.ab-tr-custom {
  top: 3px;
  right: 10px;
}
.right-0 {
  right: 0px !important;
}
.right-5 {
  right: 5px !important;
}
.right-10 {
  right: 10px !important;
}
.right-15 {
  right: 15px !important;
}
.right-20 {
  right: 20px !important;
}
.right-25 {
  right: 25px !important;
}
.top-0 {
  top: 0px !important;
}
.top-5 {
  top: 5px !important;
}
.top--10 {
  top: -10px !important;
}
.top-10 {
  top: 10px !important;
}
.top-15 {
  top: 15px !important;
}
.top-20 {
  top: 20px !important;
}
.top-25 {
  top: 25px !important;
}
.custom-progress {
  background: #d8dde0 !important;
  border-radius: 4px;
}
.custom-progress-completed {
  background: #98cb4a !important;
  border-radius: 4px;
  font-size: 16px;
  font-family: "JLREmericSemi";
  color: #fff;
}
.g-ex-btn .g-export {
  position: absolute;
  right: 0;
  top: 3.5px;
}
.v-overflow {
  max-height: none !important;
  height: auto !important;
  overflow-y: visible !important;
}
.v-overflow-in .overflow-auto {
  max-height: none !important;
  height: auto !important;
  overflow-y: visible !important;
}
.fcl-image img {
  height: 150px !important;
  width: auto !important;
}
/*Reused classes*/
/*Tabs Starts*/
.page--tabs {
  display: flex;
  background: #fff;
  border-radius: 2px;
  height: 46px;
  align-items: center;
  font-size: 12px;
  position: relative;
  overflow: hidden;
  padding: 10px 30px 5px 50px;
  border-bottom: 4px solid #1f3a6c;
  margin: 0 0 10px 0;
}
.page--tabs a {
  display: block;
  float: right;
  padding: 14px 10px 10px;
  background-color: #fff;
  margin-right: 46px;
  z-index: 2;
  position: relative;
  font-size: 11px;
  box-shadow: 0 0px 4px 0px rgba(0, 0, 0, 0.1);
  transition: all 250ms ease;
  text-transform: uppercase;
  color: #000 !important;
  font-family: "JLREmericSemi";
}
.page--tabs a::before,
.page--tabs a::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  height: 100%;
  width: 30px;
  background-color: #fff;
  transition: all 250ms ease;
}
.page--tabs a::before {
  right: -24px;
  transform: skew(18deg, 0deg);
  box-shadow: rgba(0, 0, 0, 0.1) 3px 2px 5px,
    inset rgba(255, 255, 255, 0.09) -1px 0;
}
.page--tabs a::after {
  left: -24px;
  transform: skew(-18deg, 0deg);
  box-shadow: rgba(0, 0, 0, 0.1) -3px 2px 5px,
    inset rgba(255, 255, 255, 0.09) 1px 0;
}
.page--tabs a.active,
.page--tabs a.active::before,
.page--tabs a.active::after {
  background-color: #1f3a6c;
  color: #fff !important;
  z-index: 3;
}
.page--tabs a:hover,
.page--tabs a:hover::before,
.page--tabs a:hover::after {
  background-color: #1f3a6c;
  color: #fff !important;
  z-index: 3;
}

/*Tabs Ends*/
/*Page Contents Ends*/

/**Loader Starts**/
.loader-overlay {
  display: flex;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000000000000;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  align-items: center;
  justify-content: center;
}
.loader-absolute {
  position: absolute;
  top: 50px;
  height: calc(100% - 50px);
}
/**Loader Ends**/

/**************Tooltip New Desing starts************/
.tooltip.bottom > .tooltip-arrow::after {
  border-bottom-color: #fff;
  border-top-width: 0;
  content: " ";
  margin-left: -10px;
  top: 1px;
}

.tooltip > .tooltip-arrow::after {
  border-width: 10px;
  content: "";
}

.tooltip > .tooltip-arrow,
.tooltip > .tooltip-arrow::after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.tooltip.bottom > .tooltip-arrow {
  border-bottom-color: rgba(0, 0, 0, 0.25);
  border-top-width: 0;
  left: 50%;
  margin-left: -11px;
  top: -11px;
}

.tooltip > .tooltip-arrow {
  border-width: 11px;
}

.tooltip > .tooltip-arrow,
.popover > .tooltip-arrow::after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.tooltip {
  background-clip: padding-box;
  background-color: #fbfbfb;
  border-color: #ccc;
  border-radius: 3px;
  border-width: 1px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  color: #444;
  padding: 0;
}

.tooltip {
  background-clip: padding-box;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  display: none;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  left: 0;
  letter-spacing: normal;
  line-height: 1.42857;
  max-width: 276px;
  overflow-wrap: normal;
  padding: 1px;
  position: absolute;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  top: 0;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  z-index: 1060;
}
.red-border {
  border: 2px solid red !important;
}
.tooltip-inner {
  background: #ffffff !important;
  color: #191919 !important;
  border-color: transparent !important;
  opacity: 1;
  border-top: 3px solid #b10933 !important;
  border-radius: 0 !important;
  margin-top: 4px;
  display: inline-block;
  padding: 10px;
  width: 100%;
  font-size: 12px;
  font-weight: 700;
}

.popover-title {
  background-clip: padding-box;
  border-bottom: 3px solid #b10933 !important;
  border-radius: 3px 3px 0 0;
  color: #000;
  padding: 2px 14px !important;
}
.tooltip.bottom .tooltip-arrow {
  left: 50% !important;
  border-bottom-color: #ccc !important;
}
.tooltip.bottom .tooltip-arrow {
  border-top-color: rgba(0, 0, 0, 0.25);
}
/**************Tooltip New Desing Ends************/

/*Help Popup*/
.popup-help {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  padding: 60px 0 0 0;
  z-index: 1000000000000;
  background: rgba(0, 0, 0, 0.4);
  overflow-y: auto;
}
.low-zindex {
  z-index: 1000000000;
}
.help-popup-display {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.help-inner {
  display: inline-block;
  width: 100%;
  max-width: 700px;
  background: #fff;
  border: 1px solid rgba(26, 29, 33, 0.1);
  height: auto;
  text-align: left;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 16px 16px -12px rgba(27, 23, 65, 0.25);
}
.lg-popup {
  max-width: 1200px;
}
.md-popup {
  max-width: 900px;
}
.sm-popup {
  max-width: 450px;
}
.sm-popup-sub {
  max-width: 550px;
}
.xs-popup {
  max-width: 300px;
}
.help-head {
  font-size: 18px;
}
.help-head h3 {
  color: #202427;
  font-size: 16px;
  font-weight: normal;
}
.popup-message {
  display: inline-block;
  width: 100%;
  color: #000;
  font-size: 14px;
  padding: 0 20px 20px 20px;
  text-align: center;
}
.popup-message a {
  color: #9e1b32 !important;
  text-decoration: underline !important;
}
.help-row {
  display: flex;
  align-items: center;
  margin: 0 0 6px 0;
}
.help-row p {
  font-size: 12px;
  color: #000;
  width: 160px;
  padding: 0 32px;
}
.flex-start {
  align-items: flex-start;
}
.flex-start p {
  margin: 20px 0 0 0;
}
.help-row input {
  border: 1px solid #ddd;
  height: 34px;
  color: #111;
  opacity: 1;
  width: 250px;
  font-size: 11px;
  padding: 6px 12px;
  outline: none;
}
.help-row textarea {
  width: 400px;
  border: 1px solid #ddd;
  font-size: 12px;
  color: #111;
  opacity: 1;
  padding: 6px 12px;
  height: 100px;
}
.drag-class {
  background: #e1e7f0;
}
.drad-drop {
  display: inline-block;
  width: 100%;
}
.drad-drop p {
  width: 100%;
  text-align: center;
}
.help-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 13px;
  margin: 15px 0 0 0;
}
.help-btns.flex-jse {
  justify-content: flex-end;
}
.help-btns.flex-jsb {
  justify-content: space-between;
}
.help-btns a,
.help-btns button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1f3a6c;
  color: #fff !important;
  min-width: 70px;
  height: 32px;
  border-radius: 3px;
  padding: 0 12px;
  line-height: 12px;
}
.help-btns button {
  border: 1px solid #369;
}
.help-btns button.btn-previous {
  border: 1px solid #d8dde0;
  background: #fff;
  color: #274b63 !important;
}
.btn-previous {
  border: 1px solid #d8dde0;
  background: #fff;
  color: #274b63 !important;
}
.help-btns a.cancel {
  background: #d8dde0;
  color: #000 !important;
}
.help-btns a.btn-enable {
  background: #d8dde0;
  color: #000 !important;
}
.help-btns a.btn-disable {
  background: #369;
  color: #fff !important;
}
.modal-task {
  max-width: 980px;
  /* max-height: calc(100vh - 120px); */
}
.uploaded-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 11px;
  margin: 10px 0 0 0;
}
.uploaded-list:empty {
  display: none !important;
}

.remove--image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100px;
  overflow: hidden;
}
.remove--image img {
  max-width: 126px;
  max-height: 126px;
}
.remove--image a {
  display: flex;
}
.remove--image a.remove-up {
  position: absolute;
  right: 0;
  top: 0;
  padding: 4px;
  background: #d8dde0;
}
@media (max-width: 768px) {
  .help-head h3 {
    font-size: 15px;
  }
}
@media (max-width: 980px) {
  .popup-help {
    padding-left: 70px;
    padding-right: 20px;
  }
}
/*Help Popup*/
.new-z-index {
  z-index: 25000000000000000000;
}

/*content Library*/
.cl-left {
  display: inline-block;
  width: 300px;
  max-width: 300px;
  padding: 0 3px 0 0;
  overflow: visible;
}
.cl-left a {
  background: rgba(216, 221, 224, 0.15);
  height: 32px;
  align-items: center;
  padding: 0 10px;
  color: #000 !important;
  margin: 0 0 2px 0;
  font-size: 14px;
}
.cl-left a.bg-dark-grey {
  background: rgba(216, 221, 224, 0.6);
}
.cl-left a.selected {
  background: #fff;
  border: 1px solid #eee;
  border-right: none;
  width: calc(100% + 4px);
  position: relative;
  z-index: 100;
}
.cl-left a.selected:first-child {
  border-top: 1px solid #eee;
}
.cl-left a span {
  overflow: hidden;
  width: 200px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.txt-ellipses {
  overflow: hidden;
  width: 200px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.block-vw {
  display: block;
  max-width: 47vw !important;
  width: auto !important;
}
.cl-right {
  display: inline-block;
  width: calc(100% - 300px);
  min-height: 200px;
  border-left: 1px solid #eee;
  padding: 0px 15px 15px 15px;
}
.cl-sec-name {
  font-size: 13px;
  border-bottom: 1px solid rgba(216, 221, 224, 0.6);
  padding: 0 0 2px 0;
  margin: 0px 0 0 0;
}
.cl-types {
  gap: 15px;
  flex-wrap: wrap;
  margin: 10px 0 20px 0;
}
.cl-types:empty {
  display: none;
}
.cl-types-btn1 {
  display: grid;
  gap: 5px;
}
.cl-type-1 {
  width: 220px;
  height: 55px;
  box-shadow: 1px 1px 5px 0px #d8dde0;
  border-radius: 6px;
  padding: 0 5px 0 10px;
}
.cl-c-name {
  font-size: 14px;
  text-transform: capitalize;
  line-height: 23px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 135px;
  display: inline-block;
}
.cl-c-name-2 {
  width: 215px;
  padding: 6px 10px 0 10px !important;
}
.cl-ot {
  color: #274b63;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 135px;
  display: inline-block;
}
.cl-type-2 {
  box-shadow: 1px 1px 5px 0px #d8dde0;
  border-radius: 6px;
  width: 220px;
}
.img-type-2 {
  overflow: hidden;
  background: #f5f5f5;
  width: 220px;
  height: 165px;
}
.img-type-2 img {
  max-width: 220px;
  max-height: 165px;
  border-radius: 0;
  width: auto;
  height: auto;
}
.cl-content {
  padding: 0 10px;
  height: 30px;
}
.cl-type-3 {
  box-shadow: 1px 1px 5px 0px #d8dde0;
  border-radius: 6px;
  width: 150px;
}
.img-type-3 {
  width: 150px;
  height: 200px;
  display: flex;
  background: #f5f5f5;
}
.img-type-3 img {
  max-width: 150px;
  max-height: 200px;
  border-radius: 0;
  width: auto;
  height: auto;
}
.grid-full select,
.grid-full input,
.grid-full textarea,
.grid-full div {
  width: 100%;
  max-width: 100%;
}
.grid-col-full {
  grid-column: auto / span 2;
}
.area-min-height {
  min-height: 80px;
  padding-top: 5px;
}
.thumb-options {
  width: 80px !important;
  min-width: 80px !important;
  height: 80px !important;
}
.thumb-options a {
  background: #369;
  color: #fff !important;
  border-radius: 3px;
}
.btn-del {
  background: #f42336 !important;
}
.input-check {
  width: auto !important;
  height: auto !important;
  min-height: 10px !important;
  accent-color: #24447f;
  background: transparent;
}
.input-check-lg {
  width: 25px !important;
  height: 25px !important;
}
.wh-18 {
  min-width: 18px !important;
  min-height: 18px !important;
}
.font-22 {
  font-size: 22px !important;
}
.font-20 {
  font-size: 20px !important;
}
.font-18 {
  font-size: 18px !important;
}
.font-16 {
  font-size: 16px !important;
}
.font-13 {
  font-size: 13px !important;
}
.font-14 {
  font-size: 14px !important;
}
.font-10 {
  font-size: 10px !important;
}
.font-11 {
  font-size: 11px !important;
}
.line-height11 {
  line-height: 11px;
}
.lbl-color {
  color: #1a1d21 !important;
}
td .input-check {
  width: 18px !important;
  height: 18px !important;
}
.align-check {
  left: 5px;
  top: 8px;
}
.cl-btn-add {
  background: #369;
  color: #fff !important;
  border-radius: 3px;
  width: 130px;
  height: 32px;
}
.link-copy {
  color: #0e374c !important;
  font-size: 12px;
}
.multi-ps {
  border: 1px solid #d8dde0;
  border-radius: 3px;
  width: 320px;
  height: 32px;
  width: auto !important;
  min-width: 250px !important;
  gap: 5px !important;
}
.drop-wid .multi-ps {
  width: auto;
}
.auto-min-width .multi-ps {
  width: auto;
  min-width: 250px;
}
.multi-ps input {
  border: none;
  border-radius: 3px;
  width: 100%;
  height: 32px;
  padding: 0 30px 0 10px;
  background: transparent;
  position: absolute;
  left: 0;
  top: 0;
  outline: none !important;
}
.multi-ps img {
  margin: 0 10px 0 0;
}
.multi-drop {
  border: 1px solid #efefef;
  width: 100%;
  max-height: 160px;
  overflow: auto;
  border-radius: 0px 0px 3px 3px;
  background: #fff;
  position: absolute;
  z-index: 100000;
}
.multi-drop.tagging-drop {
  top: auto;
  bottom: 100%;
  width: auto;
  box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.1);
}
.tagging-drop .multi-item {
  cursor: pointer;
}
.multi-item {
  padding: 8px 10px;
  border-bottom: 1px solid #efefef;
  color: #000;
  font-size: 11px;
}
.multi-item:hover {
  background: #f5f5f5;
}
.focused-item {
  background: #f5f5f5;
}
.multi-item input {
  margin: 0;
  height: auto;
  min-height: 10px;
  accent-color: #369;
  opacity: 0.4;
}
.multi-item input:checked {
  opacity: 1;
}
.share-user-drop {
  margin: 15px 0 20px 0;
}
.assign-content {
  margin: 0 0 10px 0;
}
.flex-hr {
  margin: 25px 0 20px 0;
}
.flex-hr hr {
  margin: 0;
  background: #d8dde0;
  height: 1px;
  width: 100%;
  max-width: 450px;
  border: none !important;
}
.txt-assign {
  font-size: 14px;
  margin: 0 0 15px 0;
}
.txt-assign {
  font-size: 14px;
  margin: 0 0 15px 0;
  text-transform: uppercase;
}
.assign-content .multi-ps {
  width: 325.5px;
  min-width: unset !important;
}
.txt-grp {
  text-transform: uppercase;
  margin: 0 0 5px 0;
  letter-spacing: 0.3px;
}
.assign-content .fr-211 .multi-ps {
  width: auto;
}

/*Responsive Content Library*/
@media (max-width: 1440px) {
  .db-fr1111 {
    width: calc(33.33% - 10px);
  }
}
@media (max-width: 1280px) {
  .mobile-flex-wrap2 {
    flex-wrap: wrap;
  }
  .mobile-cl-grid2 {
    display: grid;
    row-gap: 10px;
    grid-template-columns: 1fr;
  }
  .mobile-flex-jse2 {
    justify-content: flex-end;
  }
  .fr2-11 {
    grid-template-columns: 1fr;
  }
  .db-fr1111 {
    width: calc(50% - 10px);
  }
  .Info-graphs2 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
  .graphics-left {
    display: grid;
    border-bottom: 1px solid #ccc !important;
    border-right: 1px solid #ccc !important;
    padding: 20px 0 20px 0 !important;
  }
  .ret-flex-sm {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
    gap: 10px !important;
  }
  .ret-flex-sm .ret-figs {
    max-width: 100%;
  }
}
@media (max-width: 980px) {
  .mobile-flex-wrap {
    flex-wrap: wrap;
  }
  .auto-min-width .multi-ps {
    width: auto;
    min-width: 190px;
  }
  .db-fr1111 {
    width: 100%;
    margin: 0;
  }
  .fr-111 {
    grid-template-columns: 1fr 1fr;
  }
  .sm-absol {
    position: relative;
  }
  .Info-graphs2 {
    grid-template-columns: 1fr 1fr !important;
  }
  .ret-flex-sm {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 10px !important;
  }
}
@media (max-width: 768px) {
  .mobile-content {
    display: grid;
    row-gap: 30px;
  }
  .mobile-content .cl-left {
    max-width: 100%;
    width: 100%;
    padding: 0;
  }
  .mobile-content .cl-left a {
    max-width: 100%;
    width: 100% !important;
  }
  .mobile-content .cl-left a.Level-4 {
    width: calc(100% - 90px) !important;
    left: 0 !important;
  }
  .mobile-content .cl-left a.Level-3 {
    width: calc(100% - 60px) !important;
  }
  .mobile-content .cl-left a.Level-2 {
    width: calc(100% - 30px) !important;
  }
  .mobile-content .cl-right {
    padding: 0;
    border: none;
    width: 100%;
  }
  .mobile-cl-grid {
    display: grid;
    row-gap: 10px;
    grid-template-columns: 1fr;
  }
  .mobile-flex-jse {
    justify-content: flex-end;
  }
  .mobile-cl-grid .reuse-search-input {
    min-width: 190px;
  }

  .fr-11 {
    grid-template-columns: 1fr;
  }
  .fr-211 {
    grid-template-columns: 1fr;
  }
  .grid-d div:empty {
    display: none;
  }
  .grid-col-full {
    grid-column: inherit;
  }
  .help-btns .p-absolute {
    position: relative !important;
  }
  .assign-content .multi-ps {
    width: 100%;
  }
  .multi-ps {
    width: 100%;
  }
  .multi-ps input {
    padding-right: 30px;
  }
  .fr-111 {
    grid-template-columns: 1fr;
  }
  .ret-flex-sm {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
}
@media (max-width: 600px) {
  .mobile-flex-wrap,
  .mobile-flex-wrap2 {
    display: grid;
  }
  .Info-graphs2 {
    grid-template-columns: 1fr !important;
  }
  .graphics-left {
    display: grid;
    border-bottom: 1px solid #ccc !important;
    border-right: none !important;
    padding: 20px 0 20px 0 !important;
  }
  .ret-flex-sm {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}
@media (max-width: 400px) {
  .mobile-flex-jse2 {
    flex-wrap: wrap;
    column-gap: 5px;
  }
  .mobile-flex-jse2 .com-toggle {
    margin: 0;
  }
  .reuse-search-input {
    min-width: 100%;
  }
}
/*Responsive Content Library*/

/*content Library*/

/*Project Library*/
.Level-1 {
  border: none !important;
  background: #c4c4c4 !important;
}
.Level-2 {
  border: none !important;
  background: #d8dde0 !important;
}
.Level-3 {
  border: none !important;
  background: #eeece1 !important;
}
.rotate-close {
  transform: rotate(-180deg);
}
.a-accord .rotate-open {
  transform: rotate(-90deg);
}
.a-accord .rotate-close {
  transform: rotate(90deg);
}
.cl-left .Level-1 {
  width: 100% !important;
  float: right;
}
.cl-left .Level-2 {
  width: calc(100% - 30px) !important;
  float: right;
}
.cl-left .Level-3 {
  width: calc(100% - 60px) !important;
  float: right;
}
.cl-left .Level-4 {
  width: calc(100% - 90px) !important;
  float: right;
  left: 4px;
}
.cl-left .Level-4.selected {
  border-left: 1px solid #eee;
  width: calc(100% - 86px) !important;
}
.mst-check input {
  accent-color: #274b63;
  min-height: 10px !important;
}
/*Project Library*/
/*Actions Required Starts*/
.btns-notify {
  gap: 15px;
  flex-wrap: wrap;
}
.btns-notify a {
  display: flex;
  align-items: center;
  background: #f5f5f5;
  padding: 0px 12px;
  height: 36px;
  border: 2px solid rgba(82, 82, 82, 0.4);
  border-radius: 3px;
  font-size: 14px !important;
  color: rgba(82, 82, 82, 0.4) !important;
  font-weight: 500;
  position: relative;
  justify-content: center;
  text-align: center;
  line-height: 14px;
}
.btns-notify a.n-all-selected,
.btns-notify a.n-unread-selected,
.btns-notify a.n-flag-selected {
  background: #0e374c;
  color: #fff !important;
  border: 2px solid #0e374c;
}
.notify-count {
  display: flex;
  width: 22px;
  height: 22px;
  position: absolute;
  background: #ef5050;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  font-size: 12px;
  color: #fff;
  line-height: 12px;
  right: -10px;
  top: -10px;
}
.notify-head {
  min-width: 18px;
  min-height: 18px;
  right: -5px;
  top: -10px;
  font-family: JLREmericSemi !important;
  font-size: 9px;
  letter-spacing: -0.5px;
  width: auto;
  height: auto;
  padding: 2px 2px 0;
}
.btns-notify a.n-approvals-selected {
  background: #336699;
  color: #fff !important;
  border: 2px solid #336699;
}
.n-approvals-selected {
  background: #336699;
  color: #fff !important;
  border: 2px solid #336699;
}
.btns-notify a.n-credit-selected {
  background: #d2aa87;
  color: #fff !important;
  border: 2px solid #d2aa87;
}
.n-credit-selected {
  background: #d2aa87;
  color: #fff !important;
  border: 2px solid #d2aa87;
}
.btns-notify a.n-exceptions-selected {
  background: #e8ab59;
  color: #fff !important;
  border: 2px solid #e8ab59;
}
.n-exceptions-selected {
  background: #e8ab59;
  color: #fff !important;
  border: 2px solid #e8ab59;
}
.btns-notify a.n-chold-selected {
  background: #525252;
  color: #fff !important;
  border: 2px solid #525252;
}
.n-chold-selected {
  background: #525252;
  color: #fff !important;
  border: 2px solid #525252;
}
.btns-notify a.n-invoices-selected {
  background: #b9e8f1;
  color: #fff !important;
  border: 2px solid #b9e8f1;
}
.n-invoices-selected {
  background: #b9e8f1;
  color: #fff !important;
  border: 2px solid #b9e8f1;
}
.btns-notify a.n-requests-selected {
  background: #a6c3c1;
  color: #fff !important;
  border: 2px solid #a6c3c1;
}
.n-requests-selected {
  background: #a6c3c1;
  color: #fff !important;
  border: 2px solid #a6c3c1;
}
.btns-notify a.n-targets-selected {
  background: #d1bd82;
  color: #fff !important;
  border: 2px solid #d1bd82;
}
.n-targets-selected {
  background: #d1bd82;
  color: #fff !important;
  border: 2px solid #d1bd82;
}
.btns-notify a.n-actuals-selected {
  background: #8c8c8c;
  color: #fff !important;
  border: 2px solid #8c8c8c;
}
.n-actuals-selected {
  background: #8c8c8c;
  color: #fff !important;
  border: 2px solid #8c8c8c;
}

.btns-notify a.ntfy-selected {
  color: #fff !important;
}

.ntfy-selected.notify-type {
  color: #fff !important;
}

.notify-main {
  border-radius: 3px;
  padding: 10px;
  border: 1px solid rgba(216, 221, 224, 0.6);
  box-shadow: 0 0 3px 0 rgba(216, 221, 224, 0.4);
  max-height: calc(100vh - 220px);
  overflow: auto;
}
.notify-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  font-size: 13px;
  padding: 0 10px;
  line-height: 13px;
}
.notify-row:nth-child(2n + 1) {
  background: #f5f5f5;
}
.notify-type {
  display: flex;
  width: 130px;
  height: 30px;
  border-radius: 3px;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 500;
}
.notify-time {
  display: flex;
  align-items: center;
  color: #c4c4c4;
  font-weight: 500;
  gap: 5px;
  min-width: 215px;
}
.n-flex-left {
  gap: 20px;
  width: calc(100% - 310px);
}
.n-flex-right {
  gap: 15px;
  width: 18%;
  min-width: 310px;
  justify-content: flex-end;
}
.title-quarter,
.title-retailer {
  color: #000 !important;
}
.title-notify {
  width: 85%;
  color: #000 !important;
}
.notify-Bold {
  font-family: "JLREmericSemi" !important;
}
.notify-drop {
  border: 2px solid #d8dde0;
  border-radius: 8px;
  padding: 10px;
  box-shadow: 0 12px 16px -4px rgba(232, 171, 89, 0.08);
  position: absolute;
  right: 0;
  width: auto;
  min-width: 550px;
  background: #fff;
  top: 30px;
}
.drop-btns-read {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 15px 0;
}
.drop-btns-read a {
  display: flex;
  color: #0e374d !important;
  text-transform: none;
  font-family: JLREmericSemi !important;
  border: 1px solid #d8dde0;
  border-radius: 5px;
  height: 32px;
  padding: 0 8px;
  font-size: 13px;
  letter-spacing: 0;
}
.drop-btns-read a.n-btn-unread {
  background: #0e374d !important;
  color: #fff !important;
  border: 1px solid #0e374d;
}
.n-drop-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  height: 32px;
  padding: 0 10px;
}
.n-drop-row:nth-child(2n + 1) {
  background: #f5f5f5;
}
.hideElement {
  display: none !important;
}
.drop-display-text {
  font-weight: normal !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 12px !important;
  font-family: JLREmeric !important;
}
.notify-Bold .drop-display-text {
  font-family: JLREmericSemi !important;
}
.a-req-btn {
  padding: 0 9px !important;
}
@media (max-width: 980px) {
  .notify-drop {
    width: calc(100% - 80px);
    position: fixed;
    z-index: 10000;
    left: 70px;
    top: 56px;
    min-width: 100px;
    padding: 5px;
  }
  .drop-display-text {
    font-size: 10px !important;
    line-height: 10px;
  }
  .n-drop-row {
    padding: 0 5px;
  }
  .notify-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .n-flex-left {
    width: 100%;
    margin: 5px 0 0 0;
  }
  .n-flex-right {
    width: 100%;
    margin: 0 0 5px 0;
  }
}
@media (max-width: 600px) {
  .n-flex-left {
    display: grid !important;
    grid-template-columns: 1fr;
    justify-content: center;
    justify-items: center;
  }
  .title-notify {
    width: 100%;
    text-align: center !important;
  }
  .n-flex-right {
    justify-content: center;
    min-width: 100px;
  }
  .n-flex-right img {
    height: 15px;
    width: auto;
  }
  .notify-time {
    min-width: 100px;
    font-size: 10px;
  }
}
/*Actions Required Ends*/

/*Reuseable table starts*/
.reuse-table {
  border-collapse: collapse;
  width: 100%;
  border: 1px solid #ddd;
  border-top: none;
  border-left: none;
  min-width: 100%;
}
.reuse-table thead tr th {
  background: #1f3a6c;
  color: #fff !important;
  font-weight: normal;
  font-family: "JLREmericSemi";
  height: 32px;
  padding: 0 5px;
  border-right: 1px solid #fff;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  font-size: 10px;
  text-align: center;
  border-bottom: 1px solid #fff;
  line-height: 12px;
}
.reuse-table.reuse-sm-table thead tr th {
  font-size: 9px;
}
.reuse-table tbody tr td {
  font-weight: normal;
  height: 32px;
  padding: 0 5px;
  border-right: 1px solid #ddd;
  font-size: 11px;
  border-bottom: 1px solid #ddd;
}
.reuse-table.reuse-sm-table tbody tr td {
  font-size: 9px;
}
.reuse-table.reuse-sm-table tbody tr td input,
.reuse-table.reuse-sm-table tbody tr td select {
  font-size: 10px;
}
td h1 {
  font-size: 15px;
  font-family: JLREmericSemi !important;
  margin: 0 !important;
}
td h2 {
  font-size: 13px;
  font-family: JLREmericSemi !important;
  margin: 0 !important;
}
td h1 strong {
  font-weight: normal !important;
}
td h2 strong {
  font-weight: normal !important;
}
td em {
  font-size: 9px !important;
}
.reuse-table tbody tr td:first-child {
  border-left: 1px solid #ddd;
}
.reuse-table tbody tr:nth-child(2n + 1),
.reuse-table tbody tr:nth-child(2n + 1) td {
  background: #fafafa;
}
td input,
td select {
  border: 2px solid transparent !important;
  width: 100% !important;
  border-radius: 0 !important ;
  color: #000;
  background: transparent !important;
  min-height: 30px;
}
td input:hover,
td select:hover {
  border: 2px solid #1f3a6c !important;
}
.area-fcl {
  height: 32px !important;
  min-height: 32px !important;
  border: 2px solid transparent;
  padding: 2px 5px;
  width: 100% !important;
}
.area-fcl:hover {
  border: 2px solid #274b63 !important;
}
.reuse-table thead tr th.com-toggle-w,
.reuse-table tbody tr td.com-toggle-w {
  width: 100px !important;
}
/*Reuseable table ends*/

/*Reusable toggle*/
.reuse-toggle {
  border: 1px solid #d8dde0;
  border-radius: 3px;
}
.reuse-toggle a {
  font-weight: normal;
  color: #1f3a6c !important;
  text-transform: none;
  height: 32px;
  padding: 0 12px;
  border-radius: 3px;
  min-width: 70px;
  font-family: JLREmericSemi;
}
.reuse-toggle a.selected {
  background: #1f3a6c;
  color: #fff !important;
}
.reuse-toggle a:first-child {
  border-radius: 3px 0 0 3px;
}
.reuse-toggle a:last-child {
  border-radius: 0 3px 3px 0;
}
.toggle-space a {
  border-radius: 3px !important;
  border: 1px solid #d8dde0;
}
.toggle-space a.selected {
  border: 1px solid #274b63 !important;
}
/*Reusable toggle*/

/*Reusable button with icon*/
.btn-md {
  background: #1f3a6c;
  width: 34px;
  height: 32px;
  border-radius: 8px;
}
.btn-select {
  background: #1f3a6c;
  width: 34px;
  height: 32px;
  border-radius: 3px;
  border: 1px solid #1f3a6c;
}
.btn-un-select {
  border: 1px solid #d8dde0;
  background: no-repeat;
}
.btn-remove-props {
  border: none;
  background: no-repeat;
  padding: 0;
}
/*Reusable button with icon*/

/*Group Management starts*/
.user-tag {
  background: #d8dde0;
  padding: 4px 8px;
  border-radius: 3px;
  gap: 5px;
  width: auto !important;
}
.user-tag button {
  display: flex;
  background: none;
  border: none;
  padding: 0;
}
.user-tag button:disabled {
  opacity: 0.5;
}
.user-tag span {
  white-space: nowrap;
}
.show-more-tags {
  max-width: calc(100% - 100px);
  overflow: hidden;
}
/*Group Management ends*/

/*Gantt Chart */

.gantt-chart {
  display: flex;
  flex-direction: column;
}

.sub-task {
  margin-left: 20px;
  background-color: rgb(150, 173, 35);
  border-radius: 2px;
  border: 0.2px solid black;
  color: white;
}

.task-name {
  margin-right: 10px;
}

.days {
  display: flex;
  width: 10px;
}

.arrow {
  border: solid gray;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}
.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.maindiv {
  display: inline-block;
  width: 100%;
  position: relative;
  height: 15px;
}
.taskdiv {
  display: inline-block;
  height: 13px;

  background-color: rgb(235, 203, 166);
  border-left: 5px solid rgb(235, 203, 166);
  border-right: 5px solid rgb(235, 203, 166);
  border-bottom: 5px solid rgb(255, 255, 255);

  position: relative;
}
.current-date-line {
  position: absolute;
  top: 0;
  bottom: 0;

  z-index: 1000; /* Ensure the line appears above other elements */
}

.dots_line {
  position: relative;
  z-index: 10002;

  height: 1px;
  margin-top: 4px;
  border-top: 2px dotted green;
}
.subtaskdiv {
  display: inline-block;

  background-color: rgb(143, 178, 189);
}
.task_divbackground {
  position: absolute;

  height: 10px;
  z-index: 10000;
  top: 0px;
  opacity: 0.4;
}
.subtask_divbackground {
  position: absolute;
  background: rgb(143, 178, 189);
  height: 10px;
  z-index: 10000;
  top: 2px;
  opacity: 0.6;
}
.scrollit {
  overflow: scroll;
}

.horizon {
  position: absolute;
  left: 0;
  width: 1px;
  height: 1px;
  background: red;
  top: 11px;
}
.vertical {
  position: relative;
  top: 11px;
  width: 1px;
  height: 10px;
  color: rgb(255, 0, 0);
}
.bg-red,
tr:nth-child(2n + 1) td.bg-red {
  background-color: #f42336 !important;
}
.bg-orange,
tr:nth-child(2n + 1) td.bg-orange {
  background-color: #f39d2d !important;
}
.c-red {
  color: #f42336 !important;
}
.bg-red:empty {
  display: none !important;
}
.bg-green,
tr:nth-child(2n + 1) td.bg-green {
  background-color: #98cb4a !important;
}
.c-green {
  color: #98cb4a !important;
}
.bg-yellow,
tr:nth-child(2n + 1) td.bg-yellow {
  background-color: #f7d842 !important;
}
.c-yellow {
  color: #f7d842 !important;
}
.c-orange {
  color: #f39d2d !important;
}
.bg-green:empty {
  display: none !important;
}
.bg-grey {
  background-color: #ddd !important;
}
.bg-amber {
  background-color: #f7d842 !important;
}
.arrows {
  position: absolute;
  top: 10px;
  height: 10px;
  width: 5px;
}
/* .arrow_down {
    border: solid black;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
    top: 10px;
    left: 5px;
    position: relative;
  } */
.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.arrowdiv {
  display: inline-block;
  position: absolute;
  height: 15px;
  z-index: 8000000;
}
.task-row {
  height: 20px;
}

.task-name {
}

.scrollit td {
  min-width: 100px !important;
  width: auto !important;
}
.scrollit td.td-width:first-child,
.scrollit td.td-width:nth-child(2),
.scrollit td.td-width:nth-child(3),
.scrollit td.td-width:nth-child(4),
.scrollit td.td-width:nth-child(5) {
  width: 85px !important;
  min-width: 85px !important;
  max-width: 85px !important;
}
.scrollit th.td-width:first-child,
.scrollit th.td-width:nth-child(2),
.scrollit th.td-width:nth-child(3),
.scrollit th.td-width:nth-child(4),
.scrollit th.td-width:nth-child(5) {
  width: 85px !important;
  min-width: 85px !important;
  max-width: 85px !important;
}
.Down_Arrow {
  border: solid red;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-left: -3px;
}
.Down_Arrow_SubTask {
  border: solid gray;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-left: -1px;
}
.Right_Arrow_SubTask {
  border: solid gray;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  margin-left: -5px;
}
.Right_Arrow_Task {
  border: solid red;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  margin-left: -3px;
}
.starttostarttask {
  z-index: 8000000 !important;
}
.starttostart {
  z-index: 8000000 !important;
}
table.scrollit thead tr th,
table.scrollit tbody tr td {
  border: 1px solid #ddd !important;
  font-size: 10px;
  min-width: 80px !important;
  padding: 5px 3px !important;
  width: auto !important;
}
table.scrollit thead tr:first-child th {
  position: sticky;
  top: -1px !important;
}
table.scrollit thead tr:nth-child(2) th {
  top: 30px !important;
}
table.scrollit thead tr:first-child th:first-child {
  border: none !important;
}
table.scrollit tbody tr td {
  font-size: 11px;
}
table.scrollit thead tr th:first-child,
table.scrollit tbody tr td:first-child {
  width: 200px;
  min-width: 250px !important;
  position: sticky;
  left: 0;
  top: 0;
  z-index: 10000000;
}
.section-table table.scrollit tbody tr td.td-width:first-child,
.section-table table.scrollit thead tr th.td-width:first-child {
  min-width: 0px !important;
  width: 250px !important;
  max-width: 250px !important;
}
table.scrollit tbody tr td:first-child {
  background: #fff !important;
  min-width: 315px !important;
}
table.scrollit tbody tr:nth-child(2n + 1) td:first-child {
  background: #fafafa !important;
}
table.scrollit thead tr th {
  background: #369 !important;
  color: #fff !important;
  position: sticky;
  top: 0;
  z-index: 100000000;
  font-family: "JLREmericSemi", sans-serif !important;
  font-weight: normal;
}
table.scrollit thead tr:nth-child(2) th {
  top: 31px;
}
table.scrollit thead tr th.white-back {
  background: #fff !important;
  border: none !important;
}
table.scrollit thead tr th:first-child {
  position: sticky;
  top: 0;
  z-index: 1000000000;
}
table.scrollit thead tr:nth-child(2) th:first-child {
  top: 31px;
}
table.scrollit tbody tr td {
  border-right: 1.5px solid #ddd !important;
}
.scrollit.reuse-table.less-index-table thead tr th:first-child {
  z-index: 100000 !important;
  border: 1px solid #ddd !important;
}
.scrollit.reuse-table.less-index-table tbody tr td:first-child {
  z-index: 10000 !important;
}
.scrollit.reuse-table.less-index-table thead tr th {
  z-index: 100000 !important;
}
.scrollit.reuse-table.less-index-table thead tr th:nth-child(2),
.scrollit.reuse-table.less-index-table tbody tr td:nth-child(2) {
  width: 160px !important;
  min-width: 160px !important;
}
.section-table {
  overflow: auto;
  width: 100%;
  max-height: calc(100vh - 120px);
}
.padd-all10 {
  padding: 10px;
}
.flex-items {
  display: flex;
  align-items: center;
  gap: 10px;
}
.td-toggle {
  display: flex;
  width: 18px;
  height: 18px;
  background: #1f3a6c;
  color: #fff !important;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 0px;
  padding: 0 0 3px 0;
  border-radius: 2px;
  cursor: pointer;
}
.th-toggle {
  color: #369 !important;
  background: #fff !important;
  font-weight: normal !important;
  position: absolute;
  left: 4px;
  top: 6.5px;
}
.task-td {
  cursor: pointer;
}
.task-td.td-width {
  text-indent: 30px;
}
.task-td.td-width.indent-0 {
  text-indent: 0 !important;
}
.leg-min-w {
  min-width: 25px;
}
.btns-time {
  display: flex;
  justify-content: flex-end;
  padding: 0;
  gap: 10px;
}
.btns-time a {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  color: rgb(39, 75, 99) !important;
  font-size: 15px;
  line-height: 15px;
  font-family: JLREmericSemi;
  width: 32px;
  border-radius: 100%;
  background: #fff;
  box-shadow: 0 4px 4.3px 0 rgba(0, 0, 0, 0.15);
  border: 1px solid #b9e8f1;
}
.btns-time a:hover {
  background: #274b63;
  color: #fff !important;
  border: none;
}
.btns-time a.selected {
  background: #274b63;
  color: #fff !important;
  border: none;
}
.btns-time a.btn-exp-pdf {
  background: #274b63;
  color: #fff !important;
}
.taskdivprojectlist {
  border-radius: 5px;
  position: relative;
}
table tbody tr td.indent-padd {
  padding: 0 0 0 15px !important;
}
table tbody tr td.indent-padd-2 {
  padding: 0 0 0 35px !important;
}
.ev-cross {
  background: #ccc;
  width: 15px;
  height: 15px;
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ev-crosssm {
  width: 10px;
  height: 10px;
}
.file-icons img {
  height: 50px;
  width: auto;
}
.files-iconsm img {
  height: 26px !important;
  width: auto;
}
.file-icons-lg img {
  height: 150px;
  width: auto;
}
.grid-lg-img {
  width: 100% !important;
}
.grid-lg-img img {
  width: 100% !important;
  height: auto !important;
  max-width: 200px !important;
}
.file-icons-lg img.file-icons-xlg {
  height: auto !important;
  width: 100% !important;
  max-width: 400px !important;
}
.ev-ico-hst {
  margin: -18px 0 0 0;
  top: -20px;
}
.shadow-grey-box {
  background-color: #f5f5f5 !important;
  border: 1px solid #f5f5f5 !important;
}
.shadow-grey-box textarea {
  padding: 5px 12px !important;
}

table.scrollit thead tr th.gantt-th {
  padding: 0 3px !important;
}
table.scrollit thead tr th.gantt-th .gantt-chart-span {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-right: 1px solid white;
  padding: 0 !important;
}
/*Gantt Charts*/

/**Chat Starts**/

/**Left Menu Starts**/
.msg-main {
  display: grid;
  grid-template-columns: 1fr;
}
.msg--menu {
  background: #303338;
  border-right: 0.3px solid #000;
  height: calc(100vh - 44px);
  display: none;
}
.white--theme .msg--menu {
  background: #eee;
  border-right: 0.3px solid #ccc;
}
.msg--menu__head__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
  height: 33px;
  border-bottom: 0.3px solid #000;
  font-weight: 500;
}
.white--theme .msg--menu__head__content {
  border-bottom: 0.3px solid #ccc;
}
.msg--menu__ctg {
  margin: 10px 0 0 0;
  font-size: 14px;
  color: #9a9a9b;
}
.white--theme .msg--menu__ctg {
  color: #707070;
}
.msg--menu__ctg__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
  height: 35px;
}
.msg--menu__ctg__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px 0 23px;
  height: 28px;
  cursor: pointer;
  border-right: none;
  font-size: 12px;
}
.msg--menu__ctg__inner.msg--menu.LeftSelectedClass {
  background: #292b2f !important;
  color: #fff;
}
.white--theme .msg--menu__ctg__inner.msg--menu.LeftSelectedClass {
  background: #ddd !important;
  color: #000;
}
.msg--menu__ctg__top.CategoryLeftSelectedClass {
  background: #292b2f !important;
  color: #fff;
}
.white--theme .msg--menu__ctg__top.CategoryLeftSelectedClass {
  background: #ddd !important;
  color: #000;
}
.msg--menu__ctg__inner .ctg--grey {
  display: flex;
}
.msg--menu__ctg__inner .ctg--white {
  display: none;
}
.msg--menu__ctg__inner:hover {
  background-color: #292b2f !important;
  color: #fff;
}
.white--theme .msg--menu__ctg__inner:hover {
  background-color: #ddd !important;
  color: #000;
}
.msg--menu__ctg__inner:hover .ctg--white {
  display: flex;
}
.msg--menu__ctg__inner:hover .ctg--grey {
  display: none;
}
.msg--menu__ctg__inner.msg--menu__selected .ctg--white {
  display: flex;
}
.msg--menu__ctg__inner.msg--menu__selected .ctg--grey {
  display: none;
}
.ctg--top__lt {
  display: flex;
  align-items: center;
  width: 100%;
  cursor: pointer;
}
.ctg--top__rt {
  position: relative;
  cursor: pointer;
}
.ctg--top__rt.ctg--top__rt__set {
  display: flex;
  width: 14px;
  height: 14px;
}
.ctg--top__rt img {
  width: 12px;
  height: 12px;
}
.top__lt__fst {
  display: flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  margin: 0 10px 0 0;
}
.msg--menu__ctg__inner .top__lt__fst img {
  width: 13px;
  height: 14px;
}
.ctg--top__lt span {
  font-weight: 500;
}
.msg--menu__ctg__inner .ctg--top__lt span {
  font-weight: 400;
}
.msg--menu__ctg__inner .top__lt__fst {
  margin: 0 8px 0 0;
}
.msg--menu__chat {
  display: flex;
  align-items: center;
  padding: 0 15px;
  height: 35px;
  font-weight: 500;
  cursor: pointer;
}
.msg--menu__chat:hover {
  background-color: #292b2f;
  color: #fff;
}
.white--theme .msg--menu__chat:hover {
  background-color: #ddd;
  color: #000;
}
.msg--menu__selected {
  background-color: #2152a0 !important;
  color: #fff;
}
.msg--menu__chat__user {
  display: flex;
  width: 22px;
  height: 22px;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  overflow: hidden;
  background: #e50d4b;
  margin: 0 15px 0 0;
}
.msg--menu__chat__user img {
  max-width: 22px;
  max-height: 22px;
  width: auto;
  height: auto;
  border-radius: 100%;
}
.msg--menu__chat__user span {
  font-size: 10px;
  font-weight: 600;
  color: #fff;
}
.white--theme .msg--menu__chat__user span {
  color: #000;
}
/**Left Menu Ends**/

/**Chat body Starts**/
.msg--body {
  display: flex;
}
.msg--body__lt {
  width: 100%;
}
.msg--body__lt.msg--body__lt__sm {
  max-width: calc(100% - 300px);
}
.msg--body__lt.msg--body__rt {
  width: 300px;
  border-left: 1px solid #000;
}
.white--theme .msg--body__lt.msg--body__rt {
  border-left: 1px solid #ccc;
}
.msg--body__lt__head {
  display: flex;
  height: 33px;
  border-bottom: 0.3px solid #000;
  align-items: center;
  padding: 0 15px;
  display: none;
}
.white--theme .msg--body__lt__head {
  border-bottom: 0.3px solid #ccc;
}
.msg--body__messages {
  height: calc(100vh - 267px);
  position: relative;
}
.pricing--chat .msg--body__messages {
  height: 397px;
}
.msg--body__messages__chats {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  max-height: calc(100vh - 270px);
}
.pricing--chat .msg--body__messages__chats {
  max-height: 400px;
}
.msg--body__messages__chats__scroll {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 120px;
  max-height: calc(100vh - 390px);
  overflow: auto;
}
.pricing--chat .msg--body__messages__chats__scroll {
  max-height: 280px;
}
.msg--body__user {
  display: flex;
  align-items: center;
}
.msg--body__user__wrap {
  display: flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  overflow: hidden;
  background: #e50d4b;
}
.msg--body__user__img {
  max-width: 22px;
  max-height: 22px;
  width: auto;
  height: auto;
  border-radius: 100%;
}
.msg--body__initials {
  font-size: 10px;
  font-weight: 600;
}
.msg--body__initials {
  font-size: 10px;
  font-weight: 600;
}
.msg--body__name {
  font-weight: 600;
  margin: 0 0 0 10px;
}
.msg--body__type {
  display: flex;
  position: relative;
  width: 100%;
  padding: 0 15px;
}
.msg--body__type textarea {
  border: 1px solid #ddd;
  resize: none;
  border-radius: 5px 5px 0 0;
  width: 100%;
  min-height: 70px;
  height: 70px;
  color: #000;
  font-size: 12px;
  letter-spacing: 0;
  font-family: "Poppins", sans-serif;
  padding: 37px 50px 10px 50px;
  overflow: hidden;
  outline: none !important;
  border-bottom: none;
  box-shadow: none !important;
}
.white--theme .msg--body__type textarea {
  background: #ddd;
  border: 1px solid #ddd;
  color: #000;
}
.msg--body__attachment {
  position: absolute;
  left: 30px;
  display: flex;
  top: 32px;
  z-index: 100;
}
.msg--body__date_sepr {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 400;
  color: #9a9a9b;
  position: relative;
  padding: 0 15px;
  margin: 20px 0;
}
.white--theme .msg--body__date_sepr {
  color: #707070;
}
.msg--body__date_sepr {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 400;
  color: #8c8c8c;
  position: relative;
  padding: 0 15px;
  margin: 20px 0;
}
.msg--body__date_sepr span {
  position: relative;
  z-index: 100;
  background: #fff;
  padding: 0 15px;
}
.white--theme .msg--body__date_sepr span {
  background: #f5f5f5;
}
.msg--body__date_sepr hr {
  position: absolute;
  left: 15px;
  width: calc(100% - 30px);
  margin: 0;
  border-width: 0px;
  z-index: 99;
  border-color: #fff;
  background: #ccc;
  height: 1px;
}
.msg--body__post__chat {
  padding: 4px 15px;
  margin: 0 0 10px 0;
  position: relative;
}
/* .msg--body__post__chat:hover {
  background-color: #f5f5f5;
}
.white--theme .msg--body__post__chat:hover {
  background-color: #eee;
} */
.post__chat__name__time {
  display: flex;
  font-size: 12px;
  font-family: JLREmericSemi;
  align-items: center;
  width: 100%;
}
.msg--body__post.reverse-row .post__chat__name__time {
  flex-direction: row-reverse;
}
.msg--body__post.reverse-row .post__chat__message {
  margin: 0 10px 0 0;
}
.msg--body__post.reverse-row .post__chat__main__message {
  flex-direction: row-reverse;
}
/* .msg--body__post.reverse-row .post__chat__message__text {
  display: flex;
  justify-content: flex-end;
} */
.msg--body__post.reverse-row .message-attachment {
  justify-content: flex-end;
  padding: 10px 0 0 0;
}
.post__chat__user {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  overflow: hidden;
  background-color: #d8dde0;
}
.post__chat__user img {
  max-width: 30px;
  max-height: 30px;
  width: auto;
  height: auto;
  border-radius: 100%;
}
.post__chat__message {
  margin: 0 0 0 10px;
}
.post__chat__time {
  font-weight: 400;
  color: #9a9a9b;
  margin: 0 0 0 10px;
}
.post__chat__main__message {
  display: flex;
  font-size: 12px;
  font-weight: 400;
  align-items: center;
}
.post__chat__message__time {
  display: flex;
  width: 40px;
}
.post__chat__message__time:empty {
  display: none;
}
.post-bubble {
  background: #eeece1;
  display: inline-block;
  max-width: calc(100% - 40px);
  margin: 0 0 0 40px;
  padding: 10px 10px 4px 10px;
  border-radius: 0 10px 10px 10px;
  position: relative;
}
.reverse-row .post-bubble {
  background: #d6edf6;
  display: inline-block;
  max-width: calc(100% - 40px);
  margin: 0 40px 0 0px;
  padding: 10px 10px 0px 10px;
  border-radius: 10px 0px 10px 10px;
}
.reverse-row .bubble-flex {
  display: flex;
  justify-content: flex-end;
}
.edited--message {
  width: 12px;
  height: 12px;
  margin: -1px 10px 0 0px;
  opacity: 0.5;
}
.post__chat__message__text {
  /* max-width: calc(100% - 40px); */
  white-space: pre-line;
}
.message-attachment {
  display: flex;
  padding: 10px 0 0 0;
  gap: 8px;
}
.message-attachment:empty {
  display: none;
}
.message-attachment a {
  /* background: #d6edf6;
  border-radius: 8px; */
  height: 90px;
  align-items: center;
  display: flex;
  max-width: 90px;
  justify-content: center;
  overflow: hidden;
  /* border: 1px solid #b9e8f1; */
  /* padding: 0 8px; */
  cursor: zoom-in !important;
  margin: 0 0 0px 0;
  min-width: 90px;
  background: #f5f5f5;
}
.white--theme .message-attachment a {
  background: #eee;
  border: 1px solid #ddd;
  color: #000 !important;
}
.message-attachment a img {
  width: 100%;
  height: auto;
}
.msg--body__actions__link {
  position: absolute;
  background: #fff;
  border: 1px solid rgba(216, 221, 224, 0.6);
  z-index: 101;
  left: 30px;
  bottom: calc(100% - 20px);
  padding: 5px 0;
  box-shadow: 0 0 3px 0 rgba(216, 221, 224, 0.4);
  border-radius: 3px;
}
.msg--body__actions__link a {
  display: flex;
  font-size: 12px;
  align-items: center;
  padding: 0 12px;
  height: 30px;
  color: #000 !important;
}
.msg--body__actions__link a img {
  margin: 0 10px 0 0;
  filter: invert(0.3) !important;
}
.msg--body__uploader {
  position: absolute;
  background: #fff;
  z-index: 102;
  border: 1px solid rgba(216, 221, 224, 0.6);
  left: 30px;
  bottom: calc(100% - 0px);
  max-width: 400px;
  width: 100%;
  box-shadow: 0 0 3px 0 rgba(216, 221, 224, 0.4);
  border-radius: 3px;
  padding: 5px;
}
.msg--body__smiley__anchor {
  position: absolute;
  right: 30px;
  top: 8px;
  transition: all 0.3s ease;
}
.msg--body__smiley__anchor:hover img {
  transform: scale(1.2);
  transition: all 0.3s ease;
  /* transform: rotate(360deg); */
}
.msg--body__picker {
  position: absolute;
  right: 30px;
  bottom: 55px;
  z-index: 100;
}
.msg--body__send {
  display: flex;
  margin: 0 15px;
  justify-content: flex-end;
  border: 1px solid #ddd;
  border-radius: 0 0 5px 5px;
  padding: 0px 15px;
  border-top: none;
  height: 28px;
  padding-top: 0;
}
.white--theme .msg--body__send {
  background: #ccc;
}
.msg--body__send__anchor {
  display: flex;
  transition: all 0.3s ease;
}
.msg--body__send__btnw {
  display: flex;
  transition: all 0.3s ease;
}
/* .msg--body__send__btnb {
  display: none;
  transition: all 0.3s ease;
} */
/* .msg--body__send__anchor:hover .msg--body__send__btnw {
  display: none;
  transition: all 0.3s ease;
}
.msg--body__send__anchor:hover .msg--body__send__btnb {
  display: flex;
  position: relative;
  transform: scale(1.2);
  transition: all 0.3s ease;
} */
.msg--body__picker aside.emoji-picker-react {
  background: #292b2f;
  border: 1px solid #303338;
  box-shadow: none;
}
.white--theme .msg--body__picker aside.emoji-picker-react {
  background: #fff;
  border: 1px solid #ccc;
}
.msg--body__picker .emoji-picker-react input.emoji-search {
  border: 1px solid #3b3e46;
  background: #3b3e46;
  color: #fff;
}
.white--theme .msg--body__picker .emoji-picker-react input.emoji-search {
  border: 1px solid #eee;
  background: #f5f5f5;
  color: #000;
}
.msg--body__picker .emoji-picker-react .emoji-group::before {
  color: #fff;
  background: #292b2f;
}
.white--theme .msg--body__picker .emoji-picker-react .emoji-group::before {
  color: #000;
  background: #fff;
}
.msg--body__picker .emoji-picker-react .emoji-categories button {
  filter: invert(1);
  opacity: 1 !important;
}
.white--theme .msg--body__picker .emoji-picker-react .emoji-categories button {
  filter: invert(0);
}
.msg--body__thread {
  display: flex;
  font-size: 12px;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.msg--body__thread__icons {
  display: flex;
  align-items: center;
}
.msg--body__thread__icons a {
  display: flex;
  margin: 0 0 0 10px;
}
.msg--body__thread__icons a:first-child {
  margin: 0;
}
.tag-highlight {
  font-family: JLREmericSemi;
  margin: 0 5px;
}
/**Thread Starts**/
.post--chat__thread__main {
  font-size: 12px;
  padding: 0 0 0 40px;
  display: inline-block;
  margin: 15px 0 10px 0;
}
.post--chat__thread {
  display: flex;
  background: #3b3e46;
  padding: 8px 15px;
  border-radius: 5px;
  align-items: center;
}
.white--theme .post--chat__thread {
  background: #ddd;
}
.white--theme .post--chat__thread__message {
  color: #000 !important;
}
.post--chat__thread__count {
  display: flex;
  align-items: center;
  margin: 0 0 0 12px;
  color: #007fff;
}
.post--chat__thread__count img {
  width: 4px;
  height: 8px;
  margin: 0 0 0 5px;
}
.post--chat__thread__time {
  font-size: 10px;
  color: #9a9a9b;
  margin: 0 0 0 15px;
}
.white--theme .post--chat__thread__time {
  color: #707070;
}
/**Thread Ends**/

/**Emoji Starts**/
.msg--body__emoji {
  display: none;
  position: absolute;
  left: 65px;
  top: 20px;
  background: #ededed;
  border-radius: 5px;
  align-items: center;
  padding: 5px 5px;
  z-index: 100;
}
.reverse-row .msg--body__emoji {
  display: none;
  position: absolute;
  right: 65px;
  top: 20px;
  background: #ededed;
  border-radius: 5px;
  align-items: center;
  padding: 5px 5px;
  z-index: 100;
  left: auto;
}
.white--theme .msg--body__emoji {
  background: #bbb;
}
.msg--body__emoji:hover {
  display: flex;
}
.msg--body__post__chat:hover .msg--body__emoji {
  display: flex;
}
.msg--body__emoji a {
  display: flex;
  margin: 0 4px;
}
.edit--del {
  position: relative;
}
.edit--del--drop {
  position: fixed;
  background: #fff;
  border: 0.2px solid #ccc;
  top: 25px;
  width: 150px;
  padding: 10px 0;
  z-index: 10000000000000000000;
}
.white--theme .edit--del--drop {
  background: #bbb;
  border: 0.2px solid #ccc;
}
.edit--del--drop a {
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 12px;
  height: 26px;
  padding: 0 10px;
}
.edit--del--drop a:last-child span {
  color: #e50d4b;
}
.edit--del--drop a:hover {
  background: #f5f5f5;
}
.white--theme .edit--del--drop a:hover {
  background: #eee;
}
.edit--del--drop img {
  width: 13px;
  height: 13px;
  margin: 0 10px 0 0;
}
.del--confirm {
  display: flex;
  margin: 10px 0 10px 0;
  font-size: 15px;
}
/**Emoji Ends**/

/**Reactions Starts**/
.msg--body__react__tags {
  display: flex;
  align-items: center;
  font-size: 12px;
  justify-content: space-between;
  margin: 5px 0 0 0;
  position: relative;
  top: 12px;
}
.msg--body__react__tags .msg--body__reacts:empty {
  display: none;
}
.msg--body__reacts {
  display: flex;
}
.msg--body__reacts a {
  display: flex;
  align-items: center;
  background-color: #fff;
  border: #fff;
  border-radius: 5px;
  margin: 0 5px 0 0;
  padding: 1px 5px;
  box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
  position: relative;
}
.msg--body__reacts a img {
  margin: 0 5px 0 0;
}
.td-tooltip {
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  z-index: 1000;
  left: 0px;
  padding: 5px;
  bottom: 100%;
  border-radius: 3px;
  display: none;
  text-align: left;
  white-space: nowrap;
  font-family: JLREmericSemi;
}
.reverse-row .td-tooltip {
  right: 0;
  left: auto;
}
.msg--body__reacts a:hover .td-tooltip {
  display: grid;
}

.td-tooltip:empty {
  display: none !important;
}

/**Reactions Ends**/

/**Chat body Ends**/

/**Chat Ends**/

/*Bootstrap Modal*/
.modal-content {
  border-radius: 5px !important;
  border: 2px solid #d8dde0 !important;
  padding: 15px !important;
}
.modal-backdrop.show {
  z-index: 9999999999;
}
.fade.modal.show {
  z-index: 9999999999;
}
.modal-header {
  padding: 0 !important;
  border: none !important;
  font-family: JLREmericSemi !important;
}
.modal-body {
  padding: 0 !important;
}
.modal-title.h4 {
  font-size: 21px;
  color: #0e374c !important;
}
/*Bootstrap Modal*/

/*Search Input TH*/
.searc-th-input {
  position: absolute;
  left: 10px;
  width: calc(100% - 20px);
  background: #fff;
  top: 33px;
  border: 1px solid #efefef;
  box-shadow: 0 3px 4px 0px rgba(0, 0, 0, 0.05);
  padding: 10px;
  border-radius: 0 0px 4px 4px;
  z-index: 20000;
}
.searc-th-input input {
  width: 100%;
  outline: none;
}
/*Search Input TH*/

/*Map Tip Starts*/
.map-tip-main {
  display: inline-block;
  background: #fff;
  padding: 0;
  border-radius: 3px;
  box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
  min-width: 250px;
}
.db-tip-info {
  position: absolute;
  top: -45px;
  right: 15px;
  display: none;
}
.p-relative:hover .db-tip-info {
  display: inline-block;
}
.mtm-head {
  padding: 6px 6px 0 6px;
}
.map-tip-info {
  padding: 0 10px;
}
.map-c1 {
  color: #e8ab59;
}
.map-c2 {
  color: #274b63;
}
.map-c3 {
  color: #8c8c8c;
}
.map-c3 span:nth-child(2) {
  color: #505050;
  font-size: 12px;
}
.dark-font {
  color: #505050 !important;
}
.help-btn-map {
  gap: 1px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 5px 0 0 0;
}
.map-btn1 {
  border-radius: 0px 0px 0px 3px !important;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "JLREmericSemi";
  letter-spacing: 0.5px;
  background: #e8ab59 !important;
}
.fr-col-1 .map-btn1 {
  border-radius: 0 0 3px 3px !important;
}
.map-btn2 {
  border-radius: 0 0 3px 0 !important;
  font-size: 10px;
  text-transform: uppercase;
  font-family: "JLREmericSemi";
  letter-spacing: 0.5px;
  background: #274b63 !important;
}
.map-tip-main::after {
  content: "";
  position: absolute;
  bottom: -14px; /* Position the arrow at the bottom */
  left: 50%;
  transform: translateX(-50%);
  border-width: 7px;
  border-style: solid;
  border-color: #fff transparent transparent transparent; /* Arrow color same as background */
}
.db-tip-info::after {
  left: auto;
  right: 4px;
}
.fr-col-1 {
  grid-template-columns: 1fr !important;
}
.fac-leg {
  width: 50px;
  height: 25px;

  border-radius: 3px;
  color: #fff;
  font-family: "JLREmericSemi";
}
.leg-1 {
  background: #2c88d9;
  border: 2px solid #2c88d9;
}
.leg-1_5 {
  background: #1aae9f;
  border: 2px solid #1aae9f;
}
.leg-2 {
  background: #f2d6f6;
  border: 2px dashed #ce6add;
}
.map-shapes-center {
  display: flex;
  width: 30px;
  align-items: center;
  justify-content: center;
}
/*Map Tip Ends*/

/*Edit Templates Popup*/
.n-tags {
  flex-wrap: wrap;
}
.n-tags button {
  background: #f5f5f5;
  border: 1px solid #d8dde0;
  padding: 0 5px;
  height: 26px;
  border-radius: 3px;
  color: #274b63;
}
.body-area {
  min-height: 200px;
  padding: 10px;
}
.oe-tab {
  border: 1px solid #d8dde0;
  width: 75px;
  border-radius: 3px;
  color: #274b63;
  font-family: JLREmericSemi;
  height: 30px;
}
.oe-tab input {
  height: auto !important;
  min-height: 5px !important;
  accent-color: #274b63;
}
/*Edit Templates Popup*/

/*Retailers List Starts*/
.ret-figs {
  background: #274b63;
  color: #fff !important;
  border-radius: 3px;
  height: 60px;
  padding: 0 8px;
  font-size: 12px;
  flex-grow: 1;
  max-width: 160px;
}
.ret-figs span {
  font-size: 22px;
  font-family: JLREmericSemi;
  line-height: 26px;
}
.ret-flex-sm {
  row-gap: 10px !important;
}
.ret-figs p {
  line-height: 12px;
  align-items: center;
  text-align: center;
}
/*Retailers List Ends*/

/*FacilityChecklist List Starts*/
.chk-main-img {
  width: 100%;
  max-width: 400px;
  height: 300px;
  background: #f5f5f5;
  border: none;
}
.chk-main-img img {
  width: auto;
  height: auto;
  max-width: 400px;
  max-height: 300px;
}
.txt-sample {
  left: 0;
  top: 0;
  background: #fff;
  padding: 2px 10px;
  text-transform: uppercase;
}
.chk-com-img {
  width: 130px;
  height: 97.5px;
}
.chk-com-img a.a-c-com {
  width: 130px;
  height: 97.5px;
}
.aspect-img a {
  display: inline-block;
}
.aspect-img img {
  width: auto !important;
  height: 150px !important;
}
.chk-com-img img.img-c-com {
  max-width: 130px;
  max-height: 97.5px;
  width: auto;
  height: auto;
}
.first-fr {
  width: 400px;
}
.btn-lg button {
  background: #369;
  border: none;
  color: #fff;
  border-radius: 3px;
  height: 32px;
}
.reuse-back-l-g {
  background: #f5f5f5;
}
.thr-fr {
  width: 400px;
  min-height: 400px;
}
.sec-fr {
  width: calc(100% - 800px);
}
.p-bar {
  width: 260px;
  background: #f5f5f5;
  height: 25px;
}
.p-bar-g {
  background: #98cb4a;
  width: 50%;
  height: 25px;
  left: 0;
  top: 0;
}
.hide-empty:empty {
  display: none;
}
.hide-empty2:empty {
  display: none !important;
}
.loop-btn-absl {
  width: 94px;
  position: absolute;
  right: 120px;
  top: 10px;
  z-index: 200;
}
td.Section-td {
  background: #ccc !important;
}
td.section-sub-td {
  background: #ececec !important;
}
.visual-chklist .fcl-image {
  width: 100%;
}
.visual-chklist .fcl-image img {
  width: 100% !important;
  height: auto !important;
}
/*Responsive Starts*/
@media (max-width: 1440px) {
  .fc-md-gap {
    gap: 20px;
  }
  .thr-fr {
    width: 280px;
  }
  .p-bar {
    width: 160px;
  }
  .first-fr {
    width: 280px;
  }
  .sec-fr {
    width: calc(100% - 600px);
  }
  .cl-sm-fr {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (min-width: 981px) and (max-width: 1440px) {
  .chk-main-img img {
    max-width: 280px;
    max-height: 210px;
  }
  .chk-com-img {
    width: 100px;
  }
  .chk-com-img a.a-c-com {
    width: 100px;
  }
  .chk-com-img img.img-c-com {
    max-width: 100px;
  }
  .sm-fr-1 .reuse-w-400 {
    width: 280px;
  }
}
@media (max-width: 1280px) {
  .sm-cl-flex {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 980px) {
  .fc-md-gap {
    display: grid;
    margin: 0 auto;
    width: 100%;
    max-width: 400px;
  }
  .chk-main-img {
    width: 100%;
    height: auto;
    max-width: 100%;
  }
  .thr-fr {
    width: 100%;
    min-height: 100px !important;
  }
  .p-bar {
    width: calc(100% - 100px);
  }
  .first-fr {
    width: 100%;
  }
  .sec-fr {
    width: 100%;
  }
  .chk-main-img img {
    max-width: 100%;
    max-height: 1000px;
  }
  .fc-help-btnsm {
    display: grid;
    width: 100% !important;
    max-width: 400px !important;
    grid-template-columns: 1fr;
  }
  .fc-bottom-sm {
    display: grid;
    grid-template-columns: 1fr;
    max-width: 400px;
    margin: 0 auto !important;
    gap: 15px;
  }
  .fc-bottom-sm .reuse-w-13rd {
    width: 100% !important;
  }
  .fc-bottom-sm .reuse-w-13rd:empty {
    display: none;
  }
  .sm-fr-1 {
    grid-template-columns: 1fr !important;
  }
  .sm-fr-1 .reuse-w-400 {
    width: 100% !important;
  }
  .cl-sm-fr {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 480px) {
  .chk-com-img {
    width: auto;
    height: auto;
    max-width: 100%;
  }
  .chk-com-img a.a-c-com {
    width: 100%;
    height: 97.5px;
  }
  .chk-com-img img.img-c-com {
    max-width: 100%;
    max-height: 97.5px;
    width: auto;
    height: auto;
  }
  .thr-fr .notify-time {
    min-width: 100px;
  }
}
/*Responsive Ends*/
/*FacilityChecklist List Ends*/

/*Facility Planner*/
.dark-th-fr {
  background: #274b63 !important;
}
.ret-figs2 {
  padding: 0 5px;
  font-size: 12px;
}
.ret-figs2 span {
  font-size: 12px;
  line-height: 17px;
  height: 26px;
  text-align: center;
}
/*Facility Planner*/

/*Project Request Starts*/
.btn-build {
  background: rgba(51, 102, 153, 0.8);
  border-radius: 5px;
  color: #fff !important;
  width: 100%;
  max-width: 440px;
}
.btn-build span {
  background: #369;
  padding: 0 10px;
  min-width: 120px;
  height: 90px;
  border-radius: 5px 0px 0px 5px;
}
.btn-build p {
  height: 90px;
}
.non-edit {
  border: 1px solid #d8dde0;
  background: #eee;
  color: #8c8c8c;
  height: 32px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 3px;
  width: 100%;
}
.tab-paloi .shadow-section {
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}
.tab-paloi .page--data {
  padding: 0 !important;
}
.tab-paloi .inner-flow-v {
  overflow: visible !important;
}
/* .tab-paloi .ib-display.w-100.overflow-auto {
  overflow: visible !important;
} */
/*Project Request Ends*/

/*CU  Starts*/
.cu-drop .drag-class {
  height: 122px !important;
}
.cu-absolute-rt {
  right: 6px;
  top: 6px;
}
.area-min-lg {
  min-height: 300px;
}
.img-def {
  width: 100%;
  height: auto;
  border: 1px solid rgba(216, 221, 224, 0.4) !important;
  overflow: hidden;
}
.img-def img {
  max-width: 100%;
  max-height: auto;
  height: auto;
  width: auto;
}
.no-bg {
  background: none !important;
}
/*CU Ends*/

/*Deviation Ends*/
.dp-z-index {
  z-index: 1000000000;
}
.dev-chat {
  overflow: auto;
}
.dev-chat .msg--body__messages__chats {
  position: unset;
}
.dev-chat .msg--body__messages__chats__scroll {
  position: unset;
}
.auto-height {
  height: auto !important;
  max-height: unset !important;
}
.dev-max-img {
  max-height: 300px;
}
.dev-chat .msg--body__messages {
  max-height: calc(100vh - 367px);
  height: auto;
}
/*Deviation Ends*/
/*Rich Editor*/
.ql-container.ql-snow {
  min-height: 200px;
}
/*Rich Editor*/

/*Responsive Starts*/
@media (max-width: 767px) {
  .header--menu__right {
    padding: 0;
  }
  .header--left__logo {
    width: auto;
  }
  .header--menu__right a:last-child {
    margin: 0;
  }
  .ret-flex-sm-filters {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 10px;
  }
  .ret-flex-sm-filters-btns {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .p-sm-flex {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 10px;
    width: 100%;
  }
  .p-sm-flex2 {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 10px;
    width: 100%;
  }
  .sm-width-p {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) {
  .header--left__logo img {
    width: 100px;
    height: auto;
  }
  .header--menu__right {
    gap: 15px;
  }
  .log-drop-a span {
    font-size: 10px;
  }
  .log-drop-a img {
    width: 20px;
  }
  .header--menu__right a img {
    width: 20px;
    height: auto;
  }
  .ret-flex-sm {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .ret-figs {
    max-width: 100%;
  }
  .p-sm-flex {
    grid-template-columns: 1fr 1fr;
  }
  .sm-grid-ap {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .full-col-sm {
    grid-column: auto / span 2;
  }
}
@media (max-width: 480px) {
  .ret-flex-sm {
    display: grid;
    grid-template-columns: 1fr;
  }
  .ret-flex-sm-filters-btns {
    display: grid;
    grid-template-columns: 1fr;
  }
  .p-sm-flex {
    grid-template-columns: 1fr;
  }
  .sm-grid-ap {
    display: grid;
    grid-template-columns: 1fr;
  }
  .full-col-sm {
    grid-column: auto / span 1;
  }
}
/*Responsive Ends*/

.resizer {
  cursor: col-resize;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 5px;
  z-index: 1;
}

.isResizing {
  background: rgba(0, 0, 0, 0.1); /* Optional visual feedback during resize */
}
.triangle {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 15px solid #8c8c8c;
}
.Inv-triangle {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 15px solid #8c8c8c;
}
.Circle {
  width: 15px;
  height: 15px;
  background-color: #8c8c8c;
  border-radius: 100%;
}
.triangle,
.Inv-triangle,
.Circle {
  position: relative;
  display: inline-block;
}
.Circle-Inside-triIN {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 100%;
  position: absolute;
  top: 7px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.Circle-Inside-square {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.Circle-Inside-pgram {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 100%;
  position: absolute;
  top: 5px;
  left: 5px;
  transform: skew(-20deg);
}
.Circle-Inside {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 100%;
  position: absolute;
  top: 11px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.Circle-Inside-Circle {
  width: 6px;
  height: 6px;
  background-color: transparent;
  border-radius: 100%;
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.marker-image-trIN {
  position: absolute;
  top: -9px;
  left: 5%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px; /* Adjust this based on your requirements */
}
.marker-image-tr {
  position: absolute;
  bottom: -15px;
  left: 5%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px; /* Adjust this based on your requirements */
}
.marker-image-Cr {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px; /* Adjust this based on your requirements */
}
.disable-click {
  pointer-events: none;
  cursor: no-drop;
  opacity: 0.8;
}
.disable-click * {
  pointer-events: none;
  cursor: no-drop !important;
  opacity: 0.8 !important;
}
.btn-feedback {
  color: #fff !important;
  width: 110px;
  height: 40px;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 5px;
}

/*Map Info Window*/
.gm-style-iw.gm-style-iw-c {
  padding: 8px !important;
  border-radius: 3px !important;
}
.gm-style-iw-chr {
  display: none !important;
}
.gm-style-iw-d {
  font-family: JLREmericSemi !important;
}
.yNHHyP-marker-view {
  font-size: 13px;
}
.ql-background.ql-picker.ql-color-picker {
  display: none;
}
/* .gm-style-iw-chr {
  width: 100%;
  height: 20px !important;
  display: flex;
  justify-content: flex-end;
}
.gm-style-iw-ch:empty {
  display: none;
}
.gm-ui-hover-effect {
  display: flex !important;
  width: 100% !important;
  height: 20px !important;
  justify-content: flex-end;
}
.gm-ui-hover-effect span {
  display: flex !important;
  width: 15px !important;
  justify-content: flex-end !important;
  height: 15px !important;
  margin: 5px 0 0 0 !important;
}
.gm-style-iw-d {
  margin: 0 5px 2px 5px;
} */
/*Map Info Window*/
/******Charts *****/

/*tooltip starts*/
.tooltip {
  padding: 0 !important;
  opacity: 1 !important;
}
.tooltip-new {
  border-radius: 0 !important;
  padding: 3px 6px !important;
  font-weight: bold !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0px !important;
}
.tooltip__title {
  display: flex;
  align-items: center;
  height: 25px;
  margin: 0;
  border: 1px solid #d8dde0;
  padding: 0 5px;
  font-size: 10px !important;
  text-transform: uppercase;
  justify-content: flex-start !important;
  text-align: left !important;
  line-height: 11px !important;
  font-family: "JLREmericSemi";
}
.tooltip table {
  width: 100% !important;
}
.tooltip table,
.tooltip table tr,
.tooltip table tr th,
.tooltip table tr td {
  border: none !important;
  background: #fff !important;
  text-transform: uppercase;
  font-weight: bold !important;
}
.tooltip table tr th,
.tooltip table tr td {
  padding: 5px 7px !important;
}
.tooltip__table tbody tr td {
  font-family: "JLREmeric";
  font-weight: normal !important;
  font-size: 11px;
}
.tooltip table tr td:last-child {
  text-align: right !important;
}
.chart-title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: bolder;
  letter-spacing: 0.3px;
  position: relative;
  top: -10px;
}
/*tooltip Ends*/
/*Legends Starts*/
.Legend-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}
.Legend-main2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}
.Legend-main3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}
.gap-15 {
  gap: 15px;
}
.gap-30 {
  gap: 30px;
}
.leg-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.leg-item span {
  display: flex;
  background: #ccc;
  width: 12px;
  height: 12px;
}
.leg-item .c-forecast {
  background: #b9e8f1;
}
.leg-item .c-actuals {
  background: #336699;
}
.chart-head {
  display: flex;
  align-items: center;
  justify-content: left;
  border-bottom: 1px solid #ddd;
  padding: 5px 10px;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  position: relative;
}
.chart-main text {
  color: #555;
  font-size: 9px;
}
.fontColorLight {
  color: #777;
  opacity: 0.7 !important;
}
/*Custom tooltip*/
.tooltip-Highlight {
  box-sizing: border-box;
  font-weight: 900;
  color: #fff;
}
table tbody tr td.tooltip-Highlight {
  background: #1f3a6c !important;
}
.leg-item .stock-1 {
  background: rgb(209, 189, 130);
}
.leg-item .stock-2 {
  background: rgb(232, 171, 89);
}
.leg-item .stock-0 {
  background: rgb(226, 212, 203);
}

.leg-item .order-0 {
  background: rgb(216, 221, 224);
}
.leg-item .order-1 {
  background: rgb(166, 195, 193);
}
.leg-item .order-2 {
  background: rgb(185, 232, 241);
}
.axis-label {
  font-size: 14px; /* Adjust size as needed */
  font-weight: bold; /* Make it bold */
  fill: #000; /* Set the color */
}
/****/
/**********Charts End*****/
/*Infographice New Starts*/
.info-export {
  display: flex;
  justify-content: flex-end;
  margin: 10px 0;
  padding: 0 10px;
}
.Info-graphs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.Info-graphs2 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.graphics-left {
  display: grid;
  border-right: 1px solid #ccc;
  padding: 0 20px;
}
.info-fr {
  grid-template-columns: 1fr 1fr 1fr !important;
}
.c-grp-childs:first-child .roi-1,
.c-grp-childs:nth-child(2) .roi-1,
.c-grp-childs:nth-child(3) .roi-1 {
  padding-bottom: 20px !important;
}

.c-grp-childs:nth-child(3),
.c-grp-childs:nth-child(6) {
  border-right: none !important;
}
.c-grp-childs:nth-child(4) .roi-1,
.c-grp-childs:nth-child(5) .roi-1,
.c-grp-childs:nth-child(6) .roi-1 {
  padding-top: 20px;
  border-bottom: none;
}
.no-border-last:last-child {
  border: none !important;
}
.roi-1 {
  display: inline-block;
  width: 100%;
  border-bottom: 1px solid #ccc;
}
.roi-2 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.roi-2 img {
  width: auto;
  height: 55px;
}
.roi-3 {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-family: "JLREmericSemi";
  text-transform: capitalize;
}
.roi-4 {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-family: "JLREmericSemi";
  line-height: 40px;
  margin: 5px 0 0 0;
}
.roi-1.pb--20 {
  padding-bottom: 10px !important;
}
.roi-1.pt--20 {
  padding-top: 10px !important;
}
/*Infographice New Ends*/

.progress-bar {
  width: 100%;
  background-color: #eee;
}

.progress-bar-completed {
  height: 20px;
  background-color: pink;
  transition: width 0.5s ease-in-out;
}

/***************Tooltip for marker on map****************/
.marker-topleft {
  margin-right: 11px;
  margin-top: -30px;
  right: 100%;
}
.marker-topleft.marker-icon > span {
}
.marker-topleft > span:after {
  background: url("/images/sprite3.png") no-repeat scroll 0 -550px rgba(0, 0, 0, 0);
  height: 23px;
  left: 100%;
  margin: -7px 0 0 -8px;
  top: 100%;
  width: 25px;
}
.marker {
  overflow: visible !important;
  position: relative;
}
.marker > span {
  background: none repeat scroll 0 0 #fff;
  box-shadow: 2px 3px 1px rgba(0, 0, 0, 0.25);
  color: #a90329;
  display: block;
  font-size: 12px;
  padding: 3px 5px;
  position: relative;
  text-overflow: ellipsis;
  white-space: nowrap;
  z-index: 2;
}
.marker > span:after {
  content: "";
  position: absolute;
}
.marker a {
  display: block;
  padding: 2px;
}
.marker a:hover {
  text-decoration: underline;
}
.marker-bottomright {
  margin-left: 14px;
  margin-top: 22px;
}
.marker-bottomright.marker-icon:before {
  left: auto;
  right: -27px;
}
.marker-bottomright.marker-icon:after {
  left: auto;
  right: -23px;
  top: -1px;
}
.marker-bottomright.marker-icon > span {
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
}
.marker-bottomright > span:after {
  background: url("/images/sprite3.png") no-repeat scroll 0 -610px rgba(0, 0, 0, 0);
  bottom: 100%;
  height: 25px;
  left: 0;
  margin: 0 0 -8px -15px;
  width: 22px;
}

.marker-topright {
  margin-left: 15px;
  margin-top: -20px;
}
/*.marker-topright.marker-icon:before {
  left: auto;
  right: -27px;
}*/
.marker-topright.marker-icon:after {
  left: auto;
  right: -23px;
}
.marker-topright.marker-icon > span {
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
}
.marker-topright > span:after {
  background: url("/images/sprite3.png") no-repeat scroll 0 -580px rgba(0, 0, 0, 0);
  bottom: 0;
  height: 22px;
  left: 0;
  margin: 0 0 -16px -18px;
  width: 25px;
}

.marker-bottomleft {
  margin-right: 10px;
  margin-top: 25px;
  right: 100%;
}
.marker-bottomleft.marker-icon:before {
  left: -27px;
  top: 0px;
}
.marker-bottomleft.marker-icon:after {
  left: -23px;
  top: -1px;
}
.marker-bottomleft.marker-icon > span {
}
.marker-bottomleft > span:after {
  background: url("/images/sprite3.png") no-repeat scroll 0 -640px rgba(0, 0, 0, 0);
  bottom: 100%;
  height: 25px;
  left: 100%;
  margin: 0 0 -6px -7px;
  width: 22px;
}
.marker-icon.unknown:after {
  background: url("/images/sprite3.png") no-repeat scroll -143px -271px #909090;
  content: "";
  display: inline-block;
}
.ClassIcon {
  background: none repeat scroll 0 0 #ffffff;
  display: inline;
  /*left: 100%;*/
  padding: 3px 6px;
  position: absolute;
  top: 0;
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
  height: 18px;
}
.ClassIcon > img {
  /*width: 20px;*/
  height: 14px;
}
.ClassIcon2 {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
  display: inline;
  height: 50px !important;
  left: -20px;
  padding: 0px 0px 2px 0px;
  position: relative;
  top: -20px;
  width: auto;
  height: 20px !important;
  display: inline-block;
}
.ClassIcon2 > img {
  /* border: 1px solid #f5f5f5; */
  height: 20px !important;
  width: 20px !important;
  position: absolute;
  left: 0;
  top: 0;
}

.marker .marker-topright .marker-icon .unknown .ClassIcon2 {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
  display: inline;
  height: 50px !important;
  left: -27px;
  padding: 6px 5px 5px 5px;
  position: relative;
  top: -21px;
  width: auto;
}
.marker .marker-topright .marker-icon .unknown .ClassIcon2 > img {
  border: 1px solid #f5f5f5;
  height: 20px !important;
  width: 20px !important;
}
.marker .marker-topleft .marker-icon .unknown .ClassIcon2 {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.25);
  display: inline;
  height: 50px !important;
  left: -27px;
  padding: 5px;
  position: relative;
  top: -21px;
  width: auto;
}
.marker .marker-topleft .marker-icon .unknown .ClassIcon2 > img {
  border: 1px solid #f5f5f5;
  height: 20px !important;
  width: 20px !important;
}
.WidthClass {
  /*
  max-width: 85px;
  min-width: 80px;
*/
  position: absolute;
}
.OverLayClass {
  z-index: 5;
}
.marker-topleft .ClassIcon,
.marker-bottomleft .ClassIcon {
  right: 100%;
}
.marker-topright .ClassIcon,
.marker-bottomright .ClassIcon {
  left: 100%;
}

.marker-topleft .ClassIcon2,
.marker-bottomleft .ClassIcon2 {
  right: 100%;
}
.marker-topright .ClassIcon2,
.marker-bottomright .ClassIcon2 {
  left: 100%;
}
.gm-control-active > img {
  box-sizing: content-box;
  display: none;
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.gm-control-active > img:nth-child(1) {
  display: block;
}

.gm-control-active:hover > img:nth-child(1),
.gm-control-active:active > img:nth-child(1) {
  display: none;
}

.gm-control-active:hover > img:nth-child(2),
.gm-control-active:active > img:nth-child(3) {
  display: block;
}
/*Marker Ends */

/*Shapes*/
.Square-shape {
  width: 16px;
  height: 16px;
  background: #c4c4c4;
}
.circle-shape {
  width: 16px;
  height: 16px;
  background: #c4c4c4;
  border-radius: 50%;
}
.tup-shape {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 18px solid #c4c4c4;
}
.tdown-shape {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 18px solid #c4c4c4;
}
.trapez-shape {
  border-bottom: 15px solid #c4c4c4;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  height: 0;
  width: 24px;
}
.pgram-shape {
  width: 15px;
  height: 15px;
  transform: skew(20deg);
  background: #c4c4c4;
}
.star6-shape {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 20px solid #c4c4c4;
  position: relative;
}
.star6-shape:after {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid #c4c4c4;
  position: absolute;
  content: "";
  top: 7.5px;
  left: -9.5px;
}
.pent-shape {
  margin: 10px 0 0 0;
  position: relative;
  width: 13.5px;
  box-sizing: content-box;
  border-width: 13.5px 5.5px 0;
  border-style: solid;
  border-color: #c4c4c4 transparent;
}
.pent-shape:before {
  content: "";
  position: absolute;
  height: 0;
  width: 0;
  top: -21.25px;
  left: -4.5px;
  border-width: 0 11.25px 8.75px;
  border-style: solid;
  border-color: transparent transparent #c4c4c4;
}
.octa-shape {
  width: 20px;
  height: 20px;
  background: #c4c4c4;
  position: relative;
}
.octa-shape:before {
  content: "";
  width: 20px;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 5.8px solid #c4c4c4;
  border-left: 5.8px solid #fff;
  border-right: 5.8px solid #fff;
}
.octa-shape:after {
  content: "";
  width: 20px;
  height: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: 5.8px solid #c4c4c4;
  border-left: 5.8px solid #fff;
  border-right: 5.8px solid #fff;
}
.diamond-shape {
  width: 16px;
  height: 16px;
  background: #c4c4c4;
  transform: rotate(133deg);
}
.pb-shape {
  background: #c4c4c4;
  width: 16px;
  height: 16px;
  position: relative;
  text-align: center;
}
.pb-shape:before,
.pb-shape:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 16px;
  width: 16px;
  background: #c4c4c4;
}
.pb-shape:before {
  transform: rotate(30deg);
}
.pb-shape:after {
  transform: rotate(60deg);
}
.base-shape {
  background: #c4c4c4;
  display: inline-block;
  height: 11px;
  margin-left: 0px;
  margin-top: 11px;
  position: relative;
  width: 20px;
}
.base-shape:before {
  border-bottom: 7px solid #c4c4c4;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: -7px;
  width: 0;
}
.custom-cluster {
  font-size: 10px;
}
/*Shapes*/
/*Animation*/
line {
  color: #ccc !important;
}
text {
  color: #ccc !important;
}
g path {
  animation: loadingAnimation 1s alternate; /* Adjust the animation duration as needed */
  transform-origin: center; /* Set the transform origin to start from the bottom */
  color: #ccc;
}
g rect {
  animation: loadingAnimation2 1s alternate; /* Adjust the animation duration as needed */
  transform-origin: left; /* Set the transform origin to start from the bottom */
}
.loading-bar {
  animation: loadingAnimation 1s alternate; /* Adjust the animation duration as needed */
  transform-origin: center; /* Set the transform origin to start from the bottom */
}
@keyframes loadingAnimation2 {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
@keyframes loadingAnimation {
  from {
    transform: scaleY(0);
  }
  to {
    transform: scaleY(1);
  }
}
.loading-progress {
  animation: loadingAnimation2 1s alternate; /* Adjust the animation duration as needed */
  transform-origin: left; /* Set the transform origin to start from the bottom */
  border-radius: 4px;
  z-index: 10 !important;
}
.loading-progress-vertical {
  animation: loadingAnimation 1s alternate; /* Adjust the animation duration as needed */
  transform-origin: top; /* Set the transform origin to start from the bottom */
}
.task_divbackground-ArchTimeline {
  position: absolute;

  height: 10px;
  z-index: 10000;
  top: 5px;
}
/*Legends Starts*/
.Legend-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}
.Legend-main2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}
.Legend-main3 {
  display: flex;
  align-items: center;
  justify-content: center;
  row-gap: 0px;
  flex-wrap: wrap;
  column-gap: 20px;
}
.legend--4 {
  row-gap: 5px;
  column-gap: 10px;
}
.leg-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.leg-item span {
  display: flex;
  background: #ccc;
  width: 12px;
  height: 12px;
}
.leg-item .c-forecast {
  background: #274b63;
}
.leg-item .c-actuals {
  background: #336699;
}
.leg-item .c-nv {
  background: #336699;
}
.leg-item .c-uv {
  background: #525252;
}
.leg-item .c-ztd {
  background: #336699;
}
.leg-item .c-tsd {
  background: #274b63;
}
.leg-item .c-snd {
  background: #d2aa87;
}
.leg-item .c-pnd {
  background: #525252;
}
.leg-item p {
  margin: 0;
  font-size: 11px;
  color: #555;
}
.leg-item .clegend-0 {
  background: #336699;
}
.leg-item .clegend-1 {
  background: #e8ab59;
}
.leg-item .clegend-2 {
  background: #d8dde0;
}
.leg-item .clegend-3 {
  background: #d1db82;
}
.leg-item .clegend-4 {
  background: #e2d4cb;
}
.leg-item .clegend-5 {
  background: #d6edf6;
}
.leg-item .clegend-6 {
  background: #a6c3c1;
}
.leg-item .clegend-7 {
  background: #d2aa87;
}
.leg-item .clegend-8 {
  background: #b9e8f1;
}
.leg-item .clegend-9 {
  background: #274b63;
}
.leg-item .clegend-10 {
  background: #46d39a;
}
.leg-item .clegend-11 {
  background: #64b5f6;
}
.leg-item .clegend-12 {
  background: #bfe8ff;
}
.leg-item .clegend-13 {
  background: #0075a4;
}
.leg-item .clegend-14 {
  background: #ffb996;
}
.leg-item .clegend-15 {
  background: #7bd3ea;
}
.leg-item .clegend-16 {
  background: #b0a695;
}
.leg-item .clegend-17 {
  background: #8eaccd;
}
.leg-item .clegend-18 {
  background: #d7f1d3;
}
.leg-item .clegend-19 {
  background: #d8e7f7;
}
.leg-item .clegend-20 {
  background: #f6cbcb;
}
.leg-item .clegend-21 {
  background: #f3d2f1;
}
g.legend {
  display: none;
}
/*Legends Ends*/

/*Fleet List Start*/
.g-vin {
  background: #98cb4a !important;
}
.r-vin {
  background: #f42336 !important;
}
.amb-vin {
  background: #f39d2d !important;
}
.exp-change {
  background: #f39d2d !important;
}
.s-vin input {
  border-radius: 6px 0 0 6px;
}
.s-vin a.vin-search {
  background: #1f3a6c;
  height: 32px;
  width: 32px;
  display: flex;
  border-radius: 0 6px 6px 0;
}
.h-32 {
  height: 32px !important;
}
input:disabled {
  background: #f5f5f5;
}
.form-part {
  color: rgba(26, 29, 33, 0.1);
  margin: 20px 0;
}
.report-accord {
  display: inline-block;
  width: 100%;
  margin: 5px 0 0 0;
  box-shadow: 0 0 13px 0 rgba(62, 44, 90, 0.08);
  background: #fff;
}
.acco-head {
  display: flex;
  font-size: 13px;
  font-weight: bold;
  text-transform: uppercase;
  margin: 0 0 10px 0;
  padding: 0 15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
  height: 40px;
  align-items: center;
  color: #8c8c8c;
}
.acco-btns {
  display: inline-block;
  width: 100%;
  padding: 0 15px;
  margin: 0 0 5px 0;
}
.btn-info-rep {
  display: inline-block;
  margin: 0 5px 5px 0;
}
.acco-btns a {
  display: flex;
  background: #1f3a6c;
  color: #fff !important;
  font-size: 12px;
  border-radius: 5px;
  padding: 10px 15px 10px 15px;
  gap: 0px;
  align-items: center;
}
.btn-icon {
  display: flex;
}
.c-line {
  display: flex;
  width: 1px;
  height: 17px;
  background: #5386b9;
  margin: 0 8px 0 10px;
}
.btn-txt {
  display: flex;
  line-height: 17px;
  font-family: "JLREmericSemi";
}
.dyn-table thead tr th,
.dyn-table tbody tr td {
  white-space: nowrap;
}
.form-min {
  align-content: flex-start;
}
.grid-btn-sm {
  height: 26px !important;
}
input[type="radio"] {
  box-shadow: none !important;
  width: 18px !important;
  height: 18px !important;
}
input[type="radio"]:focus {
  box-shadow: none !important;
  width: 18px !important;
  height: 18px !important;
}
.small-drop .cloud-img {
  display: none !important;
}
.small-drop .drop-font {
  font-size: 11px !important;
}
.small-drop .drop-fontsm {
  font-size: 10px !important;
}
.small-drop .drop-pad-sm {
  padding: 0 !important;
}
.small-drop .drop-pad-sm {
  padding: 1px 12px !important;
}
.small-drop .drad-drop {
  display: flex;
  gap: 10px;
}
.small-drop .uploaded-list {
  display: flex;
  gap: 5px;
  margin: 0;
}
.small-drop .a-img-rel img {
  width: auto;
  height: 32px;
}
.small-drop .remove--image a.remove-up {
  padding: 1px !important;
}
.date-header {
  min-width: 70px !important;
  padding: 0 !important;
}
.bs-drop-show .eye-drop {
  display: none !important;
}
.bs-drop-show:hover .eye-drop {
  display: grid !important;
}
.bs-legend {
  display: flex;
  width: 14px;
  height: 14px;
}
.color-06 {
  background: #98cb4a !important;
}
.color-07 {
  background: #f39d2d !important;
}
.color-09 {
  background: #f42336 !important;
}
.bs-legend2 {
  display: flex;
  width: 4px;
  height: 20px;
  border-radius: 10px;
  z-index: 100;
}
.rgx {
  background: #274b63 !important;
}
.pcd {
  background: #ff0000 !important;
}
table.reuse-table-sh thead tr th.freeze-header1,
table.reuse-table-sh tbody tr td.freeze-header1 {
  position: sticky;
  left: 0;
  top: 0;
}
table.reuse-table-sh thead tr th.freeze-header1 {
  z-index: 100000;
}

table.reuse-table-sh tbody tr td.freeze-header1 {
  background: #fff;
  z-index: 101;
}
table.reuse-table-sh tbody tr:nth-child(2n + 1) td.freeze-header1 {
  background: #fafafa;
}
table.reuse-table-sh thead tr th.freeze-header2,
table.reuse-table-sh tbody tr td.freeze-header2 {
  position: sticky;
  left: 249px;
  top: 0;
}
table.reuse-table-sh thead tr th.freeze-header2 {
  z-index: 100000;
}

table.reuse-table-sh tbody tr td.freeze-header2 {
  background: #fff;
  z-index: 101;
}
table.reuse-table-sh tbody tr:nth-child(2n + 1) td.freeze-header2 {
  background: #fafafa;
}
table.reuse-table-sh thead tr th.freeze-header3,
table.reuse-table-sh tbody tr td.freeze-header3 {
  position: sticky;
  left: 598px;
  top: 0;
}
table.reuse-table-sh thead tr th.freeze-header3 {
  z-index: 100000;
}

table.reuse-table-sh tbody tr td.freeze-header3 {
  background: #fff !important;
  z-index: 101;
}
table.reuse-table-sh tbody tr:nth-child(2n + 1) td.freeze-header3 {
  background: #fafafa !important;
}
table.reuse-table-sh thead tr th.freeze-header4,
table.reuse-table-sh tbody tr td.freeze-header4 {
  position: sticky;
  left: 747px;
  top: 0;
}
table.reuse-table-sh thead tr th.freeze-header4 {
  z-index: 100000;
}

table.reuse-table-sh tbody tr td.freeze-header4 {
  background: #fff;
  z-index: 101;
}
table.reuse-table-sh tbody tr:nth-child(2n + 1) td.freeze-header4 {
  background: #fafafa;
}
/*Fleet List Ends*/

/*Dashboard Start*/
.charts-head {
  padding: 5px 15px;
  border-bottom: 1px solid #eee;
}
/*Dashboard Ends*/

/*Fuel guage starts*/
.fuel-guage {
  background: #f8f8f8;
  width: 100%;
  height: 10px;
  border: 1px solid #ebf0f2;
  border-radius: 30px;
  margin: 7px 0 20px 0;
}
.guage-disable {
  opacity: 0.7;
  cursor: not-allowed;
}
.fill-guage {
  background: #f42336;
  position: absolute;
  left: 0;
  top: 0;
  height: 10px;
  border-radius: 30px;
  width: 0;
}
.fuel-guage a {
  position: absolute;
  top: -6px;
}
.guage-disable a {
  cursor: not-allowed !important;
}
.fuel-guage a span {
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 100%;
  box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
}
.f-empty {
  left: 0;
}
.empty-guage .f-empty span {
  background: #f42336;
  border: 1px solid #f42336;
}
.empty-guage .f-empty p {
  color: #f42336 !important;
}
.empty-guage .fill-guage {
  background: #f42336;
  width: 0;
}
.f-othr {
  left: 25%;
}
.othr-guage .f-othr span {
  background: #f39d2d;
  border: 1px solid #f39d2d;
}
.othr-guage .f-othr p {
  color: #f39d2d !important;
}
.othr-guage .fill-guage {
  background: #f39d2d;
  width: calc(25% + 20px);
}
.f-half {
  left: 50%;
}
.half-guage .f-half span {
  background: #f7d842;
  border: 1px solid #f7d842;
}
.half-guage .f-half p {
  color: #f7d842 !important;
}
.half-guage .fill-guage {
  background: #f7d842;
  width: calc(50% + 20px);
}
.f-tfour {
  left: 75%;
}
.tfour-guage .f-tfour span {
  background: #98cb4a;
  border: 1px solid #98cb4a;
}
.tfour-guage .f-tfour p {
  color: #98cb4a !important;
}
.tfour-guage .fill-guage {
  background: #98cb4a;
  width: calc(75% + 20px);
}
.f-full {
  left: calc(100% - 20px);
}
.full-guage .f-full span {
  background: #98cb4a;
  border: 1px solid #98cb4a;
}
.full-guage .f-full p {
  color: #98cb4a !important;
}
.full-guage .fill-guage {
  background: #98cb4a;
  width: 100%;
}

/*Fuel guage ends*/
.reuse-table thead tr th .flex-gap10 {
  gap: 5px;
}

table thead tr th.frz1,
table tbody tr td.frz1,
table thead tr th.frz2,
table tbody tr td.frz2,
table thead tr th.frz3,
table tbody tr td.frz3 {
  position: sticky;
  left: 0;
  top: 0;
}
table thead tr th.frz1,
table thead tr th.frz2,
table thead tr th.frz3 {
  z-index: 10001 !important;
}

table tbody tr td.frz1,
table tbody tr td.frz2,
table tbody tr td.frz3 {
  background: #fff !important;
  z-index: 101;
}
table thead tr th.frz2,
table tbody tr td.frz2 {
  left: 99px;
}
table tbody tr:nth-child(2n + 1) td.frz1,
table tbody tr:nth-child(2n + 1) td.frz2,
table tbody tr:nth-child(2n + 1) td.frz3 {
  background: #fafafa !important;
}
.legal-min {
  width: 100%;
  max-width: 1080px;
}
.gantt-th {
  padding: 0 3px !important;
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-right: 1px solid white;
}
.gantt-chart-span {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-right: 1px solid white;
  padding: 0 !important;
}

.legal-min2 {
  width: 100%;
  text-align: justify;
}
.legal-min ul li {
  margin-bottom: 5px;
}
.font-italic {
  font-style: italic;
}
.left-float {
  float: left;
}
.select-back {
  background: none !important;
  height: 32px !important;
}
.bg-retailer {
  background-color: #fceaed !important;
}
.input-search.sm-date {
  width: 184px;
}
.th-select {
  border-radius: 0;
  border: 1px solid #fff;
  height: 26px !important;
  min-height: 26px !important;
}

.table-td-xxs table thead tr th,
.table-td-xxs table tbody tr td {
  width: 50px !important;
  min-width: 50px !important;
}
.table-td-xxs table thead tr th:first-child,
.table-td-xxs table tbody tr td:first-child {
  width: 100px !important;
  min-width: 100px !important;
}
.Line-Chart-HoverLine {
  stroke: black;
  stroke-linecap: round;
  opacity: 0;
}
.Line-Chart-ShowHoverLine {
  stroke: black;
  stroke-linecap: round;
  opacity: 1;
}
.Line-Chart-HoverLineHide {
  opacity: 0;
}
.Line-Chart-Inlet {
  stroke-linecap: round;
  opacity: 1;
  stroke-width: 2;
}
.NumberFont {
  font-size: 8px;
}
.TextToEnd {
  text-anchor: end;
}
.c-count {
  position: absolute;
  background: red;
  color: #fff;
  width: 14px;
  height: 14px;
  border-radius: 100%;
  right: -3px;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -3px;
  font-size: 9px;
  font-family: "JLREmericSemi";
}
.toggle-2 {
  border: none;
  border-radius: 0;
}
.toggle-2 a {
  color: #000 !important;
  font-size: 12px;
  border: 1px solid #d8dde0;
  border-radius: 3px !important;
  text-transform: uppercase;
  padding: 0 6px !important;
}
.toggle-2 a.c-d1 {
  /* background: #ffedb2 !important; */
  border: 2px solid #d1bd82 !important;
  color: #000 !important;
}
.toggle-2 a.c-l1 {
  background: #d1bd82 !important;
  border: 2px solid #d1bd82 !important;
  color: #000 !important;
}
.toggle-2 a.c-d2 {
  /* background: #d9ffff !important; */
  border: 2px solid #b9e8f1 !important;
  color: #000 !important;
}
.toggle-2 a.c-l2 {
  background: #b9e8f1 !important;
  border: 2px solid #b9e8f1 !important;
  color: #000 !important;
}
.toggle-2 a.c-d3 {
  /* background: #c8fb7a !important; */
  border: 2px solid #98cb4a !important;
  color: #000 !important;
}
.toggle-2 a.c-l3 {
  background: #98cb4a !important;
  border: 2px solid #98cb4a !important;
  color: #000 !important;
}
.toggle-2 a.c-d4 {
  /* background: #ff5366 !important; */
  border: 2px solid #f42336 !important;
  color: #000 !important;
}
.toggle-2 a.c-l4 {
  background: #f42336 !important;
  border: 2px solid #f42336 !important;
  color: #000 !important;
}
.toggle-2 a.c-d5 {
  /* background: #ffff72 !important; */
  border: 2px solid #f7d842 !important;
  color: #000 !important;
}
.toggle-2 a.c-l5 {
  background: #f7d842 !important;
  border: 2px solid #f7d842 !important;
  color: #000 !important;
}
.toggle-2 a.c-d6 {
  /* background: #ffcd5d !important; */
  border: 2px solid #f39d2d !important;
  color: #000 !important;
}
.toggle-2 a.c-l6 {
  background: #f39d2d !important;
  border: 2px solid #f39d2d !important;
  color: #000 !important;
}
.toggle-2 a:last-child {
  background: transparent !important;
  border: 2px solid transparent !important;
  color: #000 !important;
}
table.reuse-table tbody tr td.is-input {
  background-color: #e3f8d8 !important;
}
table.reuse-table tbody tr:nth-child(2n + 1) td.is-input {
  background-color: #e3f8d8 !important;
}
.grid-btn-hide {
  width: 20px;
  height: 20px;
}
.reuse-table tbody tr td.all-same-row {
  background: #fafafa !important;
}
.btn-export {
  display: flex;
}
.ret-figs-new p,
.ret-figs-new span {
  font-size: 16px;
  font-family: JLREmericSemi;
  line-height: 22px;
}
.normal-box {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #d8dde0 !important;
}
.normal-box1 {
  background: #e3f8d8 !important;
  color: #000 !important;
  border: 2px solid #e3f8d8 !important;
}
.normal-box2 {
  background: #fceaed !important;
  color: #000 !important;
  border: 2px solid #fceaed !important;
}
.fcn-box1 {
  background: #e3f8d8 !important;
  color: #000 !important;
  border: 2px solid #98cb4a !important;
}
.fcn-box2 {
  background: #fceaed !important;
  color: #000 !important;
  border: 2px solid #f42336 !important;
}
.fcn-box3 {
  background: #f7d842 !important;
  color: #000 !important;
  border: 2px solid #f7d842 !important;
}
.fcn-box4 {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #274b63 !important;
}
.fr-6 {
  grid-template-columns: repeat(6, 1fr);
}

@media (max-width: 1280px) {
  .fr-6 {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}
@media (max-width: 800px) {
  .fr-6 {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media (max-width: 500px) {
  .fr-6 {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
  }
}
.wh-grid-auto {
  width: auto !important;
  height: auto !important;
  max-height: 40px !important;
}
.sm-btns-up {
  height: 26px !important;
}
.multi-list {
  max-height: 290px;
  overflow: auto;
}
