@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(tajawal-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(tajawal-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(tajawal-2.ttf) format('truetype');
}

@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(elmessiri-0.ttf) format('truetype');
}
@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(elmessiri-1.ttf) format('truetype');
}
@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(elmessiri-2.ttf) format('truetype');
}
@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(elmessiri-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(cairo-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(cairo-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(cairo-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(cairo-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(almarai-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(almarai-1.ttf) format('truetype');
}

@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(notosansarabic-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(notosansarabic-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(notosansarabic-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(notosansarabic-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Noto Kufi Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(notokufiarabic-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Kufi Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(notokufiarabic-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Kufi Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(notokufiarabic-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Kufi Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(notokufiarabic-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(notonaskharabic-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(notonaskharabic-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(notonaskharabic-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(notonaskharabic-3.ttf) format('truetype');
}

@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(ibmplexsansarabic-0.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(ibmplexsansarabic-1.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(ibmplexsansarabic-2.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(ibmplexsansarabic-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(readexpro-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(readexpro-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(readexpro-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Readex Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(readexpro-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(changa-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(changa-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(changa-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(changa-3.ttf) format('truetype');
}

@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(amiri-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(amiri-1.ttf) format('truetype');
}

@font-face {
  font-family: 'Alexandria';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(alexandria-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Alexandria';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(alexandria-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Alexandria';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(alexandria-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Alexandria';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(alexandria-3.ttf) format('truetype');
}