3 /// html5up.net | @ajlkn
4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
10 @include vendor('display', 'flex');
11 @include vendor('flex-wrap', 'wrap');
12 border-top: 0 !important;
15 border-top: 0 !important;
19 @include vendor('align-items', 'center');
20 @include vendor('display', 'flex');
21 @include vendor('transition', (
22 'transform 0.25s ease',
25 '-webkit-filter 1s ease'
27 @include padding(4em, 4em);
28 background-position: center;
29 background-repeat: no-repeat;
30 background-size: cover;
53 color: inherit !important;
69 @include vendor('transition', 'opacity 0.5s ease');
82 background-color: transparentize(_palette_light(bg), 0.75);
91 @media screen and (prefers-color-scheme: dark) {
92 background-color: transparentize(_palette_dark(bg), 0.75);
103 @include vendor('transform', 'scale(0.95)');
104 @include vendor('filter', 'blur(0.5em)');
109 &:nth-child(4n - 2) {
113 &:nth-child(6n - 5) {
115 background-color: _palette_light(accent1);
116 @media screen and (prefers-color-scheme: dark) {
117 background-color: _palette_dark(accent1);
122 &:nth-child(6n - 4) {
124 background-color: _palette_light(accent2);
125 @media screen and (prefers-color-scheme: dark) {
126 background-color: _palette_dark(accent2);
131 &:nth-child(6n - 3) {
133 background-color: _palette_light(accent3);
134 @media screen and (prefers-color-scheme: dark) {
135 background-color: _palette_dark(accent3);
140 &:nth-child(6n - 2) {
142 background-color: _palette_light(accent4);
143 @media screen and (prefers-color-scheme: dark) {
144 background-color: _palette_dark(accent4);
149 &:nth-child(6n - 1) {
151 background-color: _palette_light(accent5);
152 @media screen and (prefers-color-scheme: dark) {
153 background-color: _palette_dark(accent5);
160 background-color: _palette_light(accent6);
161 @media screen and (prefers-color-scheme: dark) {
162 background-color: _palette_dark(accent6);
168 @include breakpoint('<=large') {
170 @include padding(4em, 3em);
177 @include breakpoint('<=medium') {
179 width: 50% !important;
183 @include breakpoint('<=small') {
185 @include padding(3em, 1.5em);
196 @include breakpoint('<=xsmall') {
201 width: 100% !important;