@font-face {
    font-family: "DroidArabic";
    src: url("../fonts/Droid-Arabic-Kufi.ttf")format('truetype');
}

/*Start Header css*/

.top {
    height: calc(200/16 * 0.8rem);
    width: 100%;
    background: #37414D;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 10;
    padding: calc(30/16 * 0.8rem);
    transition: all 1s ease;
    backface-visibility: hidden;
    perspective: 1000px;
    text-align: center;
}
.top.shrink {
    height: calc(40/16 * 1rem);
    padding: calc(10/16 * 1rem);
}
.top .logo {
    width: calc(100/16 * 0.8rem);
    height: calc(100/16 * 0.8rem);
    margin-bottom: calc(18/16 * 0.8rem);
    transition: all 1s ease;
    backface-visibility: hidden;
    perspective: 1000px;
}
.top.shrink .logo {
    width: 0;
    height: 0;
    margin-bottom: 0;
}
.sub-logo {
    width: calc(350/14 * 0.8rem);
    /*font-family: DroidArabic!important;*/
    color: white;
    font-weight: bold;
}
.body-setting{
    /*margin-top: 195px!important;*/
    transition: margin-top 0.5s;
    /*padding-block-start: calc(270/16 * var(--default-size-unit));*/
}
/*Navbar*/
@media (min-width: 992px){
    .dropdown-menu{
        margin-top:0!important;
        border-left: 4px solid green;
        left: 0!important;
        /*right: 0!important;*/
        width: 700px!important;
        max-width: 800px!important;
        height: 250px!important;
        max-height: 270px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.15);
        /*transform: scale(1.2, 1.2);*/
        /* border-top: none!important; */
    }
    .flex-container {
        padding: 0;
        margin: 0;
        list-style: none;
        display: flex;
    }
    .centre {
        justify-content: space-around;
        text-align: right!important;
    }
    .dropdown-item:hover{
        border-bottom: 3px solid green!important;
    }
    .dropdown-item{
        font-family: DroidArabic!important;
    }
}
@media all and (min-width: 992px) {
    .navbar .nav-item .dropdown-menu{ display: none; }
    .navbar .nav-item:hover .nav-link{   }
    .navbar .nav-item:hover .dropdown-menu{ display: block; }
    .navbar .nav-item .dropdown-menu{ margin-top:0; }
}
.navbar{
    /*padding: 18px 0 18px 0!important;*/
}
.nav-item a{
    color: #60656c!important;
    font-size: 15px;
    font-family: DroidArabic !important;
    /*font-family: Oswald!important;*/
    font-weight: 500;
}

.dropdown-menu a{
    /*text-align: center;*/
    color: #2a271f!important;
    font-weight: bold!important;
    padding: 0;
    margin: 0;
}

.dropdown-menu p{
    color: #60656c!important;
}

.nav-item a:hover{
    /*color: #8c8c8c!important;*/
    background-color: #f2f2f2d1!important;
}

.navbar-brand {
    color: black!important;
    font-weight: 500;
    font-size: 26px!important;
    /*font-family: Oswald!important;*/
}
.active{
    border-bottom: 2px solid red!important;
    background-color: transparent!important;
}
a.router-link-active{
    border-bottom: 2px solid red!important;
    background-color: transparent!important;
}
a.router-link-active.logo{
    border-bottom: none!important;
    background-color: transparent!important;
}
/*End Header css*/

/* Start Animations */

.lds-ellipsis {
    display: inline-block!important;
    position: relative!important;
    width: calc(80/16 * 1rem)!important;
    height: calc(80/16 * 1rem)!important;
}
.lds-ellipsis div {
    position: absolute!important;
    top: calc(33/16 * 1rem)!important;
    width: calc(13/16 * 1rem)!important;
    height: calc(13/16 * 1rem)!important;
    border-radius: 50%!important;
    background: #37414D!important;
    animation-timing-function: cubic-bezier(0, 1, 1, 0)!important;
}
.lds-ellipsis div:nth-child(1) {
    left: 8px!important;
    animation: lds-ellipsis1 0.6s infinite!important;
}
.lds-ellipsis div:nth-child(2) {
    left: 8px!important;
    animation: lds-ellipsis2 0.6s infinite!important;
}
.lds-ellipsis div:nth-child(3) {
    left: 32px!important;
    animation: lds-ellipsis2 0.6s infinite!important;
}
.lds-ellipsis div:nth-child(4) {
    left: 56px!important;
    animation: lds-ellipsis3 0.6s infinite!important;
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0)!important;
    }
    100% {
        transform: scale(1)!important;
    }
}
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1)!important;
    }
    100% {
        transform: scale(0)!important;
    }
}
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0)!important;
    }
    100% {
        transform: translate(calc(24/16 * 1rem), 0)!important;
    }
}

/* End Animations */

/*Start caroutel Item*/

