header {
position: sticky; top: 0; z-index: 1; padding: $spacing-unit / 3 0; a { color: $text-color !important; transition: 0.2s all ease; text-decoration: none; } a:hover { color: $brand-color !important; text-decoration: none; } .header--container { display: flex; align-content: center; * { margin-right: $spacing-unit; } .logo { font-weight: 400; @media screen and (max-width: $on-palm) { display: none; } } } h5 { margin: 0; color: $text-color; mix-blend-mode: exclusion; }
}
header img {
height: 25px; width: auto;
}
post–cover {
background-color: $brand-color; background-size: cover; background-repeat: no-repeat; background-position: center; width: 100vw; height: 60vh; position: relative; left: calc(-50vw + 50%); top: -$spacing-unit * 2.5; display: flex; align-items: center; justify-content: center; vertical-align: middle; flex-wrap: wrap; color: #FFFFFF; * { text-align: center; margin: 0 $spacing-unit / 2; } .post-title { text-align: center; @include relative-font-size(3); line-height: 110%; color: $grey-color-light; font-weight: 700; margin: auto; margin-top: 1rem; margin-bottom: 1rem; } h2 { @include relative-font-size(2); width: 95%; text-align: center; margin: auto; color: $grey-color-light; line-height: 1.1; }
}