diff --git a/hwe/scss/common/break_500px.scss b/hwe/scss/common/break_500px.scss
index 7f85be0a..3df2ad52 100644
--- a/hwe/scss/common/break_500px.scss
+++ b/hwe/scss/common/break_500px.scss
@@ -1,3 +1,6 @@
+@import "bootstrap/scss/vendor/rfs";
+@import 'bootstrap/scss/mixins/grid';
+
 $container-max-widths: (
     md: 500px,
     lg: 1020px,
@@ -14,10 +17,22 @@ $grid-breakpoints: (
   xxl: 1400px
 );
 
+@for $i from 1 through 10 {
+  .col10-#{$i} {
+    @include make-col($i, 10);
+  }
+}
+
 @mixin media-1000px{
   @media (min-width: map-get($grid-breakpoints, 'md')) {
     @content;
   }
+
+  @for $i from 1 through 10 {
+    .col10d-#{$i} {
+      @include make-col($i, 10);
+    }
+  }
 }
 
 @mixin media-500px{