diff --git a/website/source/assets/images/hero-bg.png b/website/source/assets/images/hero-bg.png
new file mode 100644
index 000000000..7585e33df
--- /dev/null
+++ b/website/source/assets/images/hero-bg.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:2a598e2a137f53b35b204f3423ab9b1b55649ff050304be07f737f74142ea574
+size 200920
diff --git a/website/source/assets/images/hero-bg@2x.png b/website/source/assets/images/hero-bg@2x.png
new file mode 100644
index 000000000..8bd2e2a29
--- /dev/null
+++ b/website/source/assets/images/hero-bg@2x.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:679fdaef4229f7ce534e9894068861707cd3d07f7ab64697d8f57fb64ab1c440
+size 465690
diff --git a/website/source/assets/images/hero-image@2x.png b/website/source/assets/images/hero-image@2x.png
index 4dd8e886f..c60385b4d 100644
--- a/website/source/assets/images/hero-image@2x.png
+++ b/website/source/assets/images/hero-image@2x.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:68261264f36649d39df14d10e1d89fca34e94686873cabae9b6f868aeb67668f
-size 56591
+oid sha256:31cb8346b240314951f63f92ef192c00ca4d5e65dc7bd3e8f21e21fc4e003e7e
+size 56588
diff --git a/website/source/assets/images/hero-lockup.png b/website/source/assets/images/hero-lockup.png
new file mode 100644
index 000000000..4313440b7
--- /dev/null
+++ b/website/source/assets/images/hero-lockup.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:976470e961a624087346fb8e08db9225ab64fff28b6cb3c7c1aa6151804a5ef2
+size 42577
diff --git a/website/source/assets/images/hero-lockup@2x.png b/website/source/assets/images/hero-lockup@2x.png
new file mode 100644
index 000000000..09b1115da
--- /dev/null
+++ b/website/source/assets/images/hero-lockup@2x.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:58ea0c411bd01d33e9002cc03b45bb95bd05ecaaba377900fc5d2fd9e2c9b8ae
+size 90217
diff --git a/website/source/assets/stylesheets/_buttons.scss b/website/source/assets/stylesheets/_buttons.scss
index a9906066c..57b9f842e 100755
--- a/website/source/assets/stylesheets/_buttons.scss
+++ b/website/source/assets/stylesheets/_buttons.scss
@@ -4,7 +4,7 @@
.h-btn{
display: inline-block;
- background-color: $white;
+ background-color: transparent;
color: $black;
@include transition(color .3s ease-in-out);
//@include btn-shadow();
diff --git a/website/source/assets/stylesheets/_header.scss b/website/source/assets/stylesheets/_header.scss
index 0d8980a09..374452f9c 100755
--- a/website/source/assets/stylesheets/_header.scss
+++ b/website/source/assets/stylesheets/_header.scss
@@ -4,12 +4,14 @@
#header {
position: relative;
+ height: 108px;
color: $white;
text-rendering: optimizeLegibility;
margin-bottom: 0;
/* opacity: 0;
@include translate3d(0, -10px, 0); */
transition: all 1s ease;
+ background-color: $white;
/* &.showit{
opacity: 1;
@@ -17,10 +19,10 @@
transition: all 1s ease;
} */
- &.navbar-static-top{
- height:70px;
- z-index: 1000;
- }
+ // &.navbar-static-top{
+ // height:70px;
+ // z-index: 1000;
+ // }
.navbar-header{
@@ -57,10 +59,10 @@
@include img-retina("../images/logo-header.png", "../images/logo-header@2x.png", 49px, 56px);
&:hover{
- @include transition(all 300ms ease-in);
- color: $green-dark;
- text-decoration: none;
- }
+ @include transition(all 300ms ease-in);
+ color: $green-dark;
+ text-decoration: none;
+ }
}
}
diff --git a/website/source/assets/stylesheets/_home.scss b/website/source/assets/stylesheets/_home.scss
index aeca3ec4e..7605eb68b 100755
--- a/website/source/assets/stylesheets/_home.scss
+++ b/website/source/assets/stylesheets/_home.scss
@@ -3,23 +3,42 @@
// --------------------------------------------------
#hero{
+ position: relative;
@include translate3d(0, -10px, 0);
text-align: center;
+ background: image-url('../images/hero-lockup.png') 0 0 no-repeat;
+ @include img-retina("../images/hero-bg.png", "../images/hero-bg@2x.png", 1278px, 798px);
+ background-size: cover;
+
+ &:before{
+ content: '';
+ position: absolute;
+ top: -20px;
+ left: 50%;
+ width: 1000px;
+ height: 1000px;
+ margin-left: -500px;
+ border-radius: 500px;
+ background-color: $white;
+ z-index: 1;
+ }
#hero-graphic{
position: relative;
display: inline-block;
width: 499px;
height: 340px;
- margin: 120px auto;
+ margin: 120px auto 40px;
+ z-index: 2;
#hero-logotype{
position: absolute;
display: inline-block;
- top: 75px;
- left: 187px;
+ top: 75px;
+ left: 50%;
width: 115px;
height: 155px;
+ margin-left: -60px;
background: image-url('../images/hero-logotype.png') 0 0 no-repeat;
@include img-retina("../images/hero-logotype.png", "../images/hero-logotype@2x.png", 115px, 155px);
}
@@ -63,7 +82,26 @@
#hero-text{
position: relative;
- text: center;
+
+ &:before{
+ content: '';
+ position: absolute;
+ top: -40px;
+ left: 50%;
+ width: 800px;
+ height: 800px;
+ margin-left: -400px;
+ border-radius: 4px;
+ opacity: .78;
+ background-color: $white;
+ z-index: 1;
+ }
+
+ #hero-text-content{
+ position: relative;
+ z-index: 2;
+ padding-bottom: 40px;
+ }
h1{
color: $blue-dark;
diff --git a/website/source/index.html.erb b/website/source/index.html.erb
index a3d8d7bd8..8bb22d4a0 100644
--- a/website/source/index.html.erb
+++ b/website/source/index.html.erb
@@ -15,11 +15,13 @@
-
Easily deploy applications at any scale
-
Any App. Any OS. Any Cloud.
-
-
Learn More
-
Try Nomad
+
+
Applications on a global fleet.
+
As simple as a Single Machine.
+