function getWindowHeight() {
 var windowHeight = 0;
 if (typeof(window.innerHeight) == 'number') {
  windowHeight = window.innerHeight;
 }
 else {
  if (document.documentElement && document.documentElement.clientHeight) {
   windowHeight = document.documentElement.clientHeight;
  }
  else {
   if (document.body && document.body.clientHeight) {
    windowHeight = document.body.clientHeight;
   }
  }
 }
 return windowHeight;
}

// idea is we get window height and then subtract height of header, branding and footer divs to set content height
function setContent() {
 if (document.getElementById) {
  var windowHeight = getWindowHeight();
  if (windowHeight > 0) {
	  
   // get header height:
   var headerHeight = document.getElementById('header').offsetHeight;
 
     // get footer height:
   var footerHeight = document.getElementById('footer').offsetHeight;


   // set content height:
   var content = document.getElementById('maincontent'); 
   var contentHeight=document.getElementById('maincontent').offsetHeight; 
   
   if (windowHeight < (footerHeight+headerHeight+contentHeight )) {} else {
   var contentHeight = (windowHeight - (footerHeight+headerHeight)-24) + 'px';
   content.style.height = contentHeight;
					   }

  }
 }
}
window.onload = function() {
 setContent();
}
window.onresize = function() {
 setContent();
}