$(function() {
  //if a small photo is clicked then make it bigger, and make the large photo smaller
  //if the large photo is clicked then make it smaller
  $('img[class*="photo-teaser"]').click(function() {
    var is_photo = $(this).hasClass('photo-teaser');
    
    remove_large_photo();
    if(is_photo){
      $(this).toggleClass('photo-teaser large_photo').css({"left": 200, "top": 0});
    }    
  });

  //helper function: if the large photo exists, make it smaller and reset the position
  function remove_large_photo() {
    if ($('.large_photo').length) {
      var position = $('.large_photo').parent().position()
      $('.large_photo').toggleClass('large_photo photo-teaser').css({
        "left": position.left + margin_left, 
        "top": position.top + margin_top
      });
    }
  }
 
 
});