diff --git a/client/css/style.css b/client/css/style.css
index e34f89f7..abb66fbe 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -1302,7 +1302,6 @@ button {
 	-webkit-flex: 0 0 auto;
 	flex: 0 0 auto;
 	padding: 5px;
-	position: relative;
 }
 
 #windows #form .input {
@@ -1320,23 +1319,10 @@ button {
 
 #connection-error {
 	display: none;
-	align-items: center;
-	justify-content: center;
-	line-height: 1;
-	background: #f44336;
-	color: #fff;
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	top: 0;
-	left: 0;
-	padding: 5px;
-	z-index: 30;
-	cursor: pointer;
 }
 
 #connection-error.shown {
-	display: flex;
+	display: block;
 }
 
 [contenteditable]:focus {
diff --git a/client/index.html b/client/index.html
index 01004283..3092287d 100644
--- a/client/index.html
+++ b/client/index.html
@@ -57,8 +57,8 @@
 				</div>
 				<div id="chat-container" class="window">
 					<div id="chat"></div>
+					<button id="connection-error" class="btn btn-reconnect">Client connection lost &mdash; Click here to reconnect</button>
 					<form id="form" method="post" action="">
-						<div id="connection-error"><span>Client connection lost. Click to reconnect.</span></div>
 						<div class="input">
 							<span id="nick">
 								<span id="nick-value" spellcheck="false"></span><!-- Comments here remove spaces between elements
diff --git a/client/themes/crypto.css b/client/themes/crypto.css
index b1d86268..07515ae6 100644
--- a/client/themes/crypto.css
+++ b/client/themes/crypto.css
@@ -58,6 +58,14 @@ a:hover,
 	background: #00ff0e;
 }
 
+.btn-reconnect {
+	background: #f00;
+	color: #fff;
+	border: 0;
+	border-radius: 0;
+	margin: 0;
+}
+
 #settings .opt {
 	line-height: 20px;
 	font-size: 12px;
diff --git a/client/themes/example.css b/client/themes/example.css
index f59944fe..509c2a65 100644
--- a/client/themes/example.css
+++ b/client/themes/example.css
@@ -46,6 +46,14 @@ body {
 	border-radius: 2px;
 }
 
+.btn-reconnect {
+	background: #e74c3c;
+	color: #fff;
+	border: 0;
+	border-radius: 0;
+	margin: 0;
+}
+
 @media (max-width: 768px) {
 	#sidebar {
 		left: -220px;
diff --git a/client/themes/morning.css b/client/themes/morning.css
index 41adf99a..4fa23bea 100644
--- a/client/themes/morning.css
+++ b/client/themes/morning.css
@@ -227,3 +227,11 @@ body {
 #chat .toggle-content .body {
 	color: #99a2b4;
 }
+
+.btn-reconnect {
+	background: #e74c3c;
+	color: #fff;
+	border: 0;
+	border-radius: 0;
+	margin: 0;
+}
diff --git a/client/themes/zenburn.css b/client/themes/zenburn.css
index 7d838dac..b6a98d65 100644
--- a/client/themes/zenburn.css
+++ b/client/themes/zenburn.css
@@ -253,3 +253,11 @@ body {
 #chat .toggle-content .body {
 	color: #d2d39b;
 }
+
+.btn-reconnect {
+	background: #e74c3c;
+	color: #fff;
+	border: 0;
+	border-radius: 0;
+	margin: 0;
+}