$( function() {

  var currentStep = 1;

  var animating = false;

  var lastStep = $('.step_three').length == 0 ? 2 : 3;
  
  $( '.NxtStep' ).click( function( evt ) {
    var email = $('#email').val();
    if(! validateEmail(email)){
        document.getElementById('email_error').innerHTML= "Enter a valid email address";
        return false;
    }
    document.getElementById('email_error').innerHTML= "";
    forward();

  });

    function validateEmail(email){
        var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
        return emailPattern.test(email);
    }

  var curr_step = 'step_one';

  getSteps();

  styleSteps( false );

  

  var resizing = false;

  var resizeTimer = null;



  function forward() {

    if ( !animating ) {

      animating = true;

      currentStep++;

      styleSteps( 1000 );



    }

  }



  function getSteps() {

    var old_step = ( currentStep == 3 ) ? 'step_one' : null;

    var curr_step = ( currentStep == 1 ) ? 'step_one' : ( currentStep == 2 ) ? 'step_two' : 'step_three';

    var prev_step = ( currentStep == 2 ) ? 'step_one' : ( currentStep == 3 ) ? 'step_two' : null;

    var next_step = ( currentStep == 1 ) ? 'step_two' : ( currentStep == 2 ) ? 'step_three' : null;

    var super_step = ( currentStep == 1 ) ? 'step_three' : null;

    return { old: old_step, curr: curr_step, prev: prev_step, next: next_step, superStep: super_step };

  }



 

  

  function styleSteps( animSpeed ) {

    pos = calculatePositions();

    steps = getSteps();

    

    if ( !animSpeed ) {

      $( '.' + steps.old ).css( { left: pos.offLeft + 'px', opacity: 0.3 });

      $( '.' + steps.prev ).css( { left: pos.left + 'px', opacity: 0.3 });

      $( '.' + steps.curr ).css( { left: pos.center + 'px', opacity: 1 });

      $( '.' + steps.next  ).css( { left: pos.right + 'px', opacity: 0.3 });

      $( '.' + steps.superStep  ).css( { left: pos.offRight + 'px', opacity: 0.3 });

      clearAnimateFlag();

    } else {

      $( '.' + steps.old ).animate( { left: pos.offLeft + 'px', opacity: 0.3 }, animSpeed );

      $( '.' + steps.prev ).animate( { left: pos.left + 'px', opacity: 0.3 }, animSpeed );

      $( '.' + steps.curr ).animate( { left: pos.center + 'px', opacity: 1 }, { duration: animSpeed, complete: clearAnimateFlag } );

      $( '.' + steps.next  ).animate( { left: pos.right + 'px', opacity: 0.3 }, animSpeed );

      $( '.' + steps.superStep  ).animate( { left: pos.offRight + 'px', opacity: 0.3 }, animSpeed );

    }

  }

  

  function clearAnimateFlag() {

    animating = false;

  }

  

  function calculatePositions() {

    var offset = 20;

    var step_width = $( '.firstBox' ).width() / 1;

    var window_width = $( window ).width();

    

    var offLeft = -3 * step_width;

    var leftPos = offset - step_width;

    var centerPos = window_width / 2;

    var rightPos = window_width - offset + step_width;

    var offRight = rightPos + ( 3 * step_width );

    return { offLeft: offLeft, left: leftPos, center: centerPos, right: rightPos, offRight: offRight };

  }

});

function validate_box2(){
var mobile = document.getElementById('mobile_no').value;
if(mobile.toString().search(/^[0-9 ]+$/) == 0) {
            if(mobile.length == 10) {
                return true;
            }
            else if((mobile.length == 11) && (mobile.substr(0,1) == '0')) {
                return true;
            }
            else if((mobile.length == 12) && (mobile.substr(0,2) == '91')) {
                return true;
            }
            else {
                document.getElementById('mobile_error').innerHTML= "Enter a valid Mobile Number";
                return false;
            }
        }
        else {
            document.getElementById('mobile_error').innerHTML= "Enter a valid Mobile Number";
            return false;
        }

}