* { -webkit-box-sizing: border-box; box-sizing: border-box; } body { font-family: $default_font, sans-serif; line-height: 1.75em; font-size: 16pt; background-color: $background_color; color: $font_color; margin-left: auto; margin-right: auto; width: 90%; min-width: 400px; } p { font-size: 16pt; } h1 { font-size: 30pt; line-height: 34px; } h2 { font-size: 22pt; line-height: 25px; } h3 { font-size: 18pt; line-height: 27px; padding-top: 15px; padding-bottom: 15px; border-bottom: 1px solid #D8D8D8; border-top: 1px solid #D8D8D8; } hr { height: 1px; background-color: #d8d8d8; border: none; width: 100%; margin: 0px; } a[href] { color: #1e8ad6; &:hover { color: #3ba0e6; } } img { max-width: 100%; height: auto; } li { line-height: 1.5em; } aside { max-width: 90%; margin: 0 auto; border: 1px solid lightgrey; padding: 5px 15px; } [class *= "sidebar"] { max-width: 90%; margin: 0 auto; border: 1px solid lightgrey; padding: 5px 15px; } [id *= "sidebar"] { max-width: 90%; margin: 0 auto; border: 1px solid lightgrey; padding: 5px 15px; } @media (min-width: 1201px) { body { width: 1150px; } } @media (min-width: 1921px) { body { font-size: 24pt; width: 1500px; } p { font-size: 24pt; } h1 { font-size: 50pt; } h2 { font-size: 42pt; } h3 { font-size: 30pt; } }