Dynamically resizing panels based on browser window size
The problem is basically calculating the number of panels.
I'm no expert in media queries, but this is how i would solve it using js:

function PanelCount(lowerBound, upperBound, panelCount) {
  this.lowerBound = lowerBound;
  this.upperBound = upperBound;
  this.panelCount = panelCount
  this.isApplicableToContainerWidth = function(containerWidth) {
    return lowerBound &lt;= containerWidth&amp;&amp; containerWidth&lt; upperBound;
  };
}

function getCorrectPanelCount(containerWidth) {
    var panelCounts = [];
    panelCounts.push(new PanelCount(1500, Number.MAX_SAFE_INTEGER, 5));
    panelCounts.push(new PanelCount(1120, 1500, 3));
    panelCounts.push(new PanelCount(768, 1120, 2));
    panelCounts.push(new PanelCount(0, 768, 1));

    for (i = 1; i &lt; panelCounts.length; i++) {
      if (panelCounts[i].isApplicableToContainerWidth(containerWidth)) {
        return panelCounts[i].panelCount;
      }
    }
}


Naming needs some improvement though, PanelCount is a horrible class name