Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

//Section names & colors:

$sectionBlocks: (
 deals: #ff5300,
 events: #0065c3,
 experts: #00b9f2,
 topics: #5d4ab7,
 essentials: #61bb00,
 teams: #bed600
);

@each $type, $color in $sectionBlocks {
  
  &.#{$type} {
    border-bottom-color: $color;
    
    h1 {
      background: $color;
    }
    
    a {
      color: $color;
    }
  }
}
.teaser {
  max-width: 400px;
  margin-bottom: 50px;
  font-family: sans-serif;
  font-size: 14px;
  border-bottom: solid 3px #333; // ← color changes for each section
  
    h1 {
    padding: 5px 10px;
    font-size: 18px;
    color: #fff;
    background: #333; // ← color changes for each section
  }
  
  p {
    padding: 0 10px;
  }
  
  a {
    font-weight: bold;
    color: #333; // ← color changes for each section
  }

}

SassMeister-output.css

.deals {
  border-bottom-color: #ff5300;
}

.deals h1 {
  background: #ff5300;
}

.deals a {
  color: #ff5300;
}

.events {
  border-bottom-color: #0065c3;
}

.events h1 {
  background: #0065c3;
}

.events a {
  color: #0065c3;
}

.experts {
  border-bottom-color: #00b9f2;
}

.experts h1 {
  background: #00b9f2;
}

.experts a {
  color: #00b9f2;
}

.topics {
  border-bottom-color: #5d4ab7;
}

.topics h1 {
  background: #5d4ab7;
}

.topics a {
  color: #5d4ab7;
}

.essentials {
  border-bottom-color: #61bb00;
}

.essentials h1 {
  background: #61bb00;
}

.essentials a {
  color: #61bb00;
}

.teams {
  border-bottom-color: #bed600;
}

.teams h1 {
  background: #bed600;
}

.teams a {
  color: #bed600;
}

.teaser {
  max-width: 400px;
  margin-bottom: 50px;
  font-family: sans-serif;
  font-size: 14px;
  border-bottom: solid 3px #333;
}

.teaser h1 {
  padding: 5px 10px;
  font-size: 18px;
  color: #fff;
  background: #333;
}

.teaser p {
  padding: 0 10px;
}

.teaser a {
  font-weight: bold;
  color: #333;
}