@font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 400;
    src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot);
    src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot?#iefix) format('embedded-opentype'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff2) format('woff2'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff) format('woff'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.ttf) format('truetype');
  font-display: swap; 
  }
  @font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 700;
    src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.eot);
    src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.woff2) format('woff2'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.woff) format('woff'),
         url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.ttf) format('truetype');
         font-display: swap;
  }
:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #5a5377;
    --secondary: #b6b3df;
    --success: #67baaf;
    --info: #77708f;
    --warning: #feda63;
    --danger: #ff8671;
    --light: #efefef;
    --dark: #666;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
}

*,*::before,*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

article,aside,figcaption,figure,footer,header,hgroup,main,nav,section {
    display: block
}

body {
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fff
}

h1,h2,h3,h4,h5,h6 {
    margin-top: 0;
    margin-bottom: .5rem
}

p {
    margin-top: 0;
    margin-bottom: 1rem
}

ol,ul,dl {
    margin-top: 0;
    margin-bottom: 1rem
}

b,strong {
    font-weight: bolder
}

a {
    color: #5a5377;
    text-decoration: none;
    background-color: transparent
}

a:hover {
    color: #38344a;
    text-decoration: underline
}

img {
    vertical-align: middle;
    border-style: none
}

button {
    border-radius: 0
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color
}

input,button,select,optgroup,textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

button,[type="button"],[type="reset"],[type="submit"] {
    -webkit-appearance: button
}

button:not(:disabled),[type="button"]:not(:disabled),[type="reset"]:not(:disabled),[type="submit"]:not(:disabled) {
    cursor: pointer
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2
}

h1,.h1 {
    font-size: 2.5rem
}

h2,.h2 {
    font-size: 2rem
}

h3,.h3 {
    font-size: 1.75rem
}

h4,.h4 {
    font-size: 1.5rem
}

.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto
}

@media (min-width: 576px) {
    .container {
        max-width:540px
    }
}

@media (min-width: 768px) {
    .container {
        max-width:720px
    }
}

@media (min-width: 992px) {
    .container {
        max-width:960px
    }
}

@media (min-width: 1200px) {
    .container {
        max-width:1140px
    }
}

.container-fluid {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col,.col-auto,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm,.col-sm-auto,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-md,.col-md-auto,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg,.col-lg-auto,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl,.col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px
}

.col-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%
}

.col-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%
}

.col-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%
}

.col-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%
}

@media (min-width: 576px) {

    .col-sm-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-sm-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%
    }

    .col-sm-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        max-width: 41.66667%
    }

    .col-sm-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-sm-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        max-width: 58.33333%
    }

    .col-sm-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        max-width: 83.33333%
    }

}


@media (min-width: 768px) {

    .col-md-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        max-width: 16.66667%
    }

    .col-md-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%
    }

    .col-md-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        max-width: 58.33333%
    }

    .col-md-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%
    }

}



@media (min-width: 992px) {

    .col-lg-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        max-width: 16.66667%
    }

    .col-lg-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-lg-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
        flex: 0 0 66.66667%;
        max-width: 66.66667%
    }

}



@media (min-width: 1200px) {

    .col-xl-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

}


.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    -webkit-transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out
}

.btn:hover {
    color: #212529;
    text-decoration: none
}

.btn-primary {
    color: #fff;
    background-color: #5a5377;
    border-color: #5a5377
}

.btn-primary:hover {
    color: #fff;
    background-color: #494360;
    border-color: #433e59
}

.btn-secondary {
    color: #212529;
    background-color: #b6b3df;
    border-color: #b6b3df
}

.btn-danger {
    color: #212529;
    background-color: #ff8671;
    border-color: #ff8671
}

.btn-danger:hover {
    color: #fff;
    background-color: #ff654b;
    border-color: #ff5b3e
}

.fade {
    -webkit-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear
}

.fade:not(.show) {
    opacity: 0
}

.collapse:not(.show) {
    display: none
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height 0.35s ease;
    transition: height 0.35s ease
}

.dropup,.dropright,.dropdown,.dropleft {
    position: relative
}

.dropdown-toggle {
    white-space: nowrap
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: .25rem
}

.dropdown-menu.show {
    display: block
}

.nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

.nav-link {
    display: block;
    padding: .5rem 1rem
}

.nav-link:hover,.nav-link:focus {
    text-decoration: none
}

.nav-tabs {
    border-bottom: 1px solid #dee2e6
}

.nav-tabs .nav-item {
    margin-bottom: -1px
}

.nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem
}

.nav-tabs .nav-link:hover,.nav-tabs .nav-link:focus {
    border-color: #e9ecef #e9ecef #dee2e6
}


