@font-face {
  font-family: 'Graphik';
  src: local('GraphikLightItalic'),
      url('graphik/GraphikLightItalic.woff2') format('woff2'),
      url('graphik/GraphikLightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikExtralightItalic'),
      url('graphik/GraphikExtralightItalic.woff2') format('woff2'),
      url('graphik/GraphikExtralightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikLight'),
      url('graphik/GraphikLight.woff2') format('woff2'),
      url('graphik/GraphikLight.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikMediumItalic'),
      url('graphik/GraphikMediumItalic.woff2') format('woff2'),
      url('graphik/GraphikMediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikExtralight'),
      url('graphik/GraphikExtralight.woff2') format('woff2'),
      url('graphik/GraphikExtralight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikBoldItalic'),
      url('graphik/GraphikBoldItalic.woff2') format('woff2'),
      url('graphik/GraphikBoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikMedium'),
      url('graphik/GraphikMedium.woff2') format('woff2'),
      url('graphik/GraphikMedium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikThinItalic'),
      url('graphik/GraphikThinItalic.woff2') format('woff2'),
      url('graphik/GraphikThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikRegular'),
      url('graphik/GraphikRegular.woff2') format('woff2'),
      url('graphik/GraphikRegular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik Super';
  src: local('GraphikSuperItalic'),
      url('graphik/GraphikSuperItalic.woff2') format('woff2'),
      url('graphik/GraphikSuperItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikBold'),
      url('graphik/GraphikBold.woff2') format('woff2'),
      url('graphik/GraphikBold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikSemiboldItalic'),
      url('graphik/GraphikSemiboldItalic.woff2') format('woff2'),
      url('graphik/GraphikSemiboldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikThin'),
      url('graphik/GraphikThin.woff2') format('woff2'),
      url('graphik/GraphikThin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikBlackItalic'),
      url('graphik/GraphikBlackItalic.woff2') format('woff2'),
      url('graphik/GraphikBlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikBlack'),
      url('graphik/GraphikBlack.woff2') format('woff2'),
      url('graphik/GraphikBlack.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik Super';
  src: local('GraphikSuper'),
      url('graphik/GraphikSuper.woff2') format('woff2'),
      url('graphik/GraphikSuper.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikSemibold'),
      url('graphik/GraphikSemibold.woff2') format('woff2'),
      url('graphik/GraphikSemibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Graphik';
  src: local('GraphikRegularItalic'),
      url('graphik/GraphikRegularItalic.woff2') format('woff2'),
      url('graphik/GraphikRegularItalic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}