:root {
    --bg-repeat: no-repeat;
    --card-bottom-spacer: 1.5rem;
    --margin-left-10: 10px;
    --margin-right-10: 10px;
    --no-margin-left: 0;
    --no-margin-right: 0;
    --border-radius: 0.25rem;
    --bg-banner: url(../assets/img/h-webinar-img.jpg);
    --bg-banner-webp: url(../assets/img/h-webinar-img.webp);
    --bg-banner-ar: url(../assets/img/h-webinar-ar-img.jpg);
    --bg-banner-webp-ar: url(../assets/img/h-webinar-ar-img.webp);
    --icon-calendar: url(../assets/img/icon-date-calendar-red.svg);
    --icon-time: url(../assets/img/icon-time-red.svg);
    --icon-course-location: url(../assets/img/icon-course-location.svg);
    --icon-spec-1: url(../assets/img/icon-course-spec-1.svg);
    --icon-spec-2: url(../assets/img/icon-course-spec-2.svg);
    --icon-spec-3: url(../assets/img/icon-course-spec-3.svg);
    --icon-spec-4: url(../assets/img/icon-course-spec-4.svg);
    --icon-spec-5: url(../assets/img/icon-course-spec-5.svg);
    --icon-spec-6: url(../assets/img/icon-course-spec-6.svg);
}

.bg-banner-training { width: 100%; padding: 2rem 0; /*background-image: url(../assets/img/h-webinar-img.jpg); background-repeat: var(--bg-repeat); background-position: top right; height: 550px; display: flex; align-items: center;*/ }
.rtl .bg-banner-training { /*background-image: url(../assets/img/h-webinar-ar-img.jpg);*/ }

.webp .bg-banner-training { /*background-image: url(../assets/img/h-webinar-img.webp);*/ }
.rtl.webp .bg-banner-training { /*background-image: url(../assets/img/h-webinar-ar-img.webp);*/ }

.training-banner-content { display: flex; flex-direction: column; align-items: start; }
.title-banner { font-size: 35px; font-weight: 600; line-height: 40px; }
.text-banner { margin: 1rem 0 1.25rem; }

