:root{
    --theme-color-1: #cc932a;
    --primary-color: #053f28;
    --secondary-color: #1f7e57;
    --theme-color-light: #cc932a;
}

@font-face {
    font-family: 'Noto Nastaliq Urdu';
    src: url('NotoNastaliqUrdu-Bold.woff2') format('woff2'),
        url('NotoNastaliqUrdu-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

.font-urdu{
    font-family: 'Noto Nastaliq Urdu';
    font-weight: bold;
    color:var(--theme-color-light);
    font-size:30px;
    line-height:2.6;
    text-align: center;
}

@media only screen and (max-width: 600px) {
    .font-urdu{
        font-size:20px;
        line-height:2.0;
    }
}

p{
    text-align: justify;
}
.bg-primary{
    background-color: var(--primary-color) !important;
}
.bg-secondary{
    background-color: var(--secondary-color) !important;
}
.bg-light{
    background-color: var(--theme-color-light) !important;
    color: black !important;
}
.color-light{
    color: var(--theme-color-light);
}
b{font-weight: bold !important;}

.br-8{
    border-radius: 8px;
}
.footer-area a {
    color: var(--theme-color-light);
    font-weight: bold;
}

.preview-2 .nivo-directionNav a:hover::after{
    background: var(--theme-color-1) none repeat scroll 0 0;
}

/***Flex Start ***/
.flex{
    display: flex;
}
.flex-row{
    flex-direction: row;
}
.flex-column{
    flex-direction: column;
}
.flex-content-center, .content-center{
    justify-content: center;
}
.space-around{
    justify-content: space-around;
}
.space-between{
    justify-content: space-between;
}
.flex-item-stretch{
    align-items: stretch;
}
.flex-item-end{
    align-items: flex-end;
}
.flex-item-start{
    align-items: flex-start;
}
.flex-item-center, .item-center{
    align-items: center;
}
.flex-wrap{
    flex-wrap: wrap;
}
/*** Flex End ***/

.my-1{ 
    margin-top: 0.5rem !important;  
    margin-bottom: 0.5rem !important;
    
}
.my-2{ 
    margin-top: 1rem !important;    
    margin-bottom: 1rem !important;
}
.my-3{ 
    margin-top: 1.5rem !important;    
    margin-bottom: 1.5rem !important;
}
.my-4{ 
    margin-top: 2rem !important;    
    margin-bottom: 2rem !important;
}

.mx-1{ margin-left: 0.5rem !important;  margin-right: 0.5rem !important;}
.mx-2{ margin-left: 1rem !important;    margin-right: 1rem !important;}
.mx-3{ margin-left: 1.5rem !important;    margin-right: 1.5rem !important;}
.mx-4{ margin-left: 2rem !important;    margin-right: 2rem !important;}

.mt-1{margin-top: 0.5rem !important;}
.mt-2{margin-top: 1rem !important;}
.mt-3{margin-top: 1.5rem !important;}
.mt-4{margin-top: 2rem !important;}
.mt-5{margin-top: 2.5rem !important;}
.mt-6{margin-top: 3rem !important;}

.mb-1{margin-bottom: 0.5rem !important;}
.mb-2{margin-bottom: 1rem !important;}
.mb-3{margin-bottom: 1.5rem !important;}
.mb-4{margin-bottom: 2rem !important;}