@import 'fonts'; @import 'colors'; * { font-family: Montserrat, sans-serif; color: $text-color; box-sizing: border-box; margin: 0; padding: 0; } body { background: $background; } header { margin-bottom: 1em; } main { max-width: 1200px; margin: auto; } h1, h2, h3, h4, h5, h6, p { margin-bottom: 0.5em; padding: 0 0.5rem; } h1, h2, h3, h4, h5, h6 { font-family: Orbitron, sans-serif; font-weight: 900; text-transform: uppercase; } h1 { border-bottom: 2px $text-color solid; } a { text-decoration: none; } figure { margin-bottom: 1rem; img { max-width: 100%; display: block; margin: 0 auto; } figcaption { display: none; } } .nav { max-width: 1200px; margin: 0 auto; padding: 0.5em; display: flex; flex-direction: column; justify-content: space-between; @media screen and (min-width: 800px) { flex-direction: row; hr { margin: 0 0.5em !important; align-self: center; } } hr { margin: 0.5em 40%; } .nav-logo { margin: 0 auto; @media screen and (min-width: 800px) { margin-left: 0; } img { width: 48px; display: block; } } .nav-link { align-self: center; padding: 0.5em; &.nav-link-active { } } }