Add quotes an first draft of a text.

app/assets/stylesheets/welcome.scss

@@ -50,6 +50,10 @@ a:visited {
 hr {
 	margin: 5px 0 5px 0;
 }
+p {
+	padding-top: 5px;
+	text-indent: 10px;
+}
 
 #header {
 	background: rgba(0, 0, 0, 0.7);
@@ -197,8 +201,7 @@ hr {
 	overflow: hidden;
 }
 .section .watermark {
-	position: relative;
-	padding: 2px;
+	position: absolute;
 	opacity: 0.08;
 	width: 60%;
 	top: 50%;
@@ -207,8 +210,51 @@ hr {
 	z-index: 0;
 }
 
+.title {
+	position: relative;
+	width: 100%;
+	line-height: 0;
+	text-align: center;
+	padding-bottom: 50px;
+}
+.title img {
+	display: inline-block;
+	vertical-align: middle;
+}
+.title h2 {
+	display: inline-block;
+	vertical-align: middle;
+}
+
+.quote {
+	position: relative;
+}
+.quote q {
+	display: block;
+	font-family: serif;
+	text-align: center;
+}
+.quote div {
+	position: relative;
+	width: 100%;
+	line-height: 0;
+	text-align: center;
+}
+.quote img {
+	display: inline-block;
+	vertical-align: middle;
+}
+.quote span {
+	display: inline-block;
+	vertical-align: middle;
+	font-weight: bold;
+}
+.text {
+	padding-top: 30px;
+}
+
 .content {
-	position: absolute;
+	position: relative;
 	width: 90%;
 	height: 90%;
 	top: 50%;

app/views/welcome/index.html.erb

@@ -21,6 +21,67 @@
 	</div>
 </div>
 <div id="section2" class="section">
+	<%= image_tag "dogs2.svg", class: "watermark" %>
+	<div class="content">
+		<div class="title">
+			<%= image_tag("copyleft-icon.svg", size: "60") %>
+			<h2>Free as in <q>FREE SPEACH</q></h2>
+		</div>
+		<div class="quote">
+			<q>
+				Value your freedom or you will lose it, teaches history. 'Don't
+				bother us with politics', respond those who don't want to learn.
+			</q>
+			<div>
+				<%= image_tag "stallman.png" %>
+				<span>Dr. Richard Stallman</span>
+			</div>
+		</div>
+		<div class="quote">
+			<q>
+				If I have seen further it is by standing on ye sholders of Giants.
+			</q>
+			<div>
+				<%= image_tag "newton.png" %>
+				<span>Sir Isaac Newton</span>
+			</div>
+		</div>
+		<div class="quote">
+			<q>
+				Free software is software that respects your freedom and the social
+				solidarity of your community. So it's free as in freedom.
+			</q>
+			<div>
+				<%= image_tag "stallman.png" %>
+				<span>Dr. Richard Stallman</span>
+			</div>
+		</div>
+		<div class="text">
+			<p>
+			Der Wert der Freiheit kann nicht hoch genug eingestuft werden. Sie zähl
+			aber leider zu jenen Gütern deren wahre Bedeutung wir erst erfassen, wenn
+			wir sie verlohren haben. Um Freiheit zu gewährleisten müssen wir erst
+			einmal in der Lage sein diese zu erkennen und was vielleicht noch
+			wichtiger ist, zu erkennen was unfrei ist oder uns unsere Freiheit
+			sogar nimmt.
+			</p>
+			<p>
+			Unfreiheiten zu erkennen und abzustellen ist of unbequem. Unfreiheit
+			ist ob in Bequemlichkeit verpackt. Auch Neid hält uns davon ab
+			Unfreiheiten abzustellen.
+			</p>
+		</div>
+	</div>
+</div>
+<div id="section3" class="section">
+	<div class="content">
+		<h1>Other</h1>
+		<p>
+		Some other stuff here...
+		</p>
+	</div>
+</div>
+<div id="section4" class="section">
 	<%= image_tag "dogs2.svg", class: "watermark" %>
 	<div class="content">
 		<h2>This is mostly about programming.</h2>
@@ -45,21 +106,4 @@
 		<% end -%>
 	</div>
 </div>
-<div id="section3" class="section">
-	<div class="content">
-		<h1>Other</h1>
-		<p>
-		Some other stuff here...
-		</p>
-	</div>
-</div>
-<div id="section4" class="section">
-	<%= image_tag "dogs2.svg", class: "watermark" %>
-	<div class="content">
-		<h1>Other</h1>
-		<p>
-		Some other stuff here...
-		</p>
-	</div>
-</div>
 <!-- vim: set ts=2 sw=2: -->