title: How can i efficiently combine two css classes that has the same stats?
body: <p>I have two different objects/elements/div's in my html, loader-inner and loader-inner 2. They have the exact same stats but the color, which changes with the second object. What is the most efficient way to write this code? I know I shouldn't repeat myself with unnecessary code, so can I somehow combine these two and only change the color of the second element somehow?</p>
  
  <pre><code>.loader-inner {
    vertical-align: top;
    display: inline-block;
    width: 50%;
    background-color: #4ae287;
    border: 3px solid #f3f3f3;
    border-right: 2px;
    animation: loader-inner 2s infinite cubic-bezier(.83, .08, .21, .98);
    z-index: 1001;
  }
  .loader-inner2 {
    vertical-align: top;
    display: inline-block;
    width: 50%;
    background-color: #4ae2cb;
    border: 3px solid #f3f3f3;
    animation: loader-inner2 2s infinite cubic-bezier(.83, .08, .21, .98);
    z-index: 1001;
  }
  </code></pre>
  
  <p>Thank you.</p>