Text Fields

<form class="form">
	<fieldset>
		<legend>Text fields</legend>
		<ol>
			<li>
				<label for="text-field">Text Field 100%</label>
				<input type="text" id="text-field" placeholder="Text field 100%"/>
			</li>
			<li>
				<label for="url-field">URL Field</label>
				<input type="url" id="url-field" />
			</li>
			<li>
				<label for="email-field">Email Field</label>
				<input type="email" id="email-field" placeholder="email" />
			</li>
			<li>
				<label for="Password-field">Password Field</label>
				<input type="password" id="Password-field" />
			</li>
			<li>
				<label for="color-field">Color Field</label>
				<input type="color" id="color-field" />
			</li>
			<li>
				<label for="text-area">Textarea</label>
				<textarea id="text-area"></textarea>
			</li>
		</ol>
	</fieldset>
	<fieldset>
		<legend>Details</legend>
		<details open>
			<summary>Details opened. <em>Click arrow to close it</em></summary>
			<p>This is details text.</p>
			<p>This is details text.</p>
			<p>This is details text.</p>
		</details>
		<details>
			<summary>Details closed. <em>Click arrow to open it</em></summary>
			<p class="h3">HELLO! YOU HAVE OPENED DETAILS!</p>
		</details>
	</fieldset>
</form>