diff --git a/docs/css/_home.scss b/docs/css/_home.scss index 975258e3..b7693766 100644 --- a/docs/css/_home.scss +++ b/docs/css/_home.scss @@ -48,38 +48,33 @@ html, body { /* JUMBOTRON // ------------------------- */ -.main-content .jumbotron { +.jumbotron { padding-top: 60px; background: #091724 url(../img/header-bg.png) no-repeat center center; background-size: cover; margin-bottom: 0; -} - -.jumbotron .jumbotron-header { - text-align: center; - color: #FFF; -} - -.jumbotron .jumbotron-left-column { - display: none; - padding-top: 100px; - float: left; - width: 400px; - color: #FFF; - margin-left: 120px; -} -.jumbotron .jumbotron-left-column p { - font-size: 18px; - color: #C7C4C3; -} -@media (min-width: 1200px) { - .jumbotron .jumbotron-left-column { - display: block; + .jumbotron-header { + text-align: center; + color: #FFF; + } + .jumbotron-left-column { + display: none; + padding-top: 100px; + float: left; + width: 400px; + color: #FFF; + margin-left: 120px; + p { + font-size: 18px; + color: #C7C4C3; + } + @media (min-width: 1200px) { + display: block; + } } } - /* JOIN FORM // ------------------------- */ #join-form, #join-form-2 { @@ -170,10 +165,6 @@ h2.page-section-title:after { padding-left: 20px; padding-right: 20px; font-size: 18px; - @media (min-width: 600px) { - padding-left: 120px; - padding-right: 120px; - } } #section_examples { @@ -200,6 +191,20 @@ h2.page-section-title:after { width: 100%; } } + .screen-wrapper { + position: relative; + figure.freezeframe-container { + border-radius: 3px; + } + .screen-mask { + position: absolute; + top: 0; + pointer-events: none; + } + &:hover .screen-mask{ + display: none; + } + } } #section_how h3 .how-it-works-number { diff --git a/docs/img/illus-howitworks.jpg b/docs/img/illus-howitworks.jpg index 4cabb061..0821e3e1 100644 Binary files a/docs/img/illus-howitworks.jpg and b/docs/img/illus-howitworks.jpg differ