diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig
index 0c368bc..8cb6e43 100644
--- a/app/Resources/views/base.html.twig
+++ b/app/Resources/views/base.html.twig
@@ -4,18 +4,39 @@
 		<meta charset="UTF-8" />
 		<title>OpenScrum{% block title %}{% endblock %}</title>
 		<link rel="stylesheet" type="text/css" href="{{ asset('skins/default/css/mobile.css') }}" media="handheld" />
+		<link rel="stylesheet" type="text/css" href="{{ asset('skins/default/css/main.css') }}" media="screen" />
 		<link rel="shortcut icon" href="{{ asset('images/favicon.png') }}" />
 	</head>
 	<body>
-		<h1><a href="{{ path('OpenScrumInfoBundle_homepage') }}"><img src="{{ asset('images/logo.png') }}" alt="OpenScrum.org" /></a></h1>
-		<div id="menu">
-			<ul>
-				<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'about', '_format': 'html' }) }}">About</a></li>
-				<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'terms', '_format': 'html' }) }}">Terms and Definitions</a></li>
-				<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'faq', '_format': 'html'}) }}">FAQ</a></li>
-				<li>Buy</li>
-			</ul>
+		<div id="app-bar-wrapper">
+			<div id="app-bar">
+				<div id="appbar-siteinfo">
+					<ul>
+						<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'about', '_format': 'html' }) }}">About</a></li>
+						<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'terms', '_format': 'html' }) }}">Terms and Definitions</a></li>
+						<li><a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'faq', '_format': 'html'}) }}">FAQ</a></li>
+						<li>Buy</li>
+					</ul>
+				</div>
+				<div id="appbar-search">
+					<input type="text" value="search box" />
+				</div>
+
+				<div id="appbar-login">
+					Sign In!
+				</div>
+			</div>
+			<div id="app-bar-padding"></div>
+		</div>
+		<div id="container">
+			<h1><a href="{{ path('OpenScrumInfoBundle_homepage') }}"><img src="{{ asset('images/logo.png') }}" alt="OpenScrum.org" /></a></h1>
+			{% block body %}{% endblock %}
+		</div>
+		<div id="footer-wrapper">
+			<div id="footer-padding"></div>
+			<div id="footer"{% if app.environment == 'dev' %} style="bottom: 40px;"{% endif %}>
+				Copyright © 2012, Gergely POLONKAI :: Privacy Policy :: <a href="{{ path('OpenScrumInfoBundle_infopage', { 'page': 'disclaimers', '_format': 'html' }) }}">Disclaimers</a>
+			</div>
 		</div>
-		{% block body %}{% endblock %}
 	</body>
 </html>
diff --git a/web/skins/default/css/main.css b/web/skins/default/css/main.css
new file mode 100644
index 0000000..e1b9c38
--- /dev/null
+++ b/web/skins/default/css/main.css
@@ -0,0 +1,104 @@
+body {
+	margin: 0;
+	font-family: Helvetica, Arial, sans;
+}
+
+#app-bar {
+	position: fixed;
+	left: 0;
+	top: 0;
+	width: 100%;
+	background-color: #004e8a;
+	color: #c0ffff;
+	height: 32px;
+	padding: 2px;
+}
+
+#appbar-search {
+	float: left;
+}
+
+#appbar-search input {
+	width: 190px;
+}
+
+#appbar-login {
+	float: right;
+}
+
+#appbar-search input {
+	border: 0 none;
+	background-color: white;
+	height: 24px;
+}
+
+#app-bar-padding {
+	height: 40px;
+	clear: both;
+}
+
+#container {
+	margin-left: auto;
+	margin-right: auto;
+	width: 960px;
+}
+
+#container a {
+	color: #000;
+	font-weight: bold;
+	text-decoration: underline;
+}
+
+#appbar-siteinfo {
+	float: left;
+}
+
+#appbar-siteinfo a {
+	color: #c0ffff;
+}
+
+#appbar-siteinfo ul {
+	margin: 0;
+	padding: 0;
+}
+
+#appbar-siteinfo ul li {
+	list-style-type: none;
+	display: inline;
+}
+
+#footer-wrapper {
+	display: block;
+}
+
+#footer-padding {
+	clear: both;
+	height: 40px;
+}
+
+#footer {
+	position: fixed;
+	background-color: #333;
+	bottom: 0;
+	left: 0;
+	margin: 0;
+	z-index: 70000;
+	width: 100%;
+	padding: 1em;
+	text-align: center;
+	vertical-align: center;
+	color: #ccc;
+	font-size: 10px;
+}
+
+#footer a {
+	color: #ccc;
+	font-weight: normal;
+	text-decoration: underline;
+}
+
+h1 {
+	float: none;
+	clear: both;
+}
+
