diff --git a/static/account.html b/static/account.html
index 689d5d8..76f6e70 100644
--- a/static/account.html
+++ b/static/account.html
@@ -16,34 +16,44 @@
    display: none;
   }
   #changepass:target {
-   display:block;
+   display: block;
+  }
+  body {
+   background-image: url(/img/dolphins.png);
+   background-repeat: repeat;
   }
  </style>
+ <link rel="stylesheet" href="/css/columns.css">
+ <link rel="stylesheet" href="/css/haiku.css">
 </head>
 <body>
- <a href="#redeem">Redeem invite code</a> <a href="#gencode">Generate invite code</a> <a href="#changepass">Change password</a>
- <div id="redeem">
-  <form action="/redeemcode.cgi" method="post">
-   Invite code: <input type="text" name="key"><br>
-   Username: <input type="text" name="username"><br>
-   Password: <input type="password" name="password"><br>
-   Email: <input type="text" name="email"><br>
-   <input type="submit" value="Redeem">
-  </form> 
- </div>
- <div id="gencode">
-  <form action="/gencode.cgi" method="post">
-   Username: <input type="text" name="username"><br>
-   Password: <input type="password" name="password"><br>
-   <input type="submit" value="Generate code">
-  </form> 
+<div style="display: inline-block;">
+<b class="twrapper"><a class="title" href="#redeem"><img class="wbutton wlbutton" src="/img/close.png">Redeem invite code<img class="wbutton wrbutton" src="/img/minimise.png"></a><a class="title" href="#gencode"><img class="wbutton wlbutton" src="/img/close.png">Generate invite code<img class="wbutton wrbutton" src="/img/minimise.png"></a><a class="title" href="#changepass"><img class="wbutton wlbutton" src="/img/close.png">Change password<img class="wbutton wrbutton" src="/img/minimise.png"></a></b>
+ <div class="wrapper">
+  <div id="redeem" >
+   <form action="/redeemcode.cgi" method="post">
+    Invite code <input type="text" name="key"><br>
+    Username <input type="text" name="username"><br>
+    Password <input type="password" name="password"><br>
+    Email <input type="text" name="email"><br>
+    <br><input type="submit" value="Redeem">
+   </form>
+  </div>
+  <div id="gencode">
+   <form action="/gencode.cgi" method="post">
+    Username <input type="text" name="username"><br>
+    Password <input type="password" name="password"><br>
+    <br><input type="submit" value="Generate code">
+   </form>
+  </div>
+  <div id="changepass">
+   <form action="/changepass.cgi" method="post">
+    Username <input type="text" name="username"><br>
+    Password <input type="password" name="password"><br>
+    New Password <input type="password" name="newpass"><br>
+    <br><input type="submit" value="Change password">
+   </form>
+  </div>
  </div>
- <div id="changepass">
-  <form action="/changepass.cgi" method="post">
-   Username: <input type="text" name="username"><br>
-   Password: <input type="password" name="password"><br>
-   New Password: <input type="password" name="newpass"><br>
-   <input type="submit" value="Change password">
-  </form> 
  </div>
 </body>
diff --git a/static/css/columns.css b/static/css/columns.css
new file mode 100644
index 0000000..2f40a18
--- /dev/null
+++ b/static/css/columns.css
@@ -0,0 +1,28 @@
+.centre-column {
+ width: 90%;
+ text-align: left;
+}
+.centre-column, .cwrapper {
+ margin: 0px auto;
+ overflow: hidden;
+}
+@media screen and (min-width: 801px) {
+ .left-column, .right-column {
+  width: 49%;
+  text-align: left;
+  padding-bottom: 32767;
+  margin-bottom: -32767px;
+ }
+ .left-column {
+  float: left;
+ }
+ .right-column {
+  float: right;
+ }
+}
+@media screen and (min-width: 1024px) {
+ body {
+  width: 80%;
+  padding-left: 10%;
+ }
+}
diff --git a/static/css/haiku.css b/static/css/haiku.css
new file mode 100644
index 0000000..14da141
--- /dev/null
+++ b/static/css/haiku.css
@@ -0,0 +1,45 @@
+.title {
+ border-top: 1px solid #9d9d9d;
+ border-right: 1px solid #9d9d9d;
+ background: linear-gradient(#ffefb4, #ffcb00);
+ padding: 2px;
+ display: inline-block;
+ border-bottom: 0px;
+ line-height: 1.5em;
+ font-size: 1em;
+ text-decoration: none;
+ color: black;
+}
+.twrapper {
+ border-left: 1px solid #9d9d9d;
+ display: inline-block;
+}
+.wrapper {
+ border: 1px solid #9d9d9d;
+ min-height: 400px;
+ background: #d8d8d8;
+ box-sizing: border-box;
+ padding: 1em
+}
+.wbutton {
+ display: inline-block;
+ vertical-align: middle;
+ padding: 4px;
+}
+.wlbutton {
+ padding-right: 16px;
+}
+.wrbutton {
+ padding-left: 16px;
+}
+input {
+ width: 100%;
+ border: 1px solid black;
+ padding: 0.3em;
+}
+input[type=text], input[type=password] {
+ background: #ffffff;
+}
+input[type=submit] {
+ background: linear-gradient(#e9e9e9 0%, #e9e9e9 50%, #dddddd 50.01%, #dddddd 100%);
+}