.overlay {
    position: absolute!important;
    width: 100%!important;
    height: 100%!important;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 33.41%, rgba(91, 99, 109, 0) 68.64%)!important;
    top: 0!important;
    left: 0!important;
}
.content {
    position: absolute!important;
    right: calc(30/16 * 1rem)!important;
    left: unset!important;
    bottom: calc(40/16 * 1rem)!important;
}
.content.ltr {
    left: calc(30/16 * 1rem)!important;
    right: unset!important;
}

/*.category {*/
/*text-transform: capitalize;*/
/*padding: calc(5/16 * 1rem)  calc(20/16 * 1rem);*/
/*background: #F9F9F9;*/
/*color: #22845B;*/
/*width: -webkit-fit-content;*/
/*width: -moz-fit-content;*/
/*width: fit-content;*/
/*font-size: var(--s-font-size);*/
/*font-weight: bold;*/
/*margin-bottom: var(--default-size-unit);*/
/*}*/


.subTitle {
    font-size: calc(18/16 * 1rem)!important;
    font-weight: 600!important;
    white-space: nowrap!important;
    overflow: hidden!important;
    text-overflow: ellipsis!important;
    max-width: 60vw!important;
    /*width: calc(400/16 * var(--default-size-unit));*/
    margin-bottom: 1rem!important;
    cursor: pointer!important;
}


.carousel-title {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: var(--ml-font-size);
    font-weight: 700;
    cursor: pointer!important;
    padding-bottom: calc(25/16 * var(--default-size-unit));
}


@media only screen and (max-width: 1200px) {
    .carousel-title, .subTitle{
        max-width: 90vw;
    }
}

@media only screen and (min-width: 600px) {
    .container p{
        text-align: justify!important;
    }
}

.date {
    font-size: calc(14/16 * 1rem)!important;
}
.line {
    font-size: calc(12/16 * 1rem)!important;
    /* width: calc(240/16 * var(--default-size-unit)); */
    display: flex!important;
    align-items: center!important;
}
.line > div {
    -webkit-margin-start: calc(8/16 * 1rem)!important;
    margin-inline-start: calc(8/16 * 1rem)!important;
}
.urgent {
    background: #D90505!important;
    color: #FFF!important;
    font-weight: bold!important;
    border-radius: calc(3/16 * 1rem)!important;
    padding: 0 calc(12/16 * 1rem)!important;
    line-height: calc(25/16 * 1rem)!important;
}
/*.live {*/
/*background: var(--secondary-background-color);*/
/*color: var(--white);*/
/*color: var(--primary-text-color);*/
/*font-weight: bold;*/
/*border-radius: calc(3/16 * var(--default-size-unit));*/
/*padding: 0 calc(12/16 * var(--default-size-unit));*/
/*display: flex;*/
/*align-items: center;*/
/*line-height: calc(25/16 * var(--default-size-unit));*/
/*}*/

/*.live .gap {*/
/*width: calc(5/16 * var(--default-size-unit))*/
/*}*/

/*.live svg {*/
/*height: calc(14/16 * var(--default-size-unit));*/
/*width: calc(14/16 * var(--default-size-unit));*/
/*fill: var(--primary-text-color);*/
/*}*/

@media (max-width: 1920px){
    :host {
        width: calc(100vw - calc(290/16 * 1rem))!important;
    }

}
@media (max-width: 600px) {
    :host {
        width: 100vw!important;
    }

    .carousel-title {
        width: 100%!important;
    }
}
@media (max-width: 425px) {

    .content {
        bottom: calc(60/16 * 1rem)!important;
    }

}

/*End carousel Item*/

.rec{
    height: 4px;
    width: 30px;
    background-color: #22845B;
    /* margin-right: 10px; */
    margin-left: 20px;
    margin-bottom: 15px;
}
.title {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: var(--l-font-size);
    font-weight: 700;
    padding-top: calc(35/16 * var(--default-size-unit));
    padding-bottom: calc(35/16 * var(--default-size-unit));
}

.title::before {
    content: ' ';
    display: block;
    -webkit-margin-end: var(--default-size-unit);
    margin-inline-end: var(--default-size-unit);
    width: calc(35/16 * var(--default-size-unit));
    height: calc(8/16 * var(--default-size-unit));
    background: var(--primary-text-color);
    min-width: calc(35/16 * var(--default-size-unit));
    font-family: DroidArabic!important;
}
.section {
    display: flex;
    align-items: center;
    font-size: var(--xs-font-size);
    font-weight: bold;
    background: var(--secondary-background-color);
    padding: calc(7/16 * var(--default-size-unit)) calc((100vw - 1920px)/2 +  var(--body-padding));
    border-top: var(--input-border);
    border-bottom: var(--input-border);
    font-family: Cairo,sans-serif;
}
.breadcrumb{
    text-decoration: none!important;
    margin: 0;
    color: #37414D;
    font-family: Cairo,sans-serif!important;
}