diff --git a/index.html b/index.html
index e6d8b65..4f038d1 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,7 @@
+
-
Start a new WhatsApp chat
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..d87e79c
--- /dev/null
+++ b/style.css
@@ -0,0 +1,95 @@
+body {
+ background-color: #EFE9DD;
+ text-align: center;
+ font-family: sans-serif;
+}
+* {
+ -webkit-tap-highlight-color: transparent;
+}
+h1 {
+ margin-bottom: 0;
+ opacity: 0.7;
+}
+p {
+ opacity: 0.5;
+ font-size: 0.85rem;
+ max-width: 400px;
+ margin: 1rem auto;
+}
+summary {
+ opacity: 0.5;
+ font-size: 0.85rem;
+ margin: 0.5rem auto;
+ cursor: pointer;
+ user-select: none;
+}
+summary:focus {
+ outline: none;
+ opacity: 0.7;
+}
+#desc {
+ margin-top: 2rem;
+ font-size: 0.75rem;
+}
+.icon {
+ width: 1.25rem;
+ height: 1.25rem;
+ position: relative;
+ top: 0.25rem;
+}
+
+input, textarea {
+ padding: 0.5rem 1rem;
+ border-radius: 4px;
+ border: 1px solid rgba(0, 0, 0, 0.5);
+ transition: all 150ms;
+ font-size: 1rem;
+}
+textarea {
+ resize: vertical;
+ font-family: sans-serif;
+ font-size: 0.75rem;
+ width: 100%;
+ max-width: 400px;
+ box-sizing: border-box;
+}
+input:focus, textarea:focus {
+ outline: none;
+ box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
+}
+
+/* Used for copying to clipboard */
+#copy-input {
+ opacity: 0;
+ pointer-events: none;
+}
+
+button {
+ background-color: inherit;
+ border: none;
+ margin: 0.25rem 0;
+ opacity: 0.5;
+ cursor: pointer;
+ transition: all 150ms;
+}
+button:hover, button:focus {
+ opacity: 1;
+ outline: none;
+}
+
+#send {
+ background-color: #1DAA61;
+ color: white;
+ border: none;
+ padding: 0.5rem 2rem;
+ margin-top: 1rem;
+ border-radius: 4px;
+ opacity: 1;
+}
+#send:active {
+ background-color: #18864D;
+}
+#send:focus {
+ box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
+}
+