.mk-iconBox-gradient .icon {
  display: inline-block;
  position: relative;
  transition: background-color 0.2s linear;
}
.mk-iconBox-gradient .icon i svg {
  transition: color .2s linear;
  margin-top: -2px;
  vertical-align: middle;
}
.mk-iconBox-gradient .icon svg:not(.mk-svg-icon) {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: none; 
  z-index: 1;
  color: #81d742;
}

.Firefox .mk-iconBox-gradient .icon {
  background: initial !important;
}
.Firefox .mk-iconBox-gradient .icon i,
.Firefox .mk-iconBox-gradient .icon .mk-svg-icon {
  position: relative;
  z-index: 2;
}
.Firefox .mk-iconBox-gradient .icon svg:not(.mk-svg-icon) {
  display: block;
}
.Firefox .mk-iconBox-gradient .icon svg:not(.mk-svg-icon) path {
  transition: fill 0.2s linear;
  display: none;
}
.Firefox .icon.linear-gradient svg:not(.mk-svg-icon) radialGradient {
  display: none;
}
.Firefox .icon.radial-gradient svg:not(.mk-svg-icon) linearGradient {
  display: none;
}

.Firefox .icon.circle svg:not(.mk-svg-icon) path#circle,
.Firefox .icon.hexagon svg:not(.mk-svg-icon) path#hexagon,
.Firefox .icon.hexagon2 svg:not(.mk-svg-icon) path#hexagon2,
.Firefox .icon.pentagon svg:not(.mk-svg-icon) path#pentagon,
.Firefox .icon.square svg:not(.mk-svg-icon) path#square,
.Firefox .icon.square2 svg:not(.mk-svg-icon) path#square2,
.Firefox .icon.starz svg:not(.mk-svg-icon) path#starz {
  display: block;
}

.icon.circle.size-128,
.icon.hexagon.size-128,
.icon.hexagon2.size-128,
.icon.starz.size-128 {
  min-width: 300px;
  min-height: 300px;
  line-height: 300px;
  text-align: center;
}
.icon.circle.size-64,
.icon.hexagon.size-64,
.icon.hexagon2.size-64,
.icon.starz.size-64 {
  min-width: 200px;
  min-height: 200px;
  line-height: 200px;
  text-align: center;
}
.icon.circle.size-48,
.icon.hexagon.size-48,
.icon.hexagon2.size-48,
.icon.starz.size-48 {
  min-width: 160px;
  min-height: 160px;
  line-height: 160px;
  text-align: center;
}
.icon.circle.size-32,
.icon.hexagon.size-32,
.icon.hexagon2.size-32,
.icon.starz.size-32 {
  min-width: 110px;
  min-height: 110px;
  line-height: 110px;
  text-align: center;
}
.icon.circle.size-16,
.icon.hexagon.size-16,
.icon.hexagon2.size-16,
.icon.starz.size-16 {
  min-width: 60px;
  min-height: 60px;
  line-height: 60px;
  text-align: center;
}
.icon.pentagon.size-128 {
  min-width: 330px;
  min-height: 330px;
  line-height: 330px;
  text-align: center;
}
.icon.pentagon.size-64 {
  min-width: 215px;
  min-height: 215px;
  line-height: 215px;
  text-align: center;
}
.icon.pentagon.size-48 {
  min-width: 160px;
  min-height: 160px;
  line-height: 160px;
  text-align: center;
}
.icon.pentagon.size-32 {
  min-width: 125px;
  min-height: 125px;
  line-height: 125px;
  text-align: center;
}
.icon.pentagon.size-16 {
  min-width: 70px;
  min-height: 70px;
  line-height: 70px;
  text-align: center;
}
.icon.square.size-128 {
  min-width: 290px;
  min-height: 290px;
  line-height: 290px;
  text-align: center;
}
.icon.square.size-64 {
  min-width: 200px;
  min-height: 200px;
  line-height: 200px;
  text-align: center;
}
.icon.square.size-48 {
  min-width: 140px;
  min-height: 140px;
  line-height: 140px;
  text-align: center;
}
.icon.square.size-32 {
  min-width: 100px;
  min-height: 100px;
  line-height: 100px;
  text-align: center;
}
.icon.square.size-16 {
  min-width: 60px;
  min-height: 60px;
  line-height: 60px;
  text-align: center;
}
.icon.square2.size-128 {
  min-width: 370px;
  min-height: 370px;
  line-height: 370px;
  text-align: center;
}
.icon.square2.size-64 {
  min-width: 250px;
  min-height: 250px;
  line-height: 250px;
  text-align: center;
}
.icon.square2.size-48 {
  min-width: 180px;
  min-height: 180px;
  line-height: 180px;
  text-align: center;
}
.icon.square2.size-32 {
  min-width: 130px;
  min-height: 130px;
  line-height: 130px;
  text-align: center;
}
.icon.square2.size-16 {
  min-width: 80px;
  min-height: 80px;
  line-height: 80px;
  text-align: center;
}