diff --git a/lib/index.js b/lib/index.js
index 56a66f3..6c34632 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -7,6 +7,9 @@ const styles = `
 .current {
   fill: #5fa04e;
 }
+.commercial {
+  fill: #ae5f00;
+}
 .active {
   fill: #229ad6;
 }
@@ -38,11 +41,11 @@ const styles = `
   text-transform: uppercase;
 }`;
 
-
+///
 function parseInput (data, queryStart, queryEnd, excludeMaster, projectName) {
   const output = [];
 
-  Object.keys(data).forEach((v) => {
+  Object.keys(data).reverse().forEach((v) => {
     const version = data[v];
     const name = `${projectName} ${v.replace('v', '')}`;
     const current = version.start ? new Date(version.start) : null;
@@ -58,6 +61,12 @@ function parseInput (data, queryStart, queryEnd, excludeMaster, projectName) {
       throw new Error(`missing end in ${version}`);
     }
 
+    if (active !== null) {
+      if (maint < queryEnd && end > queryStart) {
+        output.push({ name, type: 'commercial', start: end, end: queryEnd });
+      }
+    }
+
     if (maint !== null) {
       if (maint < queryEnd && end > queryStart) {
         output.push({ name, type: 'maintenance', start: maint, end });
@@ -80,18 +89,34 @@ function parseInput (data, queryStart, queryEnd, excludeMaster, projectName) {
   });
 
   if (!excludeMaster) {
+    AddFullLineToTop(output, 'Main', 'unstable',);
+  }
+
+  AddFullLineToBottom(output, '<= v16', 'commercial');
+
+  return output;
+
+  function AddFullLineToTop(output, name, type) {
     output.unshift({
-      name: 'Master',
-      type: 'unstable',
+      name: name,
+      type: type,
+      start: queryStart,
+      end: queryEnd
+    });
+  }
+  function AddFullLineToBottom(output, name, type, start, end) {
+    output.push({
+      name: name,
+      type: type,
       start: queryStart,
       end: queryEnd
     });
   }
-
-  return output;
 }
 
 
+
+
 function create (options) {
   const { queryStart, queryEnd, html, svg: svgFile, png, animate, excludeMaster, projectName, margin: marginInput } = options;
   const data = parseInput(options.data, queryStart, queryEnd, excludeMaster, projectName);
@@ -103,6 +128,7 @@ function create (options) {
                    .domain([queryStart, queryEnd])
                    .range([0, width])
                    .clamp(true);
+  // console.log(data.map((data) => { return data.type; }));
   const yScale = D3.scaleBand()
                    .domain(data.map((data) => { return data.name; }))
                    .range([0, height])
@@ -118,7 +144,6 @@ function create (options) {
                  .attr('id', 'bar-container')
                  .attr('transform', `translate(${margin.left}, ${margin.top})`);
 
-
   function calculateWidth (data) {
     return xScale(data.end) - xScale(data.start);
   }