3 * the iconic font designed for Bootstrap
4 * -------------------------------------------------------
5 * The full suite of pictographic icons, examples, and documentation
6 * can be found at: http://fontawesome.io
9 * -------------------------------------------------------
10 * - The Font Awesome font is licensed under the SIL Open Font License v1.1 -
11 * http://scripts.sil.org/OFL
12 * - Font Awesome CSS, LESS, and SASS files are licensed under the MIT License -
13 * http://opensource.org/licenses/mit-license.html
14 * - Font Awesome documentation licensed under CC BY 3.0 License -
15 * http://creativecommons.org/licenses/by/3.0/
16 * - Attribution is no longer required in Font Awesome 3.0, but much appreciated:
17 * "Font Awesome by Dave Gandy - http://fontawesome.io"
20 * -------------------------------------------------------
21 * Email: dave@fontawesome.io
22 * Twitter: http://twitter.com/fortaweso_me
23 * Work: Lead Product Designer @ http://kyruus.com
26 * -------------------------- */
28 font-family: 'FontAwesome';
29 src: url('../font/fontawesome-webfont.eot?v=3.1.0');
30 src: url('../font/fontawesome-webfont.eot?#iefix&v=3.1.0') format('embedded-opentype'), url('../font/fontawesome-webfont.woff?v=3.1.0') format('woff'), url('../font/fontawesome-webfont.ttf?v=3.1.0') format('truetype'), url('../font/fontawesome-webfont.svg#fontawesomeregular?v=3.1.0') format('svg');
35 * -------------------------- */
38 font-family: FontAwesome;
41 text-decoration: inherit;
42 -webkit-font-smoothing: antialiased;
45 [class^="icon-"]:before,
46 [class*=" icon-"]:before {
47 text-decoration: inherit;
48 display: inline-block;
51 /* makes the font 33% larger relative to the icon container */
54 font-size: 1.3333333333333333em;
56 /* makes sure icons active on rollover in links */
59 a [class^="icon-"]:before,
60 a [class*=" icon-"]:before {
63 /* increased font size for icon-large */
64 [class^="icon-"].icon-fixed-width,
65 [class*=" icon-"].icon-fixed-width {
66 display: inline-block;
67 width: 1.2857142857142858em;
70 [class^="icon-"].icon-fixed-width.icon-large,
71 [class*=" icon-"].icon-fixed-width.icon-large {
72 width: 1.5714285714285714em;
75 list-style-type: none;
76 text-indent: -0.7142857142857143em;
77 margin-left: 2.142857142857143em;
79 ul.icons-ul > li .icon-li {
80 width: 0.7142857142857143em;
81 display: inline-block;
84 [class^="icon-"].hide,
85 [class*=" icon-"].hide {
98 border: solid 1px #eeeeee;
99 padding: .2em .25em .15em;
100 -webkit-border-radius: 3px;
101 -moz-border-radius: 3px;
107 .icon-2x.icon-border {
109 -webkit-border-radius: 4px;
110 -moz-border-radius: 4px;
116 .icon-3x.icon-border {
118 -webkit-border-radius: 5px;
119 -moz-border-radius: 5px;
125 .icon-4x.icon-border {
127 -webkit-border-radius: 6px;
128 -moz-border-radius: 6px;
134 .icon-5x.icon-border {
136 -webkit-border-radius: 7px;
137 -moz-border-radius: 7px;
146 [class^="icon-"].pull-left,
147 [class*=" icon-"].pull-left {
150 [class^="icon-"].pull-right,
151 [class*=" icon-"].pull-right {
154 /* BOOTSTRAP SPECIFIC CLASSES
155 * -------------------------- */
156 /* Bootstrap 2.0 sprites.less reset */
163 vertical-align: baseline;
164 background-image: none;
165 background-position: 0% 0%;
166 background-repeat: repeat;
169 /* more sprites.less reset */
171 .nav-pills > .active > a > [class^="icon-"],
172 .nav-pills > .active > a > [class*=" icon-"],
173 .nav-list > .active > a > [class^="icon-"],
174 .nav-list > .active > a > [class*=" icon-"],
175 .navbar-inverse .nav > .active > a > [class^="icon-"],
176 .navbar-inverse .nav > .active > a > [class*=" icon-"],
177 .dropdown-menu > li > a:hover > [class^="icon-"],
178 .dropdown-menu > li > a:hover > [class*=" icon-"],
179 .dropdown-menu > .active > a > [class^="icon-"],
180 .dropdown-menu > .active > a > [class*=" icon-"],
181 .dropdown-submenu:hover > a > [class^="icon-"],
182 .dropdown-submenu:hover > a > [class*=" icon-"] {
183 background-image: none;
185 /* keeps Bootstrap styles with and without icons the same */
186 .btn [class^="icon-"].icon-large,
187 .nav [class^="icon-"].icon-large,
188 .btn [class*=" icon-"].icon-large,
189 .nav [class*=" icon-"].icon-large {
192 .btn [class^="icon-"].icon-spin,
193 .nav [class^="icon-"].icon-spin,
194 .btn [class*=" icon-"].icon-spin,
195 .nav [class*=" icon-"].icon-spin {
196 display: inline-block;
198 .nav-tabs [class^="icon-"],
199 .nav-pills [class^="icon-"],
200 .nav-tabs [class*=" icon-"],
201 .nav-pills [class*=" icon-"],
202 .nav-tabs [class^="icon-"].icon-large,
203 .nav-pills [class^="icon-"].icon-large,
204 .nav-tabs [class*=" icon-"].icon-large,
205 .nav-pills [class*=" icon-"].icon-large {
208 .btn [class^="icon-"].pull-left.icon-2x,
209 .btn [class*=" icon-"].pull-left.icon-2x,
210 .btn [class^="icon-"].pull-right.icon-2x,
211 .btn [class*=" icon-"].pull-right.icon-2x {
214 .btn [class^="icon-"].icon-spin.icon-large,
215 .btn [class*=" icon-"].icon-spin.icon-large {
218 .btn.btn-small [class^="icon-"].pull-left.icon-2x,
219 .btn.btn-small [class*=" icon-"].pull-left.icon-2x,
220 .btn.btn-small [class^="icon-"].pull-right.icon-2x,
221 .btn.btn-small [class*=" icon-"].pull-right.icon-2x {
224 .btn.btn-large [class^="icon-"],
225 .btn.btn-large [class*=" icon-"] {
228 .btn.btn-large [class^="icon-"].pull-left.icon-2x,
229 .btn.btn-large [class*=" icon-"].pull-left.icon-2x,
230 .btn.btn-large [class^="icon-"].pull-right.icon-2x,
231 .btn.btn-large [class*=" icon-"].pull-right.icon-2x {
234 .btn.btn-large [class^="icon-"].pull-left.icon-2x,
235 .btn.btn-large [class*=" icon-"].pull-left.icon-2x {
238 .btn.btn-large [class^="icon-"].pull-right.icon-2x,
239 .btn.btn-large [class*=" icon-"].pull-right.icon-2x {
243 * -------------------------- */
244 /* Stacked and layered icon */
247 display: inline-block;
251 vertical-align: -35%;
253 .icon-stack [class^="icon-"],
254 .icon-stack [class*=" icon-"] {
261 line-height: inherit;
264 .icon-stack .icon-stack-base {
268 /* Animated rotating icon */
270 display: inline-block;
271 -moz-animation: spin 2s infinite linear;
272 -o-animation: spin 2s infinite linear;
273 -webkit-animation: spin 2s infinite linear;
274 animation: spin 2s infinite linear;
276 @-moz-keyframes spin {
278 -moz-transform: rotate(0deg);
281 -moz-transform: rotate(359deg);
284 @-webkit-keyframes spin {
286 -webkit-transform: rotate(0deg);
289 -webkit-transform: rotate(359deg);
294 -o-transform: rotate(0deg);
297 -o-transform: rotate(359deg);
300 @-ms-keyframes spin {
302 -ms-transform: rotate(0deg);
305 -ms-transform: rotate(359deg);
310 transform: rotate(0deg);
313 transform: rotate(359deg);
316 /* Icon rotations and mirroring */
317 .icon-rotate-90:before {
318 -webkit-transform: rotate(90deg);
319 -moz-transform: rotate(90deg);
320 -ms-transform: rotate(90deg);
321 -o-transform: rotate(90deg);
322 transform: rotate(90deg);
323 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
325 .icon-rotate-180:before {
326 -webkit-transform: rotate(180deg);
327 -moz-transform: rotate(180deg);
328 -ms-transform: rotate(180deg);
329 -o-transform: rotate(180deg);
330 transform: rotate(180deg);
331 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
333 .icon-rotate-270:before {
334 -webkit-transform: rotate(270deg);
335 -moz-transform: rotate(270deg);
336 -ms-transform: rotate(270deg);
337 -o-transform: rotate(270deg);
338 transform: rotate(270deg);
339 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
341 .icon-flip-horizontal:before {
342 -webkit-transform: scale(-1, 1);
343 -moz-transform: scale(-1, 1);
344 -ms-transform: scale(-1, 1);
345 -o-transform: scale(-1, 1);
346 transform: scale(-1, 1);
348 .icon-flip-vertical:before {
349 -webkit-transform: scale(1, -1);
350 -moz-transform: scale(1, -1);
351 -ms-transform: scale(1, -1);
352 -o-transform: scale(1, -1);
353 transform: scale(1, -1);
355 /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
356 readers do not read off random characters that represent icons */
363 .icon-search:before {
366 .icon-envelope:before {
375 .icon-star-empty:before {
384 .icon-th-large:before {
390 .icon-th-list:before {
396 .icon-remove:before {
399 .icon-zoom-in:before {
402 .icon-zoom-out:before {
408 .icon-signal:before {
429 .icon-download-alt:before {
432 .icon-download:before {
435 .icon-upload:before {
441 .icon-play-circle:before {
445 .icon-rotate-right:before {
448 /* F020 doesn't work in Safari. all shifted one down */
449 .icon-refresh:before {
452 .icon-list-alt:before {
461 .icon-headphones:before {
464 .icon-volume-off:before {
467 .icon-volume-down:before {
470 .icon-volume-up:before {
473 .icon-qrcode:before {
476 .icon-barcode:before {
488 .icon-bookmark:before {
494 .icon-camera:before {
503 .icon-italic:before {
506 .icon-text-height:before {
509 .icon-text-width:before {
512 .icon-align-left:before {
515 .icon-align-center:before {
518 .icon-align-right:before {
521 .icon-align-justify:before {
527 .icon-indent-left:before {
530 .icon-indent-right:before {
533 .icon-facetime-video:before {
536 .icon-picture:before {
539 .icon-pencil:before {
542 .icon-map-marker:before {
545 .icon-adjust:before {
563 .icon-step-backward:before {
566 .icon-fast-backward:before {
569 .icon-backward:before {
581 .icon-forward:before {
584 .icon-fast-forward:before {
587 .icon-step-forward:before {
593 .icon-chevron-left:before {
596 .icon-chevron-right:before {
599 .icon-plus-sign:before {
602 .icon-minus-sign:before {
605 .icon-remove-sign:before {
608 .icon-ok-sign:before {
611 .icon-question-sign:before {
614 .icon-info-sign:before {
617 .icon-screenshot:before {
620 .icon-remove-circle:before {
623 .icon-ok-circle:before {
626 .icon-ban-circle:before {
629 .icon-arrow-left:before {
632 .icon-arrow-right:before {
635 .icon-arrow-up:before {
638 .icon-arrow-down:before {
641 .icon-share-alt:before,
642 .icon-mail-forward:before {
645 .icon-resize-full:before {
648 .icon-resize-small:before {
657 .icon-asterisk:before {
660 .icon-exclamation-sign:before {
672 .icon-eye-open:before {
675 .icon-eye-close:before {
678 .icon-warning-sign:before {
684 .icon-calendar:before {
687 .icon-random:before {
690 .icon-comment:before {
693 .icon-magnet:before {
696 .icon-chevron-up:before {
699 .icon-chevron-down:before {
702 .icon-retweet:before {
705 .icon-shopping-cart:before {
708 .icon-folder-close:before {
711 .icon-folder-open:before {
714 .icon-resize-vertical:before {
717 .icon-resize-horizontal:before {
720 .icon-bar-chart:before {
723 .icon-twitter-sign:before {
726 .icon-facebook-sign:before {
729 .icon-camera-retro:before {
738 .icon-comments:before {
741 .icon-thumbs-up:before {
744 .icon-thumbs-down:before {
747 .icon-star-half:before {
750 .icon-heart-empty:before {
753 .icon-signout:before {
756 .icon-linkedin-sign:before {
759 .icon-pushpin:before {
762 .icon-external-link:before {
765 .icon-signin:before {
768 .icon-trophy:before {
771 .icon-github-sign:before {
774 .icon-upload-alt:before {
783 .icon-check-empty:before {
786 .icon-bookmark-empty:before {
789 .icon-phone-sign:before {
792 .icon-twitter:before {
795 .icon-facebook:before {
798 .icon-github:before {
801 .icon-unlock:before {
804 .icon-credit-card:before {
813 .icon-bullhorn:before {
819 .icon-certificate:before {
822 .icon-hand-right:before {
825 .icon-hand-left:before {
828 .icon-hand-up:before {
831 .icon-hand-down:before {
834 .icon-circle-arrow-left:before {
837 .icon-circle-arrow-right:before {
840 .icon-circle-arrow-up:before {
843 .icon-circle-arrow-down:before {
849 .icon-wrench:before {
855 .icon-filter:before {
858 .icon-briefcase:before {
861 .icon-fullscreen:before {
873 .icon-beaker:before {
882 .icon-paper-clip:before {
888 .icon-sign-blank:before {
891 .icon-reorder:before {
894 .icon-list-ul:before {
897 .icon-list-ol:before {
900 .icon-strikethrough:before {
903 .icon-underline:before {
915 .icon-pinterest:before {
918 .icon-pinterest-sign:before {
921 .icon-google-plus-sign:before {
924 .icon-google-plus:before {
930 .icon-caret-down:before {
933 .icon-caret-up:before {
936 .icon-caret-left:before {
939 .icon-caret-right:before {
942 .icon-columns:before {
948 .icon-sort-down:before {
951 .icon-sort-up:before {
954 .icon-envelope-alt:before {
957 .icon-linkedin:before {
961 .icon-rotate-left:before {
967 .icon-dashboard:before {
970 .icon-comment-alt:before {
973 .icon-comments-alt:before {
979 .icon-sitemap:before {
982 .icon-umbrella:before {
988 .icon-lightbulb:before {
991 .icon-exchange:before {
994 .icon-cloud-download:before {
997 .icon-cloud-upload:before {
1000 .icon-user-md:before {
1003 .icon-stethoscope:before {
1006 .icon-suitcase:before {
1009 .icon-bell-alt:before {
1012 .icon-coffee:before {
1018 .icon-file-alt:before {
1021 .icon-building:before {
1024 .icon-hospital:before {
1027 .icon-ambulance:before {
1030 .icon-medkit:before {
1033 .icon-fighter-jet:before {
1039 .icon-h-sign:before {
1042 .icon-plus-sign-alt:before {
1045 .icon-double-angle-left:before {
1048 .icon-double-angle-right:before {
1051 .icon-double-angle-up:before {
1054 .icon-double-angle-down:before {
1057 .icon-angle-left:before {
1060 .icon-angle-right:before {
1063 .icon-angle-up:before {
1066 .icon-angle-down:before {
1069 .icon-desktop:before {
1072 .icon-laptop:before {
1075 .icon-tablet:before {
1078 .icon-mobile-phone:before {
1081 .icon-circle-blank:before {
1084 .icon-quote-left:before {
1087 .icon-quote-right:before {
1090 .icon-spinner:before {
1093 .icon-circle:before {
1097 .icon-mail-reply:before {
1100 .icon-folder-close-alt:before {
1103 .icon-folder-open-alt:before {
1106 .icon-expand-alt:before {
1109 .icon-collapse-alt:before {
1112 .icon-smile:before {
1115 .icon-frown:before {
1121 .icon-gamepad:before {
1124 .icon-keyboard:before {
1127 .icon-flag-alt:before {
1130 .icon-flag-checkered:before {
1133 .icon-terminal:before {
1139 .icon-reply-all:before {
1142 .icon-mail-reply-all:before {
1145 .icon-star-half-full:before,
1146 .icon-star-half-empty:before {
1149 .icon-location-arrow:before {
1155 .icon-code-fork:before {
1158 .icon-unlink:before {
1161 .icon-question:before {
1167 .icon-exclamation:before {
1170 .icon-superscript:before {
1173 .icon-subscript:before {
1176 .icon-eraser:before {
1179 .icon-puzzle-piece:before {
1182 .icon-microphone:before {
1185 .icon-microphone-off:before {
1188 .icon-shield:before {
1191 .icon-calendar-empty:before {
1194 .icon-fire-extinguisher:before {
1197 .icon-rocket:before {
1200 .icon-maxcdn:before {
1203 .icon-chevron-sign-left:before {
1206 .icon-chevron-sign-right:before {
1209 .icon-chevron-sign-up:before {
1212 .icon-chevron-sign-down:before {
1215 .icon-html5:before {
1221 .icon-anchor:before {
1224 .icon-unlock-alt:before {
1227 .icon-bullseye:before {
1230 .icon-ellipsis-horizontal:before {
1233 .icon-ellipsis-vertical:before {
1236 .icon-rss-sign:before {
1239 .icon-play-sign:before {
1242 .icon-ticket:before {
1245 .icon-minus-sign-alt:before {
1248 .icon-check-minus:before {
1251 .icon-level-up:before {
1254 .icon-level-down:before {
1257 .icon-check-sign:before {
1260 .icon-edit-sign:before {
1263 .icon-external-link-sign:before {
1266 .icon-share-sign:before {