function dom_init() {

  $('div#main').fadeIn(600);

  $('a').click(function() {this.blur();});

  $('div.pic').click(function() {
    if ($(this).hasClass("pic-small")) {
      var id = this.id.substr(4);
      $(this).removeClass("pic-small");
      $(this).addClass("pic-big");
    } else {
      var id = this.id.substr(4);
      $(this).removeClass("pic-big");
      $(this).addClass("pic-small");
    }
  });
  $('.desc').css("text-decoration", 'underline');

  $('div.pic').mouseover(function() {
    var desc = $(this).children('div.desc');
    desc.css("color", '#000');
  });
  
  $('div.pic').mouseout(function() {
    if ($(this).hasClass("pic-small")) {
      var desc = $(this).children('div.desc');
      desc.css("color", '#555');
    }
  });
  
  // Erstes Bild gross
  $('div.pic:first').removeClass("pic-small");
  $('div.pic:first').addClass("pic-big");
  
  
  
  
  setInterval('viewport()', 100);
}


function viewport(){
  var viewportwidth;
  var viewportheight;
  var viewportratio;
  var picwidth = 1600;
  var picheight = 900;
  var picratio = picwidth / picheight;

  // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
  if (typeof window.innerWidth != 'undefined') {
    viewportwidth = window.innerWidth,
    viewportheight = window.innerHeight
  }

  // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
  else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) {
    viewportwidth = document.documentElement.clientWidth,
    viewportheight = document.documentElement.clientHeight
  }

  // older versions of IE
  else {
    viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    viewportheight = document.getElementsByTagName('body')[0].clientHeight
  }
  
  viewportratio = viewportwidth / viewportheight;
  
  if (picratio < viewportratio) {
    $('div#page').css('height', viewportheight + 'px');
    $('div#page img').css('height', 'auto');
    $('div#page img').css('width', viewportwidth + 'px');
  };
  
  if (picratio > viewportratio) {
    $('div#page').css('height', viewportheight + 'px');
    $('div#page img').css('height', viewportheight + 'px');
    $('div#page img').css('width', 'auto');
  };
}
