/*
@styleguide

@title Icons

Use the icon classes on `<i>` & `<span>` elements.

<i class="icon-warning"></i>
<i class="icon-one"></i>
<i class="icon-progress-active"></i>
<i class="icon-progress-late"></i>
<i class="icon-progress-skipped"></i>
<i class="icon-progress-plus"></i>
<i class="icon-progress-stop"></i>
<i class="icon-progress-complete"></i>
<i class="icon-progress-incomplete"></i>
<i class="icon-search"></i>
<i class="icon-menu"></i>
<i class="icon-atoms"></i>
<i class="icon-australia"></i>
<i class="icon-badge"></i>
<i class="icon-bank"></i>
<i class="icon-battery"></i>
<i class="icon-book"></i>
<i class="icon-boxer"></i>
<i class="icon-brains"></i>
<i class="icon-brochure"></i>
<i class="icon-circuit"></i>
<i class="icon-clock"></i>
<i class="icon-cloning"></i>
<i class="icon-clouds"></i>
<i class="icon-cloudstream"></i>
<i class="icon-connectivity"></i>
<i class="icon-crystalball"></i>
<i class="icon-demagnify"></i>
<i class="icon-document"></i>
<i class="icon-earth"></i>
<i class="icon-electric"></i>
<i class="icon-ethernet"></i>
<i class="icon-exhibition"></i>
<i class="icon-fastclouds"></i>
<i class="icon-fibre"></i>
<i class="icon-filofax"></i>
<i class="icon-flag"></i>
<i class="icon-gavel"></i>
<i class="icon-handshake"></i>
<i class="icon-heart"></i>
<i class="icon-infinity"></i>
<i class="icon-left-justify"></i>
<i class="icon-lightbulb"></i>
<i class="icon-list"></i>
<i class="icon-literature"></i>
<i class="icon-marker"></i>
<i class="icon-megaphone"></i>
<i class="icon-mixer"></i>
<i class="icon-newspaper"></i>
<i class="icon-nz"></i>
<i class="icon-party"></i>
<i class="icon-placemarker"></i>
<i class="icon-plugin"></i>
<i class="icon-profile"></i>
<i class="icon-puzzle"></i>
<i class="icon-racks"></i>
<i class="icon-rescue"></i>
<i class="icon-roads"></i>
<i class="icon-rocket"></i>
<i class="icon-router"></i>
<i class="icon-security"></i>
<i class="icon-siren"></i>
<i class="icon-sissors"></i>
<i class="icon-tags"></i>
<i class="icon-tie"></i>
<i class="icon-twohalves"></i>
<i class="icon-user"></i>
<i class="icon-venn"></i>
<i class="icon-video"></i>
<i class="icon-voice"></i>
<i class="icon-vocusv"></i>
<i class="icon-favicon"></i>
<i class="icon-vocus-rings"></i>
<i class="icon-arrow-left-circle"></i>
<i class="icon-arrow-right-circle"></i>
<i class="icon-arrow-up-circle"></i>
<i class="icon-arrow-down-circle"></i>
<i class="icon-chevron-right"></i>
<i class="icon-save"></i>
<i class="icon-info"></i>
<i class="icon-star"></i>
<i class="icon-settings"></i>
*/

/* hidden ones
<i class="icon-apidocs"></i>
<i class="icon-npm"></i>
<i class="icon-vocus"></i>
*/




@font-face {
    font-family: 'icomoon';
    src:    url('../fonts/icomoon.eot?4qugvq');
    src:    url('../fonts/icomoon.eot?4qugvq#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?4qugvq') format('truetype'),
        url('../fonts/icomoon.woff?4qugvq') format('woff'),
        url('../fonts/icomoon.svg?4qugvq#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}


[class^="icon-"], [class*=" icon-"], .icomoon {
	@mixin icomoon;
}


.icon-tick:before {
    content: "\e913";
}
.icon-x:before {
    content: "\e914";
}
.icon-info:before {
    content: "\e900";
}
.icon-billing:before {
    content: "\e901";
}
.icon-briefcase:before {
    content: "\e902";
}
.icon-clock:before {
    content: "\e903";
}
.icon-dash:before {
    content: "\e904";
}
.icon-deliver:before {
    content: "\e905";
}
.icon-door:before {
    content: "\e906";
}
.icon-download:before {
    content: "\e907";
}
.icon-drag:before {
    content: "\e908";
}
.icon-minus:before {
    content: "\e909";
}
.icon-pen:before {
    content: "\e90a";
}
.icon-plus:before {
    content: "\e90b";
}
.icon-quote:before {
    content: "\e90c";
}
.icon-refresh:before {
    content: "\e910";
}
.icon-search:before {
    content: "\e911";
}
.icon-user:before {
    content: "\e912";
}





/* aditions */
/*.icon-plus{
  position: relative;
  left: 0;
  top: 3px;
  margin-right: 11px;
  margin-left: 4px;
  &:before, &:after{
    content: "";
    background: #fff;
    position: absolute;
  }
  &:before{
    width: 9px;
    height: 1px;
    left: -4px;
    top: 5px;
  }
  &:after{
    width: 1px;
    height: 9px;
    top: 1px;
    left: 0;
  }
}*/