adding #21

src/scss/helpers/_visibility.scss

@@ -1,34 +1,87 @@
+/**
+ *  visibility
+ *
+ *
+ *  @author Björn Hase, Tentakelfabrik
+ *  @license http://opensource.org/licenses/MIT The MIT License
+ *  @link https://github.com/tentakelfabrik/plain-ui-css
+ *
+ */
+
+
 /**
  *  display
  *
  *
  */
 
+@mixin display($breakpoint, $class, $value)
+{
+    .display-#{ $class }-#{ $breakpoint } {
+        display: #{ $value };
+    }
+}
+
+@mixin display-breakpoints($class, $value)
+{
+    @include media-xs() {
+        @include display('xs', $class, $value);
+    }
+
+    @include media-sm() {
+        @include display('sm', $class, $value);
+    }
+
+    @include media-md() {
+        @include display('md', $class, $value);
+    }
+
+    @include media-lg() {
+         @include display('lg', $class, $value);
+     }
+
+    @include media-xlg() {
+        @include display('xlg', $class, $value);
+    }
+}
+
 
 .display-block {
     display: block;
 }
 
+@include display-breakpoints('block', 'block');
+
 .display-inline {
     display: inline;
 }
 
+@include display-breakpoints('inline', 'inline');
+
 .display-inline-block {
     display: inline-block;
 }
 
+@include display-breakpoints('inline-block', 'inline-block');
+
 .display-flex {
     display: flex;
 }
 
+@include display-breakpoints('flex', 'flex');
+
 .display-inline-flex {
     display: inline-flex;
 }
 
+@include display-breakpoints('inline-flex', 'inline-flex');
+
 .display-table {
     display: table;
 }
 
+@include display-breakpoints('table', 'table');
+
 
 /**
  *  for hidden-xs etc, show https://reflexgrid.com/#visibility-helpers