$(document).ready(function(){

    // Get dimensions of images
    $('.box').each(function() {

        var $thisWidth = $(this).find('.photo').attr('width');
        var $thisHeight = $(this).find('.photo').attr('height');

        $(this).css({'width': $thisWidth, 'height': $thisHeight});

    });


    // to make the caption slide
     $('.box').hover(function(){

         $(this).find('.cover').stop().animate({top:'65%'},{queue:false,duration:260});
         }, function() {
         $(this).find('.cover').stop().animate({top:'100%'},{queue:false,duration:260});

     });


    // change the size of the font accordingly
    $('.caption').each(function() {

        var $gridWidth = $(this).parent('.box').css('width');
        $gridWidth = parseInt($gridWidth);

        var $idealSize = $gridWidth / 30;

        if ($idealSize < 10) {$idealSize = 11;}

        $idealSize = Math.round($idealSize) + 'px';

        $(this).find('p').css('font-size', $idealSize);

    });

});