.training-tag { display: flex; flex-direction: column; align-items: center; }

    .training-tag span:first-child { width: 50px; height: 50px; display: flex; border-radius: 8px; margin-bottom: 1rem; align-items: center; justify-content: center; }
    .flex-time span:first-child {  background-color: #AAD038;  }
    .get-certified span:first-child { background-color: #F88421 }
.access-anywhere span:first-child { background-color: #41BBC4 }
.multiple-attempts span:first-child { background-color: #EB4B7A }
.english-language span:first-child { background-color: #25A6E1 }
.quick-registration span:first-child { background-color: #AE4D9C }
.training-tag span:last-child { font-weight: 600; }

.course-card { background-color: transparent; border: none; margin: 1rem 0; align-items: start; height: 100%; justify-content: center; }

    .course-card .card-title {
        display: flex;
        margin-bottom: var(--card-bottom-spacer);
        align-items: center;
    }

        .course-card .card-title span {
            font-size: 1.25rem;
            margin-left: 20px;
            font-weight: 600;
        }

    .course-card .card-text { margin-bottom: var(--card-bottom-spacer); max-width: 75%; display: flex; align-items: center; }

.course-price {
    margin-bottom: var(--card-bottom-spacer);
}

    .course-price span { background-color: #d30202; font-weight: 600; color: #fff; padding: 0.2rem 0.725rem; border-radius: 0.25rem; font-size: 1.25rem; }
.course-time{margin-right:1rem;}
.rtl .course-time { margin-left: 1rem; margin-right: 0; }
.course-time, .course-speaker { background-color: #fff; display: flex; padding: .5rem; margin-bottom: var(--card-bottom-spacer); border-radius: var(--border-radius); width: 100%; align-items: center; }
    .venue-wrap { display: flex; align-items: center; }
    .course-speaker .course-speaker-title, .location-details .course-location-title { display: flex; font-weight: 600; }
.speaker-details, .location-details { display: flex; flex-direction: column; font-weight: normal; }
.course-speaker > i, .div-icon { border: 1px solid var(--bdr); border-radius: 100%; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; margin-right: var(--margin-right-10); font-size: 20px; overflow: hidden; }
.rtl .course-speaker > i, .rtl .div-icon { margin-left: var(--margin-left-10); margin-right: 0; }

.speaker-details span small { font-weight: normal; }

.text-ellipsis { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height: 25px; max-width: 70%; }
    .text-ellipsis p { margin: 0; display: inline; }
.text-ellipsis p:after{content:"..."; display:inline-block;}

.icon-calendar {
    background-image: var(--icon-calendar);
    background-repeat: var(--bg-repeat);
    width: 20px;
    height: 18px;
    display: inline-block;
    margin-right: var(--margin-right-10);
}

.icon-time {
    background-image: var(--icon-time);
    background-repeat: var(--bg-repeat);
    width: 20px;
    height: 18px;
    display: inline-block;
    margin-right: var(--margin-right-10);
}

.icon-course-location {
    background-image: url(../assets/img/icon-course-location.svg);
    background-repeat: var(--bg-repeat);
    width: 30px;
    height: 20px;
    display: inline-block;
}

.course-time .fa-map-marker-alt {
    color: #D90F0F;
    margin-right: var(--margin-right-10);
}

.card-course-option {
    background-color: transparent;
    border: none;
    justify-content: center;
    height: 100%;
    align-items: center;
    margin-bottom: 60px;
}

    .card-course-option .card-text {
        font-size: 26px;
        display: flex;
        margin-top: 1.5rem;
        text-align: center;
    }

        .card-course-option .card-text span {
            display: flex;
            padding: 0 0.5rem;
            font-weight: 600;
        }

            .card-course-option .card-text span:nth-child(2n) {
                background-color: #0F3661;
                color: #fff;
                display: inline-flex;
            }

.card-course-wrap {
    box-shadow: 0 10px 20px rgba(116,116,116,.15);
    border: none;
    height: 100%;
}

    .card-course-wrap .card-course-img {
        height: 185px;
        overflow: hidden;
        background-color: #f1f1f1;
        display: flex;
    }

        .card-course-wrap .card-course-img img {
            object-fit: scale-down;
        }

    .card-course-wrap .card-course-price {
        background-color: #CE0505;
        font-weight: 600;
        color: #fff;
        padding: 0.325rem 0.725rem;
        border-radius: 0 0.25rem 0.25rem 0;
        position: absolute;
        left: 0;
        bottom: 30px;
    }

    .card-course-wrap .card-title, .course-detail .card-title {
        font-size: 18px;
        font-weight: 600;
        line-height: normal;
    }

.course-instructor {
    display:flex;
}

    .course-instructor span {
        font-weight: 600;
        margin-left: 10px;
    }

.card-course-wrap .course-time { padding: 1rem 0; margin: 0 0 var(--bs-card-title-spacer-y); border-top: 1px solid var(--bdr); border-bottom: 1px solid var(--bdr); border-radius: 0; }

.course-list-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-top: none !important
}

    .course-list-group .list-group-item {
        max-width: 50%;
        border: none;
        padding-left: 30px;
    }

        .course-list-group .list-group-item:before {
            content: "\f058";
            font-family: 'Font Awesome 5 Free';
            font-weight: 900;
            position: absolute;
            left: 0;
            color: #009BD0
        }

.instructor-list {
    display: flex;
    align-items: center;
}

    .instructor-list > div, .course-spec-list div {
        display: flex;
        flex-direction: column;
        margin-left: 15px;
    }

        .instructor-list > div span, .course-spec-list div span {
            font-weight: 600;
        }

            .instructor-list > div span:last-child, .course-spec-list div span:last-child {
                font-weight: normal;
            }

.course-spec-list .list-group-item {
    display: flex;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 2rem;
    border: none;
    padding-top: 0;
}

    .course-spec-list .list-group-item:last-child {
        padding-bottom: 0;
    }

    .course-spec-list .list-group-item > span { padding: 0.969rem; display: inline-flex; border: 1px solid var(--bdr); border-radius: 100%; align-items: center; justify-content: center; }

        .course-spec-list .list-group-item > span:before {
            content: "";
            background-repeat: var(--bg-repeat);
            width: 22px;
            height: 22px;
            display: inline-block;
        }

.icon-spec-1:before { background-image: url(../assets/img/icon-course-spec-1.svg); }

.icon-spec-2:before {
    background-image: var(--icon-spec-2);
}

.icon-spec-3:before {
    background-image: var(--icon-spec-3);
}

.icon-spec-4:before {
    background-image: var(--icon-spec-4);
}

.icon-spec-5:before { background-image: url(../assets/img/icon-course-spec-5.svg); }

.icon-spec-6:before { background-image: url(../assets/img/icon-course-spec-6.svg); }

/*.course-detail {
    background-color: #fbfbfb;
}*/


.flex-grid > div > span {
    height: 100%;
    align-items: center;
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.fee-break-down.flex-grid > div > span:first-child {
    flex: 0 0 70%;
}
.fee-break-down.flex-grid > div > span:last-child { flex: 0 0 30%; justify-content: end; }
.check-icon .fa-exclamation {
    width: 80px;
    height: 80px;
    text-align: center;
    color: #B0120F;
}

.training-container .accordion-header {
}

.training-container .accordion-button.collapsed {
    background-color: aliceblue;
}
.rtl .training-container .accordion-button::after { margin-right: auto; margin-left: 0; }

.training-container .accordion-header img {
    width: 64px;
    max-height: 64px;
    min-height: 64px;
}

.training-container .accordion-header .title {
    font-size: 27px;
    font-weight: 800;
    text-transform: uppercase;
    color: #255185;
    display: block;
}

.training-container .bullet {
    font-size: 10px;
    font-weight: 600;
    background-color: #fff4d3;
    padding: 1px 8px;
    border-radius: 50px;
    color: #b18400;
    border: 1px solid #ffc107;
}

.training-container .wrap {
}

.syllabus-content {
    padding: 10px 14px;
    background-color: #fff;
    margin-bottom: 16px;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 5px;
    min-height: 80px;
    overflow-y: auto;
    max-height: 480px;
}
.training-description-detail { display: flex; margin-bottom: 1rem; }

/*training card list view*/
.card-list-training.card { border: 1px solid #e9e9e9; box-shadow: 0 0 12px 1px #477d8a28; margin: 0 0 2rem; }
.card-list-training .card-list-img-wrap { background-color: #f1f1f1; width: 100%; height: 100%; position: relative; align-items: center; justify-content: center; display: flex; padding-bottom:35px;}
    .card-list-training .card-list-img-wrap img { width: 100px; height: 80px; }
    .card-list-training .card-list-img-wrap .badge { position: absolute; margin: 0 auto; bottom: 10px; }
.card-list-training .card-body{ padding: 1.5rem; }
.card-list-training .card-title { font-weight: 600; font-size: 18px !important; }
.schedule-wrap { display: flex; flex-direction: row; }
.schedule-wrap .course-time, .schedule-wrap .course-speaker { margin: 0; padding: 0; width: auto; }
.schedule-wrap .course-time { margin-right: 1rem; }
.rtl .schedule-wrap .course-time { margin-left: 1rem;  margin-right: 0; }
.card-list-training .card-course-price { background-color: #f14848; font-weight: 600; color: #fff; padding: 0.325rem 0.725rem; border-radius: 0 0 0 0.25rem; position: absolute; bottom: 0; width: 100%; text-align: center; }
.list-text-ellipsis { display: flex; overflow: hidden; max-height: 70px; flex-direction: row; flex-wrap: wrap; margin-bottom: 10px; }
    .list-text-ellipsis.show-training-centent { transition: height 0.15s ease-in; height: auto; max-height:inherit; overflow: inherit; text-overflow: inherit; white-space: inherit; }
.list-text-ellipsis p{margin:0; display:inline;}
.card-list-training .card-text { display: flex; align-items: center; }
.training-info-section nav { background-color: rgb(223 223 223 / 25%); padding: 15px; border: 1px solid #dfdfdf; border-radius: var(--border-radius); }
.training-info-section .nav-training-info-section { list-style: none; padding: 0; margin: 0; display: inline-flex; }
    .training-info-section .nav-training-info-section li a { background-color: #fff; color: #0f3661; display: inline-block; padding: 0.475rem 1rem; text-decoration: none; border: 1px solid var(--bdr); font-size: 16px; transition: all .3s; }
.training-info-section .nav-training-info-section li:first-child a { border-top-left-radius: var(--border-radius); border-bottom-left-radius: var(--border-radius); }
.training-info-section .nav-training-info-section li:last-child a { border-top-right-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius); }
.training-info-section .nav-training-info-section li + li a{margin-left:-1px;}
.h-training-course-card{margin-bottom:1rem;}
.h-training-course-card .card { background-color: #FAFAFA; border-radius: 4px; height: 100%; justify-content: space-between; }
    .h-training-course-card .card .card-img > div{ background-color: #fff; padding: 1rem; align-items: center; display: flex; justify-content: center; border-radius: 4px; height:85px; position:relative;}
    .h-training-course-card .card .card-img > div img { width: 100%; height: 100%; }
    .h-training-course-card .card .card-price-tag { display: flex; align-items: center; justify-content: space-between; }
        .h-training-course-card .card .card-price-tag .sub-title.badge-training,
     .card .card-price-tag .sub-title.badge-training{ background-color: #056c91; padding: 3px 10px; border-radius: 4px; color: #fff; margin-top: 5px; display:none;}
        .h-training-course-card .card .card-price-tag .sub-title.badge-exam { background-color: #d30202; padding: 3px 10px; border-radius: 4px; color: #fff; margin-top: 5px; display:none;}
.card .card-price-tag {margin-top: -5px;margin-bottom: 10px;}
        .h-training-course-card .card .card-price-tag .training-price,
        .card .card-price-tag .training-price{ color: #d30202; font-weight: 600; font-size: 18px;line-height:1; }
    .h-training-course-card .card .title-main { font-weight: 600; font-size: 21px; margin-top: .5rem; }
    .h-training-course-card .card .training-description { display: flex; margin: 1rem 0; flex-direction: column; }
.card .training-online { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--bdr); font-family: var(--family-bold); padding: 0.5rem 1.5rem; width: 100%; }
        .h-training-course-card .card .card-img { padding: 1.5rem 1.5rem 1rem; }
    .h-training-course-card .card .card-price-tag,
    .h-training-course-card .card .title-main,
    .h-training-course-card .card .training-description { padding: 0 1.5rem; }

.training-banner-content .text-banner + .btn { width:300px;}
.training-banner-img{text-align:right;}
    .training-banner-img img { border-radius: 4px; }
.fee-break-down > div:last-child > span { font-weight: bold; }
.rtl .training-banner-img { text-align: left; }
    .rtl .form-check { padding-left: 0; padding-right: 1.5em; flex-direction: inherit; display: flex; }
    .rtl .form-check .form-check-input { margin-left: 0.5rem; margin-right: -1.5rem; }
/*training card list view end*/
/*Arabic*/
/*.rtl .bg-banner-training { -webkit-transform: scaleX(-1); transform: scaleX(-1); }*/
.rtl .training-container { transform: inherit; -webkit-transform: inherit; }

/*.rtl .icon-calendar, .rtl .icon-time, .rtl .icon-pin, .rtl .speaker-details i, .rtl .icon-course-location, .rtl .course-instructor span {
    margin-left: var(--margin-right-10);
    margin-right: var(--no-margin-right);
}*/

.rtl .course-card .card-title span, .rtl .instructor-list > div, .rtl .course-spec-list div {
    margin-left: var(--no-margin-left);
    margin-right: var(--margin-right-10);
}

.rtl .card-course-wrap .card-course-price {
    left: auto;
    right: 0;
}
.exam-user-guide-link a { color: #0051a3 !important }
@media(max-height:800px) { .training-banner-img img{ height: 60vh; }
}
@media(min-width:992px){
    .schedule-wrap { position: relative; top: 20px; }
}

@media(min-width:1600px) {
    /*.training-container {
        max-width: 1280px;
    }*/
}
@media(max-width:1199px) and (min-width:992px) {
    .course-spec-list { flex-direction: row; align-items: center; justify-content: center; }
        .course-spec-list .list-group-item { padding-bottom: 0; }
}
@media(max-width:1199px) {
    .course-card .card-title,
    .course-card .card-text { background-color: #f5f7fb; }
    .course-card .card-text { align-items: self-start; flex-direction: column; max-width: 100%; }
    
}
@media(max-width:1024px) {
    .ltr .bg-banner-training { background-position: top left; }
}
@media(max-width:992px) {
    .training-container {
        --card-bottom-spacer: 1rem;
    }

    .bg-banner-training {
        background-position: top left;
    }
    .rtl .bg-banner-training { background-position: top right; }

    /*.course-time {
        flex-direction: column;
    }*/

    .course-time > div { margin-bottom: .5rem; padding-bottom: .5rem; border-bottom: 1px solid var(--bdr); }

            .course-time > div:last-child {
                margin-bottom: 0;
                border-bottom: none;
            }

    .course-card .card-title span {
        font-size: 1rem;
    }

    .card-course-option .card-text {
        font-size: 1.25rem;
    }

    .course-card .card-title {
        margin-bottom: var(--card-bottom-spacer);
    }

    .course-time, .course-speaker {
        padding: .5rem;
    }

        .course-time > div > span:last-child {
            margin-top: 0.5rem;
        }

    .course-card, .card-course-option .card-text, .course-instructor {
        margin: 0.5rem 0;
    }

    .speaker-details {
        margin-top: 5px;
    }

    .card-course-wrap {
        margin: 1rem 0;
        height: auto;
    }

    .course-list-group .list-group-item {
        max-width: 100%;
        padding-left: 0;
        padding-right: 30px;
    }

        .course-list-group .list-group-item:before {
            left: auto;
            right: 0;
        }

    .flex-grid > div > span {
        height: auto;
    }
    .schedule-wrap{margin-top:12px;}
    .training-container .transformer-tabs ul { padding:10px;}
    /*.training-container .transformer-tabs a { background-color: #fff; color: #0f3661; padding: 0.475rem .725rem; border: 1px solid var(--bdr); }*/
            .training-container .transformer-tabs li + li{margin-left:-1px}
            /*.training-container .transformer-tabs a.active,
            .training-container .transformer-tabs a:focus { position: relative; background: #1166bb; color: #fff; }*/
    /*.h-training-course-card,
    .training-tag { margin-bottom: 1.5rem; }*/
    /*.title-banner { font-size: 22px; line-height: 30px; }*/
}

@media(max-width:991px) {
    .transformer-tabs > ul {
        flex-direction: row;
        overflow: auto;
    }

        .transformer-tabs > ul li {
            flex: none;
        }

        .transformer-tabs > ul > li > a {
            position: relative;
        }

        .transformer-tabs > ul::after {
            display: none;
        }
    .list-text-ellipsis.show-training-centent { white-space: normal; }
    .training-banner-img img { height: 26vh; }
    
}
@media(max-width:767px){
    .card-list-training .card-list-img-wrap { min-height: 150px; max-height:150px; }
    .card-list-training .card-text { flex-direction: column; align-items: inherit; }
    .training-banner-img { display: none; }
    .training-banner-content .text-banner + .btn { width: 100%; }
}
.invalid-filer-input { border-color: red; }

    .invalid-filer-input .jFiler-input-caption span { color: red !important; }