Generated by SassMeister.com.

SassMeister-input-HTML.html

<section>
  <div class="box dunkelgrau">Inhalt</div>
  <div class="box gruen">Inhalt</div>
</section>

SassMeister-input.scss

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

$gruen:       #7ba32b;
$dunkelgrau:  #13191D;
$font-dunkel: #000;
$font-hell:   #fff;

section {width: 500px;}

.box {
  display: inline-block;
  height: 50px; 
  padding: 10px;
  width: 50%;
    @media (max-width: 600px) {
      width: 100%;
    }
  }
  
.gruen {
  background-color: $gruen;
  color: $font-dunkel;
  }
.dunkelgrau {
  background-color: $dunkelgrau;
  color: $font-hell;
  }

SassMeister-output.css

section {
  width: 500px;
}

.box {
  display: inline-block;
  height: 50px;
  padding: 10px;
  width: 50%;
}
@media (max-width: 600px) {
  .box {
    width: 100%;
  }
}

.gruen {
  background-color: #7ba32b;
  color: black;
}

.dunkelgrau {
  background-color: #13191d;
  color: white;
}

SassMeister-rendered.html

<section>
  <div class="box dunkelgrau">Inhalt</div>
  <div class="box gruen">Inhalt</div>
</section>