jQuery(document).ready(function(){
    
    var_lk_src = 'images/black_shadow.png';
    var_pr_src = 'images/blue_shadow.png';
    var_pr_red_src = 'images/red_shadow.png';
    var_about_src = 'images/blue_shadow.png';
    var_about_red_src = 'images/red_shadow.png';
    var_contact_src = 'images/blue_shadow.png';
    var_contact_red_src = 'images/red_shadow.png';
    var_helpful_src = 'images/black_shadow.png';
    
    
    jQuery('#helpful').css('background','none');
    var helpful_paper = Raphael("helpful", jQuery('#helpful').width(), jQuery('#helpful').height());
    var helpful = helpful_paper.image(var_helpful_src,10,10,jQuery('#helpful').width()-20, jQuery('#helpful').height()-20);
    
    jQuery('#lk').css('background','none');
    var lk_paper = Raphael("lk", jQuery('#lk').width(), jQuery('#lk').height());
    var lk = lk_paper.image(var_lk_src,10,10,jQuery('#lk').width()-20, jQuery('#lk').height()-20);
    
    jQuery('#pr').css('background','none');
    var pr_paper = Raphael("pr", jQuery('#pr').width(), jQuery('#pr').height());
    var pr = pr_paper.image(var_pr_src,20,20,jQuery('#pr').width()-40, jQuery('#pr').height()-40);
    var pr_red = pr_paper.image(var_pr_red_src,20,20,jQuery('#pr').width()-40, jQuery('#pr').height()-40);
    //pr_red.scale(1.2, 1.2);
    pr_red.hide();
    
    jQuery('#about').css('background','none');
    var about_paper = Raphael("about", jQuery('#about').width(), jQuery('#about').height());
    var about = about_paper.image(var_about_src,20,20,jQuery('#about').width()-40, jQuery('#about').height()-40);
    var about_red = about_paper.image(var_about_red_src,20,20,jQuery('#about').width()-40, jQuery('#about').height()-40);
    about_red.hide(); 
    
    
    jQuery('#contact').css('background','none');
    var contact_paper = Raphael("contact", jQuery('#contact').width(), jQuery('#contact').height());
    var contact = contact_paper.image(var_about_src,20,20,jQuery('#contact').width()-40, jQuery('#contact').height()-40);
    var contact_red = contact_paper.image(var_contact_red_src,20,20,jQuery('#contact').width()-40, jQuery('#contact').height()-40);
    contact_red.hide(); 
    
    
    
    speed = 300;
    
    jQuery('a#for_helpful').hover(function(){
            helpful.animate({
                    scale:'1.2, 1.2'
                    }, speed, "backOut"); 
        },function(){
            helpful.animate({
                    scale:'1, 1'
                    }, speed, "backOut"); 
            });
    
    jQuery('a#pr_office').hover(function(){
            lk.animate({
                    scale:'1.2, 1.2'
                    }, speed, "backOut"); 
        },function(){
            lk.animate({
                    scale:'1, 1'
                    }, speed, "backOut"); 
            });
    
    jQuery('#for_pr').hover(function(){
            jQuery(this).children('span').animate({
                'paddingTop': 20
                },speed-100 );
            pr.hide();
            pr_red.show();
            pr_red.animate({
                    scale:'1.2, 1.2'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
        },function(){
            jQuery(this).children('span').animate({
                'paddingTop': 0
                },speed-100);
            pr.scale(1.2, 1.2);
            pr_red.hide();
            pr_red.scale(1, 1);
            pr.show();
            pr.animate({
                    scale:'1, 1'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
            });
    
    jQuery('#for_about').hover(function(){
            jQuery(this).children('span').animate({
                'paddingTop': 20
                },speed-100);
            
            about.hide();
            about_red.show();
            about_red.animate({
                    scale:'1.2, 1.2'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
            
        },function(){
            jQuery(this).children('span').animate({
                'paddingTop': 0
                },speed-100);
            about.scale(1.2, 1.2);
            about_red.hide();
            about_red.scale(1, 1);
            about.show();
            about.animate({
                    scale:'1, 1'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
            });
    
    jQuery('#for_contact').hover(function(){
            jQuery(this).children('span').animate({
                'paddingTop': 20
                },speed-100);
            contact.hide();
            contact_red.show();
            contact_red.animate({
                    scale:'1.2, 1.2'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
        },function(){
            
            jQuery(this).children('span').animate({
                'paddingTop': 0
                }, speed-100);
            
            contact.scale(1.2, 1.2);
            contact_red.hide();
            contact_red.scale(1, 1);
            contact.show();
            contact.animate({
                    scale:'1, 1'/*,*/
                    //opacity: 0.0
                    }, speed, "backOut");
            });
    
    
    var text_animate = function(){
        jQuery('#text span').each(function(){
            //anim_speed = 3000;
            //alert(speed);
            opacity = (Math.random()*1) + 0.1;
            right = Math.random()*50;
            if (!$.browser.msie){
                jQuery(this).stop().animate({
                    'opacity': opacity,
                    'right': right
                    },3000);
            }else{
                if ($.browser.version!=9)
                {
                jQuery(this).stop().animate({
                    //'opacity': opacity,
                    'right': right
                    },3000);
                }
            }
            });
    }
        jQuery('#text span').each(function(){
            //anim_speed = 3000;
            //alert(speed);
            opacity = (Math.random()*1) + 0.1;
            right = Math.random()*50;
            if (!$.browser.msie){
                jQuery(this).stop().animate({
                    'opacity': opacity,
                    'right': right
                    },3000);
            }else{
                if ($.browser.version!=9)
                {
                jQuery(this).stop().animate({
                    //'opacity': opacity,
                    'right': right
                    },3000);
                }
            }

            });
    setInterval(text_animate, 3000);
    
    
    
    
    });