diff --git a/oppgaver/uke6/8ball/model.js b/oppgaver/uke6/8ball/model.js
index 47766e2..7ab2d47 100644
--- a/oppgaver/uke6/8ball/model.js
+++ b/oppgaver/uke6/8ball/model.js
@@ -18,9 +18,15 @@ const negativeAnswers = [
     'Very doubtful'
 ];
 var html = /*HTML*/`
-    <div id="ball">8-ball</div>
-    Ask Your question: <input type="text" onchange="question = this.value" /><br>
-    <button onclick="pickRandomAnswer()">Submit</button>
+<main>
+    <div class="content">
+	    	<a class="btn rgb-animate-hvr">8-ball</a>
+		</div>
+    <div class="content rgb-animate">			
+        Ask Your question: <input type="text" onchange="question = this.value" /><br>
+        <button onclick="pickRandomAnswer()">Submit</button>
+    </div>
+</main>
 `;
 var htmlAnswer = '';
 
diff --git a/oppgaver/uke6/8ball/style.css b/oppgaver/uke6/8ball/style.css
index e69de29..9b17b2d 100644
--- a/oppgaver/uke6/8ball/style.css
+++ b/oppgaver/uke6/8ball/style.css
@@ -0,0 +1,83 @@
+/* RGB EFFECT */
+
+.rgb-animate {
+	animation-iteration-count: infinite;
+	animation-duration: 40s;
+	animation-name: rgb_anim;
+}
+
+/* RGB HOVER EFFECT */
+
+.rgb-animate-hvr:hover {
+	animation-iteration-count: infinite;
+	animation-duration: 20s;
+	animation-name: rgb_anim;
+}
+
+/* RGB ANIMATION EFFECT */
+
+@keyframes rgb_anim {
+	from {
+		filter: hue-rotate(0deg);
+	}
+	50% {
+		filter: hue-rotate(360deg);
+	}
+	to {
+		filter: hue-rotate(0deg);
+	}
+}
+
+/* CSS */
+
+* {
+	margin: 0;
+	padding: 0;
+	color: white;
+	font-family: "Montserrat";
+	font-weight: 600;
+	letter-spacing: 0.1em;
+}
+
+.content {
+	min-height: 50vh;
+	display: flex;
+	flex-flow: column;
+	justify-content: center;
+	align-content: center;
+	align-items: center;
+	background: black;
+}
+
+.content:last-child {
+	background: #de6161; /* fallback for old browsers */
+	background: -webkit-linear-gradient(
+		to right bottom,
+		#2657eb,
+		#de6161
+	); /* Chrome 10-25, Safari 5.1-6 */
+	background: linear-gradient(
+		to right bottom,
+		#2657eb,
+		#de6161
+	); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}
+
+a {
+	text-decoration: none;
+}
+
+.btn {
+	padding: 20px 45px;
+	background: #5c258d; /* fallback for old browsers */
+	background: -webkit-linear-gradient(
+		to right bottom,
+		#4389a2,
+		#5c258d
+	); /* Chrome 10-25, Safari 5.1-6 */
+	background: linear-gradient(
+		to right bottom,
+		#4389a2,
+		#5c258d
+	); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}