$(document).ready(function(){


$('#serveButton div, #prayerButton div, #giveButton div').css( {opacity: 0} )

function aboutButton() {
$('#aboutButton', this).stop().animate({height: '80px', top: '0px'},{queue:false,duration:150})
$('#aboutButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#aboutButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#aboutButton h1', this).stop().animate({color: '#72afe3'},{queue:false,duration:150})
}

function serveButton() {
$('#serveButton', this).stop().animate({height: '80px', top: '151px'},{queue:false,duration:150})
$('#serveButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#serveButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#serveButton h1', this).stop().animate({color: '#e89a2a'},{queue:false,duration:150})
}

function serveButton2() {
$('#serveButton', this).stop().animate({height: '80px', top: '80px'},{queue:false,duration:150})
$('#serveButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#serveButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#serveButton h1', this).stop().animate({color: '#e89a2a'},{queue:false,duration:150})
}

function prayerButton() {
$('#prayerButton', this).stop().animate({height: '80px', top: '231px'},{queue:false,duration:150})
$('#prayerButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#prayerButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#prayerButton h1', this).stop().animate({color: '#4b9679'},{queue:false,duration:150})
}

function prayerButton2() {
$('#prayerButton', this).stop().animate({height: '80px', top: '161px'},{queue:false,duration:150})
$('#prayerButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#prayerButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#prayerButton h1', this).stop().animate({color: '#4b9679'},{queue:false,duration:150})
}

function giveButton() {
$('#giveButton', this).stop().animate({height: '80px', top: '312px'},{queue:false,duration:150})
$('#giveButton div', this).stop().animate({opacity: 0},{queue:false,duration:150})
$('#giveButton p', this).stop().animate({fontSize: '12px', color: '#333333', lineHeight: '15px', width: '190px'},{queue:false,duration:150})
$('#giveButton h1', this).stop().animate({color: '#f54545'},{queue:false,duration:150})
}


$('#aboutButton').hover(function(){
$(this).stop().animate({height: '151px', top: '0'},{queue:false,duration:150})
$('div', this).stop().animate({opacity: 1},{queue:false,duration:150})
$('p',this).stop().animate({fontSize: '15px', lineHeight: '18px', width: '100px', color: '#FFFFFF'},{queue:false,duration:150})
$('h1',this).stop().animate({color: '#FFFFFF'},{duration:150})
$(serveButton)
$(prayerButton)
$(giveButton)
})

$('#serveButton').hover(function(){
$(this).stop().animate({height: '151px', top: '80'},{queue:false,duration:150})
$('div', this).stop().animate({opacity: 1},{queue:false,duration:150})
$('p',this).stop().animate({fontSize: '15px', lineHeight: '18px', width: '100px', color: '#FFFFFF'},{queue:false,duration:150})
$('h1',this).stop().animate({color: '#FFFFFF'},{duration:150})
$(aboutButton)
$(prayerButton)
$(giveButton)
})

$('#prayerButton').hover(function(){
$(this).stop().animate({height: '151px', top: '161px'},{queue:false,duration:150})
$('div', this).stop().animate({opacity: 1},{queue:false,duration:150})
$('p',this).stop().animate({fontSize: '15px', lineHeight: '18px', width: '100px', color: '#FFFFFF'},{queue:false,duration:150})
$('h1',this).stop().animate({color: '#FFFFFF'},{duration:150})
$(aboutButton)
$(serveButton2)
$(giveButton)
})

$('#giveButton').hover(function(){
$(this).stop().animate({height: '151px', top: '242px'},{queue:false,duration:150})
$('div', this).stop().animate({opacity: 1},{queue:false,duration:150})
$('p',this).stop().animate({fontSize: '15px', lineHeight: '18px', width: '90px', color: '#FFFFFF'},{queue:false,duration:150})
$('h1',this).stop().animate({color: '#FFFFFF'},{duration:150})
$(aboutButton)
$(serveButton2)
$(prayerButton2)
})

});