diff --git a/www/css/events.css b/www/css/events.css
index 7723024..466e6ce 100644
--- a/www/css/events.css
+++ b/www/css/events.css
@@ -1,8 +1,8 @@
-h2 a {
+h2 a, h4 a {
 	color: black;
 	text-decoration: none;
 }
-h2 a:hover {
+h2 a:hover, h4 a:hover {
 	text-decoration: underline;
 }
 h2 em {
@@ -32,9 +32,19 @@ h2 img {
 article:first-child h2 img {
 	max-width: 10em;
 }
+h4 {
+	margin-top: 0;
+	margin-bottom: -0.6em;
+}
 
-.subtext {
+
+h2 + .subtext {
 	margin: -1.5em 0 1em 0;
+}
+p + .subtext {
+	margin: -0.5em 0 1em 0;
+}
+.subtext {
 	padding: 0;
 	list-style: none;
 	clear: left;
@@ -51,6 +61,37 @@ article:first-child h2 img {
 	font-weight: normal;
 }
 
+.events:before {
+	height: 1px;
+	width: 100%;
+	display: block;
+	content: " ";
+	background-image: -webkit-linear-gradient(left, transparent, rgba(0,0,0,.1), transparent);
+	background-image: -moz-linear-gradient(left, transparent, rgba(0,0,0,.1), transparent);
+	background-image: -o-linear-gradient(left, transparent, rgba(0,0,0,.1), transparent);
+	margin: 0;
+	padding: 0;
+	border: 0;
+}
+.events {
+	margin-top: -1.5em;
+	margin-left: 0.3em;
+	list-style: none;
+	padding: 0;
+}
+.events >li {
+	padding-left: 0.5em;
+	border-left: 4px solid #35a;
+	margin-top: 0.9em;
+}
+.events li p {
+	text-align: left;
+}
+
+.events .subtext {
+	margin-bottom: 0;
+}
+
 @media screen and (max-width: 50rem) {
 	h2 img {
 		display: none;
diff --git a/www/hendelser/index.php b/www/hendelser/index.php
new file mode 100644
index 0000000..9941ac3
--- /dev/null
+++ b/www/hendelser/index.php
@@ -0,0 +1,57 @@
+<?php namespace pvv\side;
+require_once dirname(dirname(__DIR__)) . implode(DIRECTORY_SEPARATOR, ['', 'inc', 'include.php']);
+
+$translation = ['I dag', 'I morgen', 'Denne uka', 'Neste uke', 'Denne måneden', 'Neste måned'];
+?>
+<!DOCTYPE html>
+<html lang="no">
+<title>Aktivitetsverkstedet</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
+<link rel="stylesheet" href="../css/normalize.css">
+<link rel="stylesheet" href="../css/style.css">
+<link rel="stylesheet" href="../css/events.css">
+
+<header>Aktivitets&shy;verk&shy;stedet</header>
+
+<main>
+<article>
+
+<?php
+$description_paragraphs = 1; //description length
+foreach($agenda->getNextDays() as $period => $events) {
+	if ($events) { ?>
+		<h2><?= $translation[$period] ?></h2>
+		<ul class="events">
+		<?php foreach($events as $event) {?>
+		<li>
+			<h4><strong>
+				<?php if ($event->getURL()) { ?>
+					<a href="<?= $event->getURL() ?>"><?= $event->getName() ?></a>
+				<?php } else { ?>
+					<?= $event->getName() ?>
+				<?php } ?>
+			</strong></h4>
+
+			<?php $description = $event->getDescription(); ?>
+			<?php if ($description_paragraphs) array_splice($description, $description_paragraphs); ?>
+			<?= implode($description, "</p>\n<p>") ?>
+
+			<ul class="subtext">
+				<li>Tid: <strong><?= Agenda::getFormattedDate($event->getStart()) ?></strong>
+				<li>Sted: <strong><?= $event->getLocation() ?></strong>
+				<li>Arrangør: <strong><?= $event->getOrganiser() ?></strong>
+			</ul>
+
+		<?php } ?>
+		</ul>
+	<?php } ?>
+<?php } ?>
+</article>
+
+</main>
+
+<nav>
+	<?= navbar(1, 'aktiviteter'); ?>
+	<?= loginbar($sp, $pdo); ?>
+</nav>
