const FontFace = () => (
  <style jsx global>
    {`
      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 100;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 200;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 300;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 600;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 700;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 800;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }

      @font-face {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 900;
        font-display: block;
        src: url(/fonts/Inter.woff2) format('woff2');
      }
    `}
  </style>
)

export default FontFace