body,
html {
  font-family: "Vazir";
  font-size: 0.875rem;
  font-weight: 300;
  height: 100%;
  transition: all 0.5s;
}

body::before {
  display: block;
  content: "";
  height: 30px;
}

#Lcolor {
  color: #f0a500 !important;
  white-space: nowrap;
  font-weight: bolder;
}

.custom-image {
  max-width: 80px;
  height: auto;
  transition: all 0.5s;
}
.custom-image:hover {
  transform: scale(1.5);
}
.my-icon {
  font-size: 2rem;
  margin: 0 1rem;
  color: gray;
  transition: all 0.8s;
}
.my-icon:hover {
  margin: 0 1rem;
  color: gold;
}

.Bmmd {
  font-size: 3rem;
  margin: 1rem 2rem;
  color: #21325e;
  cursor: pointer;
  transition: all 0.5s;
}
.Bmmd:hover {
  color: #f0a500;
}

@media (min-width: 768px) {
  .mobile {
    width: 50%;
  }
}

.blue {
  background-color: #21325e !important;
}
.yellow {
  background-color: #f0a500 !important;
}

.gray {
  background-color: #595260;
}
.light_gray {
  background-color: #b2b1b9;
}

.boxes {
  height: 300px;
}

.owerF {
  overflow: hidden;
  object-fit: cover;
}

.hover {
  transition: all 1s;
}
.hover:hover {
  transform: scale(1.2);
}