function load(url, target) {
document.getElementById(target).innerHTML = '<h3>Loading Content...</h3>';
req = new XMLHttpRequest();
req.onreadystatechange = function() {loaded(url, target)};
req.open("GET", url, true);
req.send("");
return false;
}


function loaded(url, target) {
 if (req.readyState == 4) { // only if req is "loaded"
    if (req.status == 200) { // only if "OK"
      document.getElementById(target).innerHTML = req.responseText;
      if (document.body.id == "home") {setDDheight(); }; // adjust DD height only while in Home page
    } else {
      document.getElementById(target).innerHTML="Load Error:\n"+ req.status + "\n" +req.statusText;
    }
  }
}


function setDDheight() {setTimeout ("setDDheightNow()", 100);} // wait for story to load
// this is a hokie way of doing it because there is a timing issue with the browsers refresh
// I will revisit this solution when browsers stabilize a little
// If you are reading this and have a better solution, please e-mail me (Eric) and I'll buy you a beer or coffee

function setDDheightNow() {
var DDheight = DDminHeight = 200; // minimum size of Directors Desk box + overhead
var DDheightAdj = 422; //sets bottoms flush hopefully
var BSheight = document.getElementById("bigStory1").offsetHeight;
var DD0height = document.getElementById("directorsDesk0").offsetHeight;
var DDheight = BSheight - DDheightAdj;
if (DDheight <= DDminHeight) {DDheight = DDminHeight;};
document.getElementById("directorsDesk0").style.height = (DDheight + "px");
}