better if without child selector. Class .image wont be use other way in .card .content

src/definitions/views/card.less

@@ -115,9 +115,8 @@
   background: @imageBackground;
 }
 .ui.cards > .card > .image > img,
-.ui.cards > .card > .content > .image > img,
 .ui.card > .image > img,
-.ui.card > .image > .content > img  {
+.ui.card > .content  .image   {
   display: block;
   width: 100%;
   height: auto;
@@ -744,4 +743,38 @@ a.ui.card:hover,
   font-size: @medium;
 }
 
-.loadUIOverrides();
+.loadUIOverrides();
+
+/*-------------------
+       Colors
+--------------------*/
+
+@coloredBorderSize: 2px;
+.ui.black.card:not(.inverted) {
+  box-shadow: @coloredBorderSize solid @black;
+}
+.ui.blue.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @blue;
+}
+.ui.green.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @green;
+}
+.ui.orange.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @orange;
+}
+.ui.pink.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @pink;
+}
+.ui.purple.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @purple;
+}
+.ui.red.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @red;
+}
+.ui.teal.card:not(.inverted) {
+  border-color: @teal;
+
+}
+.ui.yellow.card:not(.inverted) {
+  border-bottom: @coloredBorderSize solid @yellow;
+}