/* Font Family */
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);

@font-face {
    font-family: "Droid Arabic Naskh";
    font-style: normal;
    font-weight: 400;
    src: url(../../vendor/crudbooster/assets/fonts/DroidNaskh-Regular.eot);
    src: url(../../vendor/crudbooster/assets/fonts/DroidNaskh-Regular.eot?#iefix) format("embedded-opentype"),
        url(../../vendor/crudbooster/assets/fonts/DroidNaskh-Regular.woff2) format("woff2"),
        url(../../vendor/crudbooster/assets/fonts/DroidNaskh-Regular.woff) format("woff"),
        url(../../vendor/crudbooster/assets/fonts/DroidNaskh-Regular.ttf) format("truetype");
}

@font-face {
    font-family: "Droid Arabic Kufi";
    src: url("../../vendor/crudbooster/assets/fonts/DroidKufi/DroidArabicKufi.woff2") format("woff2"),
        url("../../vendor/crudbooster/assets/fonts/DroidKufi/DroidArabicKufi.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GE Dinar Two Medium';
    src: url('../../vendor/crudbooster/assets/GE_Dinar_Two_Medium.otf');
}

@font-face {
    font-family: 'BalooBhaijaan2';
    src: url('../../vendor/crudbooster/assets/fonts/BalooBhaijaan2/BalooBhaijaan2-Regular.ttf');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Add this line */
}
:root {
    --ar-font-family: "BalooBhaijaan2";
    --en-font-family: "Source Sans Pro Numbers";
}
/***************** Use English font for numbers only *****************/
@font-face {
    font-family: 'Source Sans Pro Numbers';
    src: url('https://fonts.gstatic.com/s/sourcesanspro/v21/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7l.woff2') format('woff2');
    unicode-range: U+0041-005A, U+0061-007A, U+0030-0039;
}
/***************** Use English font for numbers only *****************/


/* Font Size */
:root {
    --main-font-size: 14px;

    --font-size-first: 22px; /*page header*/
    --font-size-second: 9px;
    --font-size-third: 20px; /*logo*/
    --font-size-fourth: 24px; /*content header h1*/
    --font-size-fifth: 15px;
    --font-size-sixth: 12px; /*breadcrumb*/
    --font-size-seventh: 11px;
    --font-size-eighth: 18px;
    --font-size-ninth: 16px;
    --font-size-tenth: 10px;
    --font-size-eleventh: 17px;

    --font-size-twelfth: 38px; /*small box h3*/
    --font-size-thirteenth: 13px; /*small text*/
    --font-size-fourteenth: 90px; /*small box icon*/
    --font-size-fifteenth: 95px; /*small box hover icon*/
    --font-size-sixteenth: 30px;
    --font-size-seventeenth: 45px;
    --font-size-eighteenth: 100px; /*headline*/
    --font-size-nineteenth: 40px;
    --font-size-twentieth: 25px;
    --font-size-twenty-first: 65px;
    --font-size-twenty-second: 35px;
    --font-size-twenty-third: 21px;


    --side-bar-font-size: 13px;

    --sidebar-width: 250px;
    --sidebar-width-minus: -250px;
}

/* Colors */
:root {

    /*Main Colors*/
    --first-color: #174777;
    /*main color*/
    --second-color: #222d32;
    /*sidebar color*/
    --third-color: #333;
    /*font color*/

    /*Secondary Colors*/
    --fourth-color: #fff;
    --fifth-color: #fdf2f1;
    --sixth-color: #000;
    --seventh-color: #3c8dbc;
    --eighth-color: #fbfbfb;
    --ninth-color: #aaa;
    --tenth-color: #2196f3;
    --eleventh-color: #76c7c0;
    --twelfth-color: #ccc;
    --thirteenth-color: #e0e0e0;
    --fourteenth-color: rgba(0, 0, 0, 0.5);
    --fifteenth-color: rgba(0, 0, 0, 0.3);
    --sixteenth-color: #eee;
    --seventeenth-color: rgba(255, 140, 127, 0.7);
    --eighteenth-color: #222;
    --nineteenth-color: #999;
    --twentieth-color: red;
    --twenty-first-color: green;

    /*Skin Red Colors*/
    --twenty-second-color: #104274;
    --twenty-third-color: #204263;
    --twenty-fourth-color: #204263;
    --twenty-fifth-color: #666;
    --twenty-sixth-color: #d2d6de;
    --twenty-seventh-color: #f6f6f6;
    --twenty-eighth-color: rgba(0, 0, 0, 0.1);
    --twenty-ninth-color: rgba(255, 255, 255, 0.1);
    --thirtieth-color: #777;
    --thirty-first-color: #444;
    --thirty-second-color: #f4f4f5;
    --thirty-third-color: #f9fafc;
    --thirty-fourth-color: #848484;
    --thirty-fifth-color: #374850;
    --thirty-sixth-color: #8aa4af;
    --thirty-seventh-color: #b8c7ce;
    --thirty-eighth-color: #2c3b41;
    --thirty-ninth-color: #1e282c;
    --fortieth-color: #1a2226;
    --forty-first-color: #4b646f;

    /*Success Colors*/
    --forty-second-color: #00a65a;
    --forty-third-color: #008d4c;
    --forty-fourth-color: #00733e;

    /*Danger Colors + main color*/
    --forty-fifth-color: #c23321;

    /*Warning Colors*/
    --forty-sixth-color: #f39c12;
    --forty-seventh-color: #e08e0b;
    --forty-eighth-color: #c87f0a;
    --forty-ninth-color: #db8b0b;

    /*Info Colors*/
    --fiftieth-color: #00c0ef;
    --fifty-first-color: #00acd6;
    --fifty-second-color: #0097bc;
    --fifty-third-color: #00a7d0;

    /*Default Colors*/
    --fifty-fourth-color: #f9f9f9;
    --fifty-fifth-color: #f4f4f4;
    --fifty-sixth-color: #ddd;
    --fifty-seventh-color: #e7e7e7;
    --fifty-eighth-color: rgba(255, 255, 255, 0.7);

    /*Primary Colors + seventh color*/
    --fifty-ninth-color: #367fa9;
    --sixtieth-color: #307095;
    --sixty-first-color: #357ca5;

    /*theme other colors*/
    --sixty-second-color: #0073b7;
    --sixty-fourth-color: #001f3f;
    --sixty-fourth-color-2: #001a35;
    --sixty-fourth-color-3: #0089db;
    --sixty-fifth-color: #39cccc;
    --sixty-fifth-color-2: #30bbbb;
    --sixty-fifth-color-3: #7adddd;
    --sixty-fifth-color-4: #67a8ce;
    --sixty-fifth-color-5: #14d1ff;
    --sixty-sixth-color: #3d9970;
    --sixty-sixth-color-2: #368763;
    --sixty-seventh-color: #01ff70;
    --sixty-seventh-color-2: #00e765;
    --sixty-seventh-color-3: #00ca6d;
    --sixty-eighth-color: #ff851b;
    --sixty-eighth-color-2: #ff7701;
    --sixty-eighth-color-3: #f7bc60;
    --sixty-ninth-color: #f012be;
    --sixty-ninth-color-2: #db0ead;
    --seventieth-color: #605ca8;
    --seventieth-color-2: #555299;
    --seventieth-color-3: #9491c4;
    --seventy-first-color: #d81b60;
    --seventy-first-color-2: #ca195a;
    --seventy-first-color-3: #e73f7c;
    --seventy-first-color-4: #e47365;
    --seventy-second-color: #111111;
    --seventy-second-color-2: #2b2b2b;
    --seventy-third-color: #7a869d;
    --seventy-fourth-color: #606c84;

    --seventy-fifth-color: rgba(0, 0, 0, 0.2);
    --seventy-sixth-color: rgba(0, 0, 0, 0.125);
    --seventy-seventh-color: rgba(0, 0, 0, 0.15);
    --seventy-eighth-color: rgba(255, 255, 255, 0.15);
    --seventy-ninth-color: rgba(255, 255, 255, 0.2);
    --eightieth-color: #f7f7f7;
    --eighty-first-color: #555;

    /*login*/
    --eighty-second-color: #c5161c;
    --eighty-third-color: #fcf8e3;
    --eighty-fourth-color: #faebcc;
    --eighty-fifth-color: #8a6d3b;

    /*table footer total result*/
    --eighty-sixth-color: #1747773d;
    --eighty-seventh-color: #17477785;

}

/************************************/
/*Background Colors Class*/
/***********************************/
.bgColor-eighty-sixth-color {
    background-color: var(--eighty-sixth-color) !important;
}

.bgColor-eighty-seventh-color {
    background-color: var(--eighty-seventh-color) !important;
}