@import "variables";

@font-face {
  font-family: 'styleguide-icon';
  src: url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8R/eoAAAC8AAAAYGNtYXAfVsKMAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5ZpLTukUAAAF4AAAC0GhlYWQKZab1AAAESAAAADZoaGVhB9wD6AAABIAAAAAkaG10eB4dAEgAAASkAAAAKGxvY2EDQgLIAAAEzAAAABZtYXhwAA8ASwAABOQAAAAgbmFtZZlKCfsAAAUEAAABhnBvc3QAAwAAAAAGjAAAACAAAwO7AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADhBQPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg4QX//f//AAAAAAAg4QD//f//AAH/4x8EAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAACACj/9gQaA8EADgBIAAABPgMXHgEOAQcOATkBBTAOAiMiJjEwPgInLgEjKgEHIg4CBw4BBw4BIyImJyYGMTAGFx4BHwEeARceAT4BMTcwPgIHAfoCOkxOFhYOEjIqU08CH0xzhTlxF6mzcDglekkHDgcqW1lTIhkiCAoXDB01GCcoQ0Mycj0FEVI8PqaVZ4IGBgMEAa9kjlIVFhVBSEkdOwRkNT81YkmQ1o86RQEdQWpMOYNFBQQQDiEifhsRGwcBToAuMAgcJ0p0eEQwAAAAAwAA/6sEAAMrAAIACgAOAAABMwMnMxMjJyEHIwchFSEBmsxmKlTqYC7+9DBg6gQA/AABqwEOcv2qgICAqgAAAAEAAP/SA+4DwAAnAAAlAT4BNTQuAiMiBgcXFhQPAQYiLwEOARUUHgIzMjY3AR4BPwE2JgPr/jMQEi1OaTwWKhSnEhJmEjYSpwYGLU5pPCVEHgGLETMTZRMCjgGLHkQlPGlOLQYGpxI2EmYSEqcUKhY8aU4tEhD+MxQCE2UTMwAABAAA/8AEAAPAAAMABwALAA8AABMhESEBIREhBSERIQEhESEAAcD+QAJAAcD+QP3AAcD+QAJAAcD+QAPA/kABwP5AgP5AAcD+QAAAAAIAAP/ABAADwAATACcAAAEiDgIVFB4CMzI+AjU0LgIDIi4CNTQ+AjMyHgIVFA4CAgBqu4tQUIu7amq7i1BQi7tqUItpPDxpi1BQi2k8PGmLA8BQi7tqaruLUFCLu2pqu4tQ/IA8aYtQUItpPDxpi1BQi2k8AAAAAAIAIACAA+ADAAAFAAsAACUXCQEHFyUnCQE3JwJAYAFA/sBg4P6gYP7AAUBg4OBgAUABQGDg4GD+wP7AYOAAAAABAAAAAQAAIcOmWV8PPPUACwQAAAAAANOWMUYAAAAA05YxRgAA/6sEGgPBAAAACAACAAAAAAAAAAEAAAPA/8AAAAQdAAAAAAQaAAEAAAAAAAAAAAAAAAAAAAAKBAAAAAAAAAAAAAAAAgAAAAQdACgEAAAABAAAAAQAAAAEAAAABAAAIAAAAAAACgAUAB4AhgCmAOYBDAFIAWgAAAABAAAACgBJAAQAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEABwAAAAEAAAAAAAIABwBgAAEAAAAAAAMABwA2AAEAAAAAAAQABwB1AAEAAAAAAAUACwAVAAEAAAAAAAYABwBLAAEAAAAAAAoAGgCKAAMAAQQJAAEADgAHAAMAAQQJAAIADgBnAAMAAQQJAAMADgA9AAMAAQQJAAQADgB8AAMAAQQJAAUAFgAgAAMAAQQJAAYADgBSAAMAAQQJAAoANACkaWNvbW9vbgBpAGMAbwBtAG8AbwBuVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwaWNvbW9vbgBpAGMAbwBtAG8AbwBuaWNvbW9vbgBpAGMAbwBtAG8AbwBuUmVndWxhcgBSAGUAZwB1AGwAYQByaWNvbW9vbgBpAGMAbwBtAG8AbwBuRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==") format('truetype');
  font-weight: normal;
  font-style: normal;
}

[class^="styleguide-icon-"], [class*=" styleguide-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'styleguide-icon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.styleguide-icon-forms {
  &:before {
    content: $styleguide-icon-forms;
  }
}
.styleguide-icon-utilities {
  &:before {
    content: $styleguide-icon-utilities;
  }
}
.styleguide-icon-compositions {
  &:before {
    content: $styleguide-icon-compositions;
  }
}
.styleguide-icon-buttons {
  &:before {
    content: $styleguide-icon-buttons;
  }
}
.styleguide-icon-components {
  &:before {
    content: $styleguide-icon-components;
  }
}