/* ==========================================================================
   Capital Framework
   Icons
   ========================================================================== */


/* topdoc
  name: Less variables
  family: cf-icons
  notes:
    - "These variables can be overriden in your project's Less file."
  patterns:
    - name: CSS prefix
      codenotes:
        - "$cf-icon-prefix: cf-icon;"
    - name: Path to icon font files
      codenotes:
        - "$cf-icon-path: '../fonts';"
    - name: Icon border color
      codenotes:
        - "$cf-border-color: #eee;"
      notes:
        - "Used in .cf-icon__border"
  tags:
    - cf-icons
*/

$cf-icon-prefix:                cf-icon;
$cf-icon-path:                  '../font';
$cf-icon-border-color:          #eee;


/* topdoc
  name: The basics
  family: cf-icons
  patterns:
    - name: "@font-face declaration"
    - name: Base icon class
      notes:
        - "The cf-icon-prefix class applies all shared icon styles including the
          font family."
        - "All icons must use two classes, one for this base class and another
          to set the font character. For example:
          <span class='cf-icon cf-icon-left'></span>."
        - "Please use the span element instead of the i element. This avoids
          font family cascading conflicts when using an italic webfont on i
          elements and then another font for the icons. Note that this issue
          only pops up in older versions of Internet Explorer."
  tags:
    - cf-icons
*/

