:root {
  --btomls: #1e4b8c;
  --btomls-dl: #1e4b8c;
  --btn-bg-define: #001689
}

.color-21417a {
  color: #21417a;
}

.color-edddb0 {
  color: #edddb0;
}

.color-1f4b8c {
  color: #1f4b8c;
}

.color-CE755C {
  color: #ce755c;
}

.color-494a4b {
  color: #494a4b;
}

.color-989898 {
  color: #989898;
}

.color-ff8100 {
  color: #ff8100;
}

.color-0045FF {
  color: #0045ff;
}

.color-001689 {
  color: #001689 !important;
}

/* .color-00BEFF {
  color: #00BEFF;
} */
.color-01BEFF {
  color: #01BEFF;
}
.color-F86A76 {
  color: #F86A76;
}

.fz-2-5 {
  font-size: clamp(34px, 2.5rem, 7vw);
}

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

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

.fw-300 {
  font-weight: 300 !important;
}

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

.fw-600 {
  font-weight: 600 !important;
}

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

.fz-06 {
  font-size: 0.6rem;
}

.bg-06C755 {
  background-color: #06c755;
}

.bg-21417a {
  background-color: #21417a;
  color: #fff;
}

.bg-ce755c {
  background-color: #ce755c;
  color: #fff;
}

.bg-f3f1ef {
  background-color: #f5f5f5;
}

.bg-f5f5f5 {
  background-color: #f5f5f5;
}

.bg-0045ff {
  background-color: #0045ff;
}

.bg-01BEFF {
  background-color: #01BEFF;
}

.bg-001689 {
  background-color: #001689;
}

.bg-fede0f {
  background-color: #fede0f
}

.bg-ff8100 {
  background-color: #ff8100 !important;
}

.bg-gradient-ph55-headiine {
  background-image: linear-gradient(180deg, #fff 50%, #f5f5f5 100%);
}

.bg-shareimg {
  background-image: url(../img/share-bg.jpg);
  background-size: cover;
}

.no-after::after {
  display: none !important;
}

.text-shadow-yellow {
  text-shadow: #ff0;
}

.bg-highlight {
  background-image: url(../img/highlight-bg-2.png);
  background-size: cover;
}

.gradient-bar {
  background-color: #001689;
  height: 4px;
}

.gradient-bar-fill-h {
  border-radius: 5rem;
  background-color: #001689;
  text-align: center;
  color: #fff;
  font-weight: 900;
  font-size: 2em;
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.gradient-bar-fill-h.orange {
  background-color: #ff8e00;
}

.gradient-bar-fill-h.pink {
  background-color: rgba(248, 106, 118, 1);
}

.gradient-bar-fill-h.golden {
  background-image: linear-gradient(90deg,
      rgba(223, 180, 40, 0),
      rgba(223, 180, 40, 1) 20%,
      rgba(223, 180, 40, 1) 50%,
      rgba(223, 180, 40, 1) 80%,
      rgba(223, 180, 40, 0) 100%);
}

.gradient-bar-fill-h.sms {
  font-size: 1.3em;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.but-outline-mls {
  color: var(--btomls);
  border-color: var(--btomls);
  border-radius: 50rem;
}

.but-outline-mls:hover {
  color: #fff;
  background-color: var(--btomls);
  border-color: var(--btomls);
}

.but-outline-mls:focus {
  box-shadow: none;
}

.but--mls {
  color: var(--btomls-dl);
  background-color: transparent;
  border-radius: 50rem;
  border: 2px solid var(--btomls-dl);
}

.but--mls:hover {
  color: #fff;
  background-color: var(--btomls-dl);
  border-radius: 50rem;
  border: 2px solid #ebebeb;
}

.btn-0045FF {
  border-radius: 5rem;
  background-color: #0045ff;
  /* border: #001689 1px solid; */
  font-weight: 900;
  display: inline-block;
  padding: 7px 20px;
  text-align: center;
  color: #fff;
  /* letter-spacing:1px; */
}

.btn-0045FF:hover {
  background-color: #001689;
  color: #fff;
}

.btn-00beff {
  border-radius: 5rem;
  background-color: #00beff;
  font-weight: 900;
  display: inline-block;
  padding: 7px 20px;
  text-align: center;
  color: #fff;
}

.btn-00beff:hover {
  background-color: #001689;
  color: #fff;
}

.btn-define {
  border-radius: 5rem;
  background-color: var(--btn-bg-define);
  font-weight: 900;
  display: inline-block;
  padding: 7px 20px;
  text-align: center;
  color: #fff;
  border: solid 1px transparent;
}

.btn-define:hover {
  background-color: #fff;
  color: var(--btn-bg-define);
  border: solid 1px var(--btn-bg-define);
}


.btn-001689-outline {
  border: 1px solid #001689;
  background-color: #fff;
  color: #001689;
}

.btn-001689-outline :hover {
  border: 1px solid #001689;
  background-color: #001689;
  color: #fff;
}

.btn-00beff-outline {
  border: 1px solid #00beff;
  background-color: #fff;
  color: #00beff;
}

.btn-00beff-outline :hover {
  border: 1px solid #00beff;
  background-color: #00beff;
  color: #fff;
}

.shadow-25 {
  box-shadow: 1.59px 2.544px 4px 0px rgba(0, 0, 0, 0.18);
}

.font-sans {
  font-family: sans-serif;
}

.mapricon {
  display: flex;
  align-items: center;
  position: relative;
  height: 4rem;
}

.mapricon>.micon {
  background-image: url("../img/pricon-fill.svg");
  background-size: contain;
  background-repeat: no-repeat;
  width: 4rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
  color: #fff;
  z-index: 4;
  position: relative;
}

.mapricon:before {
  content: '';
  position: absolute;
  width: 2rem;
  height: 3rem;
  left: 2rem;
  top: calc(50% - 1.5rem);
  background-color: #001689;
  z-index: 3;
}

.mapricon>.micon.sixdeg {
  width: 4.5rem;
  background-image: url("../img/pricon-fill-2.svg");
}

.mapricon>.minfo {
  display: flex;
  align-items: center;
  padding: 0 1.5rem 0 0.7rem;
  height: 3rem;
  background-color: #001689;
  color: #fff;
  border-radius: 0 30px 30px 0;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 0;
}

.mapricon.sixdeg:before {
  width: 2.5rem;
  background-color: #ffc070;
}

.mapricon.sixdeg>.minfo {
  background-color: #ffc070;
}

.pointer-events-none {
  pointer-events: none;
}
.ol-round{
  font-size: calc(var(--ol-wh) * 0.7);
  width: var(--ol-wh);
  height:var(--ol-wh);
  color: var(--ol-color);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 768px) {
  .fz-06 {
    font-size: 0.6rem;
  }

  .bg-highlight {
    background-size: contain;
  }
}