{{if .Pjax}}
    {{template "header.html" .}}
    <meta property="og:description" content="sign up BITCH">
{{else}}
    <title>{{.Title}}</title>
{{end}}
<div id="main-body" class="guest">
	<div class="main-column center">
		<div class="post-list-outline login-page">
			<form method="post">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{.CurrentUser.CSRFToken}}">
				<img src="/assets/img/menu-logo.png">
				<p class="lh">sign up BITCH</p>
				<p>creating an sop.epic account lets you interact with everybody else with an account!</p><br>
				<p><img src="/assets/img/bocchi.gif" width="320" height="240"><br>
					<a href="/help/rules">please read the TOS thanks</a></p>
				<h3 class="label"><label><span class="red">*</span> User ID: <input type="text" class="auth-input" name="username" maxlength="32" minlength="4" placeholder="ID"></label></h3>
				<h3 class="label"><label><span class="red">*</span> Nickname: <input type="text" class="auth-input" name="nickname" maxlength="32" placeholder="Nickname"></label></h3>
				<label class="file-button-container">
					<span class="input-label"  style="color:black;">Avatar Image <span>PNG, JPEG and GIF are allowed.</span></span>
					<span class="button file-upload-button for-avatar">Upload</span>
					<input accept="image/*" type="file" class="file-button none">
					<input type="hidden" name="image">
					<div class="screenshot-container still-image preview-container">
						<img class="preview-image">
					</div>
					<script src="/assets/js/upload.js"></script>
				</label>
				<h3 class="label"><label>Email address: <input type="email" class="auth-input" name="email" maxlength="255" placeholder="Email (optional)"></label></h3>
				<h3 class="label"><label><span class="red">*</span> Password: <input type="password" class="auth-input" name="password" maxlength="32" placeholder="Password"></label></h3>
				<h3 class="label"><label><span class="red">*</span> Confirm Password: <input type="password" class="auth-input" name="confirm" maxlength="32" placeholder="Confirm Password"></label></h3>
				{{if .ReCAPTCHA.Enabled}}
					<script src="https://www.google.com/recaptcha/api.js"></script>
					<div class="g-recaptcha" style="display:inline-block" data-sitekey="{{.ReCAPTCHA.SiteKey}}"></div>
				{{end}}
				<p class="red" style="margin-bottom:6px"></p>
				<button type="submit" class="button">Create account</button>
				<div class="ll">
					<p>All fields with a red asterisk (<span class="red">*</span>) are required.</p>
					<p>You can change all of these fields after you sign up; except for usernames, which can only be changed by admins.</p>
					<p>If no email address is associated with your account, you won't be able to reset your password.</p>
				</div>
			</form>
		</div>
	</div>
</div>
{{if .Pjax}}
     {{template "footer.html"}}
{{end}}