@font-face {
  font-family: 'CFPB Minicons';
  src: url('#{$cf-icon-path}/cf-icons.eot');
  src: url('#{$cf-icon-path}/cf-icons.eot?#iefix') format('embedded-opentype'),
    url('#{$cf-icon-path}/cf-icons.woff') format('woff'),
    url('#{$cf-icon-path}/cf-icons.ttf') format('truetype'),
    url('#{$cf-icon-path}/cf-icons.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

// The class .cf-icon is used to support adding these rules via a mixin,
// specifically when $cf-icon-prefix is changed to something other than
// 'cf-icon', since string interpolation is incompatible with mixin calls.
//
// For example you can't do this:
// .link-with-auto-icon {
//   .#{$cf-icon-prefix}();
// }
//
// But you can do this:
// .link-with-auto-icon {
//   .$cf-icon();
// }
.cf-icon,
.#{$cf-icon-prefix} {
  font-family: 'CFPB Minicons';
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}


/* topdoc
  name: Icon character variables
  family: cf-icons
  patterns:
    - name: Less variables for icons
      codenotes:
        - "$cf-icon-left:                       '\e000';"
        - "$cf-icon-left-round:                 '\e001';"
      notes:
        - "These variables for fonts are used for adding icons in
          Less files."
        - "See the less file for the full list."
  tags:
    - cf-icons
  notes:
       - "Inspired by Font Awesome"
*/

// Navigation icons

$cf-icon-left:                       "\e000";
$cf-icon-left-round:                 "\e001";
$cf-icon-right:                      "\e002";
$cf-icon-right-round:                "\e003";
$cf-icon-up:                         "\e004";
$cf-icon-up-round:                   "\e005";
$cf-icon-down:                       "\e006";
$cf-icon-down-round:                 "\e007";
$cf-icon-arrow-left:                 "\e008";
$cf-icon-arrow-left-round:           "\e009";
$cf-icon-arrow-right:                "\e010";
$cf-icon-arrow-right-round:          "\e011";
$cf-icon-arrow-up:                   "\e012";
$cf-icon-arrow-up-round:             "\e013";
$cf-icon-arrow-down:                 "\e014";
$cf-icon-arrow-down-round:           "\e015";

// Status icons

$cf-icon-approved:                   "\e100";
$cf-icon-approved-round:             "\e101";
$cf-icon-error:                      "\e102";
$cf-icon-error-round:                "\e103";
$cf-icon-help:                       "\e104";
$cf-icon-help-round:                 "\e105";
$cf-icon-delete:                     "\e106";
$cf-icon-delete-round:               "\e107";
$cf-icon-plus:                       "\e108";
$cf-icon-plus-round:                 "\e109";
$cf-icon-minus:                      "\e110";
$cf-icon-minus-round:                "\e111";
$cf-icon-update:                     "\e112";
$cf-icon-update-round:               "\e113";

// Social icons

$cf-icon-youtube:                    "\e200";
$cf-icon-youtube-square:             "\e201";
$cf-icon-linkedin:                   "\e202";
$cf-icon-linkedin-square:            "\e203";
$cf-icon-facebook:                   "\e204";
$cf-icon-facebook-square:            "\e205";
$cf-icon-flickr:                     "\e206";
$cf-icon-flickr-square:              "\e207";
$cf-icon-twitter:                    "\e208";
$cf-icon-twitter-square:             "\e209";
$cf-icon-github:                     "\e210";
$cf-icon-github-square:              "\e211";
$cf-icon-email-social:               "\e212";
$cf-icon-email-social-square:        "\e213";

// Communication icons

$cf-icon-web:                        "\e300";
$cf-icon-web-round:                  "\e301";
$cf-icon-email:                      "\e302";
$cf-icon-email-round:                "\e303";
$cf-icon-mail:                       "\e304";
$cf-icon-mail-round:                 "\e305";
$cf-icon-phone:                      "\e306";
$cf-icon-phone-round:                "\e307";
$cf-icon-technology:                 "\e308";
$cf-icon-technology-round:           "\e309";
$cf-icon-fax:                        "\e310";
$cf-icon-fax-round:                  "\e311";

// Document icons

$cf-icon-document:                   "\e400";
$cf-icon-document-round:             "\e401";
$cf-icon-pdf:                        "\e402";
$cf-icon-pdf-round:                  "\e403";
$cf-icon-upload:                     "\e404";
$cf-icon-upload-round:               "\e405";
$cf-icon-download:                   "\e406";
$cf-icon-download-round:             "\e407";
$cf-icon-copy:                       "\e408";
$cf-icon-copy-round:                 "\e409";
$cf-icon-edit:                       "\e410";
$cf-icon-edit-round:                 "\e411";
$cf-icon-attach:                     "\e412";
$cf-icon-attach-round:               "\e413";
$cf-icon-print:                      "\e414";
$cf-icon-print-round:                "\e415";
$cf-icon-save:                       "\e416";
$cf-icon-save-round:                 "\e417";
$cf-icon-appendix:                   "\e418";
$cf-icon-appendix-round:             "\e419";
$cf-icon-supplement:                 "\e420";
$cf-icon-supplement-round:           "\e421";
$cf-icon-rss:                        "\e422";
$cf-icon-rss-round:                  "\e423";

// Financial products

$cf-icon-bank-account:               "\e500";
$cf-icon-bank-account-round:         "\e501";
$cf-icon-credit-card:                "\e502";
$cf-icon-credit-card-round:          "\e503";
$cf-icon-loan:                       "\e504";
$cf-icon-loan-round:                 "\e505";
$cf-icon-money-transfer:             "\e506";
$cf-icon-money-transfer-round:       "\e507";
$cf-icon-mortgage:                   "\e508";
$cf-icon-mortgage-round:             "\e509";
$cf-icon-debt-collection:            "\e510";
$cf-icon-debt-collection-round:      "\e511";
$cf-icon-credit-report:              "\e512";
$cf-icon-credit-report-round:        "\e513";
$cf-icon-money:                      "\e514";
$cf-icon-money-round:                "\e515";
$cf-icon-quick-cash:                 "\e516";
$cf-icon-quick-cash-round:           "\e517";
$cf-icon-contract:                   "\e518";
$cf-icon-contract-round:             "\e519";
$cf-icon-complaint:                  "\e520";
$cf-icon-complaint-round:            "\e521";
$cf-icon-getting-credit-card:        "\e522";
$cf-icon-getting-credit-card-round:  "\e523";
$cf-icon-buying-car:                 "\e524";
$cf-icon-buying-car-round:           "\e525";
$cf-icon-paying-college:             "\e526";
$cf-icon-paying-college-round:       "\e527";
$cf-icon-owning-home:                "\e528";
$cf-icon-owning-home-round:          "\e529";
$cf-icon-debt:                       "\e530";
$cf-icon-debt-round:                 "\e531";
$cf-icon-building-credit:            "\e532";
$cf-icon-building-credit-round:      "\e533";
$cf-icon-prepaid-cards:              "\e534";
$cf-icon-prepaid-cards-round:        "\e535";
$cf-icon-payday-loan:                "\e536";
$cf-icon-payday-loan-round:          "\e537";
$cf-icon-retirement:                 "\e538";
$cf-icon-retirement-round:           "\e539";

// Web icons

$cf-icon-user:                       "\e600";
$cf-icon-user-round:                 "\e601";
$cf-icon-wifi:                       "\e602";
$cf-icon-wifi-round:                 "\e603";
$cf-icon-search:                     "\e604";
$cf-icon-search-round:               "\e605";
$cf-icon-share:                      "\e606";
$cf-icon-share-round:                "\e607";
$cf-icon-link:                       "\e608";
$cf-icon-link-round:                 "\e609";
$cf-icon-external-link:              "\e610";
$cf-icon-external-link-round:        "\e611";
$cf-icon-audio-mute:                 "\e612";
$cf-icon-audio-mute-round:           "\e616";
$cf-icon-audio-low:                  "\e613";
$cf-icon-audio-low-round:            "\e617";
$cf-icon-audio-medium:               "\e614";
$cf-icon-audio-medium-round:         "\e618";
$cf-icon-audio-max:                  "\e615";
$cf-icon-audio-max-round:            "\e619";
$cf-icon-favorite:                   "\e620";
$cf-icon-favorite-round:             "\e621";
$cf-icon-unfavorite:                 "\e622";
$cf-icon-unfavorite-round:           "\e623";
$cf-icon-bookmark:                   "\e624";
$cf-icon-bookmark-round:             "\e625";
$cf-icon-unbookmark:                 "\e626";
$cf-icon-unbookmark-round:           "\e627";
$cf-icon-settings:                   "\e628";
$cf-icon-settings-round:             "\e629";
$cf-icon-menu:                       "\e630";
$cf-icon-menu-round:                 "\e631";
$cf-icon-lock:                       "\e632";
$cf-icon-lock-round:                 "\e633";
$cf-icon-unlock:                     "\e634";
$cf-icon-unlock-round:               "\e635";
$cf-icon-clock:                      "\e636";
$cf-icon-clock-round:                "\e637";
$cf-icon-chart:                      "\e638";
$cf-icon-chart-round:                "\e639";
$cf-icon-play:                       "\e640";
$cf-icon-play-round:                 "\e641";
$cf-icon-history:                    "\e642";
$cf-icon-history-round:              "\e643";
$cf-icon-table-of-contents:          "\e644";
$cf-icon-table-of-contents-round:    "\e645";
$cf-icon-newspaper:                  "\e700";
$cf-icon-newspaper-round:            "\e701";
$cf-icon-microphone:                 "\e702";
$cf-icon-microphone-round:           "\e703";
$cf-icon-bullhorn:                   "\e704";
$cf-icon-bullhorn-round:             "\e705";
$cf-icon-double-quote:               "\e708";
$cf-icon-double-quote-round:         "\e709";
$cf-icon-speech-bubble:              "\e710";
$cf-icon-speech-bubble-round:        "\e711";
$cf-icon-information:                "\e712";
$cf-icon-information-round:          "\e713";
$cf-icon-lightbulb:                  "\e714";
$cf-icon-lightbulb-round:            "\e715";
$cf-icon-dialogue:                   "\e716";
$cf-icon-dialogue-round:             "\e717";
$cf-icon-date:                       "\e718";
$cf-icon-date-round:                 "\e719";
$cf-icon-closing-quote:              "\e720";
$cf-icon-closing-quote-round:        "\e721";
$cf-icon-livestream:                 "\e722";
$cf-icon-livestream-round:           "\e723";
$cf-icon-parents:                    "\e724";
$cf-icon-parents-round:              "\e725";
$cf-icon-servicemembers:             "\e726";
$cf-icon-servicemembers-round:       "\e727";


/* topdoc
    name: Helper classes for icon sizes
    family: cf-icons
    patterns:
        - name: Large icon size
          markup: |
            <span class="cf-icon cf-icon-money cf-icon__lg"></span>
        - name: 2x icon size
          markup: |
            <span class="cf-icon cf-icon-money cf-icon__2x"></span>
        - name: 3x icon size
          markup: |
            <span class="cf-icon cf-icon-money cf-icon__3x"></span>
        - name: 4x icon size
          markup: |
            <span class="cf-icon cf-icon-money cf-icon__4x"></span>
        - name: 5x icon size
          markup: |
            <span class="cf-icon cf-icon-money cf-icon__5x"></span>
    notes:
       - "MIT Licensed by Font Awesome"
*/

// makes the font 33% larger relative to the icon container
.#{$cf-icon-prefix}__lg {
  font-size: (4em / 3);
  line-height: (3em / 4);
  vertical-align: -15%;
}

