/* Rules for sizing the icon. */
.material-icons.md-18, .mi.md-18 { font-size: 18px; }
.material-icons.md-24, .mi.md-24 { font-size: 24px; }
.material-icons.md-36, .mi.md-36 { font-size: 36px; }
.material-icons.md-48, .mi.md-48 { font-size: 48px; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark, .mi.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive, .mi.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light, .mi.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive, .mi.md-inactive { color: rgba(255, 255, 255, 0.3); }

/* Rules to rotate items */
.material-icons.r90, .mi.r90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.material-icons.r180, .mi.r180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.material-icons.r270, .mi.r270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
.material-icons.flip-horizontal, .mi.flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.material-icons.flip-vertical, .mi.flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}
