﻿@font-face {
    font-family: 'Janna LT Regular';
    src: url('../Fonts/Janna LT Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Janna LT Bold';
    src: url('../Fonts/Janna LT Bold.ttf') format('truetype');
}

:root {
    --blue-color:#6d0743;
    --gray-color:#F1F3F4;
    --dark-gray-color:#BDBDBD;
    --gold-color:#C8B18B;
    --white-color:#fff;
    --arabic-font:"Janna LT Bold";
    --english-font:"Janna LT Bold";
}

body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--english-font);
    background-color: var(--gray-color);
    /*background: url('../Media/main_bg_3.png') repeat;*/
}

.top-sm-nav {
    width: 100%;
    min-height: 3vh;
    background-color: #333E48;
    padding-top: 5px;
}

    .top-sm-nav .top-sm-nav-inner {
        width: 90%;
        margin-inline: auto;
    }

        .top-sm-nav .top-sm-nav-inner .social-media-icon > a > * {
            color: var(--white-color);
            cursor: pointer;
        }

    .top-sm-nav .change-lang-container .Arabic-lang-btn {
        color: var(--white-color);
        font-family: var(--arabic-font); /*font-weight:600;*/
        text-decoration: none;
    }

.top-main-nav {
    width: 100%;
    min-height: 11vh;
    background-color: var(--white-color);
    padding-block: 20px;
    justify-content: space-between;
}

    .top-main-nav .image-logo-container {
        width: 15%;
        height: 100%;
        text-decoration: none;
    }

        .top-main-nav .image-logo-container > img {
            width: 100%;
            height: 100%;
        }

.page-top-border-2 {
    background-color: #333E48;
    height: 6px !important;
    border: none;
    margin: 0;
    position: relative;
    opacity: 1;
}

a.me-2.ms-2 {
    text-decoration: none;
}

.spinner-container {
    position: fixed;
    width: 100%;
    height: 110vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffffbf;
    z-index: 200000000;
    margin-top: -22vh;
}

.text-primary {
    --bs-text-opacity: 1;
    color: rgba(142, 43, 43, var(--bs-text-opacity)) !important;
}

.NoOverFlow {
    overflow: hidden;
}

.hiden {
    display: none;
}

.login-alert {
    display: flex !important;
    justify-content: space-between;
    opacity: 1;
    padding-inline: 5%;
    transition: all 0.5s ease-in-out;
}

.login-alert-Reload, .login-alert-Reload-Success {
    display: flex !important;
    justify-content: space-between;
    opacity: 1;
    padding-inline: 5%;
    transition: all 0.5s ease-in-out;
}

.hiden-alert {
    display: none !important;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}

.footer-main-nav {
    width: 100%;
    background-color: #333E48;
    color: white;
    display: flex;
    padding: 10px;
    text-align: left;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    padding-bottom: 20px;
    box-shadow: 0 0px 19px #cacaca;
    -moz-box-shadow: 0 0px 19px #CACACA;
    -ms-box-shadow: 0 0px 19px #CACACA;
    -o-box-shadow: 0 0px 19px #CACACA;
    -webkit-box-shadow: 0 0px 19px #cacaca;
}

.Privacy-btn {
    color: white;
}

.CutomeFooter {
    position: fixed;
    bottom: 0;
    width: 100%;
}

img.footer-image {
    width: 25px;
    vertical-align: sub;
}

img.Arrow-image {
    width: 40px;
}

@media (max-width:850px) {
    div#Footer_E {
        justify-content: flex-start !important;
    }

    .Privacy-btn {
        display: flex;
        text-align: left;
    }

    .bar {
        display: none;
    }

    a#Privacy_E {
        display: flex;
        text-align: left;
        margin-right: 0.5rem !important;
    }

    span#Copyright_E {
        display: flex;
        margin: 0px !important;
        text-align: left;
    }

    span#Follow_E {
        display: flex;
        text-align: left;
    }

    .top-main-nav .image-logo-container {
        width: 35%;
    }
}
