/* The catalogue page's "more categories" tabs (new-catalog-main.php).
   A sub-category with its own icon -- the property screen's card icon -- shows it inside the ring, in
   place of the ring's built-in glyph. The ring keeps the colour the slide's position gives it
   (styles-rtl.css, styles-ltr.css); the rings here are those artworks without their glyph. */

.moreSubjectsChilds .slick-slide a > div.subjectIcon {
    background-repeat: no-repeat;
    background-size: 24px 24px, auto;
    background-position: 30px center, 16px center;
}
.lang-to-css-rtl .moreSubjectsChilds .slick-slide a > div.subjectIcon {
    background-position: calc(100% - 30px) center, calc(100% - 16px) center;
}

.moreSubjectsChilds .slick-slide:nth-of-type(4n-0) a > div.subjectIcon { background-image: var(--cil-subject-icon), url(../images/icon-subject-ring1.svg); }
.moreSubjectsChilds .slick-slide:nth-of-type(4n-1) a > div.subjectIcon { background-image: var(--cil-subject-icon), url(../images/icon-subject-ring2.svg); }
.moreSubjectsChilds .slick-slide:nth-of-type(4n-2) a > div.subjectIcon { background-image: var(--cil-subject-icon), url(../images/icon-subject-ring3.svg); }
.moreSubjectsChilds .slick-slide:nth-of-type(4n-3) a > div.subjectIcon { background-image: var(--cil-subject-icon), url(../images/icon-subject-ring4.svg); }