.nav-tabs .nav-link.active,.nav-tabs .nav-item.show .nav-link {
    color: #495057;
    background-color: #fff;
    border-color: #dee2e6 #dee2e6 #fff
}

.tab-content>.tab-pane {
    display: none
}

.tab-content>.active {
    display: block
}

.navbar {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .5rem 1rem
}

.navbar-brand {
    display: inline-block;
    padding-top: .3125rem;
    padding-bottom: .3125rem;
    margin-right: 1rem;
    font-size: 1.25rem;
    line-height: inherit;
    white-space: nowrap
}

.navbar-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

.navbar-nav .nav-link {
    padding-right: 0;
    padding-left: 0
}

.navbar-nav .dropdown-menu {
    position: static;
    float: none
}

.navbar-collapse {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.navbar-toggler {
    padding: .25rem .75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: .25rem
}

.navbar-toggler:hover,.navbar-toggler:focus {
    text-decoration: none
}

.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    content: "";
    background: no-repeat center center;
    background-size: 100% 100%
}



@media (min-width: 992px) {
    .navbar-expand-lg {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .navbar-expand-lg .navbar-nav {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: absolute
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: .5rem;
        padding-left: .5rem
    }

    .navbar-expand-lg .navbar-collapse {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-preferred-size: auto;
        flex-basis: auto
    }

    .navbar-expand-lg .navbar-toggler {
        display: none
    }
}



.navbar-dark .navbar-brand {
    color: #fff
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,0.5)
}

.navbar-dark .navbar-nav .nav-link:hover,.navbar-dark .navbar-nav .nav-link:focus {
    color: rgba(255,255,255,0.75)
}

.navbar-dark .navbar-nav .show>.nav-link,.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link.show,.navbar-dark .navbar-nav .nav-link.active {
    color: #fff
}

.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,0.5);
    border-color: rgba(255,255,255,0.1)
}

.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255,255,255,0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    -webkit-transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out
}

a.badge:hover,a.badge:focus {
    text-decoration: none
}

.badge-primary {
    color: #fff;
    background-color: #5a5377
}

a.badge-primary:hover,a.badge-primary:focus {
    color: #fff;
    background-color: #433e59
}

.badge-success {
    color: #212529;
    background-color: #67baaf
}

a.badge-success:hover,a.badge-success:focus {
    color: #212529;
    background-color: #4aa498
}

.badge-light {
    color: #212529;
    background-color: #efefef
}

a.badge-light:hover,a.badge-light:focus {
    color: #212529;
    background-color: #d6d6d6
}

.bg-primary {
    background-color: #5a5377 !important
}

.bg-success {
    background-color: #67baaf !important
}


.bg-info {
    background-color: #77708f !important
}

.bg-warning {
    background-color: #feda63 !important
}

.bg-light {
    background-color: #efefef !important
}

.border-0 {
    border: 0 !important
}

.border-top-0 {
    border-top: 0 !important
}

.border-primary {
    border-color: #5a5377 !important
}

.rounded-circle {
    border-radius: 50% !important
}

.d-none {
    display: none !important
}

.d-block {
    display: block !important
}

.d-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important
}


@media (min-width: 992px) {
    .d-lg-none {
        display:none !important
    }

    .d-lg-block {
        display: block !important
    }
}


.flex-column {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important
}

.flex-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important
}

.justify-content-center {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important
}

.justify-content-between {
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important
}

.justify-content-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important
}


.align-items-center {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important
}

.align-self-center {
    -ms-flex-item-align: center !important;
    -ms-grid-row-align: center !important;
    align-self: center !important
}

@media (min-width: 576px) {
    .flex-sm-row {
        -webkit-box-orient:horizontal !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: row !important;
        flex-direction: row !important
    }

}



.position-relative {
    position: relative !important
}

.position-absolute {
    position: absolute !important
}

.position-fixed {
    position: fixed !important
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    .sticky-top {
        position:-webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 1020
    }
}


.w-100 {
    width: 100% !important
}


.stretched-link::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    pointer-events: auto;
    content: "";
    background-color: rgba(0,0,0,0)
}

.m-0 {
    margin: 0 !important
}

.mt-0,.my-0 {
    margin-top: 0 !important
}


.mb-0,.my-0 {
    margin-bottom: 0 !important
}

.mr-1,.mx-1 {
    margin-right: .25rem !important
}


.ml-1,.mx-1 {
    margin-left: .25rem !important
}

.m-2 {
    margin: .5rem !important
}

.mt-2,.my-2 {
    margin-top: .5rem !important
}

.mr-2,.mx-2 {
    margin-right: .5rem !important
}

.mb-2,.my-2 {
    margin-bottom: .5rem !important
}

.ml-2,.mx-2 {
    margin-left: .5rem !important
}

