#page-title{background-image:url(../img/courses-list-page-title-bg.jpg);background-size:cover;background-position:center;position:relative;z-index:1;}#page-title .row{padding:3rem 0}#page-title::before{content:'';position:absolute;top:0;bottom:0;left:0;right:0;background-color:#000000b3;z-index:-1}#page-title .title{color:#fff;font-family:sahel, shabnam;font-weight:900;font-size:2.5rem;word-spacing:-7px;margin:0}#page-title .breadcrumb{color:#fff;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;margin:0}#page-title .breadcrumb i{margin:0 10px;font-size:10px}#page-title .breadcrumb a{color:#fff;text-decoration:none}#page-title .breadcrumb a:hover{color:var(--main-color)}@media (min-width: 992px){}#cats .cats{padding-top:20px}#cats .cats h4{margin-bottom:5px}#cats .cats .cats-wrap{margin:0;padding:0;list-style:none}#cats .cats .cats-wrap i{vertical-align:middle;margin-left:5px}#cats .cats .cats-wrap a{display:block;padding:5px 0;color:#787878;text-decoration:none;-webkit-transition-duration:300ms;transition-duration:300ms}#cats .cats .cats-wrap li{-webkit-transition-duration:300ms;transition-duration:300ms}#cats .cats .cats-wrap li:hover{background-color:var(--main-color)}#cats .cats .cats-wrap li:hover a{color:#fff;padding-right:10px}#cats .cats .cats-wrap li.active{background-color:var(--main-color)}#cats .cats .cats-wrap li.active a{color:#fff}@media (min-width: 576px){#cats .cats h4{margin-bottom:0.6rem}#cats .cats .cats-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}#cats .cats .cats-wrap i{display:none}#cats .cats .cats-wrap a{padding:5px}#cats .cats .cats-wrap li{-ms-flex-negative:0;flex-shrink:0;margin:0 0 10px 10px;border:1px solid #dee2e6 !important}#cats .cats .cats-wrap li:hover a{padding-right:5px}}#galleryPage .card-img-overlay{opacity:0;visibility:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}#galleryPage .card-img-overlay button{border:0;background:none;color:#fff}#galleryPage .card-footer button{border:0;background:none}#galleryPage .image-footer a{color:#000;text-decoration:none}@media (min-width: 992px){#galleryPage .card-img-overlay{top:0;bottom:100%;color:#fff;opacity:0;background-color:#00000066;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow:hidden}#galleryPage .card:hover .card-img-overlay{visibility:visible;opacity:1;bottom:0}#galleryPage .image-footer{position:absolute;opacity:0;visibility:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;top:0;bottom:100%;-webkit-transition-duration:300ms;transition-duration:300ms;overflow:hidden}#galleryPage .image-footer a{color:#fff}#galleryPage .card:hover .image-footer{bottom:0;opacity:1;visibility:visible;background-color:rgba(0,0,0,0.4);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}
.card .image {
    color: inherit;
    text-decoration: none;
}
.card .image:hover {
    color: inherit;
}
.image-wrap .card .card-image {
    width: 100%;
    position: relative;
    padding-top: 56.25%;
}
.image-wrap .card .card-image img {
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    object-fit: cover;
}
div#show-video {
    position: fixed;
    inset: 0;
    background-color: #0000008f;
    z-index: 1100;
    backdrop-filter: blur(3px);
    display: none;
    align-items: center;
    justify-content: center;
}
div#show-video.active {
    display: flex;
}
div#show-video video {
    max-width: 95%;
    max-height: 95%;
}
div#show-video button {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}
.img-loading {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
}
.img-loading i {
    color: var(--main-color);
}

img.loading::after {
    content: 'در حال بارگزاری';
    position: absolute;
    inset: 0;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (min-width: 992px) {
    div#show-video video {
        max-width: 75%;
    }
}