chore: refactor cards

scss/components/_cards.scss

@@ -1,5 +1,17 @@
 // Mixin and colors
 
+@mixin card() {
+    @include border-radius();
+    box-shadow: $large-shadow;
+    border: none;
+    margin-bottom:1.2em;
+}
+
+@mixin card-relief{
+    @include card()
+    box-shadow: $large-shadow, $inset-shadow;
+}
+
 @mixin card-color($background-color, $text-color) {
   & > .card-header { background-color: $background-color; color:$text-color; }
 }
@@ -12,19 +24,12 @@
 /* 10.1 - Cards */
 
 .card {
-  @include border-radius();
-	box-shadow: $large-shadow;
-  border: none;
-  margin-bottom:1.2em;
-}
+    @include card();
 
-.card-shadow {
-  box-shadow: $large-shadow, $inset-shadow;
-}
-
-.card h1,.card h2,.card h3,.card h4,.card h5,.card h6,.card h7,.card h8,.card h9,.card h10  {
-	color:#333;
-	text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
+    h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
+	   color:#333;
+	   text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
+    }
 }
 
 .card {
@@ -53,34 +58,34 @@
 /* 10.1.1 - Headers */
 
 .card-header {
-  @include borders();
-  font-size:1.1em;
-  box-shadow: $inset-relief;
-	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
-  font-weight:600;
-  border-radius: 0;
-
-  &:first-child {
-    @include border-radius();
-    border-bottom-left-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  &:last-child {
-    @include border-radius();
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-  }
-
-  h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
-    font-size:1em;
-    text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
-    padding:0px;
-    margin:0px;
-    color:#FFF;
+    @include borders();
+    font-size:1.1em;
+    box-shadow: $inset-relief;
+    text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
     font-weight:600;
-    line-height:1.5em;
-  }
+    border-radius: 0;
+
+    &:first-child {
+        @include border-radius();
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+
+    &:last-child {
+        @include border-radius();
+        border-top-left-radius: 0;
+        border-top-right-radius: 0;
+    }
+
+    h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
+        font-size:1em;
+        text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
+        padding:0px;
+        margin:0px;
+        color:#FFF;
+        font-weight:600;
+        line-height:1.5em;
+    }
 }
 
 /* 10.1.2 - Meta */
@@ -130,21 +135,16 @@ a.list-group-item:hover {
 /* 10.2 - Breadcrumb */
 
 .breadcrumb {
-  @include border-radius();
-    box-shadow: $large-shadow, $inset-shadow;
-  border: 0;
-  background-color:#eeeeec;
-  margin-bottom:1.2em;
+  @include card-relief();
   @include li-no-margin();
+  background-color:#eeeeec;
 }
 
 /* 10.3 - Alerts */
 
 .alert {
-  @include borders();
-  @include border-radius();
+  @include card();
   color:rgba(0, 0, 0, 0.7);
-  box-shadow: $large-shadow;
 }
 
 .alert a, .alert-link {