diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss
index 6556338..6c6d9d4 100644
--- a/src/scss/_mixins.scss
+++ b/src/scss/_mixins.scss
@@ -5,3 +5,4 @@
 @import 'mixins/responsive';
 @import 'mixins/borders';
 @import 'mixins/shape';
+@import 'mixins/panels';
diff --git a/src/scss/components/_cards.scss b/src/scss/components/_cards.scss
index 54db9a9..cd3d9fd 100644
--- a/src/scss/components/_cards.scss
+++ b/src/scss/components/_cards.scss
@@ -8,71 +8,6 @@
 $card-bigpad: $lineheight;
 $card-smallpad: $lineheight_half;
 
-@mixin card($size) {
-    @include border-radius($card-radius);
-    background-color: $color-background-alt;
-    box-shadow: $large-shadow;
-    border: none;
-    margin:0;
-    margin-bottom:$lineheight;
-
-    & > * {
-      margin-left: $size;
-      margin-right: $size;
-      &:first-child {
-        margin-top: $size;
-        &.card-header {
-          margin-top:$card-header-margin;
-        }
-      }
-      &:last-child {
-        margin-bottom: $size;
-        &.card-header {
-          margin-bottom:$card-header-margin;
-        }
-      }
-    }
-}
-
-@mixin card-header($size) {
-    font-size:1.1em;
-    font-weight: $fontweight_big;
-    padding: $size/2;
-    padding-left:0;
-    padding-right:0;
-    padding-bottom: $size/2!important;
-    margin-bottom:$lineheight_half;
-    margin-top:$lineheight_half;
-    line-height:$lineheight;
-    white-space: nowrap;
-
-    position:relative;
-    left: -$size*1.25;
-
-    width:85%;
-
-    @include shape-style($size);
-    border-radius:0;
-    &:first-child {
-      border-top-left-radius: $card-radius;
-      border-top-right-radius: $card-radius;
-    }
-    &:last-child {
-      border-bottom-left-radius: $card-radius;
-      border-bottom-right-radius: $card-radius;
-    }
-
-    h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
-        font-family:$basefont;
-        font-size:1rem;
-        padding:0px;
-        margin:0px;
-        color:$color-font-light;
-        font-weight: $fontweight_big;
-        line-height:$lineheight;
-    }
-}
-
 @mixin card-color($background-color) {
     & .card-header, & .menu-header {
         @include colorize-shape($background-color);
@@ -81,7 +16,7 @@ $card-smallpad: $lineheight_half;
 }
 
 .card, .menu {
-    @include card($card-bigpad);
+    @include panel($card-bigpad);
     display: flex;
     flex-direction: column;
 
@@ -90,7 +25,7 @@ $card-smallpad: $lineheight_half;
     }
 
     &-header {
-        @include card-header($card-bigpad);
+        @include panel-header($card-bigpad);
         .fa {
           margin-right: 0.5em;
         }
@@ -206,9 +141,9 @@ ul.card-list, .card > ul {
 }
 
 .smallcard, .toast {
-    @include card($card-smallpad);
+    @include panel($card-smallpad);
     &-header {
-        @include card-header($card-bigpad);
+        @include panel-header($card-bigpad);
     }
 }
 
diff --git a/src/scss/components/_previews.scss b/src/scss/components/_previews.scss
index 6661bb2..845512e 100644
--- a/src/scss/components/_previews.scss
+++ b/src/scss/components/_previews.scss
@@ -94,7 +94,7 @@ $comment-height:30px;
     .card-header {
       font-family: $basefont;
       font-size: 1rem;
-      @include card-header($lineheight_half);
+      @include panel-header($lineheight_half);
       @include colorize-shape($color-primary);
       color:getTextColorFromBackground($color-primary);
       font-weight: $fontweight_big;
diff --git a/src/scss/mixins/_panels.scss b/src/scss/mixins/_panels.scss
new file mode 100644
index 0000000..776abe2
--- /dev/null
+++ b/src/scss/mixins/_panels.scss
@@ -0,0 +1,64 @@
+@mixin panel($size) {
+    @include border-radius($card-radius);
+    background-color: $color-background-alt;
+    box-shadow: $large-shadow;
+    border: none;
+    margin:0;
+    margin-bottom:$lineheight;
+
+    & > * {
+      margin-left: $size;
+      margin-right: $size;
+      &:first-child {
+        margin-top: $size;
+        &.card-header {
+          margin-top:$card-header-margin;
+        }
+      }
+      &:last-child {
+        margin-bottom: $size;
+        &.card-header {
+          margin-bottom:$card-header-margin;
+        }
+      }
+    }
+}
+
+@mixin panel-header($size) {
+    font-size:1.1em;
+    font-weight: $fontweight_big;
+    padding: $size/2;
+    padding-left:0;
+    padding-right:0;
+    padding-bottom: $size/2!important;
+    margin-bottom:$lineheight_half;
+    margin-top:$lineheight_half;
+    line-height:$lineheight;
+    white-space: nowrap;
+
+    position:relative;
+    left: -$size*1.25;
+
+    width:85%;
+
+    @include shape-style($size);
+    border-radius:0;
+    &:first-child {
+      border-top-left-radius: $card-radius;
+      border-top-right-radius: $card-radius;
+    }
+    &:last-child {
+      border-bottom-left-radius: $card-radius;
+      border-bottom-right-radius: $card-radius;
+    }
+
+    h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
+        font-family:$basefont;
+        font-size:1rem;
+        padding:0px;
+        margin:0px;
+        color:$color-font-light;
+        font-weight: $fontweight_big;
+        line-height:$lineheight;
+    }
+}