Custom css code to change container B/G color
Briefly

Custom css code to change container B/G color
"Is it possible to change the b/g color for EACH of the container ( screenshot below) ?"
"I want set a different B/G color for the 'Budget', 'Casual' & 'Formal' container."
"The element 'div.package-top' (under browser inspect tool) is the same for all the containers on the slider. If I formulate the css code for this element, the b/g color will be the same for all the card modules on the slider."
Add unique classes or IDs to each card container in the HTML to target .package-top individually with CSS. Use positional selectors such as .slider-item:nth-child(1) .package-top or .slider-item:nth-of-type(2) .package-top when editing HTML is not possible. Use data-attributes (for example [data-type="budget"] .package-top) to create specific selectors. Use JavaScript to add distinct classes at runtime if the slider clones or generates slides. Increase selector specificity or use !important only as a last resort to override plugin CSS. Consider targeting non-cloned slides by using data-slick-index or :not(.slick-cloned) if the slider duplicates nodes.
[
|
]