.mt-3,.my-3 {
    margin-top: 1rem !important
}

.mr-3,.mx-3 {
    margin-right: 1rem !important
}

.mb-3,.my-3 {
    margin-bottom: 1rem !important
}

.mt-4,.my-4 {
    margin-top: 1.5rem !important
}

.mr-4,.mx-4 {
    margin-right: 1.5rem !important
}

.mb-4,.my-4 {
    margin-bottom: 1.5rem !important
}

.ml-4,.mx-4 {
    margin-left: 1.5rem !important
}

.m-5 {
    margin: 3rem !important
}

.mt-5,.my-5 {
    margin-top: 3rem !important
}


.mb-5,.my-5 {
    margin-bottom: 3rem !important
}

.ml-5,.mx-5 {
    margin-left: 3rem !important
}

.p-0 {
    padding: 0 !important
}

.pt-0,.py-0 {
    padding-top: 0 !important
}

.pr-0,.px-0 {
    padding-right: 0 !important
}

.pb-0,.py-0 {
    padding-bottom: 0 !important
}

.pl-0,.px-0 {
    padding-left: 0 !important
}

.p-1 {
    padding: .25rem !important
}

.pt-1,.py-1 {
    padding-top: .25rem !important
}

.pr-1,.px-1 {
    padding-right: .25rem !important
}

.pb-1,.py-1 {
    padding-bottom: .25rem !important
}

.pl-1,.px-1 {
    padding-left: .25rem !important
}

.p-2 {
    padding: .5rem !important
}

.pt-2,.py-2 {
    padding-top: .5rem !important
}

.pr-2,.px-2 {
    padding-right: .5rem !important
}

.pb-2,.py-2 {
    padding-bottom: .5rem !important
}

.pl-2,.px-2 {
    padding-left: .5rem !important
}

.p-3 {
    padding: 1rem !important
}

.pt-3,.py-3 {
    padding-top: 1rem !important
}

.pr-3,.px-3 {
    padding-right: 1rem !important
}

.pb-3,.py-3 {
    padding-bottom: 1rem !important
}

.pl-3,.px-3 {
    padding-left: 1rem !important
}

.p-4 {
    padding: 1.5rem !important
}

.pt-4,.py-4 {
    padding-top: 1.5rem !important
}

.pr-4,.px-4 {
    padding-right: 1.5rem !important
}

.pb-4,.py-4 {
    padding-bottom: 1.5rem !important
}

.pl-4,.px-4 {
    padding-left: 1.5rem !important
}

.p-5 {
    padding: 3rem !important
}

.pt-5,.py-5 {
    padding-top: 3rem !important
}

.pr-5,.px-5 {
    padding-right: 3rem !important
}

.pb-5,.py-5 {
    padding-bottom: 3rem !important
}

.mr-n4,.mx-n4 {
    margin-right: -1.5rem !important
}

.mr-auto,.mx-auto {
    margin-right: auto !important
}

.mb-auto,.my-auto {
    margin-bottom: auto !important
}

.ml-auto,.mx-auto {
    margin-left: auto !important
}

@media (min-width: 576px) {
    .m-sm-0 {
        margin:0 !important
    }

    .mt-sm-0,.my-sm-0 {
        margin-top: 0 !important
    }

    .mr-sm-0,.mx-sm-0 {
        margin-right: 0 !important
    }

    .mr-sm-3,.mx-sm-3 {
        margin-right: 1rem !important
    }

}


@media (min-width: 768px) {

    .mt-md-4,.my-md-4 {
        margin-top: 1.5rem !important
    }

    .ml-md-5,.mx-md-5 {
        margin-left: 3rem !important
    }

    .pr-md-5,.px-md-5 {
        padding-right: 3rem !important
    }

    .pb-md-5,.py-md-5 {
        padding-bottom: 3rem !important
    }

    .pl-md-5,.px-md-5 {
        padding-left: 3rem !important
    }

}

@media (min-width: 992px) {

    .ml-lg-3,.mx-lg-3 {
        margin-left: 1rem !important
    }

}



.text-right {
    text-align: right !important
}

.text-center {
    text-align: center !important
}



.text-uppercase {
    text-transform: uppercase !important
}

.font-weight-normal {
    font-weight: 400 !important
}

.font-weight-bold {
    font-weight: 700 !important
}

.font-weight-bolder {
    font-weight: bolder !important
}

.text-white {
    color: #fff !important
}

.text-primary {
    color: #5a5377 !important
}


.text-success {
    color: #67baaf !important
}

a.text-success:hover,a.text-success:focus {
    color: #429288 !important
}


.text-warning {
    color: #feda63 !important
}

.text-danger {
    color: #ff8671 !important
}


