<link rel="stylesheet" href="/css/app/home.css">
<link rel="stylesheet" href="/css/app/mobile_small.css">
<link rel="stylesheet" href="/css/app/login.css">
<div class="row-fluid">
	<div class="span12">
		<center>
		<h2 class="head-b-i">Login to Bid4Cars</h2>
		<p id="loginTerms">By clicking login I agree to the <a href="/documents/Registration_Terms_and_Conditions.pdf" target="_blank">Terms & Conditions</a></p>
		</center>
		<div id="theNotLoginBox" class="box-login hide">
			<div class="box-login-header">
				Browser Version Incompatibility
			</div>
			<div class="box-login-body">
	  			<p>
	  				This site will not work as intended on this version of Internet Explorer.
	  				Please download IE 9 from
	  				<a target="_blank" href="http://www.microsoft.com/southafrica/ie9/">http://www.microsoft.com/southafrica/ie9/</a>
	  			</p>
	  			<br/><br/>
			</div>
		</div>
		<div id="theLoginBox" class="box-login">
			<div class="box-login-header">
				User Login
			</div>
			<div class="box-login-body">
				<form id="frmLogin" class="form form-modal">
				<input class="field" id="postUrl" type="hidden" value="">
				<input class="field" id="postID" type="hidden" value="">
					<br/>
					<div class="control-group left-padding stack">
						<div class="input-prepend login-input">
							<span class="add-on"><i class="icon-user icon-white"></i></span><input class="field"
							id="email" name="email" type="text" placeholder="email"
							value="">
						</div>
						<div id="visiblePin" class="input-prepend">
							<span class="add-on"><i class="icon-asterisk icon-white"></i></span><input class="field"
							id="pin" name="pin" type="text" placeholder="pin">
						</div>
						<div id="maskedPin" class="input-prepend hide">
							<span class="add-on"><i class="icon-asterisk icon-white"></i></span><input class="field"
							id="mpin" name="mpin" type="password" placeholder="pin">
						</div>
					</div>
					<span id="login-fail" class="pull-right"
						data-content=""></span>
					<br/>
					<span>
						<div class="pull-right">
							<a href="/#/forgot" class="btn-forget white">Forgot details?</a>
						</div>
						<div class="control-group left-padding">
							<div id="togglePassword" class="make-switch switch-small" data-on="dark" data-off="success"
								 data-on-label="ABC" data-off-label="****">
							    <input id="togglePasswordCheck" type="checkbox" class="no-mod" checked>
							</div>
						</div>
						<br/>
					</span>

					<div class="control-group left-padding">
						<label class="checkbox" for="rememberMe">
							<input type="checkbox" id="rememberMe" name="rememberMe" checked>
							<div>Remember me on this computer</div>
						</label>
					</div>
					<br/>
					<button type="submit" class="btn btn-width" id="btnLogin">Login</button>
					<br/>&nbsp;
				</form>
			</div>
		</div>
	</div>
</div>
<input class="field" id="postUrl" name="postUrl" type="hidden" value="">
<input class="field" id="postID" name="postID" type="hidden" value="">

<div class="footerSec navbar-fixed-bottom"><!--footerSec-->
    <div class="footer">
    <ul class="fmenu">
            <li><a href="/" title="">Home</a></li>
            <!--<li><a href="/#/about_us" title="">ABOUT US</a></li>-->
            <li><a href="/documents/Terms_and_Conditions.pdf" title="" target="_blank">Terms &amp; Conditions</a></li>
                                    <li><a href="/documents/Legal_Notice.pdf" title="" target="_blank">Legal Notice</a></li>
                                    <li><a href="/documents/Privacy_Policy.pdf" title="" target="_blank">Privacy Policy</a></li>
            <!--<li><a href="/#/faq" title="">FAQ</a></li>-->
            <li><a href="/#/contact_us" title="">CONTACT US</a></li>
            <br/>
            <p><font size=3 color="#ffffff">Contact Bid4Cars at william@bid4cars.com.na</font></p>
    </ul>
    <div class="footer_rgt">
            <ul>
               <!-- 	<li><img src="/imgs/logo-imperial.png" alt="" /></li> 
				<li><a href="/#" title=""><img src="/images/flag01.png" alt="" /></a></li> -->
				<li><a href="/#" title=""><img src="/images/flag02.png" alt="" /></a></li>
            </ul>
            <div class="sig"><a href="/#/register" title="">Sign up</a></div>
    </div>
    </div>
</div><!--/footerSec-->

<script>
	// Limit scope pollution from any deprecated API
	(function() {

	var matched, browser;

	// Use of jQuery.browser is frowned upon.
	// More details: http://api.jquery.com/jQuery.browser
	// jQuery.uaMatch maintained for back-compat
	jQuery.uaMatch = function( ua ) {
		ua = ua.toLowerCase();

		var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
			/(webkit)[ \/]([\w.]+)/.exec( ua ) ||
			/(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
			/(msie) ([\w.]+)/.exec( ua ) ||
			ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) ||
			[];

		return {
			browser: match[ 1 ] || "",
			version: match[ 2 ] || "0"
		};
	};

	matched = jQuery.uaMatch( navigator.userAgent );
	browser = {};

	if ( matched.browser ) {
		browser[ matched.browser ] = true;
		browser.version = matched.version;
	}

	// Chrome is Webkit, but Webkit is also Safari.
	if ( browser.chrome ) {
		browser.webkit = true;
	} else if ( browser.webkit ) {
		browser.safari = true;
	}

	//jQuery.browser = browser;

	jQuery.sub = function() {
		function jQuerySub( selector, context ) {
			return new jQuerySub.fn.init( selector, context );
		}
		jQuery.extend( true, jQuerySub, this );
		jQuerySub.superclass = this;
		jQuerySub.fn = jQuerySub.prototype = this();
		jQuerySub.fn.constructor = jQuerySub;
		jQuerySub.sub = this.sub;
		jQuerySub.fn.init = function init( selector, context ) {
			if ( context && context instanceof jQuery && !(context instanceof jQuerySub) ) {
				context = jQuerySub( context );
			}

			return jQuery.fn.init.call( this, selector, context, rootjQuerySub );
		};
		jQuerySub.fn.init.prototype = jQuerySub.fn;
		var rootjQuerySub = jQuerySub(document);
		return jQuerySub;
	};

	})();
</script>


<script type="text/javascript">

function setCookie(c_name, value, exdays)
{
	var exdate = new Date();
	exdate.setDate(exdate.getDate() + exdays);
	var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
	document.cookie=c_name + "=" + c_value;
}

$(document).ready(function()
{
  $("#pin").change(function () {
    $("#mpin").val($("#pin").val());
  });
  $("#mpin").change(function () {
    $("#pin").val($("#mpin").val());
  });
	$('#togglePassword').bootstrapSwitch();
	$('#togglePassword').bootstrapSwitch('setSizeClass', 'switch-mini');
	$('#togglePassword').on('switch-change', function (e, data) {
		var $el = $(data.el),
        	value = data.value;
	    if (value)
	    {
	    	$("#visiblePin").show();
	        $("#maskedPin").hide();
	    }
	    else
	    {
	    	$("#visiblePin").hide();
	        $("#maskedPin").show();
	    }
	});
});



</script>