diff --git a/scss/_o-responsive_table.scss b/scss/_o-responsive_table.scss
index 3ab8c2ed4f..9eb058693e 100644
--- a/scss/_o-responsive_table.scss
+++ b/scss/_o-responsive_table.scss
@@ -12,7 +12,7 @@
       padding: 0;
     }
     // for tablet, display 2 cards by rows
-    @media (min-width: $screen-sm-min) {
+    @include media-breakpoint-up(sm) {
       tr {
         float: left;
         width: 45%;
diff --git a/scss/_o-special_font-size.scss b/scss/_o-special_font-size.scss
index 2fb1e9855f..123a6c7ce2 100644
--- a/scss/_o-special_font-size.scss
+++ b/scss/_o-special_font-size.scss
@@ -1,6 +1,6 @@
 .lead {
   font-size: (floor(($font-size-base * 1.15) * 10) / 10);
-  @media (min-width: $screen-sm-min) {
+  @include media-breakpoint-up(sm) {
     font-size: ($font-size-base * 1.5);
   }
 }
@@ -10,13 +10,15 @@ pre {
 .panel-title {
   font-size: (ceil(($font-size-base * 1.125) * 10) / 10);
 }
-@media screen and (min-width: $screen-sm-min) {
-  .carousel-control {
+@media screen {
+  @include media-breakpoint-up(sm) {
+    .carousel-control {
     .glyphicon-chevron-left,
     .glyphicon-chevron-right,
     .icon-prev,
     .icon-next {
       font-size: 3rem;
+      }
     }
   }
 }
diff --git a/scss/_orange-css.scss b/scss/_orange-css.scss
index 8c48c663b8..0c4f6d2ea7 100644
--- a/scss/_orange-css.scss
+++ b/scss/_orange-css.scss
@@ -505,7 +505,7 @@ a.btn {
 .form-horizontal {
   // Reset spacing and right align labels, but scope to media queries so that
   // labels on narrow viewports stack the same as a default form example.
-  @media (min-width: $screen-sm-min) {
+  @include media-breakpoint-up(sm) {
     .form-control-label {
       padding-top: ($padding-base-vertical + .1); // Default padding plus a border
     }
@@ -516,7 +516,7 @@ a.btn {
   // Quick utility class for applying `.input-lg` and `.input-sm` styles to the
   // inputs and labels within a `.form-group`.
   .form-group-lg {
-    @media (min-width: $screen-sm-min) {
+    @include media-breakpoint-up(sm) {
       .form-control-label {
         padding-top: (($padding-large-vertical * $line-height-lg) + .1);
       }
@@ -524,7 +524,7 @@ a.btn {
   }
 
   .form-group-sm {
-    @media (min-width: $screen-sm-min) {
+    @include media-breakpoint-up(sm) {
       .form-control-label {
         padding-top: ($padding-small-vertical + .1);
       }