@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('almarai-300-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('almarai-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('almarai-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Almarai';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('almarai-800-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('amiri-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('amiri-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('cairo-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('cairo-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('cairo-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('cairo-800-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('cairo-900-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('changa-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('changa-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('changa-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('changa-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Changa';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('changa-800-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('ibm-plex-sans-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('ibm-plex-sans-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('ibm-plex-sans-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('ibm-plex-sans-arabic-300-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('ibm-plex-sans-arabic-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('ibm-plex-sans-arabic-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('ibm-plex-sans-arabic-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('ibm-plex-sans-arabic-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('manrope-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('manrope-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('manrope-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('manrope-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('outfit-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('outfit-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('outfit-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('playfair-display-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('playfair-display-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('playfair-display-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Saira';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('saira-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Saira';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('saira-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('space-grotesk-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('space-grotesk-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('space-grotesk-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('space-grotesk-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('tajawal-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('tajawal-500-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('tajawal-700-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('tajawal-800-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('tajawal-900-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('unbounded-400-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('unbounded-600-normal.ttf') format('truetype');
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('unbounded-700-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('elmessiri-700-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'Lalezar';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('lalezar-400-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'Lateef';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('lateef-400-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'Mada';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('mada-700-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'Reem Kufi';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('reem-kufi-700-normal.ttf') format('truetype');
}

@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('scheherazade-new-700-normal.ttf') format('truetype');
}