summary refs log tree commit diff stats
diff options
context:
space:
mode:
author2023-07-11 00:49:03 -0400
committer2023-07-11 00:49:03 -0400
commit7dec9d6587d1b46a85f4e1c57b75d9e07863d44f (patch)
tree12f483283b8e45d536ae9c06c3cb83ce1665be3c
parent2aaccb040f48a19631a3d49d03afab98ed1986d7 (diff)
downloadkusoneko.moe-7dec9d6587d1b46a85f4e1c57b75d9e07863d44f.tar.gz
-rw-r--r--main.css106
1 files changed, 73 insertions, 33 deletions
diff --git a/main.css b/main.css
index 09f2a11..45f72f9 100644
--- a/main.css
+++ b/main.css
@@ -1,57 +1,97 @@
-@media (prefers-color-scheme: dark){
-	body {color:#fff;background:#000}
-	a:link {color:#9cf}
-	a:hover, a:visited:hover {color:#cef}
-	a:visited {color:#c9f}
-}
 body{
-	margin:1em auto;
-    max-width:40em;
-    padding:0 .62em;
-	font:1.2em/1.62 sans-serif;
+	margin:0;
     background-color: black;
-    overflow: auto;
+	color: cyan;
 
 }
+* {
+    box-sizing: border-box;
+}
 h1,h2,h3 {
-	line-height:1.2;
     color: #ff1493;
 }
-@media print{
-	body{
-		max-width:none
-	}
-}
 p {
     color: cyan;
 }
-ul li {
-    color: cyan;
+#container {
+    max-width: 900px;
+    margin: 0 auto;
 }
-table {
-    table-layout: fixed;
+#container a:link {
+    color: #9cf;
 }
-.contact, .services {
-    border-collapse: collapse;
+#container a:hover, a:visited:hover {
+    color: #cef;
 }
-.contact th, .contact td, .services th, .services td {
-    border: 1px solid #ddd;
-    color: cyan;
+#container a:visited {
+    color: #c9f;
+}
+#navbar {
+    height: 40px;
+	width: 100%;
+}
+#navbar ul {
+    display: flex;
+	padding: 0;
+	margin: 0;
+	list-style-type: none;
+	justify-content: space-evenly;
+}
+#navbar li {
+    padding-top: 10px;
 }
-.contact tr:nth-child(even), .services tr:nth-child(even) {
+#navbar li a {
+    color: #ff1493;
+	font-weight: 800;
+	text-decoration: none;
+}
+#navbar li a:hover {
+    color: yellow;
+	text-decoration: underline;
+}
+#flex {
+    display: flex;
+}
+aside {
     background-color: #101010;
+	width: 200px;
+	padding: 20px;
+	font-size: smaller;
 }
-.contact th, .services th {
+main {
     background-color: black;
-    color: yellow;
+	flex: 1;
+	padding: 20px;
+	order: 2;
+}
+#rightSidebar {
+    order: 3;
 }
-.contact th, .contact td {
-    width:33%;
+.box {
+    background-color: #333;
+    border: 1px solid #ddd;
 }
-.services th, .services td {
-    width:50%;
+.boxedul {
+    padding-left: 10px;
 }
 code {
     color: crimson;
     background-color: #aaa;
 }
+@media only screen and (max-width: 800px) {
+    #flex {
+		flex-wrap: wrap;
+    }
+	aside {
+		width: 100%;
+    }
+	main {
+		order: 1;
+    }
+	#rightSidebar {
+		order: 2;
+    }
+	#navbar ul {
+		flex-wrap: wrap;
+    }
+}