123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- ///
- /// Stellar by HTML5 UP
- /// html5up.net | @ajlkn
- /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
- ///
-
- /* Section/Article */
-
- section, article {
- &.special {
- text-align: center;
- }
- }
-
- header {
- &.major {
- margin-bottom: (_size(element-margin) * 1.5);
-
- h2 {
- font-size: 2em;
-
- &:after {
- display: block;
- content: '';
- width: 3.25em;
- height: 2px;
- margin: (_size(element-margin) * 0.35) 0 (_size(element-margin) * 0.5) 0;
- border-radius: 2px;
-
- section.special &, article.special & {
- margin-left: auto;
- margin-right: auto;
- }
- }
- }
-
- p {
- font-size: 1.25em;
- letter-spacing: _font(letter-spacing);
- }
-
- &.special {
- text-align: center;
-
- h2 {
- &:after {
- margin-left: auto;
- margin-right: auto;
- }
- }
- }
- }
- }
-
- footer {
- &.major {
- margin-top: (_size(element-margin) * 1.5);
- }
- }
-
- @include breakpoint('<=small') {
- header {
- &.major {
- margin-bottom: 0;
-
- h2 {
- font-size: 1.5em;
- }
-
- p {
- font-size: 1em;
- letter-spacing: 0;
-
- br {
- display: none;
- }
- }
- }
- }
-
- footer {
- &.major {
- margin-top: 0;
- }
- }
- }
-
- @mixin color-section($p: null) {
- header {
- &.major {
- h2 {
- &:after {
- background-color: _palette($p, border);
-
- @if $p == 'invert' {
- @include vendor('background-image', 'linear-gradient(90deg, #{_palette(accent1)}, #{_palette(accent3)}, #{_palette(accent5)})');
- }
- }
- }
- &.secondary {
- h2 {
- text-align: right;
- &:after {
- position:relative;
- left: 88%;
- }
- }
- }
- }
- }
- }
-
- @include color-section;
|