<div id="main" class="securityconfig-main">
  <div class="palm-page-header">
    <div class="header-icon screenlock"></div>
    <div class="header-text">
		  <span>Bloqueo de pantalla</span>
    </div>
  </div>

	<div class="palm-group">
		<div class="palm-group-title">
			<span>Pantalla</span>
		</div>
		<div class="palm-list">

			<div class="palm-row first">
				<div class="palm-row-wrapper">
					<div class="title">Brillo</div>
					<div x-mojo-element="Slider" id='brightness' class="palm-slider"></div>
				</div>
			</div>

			<div id='screentimerrow' class="palm-row last">
				<div id='timeroptions' class="palm-row-wrapper">
					<div id="screenOffTimer" x-mojo-element="ListSelector" class="right"></div>
				</div>
			</div>
		</div>
	 </div>
	 <div class="palm-group">
		<div class="palm-group-title">
			<span>Imagen de fondo</span>
		</div>
		<div class="palm-list">				
			<div class="palm-row single" x-mojo-tap-highlight="momentary">
				<div class="palm-row-wrapper">
				<div id="setwallpaper-spinner" x-mojo-element="Spinner" class="spinner"></div>
				<div id='setwallpaper' class="title capitalize">Cambiar imagen de fondo</div>
				</div>
			</div>
		</div>
	 </div>

	 <div class="palm-group">
		<div class="palm-group-title">
			<span>Gestos avanzados</span>
		</div>
		<div class="palm-list">
			<div class="palm-row single">
				<div class="palm-row-wrapper">
					<div x-mojo-element="ToggleButton" id="switchApps"></div>
					<div class="title capitalize">Cambiar aplicaciones</div>
				</div>
			</div>
		</div>
	</div>
	<div class="palm-info-text" id="switchAppsInfo"></div>

	<div class="palm-group">
		<div class="palm-group-title">
			<span>Desbloqueo seguro</span>
		</div>
		<div class="palm-list">
			<div id='secureFirstrow' class="palm-row">
				<div class="palm-row-wrapper" x-mojo-focus-highlight="true">
					<div class="">
						<img id='lockImg' src="images/lock.png" style='display:none;' class='label label-lock-image'></img>    
						<div id="secureUnlock" x-mojo-element="ListSelector"></div>
					 </div>
			    </div>
			</div>
			<div id='securelastrow' class="palm-row" x-mojo-tap-highlight="momentary">
				<div class="palm-row-wrapper textfield-group">
					<div class="title">
						<div id="changepassword"></div>
					 </div>
			    </div>
			</div>
			<div id='locktimerrow' class="palm-row last">
				<div id='lockoptions' class="palm-row-wrapper">
					<div id="lockTimer" x-mojo-element="ListSelector" class="right"></div>
				</div>
			</div>
		</div>
	</div>

	<div class="palm-group">
		<div class="palm-group-title">
			<span>Avisos</span>
		</div>
		<div class="palm-list">
			<div class="palm-row first">
				<div class="palm-row-wrapper">
					<div x-mojo-element="ToggleButton" id="showAlerts"></div>
					<div class="title capitalize">Mostrar cuando está bloqueado</div>
				</div>
			</div>
			<div class="palm-row last">
				<div class="palm-row-wrapper">
					<div x-mojo-element="ToggleButton" id="blinkAlerts"></div>
					<div class="title capitalize">Notificaciones con iluminación intermitente</div>
				</div>
			</div>
		</div>
	</div>

	<div class="palm-info-text single">
		El área de gestos se ilumina intermitentemente cuando llegan nuevas notificaciones.
	</div>

</div>
