html
font-family: $base-font-family font-size: 2.8vw font-weight: 400 background-color: $backgroud-color color: $text-color height: 100% line-height: 1.55
body
box-sizing: border-box border-top: .5rem solid $theme-color align-items: center display: flex flex-direction: column min-height: 100% margin: 0 width: 100% & main flex: 1
header, main, footer
max-width: 650px width: 92%
h1
margin: 1rem 0 font-size: 1.4rem font-weight: 500
h2
font-size: 1rem font-weight: 700 padding-top: .75rem
h3
font-size: .8rem font-weight: 700 letter-spacing: .05em padding-top: .75rem text-transform: uppercase
h4, h5, h6
font-size: .8rem font-weight: 700 letter-spacing: .04em padding-top: .75rem
a
color: $text-color text-decoration: none transition: color 200ms &:hover color: $theme-color
p
margin: 0 0 .75em 0 & a font-size: 0.75em font-weight: 400 letter-spacing: 0.04rem padding: 0 .05em text-transform: uppercase
figure
margin: 0
pre, code
background-color: $code-background-color border-radius: 2px
pre
overflow: auto padding: .5rem 1rem
code
border-radius: 2px font-family: $code-font-family font-size: .75rem margin: 0 .05em padding: .1em .2em
blockquote
font-style: italic font-size: .9rem padding: .5rem 0
img
height: auto max-width: 100%
@media all and (max-width:520px)
html font-size: 16px
@media all and (min-width:700px)
html font-size: 20px