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

@font-face {
    font-family: 'Almarai';
    src: local('Almarai Light'), url('../../../../fonts/Almarai-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Almarai';
    src: local('Almarai Bold'), url('../../../../fonts/Almarai-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Almarai';
    src: local('Almarai ExtraBold'), url('../../../../fonts/Almarai-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}



html {
    direction: rtl;
}

body {
    margin:0;
    font-family: "Almarai", sans-serif; /* Use an Arabic-supported font here */
    background-color: rgba(240, 247, 250, 1);
}



li {
    list-style: none;
    text-align: center;
    font-size: 20px;
    padding: 4px;
    margin: 6px;
    font-weight: bold;
    /*font-family: Cambria;*/
    font-family: "Almarai", sans-serif; /* Use an Arabic-supported font here */
}

h4 {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    font-family: "Almarai", sans-serif; /* Use an Arabic-supported font here */
}
/* Style the error message text */
.validation-error {
    color: red;
    font-size: 14px;
    font-weight: bold;
}

/* Style the input field with an error */
.input-error {
    border-color: red;
    background-color: #ffe6e6;
}