diff --git a/css/main.css b/css/main.css
index 38b44a5fe80022ea1cb35d7e28d0f58e3d98c919..3820bace5e4185957d31cd2c88692d29eb395f2a 100644
--- a/css/main.css
+++ b/css/main.css
@@ -80,7 +80,7 @@ nav .btn {
 #menuWrapper {
     width: 400px;
     height: 100%;
-    z-index: 2;
+    z-index: 1;
     position: absolute;
     display: block;
     background-color: rgba(255,255,255,0.8);
diff --git a/js/fea/DmaCellOcta.js b/js/fea/DmaCellOcta.js
index e2cb273c2ef9e182a1fa897aadfaeb991df9e6da..9424aed0aedf9b3a9cc0d105eb763b2f2523c147 100644
--- a/js/fea/DmaCellOcta.js
+++ b/js/fea/DmaCellOcta.js
@@ -187,8 +187,18 @@ DMARotatedEdgeCell.prototype.calcHighlighterPosition = function(face, point){
     return {index: _.clone(this.indices), direction:direction, position:position};
 };
 
+DMARotatedEdgeCell.prototype.xScale = function(scale){
+    if (!scale) scale = dmaGlobals.lattice.get("scale");
+    return scale;
+};
+
+DMARotatedEdgeCell.prototype.yScale = function(scale){
+    return this.xScale(scale);
+};
+
 DMARotatedEdgeCell.prototype.zScale = function(scale){
-    return this.xScale(scale)*Math.sqrt(2);
+    if (!scale) scale = dmaGlobals.lattice.get("scale");
+    return Math.sqrt(2)/2*scale;
 };
 
 DMARotatedEdgeCell.prototype._getGeometry = function(){
diff --git a/js/main.js b/js/main.js
index 2be1014f0043519a5fdf2c4dcbb83e68cfc505eb..8288646a1f1d67c833ca072b12726533f6f2e268 100644
--- a/js/main.js
+++ b/js/main.js
@@ -2,8 +2,6 @@
  * Created by aghassaei on 1/7/15.
  */
 
-//test
-
 //setup persistent global variables
 if (typeof dmaGlobals === "undefined") dmaGlobals = {};
 
diff --git a/js/menus/LatticeMenuView.js b/js/menus/LatticeMenuView.js
index e13b64363dfc4bc67098c7b31146647b27a148fe..0ec1ea487c2e0f37b18f314069a0a2e17848ae82 100644
--- a/js/menus/LatticeMenuView.js
+++ b/js/menus/LatticeMenuView.js
@@ -26,9 +26,25 @@ LatticeMenuView = Backbone.View.extend({
         this.lattice = options.lattice;
 
         _.bindAll(this, "render");
+        _.bindAll(this, "_onKeyup");
 
+        //bind events
         this.listenTo(this.lattice, "change", this.render);
         this.listenTo(this.model, "change:units", this.render);
+        $(document).bind('keyup', {state:false}, this._onKeyup);
+    },
+
+    _onKeyup: function(e){
+        if ($(".cellSeparation").is(":focus")) this._updateNumber(e, "cellSeparation");
+    },
+
+    _updateNumber: function(e, property){
+        e.preventDefault();
+        var newVal = parseFloat($(e.target).val());
+        if (isNaN(newVal)) return;
+        var object = this.lattice.get(property);
+        object[$(e.target).data("type")] = newVal;
+        this.lattice.trigger("change:"+property);
     },
 
     _clearCells: function(e){
@@ -159,6 +175,8 @@ LatticeMenuView = Backbone.View.extend({
                     <% }); %>\
                 </ul>\
             </div><br/><br/>\
+        Cell Separation (xy, z): &nbsp;&nbsp;<input data-type="xy" value="<%= cellSeparation.xy %>" placeholder="XY" class="form-control numberInput cellSeparation" type="text">\
+        &nbsp;<input data-type="z" value="<%= cellSeparation.z %>" placeholder="Z" class="form-control numberInput cellSeparation" type="text">\
         Num Cells:&nbsp;&nbsp;<%= numCells %><br/>\
         <br/>\
         <a href="#" id="latticeMenuClearCells" class=" btn btn-block btn-lg btn-default">Clear All Cells</a><br/>\
diff --git a/js/models/BasePlane.js b/js/models/BasePlane.js
index e62e441571ac607eaa70674b1e9a5e291b0fb295..f95c81518d35b024ad4d2a0d08b685e919219324 100644
--- a/js/models/BasePlane.js
+++ b/js/models/BasePlane.js
@@ -161,8 +161,7 @@ OctaBasePlane = BasePlane.extend({
             for (var i=-dimY;i<=dimY;i++){
 
                 var xOffset = 0;
-                if (Math.abs(j)%2==0) {
-                } else {
+                if (Math.abs(j)%2!=0) {
                     xOffset = 1/2*xScale;
                 }
 
diff --git a/js/models/Lattice.js b/js/models/Lattice.js
index bb89b505a87c6314d3ee7a629fb355bcaaabcabe..05c94aeeafeed620f62980dcd055ffb5eb583025 100644
--- a/js/models/Lattice.js
+++ b/js/models/Lattice.js
@@ -20,9 +20,7 @@ Lattice = Backbone.Model.extend({
 
         //spacing for connectors/joints
         columnSeparation: 0.0,//todo get rid of this
-        xSeparation: 0.0,
-        ySeparation: 0.0,
-        zSeparation: 0.0,
+        cellSeparation: {xy:0.1, z:0},
 
         cellMode: "cell",//show cells vs parts
         cellType: "octa",
diff --git a/js/models/LatticeOcta.js b/js/models/LatticeOcta.js
index 9697ce9d3dbbb5fc49aa9369fc972ee9f2192858..4cea50a54d2116114f6a3d36033331f0f65c370c 100644
--- a/js/models/LatticeOcta.js
+++ b/js/models/LatticeOcta.js
@@ -223,48 +223,6 @@ OctaLatticeSubclasses = {
             return new DMAEdgeOctaCell(indices, scale);
         },
 
-//        getInvCellPositionForIndex: function(index){
-//
-//            var scale = this.get("scale");
-//            var position = _.clone(index);
-//
-//            var oddZ = position.z%2 != 0;
-//            position.z = Math.floor(position.z/2);
-//            var yScale = scale/Math.sqrt(3);
-//
-//            if (oddZ){
-//                position.x = (position.x)*this.xScale(scale);
-//                position.y = position.y*this.yScale(scale);
-//            } else {
-//                position.x = (position.x+0.5)*this.xScale(scale);
-//                position.y = (position.y)*this.yScale(scale)-yScale/2;
-//            }
-//
-//            if (oddZ){
-//                position.z = (position.z + 1)*this.zScale(scale);
-//            } else {
-//                position.z = (position.z)*this.zScale(scale);
-//            }
-//
-//            if ((index.y%2) != 0) {
-//                if (oddZ){
-//                    position.x += this.xScale(scale)/2;
-//                } else {
-//                    position.x -= this.xScale(scale)/2;
-//                }
-//            }
-//
-//            var zLayer = Math.floor(index.z/2)%3;
-//            if (zLayer == 1) {
-//                position.x += this.xScale(scale)/2;
-//                position.y -= yScale/2;
-//            } else if (zLayer == 2){
-//                position.y -= yScale;
-//            }
-//
-//            return position;
-//        },
-
         _undo: function(){//remove all the mixins, this will help with debugging later
             var self = this;
             _.each(_.keys(this.OctaEdgeLattice), function(key){
@@ -310,6 +268,7 @@ OctaLatticeSubclasses = {
 
         xScale: function(scale){
             if (!scale) scale = this.get("scale");
+            scale *= 1 + 2*this.get("cellSeparation").xy;
             return scale;
         },
 
@@ -318,7 +277,9 @@ OctaLatticeSubclasses = {
         },
 
         zScale: function(scale){
-            return this.xScale(scale)*Math.sqrt(2)/2;
+            if (!scale) scale = this.get("scale");
+            scale *= Math.sqrt(2)/2 + 2*this.get("cellSeparation").z;
+            return scale;
         },
 
         makeCellForLatticeType: function(indices, scale){