Made some cool animations and stuff

tuxcord/static/index.css

@@ -1,5 +1,6 @@
 :root {
-	--accent: #28ebb5
+	--accent: #28ebb5;
+	--accent2: #3a7dff;
 }
 body {
 	background: #000000;
@@ -31,37 +32,68 @@ hr {
 }
 #ascii-clippy {
 	position: absolute;
-	top: 10px;
-	left: 650px;
+	top: 75px;
+	left: 861px;
 	font-size: 10px;
-	transform: rotate(-0.3rad);
+	transform: rotate(-36deg);
+	animation: rotate 2s linear infinite;
+	animation-play-state: paused;
+	width: 40px;
+}
+#ascii-clippy:hover {
+	animation-play-state: running;
+}
+#ascii-exclamation {
+	display: none;
+	position: absolute;
+	left: 548px;
+  	top: 11px;
+}
+#ascii-tuxcord:hover {
+	#ascii-exclamation {
+		display: inline;
+	}
 }
 a {
 	text-decoration: none;
 	color: var(--accent);
 }
+a:hover {
+	text-decoration: bold;
+	color: var(--accent2);
+}
 
 #member img {
 	width: 100px;
 	border-radius: 50%;
 }
-#member img:hover {
-    	filter: drop-shadow(0 0 3px #202020);
-}
 #member-role {
 	color: #888888;
 }
 #members {
 	display: grid;
-	grid-template-columns: auto auto auto auto;
+	grid-template-columns: auto auto auto auto auto;
 }
 #members div {
 	padding: 10px;
-	border-bottom: 1px solid var(--accent);
+	border-bottom: 1px solid white;
 	text-align: center;
 	margin: 20px;
 }
 #member:hover {
-	transform: scale(1.2);
+	animation-name: grow;
+	border-bottom: 1px solid white;
+	animation-duration: 1s;
 	background: #222222;
 }
+#member:active {
+	background: #666666;
+}
+@keyframes grow {
+  	from {transform: scale(1);}
+  	to {transform: scale(1.2);}
+}
+@keyframes rotate {
+	from { transform: rotate(-36deg); }
+	to { transform: rotate(324deg); }
+}