3 /// html5up.net | @ajlkn
4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
10 @include vendor('align-items', 'center');
11 @include vendor('background-image', 'url("../bg/bg2.jpg")');
12 @include vendor('display', 'flex');
13 @include padding(4em, 0, (2em, 0, 0, 0));
14 background-attachment: fixed;
15 background-position: center;
16 background-repeat: no-repeat;
17 background-size: cover;
18 border-bottom: 0 !important;
21 margin-bottom: -5.25em;
28 @include vendor('transition', 'opacity #{_duration(banner)} ease');
29 @include vendor('transition-delay', '0.75s');
30 @include vendor('pointer-events', 'none');
31 background-color: _palette_light(bg);
41 @media screen and (prefers-color-scheme: dark) {
42 background-color: _palette_dark(bg);
51 @include vendor('transition', (
53 'transform 0.5s ease-out',
55 '-webkit-filter 0.5s ease'
57 padding: 0 !important;
78 @include vendor('display', 'flex');
79 @include vendor('align-items', 'center');
80 margin: 0 0 _size(element-margin) 0;
93 font-weight: _font(weight-bold);
94 letter-spacing: _font(letter-spacing-alt);
95 text-transform: uppercase;
110 &.style1 { &:after { background-color: _palette_light(accent1); } }
111 &.style2 { &:after { background-color: _palette_light(accent2); } }
112 &.style3 { &:after { background-color: _palette_light(accent3); } }
113 &.style4 { &:after { background-color: _palette_light(accent4); } }
114 &.style5 { &:after { background-color: _palette_light(accent5); } }
115 &.style6 { &:after { background-color: _palette_light(accent6); } }
117 @media screen and (prefers-color-scheme: dark) {
118 &.style1 { &:after { background-color: _palette_dark(accent1); } }
119 &.style2 { &:after { background-color: _palette_dark(accent2); } }
120 &.style3 { &:after { background-color: _palette_dark(accent3); } }
121 &.style4 { &:after { background-color: _palette_dark(accent4); } }
122 &.style5 { &:after { background-color: _palette_dark(accent5); } }
123 &.style6 { &:after { background-color: _palette_dark(accent6); } }
132 @include vendor('filter', 'blur(0.125em)');
133 @include vendor('transform', 'translateX(-0.5em)');
138 @include breakpoint('<=large') {
139 background-attachment: scroll;
142 @include breakpoint('<=small') {
143 @include padding(3em, 0, (2em, 0, 0, 0));
145 margin-bottom: -2.75em;
160 margin-bottom: _size(element-margin);
172 @include breakpoint('<=xsmall') {
173 @include padding(4em, 0, (2em, 0, 0, 0));
186 @include padding(6em, 0, (2em, 0, 0, 0));