.#{$cf-icon-prefix}__2x { font-size: 2em; }
.#{$cf-icon-prefix}__3x { font-size: 3em; }
.#{$cf-icon-prefix}__4x { font-size: 4em; }
.#{$cf-icon-prefix}__5x { font-size: 5em; }


/* topdoc
    name: Mixin classes
    family: cf-icons
    patterns:
        - name: Icon rotation mixin
          codenotes:
            - ".#{$cf-icon-prefix}__rotate-90  { @include cf-icon__rotate(90deg, 1);  }"
          notes:
            - "First parameter is $degrees."
            - "Second parameter is $rotation"
        - name: Icon flip mixin
          codenotes:
            - ".#{$cf-icon-prefix}__flip-horizontal { @include cf-icon__flip(-1, 1, 0); }"
            - ".#{$cf-icon-prefix}__flip-vertical   { @include cf-icon__flip(1, -1, 2); }"
          notes:
            - "First parameter is for number of horizontal flips"
            - "Second parameter is for number of vertical flips"
            - "Third parameter is for rotation"
    notes:
       - "MIT Licensed by Font Awesome"
*/

@mixin cf-icon__rotate($degrees, $rotation) {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: rotate($degrees);
      -ms-transform: rotate($degrees);
          transform: rotate($degrees);
}

@mixin cf-icon__flip($horiz, $vert, $rotation) {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation, mirror=1);
  -webkit-transform: scale($horiz, $vert);
      -ms-transform: scale($horiz, $vert);
          transform: scale($horiz, $vert);
}

/* topdoc
    name: Helper classes for modified icons
    family: cf-icons
    patterns:
        - name: Bordered icons
          markup: |
            <span class="cf-icon cf-icon-update cf-icon__border"></span>
          notes:
            - "Border color set by $cf-icon-border-color"
        - name: Rotated icons
          markup: |
            <span class="cf-icon cf-icon-update cf-icon__rotate-90"></span>
            <span class="cf-icon cf-icon-update cf-icon__rotate-180"></span>
            <span class="cf-icon cf-icon-update cf-icon__rotate-270"></span>
        - name: Flipped icons
          markup: |
            <span class="cf-icon cf-icon-update cf-icon__flip-horizontal"></span>
            <span class="cf-icon cf-icon-update cf-icon__flip-vertical"></span>
    notes:
       - "MIT Licensed by Font Awesome"
*/

.#{$cf-icon-prefix}__border {
  padding: .2em .25em .15em;
  border: solid .08em $cf-icon-border-color;
  border-radius: .1em;
}

.#{$cf-icon-prefix}__rotate-90  { @include cf-icon__rotate(90deg, 1);  }
.#{$cf-icon-prefix}__rotate-180 { @include cf-icon__rotate(180deg, 2); }
.#{$cf-icon-prefix}__rotate-270 { @include cf-icon__rotate(270deg, 3); }

.#{$cf-icon-prefix}__flip-horizontal { @include cf-icon__flip(-1, 1, 0); }
.#{$cf-icon-prefix}__flip-vertical   { @include cf-icon__flip(1, -1, 2); }

:root .#{$cf-icon-prefix}__rotate-90,
:root .#{$cf-icon-prefix}__rotate-180,
:root .#{$cf-icon-prefix}__rotate-270,
:root .#{$cf-icon-prefix}__flip-horizontal,
:root .#{$cf-icon-prefix}__flip-vertical {
  filter: none;
}


/* topdoc
    name: Helper classes for animated icons
    family: cf-icons
    patterns:
        - name: Spinning icons
          markup: |
            <span class="cf-icon cf-icon-update cf-icon__spin"></span>
        - name: Pulsing icons
          markup: |
            <span class="cf-icon cf-icon-update cf-icon__pulse"></span>
        - name: Flipped icons
          markup: |
            <span class="cf-icon cf-icon-phone cf-icon__flip-horizontal"></span>
            <span class="cf-icon cf-icon-phone cf-icon__flip-vertical"></span>
    notes:
       - "MIT Licensed by Font Awesome"
*/

.#{$cf-icon-prefix}__spin {
  -webkit-animation: cf-spin 2s infinite linear;
          animation: cf-spin 2s infinite linear;
}

.#{$cf-icon-prefix}__pulse {
  -webkit-animation: cf-spin 1s infinite steps(8);
          animation: cf-spin 1s infinite steps(8);
}

@-webkit-keyframes cf-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
  }
}

@keyframes cf-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
  }
}


