--- --- @import 'libs/vars'; @import 'libs/functions'; @import 'libs/mixins'; @import "libs/_font-awesome/font-awesome"; @import url("../fonts/opensans-google.css"); /* Spectral by HTML5 UP html5up.net | @ajlkn Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) */ @import 'libs/skel'; @include skel-breakpoints(( xlarge: '(max-width: 1680px)', large: '(max-width: 1280px)', medium: '(max-width: 980px)', small: '(max-width: 736px)', xsmall: '(max-width: 480px)' )); @include skel-layout(( reset: 'full', boxModel: 'border', grid: ( gutters: 1.5em ) )); @import 'components/basic'; @import 'components/section'; @import 'components/form'; @import 'components/box'; @import 'components/image'; @import 'components/list'; @import 'components/table'; @import 'components/button'; @import 'components/features'; @import 'components/spotlight'; @import 'components/wrapper'; @import 'components/menu'; @import 'components/header'; @import 'components/banner'; @import 'components/cta'; /* Main */ #main { > header { @include padding(12em, 0); @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../assets/images/banner.jpg")')); background-attachment: fixed; background-position: center center; background-repeat: no-repeat; background-size: cover; text-align: center; h2 { font-size: 1.75em; margin: 0 0 (_size(element-margin) * 0.25) 0; } p { color: inherit; letter-spacing: _size(letter-spacing-alt); text-transform: uppercase; top: 0; a { color: inherit; } } @include breakpoint(xlarge) { @include padding(10em, 0); } @include breakpoint(large) { @include padding(8em, 3em); } @include breakpoint(medium) { @include padding(10em, 3em); } @include breakpoint(small) { @include padding(5em, 3em); h2 { font-size: 1.25em; margin: 0 0 (_size(element-margin) * 0.5) 0; } } } } body.is-mobile { #main { > header { background-attachment: scroll; } } } /* Footer */ #footer { @include padding(6em, 0); background-color: darken(_palette(bg), 8); text-align: center; .icons { font-size: 1.25em; a { color: _palette(fg-light); &:hover { color: _palette(fg); } } } .copyright { color: _palette(fg-light); font-size: 0.8em; letter-spacing: _size(letter-spacing-alt); list-style: none; padding: 0; text-transform: uppercase; li { border-left: solid 1px _palette(fg-light); display: inline-block; line-height: 1em; margin-left: 1em; padding-left: 1em; &:first-child { border-left: 0; margin-left: 0; padding-left: 0; } a { color: inherit; &:hover { color: _palette(fg); } } @include breakpoint(xsmall) { border: 0; display: block; line-height: 1.65em; margin: 0; padding: 0.5em 0; } } } @include breakpoint(medium) { @include padding(4em, 3em); } @include breakpoint(small) { @include padding(3em, 2em); } } /* Landing */ body.landing { #page-wrapper { @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../assets/images/banner.jpg")')); background-attachment: fixed; background-position: center center; background-repeat: no-repeat; background-size: cover; padding-top: 0; } #page-wrapper { padding-top: 0; } #footer { background-color: darken(transparentize(_palette(bg), 0.1), 8); } } body.is-mobile { &.landing { #page-wrapper { background: none; } #banner, .wrapper.style4 { @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../assets/images/banner.jpg")')); background-position: center center; background-repeat: no-repeat; background-size: cover; } #footer { background-color: darken(_palette(bg), 8); } } }