Fixed inconsistent use of media query breakpoints

- @largest* should only be used by max-width queries
 - @*Breakpoint should only be used by min-width queries

src/definitions/elements/divider.less

@@ -132,7 +132,7 @@
 }
 
 /* Inside grid */
-@media only screen and (max-width : (@tabletBreakpoint - 1px)) {
+@media only screen and (max-width : @largestMobileScreen) {
 
   .ui.stackable.grid .ui.vertical.divider,
   .ui.grid .stackable.row .ui.vertical.divider {

src/definitions/elements/step.less

@@ -392,7 +392,7 @@
 ---------------*/
 
 /* Tablet Or Below */
-@media only screen and (max-width: @computerBreakpoint) {
+@media only screen and (max-width: @largestTabletScreen) {
 
 .ui[class*="tablet stackable"].steps {
   display: inline-flex;

src/definitions/modules/modal.less

@@ -211,7 +211,7 @@
 }
 
 /* Tablet and Mobile */
-@media only screen and (max-width : @computerBreakpoint) {
+@media only screen and (max-width : @largestTabletScreen) {
   .ui.modal > .header {
     padding-right: @closeHitbox;
   }
@@ -313,7 +313,7 @@
 }
 
 /* Tablet and Mobile */
-@media only screen and (max-width : @computerBreakpoint) {
+@media only screen and (max-width : @largestTabletScreen) {
   .ui.basic.modal > .close {
     color: @basicInnerCloseColor;
   }
@@ -371,7 +371,7 @@
   z-index: auto;
 }
 
-@media only screen and (max-width : @computerBreakpoint) {
+@media only screen and (max-width : @largestTabletScreen) {
   .modals.dimmer .ui.scrolling.modal {
     margin-top: @mobileScrollingMargin !important;
     margin-bottom: @mobileScrollingMargin !important;

src/definitions/views/ad.less

@@ -225,7 +225,7 @@
   display: none;
 }
 
-@media only screen and (max-width : (@tabletBreakpoint - 1)) {
+@media only screen and (max-width : @largestMobileScreen) {
   .ui.mobile.ad {
     display: block;
   }