Again more style.

app/assets/javascripts/parallax.coffee

@@ -11,9 +11,10 @@ App.init = ->
 App.scroll = ->
 	v_scroll = $(document).scrollTop()
 	section = Math.floor(v_scroll / $(window).innerHeight())
+	bg_pos = (v_scroll-(section*$(window).innerHeight()))/2
 	$($(".section")[section]).css(
-		"background-position", "center -" +
-		(v_scroll-(section*$(window).innerHeight()))/2 + "px")
+		"background-position",
+		"center -" + bg_pos + "px")
 
 $(document).on "page:change", ->
 	App.init()

app/assets/stylesheets/welcome.scss

@@ -5,6 +5,7 @@
 
 * {
 	font-family: Verdana, sans-serif;
+	color: rgb(41, 49, 51);
 	margin: 0;
 	padding: 0;
 }
@@ -86,21 +87,60 @@ a:visited {
 	width: 100%;
 	height: 100%;
 }
-
 #section1 {
 	background: image_url("resized/blown.jpg") fixed;
 	background-position: center top;
 }
-
+#section1,#section3 .content {
+	color: rgb(214,206,204);
+}
 #section2,#section4 {
 	background-color: rgb(255,255,255);
 }
-
 #section3 {
 	background: image_url("resized/beach3.jpg") fixed;
 	background-position: center top;
 }
 
+#footer {
+	background: rgb(22, 27, 28);
+
+	position: relative;
+	width: 100%;
+	height: 40px;
+
+	color: rgb(255,255,255);
+}
+
+#about {
+	display: block;
+	list-style: none;
+	text-align: justify;
+	width: 100%;
+	height: 30%;
+	top: 50%;
+	transform: translate(0, -50%);
+	position: absolute;
+}
+#about:after {
+	display: inline-block;
+	width: 100%;
+	height: 0;
+	content: '';
+}
+#about .box {
+	display: inline-block;
+	width: 30%;
+	height: 100%;
+	overflow: hidden;
+	border-style: solid;
+	border-color: rgba(100,190,12,0.7);
+	border-radius: 10px;
+	border-width: 3px;
+	background-color: rgba(255,255,255,0.7);
+	box-shadow: 10px 10px 10px rgba(0,0,0,0.7);
+}
+
 .section {
 	position: relative;
 	height: 100%;
@@ -110,9 +150,11 @@ a:visited {
 
 .content {
 	position: absolute;
+	width: 90%;
+	height: 90%;
 	top: 50%;
-	height: 400px;
-	padding: 30px;
+	left: 50%;
+	transform: translate(-50%, -50%);
 	z-index: 1;
 }
 .text {

app/views/layouts/application.html.erb

@@ -24,6 +24,10 @@
 
 		<div id="content">
 			<%= yield %>
+
+			<footer id="footer">
+				Copyright &copy; 2016 Weird Web Workers and Georg Hopp | All rights reserved
+			</footer>
 		</div>
 	</body>
 </html>

app/views/welcome/index.html.erb

@@ -1,9 +1,16 @@
 <div id="section1" class="section">
 	<div class="content text">
-		<h1>About</h1>
-		<p>
-		Some other stuff here...
-		</p>
+		<div id="about">
+			<div class="box">
+				<h1>Free as in "Free speach"</h1>
+			</div>
+			<div class="box">
+				<h1>Custom Code</h1>
+			</div>
+			<div class="box">
+				<h1>Linux Consulting</h1>
+			</div>
+		</div>
 	</div>
 </div>
 <div id="section2" class="section">