@import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');


@font-face {
    font-family: "Tajawal";
    src: url("../font/Tajawal-ExtraLight.eot");
    src: url("../font/Tajawal-ExtraLight.eot?#iefix") format('embedded-opentype'),
         url("../font/Tajawal-ExtraLight.woff2") format('woff2'),
         url("../font/Tajawal-ExtraLight.woff") format('woff'),
         url("../font/Tajawal-ExtraLight.ttf") format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "Tajawal";
    src: url("../font/Tajawal-Light.eot");
    src: url("../font/Tajawal-Light.eot?#iefix") format('embedded-opentype'),
         url("../font/Tajawal-Light.woff2") format('woff2'),
         url("../font/Tajawal-Light.woff") format('woff'),
         url("../font/Tajawal-Light.ttf") format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "Tajawal";
    src: url("../font/Tajawal-Regular.eot");
    src: url("../font/Tajawal-Regular.eot?#iefix") format('embedded-opentype'),
         url("../font/Tajawal-Regular.woff2") format('woff2'),
         url("../font/Tajawal-Regular.woff") format('woff'),
         url("../font/Tajawal-Regular.ttf") format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "Tajawal";
    src: url("../font/Tajawal-Medium.eot");
    src: url("../font/Tajawal-Medium.eot?#iefix") format('embedded-opentype'),
         url("../font/Tajawal-Medium.woff2") format('woff2'),
         url("../font/Tajawal-Medium.woff") format('woff'),
         url("../font/Tajawal-Medium.ttf") format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Tajawal";
    src: url('../font/Tajawal-Bold.eot');
    src: url('../font/Tajawal-Bold.eot?#iefix') format('embedded-opentype'),
         url('../font/Tajawal-Bold.woff2') format('woff2'),
         url('../font/Tajawal-Bold.woff') format('woff'),
         url('../font/Tajawal-Bold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "Tajawal";
    src: url('../font/Tajawal-ExtraBold.eot');
    src: url('../font/Tajawal-ExtraBold.eot?#iefix') format('embedded-opentype'),
         url('../font/Tajawal-ExtraBold.woff2') format('woff2'),
         url('../font/Tajawal-ExtraBold.woff') format('woff'),
         url('../font/Tajawal-ExtraBold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Tajawal";
    src: url('../font/Tajawal-Black.eot');
    src: url('../font/Tajawal-Black.eot?#iefix') format('embedded-opentype'),
         url('../font/Tajawal-Black.woff2') format('woff2'),
         url('../font/Tajawal-Black.woff') format('woff'),
         url('../font/Tajawal-Black.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "star";
    src: url('../font/star.woff') format('woff'),
         url('../font/star.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

.font-family-tajawal
{
    font-family: 'Tajawal' !important;
}
.font-family-lato
{
    font-family: 'Lato' !important;
}
.font-family-quicksand
{
    font-family: 'Quicksand' !important;
}

.fw-100
{
    font-weight: 100 !important;
}
.fw-200
{
    font-weight: 200 !important;
}
.fw-300
{
    font-weight: 300 !important;
}
.fw-400
{
    font-weight: 400 !important;
}
.fw-500
{
    font-weight: 500 !important;
}
.fw-600
{
    font-weight: 600 !important;
}
.fw-700
{
    font-weight: 700 !important;
}
.fs-11
{
    font-size: 11px !important;
}
.fs-12
{
    font-size: 12px !important;
}
.fs-13
{
    font-size: 13px !important;
}
.fs-14
{
    font-size: 14px !important;
}
.fs-15
{
    font-size: 15px !important;
}
.fs-16
{
    font-size: 16px !important;
}
.fs-17
{
    font-size: 17px !important;
}
.fs-18
{
    font-size: 18px !important;
}
.fs-20
{
    font-size: 20px !important;
}
.fs-22
{
    font-size: 22px !important;
}
.fs-24
{
    font-size: 24px !important;
}
.fs-26
{
    font-size: 26px !important;
}
.fs-30
{
    font-size: 30px !important;
}
.fs-32
{
    font-size: 32px !important;
}
.fs-36
{
    font-size: 36px !important;
}
.fs-40
{
    font-size: 40px !important;
}
.fs-48
{
    font-size: 48px !important;
}
.fs-50
{
    font-size: 50px !important;
}
.fs-64
{
    font-size: 64px !important;
}
.fs-96
{
    font-size: 96px !important;
}