/// /// Prototype by Pixelarity /// pixelarity.com | hello@pixelarity.com /// License: pixelarity.com/license /// /* Features */ .features { @include vendor('display', 'flex'); @include vendor('flex-wrap', 'wrap'); margin: -1em 0 _size(element-margin) -1em; width: calc(100% + 1em); section { @include padding(3em, 3em); border-radius: _size(border-radius); margin: 1em 0 0 1em; text-align: center; width: calc(33.33333% - 1em); } @include breakpoint('<=large') { section { @include padding(3em, 2em); } } @include breakpoint('<=medium') { section { width: calc(50% - 1em); } } @include breakpoint('<=small') { section { @include padding(3em, 1.5em); } } @include breakpoint('<=xsmall') { display: block; margin: 0 0 _size(element-margin) 0; width: 100%; section { margin: 0 0 1em 0; width: 100%; } } } @mixin color-features($p: null) { .features { section { @if $p == null { background-color: _palette(bg); border-bottom: solid 1px darken(_palette(bg-alt), 5); } @else { background-color: mix(_palette($p, bg), _palette($p, fg-bold), 90%); border-bottom: none; } } } } @include color-features;