diff --git a/css/layout1.sass b/css/layout1.sass
index 7e6639a..c3881e8 100644
--- a/css/layout1.sass
+++ b/css/layout1.sass
@@ -23,3 +23,47 @@ img
// Parallax
+
+.bird-box
+ position: relative
+ height: 600px
+ background:
+ image: url(/images/bird-bg.jpg)
+ size: auto 600px
+ position: top center
+ attachment: fixed
+ overflow: hidden
+
+.logo
+ height: 100px
+ width: 100%
+ background:
+ image: url(/images/black-bird-logo.svg)
+ position: center
+ repeat: no-repeat
+ position: absolute
+ top: 50%
+ margin-top: -50px
+
+.fore-bird
+ width: 960px
+ height: 733px
+ background:
+ image: url(/images/fore-bird.png)
+ repeat: no-repeat
+ position: right bottom
+ position: absolute
+ left: 50%
+ margin-left: -480px
+ top: 380px
+
+.back-bird
+ width: 960px
+ height: 298px
+ background:
+ image: url(/images/back-bird.png)
+ repeat: no-repeat
+ position: top left
+ position: absolute
+ left: 50%
+ margin-left: -480px
diff --git a/css/style.css b/css/style.css
index 8326f1c..ea67ce2 100644
--- a/css/style.css
+++ b/css/style.css
@@ -874,3 +874,43 @@ figure {
img {
max-width: 100%; }
+
+.bird-box {
+ position: relative;
+ height: 600px;
+ background-image: url(/images/bird-bg.jpg);
+ background-size: auto 600px;
+ background-position: top center;
+ background-attachment: fixed;
+ overflow: hidden; }
+
+.logo {
+ height: 100px;
+ width: 100%;
+ background-image: url(/images/black-bird-logo.svg);
+ background-position: center;
+ background-repeat: no-repeat;
+ position: absolute;
+ top: 50%;
+ margin-top: -50px; }
+
+.fore-bird {
+ width: 960px;
+ height: 733px;
+ background-image: url(/images/fore-bird.png);
+ background-repeat: no-repeat;
+ background-position: right bottom;
+ position: absolute;
+ left: 50%;
+ margin-left: -480px;
+ top: 380px; }
+
+.back-bird {
+ width: 960px;
+ height: 298px;
+ background-image: url(/images/back-bird.png);
+ background-repeat: no-repeat;
+ background-position: top left;
+ position: absolute;
+ left: 50%;
+ margin-left: -480px; }
diff --git a/index.html b/index.html
index 08bcc25..ef26b7a 100644
--- a/index.html
+++ b/index.html
@@ -10,6 +10,11 @@
+
Clothing Store
diff --git a/index.jade b/index.jade
index 1fb8d1e..63fab86 100644
--- a/index.jade
+++ b/index.jade
@@ -10,9 +10,13 @@ html(lang="en")
link(rel="icon", type="image/png", href="images/favicon.png")
body
+
+ header.bird-box
+ .back-bird
+ .logo
+ .fore-bird
-
-
+
section.content
article
diff --git a/js/functions.js b/js/functions.js
index e69de29..851342e 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -0,0 +1,17 @@
+$(window).scroll(function(){
+
+ var wScroll = $(this).scrollTop();
+
+ $('.logo').css({
+ 'transform' : 'translate(0px, '+ wScroll /2 +'%)'
+ });
+
+ $('.back-bird').css({
+ 'transform' : 'translate(0px, '+ wScroll /4 +'%)'
+ });
+
+ $('.fore-bird').css({
+ 'transform' : 'translate(0px, -'+ wScroll /40 +'%)'
+ });
+
+});
diff --git a/js/min/functions-min.js b/js/min/functions-min.js
new file mode 100644
index 0000000..266b986
--- /dev/null
+++ b/js/min/functions-min.js
@@ -0,0 +1,19 @@
+$(window).scroll(function(){
+
+ var wScroll = $(this).scrollTop();
+
+ $('.logo').css({
+ 'transform' : 'translate(0px, '+ wScroll /2 +'%)'
+ });
+
+ $('.back-bird').css({
+ 'transform' : 'translate(0px, '+ wScroll /4 +'%)'
+ });
+
+ $('.fore-bird').css({
+ 'transform' : 'translate(0px, -'+ wScroll /40 +'%)'
+ });
+
+});
+
+