1 files changed, 22 insertions, 30 deletions
diff --git a/haunt/static/css/style.css b/haunt/static/css/style.css
index 0890fd0..1210f6c 100644
--- a/haunt/static/css/style.css
+++ b/haunt/static/css/style.css
@@ -163,11 +163,20 @@ figure > figcaption {
 
 /* Comments & Webmention. */
 
+textarea {
+    width: 100%;
+    height: 4rem;
+}
+
+textarea, input[type=text], input[type=url] {
+    border: 1px solid #ccc;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+}
+
 #webmention p .author-name {
     margin: 4px;
 }
 
-
 #webmention {
     border-top: 2px solid #d2d6dd;
 }
@@ -256,45 +265,28 @@ form#webmention-form {
     padding-top: 1rem;
 }
 
-form#webmention-form input {
-    margin-top: 1rem;
-}
-
-form#webmention-form input[type=url] {
-    display: block;
-    width: 90%;
-    margin: auto;
+#webmention-input-group {
     margin-top: 1rem;
+    display: grid;
+    grid-template-columns: 9fr 1fr;
 }
 
 /* Comment form. */
 
-#comment-form #commenter-info label,
-#comment-form #comment-content label {
-    display: block;
-    width: 20em;
-    float: left;
-    clear: left;
-}
-
-#comment-form #captcha-trigger-block label {
-    display: block;
-}
-
-#comment-form label,
-#comment-form input,
-#comment-form button {
-    margin-top: 1em;
+.required:after {
+    content:" *";
+    color: red;
 }
 
-#comment-form #commenter-info input,
-#comment-form #comment-content input {
-    width: 20em;
-    float: left;
+fieldset#comment-content {
+    display: grid;
+    grid-template-columns: 1fr 2fr;
+    grid-gap:5px;
 }
 
-#comment-form #comment-captcha input {
+#comment-form #captcha-trigger-block label {
     display: block;
+    margin-bottom: 16px;
 }
 
 #comment-form img {