// Font path

@font-face {
  font-family: @icon-font-name;
  src: url('@{icon-font-path}/@{icon-font-file-name}.eot?v=@{icon-font-version}');
  src: url('@{icon-font-path}/@{icon-font-file-name}.eot?#iefix&v=@{icon-font-version}') format('embedded-opentype'),
    url('@{icon-font-path}/@{icon-font-file-name}.woff?v=@{icon-font-version}') format('woff'),
    url('@{icon-font-path}/@{icon-font-file-name}.ttf?v=@{icon-font-version}') format('truetype'),
    url('@{icon-font-path}/@{icon-font-file-name}.svg#regular?v=@{icon-font-version}') format('svg');
  font-weight: normal;
  font-style: normal;
}


// Core style

[class^="icon-"],
[class*=" icon-"] {
  .icon-zenicon();
}

.icon:before {
  display: inline-block;
  min-width: 14*@rem;
  text-align: center;
}


// Sizes

.icon-3x {font-size: @icon-font-size*3;}
.icon-2x {font-size: @icon-font-size*2;}


// EXTRAS

// Prevent stack and spinners from being taken inline when inside a link
a .icon.spin {
  display: inline-block;
  text-decoration: none;
}

// ensure rotation occurs
.icon.rotate-90,
.icon.rotate-180,
.icon.rotate-270,
.icon.flip-h,
.icon.flip-v {
  &:before { display: inline-block; }
}