Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="sassy">Sassy Philly!</li>

SassMeister-input.scss

// ----
// Sass (v3.2.19)
// Compass (v0.12.6)
// ----

$blue: #063886;
$padding: 20px;

.sassy {
  border: 10px solid $blue;
  width: 400px-$padding;
  background-image: url(http://c2233832.cdn.cloudfiles.rackspacecloud.com/skyline.jpg);
  background-size: 100%;
  padding: $padding;
  height: 275px-$padding;
}

div {
  color: #fff;
  border-radius: 3px;
  font-family: Helvetica;
  text-align: center;
  font-size: 30px;
  margin: 20px auto;
}

SassMeister-output.css

.sassy {
  border: 10px solid #063886;
  width: 380px;
  background-image: url(http://c2233832.cdn.cloudfiles.rackspacecloud.com/skyline.jpg);
  background-size: 100%;
  padding: 20px;
  height: 255px;
}

div {
  color: #fff;
  border-radius: 3px;
  font-family: Helvetica;
  text-align: center;
  font-size: 30px;
  margin: 20px auto;
}

SassMeister-rendered.html

<div class="sassy">Sassy Philly!</li>