// The following JS functions are needed for displaying the Google Map AND adding rounded corners to images (in boxes to the right)! 
// Therefore jQuery is used for some clientside design solutions, please read the comments below.
jQuery( document ).ready( function() {
    // Turns all the images found in DIVs classified as ".boxImage" into backgrounds (of their parent tag) 
    // and rounds their bottom left and bottom right corner by 6 pixels.
    // Because rounded corners can only be set by the use of the css property 'background' or 'background-image' 
    // the following jQuery code converts image tags (which are usually generated by CMS') to background images of their parent tag.
    var tCornerStyle = { tl: { radius: 0 }, tr: { radius: 0 }, bl: { radius: 6 }, br: { radius: 6 }, antiAlias: true };

    jQuery('.boxImage img').load( function(){
	jQuery(this).each( function() {
            var tLink = jQuery( this ).parents('a:eq(0)');
            var tDiv = jQuery( this ).parents('div:eq(0)');
            var tSrc = jQuery( this ).attr("src");
            var tCSS = "url('"+tSrc+"') no-repeat";
            var tHeight = jQuery( this ).height();
            tDiv.css("background",tCSS);
            tDiv.css("height", tHeight+"px");
            jQuery( this ).remove();
            if( tLink ){
                    tLink.appendTo( tDiv );
                    tLink.css("height",tHeight+"px");
                    tLink.css("width","100%");
                    tLink.css("display","block");
            }
            if( tCornerStyle ){
                    tDiv.corner( tCornerStyle );            
            }
		});	
    });
});