$(document).ready(function(){

        //This is the input styles for focus and blur
        $('input,textarea').focus(function(){
                $(this).css({backgroundColor:"#ffebcc"});
        });
    $('input, textarea').blur(function(){
                $(this).css({backgroundColor:"#FFFFFF"});
        });
        
        

        $(".button").click(function() {
                
                
                //Begin Required Check
                var name = $("input#name1.req").val();
                if(name == ""){
                        $("input#name1").focus();
                        return false;   
                }else{
                        var name = $("input#name1").val();
                }
                
                var email = $("input#email1.req").val();
                if(email == ""){
                        $("input#email1").focus();
                        return false;
                }else{
                        var email = $("input#email1").val();
                }
                
                var phone = $("input#phone1.req").val();
                if(phone == ""){
                        $("input#phone1").focus();
                        return false;
                }else{
                        var phone = $("input#phone1").val();
                }
                
                var mobile = $("input#mobile1.req").val();
                if(mobile == ""){
                        $("input#mobile1").focus();
                        return false;
                }else{
                        var mobile = $("input#mobile1").val();
                }
                
                var comments = $("textarea#comments1.req").val();
                if(comments == ""){
                        $("textarea#comments1").focus();
                        return false;
                }else{
                        var comments = $("textarea#comments1").val();
                }
                //End Required Check


                //Data for response 
                var dataString = 'name=' + name + 
                                                 '&email=' + email + 
                                                 '&phone=' + phone + 
                                                 '&mobile=' + mobile;
                                                 
                
                //Begin Ajax call
                $.ajax({
                        type: "POST",
                        url: "mail.php",
                        data: dataString,
                        success: function() {
                                $('#form1').html("<div id='message'></div>");
                        $('#message').html("<h1>Thank You!</h1>")
                        .append("<p>Someone will be in contact with you soon, "+ name +"!</p><br /><h1>01202 835600</h1>")
                        .hide()
                        .fadeIn(1500);
                        },
                        error: function() {
                                $('#form1').html("<div id='message'></div>");
                        $('#message').html("<h2 style='color:red;'>Error!</h2>")
                        .append("<p>Something went wrong, please refresh the page.</p>")
                        .hide()
                        .fadeIn(1500);
                        }
                });//ajax call
                return false;  
        
                
        });//button click
        
});//EoD