/* topdoc
    name: Navigation icons
    family: cf-icons
    patterns:
      - name: left
        markup: |
          <span class="cf-icon cf-icon-left"></span>
          <span class="cf-icon cf-icon-left-round"></span>
      - name: right
        markup: |
          <span class="cf-icon cf-icon-right"></span>
          <span class="cf-icon cf-icon-right-round"></span>
      - name: up
        markup: |
          <span class="cf-icon cf-icon-up"></span>
          <span class="cf-icon cf-icon-up-round"></span>
      - name: down
        markup: |
          <span class="cf-icon cf-icon-down"></span>
          <span class="cf-icon cf-icon-down-round"></span>
      - name: arrow-left
        markup: |
          <span class="cf-icon cf-icon-arrow-left"></span>
          <span class="cf-icon cf-icon-arrow-left-round"></span>
      - name: arrow-right
        markup: |
          <span class="cf-icon cf-icon-arrow-right"></span>
          <span class="cf-icon cf-icon-arrow-right-round"></span>
      - name: arrow-up
        markup: |
          <span class="cf-icon cf-icon-arrow-up"></span>
          <span class="cf-icon cf-icon-arrow-up-round"></span>
      - name: arrow-down
        markup: |
          <span class="cf-icon cf-icon-arrow-down"></span>
          <span class="cf-icon cf-icon-arrow-down-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-left {
    &:before  {     content: "\e000"; }
}

.#{$cf-icon-prefix}-left-round {
    &:before  {     content: "\e001"; }
}

.#{$cf-icon-prefix}-right {
    &:before  {     content: "\e002"; }
}

.#{$cf-icon-prefix}-right-round {
    &:before  {     content: "\e003"; }
}

.#{$cf-icon-prefix}-up {
    &:before  {     content: "\e004"; }
}

.#{$cf-icon-prefix}-up-round {
    &:before  {     content: "\e005"; }
}

.#{$cf-icon-prefix}-down {
    &:before  {     content: "\e006"; }
}

.#{$cf-icon-prefix}-down-round {
    &:before  {     content: "\e007"; }
}

.#{$cf-icon-prefix}-arrow-left {
    &:before  {     content: "\e008"; }
}

.#{$cf-icon-prefix}-arrow-left-round {
    &:before  {     content: "\e009"; }
}

.#{$cf-icon-prefix}-arrow-right {
    &:before  {     content: "\e010"; }
}

.#{$cf-icon-prefix}-arrow-right-round {
    &:before  {     content: "\e011"; }
}

.#{$cf-icon-prefix}-arrow-up {
    &:before  {     content: "\e012"; }
}

.#{$cf-icon-prefix}-arrow-up-round {
    &:before  {     content: "\e013"; }
}

.#{$cf-icon-prefix}-arrow-down {
    &:before  {     content: "\e014"; }
}

.#{$cf-icon-prefix}-arrow-down-round {
    &:before  {     content: "\e015"; }
}


/* topdoc
    name: Status icons
    family: cf-icons
    patterns:
      - name: approved
        markup: |
          <span class="cf-icon cf-icon-approved"></span>
          <span class="cf-icon cf-icon-approved-round"></span>
      - name: error
        markup: |
          <span class="cf-icon cf-icon-error"></span>
          <span class="cf-icon cf-icon-error-round"></span>
      - name: help
        markup: |
          <span class="cf-icon cf-icon-help"></span>
          <span class="cf-icon cf-icon-help-round"></span>
      - name: delete
        markup: |
          <span class="cf-icon cf-icon-delete"></span>
          <span class="cf-icon cf-icon-delete-round"></span>
      - name: plus
        markup: |
          <span class="cf-icon cf-icon-plus"></span>
          <span class="cf-icon cf-icon-plus-round"></span>
      - name: minus
        markup: |
          <span class="cf-icon cf-icon-minus"></span>
          <span class="cf-icon cf-icon-minus-round"></span>
      - name: update
        markup: |
          <span class="cf-icon cf-icon-update"></span>
          <span class="cf-icon cf-icon-update-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-approved {
    &:before  {     content: "\e100"; }
}

.#{$cf-icon-prefix}-approved-round {
    &:before  {     content: "\e101"; }
}

.#{$cf-icon-prefix}-error {
    &:before  {     content: "\e102"; }
}

.#{$cf-icon-prefix}-error-round {
    &:before  {     content: "\e103"; }
}

.#{$cf-icon-prefix}-help {
    &:before  {     content: "\e104"; }
}

.#{$cf-icon-prefix}-help-round {
    &:before  {     content: "\e105"; }
}

.#{$cf-icon-prefix}-delete {
    &:before  {     content: "\e106"; }
}

.#{$cf-icon-prefix}-delete-round {
    &:before  {     content: "\e107"; }
}

.#{$cf-icon-prefix}-plus {
    &:before  {     content: "\e108"; }
}

.#{$cf-icon-prefix}-plus-round {
    &:before  {     content: "\e109"; }
}

.#{$cf-icon-prefix}-minus {
    &:before  {     content: "\e110"; }
}

.#{$cf-icon-prefix}-minus-round {
    &:before  {     content: "\e111"; }
}

.#{$cf-icon-prefix}-update {
    &:before  {     content: "\e112"; }
}

.#{$cf-icon-prefix}-update-round {
    &:before  {     content: "\e113"; }
}


/* topdoc
    name: Social icons
    family: cf-icons
    patterns:
      - name: youtube
        markup: |
          <span class="cf-icon cf-icon-youtube"></span>
          <span class="cf-icon cf-icon-youtube-square"></span>
      - name: linkedin
        markup: |
          <span class="cf-icon cf-icon-linkedin"></span>
          <span class="cf-icon cf-icon-linkedin-square"></span>
      - name: facebook
        markup: |
          <span class="cf-icon cf-icon-facebook"></span>
          <span class="cf-icon cf-icon-facebook-square"></span>
      - name: flickr
        markup: |
          <span class="cf-icon cf-icon-flickr"></span>
          <span class="cf-icon cf-icon-flickr-square"></span>
      - name: plus
        markup: |
          <span class="cf-icon cf-icon-twitter"></span>
          <span class="cf-icon cf-icon-twitter-square"></span>
      - name: github
        markup: |
          <span class="cf-icon cf-icon-github"></span>
          <span class="cf-icon cf-icon-github-square"></span>
      - name: email-social
        markup: |
          <span class="cf-icon cf-icon-email-social"></span>
          <span class="cf-icon cf-icon-email-social-square"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-youtube {
    &:before  {     content: "\e200"; }
}

.#{$cf-icon-prefix}-youtube-square {
    &:before  {     content: "\e201"; }
}

.#{$cf-icon-prefix}-linkedin {
    &:before  {     content: "\e202"; }
}

.#{$cf-icon-prefix}-linkedin-square {
    &:before  {     content: "\e203"; }
}

.#{$cf-icon-prefix}-facebook {
    &:before  {     content: "\e204"; }
}

.#{$cf-icon-prefix}-facebook-square {
    &:before  {     content: "\e205"; }
}

.#{$cf-icon-prefix}-flickr {
    &:before  {     content: "\e206"; }
}

.#{$cf-icon-prefix}-flickr-square {
    &:before  {     content: "\e207"; }
}

.#{$cf-icon-prefix}-twitter {
    &:before  {     content: "\e208"; }
}

.#{$cf-icon-prefix}-twitter-square {
    &:before  {     content: "\e209"; }
}

.#{$cf-icon-prefix}-github {
    &:before  {     content: "\e210"; }
}

.#{$cf-icon-prefix}-github-square {
    &:before  {     content: "\e211"; }
}

.#{$cf-icon-prefix}-email-social {
    &:before  {     content: "\e212"; }
}

.#{$cf-icon-prefix}-email-social-square {
    &:before  {     content: "\e213"; }
}


/* topdoc
    name: Communication icons
    family: cf-icons
    patterns:
      - name: web
        markup: |
          <span class="cf-icon cf-icon-web"></span>
          <span class="cf-icon cf-icon-web-round"></span>
      - name: email
        markup: |
          <span class="cf-icon cf-icon-email"></span>
          <span class="cf-icon cf-icon-email-round"></span>
      - name: mail
        markup: |
          <span class="cf-icon cf-icon-mail"></span>
          <span class="cf-icon cf-icon-mail-round"></span>
      - name: phone
        markup: |
          <span class="cf-icon cf-icon-phone"></span>
          <span class="cf-icon cf-icon-phone-round"></span>
      - name: technology
        markup: |
          <span class="cf-icon cf-icon-technology"></span>
          <span class="cf-icon cf-icon-technology-round"></span>
      - name: fax
        markup: |
          <span class="cf-icon cf-icon-fax"></span>
          <span class="cf-icon cf-icon-fax-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-web {
    &:before  {     content: "\e300"; }
}

.#{$cf-icon-prefix}-web-round {
    &:before  {     content: "\e301"; }
}

.#{$cf-icon-prefix}-email {
    &:before  {     content: "\e302"; }
}

.#{$cf-icon-prefix}-email-round {
    &:before  {     content: "\e303"; }
}

.#{$cf-icon-prefix}-mail {
    &:before  {     content: "\e304"; }
}

.#{$cf-icon-prefix}-mail-round {
    &:before  {     content: "\e305"; }
}

.#{$cf-icon-prefix}-phone {
    &:before  {     content: "\e306"; }
}

.#{$cf-icon-prefix}-phone-round {
    &:before  {     content: "\e307"; }
}

.#{$cf-icon-prefix}-technology {
    &:before  {     content: "\e308"; }
}

.#{$cf-icon-prefix}-technology-round {
    &:before  {     content: "\e309"; }
}

.#{$cf-icon-prefix}-fax {
    &:before  {     content: "\e310"; }
}

.#{$cf-icon-prefix}-fax-round {
    &:before  {     content: "\e311"; }
}


/* topdoc
    name: Document icons
    family: cf-icons
    patterns:
      - name: document
        markup: |
          <span class="cf-icon cf-icon-document"></span>
          <span class="cf-icon cf-icon-document-round"></span>
      - name: pdf
        markup: |
          <span class="cf-icon cf-icon-pdf"></span>
          <span class="cf-icon cf-icon-pdf-round"></span>
      - name: upload
        markup: |
          <span class="cf-icon cf-icon-upload"></span>
          <span class="cf-icon cf-icon-upload-round"></span>
      - name: download
        markup: |
          <span class="cf-icon cf-icon-download"></span>
          <span class="cf-icon cf-icon-download-round"></span>
      - name: copy
        markup: |
          <span class="cf-icon cf-icon-copy"></span>
          <span class="cf-icon cf-icon-copy-round"></span>
      - name: edit
        markup: |
          <span class="cf-icon cf-icon-edit"></span>
          <span class="cf-icon cf-icon-edit-round"></span>
      - name: attach
        markup: |
          <span class="cf-icon cf-icon-attach"></span>
          <span class="cf-icon cf-icon-attach-round"></span>
      - name: print
        markup: |
          <span class="cf-icon cf-icon-print"></span>
          <span class="cf-icon cf-icon-print-round"></span>
      - name: save
        markup: |
          <span class="cf-icon cf-icon-save"></span>
          <span class="cf-icon cf-icon-save-round"></span>
      - name: appendix
        markup: |
          <span class="cf-icon cf-icon-appendix"></span>
          <span class="cf-icon cf-icon-appendix-round"></span>
      - name: supplement
        markup: |
          <span class="cf-icon cf-icon-supplement"></span>
          <span class="cf-icon cf-icon-supplement-round"></span>
      - name: rss
        markup: |
          <span class="cf-icon cf-icon-rss"></span>
          <span class="cf-icon cf-icon-rss-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-document {
    &:before  {     content: "\e400"; }
}

.#{$cf-icon-prefix}-document-round {
    &:before  {     content: "\e401"; }
}

.#{$cf-icon-prefix}-pdf {
    &:before  {     content: "\e402"; }
}

.#{$cf-icon-prefix}-pdf-round {
    &:before  {     content: "\e403"; }
}

.#{$cf-icon-prefix}-upload {
    &:before  {     content: "\e404"; }
}

.#{$cf-icon-prefix}-upload-round {
    &:before  {     content: "\e405"; }
}

.#{$cf-icon-prefix}-download {
    &:before  {     content: "\e406"; }
}

.#{$cf-icon-prefix}-download-round {
    &:before  {     content: "\e407"; }
}

.#{$cf-icon-prefix}-copy {
    &:before  {     content: "\e408"; }
}

.#{$cf-icon-prefix}-copy-round {
    &:before  {     content: "\e409"; }
}

.#{$cf-icon-prefix}-edit {
    &:before  {     content: "\e410"; }
}

.#{$cf-icon-prefix}-edit-round {
    &:before  {     content: "\e411"; }
}

.#{$cf-icon-prefix}-attach {
    &:before  {     content: "\e412"; }
}

.#{$cf-icon-prefix}-attach-round {
    &:before  {     content: "\e413"; }
}

.#{$cf-icon-prefix}-print {
    &:before  {     content: "\e414"; }
}

.#{$cf-icon-prefix}-print-round {
    &:before  {     content: "\e415"; }
}

.#{$cf-icon-prefix}-save {
    &:before  {     content: "\e416"; }
}

.#{$cf-icon-prefix}-save-round {
    &:before  {     content: "\e417"; }
}

.#{$cf-icon-prefix}-appendix {
    &:before  {     content: "\e418"; }
}

.#{$cf-icon-prefix}-appendix-round {
    &:before  {     content: "\e419"; }
}

.#{$cf-icon-prefix}-supplement {
    &:before  {     content: "\e420"; }
}

.#{$cf-icon-prefix}-supplement-round {
    &:before  {     content: "\e421"; }
}

.#{$cf-icon-prefix}-rss {
    &:before  {     content: "\e422"; }
}

.#{$cf-icon-prefix}-rss-round {
    &:before  {     content: "\e423"; }
}


/* topdoc
    name: Financial product icons
    family: cf-icons
    patterns:
      - name: bank-account
        markup: |
          <span class="cf-icon cf-icon-bank-account"></span>
          <span class="cf-icon cf-icon-bank-account-round"></span>
      - name: credit-card
        markup: |
          <span class="cf-icon cf-icon-credit-card"></span>
          <span class="cf-icon cf-icon-credit-card-round"></span>
      - name: loan
        markup: |
          <span class="cf-icon cf-icon-loan"></span>
          <span class="cf-icon cf-icon-loan-round"></span>
      - name: money-transfer
        markup: |
          <span class="cf-icon cf-icon-money-transfer"></span>
          <span class="cf-icon cf-icon-money-transfer-round"></span>
      - name: mortgage
        markup: |
          <span class="cf-icon cf-icon-mortgage"></span>
          <span class="cf-icon cf-icon-mortgage-round"></span>
      - name: debt-collection
        markup: |
          <span class="cf-icon cf-icon-debt-collection"></span>
          <span class="cf-icon cf-icon-debt-collection-round"></span>
      - name: credit-report
        markup: |
          <span class="cf-icon cf-icon-credit-report"></span>
          <span class="cf-icon cf-icon-credit-report-round"></span>
      - name: money
        markup: |
          <span class="cf-icon cf-icon-money"></span>
          <span class="cf-icon cf-icon-money-round"></span>
      - name: quick-cash
        markup: |
          <span class="cf-icon cf-icon-quick-cash"></span>
          <span class="cf-icon cf-icon-quick-cash-round"></span>
      - name: contract
        markup: |
          <span class="cf-icon cf-icon-contract"></span>
          <span class="cf-icon cf-icon-contract-round"></span>
      - name: complaint
        markup: |
          <span class="cf-icon cf-icon-complaint"></span>
          <span class="cf-icon cf-icon-complaint-round"></span>
      - name: getting-credit-card
        markup: |
          <span class="cf-icon cf-icon-getting-credit-card"></span>
          <span class="cf-icon cf-icon-getting-credit-card-round"></span>
      - name: buying-car
        markup: |
          <span class="cf-icon cf-icon-buying-car"></span>
          <span class="cf-icon cf-icon-buying-car-round"></span>
      - name: paying-college
        markup: |
          <span class="cf-icon cf-icon-paying-college"></span>
          <span class="cf-icon cf-icon-paying-college-round"></span>
      - name: owning-home
        markup: |
          <span class="cf-icon cf-icon-owning-home"></span>
          <span class="cf-icon cf-icon-owning-home-round"></span>
      - name: debt
        markup: |
          <span class="cf-icon cf-icon-debt"></span>
          <span class="cf-icon cf-icon-debt-round"></span>
      - name: building-credit
        markup: |
          <span class="cf-icon cf-icon-building-credit"></span>
          <span class="cf-icon cf-icon-building-credit-round"></span>
      - name: prepaid-cards
        markup: |
          <span class="cf-icon cf-icon-prepaid-cards"></span>
          <span class="cf-icon cf-icon-prepaid-cards-round"></span>
      - name: payday-loan
        markup: |
          <span class="cf-icon cf-icon-payday-loan"></span>
          <span class="cf-icon cf-icon-payday-loan-round"></span>
      - name: retirement
        markup: |
          <span class="cf-icon cf-icon-retirement"></span>
          <span class="cf-icon cf-icon-retirement-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-bank-account {
    &:before  {     content: "\e500"; }
}

.#{$cf-icon-prefix}-bank-account-round {
    &:before  {     content: "\e501"; }
}

.#{$cf-icon-prefix}-credit-card {
    &:before  {     content: "\e502"; }
}

.#{$cf-icon-prefix}-credit-card-round {
    &:before  {     content: "\e503"; }
}

.#{$cf-icon-prefix}-loan {
    &:before  {     content: "\e504"; }
}

.#{$cf-icon-prefix}-loan-round {
    &:before  {     content: "\e505"; }
}

.#{$cf-icon-prefix}-money-transfer {
    &:before  {     content: "\e506"; }
}

.#{$cf-icon-prefix}-money-transfer-round {
    &:before  {     content: "\e507"; }
}

.#{$cf-icon-prefix}-mortgage {
    &:before  {     content: "\e508"; }
}

.#{$cf-icon-prefix}-mortgage-round {
    &:before  {     content: "\e509"; }
}

.#{$cf-icon-prefix}-debt-collection {
    &:before  {     content: "\e510"; }
}

.#{$cf-icon-prefix}-debt-collection-round {
    &:before  {     content: "\e511"; }
}

.#{$cf-icon-prefix}-credit-report {
    &:before  {     content: "\e512"; }
}

.#{$cf-icon-prefix}-credit-report-round {
    &:before  {     content: "\e513"; }
}

.#{$cf-icon-prefix}-money {
    &:before  {     content: "\e514"; }
}

.#{$cf-icon-prefix}-money-round {
    &:before  {     content: "\e515"; }
}

.#{$cf-icon-prefix}-quick-cash {
    &:before  {     content: "\e516"; }
}

.#{$cf-icon-prefix}-quick-cash-round {
    &:before  {     content: "\e517"; }
}

.#{$cf-icon-prefix}-contract {
    &:before  {     content: "\e518"; }
}

.#{$cf-icon-prefix}-contract-round {
    &:before  {     content: "\e519"; }
}

.#{$cf-icon-prefix}-complaint {
    &:before  {     content: "\e520"; }
}

.#{$cf-icon-prefix}-complaint-round {
    &:before  {     content: "\e521"; }
}

.#{$cf-icon-prefix}-getting-credit-card {
    &:before  {     content: "\e522"; }
}

.#{$cf-icon-prefix}-getting-credit-card-round {
    &:before  {     content: "\e523"; }
}

.#{$cf-icon-prefix}-buying-car {
    &:before  {     content: "\e524"; }
}

.#{$cf-icon-prefix}-buying-car-round {
    &:before  {     content: "\e525"; }
}

.#{$cf-icon-prefix}-paying-college {
    &:before  {     content: "\e526"; }
}

.#{$cf-icon-prefix}-paying-college-round {
    &:before  {     content: "\e527"; }
}

.#{$cf-icon-prefix}-owning-home {
    &:before  {     content: "\e528"; }
}

.#{$cf-icon-prefix}-owning-home-round {
    &:before  {     content: "\e529"; }
}

.#{$cf-icon-prefix}-debt {
    &:before  {     content: "\e530"; }
}

.#{$cf-icon-prefix}-debt-round {
    &:before  {     content: "\e531"; }
}

.#{$cf-icon-prefix}-building-credit {
    &:before  {     content: "\e532"; }
}

.#{$cf-icon-prefix}-building-credit-round {
    &:before  {     content: "\e533"; }
}

.#{$cf-icon-prefix}-prepaid-cards {
    &:before  {     content: "\e534"; }
}

.#{$cf-icon-prefix}-prepaid-cards-round {
    &:before  {     content: "\e535"; }
}

.#{$cf-icon-prefix}-payday-loan {
    &:before  {     content: "\e536"; }
}

.#{$cf-icon-prefix}-payday-loan-round {
    &:before  {     content: "\e537"; }
}

.#{$cf-icon-prefix}-retirement {
    &:before  {     content: "\e538"; }
}

.#{$cf-icon-prefix}-retirement-round {
    &:before  {     content: "\e539"; }
}


/* topdoc
    name: Web icons
    family: cf-icons
    patterns:
      - name: user
        markup: |
          <span class="cf-icon cf-icon-user"></span>
          <span class="cf-icon cf-icon-user-round"></span>
      - name: wifi
        markup: |
          <span class="cf-icon cf-icon-wifi"></span>
          <span class="cf-icon cf-icon-wifi-round"></span>
      - name: search
        markup: |
          <span class="cf-icon cf-icon-search"></span>
          <span class="cf-icon cf-icon-search-round"></span>
      - name: share
        markup: |
          <span class="cf-icon cf-icon-share"></span>
          <span class="cf-icon cf-icon-share-round"></span>
      - name: link
        markup: |
          <span class="cf-icon cf-icon-link"></span>
          <span class="cf-icon cf-icon-link-round"></span>
      - name: external-link
        markup: |
          <span class="cf-icon cf-icon-external-link"></span>
          <span class="cf-icon cf-icon-external-link-round"></span>
      - name: audio-mute
        markup: |
          <span class="cf-icon cf-icon-audio-mute"></span>
          <span class="cf-icon cf-icon-audio-mute-round"></span>
      - name: audio-low
        markup: |
          <span class="cf-icon cf-icon-audio-low"></span>
          <span class="cf-icon cf-icon-audio-low-round"></span>
      - name: audio-medium
        markup: |
          <span class="cf-icon cf-icon-audio-medium"></span>
          <span class="cf-icon cf-icon-audio-medium-round"></span>
      - name: audio-max
        markup: |
          <span class="cf-icon cf-icon-audio-max"></span>
          <span class="cf-icon cf-icon-audio-max-round"></span>
      - name: favorite
        markup: |
          <span class="cf-icon cf-icon-favorite"></span>
          <span class="cf-icon cf-icon-favorite-round"></span>
      - name: unfavorite
        markup: |
          <span class="cf-icon cf-icon-unfavorite"></span>
          <span class="cf-icon cf-icon-unfavorite-round"></span>
      - name: bookmark
        markup: |
          <span class="cf-icon cf-icon-bookmark"></span>
          <span class="cf-icon cf-icon-bookmark-round"></span>
      - name: unbookmark
        markup: |
          <span class="cf-icon cf-icon-unbookmark"></span>
          <span class="cf-icon cf-icon-unbookmark-round"></span>
      - name: settings
        markup: |
          <span class="cf-icon cf-icon-settings"></span>
          <span class="cf-icon cf-icon-settings-round"></span>
      - name: menu
        markup: |
          <span class="cf-icon cf-icon-menu"></span>
          <span class="cf-icon cf-icon-menu-round"></span>
      - name: lock
        markup: |
          <span class="cf-icon cf-icon-lock"></span>
          <span class="cf-icon cf-icon-lock-round"></span>
      - name: unlock
        markup: |
          <span class="cf-icon cf-icon-unlock"></span>
          <span class="cf-icon cf-icon-unlock-round"></span>
      - name: clock
        markup: |
          <span class="cf-icon cf-icon-clock"></span>
          <span class="cf-icon cf-icon-clock-round"></span>
      - name: chart
        markup: |
          <span class="cf-icon cf-icon-chart"></span>
          <span class="cf-icon cf-icon-chart-round"></span>
      - name: play
        markup: |
          <span class="cf-icon cf-icon-play"></span>
          <span class="cf-icon cf-icon-play-round"></span>
      - name: history
        markup: |
          <span class="cf-icon cf-icon-history"></span>
          <span class="cf-icon cf-icon-history-round"></span>
      - name: table of contents
        markup: |
          <span class="cf-icon cf-icon-table-of-contents"></span>
          <span class="cf-icon cf-icon-table-of-contents-round"></span>
      - name: newspaper
        markup: |
          <span class="cf-icon cf-icon-newspaper"></span>
          <span class="cf-icon cf-icon-newspaper-round"></span>
      - name: microphone
        markup: |
          <span class="cf-icon cf-icon-microphone"></span>
          <span class="cf-icon cf-icon-microphone-round"></span>
      - name: bullhorn
        markup: |
          <span class="cf-icon cf-icon-bullhorn"></span>
          <span class="cf-icon cf-icon-bullhorn-round"></span>
      - name: double-quote
        markup: |
          <span class="cf-icon cf-icon-double-quote"></span>
          <span class="cf-icon cf-icon-double-quote-round"></span>
      - name: speech-bubble
        markup: |
          <span class="cf-icon cf-icon-speech-bubble"></span>
          <span class="cf-icon cf-icon-speech-bubble-round"></span>
      - name: information
        markup: |
          <span class="cf-icon cf-icon-information"></span>
          <span class="cf-icon cf-icon-information-round"></span>
      - name: lightbulb
        markup: |
          <span class="cf-icon cf-icon-lightbulb"></span>
          <span class="cf-icon cf-icon-lightbulb-round"></span>
      - name: dialogue
        markup: |
          <span class="cf-icon cf-icon-dialogue"></span>
          <span class="cf-icon cf-icon-dialogue-round"></span>
      - name: date
        markup: |
          <span class="cf-icon cf-icon-date"></span>
          <span class="cf-icon cf-icon-date-round"></span>
      - name: closing-quote
        markup: |
          <span class="cf-icon cf-icon-closing-quote"></span>
          <span class="cf-icon cf-icon-closing-quote-round"></span>
      - name: livestream
        markup: |
          <span class="cf-icon cf-icon-livestream"></span>
          <span class="cf-icon cf-icon-livestream-round"></span>
      - name: parents
        markup: |
          <span class="cf-icon cf-icon-parents"></span>
          <span class="cf-icon cf-icon-parents-round"></span>
      - name: servicemembers
        markup: |
          <span class="cf-icon cf-icon-servicemembers"></span>
          <span class="cf-icon cf-icon-servicemembers-round"></span>
    tags:
      - cf-icons
*/

