
@font-face {
  font-family: 'Bahij_Janna';
  src: url('../fonts/Bahij_Janna-Regular.ttf') format('truetype'); /* Adjust the path and format accordingly */
  font-weight: normal;
  font-style: normal;
}

*:not(.fa-solid):not(.fas):not(i) {
  font-family: 'Bahij_Janna', sans-serif !important;
}

p {
    font-family: 'Arial', sans-serif !important;
}

.search-section select {
    appearance: auto;
    padding: 0 10px;
}

.search-section .select2-container {
   width: 100% !important;
}

.featured-item img {
    position: absolute;
    top: 35px;
    right: 35px;
    width: 55px;
    height: 55px;
    line-height: 60px;
    color: var(--mainColor);
    background: rgba(8, 169, 230, 0.1);
    font-size: 22px;
    border: 1px dashed var(--mainColor);
    display: inline-block;
    text-align: center;
    border-radius: 50px;
    -webkit-transition: 0.7s;
    transition: 0.7s;
}

.categories-item .content a img {
    width: 50px;
    height: 50px;
    line-height: 65px;
    border-radius: 50%;
    text-align: center;
    font-size: 22px;
    color: var(--mainColor);
    background: rgba(8, 169, 230, 0.1);
    margin-left: 10px;
    -webkit-transition: 0.9s;
    transition: 0.9s;
}

.enroll-btn {
    padding: 5px 35px;
    margin-top:5px;
}

.counter-card img {
    position: absolute;
    z-index: 1;
    top: -30px;
    left: 30px;
    width: 50px;
    font-size: 55px;
    line-height: 1;
    color: var(--mainColor);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (min-width: 768px) and (max-width: 991px)
{
    .featured-item img {
        top: 25px;
        right: 20px;
        width: 45px;
        height: 45px;
        line-height: 50px;
        font-size: 18px;
    }

    .categories-item .content a img {
        width: 50px;
        height: 50px;
        line-height: 55px;
        font-size: 18px;
        margin-right: 15px;
    }

    .counter-card img {
        top: -25px;
        left: 20px;
        font-size: 40px;
    }

    .counter-card {
        margin-top: 20px;
    }
}

@media only screen and (max-width: 767px)
{
    .featured-item img {
        top: -24px;
        right: 141px;
        width: 45px;
        height: 45px;
        line-height: 50px;
        font-size: 18px;
    }

    .categories-item .content a img {
        width: 50px;
        height: 50px;
        line-height: 55px;
        font-size: 18px;
        margin-right: 15px;
    }

    .counter-card img {
        top: -25px;
        left: 20px;
        font-size: 40px;
    }
}

.select2-container .select2-selection--single {
    height: 40px;
}

.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    margin-top: 5px;
}

.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
    padding-top: 5px;
}

.counter-card {
    padding: 30px;
    padding-top: 15px;
    padding-bottom: 15px;
}

#validator-newsletter {
    margin-top: 20px;
}

.blog-card .content h3 {
    min-height: 60px;
}

.courses-details-sidebar .default-btn i {
    margin-right: 10px;
} 

.side-nav-responsive .dot-menu {
    top: -25px;
}

.search-section {
    padding-bottom: 90px;
    padding-right: 20px;
    padding-left: 20px;
}

.search-btn {
    padding: 0.45rem 0.75rem;
    background-color: var(--redColor);
}

