<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>SBB - CFF - FFS</title>
	<link rel="stylesheet" href="index.css">
	<script type="text/javascript" src="config.js"></script>
</head>
<body>
	<div id="waggon-template" class="waggon template">
		<div class="number"></div>
		<div class="outline">
			<div class="class"></div>
			<div class="services"></div>
		</div>
	</div>
	<form id="search">
		<input type="text" id="search-input" placeholder="Station...">
		<button id="search-btn">Search</button>
	</form>
	<div id="stations"></div>
	<div id="station">
		<h1 class="name">St-Maurice</h1>
		<div class="field">
			<label for="platforms">Platform</label>
			<div class="select-wrapper">
				<select id="platforms"></select>
				<span class="select-arrow"></span>
			</div>
		</div>
		<button id="refresh"></button>
	</div>
	<div id="grid">
		<div id="type-time">
			<img id="train-type" src="icons/ic-61.svg" alt="InterCity 61">
			<div id="departure">08:56</div>
		</div>
		<div id="destination">Interlaken Ost</div>
		<div id="stops">
			<div class="stop">Liestal</div>
			<div class="stop">Olten</div>
			<div class="stop">Bern</div>
			<div class="stop">Spiez</div>
		</div>
		<div id="composition">
			<div id="sectors">
				<div class="sector">A</div>
				<div class="sector">B</div>
				<div class="sector">C</div>
				<div class="sector">D</div>
			</div>
			<div id="carriages"></div>
		</div>
	</div>
	<script type="text/javascript" src="index.js"></script>
</body>
</html>