.#{$cf-icon-prefix}-user {
    &:before  {     content: "\e600"; }
}

.#{$cf-icon-prefix}-user-round {
    &:before  {     content: "\e601"; }
}

.#{$cf-icon-prefix}-wifi {
    &:before  {     content: "\e602"; }
}

.#{$cf-icon-prefix}-wifi-round {
    &:before  {     content: "\e603"; }
}

.#{$cf-icon-prefix}-search {
    &:before  {     content: "\e604"; }
}

.#{$cf-icon-prefix}-search-round {
    &:before  {     content: "\e605"; }
}

.#{$cf-icon-prefix}-share {
    &:before  {     content: "\e606"; }
}

.#{$cf-icon-prefix}-share-round {
    &:before  {     content: "\e607"; }
}

.#{$cf-icon-prefix}-link {
    &:before  {     content: "\e608"; }
}

.#{$cf-icon-prefix}-link-round {
    &:before  {     content: "\e609"; }
}

.#{$cf-icon-prefix}-external-link {
    &:before  {     content: "\e610"; }
}

.#{$cf-icon-prefix}-external-link-round {
    &:before  {     content: "\e611"; }
}

.#{$cf-icon-prefix}-audio-mute {
    &:before  {     content: "\e612"; }
}

.#{$cf-icon-prefix}-audio-mute-round {
    &:before  {     content: "\e616"; }
}