.text-light {
    color: #efefef !important
}

.text-dark {
    color: #666 !important
}


.text-muted {
    color: #6c757d !important
}

.text-white-50 {
    color: rgba(255,255,255,0.5) !important
}

.text-decoration-none {
    text-decoration: none !important
}

h1,h2,h3,h4 {
    letter-spacing: -1px;
    font-family: "Droid Arabic Kufi", sans-serif !important;
    font-weight: 700 !important
}

div,p,.droidKufi {
    font-family: "Droid Arabic Kufi", sans-serif !important;
    font-weight: 400 !important
}

.rtl {
    direction: rtl
}

.line-height-13 {
    line-height: 1.3
}

.navbar-toggler {
    margin-right: 5rem
}

#menuToggleBtn {
    z-index: 10
}

#navbarSupportedContent {
    z-index: 11
}

html {
    overflow-x: hidden !important
}

body {
    overflow-x: hidden !important
}

@media (max-width: 1199.98px) {
    ul.navbar-nav {
        text-align:center !important;
        padding: 0 !important;
        margin: 0 !important
    }

    ul.navbar-nav li {
        padding-right: 0 !important;
        margin-right: 0 !important
    }

    nav {
        padding-left: 0 !important
    }
}


@media (min-width: 992px) {
    .customDropdown {
        min-width:52.25rem;
        right: -220%;
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }
}


@media (min-width: 1200px) {
    .bcLogoLeftMargin {
        margin-left:18.5vw !important
    }

    .navMarginRight {
        margin-right: 15% !important
    }

    .customDropdown {
        min-width: 53rem;
        right: -220%;
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

}


@media (min-width: 1440px) {
    .navMarginRight {
        margin-right:25% !important
    }
}

.activeNav {
    background-color: #77708f;
    padding-top: 0.6rem !important;
    padding-bottom: 0.6rem !important
}

.activeNav a {
    color: #efefef !important
}

.navbar-collapse li {
    padding-top: 0.6rem !important;
    padding-bottom: 0.6rem !important
}

.navbar-collapse li:hover {
    background-color: #77708f
}

.dropDownReportsList img {
    margin-top: 0.15rem
}



.delay-200ms {
    -webkit-transition-delay: 200ms;
    transition-delay: 200ms;
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms
}

.delay-400ms {
    -webkit-transition-delay: 400ms;
    transition-delay: 400ms;
    -webkit-animation-delay: 400ms;
    animation-delay: 400ms
}

.delay-700ms {
    -webkit-transition-delay: 700ms;
    transition-delay: 700ms;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms
}


.dropDownReportsList a img {
    transition: all 200ms ease-out;
    -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -ms-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out
}

.font-size-4 {
    font-size: 1.25rem
}

.custom-rounded-badge {
    border-radius: 0.8rem;
    -webkit-border-radius: 0.8rem;
    -moz-border-radius: 0.8rem;
    -ms-border-radius: 0.8rem;
    -o-border-radius: 0.8rem
}

.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary:active:focus:not(:disabled):not(.disabled),.btn:focus,.btn:active,.btn:hover,select,.badge,input,textarea {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    outline: 0
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    ul.navMarginRight {
        margin-left:40px !important
    }

    .bcLogoLeftMargin {
        margin-left: 17vw !important
    }
}

@media (max-width: 767.98px) {
    #bcMainLogo {
        width:135px !important
    }

    .font-sm-down-smaller {
        font-size: 1.7rem !important
    }

    p.font-sm-down-smaller {
        font-size: 1.1rem !important
    }
}

@media (min-width: 576px) {
    #bcMainLogo {
        width:170px !important
    }
}

.rightCornerImg {
    position: relative;
    top: 0;
    right: 0
}

#floatingEventsBtn {
    right: -148px;
    top: 45%;
    z-index: 1500;
    transition: all 200ms ease-in;
    -webkit-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -ms-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important
}

#floatingEventsBtn a {
    border-top-left-radius: 1rem !important;
    border-bottom-left-radius: 1rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important
}

#floatingEventsBtn:hover {
    right: 0% !important
}

.roundedBorder {
    border-radius: 1rem;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    -ms-border-radius: 1rem;
    -o-border-radius: 1rem
}

.socialIcons img:hover {
    filter: brightness(70%);
    -webkit-filter: brightness(70%)
}

@media (max-width: 991.98px) {
    .socialIcons img {
        width:13%
    }
}

@media (min-width: 768px) {
    .socialIcons img {
        width:8%
    }
}

.dropdown:hover>.dropdown-menu {
    display: block
}

.rtl {
    direction: rtl
}

footer nav a {
    padding: 0 !important;
    margin: 0 !important;
    margin-bottom: 0.3rem !important
}


