@import normalize

// leaverou.github.com/contrast-ratio/#%23444459-on-%23F9F9F9 $foreground-color: #444459 $background-color: #F9F9F9

@import compass/css3/border-radius @import compass/css3/box-shadow @import compass/css3/text-shadow @import compass/typography/lists

@mixin shadow($color: $foreground-color, $offset: 0)

@include single-text-shadow($color, $offset, $offset, $offset + 1px)

html

background-color: lighten($background-color, 5%)

body

@include border-bottom-left-radius
@include border-bottom-right-radius
@include box-shadow
background-color: $background-color
color: $foreground-color
margin: 0 auto
  bottom: 1rem
padding: 20px
max-width: 960px

.site-title, .site-subtitle

display: block

.site-title

@include shadow(lighten($foreground-color, 10%), 1px)
font-size: 3rem

.site-subtitle

@include shadow
font-size: 2rem

@for $level from 1 through 6

h#{$level}
  @include shadow

h, .h

@include shadow
font-size: 1.8rem

menu

background-color: darken($foreground-color, 5%)
color: darken($background-color, 5%)
li
  margin: 0
  padding: 0
  a
    margin: 0 0.25rem
    padding: 0.5rem
    text-decoration: none
    &:active,
    &:hover
      background-color: lighten(darken($foreground-color, 5%), 10%)
  &:first-child
    a
      margin-left: 0
  &:last-child
    a
      margin-right: 0
  &,
  a
    @include inline-block
    color: darken($background-color, 5%)

.post

@include border-radius
@include box-shadow($foreground-color, 3px)
border: 0.1rem solid $foreground-color
margin: 1rem 0
padding: 0.5rem
&:hover
  background-color: lighten($background-color, 5%)

code

background-color: darken($background-color, 10%)
color: $foreground-color