@font-face {
  font-family: "errex-lijmtechniek";
  src: url("../fonts/errex-lijmtechniek.woff2") format("woff2"),
    url("../fonts/errex-lijmtechniek.ttf") format("truetype"),
    url("../fonts/errex-lijmtechniek.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.icon-font::before {
  /* Use !important to prevent extensions from overriding this font. */
  font-family: var(--icon-font) !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  font-size: var(--icon-font--size, var(--icon-font--size-normal));
  display: inline-block;
  text-transform: none;
  text-indent: 0;
  color: currentColor;
  letter-spacing: var(--icon-font--letter-spacing);
  transform: var(--icon-font--alignment-offset);
  /* line-height: 1; */
  /* vertical-align: baseline; */

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

/* Custom added */
:root {
  --icon-font: 'errex-lijmtechniek';
  --icon-font-brands: 'Font Awesome 5 Brands';
  --icon-font--weight: normal;
  --icon-font--letter-spacing: normal;
  --icon-font--size-default: 1em;
  --icon-font--size: var(--icon-font--size-normal);
  --icon-font--size-xsmall: calc(var(--icon-font--size-default) * .75);
  --icon-font--size-small: calc(var(--icon-font--size-default) * .875);
  --icon-font--size-normal: calc(var(--icon-font--size-default) * 1);
  --icon-font--size-medium: calc(var(--icon-font--size-default) * 1.125);
  --icon-font--size-large: calc(var(--icon-font--size-default) * 1.25);
  --icon-font--size-xlarge: calc(var(--icon-font--size-default) * 1.375);
  --icon-font--size-2xlarge: calc(var(--icon-font--size-default) * 1.5);
  --icon-font--size-3xlarge: calc(var(--icon-font--size-default) * 1.625);
  --icon-font--alignment-offset: translateY(0px);
  /* icons */
  --icon-font--open-in-new: "\f051";
  --icon-font--account-circle-outlined: "\f050";
  --icon-font--account-circle: "\f04f";
  --icon-font--account-outlined: "\f04e";
  --icon-font--account: "\f04d";
  --icon-font--add-circle-outlined: "\f04c";
  --icon-font--add-circle: "\f04b";
  --icon-font--add-large: "\f04a";
  --icon-font--add: "\f049";
  --icon-font--arrow-back: "\f048";
  --icon-font--arrow-downward: "\f047";
  --icon-font--arrow-forward: "\f046";
  --icon-font--arrow-outward: "\f045";
  --icon-font--arrow-upward: "\f044";
  --icon-font--subscriptions: "\f043";
  --icon-font--call-outlined: "\f042";
  --icon-font--call: "\f041";
  --icon-font--cancel-outlined: "\f040";
  --icon-font--cancel: "\f03f";
  --icon-font--check-circle-outlined: "\f03e";
  --icon-font--check-circle: "\f03d";
  --icon-font--check: "\f03c";
  --icon-font--chevron-back: "\f03b";
  --icon-font--chevron-forward: "\f03a";
  --icon-font--close: "\f039";
  --icon-font--payment-outlined: "\f036";
  --icon-font--payment-note: "\f035";
  --icon-font--download: "\f034";
  --icon-font--edit-note-outlined: "\f033";
  --icon-font--edit-note: "\f032";
  --icon-font--edit-square-outlined: "\f031";
  --icon-font--edit-square: "\f030";
  --icon-font--error-outlined: "\f02f";
  --icon-font--error: "\f02e";
  --icon-font--file-save-outlined: "\f02d";
  --icon-font--file-save: "\f02c";
  --icon-font--home-alt-outlined: "\f02b";
  --icon-font--home-alt: "\f02a";
  --icon-font--home-pin-outlined: "\f028";
  --icon-font--home-pin: "\f027";
  --icon-font--home-outlined: "\f029";
  --icon-font--home: "\f026";
  --icon-font--info-outlined: "\f025";
  --icon-font--info: "\f024";
  --icon-font--logout: "\f023";
  --icon-font--mail-outlined: "\f022";
  --icon-font--mail: "\f021";
  --icon-font--mobile-outlined: "\f020";
  --icon-font--mobile: "\f01f";
  --icon-font--person-3-outlined: "\f01e";
  --icon-font--person-3: "\f01d";
  --icon-font--radio-button-checked: "\f01a";
  --icon-font--receipt-long-outlined: "\f019";
  --icon-font--receipt-long: "\f018";
  --icon-font--receipt-outlined: "\f017";
  --icon-font--receipt: "\f016";
  --icon-font--report-outlined: "\f015";
  --icon-font--report: "\f014";
  --icon-font--search: "\f013";
  --icon-font--basket-outlined: "\f012";  
  --icon-font--basket: "\f011";  
  --icon-font--bag-outlined: "\f010";  
  --icon-font--bag: "\f00f";  
  --icon-font--cart-outlined: "\f00e";  
  --icon-font--cart: "\f00d";  
  --icon-font--dashboard-outlined: "\f00c";  
  --icon-font--dashboard: "\f00b";  
  --icon-font--star-rate-outlined: "\f009\f009\f009\f009\f009";  
  --icon-font--star-rate: "\f008\f008\f008\f008\f008";  
  --icon-font--star-outlined: "\f00a";  
  --icon-font--star: "\f007";  
  --icon-font--task: "\f006";  
  --icon-font--visibility-outlined: "\f005";  
  --icon-font--visibility: "\f004";  
  --icon-font--wallet: "\f003";
  --icon-font--warning-outlined: "\f002";
  --icon-font--warning: "\f001";
  --icon-font--zoom: "\f000";
}

.icon-font {
  display: inline-flex;
}

.icon-font:not(.icon-font--no-offset)::after {
  font-size: calc(1em + (var(--button--space--offset) * 2));
}

.button.icon-font:not(.icon-font--no-offset) {  
  padding-top: var(--button-with-icon--space--top);
  padding-bottom: var(--button-with-icon--space--bottom);
}

.icon-font--xsmall::before { --icon-font--size: var(--icon-font--size-xsmall); }
.icon-font--small::before { --icon-font--size: var(--icon-font--size-small); }
.icon-font--normal::before { --icon-font--size: var(--icon-font--size-normal); }
.icon-font--medium::before { --icon-font--size: var(--icon-font--size-medium); }
.icon-font--large::before { --icon-font--size: var(--icon-font--size-large); }
.icon-font--xlarge::before { --icon-font--size: var(--icon-font--size-xlarge); }

.icon-font--mobile::before { content: var(--icon-font--mobile); } 
.icon-font--call::before { content: var(--icon-font--call); } 
.icon-font--mail::before { content: var(--icon-font--mail); } 
.icon-font--account::before { content: var(--icon-font--account); } 
.icon-font--arrow-forward::before { content: var(--icon-font--arrow-forward); } 
.icon-font--chevron-back::before { content: var(--icon-font--chevron-back); } 
.icon-font--chevron-forward::before { content: var(--icon-font--chevron-forward); } 
.icon-font--file-save::before { content: var(--icon-font--file-save); } 
.icon-font--open-in-new::before { content: var(--icon-font--open-in-new); } 

.icon-font--after::before { order: 1; }

.icon-font--chevron-forward { transform: translateX(.0625em); } 
