.eacf7-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  vertical-align: middle;

  background-color: currentColor;

  &.pro{
    mask: url("../images/icons/pro.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/pro.svg") no-repeat center / contain;
  }

  &.doc{
    mask: url("../images/icons/doc.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/doc.svg") no-repeat center / contain;
  }

  &.docs {
    mask: url("../images/icons/docs.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/docs.svg") no-repeat center / contain;
  }

  &.help{
    mask: url("../images/icons/help-alt.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/help-alt.svg") no-repeat center / contain;
  }

  &.info{
    mask: url("../images/icons/info.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/info.svg") no-repeat center / contain;
  }

  &.documentation{
    mask: url("../images/icons/documentation.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/documentation.svg") no-repeat center / contain;
  }

  &.upgrade {
    mask: url("../images/icons/upgrade.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/upgrade.svg") no-repeat center / contain;
  }

  &.home{
    mask: url("../images/icons/home.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/home.svg") no-repeat center / contain;
  }

  &.fields{
    mask: url("../images/icons/fields.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/fields.svg") no-repeat center / contain;
  }

  &.features{
    mask: url("../images/icons/features.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/features.svg") no-repeat center / contain;
  }

  &.settings{
    mask: url("../images/icons/settings.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/settings.svg") no-repeat center / contain;
  }

  &.help{
    mask: url("../images/icons/help.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/help.svg") no-repeat center / contain;
  }

  &.help-alt{
    mask: url("../images/icons/help-alt.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/help-alt.svg") no-repeat center / contain;
  }

  &.changelog{
    mask: url("../images/icons/changelog.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/changelog.svg") no-repeat center / contain;
  }

  &.crown{
    mask: url("../images/icons/crown.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/crown.svg") no-repeat center / contain;
  }

  &.play{
    mask: url("../images/icons/play.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/play.svg") no-repeat center / contain;
  }

  &.star{
    mask: url("../images/icons/star.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/star.svg") no-repeat center / contain;
  }

  &.quote-left{
    mask: url("../images/icons/quote-left.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/quote-left.svg") no-repeat center / contain;
  }

  &.user{
    mask: url("../images/icons/user.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/user.svg") no-repeat center / contain;
  }

  &.popup{
    mask: url("../images/icons/popup.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/popup.svg") no-repeat center / contain;
  }

  &.integrations{
    mask: url("../images/icons/integrations.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/integrations.svg") no-repeat center / contain;
  }

  &.security{
    mask: url("../images/icons/security.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/security.svg") no-repeat center / contain;
  }

  &.email-summaries{
    mask: url("../images/icons/email-summaries.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/email-summaries.svg") no-repeat center / contain;
  }

  &.tools{
    mask: url("../images/icons/tools.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/tools.svg") no-repeat center / contain;
  }

  &.recaptcha{
    mask: url("../images/icons/recaptcha.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/recaptcha.svg") no-repeat center / contain;
  }

  &.hcaptcha{
    mask: url("../images/icons/hcaptcha.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/hcaptcha.svg") no-repeat center / contain;
  }

  &.cloudflare_turnstile{
    mask: url("../images/icons/cloudflare_turnstile.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/cloudflare_turnstile.svg") no-repeat center / contain;
  }

  &.active-campaign{
    mask: url("../images/icons/active-campaign.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/active-campaign.svg") no-repeat center / contain;
  }

  &.brevo{
    mask: url("../images/icons/brevo.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/brevo.svg") no-repeat center / contain;
  }

  &.drip{
    mask: url("../images/icons/drip.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/drip.svg") no-repeat center / contain;
  }

  &.fluent{
    mask: url("../images/icons/fluent.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/fluent.svg") no-repeat center / contain;
  }

  &.google-drive{
    mask: url("../images/icons/google-drive.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/google-drive.svg") no-repeat center / contain;
  }

  &.hubspot{
    mask: url("../images/icons/hubspot.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/hubspot.svg") no-repeat center / contain;
  }

  &.mailpoet{
    mask: url("../images/icons/mailpoet.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/mailpoet.svg") no-repeat center / contain;
  }

  &.mailchimp{
    mask: url("../images/icons/mailchimp.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/mailchimp.svg") no-repeat center / contain;
  }

  &.mailerlite{
    mask: url("../images/icons/mailerlite.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/mailerlite.svg") no-repeat center / contain;
  }

  &.paypal{
    mask: url("../images/icons/paypal.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/paypal.svg") no-repeat center / contain;
  }

  &.slack{
    mask: url("../images/icons/slack.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/slack.svg") no-repeat center / contain;
  }

  &.stripe{
    mask: url("../images/icons/stripe.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/stripe.svg") no-repeat center / contain;
  }

  &.telegram{
    mask: url("../images/icons/telegram.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/telegram.svg") no-repeat center / contain;
  }

  &.webhooks{
    mask: url("../images/icons/webhooks.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/webhooks.svg") no-repeat center / contain;
  }

  &.whatsapp{
    mask: url("../images/icons/whatsapp.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/whatsapp.svg") no-repeat center / contain;
  }

  &.pabbly{
    mask: url("../images/icons/pabbly.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/pabbly.svg") no-repeat center / contain;
  }

  &.zapier{
    mask: url("../images/icons/zapier.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/zapier.svg") no-repeat center / contain;
  }

  &.fire{
    mask: url("../images/icons/fire.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/fire.svg") no-repeat center / contain;
  }

  &.conditional{
    mask: url("../images/icons/conditional.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/conditional.svg") no-repeat center / contain;
  }

  &.booking{
    mask: url("../images/icons/booking.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/booking.svg") no-repeat center / contain;
  }

  &.multistep{
    mask: url("../images/icons/multistep.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/multistep.svg") no-repeat center / contain;
  }

  &.pre-populate{
    mask: url("../images/icons/pre-populate.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/pre-populate.svg") no-repeat center / contain;
  }

  &.form-styler{
    mask: url("../images/icons/form-styler.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/form-styler.svg") no-repeat center / contain;
  }

  &.redirection{
    mask: url("../images/icons/redirection.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/redirection.svg") no-repeat center / contain;
  }

  &.repeater{
    mask: url("../images/icons/repeater.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/repeater.svg") no-repeat center / contain;
  }

  &.pdf-generator{
    mask: url("../images/icons/pdf-generator.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/pdf-generator.svg") no-repeat center / contain;
  }

  &.submission-id{
    mask: url("../images/icons/submission-id.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/submission-id.svg") no-repeat center / contain;
  }

  &.entry-restrictions{
    mask: url("../images/icons/entry-restrictions.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/entry-restrictions.svg") no-repeat center / contain;
  }

  &.preview-submission{
    mask: url("../images/icons/preview-submission.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/preview-submission.svg") no-repeat center / contain;
  }

  &.digital-signature{
    mask: url("../images/icons/digital-signature.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/digital-signature.svg") no-repeat center / contain;
  }

  &.range-slider{
    mask: url("../images/icons/range-slider.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/range-slider.svg") no-repeat center / contain;
  }

  &.post-submission{
    mask: url("../images/icons/post-submission.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/post-submission.svg") no-repeat center / contain;
  }

  &.user-registration{
    mask: url("../images/icons/user-registration.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/user-registration.svg") no-repeat center / contain;
  }

  &.conversational{
    mask: url("../images/icons/conversational.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/conversational.svg") no-repeat center / contain;
  }

  &.wc-checkout{
    mask: url("../images/icons/wc-checkout.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/wc-checkout.svg") no-repeat center / contain;
  }

  &.save{
    mask: url("../images/icons/save.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/save.svg") no-repeat center / contain;
  }

  &.spam-blocker{
    mask: url("../images/icons/spam-blocker.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/spam-blocker.svg") no-repeat center / contain;
  }

  &.airtable{
    mask: url("../images/icons/airtable.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/airtable.svg") no-repeat center / contain;
  }

  &.asana{
    mask: url("../images/icons/asana.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/asana.svg") no-repeat center / contain;
  }

  &.clickup{
    mask: url("../images/icons/clickup.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/clickup.svg") no-repeat center / contain;
  }

  &.discord{
    mask: url("../images/icons/discord.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/discord.svg") no-repeat center / contain;
  }

  &.fluent-support{
    mask: url("../images/icons/fluent-support.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/fluent-support.svg") no-repeat center / contain;
  }

  &.funnel-kit{
    mask: url("../images/icons/funnel-kit.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/funnel-kit.svg") no-repeat center / contain;
  }

  &.get-response{
    mask: url("../images/icons/get-response.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/get-response.svg") no-repeat center / contain;
  }

  &.google-sheet{
    mask: url("../images/icons/google-sheet.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/google-sheet.svg") no-repeat center / contain;
  }

  &.jetpack{
    mask: url("../images/icons/jetpack.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/jetpack.svg") no-repeat center / contain;
  }

  &.notion{
    mask: url("../images/icons/notion.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/notion.svg") no-repeat center / contain;
  }

  &.newsletter{
    mask: url("../images/icons/newsletter.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/newsletter.svg") no-repeat center / contain;
  }

  &.omnisend{
    mask: url("../images/icons/omnisend.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/omnisend.svg") no-repeat center / contain;
  }

  &.pipedrive{
    mask: url("../images/icons/pipedrive.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/pipedrive.svg") no-repeat center / contain;
  }

  &.trello{
    mask: url("../images/icons/trello.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/trello.svg") no-repeat center / contain;
  }

  &.zoho{
    mask: url("../images/icons/zoho.svg") no-repeat center / contain;
    -webkit-mask: url("../images/icons/zoho.svg") no-repeat center / contain;
  }
}