<div class="b-admin-branding">
	<div class="form-horizontal">
		<div class="legend">
			Branding
		</div>
		<div class="control-group">
			<label class="control-label">
				Page Title
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: title,
						trigger: title.trigger,
						size: 5
					}
				}"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">
				Loading Description
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: loadingDesc,
						trigger: loadingDesc.trigger,
						size: 5
					}
				}"></div>
			</div>
		</div>
	</div>
	<br />
	<div class="form-horizontal" data-bind="css: {'disabled-form': !capa()}">
		<div class="legend">
			Login
		</div>
		<div class="control-group">
			<label class="control-label">
				Logo
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: loginLogo,
						trigger: loginLogo.trigger,
						placeholder: 'https://',
						size: 5,
						enable: capa
					}
				}"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">
				Description
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: loginDescription,
						trigger: loginDescription.trigger,
						size: 5,
						enable: capa
					}
				}"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">
				Background
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: loginBackground,
						trigger: loginBackground.trigger,
						placeholder: 'https://',
						size: 5,
						enable: capa
					}
				}"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">
				Custom CSS
			</label>
			<div class="controls">
				<div class="custom-css-wrapper" data-bind="component: {
					name: 'TextArea',
					params: {
						value: loginCss,
						trigger: loginCss.trigger,
						width: 495,
						enable: capa,
						rows: 7
					}
				}"></div>
			</div>
		</div>
		<div class="control-group">
			<div class="controls">
				<div data-bind="component: {
					name: 'Checkbox',
					params: {
						enable: capa,
						label: 'Show &quot;Powered by RainLoop&quot; link',
						value: loginPowered
					}
				}"></div>
			</div>
		</div>
		<div class="legend">
			User
		</div>
<!--
		<div class="control-group">
			<label class="control-label">
				Logo
			</label>
			<div class="controls">
				<div data-bind="component: {
					name: 'Input',
					params: {
						value: userLogo,
						trigger: userLogo.trigger,
						placeholder: 'https://',
						size: 5,
						enable: capa
					}
				}"></div>
			</div>
		</div>
-->
		<div class="control-group">
			<label class="control-label">
				Custom CSS
			</label>
			<div class="controls">
				<div class="custom-css-wrapper" data-bind="component: {
					name: 'TextArea',
					params: {
						value: userCss,
						trigger: userCss.trigger,
						width: 495,
						enable: capa,
						rows: 7
					}
				}"></div>
			</div>
		</div>
		<div class="row" data-bind="visible: !capa()">
			<div class="alert span8" style="margin-top: 10px;">
				This functionality is available for <strong><a href="#/licensing">Premium</a></strong> subscribers.
			</div>
		</div>
	</div>
</div>