<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"></meta>
	<title>Apply?</title>
</head>
<body>
<form method="post">

	<table border="0">
		<tbody>
			<tr valign="middle" align="center">
				<td>
					<!-- C -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"></td>
								<td colspan="1" data-index="2"><input type="radio" /></td>
								<td colspan="1" data-index="1"><input type="radio" /></td>
								<td colspan="1" data-index="0"><input type="radio" /></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1" data-index="3"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1" data-index="4"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1" data-index="5"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1" data-index="6"><input type="radio" /></td>
								<td colspan="1" data-index="7"><input type="radio" /></td>
								<td colspan="1" data-index="8"><input type="radio" /></td>
								<td colspan="1"></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<!-- L -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<!-- L -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<!-- I -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<!-- N -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
						</tbody>
					</table>
				</td>
				<td>
					<!-- G -->
					<table border="0">
						<tbody>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
							</tr>
							<tr>
								<td colspan="1"></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"><input type="radio" /></td>
								<td colspan="1"></td>
							</tr>
						</tbody>
					</table>
				</td>
			</tr>
		</tbody>
	</table>

	<br>


  <fieldset>
    <legend>all</legend>
    <label><input type="checkbox" name="checkbox" value="no" />feminist technologies</label>
    <label><input type="checkbox" name="checkbox" value="no" />DIY practices</label>
    <label><input type="checkbox" name="checkbox" value="no" />post-free cultures</label>
    <label><input type="checkbox" name="checkbox" value="no" />homebrew servers</label>
    <label><input type="checkbox" name="checkbox" value="no" />bootleg librians</label>
    <label><input type="checkbox" name="checkbox" value="no" />art collectives</label>
  </fieldset>

  <fieldset>
    <legend>exploring</legend>
    <label><input type="checkbox" name="checkbox" value="yes" />pen plotters</label>
    <label><input type="checkbox" name="checkbox" value="no" />dot matrix printers</label>
		<label><input type="checkbox" name="checkbox" value="no" />scanners</label>
		<label><input type="checkbox" name="checkbox" value="no" />typewriters</label>
    <label><input type="checkbox" name="checkbox" value="no" />collective servers</label>
		<label><input type="checkbox" name="checkbox" value="no" />video games</label>
    <label><input type="checkbox" name="checkbox" value="no" />python scripts</label>
    <label><input type="checkbox" name="checkbox" value="no" />HTML pages</label>
    <label><input type="checkbox" name="checkbox" value="no" />CSS stylesheets</label>
    <label><input type="checkbox" name="checkbox" value="no" />browsers</label>
    <label><input type="checkbox" name="checkbox" value="no" />post-free culture licenses</label>
    <label><input type="checkbox" name="checkbox" value="yes" />radio shows</label>
    <label><input type="checkbox" name="checkbox" value="no" />scripts</label>
    <label><input type="checkbox" name="checkbox" value="no" />wiki's</label>
    <label><input type="checkbox" name="checkbox" value="no" />digital gardens</label>
    <label><input type="checkbox" name="checkbox" value="no" />gemini blogs</label>
    <label><input type="checkbox" name="checkbox" value="no" />archives</label>
		<label><input type="checkbox" name="checkbox" value="no" />protocols</label>
    <label><input type="checkbox" name="checkbox" value="no" />non-linear narratives</label>
    <label><input type="checkbox" name="checkbox" value="no" />hypertext adventures</label>
    <label><input type="checkbox" name="checkbox" value="no" />software studies</label>
    <label><input type="checkbox" name="checkbox" value="no" />manuals</label>
    <label><input type="checkbox" name="checkbox" value="no" />zines</label>
    <label><input type="checkbox" name="checkbox" value="no" />guides</label>
    <label><input type="checkbox" name="checkbox" value="no" />text adventures</label>
    <label><input type="checkbox" name="checkbox" value="no" />servers</label>
  </fieldset>

  <fieldset>
    <legend>at</legend>
    <label><input type="checkbox" name="checkbox" value="no" />experimental music nights</label>
    <label><input type="checkbox" name="checkbox" value="no" />collective learning gatherings</label>
    <label><input type="checkbox" name="checkbox" value="no" />print parties</label>
    <label><input type="checkbox" name="checkbox" value="no" />zine festivals</label>
    <label><input type="checkbox" name="checkbox" value="no" />printshops</label>
    <label><input type="checkbox" name="checkbox" value="no" />community art venues</label>
    <label><input type="checkbox" name="checkbox" value="no" />squats</label>
		<label><input type="checkbox" name="checkbox" value="no" />hacker spaces</label>
    <label><input type="checkbox" name="checkbox" value="no" />libraries</label>
    <label><input type="checkbox" name="checkbox" value="no" />game nights</label>
    <label><input type="checkbox" name="checkbox" value="no" />algoraves</label>
    <label><input type="checkbox" name="checkbox" value="no" />booksprints</label>
    <label><input type="checkbox" name="checkbox" value="no" />edit-a-thons</label>
  </fieldset>

  <fieldset>
    <legend>?</legend>
  </fieldset>

	<br>
	<br>

	<div>
			How can
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<div class="question">
			When do
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<div class="question">
			Since when did
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<div class="question">
			For whom do
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<div class="question">
			Why did
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<div class="question">
			Can
		<select id="simple" name="simple">
		  <option>feminist technologies</option>
		  <option>art collectives</option>
		  <option>DIY practitioners</option>
		</select>
		<select id="simple" name="simple">
		  <option>explore</option>
		  <option>study</option>
		  <option>critique</option>
		</select>
		<select id="simple" name="simple">
		  <option>pen plotters</option>
		  <option>zines</option>
		  <option>python scripts</option>
		</select>
		at
		<select id="simple" name="simple">
		  <option>zine festivals</option>
		  <option>squats</option>
		  <option>game nights</option>
		</select>
		?
		<br>
		<br>
	</div>

	<br>
	<div align="center">
		<marquee>
			<button>Apply!</button>
		</marquee>
	</div>
</form>


<script>

setInterval(dropping, 100);

function dropping(){
	var dropdowns = document.querySelectorAll("select");
	var random = Math.floor(Math.random() * dropdowns.length);
	var dropdown = dropdowns[random]
	var random_option = Math.floor(Math.random() * dropdown.options.length);
	console.log("random_option", random_option);
	dropdown.selectedIndex = random_option;
}

setInterval(checking, 100);

function checking(){
	var checkboxes = document.querySelectorAll("input[name=checkbox]");
	console.log(checkboxes.length);
	var random = Math.floor(Math.random() * checkboxes.length)
	console.log(random);
	checkboxes[random].checked = true;
	var random = Math.floor(Math.random() * checkboxes.length)
	checkboxes[random].checked = false;
}
</script>

</body>
</html>