$brown: #201a11; $brown: #222; $light: #ccc; $orange: #b53a04; $link_color: #b53a04; $headline_font_serif: mffweb, Georgia, 'Times New Roman', serif; $fancy_serif: mffweb, Georgia, 'Times New Roman', serif; $fancy_sans: mffnweb, Helvetica, sans-serif; $body_p_font: normal 100% / 1.5 Georgia, Cambria, "Times New Roman", Times, serif; $body_font_color: $brown; $body_font_light: #b3aeae; $secondary-link-color: #838383; $archive_p_line_height: 1.6; //$light; $narrow-beta-width: 720px; $narrow-max-width: 750px; $max_width: 1440px; @mixin smcaps { @include fancy_sans; text-transform: uppercase; letter-spacing: 1px; } @mixin plain_a { border: none; text-decoration: none; color: $body_font_color; } @function calc-rem($size) { $remsize: $size/16; @return #{$remsize}rem; } @mixin fontsize($size) { font-size: $size + px; font-size: calc-rem($size); } @function calc-em($target-px, $context) { @return $target-px / $context * 1em; } @mixin img_plain { padding: 0; max-width: 100%; background: none; } @mixin generic-sans { font-family: sans-serif; } @mixin fancy-sans { font-family: mffnweb, Helvetica, sans-serif; } @mixin fancy-sans-bold { font-family: mffnbweb, Helvetica, sans-serif; font-weight: 700; } @mixin fancy-serif { font-family: Georgia, Palatino, serif; } %clearfix { *zoom: 1; &:before { content: " "; display: table; } &:after { content: " "; display: table; clear: both; } } @mixin transparent_class { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; filter: alpha(opacity = 90); opacity: 0.9; } @mixin faded_line_after { display: block; content: ""; margin-top: 3em; height: 1px; width: 100%; background: -webkit-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0)); background: -moz-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0)); background: -o-linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0)); background: linear-gradient(left, rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0)); } //for overriding the above on dark pages: @mixin light_faded_line_after { background: -webkit-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); background: -moz-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); background: -o-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); background: linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); } @mixin lighter_faded_line_after { background: -webkit-linear-gradient(left, rgba(243,237,219,.1),rgba(243,237,219,0.3),rgba(243,237,219,.1)); background: -moz-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); background: -o-linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); background: linear-gradient(left, rgba(243,237,219,0),rgba(243,237,219,0.1),rgba(243,237,219,0)); } //generic constrain function @mixin constrain($size) { max-width: $size; margin-left: auto; margin-right: auto; } //set an element to centered, narrowish column width //used mostly on columns of text @mixin constrain_narrow() { max-width: 90%; margin-left: auto; margin-right: auto; @include breakpoint(beta) { max-width: $narrow-beta-width; } @include breakpoint(gamma) { max-width: $narrow-max-width; } } @mixin constrain_archive() { max-width: 94%; margin-left: auto; margin-right: auto; @include breakpoint(alpha) { max-width: 380px; float: left; } @include breakpoint(gamma) { max-width: 680px; } } //set an element to centered, wideish column width @mixin constrain_wide() { max-width: 90%; margin-left: auto; margin-right: auto; @include breakpoint(gamma) { max-width: $breakpoint-gamma; } @include breakpoint(delta) { max-width: $breakpoint-delta; } @include breakpoint(epsilon) { max-width: $max_width; } }