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

@font-face {
  font-family: 'Lora';
  src: url('Lora-SemiBold.ttf');
  src: local('Lora SemiBold'), local('Lora-SemiBold'),
      url('Lora-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

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

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

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

@font-face {
  font-family: 'Mulish';
  src: url('Mulish-SemiBold.ttf');
  src: local('Mulish SemiBold'), local('Mulish-SemiBold'),
      url('Mulish-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

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

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

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