@font-face {
    font-family: Vazir;
    src: url('../fonts/Vazir.eot');
    src: url('../fonts/Vazir.eot?#iefix') format('embedded-opentype'), url('../fonts/Vazir.woff2') format('woff2'), url('../fonts/Vazir.woff') format('woff'), url('../fonts/Vazir.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Vazir_number;
    src: url('../fonts/Vazir-FD.eot');
    src: url('../font/Vazir-FD.eot?#iefix') format('embedded-opentype'), url('../fonts/Vazir-FD.woff2') format('woff2'), url('../fonts/Vazir-FD.woff') format('woff'), url('../fonts/Vazir-FD.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    
    font-family: Vazir_number !important;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
}

    body:before {
        content: "";
        position: absolute;
        height: 20%;
        width: 20%;
        background: url('/images/bgimg.jpg');
        background-size: cover;
        z-index: -1; /* Keep the background behind the content */
        /* don't forget to use the prefixes you need */
        -webkit-transform: scale(5);
        -webkit-transform-origin: top left;
        -webkit-filter: blur(2px);
    }

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0, 0.4); /* Black w/opacity/see-through */
    color: white;
    font-weight: bold;
    border: 3px solid #f1f1f1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
   
    padding: 20px;
    text-align: center;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

h1,h2,h3, .newfont {
    font-family: Vazir_number !important;
}