Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

// Objective #1 Resolve syntax issues so that this code compiles to CSS.
// Objective #2 Fix any potential problems this CSS could cause on redhat.com. 
// Objective #3 Make the code DRY! 

$gray: #333;

%small-title {
  font-size:1.5rem;
}

.block-block-7, .block-block-5, .block-block-1 {
    a {
      background: purple;
    }
  }

@media screen and (max-width: 480px){
  .region-content {
    width: 600px;
    background-image: url(http://redhat.local/sites/all/themes/redhat/images/red-bg.png);
    background-repeat: no-repeat;
    background-position: 0 0;
  }
  .block-block-7, .block-block-5, .block-block-1 {
    a {
      background: $gray;
    }
  }
}
@media screen and (max-width: 600px){
    .region-content {
      width:90%;
      background-image: none;
      background-color: purple;
    }
  
}

.region-content h2 {
  @extend %small-title;
  font-size: 9em;
  font-weight: bold;
  color: $gray;
}

SassMeister-output.css

.region-content h2 {
  font-size: 1.5rem;
}

.block-block-7 a, .block-block-5 a, .block-block-1 a {
  background: purple;
}

@media screen and (max-width: 480px) {
  .region-content {
    width: 600px;
    background-image: url(http://redhat.local/sites/all/themes/redhat/images/red-bg.png);
    background-repeat: no-repeat;
    background-position: 0 0;
  }

  .block-block-7 a, .block-block-5 a, .block-block-1 a {
    background: #333;
  }
}
@media screen and (max-width: 600px) {
  .region-content {
    width: 90%;
    background-image: none;
    background-color: purple;
  }
}
.region-content h2 {
  font-size: 9em;
  font-weight: bold;
  color: #333;
}