.#{$cf-icon-prefix}-audio-low {
    &:before  {     content: "\e613"; }
}

.#{$cf-icon-prefix}-audio-low-round {
    &:before  {     content: "\e617"; }
}

.#{$cf-icon-prefix}-audio-medium {
    &:before  {     content: "\e614"; }
}

.#{$cf-icon-prefix}-audio-medium-round {
    &:before  {     content: "\e618"; }
}

.#{$cf-icon-prefix}-audio-max {
    &:before  {     content: "\e615"; }
}

.#{$cf-icon-prefix}-audio-max-round {
    &:before  {     content: "\e619"; }
}

.#{$cf-icon-prefix}-favorite {
    &:before  {     content: "\e620"; }
}

.#{$cf-icon-prefix}-favorite-round {
    &:before  {     content: "\e621"; }
}

.#{$cf-icon-prefix}-unfavorite {
    &:before  {     content: "\e622"; }
}

.#{$cf-icon-prefix}-unfavorite-round {
    &:before  {     content: "\e623"; }
}

.#{$cf-icon-prefix}-bookmark {
    &:before  {     content: "\e624"; }
}

.#{$cf-icon-prefix}-bookmark-round {
    &:before  {     content: "\e625"; }
}

.#{$cf-icon-prefix}-unbookmark {
    &:before  {     content: "\e626"; }
}

