*{
    margin: 0;
    padding: 0;
}

html{
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    
}

body{
    margin: 0;
    padding: 10px;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    font-family: "Cairo", sans-serif;
    background:linear-gradient(0deg, rgba(255, 249, 231, 0.98), rgba(255, 249, 231, 0.98)), url(bg.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.text-primary{
    color: #BF9D2F !important;
}
.border-content{
    border: 2px solid #BF9D2F;
    border-radius: 10px;
    width: 100%;
    min-height: 100vh;
    height: 100%;
    padding: 10px;
    display: inline-table;
}

.header-text-logo{
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;
}

.text-heading{
    color: #BF9D2F;
    width: 100%;
}
.uae-emblem{
    max-width: 130px;
}

.calender-info{
    color: #BF9D2F;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

form{
    /* text-align: right; */
    direction: rtl;
}

input, textarea{
    box-shadow: none !important;
    outline: 0;
}

input:focus, textarea:focus{
    border-color: #BF9D2F !important;
}

.btn-primary{
    background: #000 !important;
    box-shadow: none;
    outline: 0;
    border: 0;
}



.contact-box{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    border: 2px solid #BF9D2F;
    width: fit-content;
    margin: auto;
    border-radius: 10px;
    gap: 20px;
}

.contact-box .display-6{
    font-size: calc(1.225rem + 0.5vw);
}



@media(max-width:520px){
    .text-heading .display-1{
        font-size: calc(1.625rem + 1.5vw);
    }
    .uae-emblem{
        max-width: 80px;
    }
    .text-heading .display-5{
        font-size: calc(1.225rem + 0.5vw);
    }
    .calender-info .display-4{
        font-size: calc(1.0rem + 0.9vw);
    }
    .calender-info .display-6{
        font-size: calc(1.225rem + 0.5vw);
    }
    .qr_code{
        width: 60px;
    }

    .contact-box{
        flex-direction: column-reverse;
        justify-content: center;
        text-align: center;
    }

    .calender-info .display-3{
        font-size: calc(1.0rem + 2vw);
    }
    
}