Generated by SassMeister.com.

SassMeister-input.sass

// ----
// Sass (v3.3.5)
// Compass (v1.0.0.alpha.18)
// ----

$shopListCellWidth: 220px
$shopListCellMargin: 30px

@mixin browserLacks($prop)
    .wsi-no-#{$prop} &
        @content

$shopPromoBlockquoteFont: Helvetica !default
$shopPromoBlockquoteBorderStyle: solid black !default
$shopPromoBlockquoteBorderWidth: 2px 0 2px !default
$shopPromoBlockquotePadding: 20px 10px !default

$shopPromoMaxColumns: 2 !default

@function spellNumber($num)
    @return nth(one two three four five six, $num)

@function getColumnWidth($colWidth)
    @return ($shopListCellWidth * $colWidth) + (($shopListCellMargin + 3px) * ($colWidth - 1)) //Comes from parent product-list.sass; +4px for the space from inline-block layout

// Generate extra styles for browsers where box-sizing: border-box doesn't work
@mixin fallbackWidthForOldBrowsers($widthReducedBy: 0px)
    +browserLacks(boxsizing)
        @for $colWidth from 1 through $shopPromoMaxColumns
            &.#{spellNumber($colWidth)}-wide
                width: getColumnWidth($colWidth) - $widthReducedBy

.shop-promo
    @for $colWidth from 1 through $shopPromoMaxColumns // Styles that depend on specific cell sizing
        .#{spellNumber($colWidth)}-wide
            width: getColumnWidth($colWidth)

    .text-blockquote
        margin: 40px 0
        padding: $shopPromoBlockquotePadding
        border: $shopPromoBlockquoteBorderStyle
        border-width: $shopPromoBlockquoteBorderWidth
        text-align: center
        font-family: $shopPromoBlockquoteFont
        font-size: 24px
        +fallbackWidthForOldBrowsers(nth($shopPromoBlockquotePadding,2) * 2)

SassMeister-output.css

.shop-promo .one-wide {
  width: 220px;
}
.shop-promo .two-wide {
  width: 473px;
}
.shop-promo .text-blockquote {
  margin: 40px 0;
  padding: 20px 10px;
  border: solid black;
  border-width: 2px 0 2px;
  text-align: center;
  font-family: Helvetica;
  font-size: 24px;
}
.wsi-no-boxsizing .shop-promo .text-blockquote.one-wide {
  width: 200px;
}
.wsi-no-boxsizing .shop-promo .text-blockquote.two-wide {
  width: 453px;
}