.#{$cf-icon-prefix}-unbookmark-round {
    &:before  {     content: "\e627"; }
}

.#{$cf-icon-prefix}-settings {
    &:before  {     content: "\e628"; }
}

.#{$cf-icon-prefix}-settings-round {
    &:before  {     content: "\e629"; }
}

.#{$cf-icon-prefix}-menu {
    &:before  {     content: "\e630"; }
}

.#{$cf-icon-prefix}-menu-round {
    &:before  {     content: "\e631"; }
}

.#{$cf-icon-prefix}-lock {
    &:before  {     content: "\e632"; }
}

.#{$cf-icon-prefix}-lock-round {
    &:before  {     content: "\e633"; }
}

.#{$cf-icon-prefix}-unlock {
    &:before  {     content: "\e634"; }
}

.#{$cf-icon-prefix}-unlock-round {
    &:before  {     content: "\e635"; }
}

.#{$cf-icon-prefix}-clock {
    &:before  {     content: "\e636"; }
}

.#{$cf-icon-prefix}-clock-round {
    &:before  {     content: "\e637"; }
}

.#{$cf-icon-prefix}-chart {
    &:before  {     content: "\e638"; }
}

.#{$cf-icon-prefix}-chart-round {
    &:before  {     content: "\e639"; }
}

