.icon {
  display: block;
  width: 48px;
  height: 48px;
}

span.rotate90 {
  transform: rotate(90deg);
}

img.verified-icon {
  width: 1em;
  height: 1em;
  // about 1 white space's width
  margin-inline-start: 0.3em;
  vertical-align: middle;
}

img.material-icon {
  width: 1em;
  height: 1em;
  vertical-align: middle;
  transform: translate(0px, -0.07em);
}

i.material-svg-icon {
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: var(--globalText);
  display: inline-block;
  height: 1.15em;
  width: 1.15em;
  -webkit-mask-size: 1.15em;
  mask-size: 1.15em;
  margin-inline-start: 0.3em;
  margin-inline-end: 0.3em;
  vertical-align: middle;
}

i.material-icon-schedule {
  mask-image: url(./images/icons/schedule.svg);
  -webkit-mask-image: url(./images/icons/schedule.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-server {
  mask-image: url(./images/icons/server.svg);
  -webkit-mask-image: url(./images/icons/server.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-blocked {
  mask-image: url(./images/icons/blocked.svg);
  -webkit-mask-image: url(./images/icons/blocked.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-trash {
  mask-image: url(./images/icons/trash.svg);
  -webkit-mask-image: url(./images/icons/trash.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-edit {
  mask-image: url(./images/icons/edit.svg);
  -webkit-mask-image: url(./images/icons/edit.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-copy {
  mask-image: url(./images/icons/copy.svg);
  -webkit-mask-image: url(./images/icons/copy.svg);
  transform: translate(0px, -0.07em);
}

i.material-icon-plus {
  mask-image: url(./images/icons/plus.svg);
  -webkit-mask-image: url(./images/icons/plus.svg);
  transform: translate(0px, -0.07em);
}
