header
Before Width: | Height: | Size: 8.4 KiB |
Before Width: | Height: | Size: 24 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 3.7 KiB |
Before Width: | Height: | Size: 7.7 KiB |
Before Width: | Height: | Size: 19 KiB |
Before Width: | Height: | Size: 34 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 4.7 KiB |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 5.9 KiB |
After Width: | Height: | Size: 3.1 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 3.3 KiB |
After Width: | Height: | Size: 3.8 KiB |
After Width: | Height: | Size: 3.7 KiB |
After Width: | Height: | Size: 5.0 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 3.1 KiB |
After Width: | Height: | Size: 2.2 MiB |
Before Width: | Height: | Size: 45 KiB |
Before Width: | Height: | Size: 134 KiB |
Before Width: | Height: | Size: 73 KiB |
Before Width: | Height: | Size: 240 KiB |
Before Width: | Height: | Size: 802 B |
Before Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 281 B |
Before Width: | Height: | Size: 590 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 361 B |
Before Width: | Height: | Size: 687 B |
Before Width: | Height: | Size: 179 B |
Before Width: | Height: | Size: 308 B |
Before Width: | Height: | Size: 9.9 KiB |
|
@ -14,12 +14,7 @@
|
||||||
<%= stylesheet_link_tag "main" %>
|
<%= stylesheet_link_tag "main" %>
|
||||||
|
|
||||||
<!-- google fonts -->
|
<!-- google fonts -->
|
||||||
<!-- <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
|
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- typekit -->
|
|
||||||
<script type="text/javascript" src="//use.typekit.net/kgv0shi.js"></script>
|
|
||||||
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
|
|
||||||
|
|
||||||
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||||
<!--[if lt IE 9]>
|
<!--[if lt IE 9]>
|
||||||
|
@ -49,9 +44,7 @@
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand logo" href="/">
|
<a class="navbar-brand logo" href="/">Terraform</a>
|
||||||
<span></span>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
|
<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
|
||||||
|
|
|
@ -99,22 +99,22 @@ body.layout-intro{
|
||||||
|
|
||||||
/*> a:hover,
|
/*> a:hover,
|
||||||
> a:focus {
|
> a:focus {
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}*/
|
}*/
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
li.active a {
|
li.active a {
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> a {
|
> a {
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,20 +4,20 @@
|
||||||
|
|
||||||
//light
|
//light
|
||||||
.rls-l{
|
.rls-l{
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-xl;
|
font-weight: @font-weight-lato-xl;
|
||||||
}
|
}
|
||||||
|
|
||||||
//semibold
|
//semibold
|
||||||
.rls-sb{
|
.rls-sb{
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
}
|
}
|
||||||
|
|
||||||
//extrabold
|
//extrabold
|
||||||
.rls-xb{
|
.rls-xb{
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
|
|
||||||
.os{
|
.os{
|
||||||
|
|
|
@ -16,16 +16,16 @@ body {
|
||||||
h1{
|
h1{
|
||||||
font-size: 42px;
|
font-size: 42px;
|
||||||
line-height: 42px;
|
line-height: 42px;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
margin-bottom: 24px;
|
margin-bottom: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3{
|
h3{
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
}
|
}
|
||||||
|
|
||||||
//an alternative color for buttons in the doc body
|
//an alternative color for buttons in the doc body
|
||||||
|
|
|
@ -39,16 +39,17 @@ body.page-sub{
|
||||||
|
|
||||||
.navbar-brand {
|
.navbar-brand {
|
||||||
&.logo{
|
&.logo{
|
||||||
padding: 13px 15px;
|
margin-top: 15px;
|
||||||
line-height: 0;
|
padding: 5px 0 0 68px;
|
||||||
|
height: 56px;
|
||||||
span{
|
line-height: 56px;
|
||||||
display: inline-block;
|
font-size: 24px;
|
||||||
width: 179px;
|
.lato-light();
|
||||||
height: 59px;
|
text-rendering: optimizeLegibility;
|
||||||
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
-webkit-font-smoothing: antialiased;
|
||||||
.img-retina("../images/consul-header-logo.png", "../images/consul-header-logo@2x.png", 179px, 59px);
|
text-transform: uppercase;
|
||||||
}
|
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
||||||
|
.img-retina("../images/header-logo.png", "../images/header-logo@2x.png", 50px, 56px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -8,9 +8,36 @@ body.page-home{
|
||||||
#features{
|
#features{
|
||||||
.anti-alias();
|
.anti-alias();
|
||||||
padding: 130px 0 0 0;
|
padding: 130px 0 0 0;
|
||||||
background: #f8f8f8 url(../images/hero-dots-below@2x.png) center top no-repeat;
|
//background: #f8f8f8 url(../images/hero-dots-below@2x.png) center top no-repeat;
|
||||||
|
background: #f8f8f8;
|
||||||
background-size: 1280px 49px;
|
background-size: 1280px 49px;
|
||||||
|
|
||||||
|
-webkit-transform: skewY(-5deg);
|
||||||
|
-moz-transform: skewY(-5deg);
|
||||||
|
-ms-transform: skewY(-5deg);
|
||||||
|
-o-transform: skewY(-5deg);
|
||||||
|
transform: skewY(-5deg);
|
||||||
|
|
||||||
|
/*transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
||||||
|
-webkit-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
||||||
|
-moz-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
||||||
|
-o-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
||||||
|
-ms-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);*/
|
||||||
|
|
||||||
|
>.container{
|
||||||
|
-webkit-transform: skewY(5deg);
|
||||||
|
-moz-transform: skewY(5deg);
|
||||||
|
-ms-transform: skewY(5deg);
|
||||||
|
-o-transform: skewY(5deg);
|
||||||
|
transform: skewY(5deg);
|
||||||
|
|
||||||
|
/*transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
||||||
|
-webkit-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
||||||
|
-moz-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
||||||
|
-o-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
||||||
|
-ms-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);*/
|
||||||
|
}
|
||||||
|
|
||||||
.double-row{
|
.double-row{
|
||||||
padding: 0 0 50px 0;
|
padding: 0 0 50px 0;
|
||||||
}
|
}
|
||||||
|
@ -19,16 +46,16 @@ body.page-home{
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
letter-spacing: 2px;
|
letter-spacing: 2px;
|
||||||
color: @purple;
|
color: @purple;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
p{
|
p{
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
color: @consul-gray;
|
color: @consul-gray;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icn{
|
.icn{
|
||||||
|
@ -141,7 +168,7 @@ body.page-home{
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
|
|
||||||
a{
|
a{
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
|
|
||||||
span{
|
span{
|
||||||
|
@ -196,8 +223,8 @@ body.page-home{
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
color: @consul-gray;
|
color: @consul-gray;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -235,8 +262,8 @@ body.page-home{
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
color: lighten(@gray-light, 15%);
|
color: lighten(@gray-light, 15%);
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
|
|
||||||
p{
|
p{
|
||||||
|
@ -244,8 +271,8 @@ body.page-home{
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
color: @consul-gray;
|
color: @consul-gray;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -298,8 +325,8 @@ body.page-home{
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
color: @gray-darker;
|
color: @gray-darker;
|
||||||
font-family: @font-family-museo;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-museo-xb;
|
font-weight: @font-weight-lato-xb;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.shell-dots{
|
ul.shell-dots{
|
||||||
|
|
|
@ -16,7 +16,8 @@
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
margin-top: @negative-hero-margin;
|
margin-top: @negative-hero-margin;
|
||||||
color: @jumbotron-color;
|
color: @jumbotron-color;
|
||||||
.consul-gradient-bg();
|
background: transparent url('../images/hero-bg.png') center center no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
|
||||||
&.mobile-hero{
|
&.mobile-hero{
|
||||||
background: transparent url( ../images/node-hero-pattern.jpg ) center center;
|
background: transparent url( ../images/node-hero-pattern.jpg ) center center;
|
||||||
|
@ -25,17 +26,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.jumbotron-dots{
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
height: 632px;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: @negative-hero-margin;
|
|
||||||
background: transparent url('../images/hero-dots.png') center @header-height no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.container{
|
.container{
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
|
@ -22,3 +22,8 @@
|
||||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#694a9c', endColorstr='#cd2028',GradientType=1 ); /* IE6-9 */
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#694a9c', endColorstr='#cd2028',GradientType=1 ); /* IE6-9 */
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.lato-light(){
|
||||||
|
font-family: @font-family-lato;
|
||||||
|
font-weight: 100;
|
||||||
|
}
|
|
@ -6,31 +6,31 @@
|
||||||
// Global values
|
// Global values
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
||||||
@jumbotron-height: 540px;
|
@jumbotron-height: 804px;
|
||||||
@header-height: 92px;
|
@header-height: 90px;
|
||||||
@jumbotron-total-height: 542px; //jumbo+header
|
@jumbotron-total-height: 804px; //jumbo+header
|
||||||
@jumbotron-color: #fff;
|
@jumbotron-color: #fff;
|
||||||
@btn-border-radius: 4px;
|
@btn-border-radius: 4px;
|
||||||
@el-border-radius: 6px;
|
@el-border-radius: 6px;
|
||||||
@negative-hero-margin: -93px;
|
@negative-hero-margin: -90px;
|
||||||
// colors
|
// colors
|
||||||
// -------------------------
|
// -------------------------
|
||||||
|
|
||||||
@white: #fff;
|
@white: #fff;
|
||||||
@black: #242424;
|
@black: #242424;
|
||||||
@gray-darker: #555;
|
@gray-darker: #555;
|
||||||
@gray: #777;
|
@gray: #777;
|
||||||
@gray-light: #939393;
|
@gray-light: #939393;
|
||||||
@gray-lighter: #979797;
|
@gray-lighter: #979797;
|
||||||
@red: #dd4e58;
|
@red: #dd4e58;
|
||||||
@red-dark: #c5454e;
|
@red-dark: #c5454e;
|
||||||
@red-darker: #b03c44;
|
@red-darker: #b03c44;
|
||||||
@tan: #f0f0e5;
|
@tan: #f0f0e5;
|
||||||
@consul-gray: #909090;
|
@consul-gray: #909090;
|
||||||
@consul-footer-gray: #d7d4d7;
|
@consul-footer-gray: #d7d4d7;
|
||||||
@purple: #69499a;
|
@purple: #69499a;
|
||||||
@light-purple: #f7f3f9;
|
@light-purple: #f7f3f9;
|
||||||
@btn-color: #4592C5;
|
@btn-color: #4592C5;
|
||||||
|
|
||||||
|
|
||||||
// Scaffolding
|
// Scaffolding
|
||||||
|
@ -45,14 +45,14 @@
|
||||||
|
|
||||||
// Typography
|
// Typography
|
||||||
// -------------------------
|
// -------------------------
|
||||||
@font-family-museo: 'museo-sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
@font-family-lato: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
@font-family-open-sans: 'Source Sans Pro', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
@font-family-open-sans: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
@font-weight-museo-xl: 100;
|
@font-weight-lato-xl: 100;
|
||||||
@font-weight-museo-reg: 300;
|
@font-weight-lato-reg: 300;
|
||||||
@font-weight-museo-sb: 500;
|
@font-weight-lato-sb: 500;
|
||||||
@font-weight-museo-xb: 700;
|
@font-weight-lato-xb: 700;
|
||||||
@font-weight-open: @font-weight-museo-reg;
|
@font-weight-open: @font-weight-lato-reg;
|
||||||
|
|
||||||
|
|
||||||
@text-shadow: 1px 1px 1px #000;
|
@text-shadow: 1px 1px 1px #000;
|
||||||
@shadow: @text-shadow;
|
@shadow: @text-shadow;
|
||||||
|
|