@media only screen and (max-width: 996px)
{
    .search-section {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    .search-section .col-12 {
        margin-bottom: 5px;
    }

    .search-btn {
        padding: 0.5rem 0.75rem;
    }

    .brand-slider .owl-stage-outer {
        padding-right: 20px;
    }
}

.search-btn:hover {
    background-color: var(--titlecolor);
}

.banner-area {
    padding-top: 100px;
    padding-bottom: 100px;
}

.search-section .content {
    padding: 30px;
    background-color: var(--mainColor);
    border-radius: 10px;
}

.destination-single-item {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid #E4E4E4;
    border-radius: 20px;
    display: block;
    padding: 30px 25px;
    margin-bottom: 30px;
    margin-top: 10px;
    width: 100%;
}

.destination-single-item .name {
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
    text-align: center;
    margin-bottom: 0;
    margin-top: 20px;
}

/*.desktop-nav .navbar .navbar-nav .nav-item a {
    margin-left: 7px;
    margin-right: 7px;
    font-size: 15px;
}*/

.navbar-category .category-list-dropdown .btn i {
    margin-left: 5px;
}

.navbar-category .category-list-dropdown .btn {
    font-size: 15px;
    font-weight: 600;
}

/*.desktop-nav .navbar .navbar-nav {
    margin-left: 20px;
}

.desktop-nav .navbar .navbar-nav .nav-item:first-child a {
    margin-left: 10px;
}

.desktop-nav .navbar .navbar-nav .nav-item:last-child a {
    margin-right: 10px;
}*/

.search-section label {
    color: #fff;
}

.about-section {
    padding: 40px 20px;
}

.about-section p {
    text-align: justify;
}

.about-section .row {
    margin-bottom: 20px;
}

.inner-banner .inner-title {
    padding-top: 60px;
    padding-bottom: 60px;
}

@media only screen and (max-width: 767px) {
    .inner-banner .inner-title {
        padding-top: 35px;
        padding-bottom: 35px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .inner-banner .inner-title {
        padding-top: 35px;
        padding-bottom: 35px;
    }
}

.navbar-category .category-list-dropdown .dropdown-menu {
    right: -24vw;
    left: 0;
    width: 96vw;
    border-top: 1px solid var(--mainColor);
    min-height: 550px;
    max-height: 550px;
    top: 170% !important;
    max-width: 838px;
}

.desktop-nav .navbar .navbar-nav .nav-item a {
    font-weight: 600;
}

.navbar-category .category-list-dropdown .dropdown-menu .row {
    margin: 5px;
}

.navbar-category .category-list-dropdown .dropdown-menu a {
    font-size: 13px;
    padding: 12px 35px;
}

.b-gray { 
    border: 0.5px solid gray;
}

.categories-item .content {
    min-height: 135px;
    padding-bottom: 10px;
}

.categories-item .content-text {
    min-height: 55px;
}

.btn-content {
    margin-top: 10px;
}

.enrolled-content .enrolled-list li {
    min-height: 75px;
}

@media only screen and (min-width: 650px) {
    .side-nav-responsive .container .container {
        max-height: 600px;
        max-width: 700px;
        right: 100px;
    }
    .side-nav-responsive .side-nav-inner .side-nav {
        width: 450px;
    }
}

.side-nav-responsive .side-nav-inner .side-nav {
    background-color: #fff;
    max-height: 500px;
    overflow-y: scroll;
}

.side-nav-responsive .side-nav-inner .side-nav a {
    padding-bottom: 15px;
}

.text-right {
    text-align: right;
}

.mean-menu .default-btn.two {
    padding: 10px 25px;
}

.event-item .event-img {
    max-width: 120px;
}

@media only screen and (max-width: 767px) {
    .event-item .event-img {
        margin-right: 0;
        max-width: 100%;
    }
}

.pt-30 {
    padding-top: 30px;
}

.courses-details-sidebar {
    margin-top: 0;
}

.course-banner-img {
    justify-content: center;
    align-items: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

.course-banner-img img {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

.p-0 {
    padding: 0;
}

.mt-20 {
    margin-top: 20px;
}

.pb-20 {
    padding-bottom: 20px;
}

.instructors-card .content {
    padding: 10px;
    text-align: left;
}

.instructors-card .content h5 a {
    color: var(--titleColor);
}

.courses-item .content h6 a {
    color: var(--titleColor);
}

.courses-item .content .course-instructors {
    width: 40px;
}

.courses-item .content {
    padding: 10px;
}

.courses-item .content .course-list {
    margin: 0;
    padding: 0;
    border-bottom: 0;
    min-height: 77px;
}

.courses-item .content h6 a {
    min-height: 43px;
}

.banner-area {
    padding-top: 20px;
    padding-bottom: 20px;
}

.content-image {
    width: 50px;
    margin-top: -50px;
    margin-bottom: 10px;
}

.courses-item .content-image {
    width: 50px;
    margin-top: -40px;
    margin-bottom: 10px;
}

.banner-content h3 {
    font-size: 18px;
    color: var(--titleColor);
    margin-bottom: 20px;
    line-height: 1.2;
}

.banner-content span {
    font-size: 25px;
    font-weight: 600;
}

.section-title h2 {
    font-size: 25px;
}

.mt-5 {
    margin-top: 5px;
}

.counter-card h3 {
    font-size: 20px;
    color: #fff;
}

.counter-card p {
    color: #fff;
}

.counter-card a {
    margin-top: 5px;
}

.col-lg-3.col-6:nth-child(odd) .counter-card {
    background-color: var(--mainColor);
}

.col-lg-3.col-6:nth-child(odd) .counter-card a {
    background-color: var(--titleColor);
/*    border: 0.5px solid var(--titleColor);*/
}

.col-lg-3.col-6:nth-child(odd) .counter-card:hover a::before {
    background-color: var(--titleColor);
}

.col-lg-3.col-6:nth-child(even) .counter-card {
    background-color: var(--titleColor);
}

.col-lg-3.col-6:nth-child(even) .counter-card a {
    background-color: var(--mainColor);
/*    border: 0.5px solid var(--mainColor);*/
}

.col-lg-3.col-6:nth-child(even) .counter-card:hover a::before {
    background-color: var(--mainColor);
}

.feature-btn {
    margin-top: 10px;
    padding: 5px 35px;
}

.featured-item {
    padding: 35px 110px 15px 35px;
}

.courses-details-sidebar .content {
    padding: 15px;
}

.courses-details-tab-content .courses-details-into {
    margin-bottom: 15px;
}

.courses-details-tab-content .courses-details-into p {
    background-color: #f1f1f1 !important;
}

p.MsoListParagraphCxSpFirst, p.MsoListParagraphCxSpMiddle, p.MsoListParagraphCxSpLast{
margin: 0in 0.3in !important;
}
.courses-details-tab-content .courses-details-into h3 {
    background-color: #f1f1f1 !important;
}

/*.courses-details-tab-content .courses-details-into span {
    background-color: #f1f1f1 !important;
}*/

.courses-details-tab-content .courses-details-into ul {
    background-color: #f1f1f1 !important;
}

.courses-details-tab-content .courses-details-into li {
    background-color: #f1f1f1 !important;
    line-height: 1.2rem !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

.courses-details-tab-content p {
    margin-bottom: 15px;
    line-height: 1.3rem;
    text-align: justify;
}

.courses-details-tab-content p, .courses-details-tab-content span {
    font-size: 16px !important;
    line-height: 1.7rem !important;
    margin-bottom: 0 !important;
}

.course h3 {
    font-size: 25px !important;
}

.add-remix-icon {
   vertical-align: middle;
   margin: 0 8px;
}

.add-remix-icon:before {
    font-family: "remixicon" !important;
    content: "\eb80";
    font-size: 1.2rem;
}

.tab .tabs_item.description {
    background-color: #f1f1f1;
    padding: 16px 24px;
}

.courses-details-sidebar .category-list {
    list-style: none;
    padding-right: 10px;
}

.courses-details-sidebar .category-list li {
    border-bottom: 0.5px solid #d2d2d2;
    padding: 4px;
    font-weight: 600;
}

.courses-details-sidebar .category-list a {
    color: #20409a;
}

/*.courses-details-sidebar .category-list a:hover {
    color: var(--titleColor);
}*/

.courses-details-sidebar .category-list li:hover {
    background-color: var(--titleColor);
}

.courses-details-sidebar .category-list li:hover a {
    color: #f1f1f1;
}

.inner-banner .inner-title h3 {
    max-width: 100%;
}

.courses-details-sidebar.categories .row {
    margin: 2px 2px;
    padding: 5px;
    background-color: #f1f1f1;
}

.courses-details-sidebar.categories h6 {
    padding-bottom: 3px;
    border-bottom: 1px solid var(--titleColor);
}

.courses-item {
    border-radius: 10px;
}

.courses-item img {
    border-radius: 10px 10px 0 0;
}

.featured-area-mt {
    padding-bottom: 20px;
}

.mb-25 {
    margin-bottom: 25px;
}

.pt-20 {
    padding-top: 20px;
}

@media (min-width: 1200px) {
  .custom-col {
    width: 20%;
  }
}

.courses-details-tab-content h4 {
    line-height: 1.2rem !important;
}

.ml-auto {
    margin-left: 2% !important;
    margin-right: 5% !important;
}

.mr-auto {
    margin-left: 5% !important;
    margin-right: 2% !important;
}

.others-options a {
/*    margin-right: 10%;*/
}

/*.banner-area .home-banner {
    margin-left: 15px !important;
    margin-right: 15px !important;
    max-width: 98% !important;
}*/

.search-icon {
    margin-left: 0 !important;
    font-size: 25px;
}

@media only screen and (min-width: 1000px) {
    /*.home-link {
        border-radius: 10px;
        border: 0.5px solid var(--titleColor);
        padding: 10px 10px !important;
        margin: 10px;
    }

    .home-link a {
        margin: 0 !important;
    }*/
}

@media only screen and (max-width: 767px) {
    .banner-content span {
        font-size: 22px;
    }
    .banner-content h3 {
        font-size: 20px;
    }

    .search-banner {
        padding-left: 0 !important;
        border: 0.5px solid var(--mainColor) !important;
    }

    .search-banner-btn {
        margin-top: 0 !important;
        position: absolute !important;
    }

    .banner-area .home-banner {
        max-width: 93% !important;
    }

    .courses-item {
        max-width: 285px;
        margin: 10px auto;
    }

    .categories-item {
        max-width: 285px;
        margin: 0 auto;
    }

    .featured-item {
        padding: 2rem;
        text-align: center;
    }

    .inner-banner .inner-title.text-center h3 {
        font-size: 20px;
    }

    .inner-banner .inner-title ul li {
        font-size: 12px;
    }
}

textarea {
    height: 100px !important;
}

.billing-details {
    border: 0.7px solid #a09e9e;
}

.w-5 {
    width: 20px;
}

/* Custom Pagination Styles for RTL */
.pagination {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    flex-direction: row;
    flex-wrap: wrap;
}

.pagination>li {
    margin: 0 5px;
    list-style: none;
}

.pagination>li>a,
.pagination>li>span {
    padding: 8px 12px;
    border: 1px solid #ddd;
    color: #333;
    text-decoration: none;
    background-color: #f8f9fa;
    border-radius: 4px;
    display: inline-block;
    margin-top: 5px;
}

.pagination>li.active>a,
.pagination>li.active>span,
.pagination>li.active>a:hover,
.pagination>li.active>span:hover,
.pagination>li.active>a:focus,
.pagination>li.active>span:focus {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}

.pagination>li.disabled>a,
.pagination>li.disabled>span,
.pagination>li.disabled>a:hover,
.pagination>li.disabled>span:hover,
.pagination>li.disabled>a:focus,
.pagination>li.disabled>span:focus {
    color: #6c757d;
    pointer-events: none;
    cursor: not-allowed;
    background-color: #f8f9fa;
    border-color: #ddd;
}

.search-listing .search-section {
    padding: 20px;
}


.navbar-category .category-list-dropdown .dropdown-menu.show {
    max-width: 838px;
}

.loading {
    font-size: 70px;
    display: inline-block;
    animation: loaderAnimation 1.5s infinite;
}

@keyframes loaderAnimation {
    0% { transform: scale(0); }
    50% { transform: scale(1); }
    100% { transform: scale(0); }
}

/*.courses-details-tab-content {
    max-height: 1255px;
    overflow-y: scroll;
}*/

.categories-item:hover .default-btn {
    background: var(--titleColor);
}

.categories-item::before {
    background-color: unset;
}

.sticky-container {
    position: sticky;
    top: 20px;
}

.switch-box {
    display: none;
}

#preloader-area {
    left: 45%;
}

@media (min-width: 768px) {

    .banner-area {
        background: url('../images/banner-bg.png');
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position-y: bottom !important;
        min-height: 450px;
    }

    .banner-image-slider {
        height: 360px;
    }

    .navbar-expand-md .navbar-collapse {
        /*overflow: hidden;*/
/*        flex-direction: row;*/
        justify-content: space-evenly;
    }

    .desktop-nav .navbar .navbar-nav {
        margin-left: unset !important;
    }

    .banner-image-slider .owl-nav {
        position: absolute;
        top: 35%;
        width: 100%;
    }

    .banner-area .owl-carousel .owl-item .img-item {
        height: 100%;
    }

    .banner-area .owl-carousel .owl-item img {
        width: 60%;
        height: 100%;
        margin: 0 15% 0 20%;
        border-radius: 15px;
        border: 4px solid #fff;
    }

    .banner-content h3 {
        color: #fff;
    }

    .banner-content .banner-counter p {
        color: var(--mainColor);
    }

    .banner-content p {
        color: #ada9a9;
    }

    .banner-area .owl-carousel .owl-stage-outer {
        height: 100%;
    }

    .banner-area .owl-carousel .owl-stage {
        height: 100%;
    }

    .banner-area .owl-carousel.owl-rtl .owl-item {
        height: 100%;
    }

    .banner-area .right-col {
        padding: 30px 40px 0 0;
        text-align: start;
    }

    .banner-content .banner-form-area {
        margin-top: 70px;
        margin-bottom: 20px;
    }

    .banner-content .banner-counter {
        text-align: center;
    }

    .banner-content .banner-counter h3 {
        color: #fff;
        font-weight: 500;
    }

    .search-section .content {
        background-image: url('../images/filter-bg.jpg');
        background-position: center;
    }

    .search-section {
        padding-top: 30px;
    }

    .section-bg {
        background-color: #e8ebf0;
    }

    .search-btn {
        background-color: var(--mainColor);
    }

    .banner-content .banner-form-area .banner-form .form-control {
        background: var(--mainColor);
        color: #fff;
        border-radius: 20px;
    }

    .banner-content .banner-form-area .banner-form .default-btn {
        background-color: #fff;
        border-radius: 20px 0 0 20px;
    }

    .banner-content .banner-form-area .banner-form .default-btn i {
        color: var(--bodyColor);
    }

    .others-options {
        margin-right: 100px;
    }

    .mean-menu .default-btn.two {
        background: var(--mainColor);
    }

    .mean-menu .default-btn.two::before {
        background-color: var(--titleColor);
    }

    .desktop-nav .navbar .navbar-nav .nav-item a {
        font-size: 20px;
    }

    .navbar-category .category-list-dropdown .btn {
        font-size: 20px;
        color: var(--titleColor);
    }

    .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
        top: -60px;
    }

    .featured-item {
        padding: 2rem;
        text-align: center;
    }

    .featured-item img {
        top: -28px;
        right: 43%;
    }

    .banner-area .owl-carousel .owl-nav button.owl-next {
        position: absolute;
        right: 7%;
        color: #fff;
        font-size: 70px;
        top: 45%;
    }

    .banner-area .owl-carousel .owl-nav button.owl-prev {
        position: absolute;
        left: 17%;
        color: #fff;
        font-size: 70px;
        top: 45%;
    }
}

@media only screen and (max-width: 1300px) {
    .desktop-nav .navbar .navbar-nav .nav-item a {
        font-size: 17px;
    }

    .navbar-category .category-list-dropdown .btn {
        font-size: 17px;
    }
}

@media only screen and (max-width: 767px) {
    #preloader-area {
        left: 24%;
    }

    .course h3 {
        font-size: 20px !important;
    }

    .courses-details-accordion .table {
        font-size: 10px;
    }

    .courses-details-accordion .table td a {
        font-size: 10px;
    }

    .billing-details h3 {
        font-size: 15px;
    }

    .banner-image-slider {
        display: none !important;
    }
}

.contact-title {
    font-size: 22px;
}

.message-area {
    height: 180px !important;
}

#preloader .preloader-section {
    width: 50%;
}

.cat-section {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    padding-bottom: 60px;
}

.cat-section .title {
    background-color: #fff;
    padding: 5px 14px;
    border-radius: 15px;
    color: var(--titleColor);
    font-weight: 500;
    margin: 40px 0 20px 0;
}

.cat-section .item a {
    color: #fff;
    font-size: 15px;
}

.cat-section .item a:hover {
/*    color: var(--titleColor);*/
    font-weight: 600;
}

.cat-section .item i {
    margin-left: 8px;
    font-size: 12px;
}

.footer-area {
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.foot-title {
    background: linear-gradient(to left, var(--mainColor), var(--titleColor));
    border-radius: 20px;
    text-align: center;
    padding: 8px;
    color: #fff;
    font-weight: 500;
    margin-bottom: 12px;
}

.footer-area .title::after {
    content: "";
    display: block;
    position: absolute;
    right: 30%;
    width: 40%;
    /* bottom: 0; */
    left: 0;
    height: 5px;
    background: repeating-linear-gradient(to left, transparent, transparent 5px, var(--mainColor) 5px, var(--titleColor) 10px);
}

.footer-area .offices {
    margin: 30px 50px 30px;
}

.footer-area .offices .location {
    display: flex;
    align-items: center;
    color: var(--mainColor);
}

.footer-area .offices .phone a{
    display: flex;
    align-items: center;
    color: var(--titleColor);
}

.footer-area .offices .mail a{
    display: flex;
    align-items: center;
    color: var(--titleColor);
}

.footer-area .social-link {
    list-style: none;
    display: flex;
    padding: 0;
    margin: 0;
}

.footer-area .social-link li {
    margin-left: 10px;
}

.footer-area .offices i {
    margin-left: 7px;
}

.copy-right-text p {
    color: var(--titleColor);
}

@media (min-width: 768px) {
    .footer-area .offices {
        margin: 30px 150px 70px;
    }
    .foot-title {
        margin-left: 150px;
        margin-right: 150px;
    }
    .cat-section .country-title {
        width: 75%;
    }
    .cat-section .category-title {
        width: 90%;
    }
    .foot-row {
        margin: 0 150px;
    }
}

@media (max-width: 768px) {
    .footer-area .offices {
        margin: 30px 0px 30px;
    }

    .foot-row {
        margin: 0px;
    }

    .footer-area {
        background-size: unset !important;
        background-position: top !important;
        background-repeat: no-repeat !important;
    }

    .footer-area .social-link {
        padding-top: 20px;
        list-style: none;
        display: flex;
        padding: 0;
        padding-top: 10px;
        margin-bottom: 1rem; 
    }
}