Firefox 2 columns row bug

2 columns rows only covered half of the page

canvas/css/canvas.css

@@ -815,28 +815,21 @@ div.dialog-content {
 ----------------------------------------------- */
 
 .bg--blue {
-    background-color: #7297ce;
     background-color: #85ade5;
 }
 .bg--darkblue {
-    background-color: #7986cb;
     background-color: #8b99e0;
 }
 .bg--green {
-    /* background-color: #94c356;
-    background-color: #9dc963; */
     background-color: #aed581;
 }
 .bg--seagreen {
-    /* background-color: #48D1CC; */
     background-color: #6bb5b4;
 }
 .bg--purple {
-    /* background-color: #59358c; */
     background-color: #a281d1;
 }
 .bg--green1 {
-    /* background-color: #15af97; */
     background-color: #29bca4;
 }
 .bg--x {

canvas/index.php

@@ -559,7 +559,7 @@
                     </div>
 
                     <!-- ================ 4 col ================ -->
-                    <div class="masonry-layout2" id="4-col-layout">
+                    <div class="masonry-layout2" id="2-col-layout">
                         <div class="masonry-layout__panel" id="panel_07">
                             <div class="card field_07 masonry-layout__panel-content bg--blue">
                                 <h2 class="field-title">

canvas/js/canvas.js

@@ -5,10 +5,12 @@ $(document).ready(function() {
     ================================================= */
     // Declare the currently loaded tags belonging to the user
     var tags;
-        
+    
     // This piece of code is for making the column-count and column-gap CSS to work in Firefox
-    document.getElementById("7-5-col-layout").style.MozColumnCount = "5";
-    document.getElementById("4-col-layout").style.MozColumnCount = "4";
+    /*
+    document.getElementById("7-5-col-layout").style.MozColumnCount = "7";
+    document.getElementById("2-col-layout").style.MozColumnCount = "2";
+     */
     
     // Prevent pressing ENTER on Project Title from submitting the form
     $('.proj_title').keydown(function(event){