/* Stylesheets */
@import url("./import/icon-bold.css");
@import url("./import/icon-line.css");
@import url("./import/icon-duo.css");
@import url("./import/icon-brand.css");
@import url("./import/icon-flag.css");
@import url("./import/icon-file.css");
@import url("./import/icon-page.css");

/* Icon */
.cs-icon {
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  justify-content: center;
  align-items: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 38px;
  height: 38px;
  opacity: 100%;
}

/* States */
.ic {
  opacity: 100%;
  filter: invert(87%) sepia(12%) saturate(0%) hue-rotate(197deg) brightness(89%) contrast(87%);
}

.ic:hover {
  opacity: 100%;
  filter: invert(29%) sepia(85%) saturate(5936%) hue-rotate(261deg) brightness(94%) contrast(107%);
}

.ic:active {
  opacity: 100%;
  filter: invert(29%) sepia(85%) saturate(5936%) hue-rotate(261deg) brightness(94%) contrast(107%);
}

/* Colors */
.ic-primary {
  opacity: 100%;
  filter: invert(26%) sepia(33%) saturate(5737%) hue-rotate(256deg) brightness(59%) contrast(130%) !important;
}

.ic-success {
  opacity: 100%;
  filter: invert(31%) sepia(43%) saturate(1584%) hue-rotate(115deg) brightness(95%) contrast(101%) !important;
}

.ic-error {
  opacity: 100%;
  filter: invert(10%) sepia(78%) saturate(6543%) hue-rotate(341deg) brightness(71%) contrast(126%) !important;
}

.ic-warning {
  opacity: 100%;
  filter: invert(34%) sepia(16%) saturate(6357%) hue-rotate(28deg) brightness(93%) contrast(104%) !important;
}

.ic-info {
  opacity: 100%;
  filter: invert(26%) sepia(33%) saturate(5737%) hue-rotate(256deg) brightness(59%) contrast(130%) !important;
}

/* Opacity */
.opacity-10 {
  opacity: 10% !important;
}

.opacity-20 {
  opacity: 20% !important;
}

.opacity-30 {
  opacity: 30% !important;
}

.opacity-40 {
  opacity: 40% !important;
}

.opacity-50 {
  opacity: 50% !important;
}

.opacity-60 {
  opacity: 60% !important;
}

.opacity-70 {
  opacity: 70% !important;
}

.opacity-80 {
  opacity: 80% !important;
}

.opacity-90 {
  opacity: 90% !important;
}

.opacity-100 {
  opacity: 100% !important;
}

/* Sizes */
.ic-xxs {
  width: 12px;
  height: 12px;
}

.ic-xs {
  width: 14px;
  height: 14px;
}

.ic-sm {
  width: 16px;
  height: 16px;
}

.ic-md {
  width: 18px;
  height: 18px;
}

.ic-big {
  width: 20px;
  height: 20px;
}

.ic-lg {
  width: 26px;
  height: 26px;
}

.ic-xl {
  width: 30px;
  height: 30px;
}

.ic-xxl {
  width: 38px;
  height: 38px;
}

.ic-huge {
  width: 50px;
  height: 50px;
}

.ic-mega {
  width: 68px;
  height: 68px;
}

.ic-ultra {
  width: 100px;
  height: 100px;
}