.#{$cf-icon-prefix}-play {
    &:before  {     content: "\e640"; }
}

.#{$cf-icon-prefix}-play-round {
    &:before  {     content: "\e641"; }
}

.#{$cf-icon-prefix}-history {
    &:before  {     content: "\e642"; }
}

.#{$cf-icon-prefix}-history-round {
    &:before  {     content: "\e643"; }
}

.#{$cf-icon-prefix}-table-of-contents {
    &:before  {     content: "\e644"; }
}

.#{$cf-icon-prefix}-table-of-contents-round {
    &:before  {     content: "\e645"; }
}

.#{$cf-icon-prefix}-newspaper {
    &:before  {     content: "\e700"; }
}

.#{$cf-icon-prefix}-newspaper-round {
    &:before  {     content: "\e701"; }
}

.#{$cf-icon-prefix}-microphone {
    &:before  {     content: "\e702"; }
}

.#{$cf-icon-prefix}-microphone-round {
    &:before  {     content: "\e703"; }
}

.#{$cf-icon-prefix}-bullhorn {
    &:before  {     content: "\e704"; }
}

.#{$cf-icon-prefix}-bullhorn-round {
    &:before  {     content: "\e705"; }
}

.#{$cf-icon-prefix}-double-quote {
    &:before  {     content: "\e708"; }
}

.#{$cf-icon-prefix}-double-quote-round {
    &:before  {     content: "\e709"; }
}

.#{$cf-icon-prefix}-speech-bubble {
    &:before  {     content: "\e710"; }
}

.#{$cf-icon-prefix}-speech-bubble-round {
    &:before  {     content: "\e711"; }
}

.#{$cf-icon-prefix}-information {
    &:before  {     content: "\e712"; }
}

.#{$cf-icon-prefix}-information-round {
    &:before  {     content: "\e713"; }
}

.#{$cf-icon-prefix}-lightbulb {
    &:before  {     content: "\e714"; }
}

.#{$cf-icon-prefix}-lightbulb-round {
    &:before  {     content: "\e715"; }
}

.#{$cf-icon-prefix}-dialogue {
    &:before  {     content: "\e716"; }
}

.#{$cf-icon-prefix}-dialogue-round {
    &:before  {     content: "\e717"; }
}

.#{$cf-icon-prefix}-date {
    &:before  {     content: "\e718"; }
}

.#{$cf-icon-prefix}-date-round {
    &:before  {     content: "\e719"; }
}

.#{$cf-icon-prefix}-closing-quote {
    &:before  {     content: "\e720"; }
}

.#{$cf-icon-prefix}-closing-quote-round {
    &:before  {     content: "\e721"; }
}

.#{$cf-icon-prefix}-livestream {
    &:before  {     content: "\e722"; }
}

.#{$cf-icon-prefix}-livestream-round {
    &:before  {     content: "\e723"; }
}

.#{$cf-icon-prefix}-parents {
    &:before  {     content: "\e724"; }
}

.#{$cf-icon-prefix}-parents-round {
    &:before  {     content: "\e725"; }
}

.#{$cf-icon-prefix}-servicemembers {
    &:before  {     content: "\e726"; }
}

.#{$cf-icon-prefix}-servicemembers-round {
    &:before  {     content: "\e727"; }
}

/* topdoc
  name: EOF
  eof: true
*/
