@font-face {
    font-family: "NarkissBlock-Bold";
    src: url("../fonts/NarkissBlock-Bold.woff2") format("woff2"),
        url("../fonts/NarkissBlock-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "NarkissBlock-Light";
    src: url("../fonts/NarkissBlock-Light.woff2") format("woff2"),
        url("../fonts/NarkissBlock-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "NarkissBlock-Medium";
    src: url("../fonts/NarkissBlock-Medium.woff2") format("woff2"),
        url("../fonts/NarkissBlock-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

html,
body {
    background: #fff;
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: "NarkissBlock-Medium";
    font-size: 16px;
    direction: rtl;
}

.show-on-mobile {
    display: none !important;
}

.show-on-mobile-flex {
    display: none !important;
}

.show-on-mobile-inline {
    display: none !important;
}

.hide-on-mobile {
    display: block !important;
}

.hide-on-mobile-flex {
    display: flex !important;
}

.hide-on-mobile-inline {
    display: inline !important;
}

.bg-pink {
    background-color: #9D3E5E;
}

.bg-main {
    position: relative;
    /* background-image: url('../images/main.jpg');
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover; */
}

.heading-1 {
    color: #fff;
    font-size: 2.5vw;
}

.heading-2 {
    font-family: "NarkissBlock-Bold";
    color: #fff;
    font-size: 3vw;
}

.heading-3 {
    font-family: "NarkissBlock-Bold";
    color: #9D3E5E;
    font-size: 1.75vw;
}

.form-control {
    text-align: center;
    font-size: 1.75vw;
    background-color: #f4f4f4;
    border-radius: 0;
}

p,
.form-label {
    color: #9D3E5E;
}

.btn-bordo {
    font-size: 1.75vw;
    --bs-btn-color: #fff !important;
    --bs-btn-bg: #9D3E5E !important;
    --bs-btn-border-color: #9D3E5E !important;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #9D3E5E;
    --bs-btn-hover-border-color: #9D3E5E !important;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #9D3E5E;
    --bs-btn-active-border-color: #9D3E5E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #9D3E5E;
    --bs-btn-disabled-border-color: #9D3E5E;
}

@media all and (max-width:1000px) {
    

    .hide-on-mobile {
        display: none !important;
    }

    .hide-on-mobile-flex {
        display: none !important;
    }

    .hide-on-mobile-inline {
        display: none !important;
    }

    .show-on-mobile {
        display: block !important;
    }

    .show-on-mobile-flex {
        display: flex !important;
    }

    .show-on-mobile-inline {
        display: inline !important;
    }

    .heading-1 {
        font-size: 3vh;
    }

    .heading-2 {
        font-size: 3.5vh;
    }
    /* .heading-2 br {
        display: none;
    } */
    .heading-3 {
        font-size: 2.4vh;
    }

    .form-control {
        font-size: 2vh;
    }

    .btn-bordo {
        font-size: 2vh;
    }
    .box {
        z-index: 999;
        margin: -10vh auto 0 auto;
    }
}