$(document).ready(function(){

$("#login_password").val("");
$("#login_password").css("background","#FFFFFF url(http://www.roofmagazine.org.uk/images/roof/password_bg.gif) 1px 1px no-repeat");

	// Hover effect on search button
	 
	$("#main_search_button").hover(
      function () {
      		$(this).css("cursor","pointer");
      		$(this).css("background","#444444 url(http://www.roofmagazine.org.uk/images/roof/searchbg.gif) left -37px no-repeat");
       }, 
      function () {
      		$(this).css("cursor","default");
      		$(this).css("background","#444444 url(http://www.roofmagazine.org.uk/images/roof/searchbg.gif) left -72px no-repeat");
       }
    );

	// Hover effect on search again button
	 
	$("#search_again_button").hover(
      function () {
      		$(this).css("cursor","pointer");
      		$("#search_again_button span").css("text-decoration","underline");
      		$(this).css("background","#444444 url(http://www.roofmagazine.org.uk/images/roof/searchagainbg.gif) left -37px no-repeat");
       }, 
      function () {
      		$(this).css("cursor","default");
      		$("#search_again_button span").css("text-decoration","none");
      		$(this).css("background","#444444 url(http://www.roofmagazine.org.uk/images/roof/searchagainbg.gif) left -72px no-repeat");
       }
    );

	// Remove the default text from the search box when you click on it
	
	$("#main_searchfield").focus( function () { 
		$(this).css("background-color","#f2f3cc");
		$(this).css("color","black");
		if ($(this).attr("value") == "Search this site") {
			$(this).attr("value","");
		}
	} );

	$("#search_again").focus( function () { 
		$(this).css("background-color","#f2f3cc");
		$(this).css("color","black");
		if ($(this).attr("value") == "Search this site") {
			$(this).attr("value","");
		}
	} );
	
	
	// If the search field is empty when it loses focus, replace the default text
	
	$("#main_searchfield").blur( function () {
		$(this).css("background-color","#FFFFFF");
		var searchFieldString = jQuery.trim($(this).attr("value"));
		if (!searchFieldString) {
			$(this).attr("value","Search this site");
			$(this).css("color","#999999");
		}
	} );

	$("#search_again").blur( function () {
		$(this).css("background-color","#FFFFFF");
		var searchFieldString = jQuery.trim($(this).attr("value"));
		if (!searchFieldString) {
			$(this).attr("value","Search this site");
			$(this).css("color","#999999");
		}
	} );

	$("input.text_field").focus(function () {
         $(this).css("background-color", "#f2f3cc");
    });

	$("input.text_field").blur(function () {
         $(this).css("background-color", "#f1f1f1");
    });

	$("textarea.text_area").focus(function () {
         $(this).css("background-color", "#f2f3cc");
    });

	$("textarea.text_area").blur(function () {
         $(this).css("background-color", "#f1f1f1");
    });

// Login box scripts

$("#login_user_name").focus( function () { 
		$(this).css("background-color","#f2f3cc");
		$(this).css("color","black");
		if ($(this).attr("value") == "ROOF reference") {
			$(this).attr("value","");
		}
	} );
	
	
$("#login_user_name").blur( function () {
		$(this).css("background-color","#FFFFFF");
		var searchFieldString = jQuery.trim($(this).attr("value"));
		if (!searchFieldString) {
			$(this).attr("value","ROOF reference");
			$(this).css("color","#999999");
		}
	} );

$("#login_password").focus( function () { 
$(this).css("background","#f2f3cc");
$(this).css("color","black");
});

$("#login_password").blur( function () {
if ($(this).val() == "") {
$(this).css("background","#FFFFFF url(http://www.roofmagazine.org.uk/images/roof/password_bg.gif) 1px 1px no-repeat");
} else {
$(this).css("background","#FFFFFF");
}

} );


$("#JobTitle_front").focus( function () { 
if ($(this).val() == "Search by keyword") {
$(this).val("");
}
$(this).css("background","#f2f3cc");
});

$("#JobTitle_front").blur( function () { 
if ($(this).val() == "") {
$(this).val("Search by keyword");
}
$(this).css("background","#F1F1F1");
});

$("#front_Area").focus( function () { 
$(this).css("background","#f2f3cc");
});

$("#front_Area").blur( function () { 
$(this).css("background","#F1F1F1");
});

});