@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Medium'), local('San-Francisco-Pro-Text-Medium'),
      url('SFProText-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Regular'), local('San-Francisco-Pro-Text-Regular'),
      url('SFProText-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Semibold'), local('San-Francisco-Pro-Text-Semibold'),
      url('SFProText-Semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Light'), local('San-Francisco-Pro-Text-Light'),
      url('SFProText-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Heavy'), local('San-Francisco-Pro-Text-Heavy'),
      url('SFProText-Heavy.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'San Francisco Pro';
  src: local('San Francisco Pro Text Bold'), local('San-Francisco-Pro-Text-Bold'),
      url('SFProText-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}