/* Imports --------------------------*/ @import 'normalize'; @import 'mixins'; @import 'defaults'; /* @import 'fluidity'; @import 'font-awesome'; */ /* Content --------------------------*/ body { background-color: #fff0de; color: #683800; font-family: $font-sans-serif; } h1, h2, h3 { font-family: $font-sans-serif; font-weight: 700; line-height: 1.2em; margin: 0.4em 0em; } p { line-height: 1.4em; padding: 0.5em 0; } ul { li { list-style: disc; margin: 0.3em 0em 0.3em 0.5em; list-style-position: inside; list-style-type:square; font-size: 1em; } } $linkcolor: #663700; a { color: $linkcolor; @include transition(color 0.2s ease); &:hover, &:active, &:focus{ color: lighten($linkcolor, 15%); } &:active { position: relative; top: 1px; } } /* Header --------------------------*/ /* #instantclick-bar { background: #ff0000; } */ h1, h2 { font-family: $font-serif; text-align: center; } h1 { font-size: 3em; } h2 { font-size: 1.7em; } h3 { margin-top: 1em; font-family: $font-mono; } .bobble { width: 100%; text-align: center; img { margin: 10px auto 0; width: 200px; } } /* Content --------------------------*/ .container { font-family: $font-mono; margin-bottom: 2em; } table tbody { td { padding: 0.3em 0; &:nth-child(odd) { padding-right: 0.7em; } } } /* Responsive Stuff --------------------------*/ @media screen and (max-width: 980px) { .column.full, .column.two-thirds, .column.half { float: none; margin: 0; width: 100%; } .column.one-third, .column.one-fourth { float: left; margin: 0; width: 50%; } } @media screen and (max-width: 480px) { .column.one-third, .column.one-fourth { float: left; margin: 0; width: 100%; } }