maddesigns

$base-font-size: 	16px;
$base-line-height: 	1.5;

// this value may vary for each font
// unitless value relative to 1em
$cap-height: 		0.68;


@mixin baseline($font-size, $scale: 2) {

maddesigns

// ----
// Sass (v3.3.6)
// Compass (v1.0.0.alpha.18)
// Breakpoint (v)
// ----

@import "breakpoint";
$small: 24em;
$middle: 34em;
$pair: 34em 65em;

maddesigns

		<!--[if lt IE 7]>
		<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
		<![endif]-->
		<div class="container">
			<div class="ad">
				<img src="http://placehold.it/728x90&text=superbanner" alt="">
			</div>
			<header role="banner">
				<h1>position: sticky header</h1>
			</header>

maddesigns

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----


// @mixin x-rgba()
//
// RGBA IE fallback
// based on http://thesassway.com/intermediate/mixins-for-semi-transparent-colors

maddesigns

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

@function strip-units($number) {
  @return $number / ($number * 0 + 1);
}

@mixin nth-child($an: 2n, $sibling: "*", $count: 15) {

maddesigns

<div class="list-item">1</div>
<div class="list-item">2</div>
<div class="list-item">3</div>
<div class="list-item">4</div>
<div class="list-item">5</div>
<div class="list-item">6</div>
<div class="list-item">7</div>
<div class="list-item">8</div>
<div class="list-item">9</div>

maddesigns

<div>1</div>
<div>2</div> 
<div>3</div> 
<div>4</div> 
<div>5</div> 
<div>6</div>
<div>7</div>
<div>8</div> 
<div>9</div> 
<div>10</div> 

maddesigns

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.7)
// ----

=e($name)
  @at-root #{&}__#{$name}
    @content
=m($name)
  @at-root #{&}--#{$name}

maddesigns

<div>1</div>
<div>2</div> 
<div>3</div> 
<div>4</div> 
<div>5</div> 
<div>6</div>
<div>7</div>
<div>8</div> 
<div>9</div> 
<div>10</div> 

maddesigns

	<ul class="plan-legend">
		<li class="legend-color1">Item 1</li>
		<li class="legend-color2">Item 2</li>
		<li class="legend-color3">Item 3</li>
		<li class="legend-color4">Item 4</li>
		<li class="legend-color5">Item 5</li>
		<li class="legend-color6">Item 6</li>
	</ul>