title: How to factor a color and boder-color into a single CSS style and apply it on other parts of the CSS styles
body: <p>I have the following styles in a <strong>Site.css</strong> which is part of a <strong>ASP.NET MVC4</strong> Site</p>
  
  <pre><code>form label.error { font-size: 12px; color: #cc0000; }
  form input:not([type="submit"]).error{ border-color: #cc0000; }
  form select:not([type="submit"]).error{ border-color: #cc0000; }
  .error { color: #cc0000; }
  </code></pre>
  
  <p>I want to know how can I modify that file to be able to change that <code>#cc0000;</code> without changing it on every single line (factor out the color used for validation errors in this case)</p>
  
  <p>Something similar to this:</p>
  
  <pre><code>errorStyle {
      color: #cc0000 ;
      border-color: #cc0000;
  }
  </code></pre>
  
  <p>And then use it like this:</p>
  
  <pre><code>form label.error { font-size: 12px; errorStyle }
  form input:not([type="submit"]).error{ errorStyle }
  form select:not([type="submit"]).error{ errorStyle }
  .error { errorStyle }
  </code></pre>
  
  <p>In this way if the client wants that color to be changed it easier to maintain.</p>