/** * Variables **/ @use "sass:meta"; @use 'variables'; /** * Fonts **/ @use 'fonts'; /** * Reset **/ @use 'normalize'; @use 'skeleton'; /** * Defaults **/ a { text-decoration: none; &:link { color: variables.$a-link; } &:hover { color: variables.$a-hover; text-decoration: underline; } &:active { color: variables.$a-active; } &:visited { color: variables.$a-visited; } } img { max-width: 100%; } @keyframes fade-in { from { opacity: 0.2; } to { opacity: 1; } } @keyframes fade-out { from { opacity: 1; } to { opacity: 0.2; } } /** * Layout **/ @include meta.load-css('header'); @include meta.load-css('main'); @include meta.load-css('aside'); @include meta.load-css('footer'); @include meta.load-css('branding'); /** * Page overrides **/ @include meta.load-css('gfx'); @include meta.load-css('txt'); @include meta.load-css('vda'); @include meta.load-css('vdo'); /* Move internal links past the header */ body.txt :target, body.gfx :target, body.vda :target, body.vdo :target { padding-top: 12.5rem; } /** * Languages **/ @charset 'UTF-8'; html[lang='en'] :lang(fr) { display: none !important; } html[lang='fr'] :lang(en) { display: none !important; } :lang(en) { quotes: '\201C' '\201D' '\2018' '\2019'; } :lang(fr) { quotes: '« ' ' »'; }