Index: trunk/webapps/cmsmonitor/index.html
===================================================================
--- trunk/webapps/cmsmonitor/index.html	(revision 405)
+++ trunk/webapps/cmsmonitor/index.html	(revision 406)
@@ -49,4 +49,10 @@
   padding: 0px 20% 20px 20%;
 }
+.odd {
+  background-color: rgb(29, 21, 21);
+}
+.even {
+  background-color: #323232;
+}
 .divider {
   font-family: Scoreboard;
@@ -96,4 +102,6 @@
     function loadAllcmsMessages()
     {
+        // counter that alternate the background color of the cms message 
+        var cnt = 0;
         var display = document.getElementById("msgs");
         display.innerHTML = ""
@@ -105,4 +113,5 @@
             for (var i = 0; i < messagejson.data.length; i++)
             {
+                var bg; // variable that alternate the background color for cms message
                 var item = messagejson.data[i];
                 // Find the location for this message
@@ -121,9 +130,17 @@
                 if (phase1 != "<br><br><br>" || phase2 != "<br><br>")
                 {
-                    display.innerHTML += "<div id=\"cms_info\">" + item.cms.index + ": " + 
+                    // Keep track of the number of non-empty cms message 
+                    cnt++;
+                    // Determine odd or even cms message in order to alternate the background color
+                    if (cnt%2==0) {
+                      bg = "even";
+                    } else {
+                      bg = "odd";
+                    }
+                    display.innerHTML += "<div id=\"cms_info\" class=\"" + bg + "\">" + item.cms.index + ": " + 
                         cmsLoc.properties.location + " " + cmsLoc.properties.street + "</div>";
-                    display.innerHTML += "<div class=\"cms_content\">" + phase1 + "</div>" +
-                      "<div class=\"divider\"> -----------------------------------------------</div>" +
-                      "<div class=\"cms_content\">" + phase2 + "</div>";
+                    display.innerHTML += "<div class=\"cms_content " + bg + "\">" + phase1 + "</div>" +
+                      "<div class=\"divider " + bg + "\"> -----------------------------------------------</div>" +
+                      "<div class=\"cms_content " + bg + "\">" + phase2 + "</div>";
                 }
             }
