diff --git a/css/palette.css b/css/palette.css
index cb1a8f4..1dd6b08 100644
--- a/css/palette.css
+++ b/css/palette.css
@@ -1,49 +1,114 @@
 /* ------------------ COULEURS ------------------- */
-/* de base */
-.card-primary > .card-header, .btn-primary, .btn-primary:hover, .btn-primary:active, .badge-primary {
-  background-color: #7951c0;
-  color: #FFF; }
-
-.card-secondary > .card-header, .btn-secondary, .btn-secondary:hover, .btn-secondary:active, .badge-secondary {
+/* CARDS */
+.card-blue > .card-header {
   background-color: #4e63c9;
   color: #FFF; }
 
-.card-danger > .card-header, .card-red > .card-header, .btn-danger, .btn-red, .badge-red, .badge-danger {
-  background-color: #e33d22;
-  color: #FFF; }
-
-.card-warning > .card-header, .card-orange > .card-header, .btn-warning, .btn-orange, .badge-warning, .badge-orange {
-  background-color: #eb790a;
-  color: #FFF; }
-
-.card-success > .card-header, .card-green > .card-header, .btn-success, .btn-green, .badge-success, .badge-green {
-  background-color: #75b82d;
-  color: #FFF; }
-
-.card-info > .card-header, .card-skyblue > .card-header, .btn-info, .btn-skyblue, .badge-info, .badge-skyblue {
-  background-color: #42a0f3;
-  color: #FFF; }
-
-.card-blue > .card-header, .btn-blue, .badge-blue {
-  background-color: #4e63c9;
-  color: #FFF; }
-
-.card-purple > .card-header, .btn-purple, .badge-purple {
-  background-color: #7951c0;
-  color: #FFF; }
-
-.card-dark > .card-header, .btn-dark, .badge-dark {
-  background-color: #6d6d6d;
-  color: #FFF; }
-
-.card-light > .card-header, .btn-light, .badge-light {
-  background-color: #eeeeec; }
-
-.card-violet > .card-header, .btn-violet, .badge-violet {
+.card-violet > .card-header {
   background-color: #ce4dcd;
   color: #FFF; }
 
-.card-turquoise > .card-header, .btn-turquoise, .badge-turquoise {
+.card-purple > .card-header {
+  background-color: #7951c0;
+  color: #FFF; }
+
+.card-red > .card-header {
+  background-color: #e33d22;
+  color: #FFF; }
+
+.card-orange > .card-header {
+  background-color: #eb790a;
+  color: #FFF; }
+
+.card-green > .card-header {
+  background-color: #75b82d;
+  color: #FFF; }
+
+.card-skyblue > .card-header {
+  background-color: #42a0f3;
+  color: #FFF; }
+
+.card-dark > .card-header {
+  background-color: #6d6d6d;
+  color: #FFF; }
+
+.card-light > .card-header {
+  background-color: #eeeeec;
+  color: #111; }
+
+.card-turquoise > .card-header {
+  background-color: #46bd9e;
+  color: #FFF; }
+
+.card-primary > .card-header {
+  background-color: #7951c0;
+  color: #FFF; }
+
+.card-secondary > .card-header {
+  background-color: #4e63c9;
+  color: #FFF; }
+
+.card-warning > .card-header {
+  background-color: #eb790a;
+  color: #FFF; }
+
+.card-danger > .card-header {
+  background-color: #e33d22;
+  color: #FFF; }
+
+.card-info > .card-header {
+  background-color: #42a0f3;
+  color: #FFF; }
+
+.card-success > .card-header {
+  background-color: #75b82d;
+  color: #FFF; }
+
+/* de base */
+.btn-primary, .btn-primary:hover, .btn-primary:active, .badge-primary {
+  background-color: #7951c0;
+  color: #FFF; }
+
+.btn-secondary, .btn-secondary:hover, .btn-secondary:active, .badge-secondary {
+  background-color: #4e63c9;
+  color: #FFF; }
+
+.btn-danger, .btn-red, .badge-red, .badge-danger {
+  background-color: #e33d22;
+  color: #FFF; }
+
+.btn-warning, .btn-orange, .badge-warning, .badge-orange {
+  background-color: #eb790a;
+  color: #FFF; }
+
+.btn-success, .btn-green, .badge-success, .badge-green {
+  background-color: #75b82d;
+  color: #FFF; }
+
+.btn-info, .btn-skyblue, .badge-info, .badge-skyblue {
+  background-color: #42a0f3;
+  color: #FFF; }
+
+.btn-blue, .badge-blue {
+  background-color: #4e63c9;
+  color: #FFF; }
+
+.btn-purple, .badge-purple {
+  background-color: #7951c0;
+  color: #FFF; }
+
+.btn-dark, .badge-dark {
+  background-color: #6d6d6d;
+  color: #FFF; }
+
+.btn-light, .badge-light {
+  background-color: #eeeeec; }
+
+.btn-violet, .badge-violet {
+  background-color: #ce4dcd;
+  color: #FFF; }
+
+.btn-turquoise, .badge-turquoise {
   background-color: #46bd9e;
   color: #FFF; }
 
diff --git a/scss/palette.scss b/scss/palette.scss
index cde52af..03db250 100644
--- a/scss/palette.scss
+++ b/scss/palette.scss
@@ -18,64 +18,89 @@ $color-danger: $color-red;
 $color-info: $color-skyblue;
 $color-success: $color-green;
 
+@mixin card-color($background-color, $text-color) {
+  & > .card-header { background-color: $background-color; color:$text-color; }
+}
+
+/* CARDS */
+
+.card {
+  &-blue { @include card-color($color-blue, #FFF); }
+  &-violet { @include card-color($color-violet, #FFF); }
+  &-purple { @include card-color($color-purple, #FFF); }
+  &-red { @include card-color($color-red, #FFF); }
+  &-orange { @include card-color($color-orange, #FFF); }
+  &-green { @include card-color($color-green, #FFF); }
+  &-skyblue { @include card-color($color-skyblue, #FFF); }
+  &-dark { @include card-color($color-dark, #FFF); }
+  &-light { @include card-color($color-light, #111); }
+  &-turquoise { @include card-color($color-turquoise, #FFF); }
+  
+  &-primary { @include card-color($color-primary, #FFF); }
+  &-secondary { @include card-color($color-secondary, #FFF); }
+  &-warning { @include card-color($color-warning, #FFF); }
+  &-danger { @include card-color($color-danger, #FFF); }
+  &-info { @include card-color($color-info, #FFF); }
+  &-success { @include card-color($color-success, #FFF); }
+}
+
 /* de base */
 
-
-.card-primary > .card-header, .btn-primary, .btn-primary:hover, .btn-primary:active, .badge-primary {
+.btn-primary, .btn-primary:hover, .btn-primary:active, .badge-primary {
 	background-color:#7951c0;
   color:#FFF;
 }
 
-.card-secondary > .card-header, .btn-secondary, .btn-secondary:hover, .btn-secondary:active, .badge-secondary {
+.btn-secondary, .btn-secondary:hover, .btn-secondary:active, .badge-secondary {
 	background-color:#4e63c9;
 	color:#FFF;
 }
 
-.card-danger > .card-header, .card-red > .card-header, .btn-danger, .btn-red, .badge-red, .badge-danger {
+.btn-danger, .btn-red, .badge-red, .badge-danger {
 	background-color:#e33d22;
   color:#FFF;
 }
 
-.card-warning > .card-header, .card-orange > .card-header, .btn-warning, .btn-orange, .badge-warning, .badge-orange {
+.btn-warning, .btn-orange, .badge-warning, .badge-orange {
 	background-color:#eb790a;
   color:#FFF;
 }
 
-.card-success > .card-header, .card-green > .card-header, .btn-success, .btn-green, .badge-success, .badge-green {
+.btn-success, .btn-green, .badge-success, .badge-green {
 	background-color:#75b82d;
   color:#FFF;
 }
 
-.card-info > .card-header, .card-skyblue > .card-header, .btn-info, .btn-skyblue, .badge-info, .badge-skyblue {
+.btn-info, .btn-skyblue, .badge-info, .badge-skyblue {
 	background-color:#42a0f3;
   color:#FFF;
 }
 
-.card-blue > .card-header, .btn-blue, .badge-blue {
+.btn-blue, .badge-blue {
 	background-color:#4e63c9;
 	color:#FFF
 }
 
-.card-purple > .card-header, .btn-purple, .badge-purple {
+.btn-purple, .badge-purple {
 	background-color:#7951c0;
 	color:#FFF
 }
 
-.card-dark > .card-header, .btn-dark, .badge-dark {
+.btn-dark, .badge-dark {
 	background-color:#6d6d6d;
 	color:#FFF
 }
 
-.card-light > .card-header, .btn-light, .badge-light {
+.btn-light, .badge-light {
 	background-color:#eeeeec;
 }
 
-.card-violet > .card-header, .btn-violet, .badge-violet {
+.btn-violet, .badge-violet {
 	background-color:#ce4dcd;
   color:#FFF
 }
 
-.card-turquoise > .card-header, .btn-turquoise, .badge-turquoise {
+.btn-turquoise, .badge-turquoise {
 	background-color:#46bd9e;
   color:#FFF
 }