upHEADmaster

1 files changed, 134 insertions, 0 deletions

diff --git a/css/guestbook.css b/css/guestbook.css
new file mode 100644
index 0000000..6964092
--- /dev/null
+++ b/css/guestbook.css
@@ -0,0 +1,134 @@
+:root {
+    --skin: #e5cdab;
+    --bg: #100f03;
+
+    --orange: #e56800;
+    --light-orange: #fdb64e;
+
+    --yellow: #fecf41;
+}
+
+@font-face {
+    font-family: 'Iosevka';
+    src: url('../fonts/iosevka-regular.woff2') format('woff2');
+    font-display: swap;
+}
+
+@media (min-width: 55rem) {
+	body {
+            max-width: 780px;
+            padding-top: 20px;
+        }
+
+        main {
+            margin: auto;
+        }
+
+}
+
+@media (max-width: 55rem) {
+        main {
+            margin: auto;
+            max-width: 92%;
+        }
+}
+
+body {
+    color: white;
+    margin: auto;
+}
+
+h1 {
+    font-size: 36px;
+    font-weight: 600;
+    letter-spacing: 0.5px;
+    margin-bottom: 30px;
+}
+
+header {
+    text-align: center;
+}
+
+a {
+    text-decoration: none;
+    color: var(--light-orange);
+}
+
+a:hover {
+    color: var(--yellow);
+}
+
+html {
+    font-family: Iosevka;
+    min-height: 100%;
+	padding-top: 10px;
+    padding-bottom: 5em;
+    background: url("/images/blacktile.jpg");
+    background-repeat: repeat;
+}
+
+article {
+    background: rgba(0, 0, 0, 0.4);
+    border: 1px solid white;
+}
+
+div {
+    padding: 10px;
+}
+
+p { 
+    font-size: 1rem;
+}
+
+p img {
+    border: 2px solid white;
+}
+
+b {
+    letter-spacing: 2px;
+    color: var(--yellow);
+}
+
+footer {
+    display: flex;
+    justify-content: center;
+}
+
+footer img {
+    width: 69px;
+    height: auto;
+    padding: 6px;
+}
+
+textarea {resize: none}
+input {max-height: 2em}
+
+hr {
+    color: white;
+}
+
+input {
+    font-family: inherit;
+    margin-bottom: 6px;
+    background: var(--bg);
+    color: white !important;
+    border: 1px solid white;
+}
+
+input:focus {
+    outline: none;
+    border: 1px solid var(--yellow);
+}
+
+textarea {
+    border: 1px solid white;
+    font-family: inherit;
+    background: var(--bg);
+    color: white !important;
+}
+
+textarea:focus {
+    outline: none;
+    border: 1px solid var(--yellow);
+}
+