body {
    font-family: "Inter", "Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans"
}

.form-control {
  font-size: 0.8rem;
}

.text-sm {
  font-size: .775rem !important;
}

.text-tiny {
  font-size: .675rem !important;
}

.text-md {
  font-size: .875rem !important;
}

.maskOverlay {
  background-color: rgba(231,202,181,0.85)
}

.maskCardOverlay {
  background-color: rgb(11 12 130 / 87%);
}

.mask {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */   
  height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 1000; /* Sit on top */
  left: 0;
  top: 0;
  /*background-color: rgb(0,0,0); /* Black fallback color */
  /*background-color: rgba(0,0,0, 0.9); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

.maskCard {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1000;
  left: 0;
  top: 0;
  overflow-x: hidden;
  transition: 0.5s;
}

.sidebar-wrapper .nav-treeview > .nav-item > .nav-link.active, .nav-item > .nav-link.active {
  background-color: #0B0C82 !important;
  color: #fff !important;
}

.widget-icon-color {
  color: #4576D6;
}

.kkon-color-secondary {
  color: #ff0506;
}

.kkon-color-primary {
  color: #0B0C82;
}

.kkon-color-main {
  color: #0C0E7F;
}

.kkon-color-lt1 {
  color: #102FD0;
}

.kkon-color-lt2 {
  color: #5269E2;
}

.kkon-color-lt3 {
  color: #E7EAFD;
}

.kkon-color-dk1 {
  color: #050745;
}

.kkon-bgcolor-secondary {
  background-color: #ff0506;
}

.kkon-bgcolor-primary {
  background-color: #0B0C82;
  color: #fff;
}

.kkon-bgcolor-main {
  background-color: #0C0E7F;
  color: #fff;
}

.kkon-bgcolor-lt1 {
  background-color: #102FD0;
}

.kkon-bgcolor-lt2 {
  background-color: #5269E2;
}

.kkon-bgcolor-lt3 {
  background-color: #E7EAFD;
}

.kkon-bgcolor-dk1 {
  background-color: #050745;
  color: #fff;
}

.animation__wobble {
  -webkit-animation: wobble 1.5s;
  animation: wobble 1.5s;
}

.preloader {
  display: -ms-flexbox;
  display: flex;
  background-color: #f4f6f9;
  opacity: 0.9;
  height: 100vh;
  width: 100%;
  transition: height .2s linear;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9999;
}

.info-box .info-box-icon {
  border-radius: 5rem;
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.775rem;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  width: 60px;
  height: 60px;
  /* margin: -5px;
    margin-right: 10px; */
}

.info-box .info-box-number {
  display: block;
  margin-top: 0.05rem;
  font-weight: 700;
  font-size: 1.4em;
}

.info-box {
  box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
  border-radius: .25rem;
  background-color: #fff;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1rem;
  min-height: 80px;
  padding: 1.1rem;
  position: relative;
  width: 100%;
}

.dark-mode .info-box {
  background-color: #343a40;
  color: #fff;
}
/* <uniquifier>: Use a unique and descriptive class name
 <weight>: Use a value from 100 to 900*/

.inter-b100 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
}

.inter-b200 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}

.inter-b300 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.inter-b400 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.inter-b500 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

.inter-b600 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.inter-b700 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

.inter-b800 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
}

.inter-b900 {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}