awayken

/***
Forgotten English
A CSS experiment. Just mimicking my one-a-day calendar, called Forgotten English.
***/

/** Get our font **/
@import url(http://fonts.googleapis.com/css?family=IM+Fell+English:400,400italic|IM+Fell+English+SC|Cardo:400,400italic);

/** reset, normalize.css from jsFiddle **/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}

awayken

/***
    Typografaces
    Some faces done in pure CSS and typography.
***/

.toolbox { padding: 0.5em 1em; margin: 0 0 1em 0; border: 1px solid #ddd; border-radius: 8px; background: #000; font-size: medium; }
.toolbox a { display: inline-block; margin: 0 8px; color: white; text-decoration: none; }

/***
    Typografaces

awayken

/**
 * Qualitest® - an ugly package redone in CSS.
 */
body { color: #000; background: #fff; }
.qualitest { width: 900px; padding-bottom: 9px; background: gold; font-size: 1.2em; font-family: 'Arial Black', arial, sans-serif; }
.qualitest .code { padding: 0 10px; }
.qualitest h1 { width: 80%; margin: 0 0 0.5em 0; padding: 0 10px; line-height: 1; font-size: 2em; font-weight: normal; text-transform: uppercase; }
.qualitest strong { display: inline-block; height: 34px; padding: 0 6px 0 10px; vertical-align: bottom; color: #fff; background: #000; font-family: arial; font-weight: bold; font-size: 0.8em; letter-spacing: 4px; line-height: 32px }
.qualitest .details { padding: 0 10px; }
.qualitest .details span:first-child { float: none; }

awayken

/**
 * On the move. The Chevrolet '70s.
 */

awayken

/**
 * CSS3 Ligatures and Kerning Pairs
 */
@import url(http://fonts.googleapis.com/css?family=Lato);
@import url(http://fonts.googleapis.com/css?family=Goudy+Bookletter+1911);

body {
	font-family: Verdana;
	font-size: 0.8em;
	text-rendering: optimizeSpeed;

awayken

/**
 * Shadow Play
 */
body {
	color: #000;
	background: #fff;
	font-family: arial, sans-serif;
	font-size: 9em;
	font-weight: bold;
	letter-spacing: -10px;

awayken

<div class="sosumi">
	<p class="copyright">Copyright © 2012 Apple Inc. All rights reserved.</p>
	<ul class="piped">
		<li><a href="/legal/" class="first">Terms of Use</a></li>
		<li><a href="/legal/privacy/">Privacy Policy</a></li>
	</ul>
	<div id="worldwide">
		<a href="/choose-your-country/">
			<img src="http://images.apple.com/global/elements/flags/22x22/usa.png" alt="United States of America" height="22" width="22" />
			<span class="more">Choose your country or region</span>

awayken

/****
 * WNYC logo
 * Reference: http://www.wnyc.org/
 ****/
* {
	line-height: 1;
	margin: 0;
	padding: 0;
}
body {

awayken

component displayName="Shortcut Functions application" output="false" {
	this.name = "ShortcutFunctions";

	public void function onRequest( required template ) {
		param name="url.language" default="en";

		variables.__ = shortcutGetTranslation;

		include template;
	}

awayken

@value: #000;

.mixin {
  color: @value;
}

@value: #333;

.parametric() {
  color: @value;