@import 'header.css';
@import 'sidemenu.css';
@import 'page.css';
@import 'login.css';
@import 'responsive.css';



:root {
    --color-body: #F9FAFB;
    --color-white: #fff;
    --color-black: #000;
    --color-primary: #2565AE;
    --color-secondary: #080808;
    --color-gray: #626C83;
    --color-2a: #2A3342;
    --color-40: #40444C;
    --color-96: #96A0B6;
    --color-1f: #1F2A5C;
    --color-e2: #E2E6EE;
    --color-f1: #F1F3F9;
    --color-dd: #DDF2FF;
    --color-c0: #C0E7FF;
    --color-e5: #E5FABE;
    --color-d0: #D0EE97;
    --color-fe: #FEE4D0;
    --color-ff: #FFD0AA;
    --color-fff: #FFF9C7;
    --color-fff4: #FFF494;
    --color-4f: #4F4F4F;
    --color-1c: #1C1F26;
    --font-light: 'MadaniArabicLight';
    --font-medium: 'MadaniArabicMedium';
    --font-bold: 'MadaniArabicBold';
    --font-semibold: 'MadaniArabicSemiBold';
    --font-extralight: 'MadaniArabicExtraLight';
    --font-extrabold: 'MadaniArabicExtraBold';
    --font-thin: 'MadaniArabicThin';
    --font-black: 'MadaniArabicBlack';
    --font-size-12: 0.62vw;
    --font-size-13: 0.67vw;
    --font-size-14: 0.72vw;
    --font-size-15: 0.78vw;
    --font-size-16: 0.83vw;
    --font-size-17: 0.88vw;
    --font-size-18: 0.93vw;
    --font-size-19: 0.98vw;
    --font-size-20: 1.04vw;
    --font-size-21: 1.09vw;
    --font-size-22: 1.14vw;
    --font-size-23: 1.19vw;
    --font-size-24: 1.25vw;
    --font-size-25: 1.30vw;
    --font-size-26: 1.35vw;
    --font-size-27: 1.40vw;
    --font-size-28: 1.45vw;
    --font-size-29: 1.51vw;
    --font-size-30: 1.56vw;
    --font-size-31: 1.61vw;
    --font-size-32: 1.66vw;
    --font-size-33: 1.71vw;
    --font-size-34: 1.77vw;
    --font-size-35: 1.82vw;
    --font-size-36: 1.87vw;
    --font-size-37: 1.92vw;
    --font-size-38: 1.97vw;
    --font-size-39: 2.03vw;
    --font-size-40: 2.08vw;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'MadaniArabic', sans-serif;
    color: #000;
    font-size: var(--font-size-16);
    background-color: var(--color-body);
    overflow-x: hidden;
    line-height: normal;
}

@font-face {
    font-family: 'MadaniArabic';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicRegular.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicLight';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicLight.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicMedium';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicMedium.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicBold';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicBold.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicSemiBold';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicSemiBold.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicExtraLight';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicExtraLight.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicExtraBold';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicExtraBold.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicThin';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabicThin.ttf") format('truetype');
}

@font-face {
    font-family: 'MadaniArabicBlack';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/MadaniArabic.ttf") format('truetype');
}


@media(min-width: 768px) {
    .container {
        max-width: 98%;
    }
}

@media(max-width: 992px) {
    :root {
        --font-size-12: calc(0.5em + 0.62vw);
        --font-size-13: calc(0.5em + 0.67vw);
        --font-size-14: calc(0.5em + 0.72vw);
        --font-size-15: calc(0.5em + 0.78vw);
        --font-size-16: calc(0.5em + 0.83vw);
        --font-size-17: calc(0.5em + 0.88vw);
        --font-size-18: calc(0.5em + 0.93vw);
        --font-size-19: calc(0.5em + 0.98vw);
        --font-size-20: calc(0.5em + 1.04vw);
        --font-size-21: calc(0.5em + 1.09vw);
        --font-size-22: calc(0.5em + 1.14vw);
        --font-size-23: calc(0.5em + 1.19vw);
        --font-size-24: calc(0.5em + 1.25vw);
        --font-size-25: calc(0.5em + 1.30vw);
        --font-size-26: calc(0.5em + 1.35vw);
        --font-size-27: calc(0.5em + 1.40vw);
        --font-size-28: calc(0.5em + 1.45vw);
        --font-size-29: calc(0.5em + 1.51vw);
        --font-size-30: calc(0.5em + 1.56vw);
        --font-size-31: calc(0.5em + 1.61vw);
        --font-size-32: calc(0.5em + 1.66vw);
        --font-size-33: calc(0.5em + 1.71vw);
        --font-size-34: calc(0.5em + 1.77vw);
        --font-size-35: calc(0.5em + 1.82vw);
        --font-size-36: calc(0.5em + 1.87vw);
        --font-size-37: calc(0.5em + 1.92vw);
        --font-size-38: calc(0.5em + 1.97vw);
        --font-size-39: calc(0.5em + 2.03vw);
        --font-size-40: calc(0.5em + 2.08vw);
    }
}

@media(max-width: 480px) {
    :root {
        --font-size-12: calc(0.6em + 0.62vw);
        --font-size-13: calc(0.6em + 0.67vw);
        --font-size-14: calc(0.6em + 0.72vw);
        --font-size-15: calc(0.6em + 0.78vw);
        --font-size-16: calc(0.6em + 0.83vw);
        --font-size-17: calc(0.6em + 0.88vw);
        --font-size-18: calc(0.6em + 0.93vw);
        --font-size-19: calc(0.6em + 0.98vw);
        --font-size-20: calc(0.6em + 1.04vw);
        --font-size-21: calc(0.6em + 1.09vw);
        --font-size-22: calc(0.6em + 1.14vw);
        --font-size-23: calc(0.6em + 1.19vw);
        --font-size-24: calc(0.6em + 1.25vw);
        --font-size-25: calc(0.6em + 1.30vw);
        --font-size-26: calc(0.6em + 1.35vw);
        --font-size-27: calc(0.6em + 1.40vw);
        --font-size-28: calc(0.6em + 1.45vw);
        --font-size-29: calc(0.6em + 1.51vw);
        --font-size-30: calc(0.6em + 1.56vw);
        --font-size-31: calc(0.6em + 1.61vw);
        --font-size-32: calc(0.6em + 1.66vw);
        --font-size-33: calc(0.6em + 1.71vw);
        --font-size-34: calc(0.6em + 1.77vw);
        --font-size-35: calc(0.6em + 1.82vw);
        --font-size-36: calc(0.6em + 1.87vw);
        --font-size-37: calc(0.6em + 1.92vw);
        --font-size-38: calc(0.6em + 1.97vw);
        --font-size-39: calc(0.6em + 2.03vw);
        --font-size-40: calc(0.6em + 2.08vw);
    }
}