function gotoTopic(iTopic) {
    document.location='pTopic.php?type='+iTopic;
  }
  
  $(document).ready(function() {
    
    var iExpandedDivWidth = 0;
    var iAnimateDuration = 300;
    
    // init
    $('.div_portfolio_container').each(function() {
      $(this).css({height: $(this).height()+'px'});
      $(this).attr('def_width', $(this).width()+'px');
      $(this).children('.div_portfolio_head, .div_portfolio_text').css({width: $(this).width()+'px'});
    });
    $('.div_portfolio_container h2').each(function() {
      $(this).attr('def_title', $(this).html());
    });
    
    $('.td_portfolio').hover(function() {
      
      if(!$(this).children('.div_portfolio_container').hasClass('div_portfolio_container_active')) {
        
        // runnende animaties stoppen
        $('.div_portfolio_container').stop();
        
        // sla voor de eerste keer breedte op die de uitgevouwen div aanneemt kun je de volgende keer naar die breedte animeren
        if($('.div_portfolio_container_active').length >= 1 && iExpandedDivWidth == 0) {
          iExpandedDivWidth = $('.div_portfolio_container_active').width();
        }
        
        // alle actieve inactief maken
        $('.div_portfolio_container_active').each(function() {
          $('.div_portfolio_container_active').removeClass('div_portfolio_container_active');
          // inner divs vaste breedte weer instellen
          $(this).children('.div_portfolio_head, .div_portfolio_text').css({width: $(this).attr('def_width')});
          // h2 titel weer terugzetten
          resetTitle($(this).children('.div_portfolio_text').children('h2'));
          // img_over weghalen
          var oImg = $(this).children('.div_portfolio_head').children('img');
          $(oImg).attr('src', $(oImg).attr('src').replace('_o', ''));
        });
        
        // eentje actief maken en breedte resetten
        $(this).children('.div_portfolio_container').addClass('div_portfolio_container_active');
        // inner divs vaste breedte weghalen
        $('.div_portfolio_container_active').children('.div_portfolio_head, .div_portfolio_text').css({width: 'auto'});
        if(iExpandedDivWidth != 0) {
          $('.div_portfolio_container_active').animate({width: iExpandedDivWidth+'px'}, iAnimateDuration);
        }
        // titel unbreaken
        unbreakTitle($('.div_portfolio_container_active h2'));
        // img_over toevoegen
        var oImg = $('.div_portfolio_container_active').children('.div_portfolio_head').children('img');
        $(oImg).attr('src', $(oImg).attr('src').replace('.', '_o.'));
        
        // rest die nog niet versmald is versmallen
        $('.div_portfolio_container').not('.div_portfolio_container_active').each(function() {
          if($(this).css('width') != '70px') {
            $(this).animate({width: '70px'}, iAnimateDuration);
          }
        });
        
      }
      
    });
    
    function unbreakTitle(poTitle) {
      
      var sTitle = poTitle.html();
      var aTitle = sTitle.split('-');
      var sTitleNew = '';
      for(var i = 0; i < aTitle.length; i ++) {
        sTitleNew += $.trim(aTitle[i]);
      }
      
      sTitleNew = sTitleNew.replace('<br />', '');
      sTitleNew = sTitleNew.replace('<br>', '');
      sTitleNew = sTitleNew.replace('<br >', '');
      sTitleNew = sTitleNew.replace('<BR />', '');
      sTitleNew = sTitleNew.replace('<BR>', '');
      sTitleNew = sTitleNew.replace('<BR >', '');
      
      $(poTitle).html(sTitleNew);
      
    }
    
    function resetTitle(poTitle) {
      $(poTitle).html($(poTitle).attr('def_title'));
    }
    
  });