~xdavidwu/xdavidwu.link

2aaca380592eda3c6ed0a588247c1c3418dcd7bd — Michael Rose 11 years ago 2765f2d + 3086e9d 
Merge branch 'release/v1.1.0'
patch browse .tar.gz 
37 files changed, 5432 insertions(+), 1791 deletions(-)

M README.md
M _includes/author-bio.html
A _includes/browser-upgrade.html
D _includes/chrome-frame.html
M _includes/footer.html
M _layouts/home.html
M _layouts/page.html
M _layouts/post-index.html
M _layouts/post.html
M _posts/2011-03-10-sample-post.md
M _posts/2013-05-23-readability-feature-post.md
A _posts/2013-08-16-code-highlighting-post.md
M about.md
M articles.md
M assets/css/ie.css
M assets/css/main.css
M assets/less/1382.less
M assets/less/480.less
M assets/less/600.less
M assets/less/768.less
M assets/less/992.less
M assets/less/coderay.less
M assets/less/elements.less
M assets/less/forms.less
M assets/less/ie.less
M assets/less/main.less
M assets/less/mixins.less
M assets/less/normalize.less
M assets/less/page.less
M assets/less/pygments.less
M assets/less/site.less
D assets/less/typeplate.less
M assets/less/typography.less
M assets/less/variables.less
M images/bio-photo.jpg
M index.md
M theme-setup.md

M README.md => README.md +10 -1
@@ 28,7 28,7 @@ General notes and suggestions for customizing Minimal Mistakes.
minimal-mistakes/
├── _includes
|    ├── author-bio.html  //bio stuff goes here
|    ├── chrome-frame.html  //displays on IE8 and less
|    ├── browser-upgrade.html  //displays on IE8 and less
|    ├── footer.html  //site footer
|    ├── head.html  //site head
|    ├── navigation.html //site top nav


@@ 112,6 112,15 @@ image:

The large texture images used in *Minimal Mistakes* are from [Love Textures](http://lovetextures.com), probably a good idea to swap these out with your own photos...

If you want to apply attribution to a feature image use the following YAML front matter on posts or pages. Image credits appear directly below the feature image with a link back to the original source.

``` yaml
image:
  feature: feature-image-filename.jpg
  credit: Michael Rose #name of the person or site you want to credit
  creditlink: http://mademistakes.com #url to their site or licensing
```

#### Categories

In the sample `_posts` folder you may have noticed `category: articles` in the front matter. I like keeping all posts grouped in the same folder. If you decide to rename or add categories you will need to modify the permalink in `articles.md` along with the filename (if renaming).


M _includes/author-bio.html => _includes/author-bio.html +10 -10
@@ 1,11 1,11 @@
<img src="{{ site.url }}/images/{{ site.owner.avatar }}" class="bio-photo" alt="{{ site.owner.name }} bio photo" width="100" height="100"></a>
<h4>{{ site.owner.name }}</h4>
<img src="{{ site.url }}/images/{{ site.owner.avatar }}" class="bio-photo" alt="{{ site.owner.name }} bio photo"></a>
<h3>{{ site.owner.name }}</h3>
<p>{{ site.owner.bio }}</p>
{% if site.owner.twitter %}<p style="text-indent:0;margin-top:1.5em;"><a href="http://twitter.com/{{ site.owner.twitter }}" target="_blank"><i class="icon-twitter"></i> Twitter</a></p>{% endif %}
{% if site.owner.facebook %}<p style="text-indent:0;"><a href="http://facebook.com/{{ site.owner.facebook }}" target="_blank"><i class="icon-facebook"></i> Facebook</a></p>{% endif %}
{% if site.owner.google_plus %}<p style="text-indent:0;"><a href="{{ site.owner.google_plus }}" target="_blank"><i class="icon-google-plus"></i> Google+</a></p>{% endif %}
{% if site.owner.linkedin %}<p style="text-indent:0;"><a href="http://linkedin.com/in/{{ site.owner.linkedin }}" target="_blank"><i class="icon-linkedin"></i> LinkedIn</a></p>{% endif %}
{% if site.owner.instagram %}<p style="text-indent:0;"><a href="http://instagram.com/{{ site.owner.instagram }}" target="_blank"><i class="icon-instagram"></i> Instagram</a></p>{% endif %}
{% if site.owner.github %}<p style="text-indent:0;"><a href="http://github.com/{{ site.owner.github }}" target="_blank"><i class="icon-github"></i> Github</a></p>{% endif %}
{% if site.owner.lastfm %}<p style="text-indent:0;"><a href="http://lastfm.com/{{ site.owner.lastfm }}" target="_blank"><i class="icon-lastfm"></i> Last.fm</a></p>{% endif %}
{% if site.owner.tumblr %}<p style="text-indent:0;"><a href="http://{{ site.owner.tumblr }}.tumblr.com" target="_blank"><i class="icon-tumblr"></i> Tumblr</a></p>{% endif %}
\ No newline at end of file
{% if site.owner.twitter %}<a href="http://twitter.com/{{ site.owner.twitter }}" class="author-social" target="_blank"><i class="icon-twitter"></i> Twitter</a>{% endif %}
{% if site.owner.facebook %}<a href="http://facebook.com/{{ site.owner.facebook }}" class="author-social" target="_blank"><i class="icon-facebook"></i> Facebook</a>{% endif %}
{% if site.owner.google_plus %}<a href="{{ site.owner.google_plus }}" class="author-social" target="_blank"><i class="icon-google-plus"></i> Google+</a>{% endif %}
{% if site.owner.linkedin %}<a href="http://linkedin.com/in/{{ site.owner.linkedin }}" class="author-social" target="_blank"><i class="icon-linkedin"></i> LinkedIn</a>{% endif %}
{% if site.owner.instagram %}<a href="http://instagram.com/{{ site.owner.instagram }}" class="author-social" target="_blank"><i class="icon-instagram"></i> Instagram</a>{% endif %}
{% if site.owner.github %}<a href="http://github.com/{{ site.owner.github }}" class="author-social" target="_blank"><i class="icon-github"></i> Github</a>{% endif %}
{% if site.owner.lastfm %}<a href="http://lastfm.com/{{ site.owner.lastfm }}" class="author-social" target="_blank"><i class="icon-lastfm"></i> Last.fm</a>{% endif %}
{% if site.owner.tumblr %}<a href="http://{{ site.owner.tumblr }}.tumblr.com" class="author-social" target="_blank"><i class="icon-tumblr"></i> Tumblr</a>{% endif %}
\ No newline at end of file


A _includes/browser-upgrade.html => _includes/browser-upgrade.html +1 -0
@@ 0,0 1,1 @@
<!--[if lt IE 9]><div class="browser-upgrade alert alert-info">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</div><![endif]-->
\ No newline at end of file


D _includes/chrome-frame.html => _includes/chrome-frame.html +0 -1
@@ 1,1 0,0 @@
<!--[if lt IE 9]><div class="chrome-frame alert alert-info"><strong>Your browser is really old!</strong> <a href="http://browsehappy.com/">Why not upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better enjoy this site?</div><![endif]-->
\ No newline at end of file


M _includes/footer.html => _includes/footer.html +1 -1
@@ 1,1 1,1 @@
<h6>&copy; {{ site.time | date: '%Y' }} {{ site.owner.name }}. Powered by <a href="http://jekyllrb.com">Jekyll</a> using the <a href="http://mademistakes.com/">Minimal Mistakes</a> theme.</h6>
<span>&copy; {{ site.time | date: '%Y' }} {{ site.owner.name }}. Powered by <a href="http://jekyllrb.com">Jekyll</a> using the <a href="http://mademistakes.com/">Minimal Mistakes</a> theme.</span>


M _layouts/home.html => _layouts/home.html +6 -11
@@ 9,26 9,21 @@

<body class="home" itemscope itemtype="http://schema.org/WebPage">

{% include chrome-frame.html %}
{% include browser-upgrade.html %}

{% include navigation.html %}

<div class="image-wrap">
  <div class="headline-wrap">
    <h1>{{ page.title }}</h1>
    {% if page.tagline %}<h2>{{ page.tagline }}</h2>{% endif %}
  </div><!--/ .headline-wrap -->
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image">
</div><!-- /.image-wrap -->
{% if page.image.feature %}<div class="image-wrap">
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image" itemprop="primaryImageOfPage">
  {% if page.image.credit %}<span class="image-credit">Photo Credit: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></span>{% endif %}
</div><!-- /.image-wrap -->{% endif %}

<div class="article-author-top">
  {% include author-bio.html %}
</div>

<div id="index" itemprop="mainContentOfPage" itemscope itemtype="http://schema.org/Blog">
  <a href="{{ site.url}}/articles" class="btn btn-small pull-right">View all articles</a>
  <h3>Latest Articles</h3>
  <hr />
  <h3><a href="{{ site.url}}/articles">Articles</a></h3>
  {% for post in site.categories.articles limit:5 %}    
  <article itemscope itemtype="http://schema.org/BlogPosting" itemprop="blogPost">
    <h2 itemprop="headline"><a href="{{ site.url }}{{ post.url }}" rel="bookmark" title="{{ post.title }}">{{ post.title }}</a></h2>


M _layouts/page.html => _layouts/page.html +3 -4
@@ 9,12 9,13 @@

<body class="page" itemscope itemtype="http://schema.org/WebPage">

{% include chrome-frame.html %}
{% include browser-upgrade.html %}

{% include navigation.html %}

{% if page.image.feature %}<div class="image-wrap">
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image" itemprop="primaryImageOfPage">
  {% if page.image.credit %}<span class="image-credit">Photo Credit: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></span>{% endif %}
</div><!-- /.image-wrap -->{% endif %}

<div id="main" role="main"  itemprop="mainContentOfPage">


@@ 22,9 23,7 @@
    {% include author-bio.html %}
  </div>
  <article itemscope itemtype="http://schema.org/CreativeWork">
    <div class="headline-wrap">
      <h1 itemprop="headline">{{ page.title }}</h1>
    </div><!--/ .headline-wrap -->
    <h1 itemprop="name">{{ page.title }}</h1>
    <div class="article-wrap" itemprop="text">
      {{ content }}
    </div><!-- /.article-wrap -->


M _layouts/post-index.html => _layouts/post-index.html +6 -10
@@ 9,33 9,29 @@

<body class="articles" itemscope itemtype="http://schema.org/WebPage">

{% include chrome-frame.html %}
{% include browser-upgrade.html %}

{% include navigation.html %}

<div class="image-wrap">
  <div class="headline-wrap">
    <h1>{{ page.title }}</h1>
    {% if page.tagline %}<h2 class="hidden-phone">{{ page.tagline }}</h2>{% endif %}
  </div><!--/ .headline-wrap -->
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image">
</div><!-- /.image-wrap -->
{% if page.image.feature %}<div class="image-wrap">
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image" itemprop="primaryImageOfPage">
  {% if page.image.credit %}<span class="image-credit">Photo Credit: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></span>{% endif %}
</div><!-- /.image-wrap -->{% endif %}

<div class="article-author-top">
  {% include author-bio.html %}
</div>

<div id="index" itemprop="mainContentOfPage" itemscope itemtype="http://schema.org/Blog">
  <h1 itemprop="name">{{ page.title }}</h1>
  {% for post in site.posts %}  
  {% unless post.next %}
    <h3>{{ post.date | date: '%Y' }}</h3>
    <hr />
    {% else %}
      {% capture year %}{{ post.date | date: '%Y' }}{% endcapture %}
      {% capture nyear %}{{ post.next.date | date: '%Y' }}{% endcapture %}
      {% if year != nyear %}
        <h3>{{ post.date | date: '%Y' }}</h3>
        <hr />
      {% endif %}
    {% endunless %}
    <article itemscope itemtype="http://schema.org/BlogPosting" itemprop="blogPost">


M _layouts/post.html => _layouts/post.html +4 -3
@@ 9,12 9,13 @@

<body class="article" itemscope itemtype="http://schema.org/WebPage">

{% include chrome-frame.html %}
{% include browser-upgrade.html %}

{% include navigation.html %}

{% if page.image.feature %}<div class="image-wrap">
  <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }} feature image" itemprop="primaryImageOfPage">
  {% if page.image.credit %}<span class="image-credit">Photo Credit: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></span>{% endif %}
</div><!-- /.image-wrap -->{% endif %}

<div id="main" role="main" itemprop="mainContentOfPage" itemscope itemtype="http://schema.org/Blog">


@@ 23,7 24,7 @@
  </div>
  <article itemscope itemtype="http://schema.org/BlogPosting" itemprop="blogPost">
    <div class="headline-wrap">
      <h1 itemprop="headline">{{ page.title }}</h1>
      <h1 itemprop="name">{{ page.title }}</h1>
      <h2>{{ page.tagline }}</h2>
    </div><!--/ .headline-wrap -->
    <div class="article-wrap" itemprop="text">


@@ 40,7 41,7 @@
</div><!-- /#main -->

<div class="footer-wrap">
  {% if site.related_posts.size %}<div class="related-articles">
  {% if site.related_posts.size > 0 %}<div class="related-articles">
  <h4>You might also enjoy <small class="pull-right">(<a href="{{ site.url }}/articles">View all articles</a>)</small></h4>
    <ul>
    {% for post in site.related_posts limit:3 %}


M _posts/2011-03-10-sample-post.md => _posts/2011-03-10-sample-post.md +4 -8
@@ 7,6 7,8 @@ category: articles
tags: [intro, beginner, jekyll, tutorial]
image:
  feature: texture-feature-05.jpg
  credit: Texture Lovers
  creditlink: http://texturelovers.com
---

<section id="table-of-contents" class="toc">


@@ 40,7 42,7 @@ Below is just about everything you'll need to style in the theme. Check the sour
Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.

![Smithsonian Image]({{ site.url }}/images/3953273590_704e3899d5_m.jpg)
{: .pull-right}
{: .image-pull-right}

*This is emphasized*. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H2O. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times (That’s a citation). Underline.Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.



@@ 93,10 95,4 @@ HTML and CSS are our tools. Mauris a ante. Suspendisse quam sem, consequat at, c

Make any link standout more when applying the `.btn` class.

<div markdown="0"><a href="#" class="btn">This is a button</a></div>

<div markdown="0"><a href="#" class="btn btn-inverse">This is an inverse button</a></div>

<div markdown="0"><a href="#" class="btn btn-small">This is small button</a></div>

<div markdown="0"><a href="#" class="btn btn-inverse btn-small">Small inverse button</a></div>
<div markdown="0"><a href="#" class="btn">This is a button</a></div>
\ No newline at end of file


M _posts/2013-05-23-readability-feature-post.md => _posts/2013-05-23-readability-feature-post.md +2 -0
@@ 7,6 7,8 @@ category: articles
tags: [sample post, readability, test]
image:
  feature: texture-feature-04.jpg
  credit: Texture Lovers
  creditlink: http://texturelovers.com
---

This is a sample post with a large feature image[^1] up top and tons of text. Odio ad blue bottle vinyl, 90's narwhal commodo bitters pour-over nostrud. Ugh est hashtag in, fingerstache adipisicing laboris esse Pinterest shabby chic Portland. Shoreditch bicycle rights anim, flexitarian laboris put a bird on it vinyl cupidatat narwhal. Hashtag artisan skateboard, flannel Bushwick nesciunt salvia aute fixie do plaid post-ironic dolor McSweeney's. Cliche pour-over chambray nulla four loko skateboard sapiente hashtag.


A _posts/2013-08-16-code-highlighting-post.md => _posts/2013-08-16-code-highlighting-post.md +114 -0
@@ 0,0 1,114 @@
---
layout: post
title: Syntax Highlighting Post
description: "Demo post displaying the various ways of highlighting code in Markdown."
category: articles
tags: [sample post, code, highlighting]
---

[Syntax highlighting](http://en.wikipedia.org/wiki/Syntax_highlighting) is a feature that displays source code, in different colors and fonts according to the category of terms. This feature facilitates writing in a structured language such as a programming language or a markup language as both structures and syntax errors are visually distinct. Highlighting does not affect the meaning of the text itself; it is intended only for human readers.

### Pygments Code Blocks

To modify styling and highlight colors edit `/assets/less/pygments.less` and compile `main.less` with your favorite preprocessor. Or edit `main.css` if that's your thing, the classes you want to modify all begin with `.highlight`.

{% highlight css %}
#container {
    float: left;
    margin: 0 -240px 0 0;
    width: 100%;
}
{% endhighlight %}

Line numbering enabled:

{% highlight html linenos %}
{% raw %}
<nav class="pagination" role="navigation">
    {% if page.previous %}
        <a href="{{ site.url }}{{ page.previous.url }}" class="btn" title="{{ page.previous.title }}">Previous article</a>
    {% endif %}
    {% if page.next %}
        <a href="{{ site.url }}{{ page.next.url }}" class="btn" title="{{ page.next.title }}">Next article</a>
    {% endif %}
</nav><!-- /.pagination -->
{% endraw %}
{% endhighlight %}

{% highlight ruby %}
module Jekyll
  class TagIndex < Page
    def initialize(site, base, dir, tag)
      @site = site
      @base = base
      @dir = dir
      @name = 'index.html'
      self.process(@name)
      self.read_yaml(File.join(base, '_layouts'), 'tag_index.html')
      self.data['tag'] = tag
      tag_title_prefix = site.config['tag_title_prefix'] || 'Tagged: '
      tag_title_suffix = site.config['tag_title_suffix'] || '&#8211;'
      self.data['title'] = "#{tag_title_prefix}#{tag}"
      self.data['description'] = "An archive of posts tagged #{tag}."
    end
  end
end
{% endhighlight %}


### Standard Code Block

    {% raw %}
    <nav class="pagination" role="navigation">
        {% if page.previous %}
            <a href="{{ site.url }}{{ page.previous.url }}" class="btn" title="{{ page.previous.title }}">Previous article</a>
        {% endif %}
        {% if page.next %}
            <a href="{{ site.url }}{{ page.next.url }}" class="btn" title="{{ page.next.title }}">Next article</a>
        {% endif %}
    </nav><!-- /.pagination -->
    {% endraw %}


### Fenced Code Blocks

To modify styling and highlight colors edit `/assets/less/coderay.less` and compile `main.less` with your favorite preprocessor. Or edit `main.css` if that's your thing, the classes you want to modify all begin with `.coderay`. Line numbers and a few other things can be modified in `_config.yml` under `coderay`.

~~~ css
#container {
    float: left;
    margin: 0 -240px 0 0;
    width: 100%;
}
~~~

~~~ html
{% raw %}<nav class="pagination" role="navigation">
    {% if page.previous %}
        <a href="{{ site.url }}{{ page.previous.url }}" class="btn" title="{{ page.previous.title }}">Previous article</a>
    {% endif %}
    {% if page.next %}
        <a href="{{ site.url }}{{ page.next.url }}" class="btn" title="{{ page.next.title }}">Next article</a>
    {% endif %}
</nav><!-- /.pagination -->{% endraw %}
~~~

~~~ ruby
module Jekyll
  class TagIndex < Page
    def initialize(site, base, dir, tag)
      @site = site
      @base = base
      @dir = dir
      @name = 'index.html'
      self.process(@name)
      self.read_yaml(File.join(base, '_layouts'), 'tag_index.html')
      self.data['tag'] = tag
      tag_title_prefix = site.config['tag_title_prefix'] || 'Tagged: '
      tag_title_suffix = site.config['tag_title_suffix'] || '&#8211;'
      self.data['title'] = "#{tag_title_prefix}#{tag}"
      self.data['description'] = "An archive of posts tagged #{tag}."
    end
  end
end
~~~
\ No newline at end of file


M about.md => about.md +2 -0
@@ 6,6 6,8 @@ tagline: Minimal Mistakes, a Jekyll Theme
tags: [about, Jekyll, theme, responsive]
image:
  feature: texture-feature-02.jpg
  credit: Texture Lovers
  creditlink: http://texturelovers.com
---

Jekyll is pretty rad and figured releasing a cleaned up version of [my site](http://mademistakes.com) as a theme for others to hack and build on would be fun. So here be that theme --- I call it **Minimal Mistakes**, a responsive Jekyll theme with large featured images and solid typography. 


M articles.md => articles.md +0 -2
@@ 4,6 4,4 @@ permalink: /articles/index.html
title: Articles
tagline: A List of Posts
tags: [blog, graphic design]
image:
  feature: texture-feature-03.jpg
---
\ No newline at end of file


M assets/css/ie.css => assets/css/ie.css +1725 -265
@@ 1,265 1,1725 @@
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}
audio,canvas,video{display:inline-block;}
audio:not([controls]){display:none;height:0;}
[hidden]{display:none;}
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body{margin:0;}
a:focus{outline:thin dotted;}
a:active,a:hover{outline:0;}
h1{font-size:2em;margin:0.67em 0;}
abbr[title]{border-bottom:1px dotted;}
b,strong{font-weight:bold;}
dfn{font-style:italic;}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}
mark{background:#ff0;color:#000;}
code,kbd,pre,samp{font-family:monospace, serif;font-size:1em;}
pre{white-space:pre-wrap;}
q{quotes:"\201C" "\201D" "\2018" "\2019";}
small{font-size:80%;}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
img{border:0;}
svg:not(:root){overflow:hidden;}
figure{margin:0;}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}
legend{border:0;padding:0;}
button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}
button,input{line-height:normal;}
button,select{text-transform:none;}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}
button[disabled],html input[disabled]{cursor:default;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}
textarea{overflow:auto;vertical-align:top;}
table{border-collapse:collapse;border-spacing:0;margin-bottom:1.5em;}
::-moz-selection{background-color:#dadada;color:#343434;text-shadow:none;}
::selection{background-color:#dadada;color:#343434;text-shadow:none;}
.all-caps{text-transform:uppercase;}
.pull-left{float:left;}
.pull-right{float:right;}
.clearfix{*zoom:1;}.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
.unstyled-list{list-style:none;margin-left:0;padding-left:0;}.unstyled-list li{list-style-type:none;}
@font-face{font-family:"Ampersand";src:local("Georgia"),local("Garamond"),local("Palatino"),local("Book Antiqua");unicode-range:U+270C;}@font-face{font-family:"Ampersand";src:local("Georgia");unicode-range:U+270C;}.ampersand-placeholder{font-family:Verdana,sans-serif;}
.breakword{word-wrap:break-word;}
.normal-wrap{word-wrap:normal;}
.inherit-wrap{word-wrap:auto;}
.drop-cap:first-letter{float:left;margin:inherit;padding:inherit;font-size:4em;font-family:inherit;line-height:1;text-indent:0;background:transparent;color:inherit;}
html{font:normal 112.5%/1.65 serif;}
body{word-wrap:normal;color:#333332;}
.tera{font-size:117px;font-size:6.5rem;margin-bottom:0.25384615384615383rem;}
.giga{font-size:90px;font-size:5rem;margin-bottom:0.33rem;}
.mega{font-size:72px;font-size:4rem;margin-bottom:0.4125rem;}
.alpha{font-size:60px;font-size:3.3333333333333335rem;margin-bottom:0.495rem;}
.beta{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;}
.gamma{font-size:36px;font-size:2rem;margin-bottom:0.825rem;}
.delta{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;}
.epsilon{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;}
.zeta{font-size:18px;font-size:1rem;margin-bottom:1.65rem;}
h1{font-size:60px;font-size:3.3333333333333335rem;margin-bottom:0.495rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h2{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h3{font-size:36px;font-size:2rem;margin-bottom:0.825rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h4{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h5{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h6{font-size:18px;font-size:1rem;margin-bottom:1.65rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
p{margin:0 0 1.5em;}p+p{text-indent:1.5em;margin-top:-1.5em;}
abbr,acronym,blockquote,code,dir,kbd,listing,plaintext,q,samp,tt,var,xmp{-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;-o-hyphens:none;hyphens:none;}
pre code{word-wrap:normal;white-space:-moz-pre-wrap;white-space:pre-wrap;}
pre{white-space:pre;}
code{white-space:pre;font-family:monospace;}
abbr{font-variant:small-caps;font-weight:400;text-transform:lowercase;color:#333332;}abbr:hover{cursor:help;}
h1,h2,h3,h4,h5,h6{color:#333332;}
.lining dt,.lining dd{display:inline;margin:0;}
.lining dt+dt:before,.lining dd+dt:before{content:"\A";white-space:pre;}
.lining dd+dd:before{content:", ";}
.lining dd:before{content:": ";margin-left:-0.2rem;}
.dictionary-style dt{display:inline;counter-reset:definitions;}.dictionary-style dt+dt:before{content:", ";margin-left:-0.2rem;}
.dictionary-style dd{display:block;counter-increment:definitions;}.dictionary-style dd:before{content:counter(definitions, decimal) ". ";}
.stats-tabs{padding:0;}.stats-tabs li{display:inline-block;margin:0 0.625rem 0 0;padding:0 0.625rem 0 0;border-right:0.125rem solid #cccccc;}.stats-tabs li:last-child{margin:0;padding:0;border:none;}
.stats-tabs li a{display:inline-block;font-size:1.5rem;font-weight:bold;}.stats-tabs li a b{display:block;margin:0.125rem 0 0 0;font-size:0.875rem;font-weight:normal;}
.cite{display:block;font-size:0.875em;text-align:right;}
.pull-quote{position:relative;padding:1em;}.pull-quote:before,.pull-quote:after{height:1em;opacity:0.15;position:absolute;font-size:4em;}
.pull-quote:before{content:'“';top:0em;left:0em;}
.pull-quote:after{content:'”';bottom:0em;right:0em;}
h1,h2,h3,h4,h5,h6{font-family:'PT Sans Narrow',sans-serif;font-weight:700;}
h6{font-weight:400;}
a{text-decoration:none;color:#343434;}a:visited{color:#4e4e4e;}
a:hover{color:#1a1a1a;}
a:focus{outline:thin dotted;color:#343434;}
a:hover,a:active{outline:0;}
b,strong{font-weight:700;}
ul li{list-style-type:square;}
ol li{list-style-type:upper-roman;}
p>a,li>a,em>a,a>em,footer a{text-decoration:none;border-bottom:1px dotted #b3b3b1;}
p>a:hover,li>a:hover,em>a:hover,footer a:hover{text-decoration:none;border-bottom:1px solid #b3b3b1;}
figcaption{margin-top:0.75em;line-height:1.25;font-size:18px;font-size:1rem;margin-bottom:1.65rem;font-family:'PT Sans Narrow',sans-serif;counter-increment:captions;}figcaption:before{font-weight:700;text-transform:uppercase;content:"Figure " counter(captions) ": ";}
.notice{margin-top:1.5em;padding:.5em 1em;text-indent:0;font-size:90%;background-color:#ddd;border-left:10px solid #ccc;}
blockquote{font-style:italic;margin-left:0;padding-left:1em;border-left:10px solid #ccc;}blockquote p+p{text-indent:0;margin-top:0;}
.footnotes{font-size:90%;}
tt,code,kbd,samp,pre{font-family:Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;}
p code{font-size:80%;white-space:nowrap;margin:0 2px;padding:0 5px;border:1px solid #e6e6e6;background-color:#f2f2f2;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.hidden{display:none;visibility:hidden;}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{position:static;clip:auto;height:auto;width:auto;margin:0;overflow:visible;}
.visible-phone{display:none !important;}
.visible-tablet{display:none !important;}
.hidden-desktop{display:none !important;}
@media (max-width:767px){.visible-phone{display:inherit !important;} .hidden-phone{display:none !important;} .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important;}}@media (min-width:768px) and (max-width:979px){.visible-tablet{display:inherit !important;} .hidden-tablet{display:none !important;} .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important ;}}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc;border-bottom:1px solid #fff;}
article img{max-width:100%;height:auto;border-width:0;vertical-align:middle;-ms-interpolation-mode:bicubic;}
svg:not(:root){overflow:hidden;}
.half{margin:0 auto;width:100%;*zoom:1;}.half:before,.half:after{display:table;content:"";}
.half:after{clear:both;}
.half:before,.half:after{content:"";display:table;}
.half:after{clear:both;}
.half img{display:inline;float:left;width:50%;}
.half figcaption{display:inline;float:left;width:100%;}
.third{margin:0 auto;width:100%;*zoom:1;}.third:before,.third:after{display:table;content:"";}
.third:after{clear:both;}
.third:before,.third:after{content:"";display:table;}
.third:after{clear:both;}
.third img{display:inline;float:left;width:33.333333333333336%;}
.third figcaption{display:inline;float:left;width:100%;}
.btn{display:inline-block;*display:inline;*zoom:1;padding:12px 24px;margin-bottom:2em;line-height:1;text-align:center;text-transform:uppercase;vertical-align:middle;border:4px double #333332;-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;cursor:pointer;*margin-left:.3em;-webkit-transition:0.4s linear;-moz-transition:0.4s linear;-ms-transition:0.4s linear;-o-transition:0.4s linear;transition:0.4s linear;}.btn:visited{border:4px double #4e4e4e;}
.btn:hover{border:4px double #1a1a1a;}
.btn:first-child{*margin-left:0;}
.btn-inverse{border:4px double #ffffff;color:#ffffff;background-color:#000000;}.btn-inverse:visited{color:#ffffff;border-color:#ffffff;}
.btn-inverse:hover{color:#ffffff;border-color:#ffffff;}
.btn-small{font-size:60%;padding:6px 12px;}
.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);}
form{margin:0 0 5px 0;}form fieldset{margin-bottom:5px;padding:0;border-width:0;}
form legend{display:block;width:100%;margin-bottom:10px;*margin-left:-7px;padding:0;color:#333332;border:0;border-bottom:1px solid #cccccc;white-space:normal;}
form p{margin-bottom:2.5px;}
form ul{list-style-type:none;margin:0 0 5px 0;padding:0;}
form br{display:none;}
label,input,button,select,textarea{vertical-align:baseline;*vertical-align:middle;}
input,button,select,textarea{font-family:'PT Serif',serif;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}
label{display:block;margin-bottom:1.25px;font-weight:bold;color:#333332;cursor:pointer;}label input,label textarea,label select{display:block;}
input,textarea,select{display:inline-block;width:100%;padding:4px;margin-bottom:1.25px;background-color:#ffffff;border:1px solid #cccccc;color:#333332;}input:hover,textarea:hover,select:hover{border-color:#808080;}
.input-mini{width:60px;}
.input-small{width:90px;}
input[type="image"],input[type="checkbox"],input[type="radio"]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;cursor:pointer;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;border:0 \9;}
input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;padding:0;*width:13px;*height:13px;}
input[type="image"]{border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
input[type="file"]{width:auto;padding:initial;line-height:initial;border:initial;background-color:transparent;background-color:initial;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
input[type="button"],input[type="reset"],input[type="submit"]{width:auto;height:auto;cursor:pointer;*overflow:visible;}
select,input[type="file"]{*margin-top:4px;}
select{width:auto;background-color:#ffffff;}
select[multiple],select[size]{height:auto;}
textarea{resize:vertical;height:auto;overflow:auto;vertical-align:top;}
input[type="hidden"]{display:none;}
.radio,.checkbox{padding-left:18px;font-weight:normal;}
.radio input[type="radio"],.checkbox input[type="checkbox"]{float:left;margin-left:-18px;}
.radio.inline,.checkbox.inline{display:inline-block;padding-top:5px;margin-bottom:0;vertical-align:middle;}
.radio.inline+.radio.inline,.checkbox.inline+.checkbox.inline{margin-left:10px;}
input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{-webkit-opacity:0.5;-moz-opacity:0.5;opacity:0.5;cursor:not-allowed;}
input:focus,textarea:focus{border-color:#000000;outline:0;outline:thin dotted \9;}
input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus,select:focus{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.help-block,.help-inline{color:#808080;}
.help-block{display:block;margin-bottom:1em;line-height:1em;}
.help-inline{display:inline-block;vertical-align:middle;padding-left:5px;}
.form-inline input,.form-inline textarea,.form-inline select{display:inline-block;margin-bottom:0;}
.form-inline label{display:inline-block;}
.form-inline .radio,.form-inline .checkbox,.form-inline .radio{padding-left:0;margin-bottom:0;vertical-align:middle;}
.form-inline .radio input[type="radio"],.form-inline .checkbox input[type="checkbox"]{float:left;margin-left:0;margin-right:3px;}
.form-search input,.form-search textarea,.form-search select{display:inline-block;margin-bottom:0;}
.form-search .search-query{padding-left:14px;padding-right:14px;margin-bottom:0;-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;}
.form-search label{display:inline-block;}
.form-search .radio,.form-search .checkbox,.form-inline .radio{padding-left:0;margin-bottom:0;vertical-align:middle;}
.form-search .radio input[type="radio"],.form-search .checkbox input[type="checkbox"]{float:left;margin-left:0;margin-right:3px;}
html{background-color:#ffffff;font-family:'PT Serif',serif;font-color:#333332;font-size:90%;}
.navigation-wrapper{margin:0 auto;width:100%;padding:2em 0 3em;font-family:'PT Sans Narrow',sans-serif;font-weight:700;text-transform:uppercase;}
.site-name{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:1em;}
.top-navigation{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:1em;}
.top-navigation ul{list-style:none;margin:0;padding:0;}
.top-navigation li{list-style-type:none;display:inline;margin-right:25px;}.top-navigation li a{decoration:none;border-bottom:0 solid transparent;-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;}
#main{counter-reset:captions;margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:1em;}#main:before,#main:after{display:table;content:"";}
#main:after{clear:both;}
#main:before,#main:after{content:"";display:table;}
#main:after{clear:both;}
#main article{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:2em;}
#index{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:2em;}#index article h2{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;margin-bottom:0;}
#index article p+p{text-indent:0;}
.image-wrap{position:relative;margin-bottom:2em;}.image-wrap:after{content:" ";display:block;position:absolute;bottom:-1px;left:8%;width:0;height:0;border:20px solid transparent;border-bottom-color:#ffffff;}
.image-wrap img{width:100%;height:auto;-ms-interpolation-mode:bicubic;}
.image-wrap .headline-wrap{position:absolute;bottom:25px;margin-left:8.333333333333334%;}.image-wrap .headline-wrap h1,.image-wrap .headline-wrap h2{color:#ffffff;text-shadow:0 1px 2px rgba(0, 0, 0, 0.25);}
.headline-wrap h1{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;}
.headline-wrap h2{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;text-transform:uppercase;}
.article-wrap h2{font-size:36px;font-size:2rem;margin-bottom:0.825rem;}
.article-wrap h3{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;}
.byline{clear:both;font-size:80%;}
.article-author-top h4,.article-author-bottom h4{margin-bottom:0.5em;}
.article-author-top p,.article-author-bottom p{font-size:80%;font-style:italic;}
.article-author-top a,.article-author-bottom a,.article-author-top a:hover,.article-author-bottom a:hover{border-bottom:0 solid transparent;}
.article-author-top img.bio-photo,.article-author-bottom img.bio-photo{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.article-author-top{display:none;}
.article-author-bottom .bio-photo{float:left;margin-right:25px;}
.toc{display:none;font-size:95%;-webkit-opacity:0.7;-moz-opacity:0.7;opacity:0.7;-webkit-transition:opacity 0.2s ease-in-out;-moz-transition:opacity 0.2s ease-in-out;-ms-transition:opacity 0.2s ease-in-out;-o-transition:opacity 0.2s ease-in-out;transition:opacity 0.2s ease-in-out;}.toc:hover{-webkit-opacity:1;-moz-opacity:1;opacity:1;}
.toc header{background:#1a1a1a;}
.toc h3{margin:0;padding:5px 10px;color:#ffffff;}.toc h3:hover{cursor:pointer;}
.toc ul{margin:2px 0 0;padding:0;background:#4d4d4d;line-height:1;}
.toc li{display:block;margin:0;padding:0;font-family:'PT Sans Narrow',sans-serif;border-bottom:1px solid #808080;}.toc li:last-child{border-bottom:0 solid transparent;}
.toc li a,.toc li a:hover{color:#ffffff;border-bottom:0 solid transparent;}
.toc li a{padding:10px;display:block;}
.toc li ul{margin:0;border-top:1px solid #808080;}
.image-grid{*zoom:1;list-style:none;margin:0 0 1em;padding:0;}.image-grid:before,.image-grid:after{display:table;content:"";}
.image-grid:after{clear:both;}
.image-grid:before,.image-grid:after{content:"";display:table;}
.image-grid:after{clear:both;}
.image-grid li{display:inline;float:left;width:50%;}
.recent-grid{*zoom:1;list-style:none;margin:1em 0;}.recent-grid:before,.recent-grid:after{display:table;content:"";}
.recent-grid:after{clear:both;}
.recent-grid:before,.recent-grid:after{content:"";display:table;}
.recent-grid:after{clear:both;}
.recent-grid li{display:inline;}.recent-grid li a{border-bottom:0 solid transparent;}.recent-grid li a:hover{border-bottom:0 solid transparent;}
.recent-grid img{width:19%;margin-bottom:1%;}
.holder{font-family:'PT Sans Narrow',sans-serif;}.holder a{cursor:pointer;margin:0 5px;}
.holder a.jp-previous{margin-left:0;margin-right:15px;}
.holder a.jp-next{margin-left:15px;margin-right:0;}
.holder a.jp-current{font-weight:bold;}
.holder a.jp-current,.holder a.jp-current:hover,.holder a.jp-disabled,.holder a.jp-disabled:hover{cursor:default;background:none;}
.holder span{margin:0 5px;}
.footer-wrap{margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:1em;padding-top:2em;padding-bottom:3em;background-color:#000000;}.footer-wrap:before,.footer-wrap:after{display:table;content:"";}
.footer-wrap:after{clear:both;}
.footer-wrap:before,.footer-wrap:after{content:"";display:table;}
.footer-wrap:after{clear:both;}
.footer-wrap a,.footer-wrap a:active,.footer-wrap a:visited,.footer-wrap p,.footer-wrap h4,.footer-wrap h5,.footer-wrap h6{color:#bfbfbf;}
.footer-wrap a{border-bottom:0 solid transparent;}.footer-wrap a:hover{color:#ffffff;border-bottom:0 solid transparent;}
.footer-wrap footer{display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;}
.related-articles{display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;}.related-articles h4{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;text-transform:uppercase;margin-bottom:0;}
.related-articles li{margin-bottom:0;color:#ffffff;}
.footer-icons li{display:inline-block;padding-right:5px;}.footer-icons li a{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;color:#9a9a9a;-webkit-transition:0.4s linear;-moz-transition:0.4s linear;-ms-transition:0.4s linear;-o-transition:0.4s linear;transition:0.4s linear;}.footer-icons li a:hover{text-decoration:none;border-bottom:none;}.footer-icons li a:hover .icon-twitter,.footer-icons li a:hover .icon-twitter-sign{color:#2aa9df;}
.footer-icons li a:hover .icon-facebook,.footer-icons li a:hover .icon-facebook-sign{color:#3a5a98;}
.footer-icons li a:hover .icon-instagram,.footer-icons li a:hover .icon-instagram-sign{color:#306088;}
.footer-icons li a:hover .icon-google-plus,.footer-icons li a:hover .icon-google-plus-sign{color:#b63324;}
.footer-icons li a:hover .icon-lastfm,.footer-icons li a:hover .icon-lastfm-sign{color:#d80049;}
.footer-icons li a:hover .icon-github{color:#4183c4;}
.chrome-frame{background:#000;margin:0 0 2em 0;padding:10px;text-align:center;color:#ffffff;}.chrome-frame a{color:#ffffff;border-bottom:1px dotted #ffffff;text-decoration:none;}.chrome-frame a:hover{border-bottom:1px solid #ffffff;}
.image-grid li{width:33.333333%;}
html{font-size:95%;}
.site-name{display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;}
.top-navigation{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%;}
.image-wrap .headline-wrap,.image-wrap:after{left:25%;}
.image-wrap .headline-wrap{margin-left:0;}
#main article{display:inline;float:left;width:50%;margin-left:0%;margin-right:0%;}
#index{display:inline;float:left;width:50%;margin-left:0%;margin-right:0%;}
.footer-wrap footer{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%;}
.article-author-top{display:block;display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;}
.article-author-bottom{display:none;}
.toc{display:block;display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;position:fixed;top:120px;right:0;-webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.5);-moz-box-shadow:0 0 5px rgba(0, 0, 0, 0.5);box-shadow:0 0 5px rgba(0, 0, 0, 0.5);}
.image-grid li{width:25%;}
.related-articles{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%;}
html{font-size:100%;}
.image-grid li{width:20%;}
html{font-size:112.5%;}
.image-grid li{width:16.666666666%;}
.site-name{display:inline;float:left;width:12.5%;margin-left:16.666666666666668%;}
.top-navigation{display:inline;float:left;width:66.66666666666667%;}
.image-wrap:after{left:33.333333333%;}
.image-wrap .headline-wrap{margin-left:8.333333333333334%;}
#main article{display:inline;float:left;width:37.5%;}
#index{display:inline;float:left;width:37.5%;}
.related-articles{display:inline;float:left;width:37.5%;margin-left:33.333333333333336%;margin-right:29.166666666666668%;}
.footer-wrap footer{display:inline;float:left;width:37.5%;margin-left:33.333333333333336%;margin-right:29.166666666666668%;}
.article-author-top{display:inline;float:left;width:12.5%;margin-left:16.666666666666668%;}
/* CSS Normalize =========================================== */
/*! normalize.css v2.1.0 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}
/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block;
}
/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
 * Address styling not present in IE 8/9.
 */
[hidden] {
  display: none;
}
/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */

  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  /* 2 */

}
/**
 * Remove default margin.
 */
body {
  margin: 0;
}
/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}
/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}
/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}
/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}
/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}
/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}
/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}
/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre;
}
/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}
/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}
/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}
/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0;
}
/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */

  padding: 0;
  /* 2 */

}
/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */

  font-size: 100%;
  /* 2 */

  margin: 0;
  /* 3 */

}
/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}
/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}
/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */

  cursor: pointer;
  /* 3 */

}
/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}
/**
 * 1. Address box sizing set to `content-box` in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */

  padding: 0;
  /* 2 */

}
/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */

  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */

  box-sizing: content-box;
}
/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */

  vertical-align: top;
  /* 2 */

}
/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 1.5em;
}
/* Variables and mixins ==================================== */
/* Links ================================================= */
/* Site wide styles (html, body, global classes) =========== */
/* Selection ============================================= */
::-moz-selection {
  background-color: #dadada;
  color: #343434;
  text-shadow: none;
}
::selection {
  background-color: #dadada;
  color: #343434;
  text-shadow: none;
}
/* Global Classes ======================================== */
.all-caps {
  text-transform: uppercase;
}
.pull-left {
  float: left;
}
.pull-right {
  float: right;
}
.image-pull-right {
  float: right;
  margin-top: 0;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}
.unstyled-list {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.unstyled-list li {
  list-style-type: none;
}
/* Global Transition ==================================== */
b,
i,
strong,
em,
blockquote,
p,
q,
span,
figure,
img,
h1,
h2,
header,
input,
a {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
body {
  font-family: 'PT Serif', serif;
  color: #333332;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'PT Sans Narrow', sans-serif;
}
h1 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 0.8125;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h2 {
  font-size: 28px;
  font-size: 1.75rem;
  line-height: 0.9286;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h3 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.0833;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h4 {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.4444;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h5 {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.625;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h6 {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
a {
  text-decoration: none;
  color: #343434;
}
a:visited {
  color: #676767;
}
a:hover {
  color: #010101;
}
a:focus {
  outline: thin dotted;
  color: #010101;
}
a:hover,
a:active {
  outline: 0;
}
figcaption {
  padding-top: 10px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  line-height: 1.3;
  color: #4d4d4b;
}
.image-credit {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  display: block;
  text-align: right;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 2.1667;
  line-height: 1.3;
  font-style: italic;
  color: #80807e;
}
.image-credit a {
  color: #80807e;
}
.notice {
  margin-top: 1.5em;
  padding: .5em 1em;
  text-indent: 0;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
blockquote {
  margin-left: -28px;
  padding-left: 20px;
  border-left: 8px solid #333332;
  font-family: 'PT Serif', serif;
  font-style: italic;
  font-size: 24px;
  font-size: 1.5rem;
}
.footnotes ol,
.footnotes li,
.footnotes p {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
p {
  margin: 0 0 1.625rem;
}
p + p {
  text-indent: 1.625rem;
  margin-top: -1.625rem;
}
tt,
code,
kbd,
samp,
pre {
  font-family: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
}
p code,
li code {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.5;
  white-space: nowrap;
  margin: 0 2px;
  padding: 0 5px;
  border: 1px solid #f7f7f7;
  background-color: #ffffff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
pre {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.5;
  overflow-x: auto;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.hidden {
  display: none;
  visibility: hidden;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  position: static;
  clip: auto;
  height: auto;
  width: auto;
  margin: 0;
  overflow: visible;
}
/* Figures, images, social media, other elements =========== */
hr {
  display: block;
  margin: 1em 0;
  padding: 0;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #fff;
}
/* Figures and images ==================================== */
article img {
  max-width: 100%;
  height: auto;
  border-width: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic;
}
svg:not(:root) {
  overflow: hidden;
}
.half {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
}
.half:before,
.half:after {
  display: table;
  content: "";
}
.half:after {
  clear: both;
}
.half:before,
.half:after {
  display: table;
  content: "";
  line-height: 0;
}
.half:after {
  clear: both;
}
.half img {
  display: inline;
  float: left;
  width: 50%;
}
.half figcaption {
  display: inline;
  float: left;
  width: 100%;
}
.third {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
}
.third:before,
.third:after {
  display: table;
  content: "";
}
.third:after {
  clear: both;
}
.third:before,
.third:after {
  display: table;
  content: "";
  line-height: 0;
}
.third:after {
  clear: both;
}
.third img {
  display: inline;
  float: left;
  width: 33.333333333333336%;
}
.third figcaption {
  display: inline;
  float: left;
  width: 100%;
}
/* Buttons ============================================== */
.btn {
  display: inline-block;
  margin-bottom: 20px;
  padding: 8px 20px;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #111111;
  color: #ffffff;
  border: 2px solid #111111 !important;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.btn:visited {
  color: #ffffff;
}
.btn:hover {
  background-color: #ffffff;
  color: #111111;
}
.btn:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
/* Well ================================================= */
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
/* Standard form controls ================================== */
form {
  margin: 0 0 5px 0;
}
form fieldset {
  margin-bottom: 5px;
  padding: 0;
  border-width: 0;
}
form legend {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  *margin-left: -7px;
  padding: 0;
  color: #333332;
  border: 0;
  border-bottom: 1px solid #dddddd;
  white-space: normal;
}
form p {
  margin-bottom: 2.5px;
}
form ul {
  list-style-type: none;
  margin: 0 0 5px 0;
  padding: 0;
}
form br {
  display: none;
}
label,
input,
button,
select,
textarea {
  vertical-align: baseline;
  *vertical-align: middle;
}
input,
button,
select,
textarea {
  font-family: 'PT Serif', serif;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
label {
  display: block;
  margin-bottom: 1.25px;
  font-weight: bold;
  color: #333332;
  cursor: pointer;
}
label input,
label textarea,
label select {
  display: block;
}
input,
textarea,
select {
  display: inline-block;
  width: 100%;
  padding: 4px;
  margin-bottom: 1.25px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  color: #333332;
}
input:hover,
textarea:hover,
select:hover {
  border-color: #919191;
}
.input-mini {
  width: 60px;
}
.input-small {
  width: 90px;
}
input[type="image"],
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  height: auto;
  padding: 0;
  margin: 3px 0;
  *margin-top: 0;
  line-height: normal;
  cursor: pointer;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border: 0 \9;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  *width: 13px;
  *height: 13px;
}
input[type="image"] {
  border: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
input[type="file"] {
  width: auto;
  padding: initial;
  line-height: initial;
  border: initial;
  background-color: transparent;
  background-color: initial;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
input[type="button"],
input[type="reset"],
input[type="submit"] {
  width: auto;
  height: auto;
  cursor: pointer;
  *overflow: visible;
}
select,
input[type="file"] {
  *margin-top: 4px;
}
select {
  width: auto;
  background-color: #ffffff;
}
select[multiple],
select[size] {
  height: auto;
}
textarea {
  resize: vertical;
  height: auto;
  overflow: auto;
  vertical-align: top;
}
input[type="hidden"] {
  display: none;
}
.radio,
.checkbox {
  padding-left: 18px;
  font-weight: normal;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
  float: left;
  margin-left: -18px;
}
.radio.inline,
.checkbox.inline {
  display: inline-block;
  padding-top: 5px;
  margin-bottom: 0;
  vertical-align: middle;
}
.radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline {
  margin-left: 10px;
}
/* disabled ==================================== */
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  cursor: not-allowed;
}
/* focus and active ============================ */
input:focus,
textarea:focus {
  border-color: #111111;
  outline: 0;
  outline: thin dotted \9;
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus,
select:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
/* help text ==================================== */
.help-block,
.help-inline {
  color: #919191;
}
.help-block {
  display: block;
  margin-bottom: 1em;
  line-height: 1em;
}
.help-inline {
  display: inline-block;
  vertical-align: middle;
  padding-left: 5px;
}
/* .form-inline ================================= */
.form-inline input,
.form-inline textarea,
.form-inline select {
  display: inline-block;
  margin-bottom: 0;
}
.form-inline label {
  display: inline-block;
}
.form-inline .radio,
.form-inline .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px;
}
/* .form-search ================================= */
.form-search input,
.form-search textarea,
.form-search select {
  display: inline-block;
  margin-bottom: 0;
}
.form-search .search-query {
  padding-left: 14px;
  padding-right: 14px;
  margin-bottom: 0;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
}
.form-search label {
  display: inline-block;
}
.form-search .radio,
.form-search .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px;
}
/* Page level layout styles */
body {
  background-color: #ffffff;
  font-family: 'PT Serif', serif;
  font-color: #333332;
}
.navigation-wrapper {
  margin: 0 auto;
  width: 100%;
  padding: 2em 0 3em;
  font-family: 'PT Sans Narrow', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}
.site-name {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 1em;
}
.top-navigation {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 1em;
}
.top-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.top-navigation li {
  list-style-type: none;
  display: inline;
  margin-right: 25px;
}
.top-navigation li a {
  decoration: none;
  border-bottom: 0 solid transparent;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
#main {
  counter-reset: captions;
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
  clear: both;
  margin-top: 1em;
}
#main:before,
#main:after {
  display: table;
  content: "";
}
#main:after {
  clear: both;
}
#main:before,
#main:after {
  display: table;
  content: "";
  line-height: 0;
}
#main:after {
  clear: both;
}
#main article {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
#index {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
#index h3 {
  margin: 0;
  padding-bottom: .5em;
  font-size: 28px;
  font-size: 1.75rem;
  border-bottom: 1px solid #c3c3c3;
}
#index article h2 {
  margin-bottom: 0;
  font-size: 24px;
  font-size: 1.5rem;
}
#index article p + p {
  text-indent: 0;
}
.image-wrap {
  position: relative;
  margin-bottom: 2em;
}
.image-wrap:after {
  content: " ";
  display: block;
  position: absolute;
  bottom: -1px;
  left: 8%;
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-bottom-color: #ffffff;
}
.image-wrap img {
  width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
}
.image-wrap .headline-wrap {
  position: absolute;
  bottom: 25px;
  margin-left: 8.333333333333334%;
}
.image-wrap .headline-wrap h1,
.image-wrap .headline-wrap h2 {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.byline {
  clear: both;
  font-size: 80%;
}
.article-author-top h3,
.article-author-bottom h3 {
  margin-bottom: 0;
}
.article-author-top p,
.article-author-bottom p {
  font-size: 80%;
  font-style: italic;
}
.article-author-top a,
.article-author-bottom a,
.article-author-top a:hover,
.article-author-bottom a:hover {
  border-bottom: 0 solid transparent;
}
.article-author-top img.bio-photo,
.article-author-bottom img.bio-photo {
  width: 100px;
  height: 100px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
}
.author-social {
  display: block;
  margin-bottom: 5px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #111111;
}
.author-social:visited {
  color: #111111;
}
.author-social:hover {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}
.author-social:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
.article-author-top {
  display: none;
  text-align: center;
}
.article-author-bottom {
  margin-bottom: 1em;
}
.article-author-bottom .bio-photo {
  float: left;
  margin-right: 25px;
}
.article-author-bottom .author-social {
  display: inline-block;
  margin-right: 5px;
}
.article-wrap p > a,
.article-wrap li > a {
  border-bottom: 1px dotted #b3b3b3;
}
.article-wrap p > a:hover,
.article-wrap li > a:hover {
  border-bottom-style: solid;
}
.article-wrap p > a.reversefootnote,
.article-wrap li > a.reversefootnote {
  border-bottom-width: 0;
}
.toc {
  display: none;
  font-size: 95%;
  -webkit-opacity: 0.7;
  -moz-opacity: 0.7;
  opacity: 0.7;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.toc:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
.toc header {
  background: #2b2b2b;
}
.toc h3 {
  margin: 0;
  padding: 5px 10px;
  color: #ffffff;
}
.toc h3:hover {
  cursor: pointer;
}
.toc ul {
  margin: 2px 0 0;
  padding: 0;
  background: #5e5e5e;
  line-height: 1;
}
.toc li {
  display: block;
  margin: 0;
  padding: 0;
  font-family: 'PT Sans Narrow', sans-serif;
  border-bottom: 1px solid #808080;
}
.toc li:last-child {
  border-bottom: 0 solid transparent;
}
.toc li a,
.toc li a:hover {
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
.toc li a {
  padding: 10px;
  display: block;
}
.toc li ul {
  margin: 0;
  border-top: 1px solid #808080;
}
.image-grid {
  *zoom: 1;
  list-style: none;
  margin: 0 0 1em;
  padding: 0;
}
.image-grid:before,
.image-grid:after {
  display: table;
  content: "";
}
.image-grid:after {
  clear: both;
}
.image-grid:before,
.image-grid:after {
  display: table;
  content: "";
  line-height: 0;
}
.image-grid:after {
  clear: both;
}
.image-grid li {
  display: inline;
  float: left;
  width: 50%;
}
.recent-grid {
  *zoom: 1;
  list-style: none;
  margin: 1em 0;
}
.recent-grid:before,
.recent-grid:after {
  display: table;
  content: "";
}
.recent-grid:after {
  clear: both;
}
.recent-grid:before,
.recent-grid:after {
  display: table;
  content: "";
  line-height: 0;
}
.recent-grid:after {
  clear: both;
}
.recent-grid li {
  display: inline;
}
.recent-grid li a {
  border-bottom: 0 solid transparent;
}
.recent-grid li a:hover {
  border-bottom: 0 solid transparent;
}
.recent-grid img {
  width: 19%;
  margin-bottom: 1%;
}
.holder {
  font-family: 'PT Sans Narrow', sans-serif;
}
.holder a {
  cursor: pointer;
  margin: 0 5px;
}
.holder a.jp-previous {
  margin-left: 0;
  margin-right: 15px;
}
.holder a.jp-next {
  margin-left: 15px;
  margin-right: 0;
}
.holder a.jp-current {
  font-weight: bold;
}
.holder a.jp-current,
.holder a.jp-current:hover,
.holder a.jp-disabled,
.holder a.jp-disabled:hover {
  cursor: default;
  background: none;
}
.holder span {
  margin: 0 5px;
}
.footer-wrap {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
  clear: both;
  margin-top: 1em;
  padding-top: 2em;
  padding-bottom: 3em;
  background-color: #111111;
}
.footer-wrap:before,
.footer-wrap:after {
  display: table;
  content: "";
}
.footer-wrap:after {
  clear: both;
}
.footer-wrap:before,
.footer-wrap:after {
  display: table;
  content: "";
  line-height: 0;
}
.footer-wrap:after {
  clear: both;
}
.footer-wrap a,
.footer-wrap a:active,
.footer-wrap a:visited,
.footer-wrap p,
.footer-wrap h4,
.footer-wrap h5,
.footer-wrap h6,
.footer-wrap span {
  color: #bfbfbf;
}
.footer-wrap span {
  font-size: 14px;
  font-size: 0.875rem;
}
.footer-wrap a {
  border-bottom: 0 solid transparent;
}
.footer-wrap a:hover {
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
.footer-wrap footer {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
}
.related-articles {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
.related-articles h4 {
  text-transform: uppercase;
  margin-bottom: 0;
}
.related-articles li {
  margin-bottom: 0;
  color: #ffffff;
}
.footer-icons li {
  display: inline-block;
  padding-right: 5px;
}
.footer-icons li a {
  color: #9a9a9a;
  -webkit-transition: 0.4s linear;
  -moz-transition: 0.4s linear;
  -ms-transition: 0.4s linear;
  -o-transition: 0.4s linear;
  transition: 0.4s linear;
}
.footer-icons li a:hover {
  text-decoration: none;
  border-bottom: none;
}
.footer-icons li a:hover .icon-twitter,
.footer-icons li a:hover .icon-twitter-sign {
  color: #2aa9df;
}
.footer-icons li a:hover .icon-facebook,
.footer-icons li a:hover .icon-facebook-sign {
  color: #3a5a98;
}
.footer-icons li a:hover .icon-instagram,
.footer-icons li a:hover .icon-instagram-sign {
  color: #306088;
}
.footer-icons li a:hover .icon-google-plus,
.footer-icons li a:hover .icon-google-plus-sign {
  color: #b63324;
}
.footer-icons li a:hover .icon-lastfm,
.footer-icons li a:hover .icon-lastfm-sign {
  color: #d80049;
}
.footer-icons li a:hover .icon-github {
  color: #4183c4;
}
.browser-upgrade {
  background: #000;
  margin: 0 0 2em 0;
  padding: 10px;
  text-align: center;
  color: #ffffff;
}
.browser-upgrade a {
  color: #ffffff;
  border-bottom: 1px dotted #ffffff;
  text-decoration: none;
}
.browser-upgrade a:hover {
  border-bottom: 1px solid #ffffff;
}
#goog-fixurl ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
#goog-fixurl ul li {
  list-style-type: none;
}
#goog-wm-qt {
  width: auto;
  margin-right: 10px;
  margin-bottom: 20px;
  padding: 8px 20px;
  display: inline-block;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #ffffff;
  color: #111111;
  border-width: 2px !important;
  border-style: solid !important;
  border-color: #919191;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#goog-wm-sb {
  display: inline-block;
  margin-bottom: 20px;
  padding: 8px 20px;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #111111;
  color: #ffffff;
  border: 2px solid #111111 !important;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
#goog-wm-sb:visited {
  color: #ffffff;
}
#goog-wm-sb:hover {
  background-color: #ffffff;
  color: #111111;
}
#goog-wm-sb:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
/* 480px wide ============================================== */
.article-author-top,
.article-author-bottom {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-opacity: 0.7;
  -moz-opacity: 0.7;
  opacity: 0.7;
}
.article-author-top:hover,
.article-author-bottom:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
.image-grid li {
  width: 33.333333%;
}
/* 600px wide ============================================== */
.site-name {
  display: inline;
  float: left;
  width: 16.666666666666668%;
  margin-left: 4.166666666666667%;
  margin-right: 4.166666666666667%;
}
.top-navigation {
  display: inline;
  float: left;
  width: 75%;
  margin-left: 0%;
  margin-right: 0%;
}
.image-wrap .headline-wrap,
.image-wrap:after {
  left: 25%;
}
.image-wrap .headline-wrap {
  margin-left: 0;
}
.image-credit {
  display: inline;
  float: left;
  width: 75%;
  margin-left: 0%;
  margin-right: 0%;
}
#main article {
  display: inline;
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: 0%;
}
#index {
  display: inline;
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: 0%;
}
.footer-wrap footer {
  display: inline;
  float: left;
  width: 50%;
  margin-left: 25%;
  margin-right: 25%;
}
.article-author-top {
  display: block;
  display: inline;
  float: left;
  width: 16.666666666666668%;
  margin-left: 4.166666666666667%;
  margin-right: 4.166666666666667%;
}
.article-author-bottom {
  display: none;
}
.toc {
  display: block;
  display: inline;
  float: left;
  width: 16.666666666666668%;
  margin-left: 4.166666666666667%;
  margin-right: 4.166666666666667%;
  position: fixed;
  top: 120px;
  right: 0;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.image-grid li {
  width: 25%;
}
.related-articles {
  display: inline;
  float: left;
  width: 50%;
  margin-left: 25%;
  margin-right: 25%;
}
/* 768px wide ============================================== */
/* Image Grid ============================================== */
.image-grid li {
  width: 20%;
}
/* 992px wide ============================================== */
.article-author-top img.bio-photo,
.article-author-bottom img.bio-photo {
  width: 150px;
  height: 150px;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
  border-radius: 150px;
}
/* Image Grid ============================================== */
.image-grid li {
  width: 16.666666666%;
}
/* 1382px wide ============================================= */
.site-name {
  display: inline;
  float: left;
  width: 12.5%;
  margin-left: 16.666666666666668%;
}
.top-navigation {
  display: inline;
  float: left;
  width: 66.66666666666667%;
}
.image-wrap:after {
  left: 33.333333333%;
}
.image-wrap .headline-wrap {
  margin-left: 8.333333333333334%;
}
.image-credit {
  display: inline;
  float: left;
  width: 70.83333333333334%;
}
#main article {
  display: inline;
  float: left;
  width: 37.5%;
}
#index {
  display: inline;
  float: left;
  width: 37.5%;
}
.related-articles {
  display: inline;
  float: left;
  width: 37.5%;
  margin-left: 33.333333333333336%;
  margin-right: 29.166666666666668%;
}
.footer-wrap footer {
  display: inline;
  float: left;
  width: 37.5%;
  margin-left: 33.333333333333336%;
  margin-right: 29.166666666666668%;
}
.article-author-top {
  display: inline;
  float: left;
  width: 12.5%;
  margin-left: 16.666666666666668%;
}


M assets/css/main.css => assets/css/main.css +3069 -379
@@ 1,379 1,3069 @@
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}
audio,canvas,video{display:inline-block;}
audio:not([controls]){display:none;height:0;}
[hidden]{display:none;}
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body{margin:0;}
a:focus{outline:thin dotted;}
a:active,a:hover{outline:0;}
h1{font-size:2em;margin:0.67em 0;}
abbr[title]{border-bottom:1px dotted;}
b,strong{font-weight:bold;}
dfn{font-style:italic;}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}
mark{background:#ff0;color:#000;}
code,kbd,pre,samp{font-family:monospace, serif;font-size:1em;}
pre{white-space:pre-wrap;}
q{quotes:"\201C" "\201D" "\2018" "\2019";}
small{font-size:80%;}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
img{border:0;}
svg:not(:root){overflow:hidden;}
figure{margin:0;}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}
legend{border:0;padding:0;}
button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}
button,input{line-height:normal;}
button,select{text-transform:none;}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}
button[disabled],html input[disabled]{cursor:default;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}
textarea{overflow:auto;vertical-align:top;}
table{border-collapse:collapse;border-spacing:0;margin-bottom:1.5em;}
::-moz-selection{background-color:#dadada;color:#343434;text-shadow:none;}
::selection{background-color:#dadada;color:#343434;text-shadow:none;}
.all-caps{text-transform:uppercase;}
.pull-left{float:left;}
.pull-right{float:right;}
.clearfix{*zoom:1;}.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
.unstyled-list{list-style:none;margin-left:0;padding-left:0;}.unstyled-list li{list-style-type:none;}
@font-face{font-family:"Ampersand";src:local("Georgia"),local("Garamond"),local("Palatino"),local("Book Antiqua");unicode-range:U+270C;}@font-face{font-family:"Ampersand";src:local("Georgia");unicode-range:U+270C;}.ampersand-placeholder{font-family:Verdana,sans-serif;}
.breakword{word-wrap:break-word;}
.normal-wrap{word-wrap:normal;}
.inherit-wrap{word-wrap:auto;}
.drop-cap:first-letter{float:left;margin:inherit;padding:inherit;font-size:4em;font-family:inherit;line-height:1;text-indent:0;background:transparent;color:inherit;}
html{font:normal 112.5%/1.65 serif;}
body{word-wrap:normal;color:#333332;}
.tera{font-size:117px;font-size:6.5rem;margin-bottom:0.25384615384615383rem;}
.giga{font-size:90px;font-size:5rem;margin-bottom:0.33rem;}
.mega{font-size:72px;font-size:4rem;margin-bottom:0.4125rem;}
.alpha{font-size:60px;font-size:3.3333333333333335rem;margin-bottom:0.495rem;}
.beta{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;}
.gamma{font-size:36px;font-size:2rem;margin-bottom:0.825rem;}
.delta{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;}
.epsilon{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;}
.zeta{font-size:18px;font-size:1rem;margin-bottom:1.65rem;}
h1{font-size:60px;font-size:3.3333333333333335rem;margin-bottom:0.495rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h2{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h3{font-size:36px;font-size:2rem;margin-bottom:0.825rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h4{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h5{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
h6{font-size:18px;font-size:1rem;margin-bottom:1.65rem;text-rendering:optimizeLegibility;line-height:1;margin-top:0;}
p{margin:0 0 1.5em;}p+p{text-indent:1.5em;margin-top:-1.5em;}
abbr,acronym,blockquote,code,dir,kbd,listing,plaintext,q,samp,tt,var,xmp{-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;-o-hyphens:none;hyphens:none;}
pre code{word-wrap:normal;white-space:-moz-pre-wrap;white-space:pre-wrap;}
pre{white-space:pre;}
code{white-space:pre;font-family:monospace;}
abbr{font-variant:small-caps;font-weight:400;text-transform:lowercase;color:#333332;}abbr:hover{cursor:help;}
h1,h2,h3,h4,h5,h6{color:#333332;}
.lining dt,.lining dd{display:inline;margin:0;}
.lining dt+dt:before,.lining dd+dt:before{content:"\A";white-space:pre;}
.lining dd+dd:before{content:", ";}
.lining dd:before{content:": ";margin-left:-0.2rem;}
.dictionary-style dt{display:inline;counter-reset:definitions;}.dictionary-style dt+dt:before{content:", ";margin-left:-0.2rem;}
.dictionary-style dd{display:block;counter-increment:definitions;}.dictionary-style dd:before{content:counter(definitions, decimal) ". ";}
.stats-tabs{padding:0;}.stats-tabs li{display:inline-block;margin:0 0.625rem 0 0;padding:0 0.625rem 0 0;border-right:0.125rem solid #cccccc;}.stats-tabs li:last-child{margin:0;padding:0;border:none;}
.stats-tabs li a{display:inline-block;font-size:1.5rem;font-weight:bold;}.stats-tabs li a b{display:block;margin:0.125rem 0 0 0;font-size:0.875rem;font-weight:normal;}
.cite{display:block;font-size:0.875em;text-align:right;}
.pull-quote{position:relative;padding:1em;}.pull-quote:before,.pull-quote:after{height:1em;opacity:0.15;position:absolute;font-size:4em;}
.pull-quote:before{content:'“';top:0em;left:0em;}
.pull-quote:after{content:'”';bottom:0em;right:0em;}
h1,h2,h3,h4,h5,h6{font-family:'PT Sans Narrow',sans-serif;font-weight:700;}
h6{font-weight:400;}
a{text-decoration:none;color:#343434;}a:visited{color:#4e4e4e;}
a:hover{color:#1a1a1a;}
a:focus{outline:thin dotted;color:#343434;}
a:hover,a:active{outline:0;}
b,strong{font-weight:700;}
ul li{list-style-type:square;}
ol li{list-style-type:upper-roman;}
p>a,li>a,em>a,a>em,footer a{text-decoration:none;border-bottom:1px dotted #b3b3b1;}
p>a:hover,li>a:hover,em>a:hover,footer a:hover{text-decoration:none;border-bottom:1px solid #b3b3b1;}
figcaption{margin-top:0.75em;line-height:1.25;font-size:18px;font-size:1rem;margin-bottom:1.65rem;font-family:'PT Sans Narrow',sans-serif;counter-increment:captions;}figcaption:before{font-weight:700;text-transform:uppercase;content:"Figure " counter(captions) ": ";}
.notice{margin-top:1.5em;padding:.5em 1em;text-indent:0;font-size:90%;background-color:#ddd;border-left:10px solid #ccc;}
blockquote{font-style:italic;margin-left:0;padding-left:1em;border-left:10px solid #ccc;}blockquote p+p{text-indent:0;margin-top:0;}
.footnotes{font-size:90%;}
tt,code,kbd,samp,pre{font-family:Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;}
p code{font-size:80%;white-space:nowrap;margin:0 2px;padding:0 5px;border:1px solid #e6e6e6;background-color:#f2f2f2;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.highlight{background-color:#efefef;font-family:Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;font-size:80%;color:#333332;margin-bottom:1.5em;}
.highlight pre{margin:0px;padding:1em;}
.hll{background-color:#ffffcc;}
.c{color:#999988;font-style:italic;}
.err{color:#a61717;background-color:#e3d2d2;}
.k{color:#000000;font-weight:bold;}
.o{color:#000000;font-weight:bold;}
.cm{color:#999988;font-style:italic;}
.cp{color:#999999;font-weight:bold;font-style:italic;}
.c1{color:#999988;font-style:italic;}
.cs{color:#999999;font-weight:bold;font-style:italic;}
.gd{color:#000000;background-color:#ffdddd;}
.ge{color:#000000;font-style:italic;}
.gr{color:#aa0000;}
.gh{color:#999999;}
.gi{color:#000000;background-color:#ddffdd;}
.go{color:#888888;}
.gp{color:#555555;}
.gs{font-weight:bold;}
.gu{color:#aaaaaa;}
.gt{color:#aa0000;}
.kc{color:#000000;font-weight:bold;}
.kd{color:#000000;font-weight:bold;}
.kn{color:#000000;font-weight:bold;}
.kp{color:#000000;font-weight:bold;}
.kr{color:#000000;font-weight:bold;}
.kt{color:#445588;font-weight:bold;}
.m{color:#009999;}
.s{color:#d01040;}
.na{color:#008080;}
.nb{color:#0086b3;}
.nc{color:#445588;font-weight:bold;}
.no{color:#008080;}
.nd{color:#3c5d5d;font-weight:bold;}
.ni{color:#800080;}
.ne{color:#990000;font-weight:bold;}
.nf{color:#990000;font-weight:bold;}
.nl{color:#990000;font-weight:bold;}
.nn{color:#555555;}
.nt{color:#000080;}
.nv{color:#008080;}
.ow{color:#000000;font-weight:bold;}
.w{color:#bbbbbb;}
.mf{color:#009999;}
.mh{color:#009999;}
.mi{color:#009999;}
.mo{color:#009999;}
.sb{color:#d01040;}
.sc{color:#d01040;}
.sd{color:#d01040;}
.s2{color:#d01040;}
.se{color:#d01040;}
.sh{color:#d01040;}
.si{color:#d01040;}
.sx{color:#d01040;}
.sr{color:#009926;}
.s1{color:#d01040;}
.ss{color:#990073;}
.bp{color:#999999;}
.vc{color:#008080;}
.vg{color:#008080;}
.vi{color:#008080;}
.il{color:#009999;}
.hidden{display:none;visibility:hidden;}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{position:static;clip:auto;height:auto;width:auto;margin:0;overflow:visible;}
.visible-phone{display:none !important;}
.visible-tablet{display:none !important;}
.hidden-desktop{display:none !important;}
@media (max-width:767px){.visible-phone{display:inherit !important;} .hidden-phone{display:none !important;} .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important;}}@media (min-width:768px) and (max-width:979px){.visible-tablet{display:inherit !important;} .hidden-tablet{display:none !important;} .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important ;}}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc;border-bottom:1px solid #fff;}
article img{max-width:100%;height:auto;border-width:0;vertical-align:middle;-ms-interpolation-mode:bicubic;}
svg:not(:root){overflow:hidden;}
.half{margin:0 auto;width:100%;*zoom:1;}.half:before,.half:after{display:table;content:"";}
.half:after{clear:both;}
.half:before,.half:after{content:"";display:table;}
.half:after{clear:both;}
.half img{display:inline;float:left;width:50%;}
.half figcaption{display:inline;float:left;width:100%;}
.third{margin:0 auto;width:100%;*zoom:1;}.third:before,.third:after{display:table;content:"";}
.third:after{clear:both;}
.third:before,.third:after{content:"";display:table;}
.third:after{clear:both;}
.third img{display:inline;float:left;width:33.333333333333336%;}
.third figcaption{display:inline;float:left;width:100%;}
.btn{display:inline-block;*display:inline;*zoom:1;padding:12px 24px;margin-bottom:2em;line-height:1;text-align:center;text-transform:uppercase;vertical-align:middle;border:4px double #333332;-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;cursor:pointer;*margin-left:.3em;-webkit-transition:0.4s linear;-moz-transition:0.4s linear;-ms-transition:0.4s linear;-o-transition:0.4s linear;transition:0.4s linear;}.btn:visited{border:4px double #4e4e4e;}
.btn:hover{border:4px double #1a1a1a;}
.btn:first-child{*margin-left:0;}
.btn-inverse{border:4px double #ffffff;color:#ffffff;background-color:#000000;}.btn-inverse:visited{color:#ffffff;border-color:#ffffff;}
.btn-inverse:hover{color:#ffffff;border-color:#ffffff;}
.btn-small{font-size:60%;padding:6px 12px;}
.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);}
@font-face{font-family:'icomoon';src:url('../fonts/icomoon.eot');src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),url('../fonts/icomoon.woff') format('woff'),url('../fonts/icomoon.ttf') format('truetype'),url('../fonts/icomoon.svg#icomoon') format('svg');font-weight:normal;font-style:normal;}[data-icon]:before{font-family:'icomoon';content:attr(data-icon);speak:none;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;}
.icon-instagram,.icon-facebook,.icon-twitter,.icon-google-plus,.icon-feed,.icon-feed-2,.icon-linkedin,.icon-tumblr,.icon-lastfm,.icon-mail,.icon-github{font-family:'icomoon';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;}
.icon-instagram:before{content:"\e004";}
.icon-facebook:before{content:"\e003";}
.icon-twitter:before{content:"\e007";}
.icon-google-plus:before{content:"\e00a";}
.icon-feed:before{content:"\e00b";}
.icon-feed-2:before{content:"\e00c";}
.icon-linkedin:before{content:"\e001";}
.icon-tumblr:before{content:"\e002";}
.icon-lastfm:before{content:"\e005";}
.icon-mail:before{content:"\e006";}
.icon-github:before{content:"\e000";}
form{margin:0 0 5px 0;}form fieldset{margin-bottom:5px;padding:0;border-width:0;}
form legend{display:block;width:100%;margin-bottom:10px;*margin-left:-7px;padding:0;color:#333332;border:0;border-bottom:1px solid #cccccc;white-space:normal;}
form p{margin-bottom:2.5px;}
form ul{list-style-type:none;margin:0 0 5px 0;padding:0;}
form br{display:none;}
label,input,button,select,textarea{vertical-align:baseline;*vertical-align:middle;}
input,button,select,textarea{font-family:'PT Serif',serif;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}
label{display:block;margin-bottom:1.25px;font-weight:bold;color:#333332;cursor:pointer;}label input,label textarea,label select{display:block;}
input,textarea,select{display:inline-block;width:100%;padding:4px;margin-bottom:1.25px;background-color:#ffffff;border:1px solid #cccccc;color:#333332;}input:hover,textarea:hover,select:hover{border-color:#808080;}
.input-mini{width:60px;}
.input-small{width:90px;}
input[type="image"],input[type="checkbox"],input[type="radio"]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;cursor:pointer;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;border:0 \9;}
input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;padding:0;*width:13px;*height:13px;}
input[type="image"]{border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
input[type="file"]{width:auto;padding:initial;line-height:initial;border:initial;background-color:transparent;background-color:initial;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
input[type="button"],input[type="reset"],input[type="submit"]{width:auto;height:auto;cursor:pointer;*overflow:visible;}
select,input[type="file"]{*margin-top:4px;}
select{width:auto;background-color:#ffffff;}
select[multiple],select[size]{height:auto;}
textarea{resize:vertical;height:auto;overflow:auto;vertical-align:top;}
input[type="hidden"]{display:none;}
.radio,.checkbox{padding-left:18px;font-weight:normal;}
.radio input[type="radio"],.checkbox input[type="checkbox"]{float:left;margin-left:-18px;}
.radio.inline,.checkbox.inline{display:inline-block;padding-top:5px;margin-bottom:0;vertical-align:middle;}
.radio.inline+.radio.inline,.checkbox.inline+.checkbox.inline{margin-left:10px;}
input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{-webkit-opacity:0.5;-moz-opacity:0.5;opacity:0.5;cursor:not-allowed;}
input:focus,textarea:focus{border-color:#000000;outline:0;outline:thin dotted \9;}
input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus,select:focus{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.help-block,.help-inline{color:#808080;}
.help-block{display:block;margin-bottom:1em;line-height:1em;}
.help-inline{display:inline-block;vertical-align:middle;padding-left:5px;}
.form-inline input,.form-inline textarea,.form-inline select{display:inline-block;margin-bottom:0;}
.form-inline label{display:inline-block;}
.form-inline .radio,.form-inline .checkbox,.form-inline .radio{padding-left:0;margin-bottom:0;vertical-align:middle;}
.form-inline .radio input[type="radio"],.form-inline .checkbox input[type="checkbox"]{float:left;margin-left:0;margin-right:3px;}
.form-search input,.form-search textarea,.form-search select{display:inline-block;margin-bottom:0;}
.form-search .search-query{padding-left:14px;padding-right:14px;margin-bottom:0;-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;}
.form-search label{display:inline-block;}
.form-search .radio,.form-search .checkbox,.form-inline .radio{padding-left:0;margin-bottom:0;vertical-align:middle;}
.form-search .radio input[type="radio"],.form-search .checkbox input[type="checkbox"]{float:left;margin-left:0;margin-right:3px;}
html{background-color:#ffffff;font-family:'PT Serif',serif;font-color:#333332;font-size:90%;}
.navigation-wrapper{margin:0 auto;width:100%;padding:2em 0 3em;font-family:'PT Sans Narrow',sans-serif;font-weight:700;text-transform:uppercase;}
.site-name{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:1em;}
.top-navigation{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:1em;}
.top-navigation ul{list-style:none;margin:0;padding:0;}
.top-navigation li{list-style-type:none;display:inline;margin-right:25px;}.top-navigation li a{decoration:none;border-bottom:0 solid transparent;-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;}
#main{counter-reset:captions;margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:1em;}#main:before,#main:after{display:table;content:"";}
#main:after{clear:both;}
#main:before,#main:after{content:"";display:table;}
#main:after{clear:both;}
#main article{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:2em;}
#index{margin:0 auto;width:100%;display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;margin-bottom:2em;}#index article h2{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;margin-bottom:0;}
#index article p+p{text-indent:0;}
.image-wrap{position:relative;margin-bottom:2em;}.image-wrap:after{content:" ";display:block;position:absolute;bottom:-1px;left:8%;width:0;height:0;border:20px solid transparent;border-bottom-color:#ffffff;}
.image-wrap img{width:100%;height:auto;-ms-interpolation-mode:bicubic;}
.image-wrap .headline-wrap{position:absolute;bottom:25px;margin-left:8.333333333333334%;}.image-wrap .headline-wrap h1,.image-wrap .headline-wrap h2{color:#ffffff;text-shadow:0 1px 2px rgba(0, 0, 0, 0.25);}
.headline-wrap h1{font-size:48px;font-size:2.6666666666666665rem;margin-bottom:0.61875rem;}
.headline-wrap h2{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;text-transform:uppercase;}
.article-wrap h2{font-size:36px;font-size:2rem;margin-bottom:0.825rem;}
.article-wrap h3{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;}
.byline{clear:both;font-size:80%;}
.article-author-top h4,.article-author-bottom h4{margin-bottom:0.5em;}
.article-author-top p,.article-author-bottom p{font-size:80%;font-style:italic;}
.article-author-top a,.article-author-bottom a,.article-author-top a:hover,.article-author-bottom a:hover{border-bottom:0 solid transparent;}
.article-author-top img.bio-photo,.article-author-bottom img.bio-photo{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.article-author-top{display:none;}
.article-author-bottom .bio-photo{float:left;margin-right:25px;}
.toc{display:none;font-size:95%;-webkit-opacity:0.7;-moz-opacity:0.7;opacity:0.7;-webkit-transition:opacity 0.2s ease-in-out;-moz-transition:opacity 0.2s ease-in-out;-ms-transition:opacity 0.2s ease-in-out;-o-transition:opacity 0.2s ease-in-out;transition:opacity 0.2s ease-in-out;}.toc:hover{-webkit-opacity:1;-moz-opacity:1;opacity:1;}
.toc header{background:#1a1a1a;}
.toc h3{margin:0;padding:5px 10px;color:#ffffff;}.toc h3:hover{cursor:pointer;}
.toc ul{margin:2px 0 0;padding:0;background:#4d4d4d;line-height:1;}
.toc li{display:block;margin:0;padding:0;font-family:'PT Sans Narrow',sans-serif;border-bottom:1px solid #808080;}.toc li:last-child{border-bottom:0 solid transparent;}
.toc li a,.toc li a:hover{color:#ffffff;border-bottom:0 solid transparent;}
.toc li a{padding:10px;display:block;}
.toc li ul{margin:0;border-top:1px solid #808080;}
.image-grid{*zoom:1;list-style:none;margin:0 0 1em;padding:0;}.image-grid:before,.image-grid:after{display:table;content:"";}
.image-grid:after{clear:both;}
.image-grid:before,.image-grid:after{content:"";display:table;}
.image-grid:after{clear:both;}
.image-grid li{display:inline;float:left;width:50%;}
.recent-grid{*zoom:1;list-style:none;margin:1em 0;}.recent-grid:before,.recent-grid:after{display:table;content:"";}
.recent-grid:after{clear:both;}
.recent-grid:before,.recent-grid:after{content:"";display:table;}
.recent-grid:after{clear:both;}
.recent-grid li{display:inline;}.recent-grid li a{border-bottom:0 solid transparent;}.recent-grid li a:hover{border-bottom:0 solid transparent;}
.recent-grid img{width:19%;margin-bottom:1%;}
.holder{font-family:'PT Sans Narrow',sans-serif;}.holder a{cursor:pointer;margin:0 5px;}
.holder a.jp-previous{margin-left:0;margin-right:15px;}
.holder a.jp-next{margin-left:15px;margin-right:0;}
.holder a.jp-current{font-weight:bold;}
.holder a.jp-current,.holder a.jp-current:hover,.holder a.jp-disabled,.holder a.jp-disabled:hover{cursor:default;background:none;}
.holder span{margin:0 5px;}
.footer-wrap{margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:1em;padding-top:2em;padding-bottom:3em;background-color:#000000;}.footer-wrap:before,.footer-wrap:after{display:table;content:"";}
.footer-wrap:after{clear:both;}
.footer-wrap:before,.footer-wrap:after{content:"";display:table;}
.footer-wrap:after{clear:both;}
.footer-wrap a,.footer-wrap a:active,.footer-wrap a:visited,.footer-wrap p,.footer-wrap h4,.footer-wrap h5,.footer-wrap h6{color:#bfbfbf;}
.footer-wrap a{border-bottom:0 solid transparent;}.footer-wrap a:hover{color:#ffffff;border-bottom:0 solid transparent;}
.footer-wrap footer{display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;}
.related-articles{display:inline;float:left;width:83.33333333333334%;margin-left:8.333333333333334%;margin-right:8.333333333333334%;}.related-articles h4{font-size:21px;font-size:1.1666666666666667rem;margin-bottom:1.4142857142857141rem;text-transform:uppercase;margin-bottom:0;}
.related-articles li{margin-bottom:0;color:#ffffff;}
.footer-icons li{display:inline-block;padding-right:5px;}.footer-icons li a{font-size:24px;font-size:1.3333333333333333rem;margin-bottom:1.2375rem;color:#9a9a9a;-webkit-transition:0.4s linear;-moz-transition:0.4s linear;-ms-transition:0.4s linear;-o-transition:0.4s linear;transition:0.4s linear;}.footer-icons li a:hover{text-decoration:none;border-bottom:none;}.footer-icons li a:hover .icon-twitter,.footer-icons li a:hover .icon-twitter-sign{color:#2aa9df;}
.footer-icons li a:hover .icon-facebook,.footer-icons li a:hover .icon-facebook-sign{color:#3a5a98;}
.footer-icons li a:hover .icon-instagram,.footer-icons li a:hover .icon-instagram-sign{color:#306088;}
.footer-icons li a:hover .icon-google-plus,.footer-icons li a:hover .icon-google-plus-sign{color:#b63324;}
.footer-icons li a:hover .icon-lastfm,.footer-icons li a:hover .icon-lastfm-sign{color:#d80049;}
.footer-icons li a:hover .icon-github{color:#4183c4;}
.chrome-frame{background:#000;margin:0 0 2em 0;padding:10px;text-align:center;color:#ffffff;}.chrome-frame a{color:#ffffff;border-bottom:1px dotted #ffffff;text-decoration:none;}.chrome-frame a:hover{border-bottom:1px solid #ffffff;}
.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:502;overflow:hidden;position:fixed;background:#0b0b0b;opacity:0.8;filter:alpha(opacity=80);}
.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:503;position:fixed;outline:none !important;-webkit-backface-visibility:hidden;}
.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle;}
.mfp-align-top .mfp-container:before{display:none;}
.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:505;}
.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto;}.mfp-inline-holder .mfp-content:after,.mfp-ajax-holder .mfp-content:after{content:'';display:block;width:auto;height:auto;position:absolute;left:0;top:0;bottom:0;right:0;z-index:-1;box-shadow:0 0 8px rgba(0, 0, 0, 0.6);}
.mfp-ajax-cur{cursor:progress;}
.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out;}
.mfp-zoom,.image-popup{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in;}
.mfp-auto-cursor .mfp-content{cursor:auto;}
.mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;user-select:none;}
.mfp-loading.mfp-figure{display:none;}
.mfp-hide{display:none !important;}
.mfp-preloader{color:#cccccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-0.8em;left:8px;right:8px;z-index:504;}
.mfp-preloader a{color:#cccccc;}
.mfp-preloader a:hover{color:white;}
.mfp-s-ready .mfp-preloader{display:none;}
.mfp-s-error .mfp-content{display:none;}
button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;border:0;-webkit-appearance:none;display:block;padding:0;z-index:506;}
button.mfp-close{background:transparent;}
button::-moz-focus-inner{padding:0;border:0;}
.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:0.65;padding:0 0 18px 10px;color:white;font-style:normal;font-size:28px;font-family:Arial, Baskerville, monospace;}
.mfp-close:hover,.mfp-close:focus{opacity:1;}
.mfp-close:active{top:1px;}
.mfp-close-btn-in .mfp-close{color:#333333;}
.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:white;right:-6px;text-align:right;padding-right:6px;width:100%;}
.mfp-counter{position:absolute;top:0;right:0;color:#cccccc;font-size:12px;line-height:18px;}
.mfp-arrow{text-indent:100%;white-space:nowrap;overflow:hidden;position:absolute;top:0;opacity:0.65;margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;background-color:#000000;-webkit-transition:opacity 0.2s ease-in-out;-moz-transition:opacity 0.2s ease-in-out;-ms-transition:opacity 0.2s ease-in-out;-o-transition:opacity 0.2s ease-in-out;transition:opacity 0.2s ease-in-out;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
.mfp-arrow:active{margin-top:-54px;}
.mfp-arrow:hover,.mfp-arrow:focus{opacity:1;}
.mfp-arrow:before,.mfp-arrow:after,.mfp-arrow .mfp-b,.mfp-arrow .mfp-a{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:solid transparent;}
.mfp-arrow:after,.mfp-arrow .mfp-a{opacity:0.8;border-top-width:12px;border-bottom-width:12px;top:8px;}
.mfp-arrow:before,.mfp-arrow .mfp-b{border-top-width:20px;border-bottom-width:20px;}
.mfp-arrow-left{left:0;-webkit-border-top-right-radius:5px;-webkit-border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:0;-webkit-border-top-left-radius:0;-moz-border-radius-topright:5px;-moz-border-radius-bottomright:5px;-moz-border-radius-bottomleft:0;-moz-border-radius-topleft:0;border-top-right-radius:5px;border-bottom-right-radius:5px;border-bottom-left-radius:0;border-top-left-radius:0;-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box;}
.mfp-arrow-left:after,.mfp-arrow-left .mfp-a{border-right:12px solid #fff;left:5px;}
.mfp-arrow-left:before,.mfp-arrow-left .mfp-b{border-right:20px solid #fff;}
.mfp-arrow-right{right:0;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;-webkit-border-bottom-left-radius:5px;-webkit-border-top-left-radius:5px;-moz-border-radius-topright:0;-moz-border-radius-bottomright:0;-moz-border-radius-bottomleft:5px;-moz-border-radius-topleft:5px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:5px;border-top-left-radius:5px;-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box;}
.mfp-arrow-right:after,.mfp-arrow-right .mfp-a{border-left:12px solid #fff;left:3px;}
.mfp-arrow-right:before,.mfp-arrow-right .mfp-b{border-left:20px solid #fff;}
.mfp-iframe-holder{padding-top:40px;padding-bottom:40px;}
.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px;}
.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%;}
.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0, 0, 0, 0.6);background:black;}
.mfp-iframe-holder .mfp-close{top:-40px;}
img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0 40px;margin:0 auto;}
.mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0, 0, 0, 0.6);}
.mfp-figure{line-height:0;}
.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto;}
.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;}
.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px;}
.mfp-image-holder .mfp-content{max-width:100%;}
.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer;}
@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0;} .mfp-img-mobile img.mfp-img{padding:0;} .mfp-img-mobile .mfp-figure:after{top:0;bottom:0;} .mfp-img-mobile .mfp-bottom-bar{background:rgba(0, 0, 0, 0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .mfp-img-mobile .mfp-bottom-bar:empty{padding:0;} .mfp-img-mobile .mfp-counter{right:5px;top:3px;} .mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0, 0, 0, 0.6);position:fixed;text-align:center;padding:0;} .mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px;}}@media all and (max-width:800px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75);} .mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0;} .mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%;} .mfp-container{padding-left:6px;padding-right:6px;}}.mfp-ie7 .mfp-img{padding:0;}
.mfp-ie7 .mfp-bottom-bar{width:600px;left:50%;margin-left:-300px;margin-top:5px;padding-bottom:5px;}
.mfp-ie7 .mfp-container{padding:0;}
.mfp-ie7 .mfp-content{padding-top:44px;}
.mfp-ie7 .mfp-close{top:0;right:0;padding-top:0;}
.mfp-fade .zoom-anim-dialog{opacity:0;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);}
.mfp-fade.mfp-ready .zoom-anim-dialog{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
.mfp-fade.mfp-removing .zoom-anim-dialog{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);opacity:0;}
.mfp-fade.mfp-bg{opacity:0;-webkit-transition:opacity 0.3s ease-out;-moz-transition:opacity 0.3s ease-out;-ms-transition:opacity 0.3s ease-out;-o-transition:opacity 0.3s ease-out;transition:opacity 0.3s ease-out;}
.mfp-fade.mfp-ready.mfp-bg{opacity:0.8;}
.mfp-fade.mfp-removing.mfp-bg{opacity:0;}
@media print{*{background:transparent !important;color:black !important;box-shadow:none !important;text-shadow:none !important;filter:none !important;-ms-filter:none !important;position:static !important;} @page {margin:0.5cm;}h2,h3{orphans:3;widows:3;page-break-after:avoid;} p{orphans:3;widows:3;} pre,blockquote{border:1px solid #333;page-break-inside:avoid;padding:1em;} abbr[title]:after{content:" (" attr(title) ")";} a,a:visited{text-decoration:underline;} a[href]:after{content:" (" attr(href) ")";} a[href^="javascript:"]:after,a[href^="#"]:after{content:"";} img{max-width:100% !important;page-break-inside:avoid;} thead{display:table-header-group;} tr{page-break-inside:avoid;}}@media only screen and (min-width:30em){.image-grid li{width:33.333333%;}}@media only screen and (min-width:37.5em){html{font-size:95%;} .site-name{display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;} .top-navigation{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%;} .image-wrap .headline-wrap,.image-wrap:after{left:25%;} .image-wrap .headline-wrap{margin-left:0;} #main article{display:inline;float:left;width:50%;margin-left:0%;margin-right:0%;} #index{display:inline;float:left;width:50%;margin-left:0%;margin-right:0%;} .footer-wrap footer{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%;} .article-author-top{display:block;display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;} .article-author-bottom{display:none;} .toc{display:block;display:inline;float:left;width:16.666666666666668%;margin-left:4.166666666666667%;margin-right:4.166666666666667%;position:fixed;top:120px;right:0;-webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.5);-moz-box-shadow:0 0 5px rgba(0, 0, 0, 0.5);box-shadow:0 0 5px rgba(0, 0, 0, 0.5);} .image-grid li{width:25%;} .related-articles{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%;}}@media only screen and (min-width:48em){html{font-size:100%;} .image-grid li{width:20%;}}@media only screen and (min-width:62em){html{font-size:112.5%;} .image-grid li{width:16.666666666%;}}@media only screen and (min-width:86.375em){.site-name{display:inline;float:left;width:12.5%;margin-left:16.666666666666668%;} .top-navigation{display:inline;float:left;width:66.66666666666667%;} .image-wrap:after{left:33.333333333%;} .image-wrap .headline-wrap{margin-left:8.333333333333334%;} #main article{display:inline;float:left;width:37.5%;} #index{display:inline;float:left;width:37.5%;} .related-articles{display:inline;float:left;width:37.5%;margin-left:33.333333333333336%;margin-right:29.166666666666668%;} .footer-wrap footer{display:inline;float:left;width:37.5%;margin-left:33.333333333333336%;margin-right:29.166666666666668%;} .article-author-top{display:inline;float:left;width:12.5%;margin-left:16.666666666666668%;}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){}
/* CSS Normalize =========================================== */
/*! normalize.css v2.1.0 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}
/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block;
}
/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
 * Address styling not present in IE 8/9.
 */
[hidden] {
  display: none;
}
/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */

  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  /* 2 */

}
/**
 * Remove default margin.
 */
body {
  margin: 0;
}
/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}
/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}
/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}
/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}
/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}
/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}
/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}
/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre;
}
/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}
/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}
/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}
/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0;
}
/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */

  padding: 0;
  /* 2 */

}
/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */

  font-size: 100%;
  /* 2 */

  margin: 0;
  /* 3 */

}
/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}
/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}
/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */

  cursor: pointer;
  /* 3 */

}
/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}
/**
 * 1. Address box sizing set to `content-box` in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */

  padding: 0;
  /* 2 */

}
/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */

  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */

  box-sizing: content-box;
}
/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */

  vertical-align: top;
  /* 2 */

}
/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 1.5em;
}
/* Variables and mixins ==================================== */
/* Links ================================================= */
/* Site wide styles (html, body, global classes) =========== */
/* Selection ============================================= */
::-moz-selection {
  background-color: #dadada;
  color: #343434;
  text-shadow: none;
}
::selection {
  background-color: #dadada;
  color: #343434;
  text-shadow: none;
}
/* Global Classes ======================================== */
.all-caps {
  text-transform: uppercase;
}
.pull-left {
  float: left;
}
.pull-right {
  float: right;
}
.image-pull-right {
  float: right;
  margin-top: 0;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}
.unstyled-list {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.unstyled-list li {
  list-style-type: none;
}
/* Global Transition ==================================== */
b,
i,
strong,
em,
blockquote,
p,
q,
span,
figure,
img,
h1,
h2,
header,
input,
a {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
body {
  font-family: 'PT Serif', serif;
  color: #333332;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'PT Sans Narrow', sans-serif;
}
h1 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 0.8125;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h2 {
  font-size: 28px;
  font-size: 1.75rem;
  line-height: 0.9286;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h3 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.0833;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h4 {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.4444;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h5 {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.625;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
h6 {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
a {
  text-decoration: none;
  color: #343434;
}
a:visited {
  color: #676767;
}
a:hover {
  color: #010101;
}
a:focus {
  outline: thin dotted;
  color: #010101;
}
a:hover,
a:active {
  outline: 0;
}
figcaption {
  padding-top: 10px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  line-height: 1.3;
  color: #4d4d4b;
}
.image-credit {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  display: block;
  text-align: right;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 2.1667;
  line-height: 1.3;
  font-style: italic;
  color: #80807e;
}
.image-credit a {
  color: #80807e;
}
.notice {
  margin-top: 1.5em;
  padding: .5em 1em;
  text-indent: 0;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
blockquote {
  margin-left: -28px;
  padding-left: 20px;
  border-left: 8px solid #333332;
  font-family: 'PT Serif', serif;
  font-style: italic;
  font-size: 24px;
  font-size: 1.5rem;
}
.footnotes ol,
.footnotes li,
.footnotes p {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.8571;
  margin-bottom: 26px;
  margin-bottom: 1.625rem;
}
p {
  margin: 0 0 1.625rem;
}
p + p {
  text-indent: 1.625rem;
  margin-top: -1.625rem;
}
tt,
code,
kbd,
samp,
pre {
  font-family: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
}
p code,
li code {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.5;
  white-space: nowrap;
  margin: 0 2px;
  padding: 0 5px;
  border: 1px solid #f7f7f7;
  background-color: #ffffff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
pre {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.5;
  overflow-x: auto;
}
/* Pygments Syntax highlighting ============================= */
.highlight {
  background-color: #efefef;
  font-family: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 2.1667;
  color: #333332;
  margin-bottom: 1.5em;
  /* Comment */

  /* Error */

  /* Keyword */

  /* Operator */

  /* Comment.Multiline */

  /* Comment.Preproc */

  /* Comment.Single */

  /* Comment.Special */

  /* Generic.Deleted */

  /* Generic.Emph */

  /* Generic.Error */

  /* Generic.Heading */

  /* Generic.Inserted */

  /* Generic.Output */

  /* Generic.Prompt */

  /* Generic.Strong */

  /* Generic.Subheading */

  /* Generic.Traceback */

  /* Keyword.Constant */

  /* Keyword.Declaration */

  /* Keyword.Namespace */

  /* Keyword.Pseudo */

  /* Keyword.Reserved */

  /* Keyword.Type */

  /* Literal.Number */

  /* Literal.String */

  /* Name.Attribute */

  /* Name.Builtin */

  /* Name.Class */

  /* Name.Constant */

  /* Name.Decorator */

  /* Name.Entity */

  /* Name.Exception */

  /* Name.Function */

  /* Name.Label */

  /* Name.Namespace */

  /* Name.Tag */

  /* Name.Variable */

  /* Operator.Word */

  /* Text.Whitespace */

  /* Literal.Number.Float */

  /* Literal.Number.Hex */

  /* Literal.Number.Integer */

  /* Literal.Number.Oct */

  /* Literal.String.Backtick */

  /* Literal.String.Char */

  /* Literal.String.Doc */

  /* Literal.String.Double */

  /* Literal.String.Escape */

  /* Literal.String.Heredoc */

  /* Literal.String.Interpol */

  /* Literal.String.Other */

  /* Literal.String.Regex */

  /* Literal.String.Single */

  /* Literal.String.Symbol */

  /* Name.Builtin.Pseudo */

  /* Name.Variable.Class */

  /* Name.Variable.Global */

  /* Name.Variable.Instance */

  /* Literal.Number.Integer.Long */

}
.highlight pre {
  position: relative;
  margin: 0;
  padding: 1em;
}
.highlight .lineno {
  padding-right: 24px;
  color: #b3b3b1;
}
.highlight .hll {
  background-color: #ffffcc;
}
.highlight .c {
  color: #999988;
  font-style: italic;
}
.highlight .err {
  color: #a61717;
  background-color: #e3d2d2;
}
.highlight .k {
  color: #000000;
  font-weight: bold;
}
.highlight .o {
  color: #000000;
  font-weight: bold;
}
.highlight .cm {
  color: #999988;
  font-style: italic;
}
.highlight .cp {
  color: #999999;
  font-weight: bold;
  font-style: italic;
}
.highlight .c1 {
  color: #999988;
  font-style: italic;
}
.highlight .cs {
  color: #999999;
  font-weight: bold;
  font-style: italic;
}
.highlight .gd {
  color: #000000;
  background-color: #ffdddd;
}
.highlight .ge {
  color: #000000;
  font-style: italic;
}
.highlight .gr {
  color: #aa0000;
}
.highlight .gh {
  color: #999999;
}
.highlight .gi {
  color: #000000;
  background-color: #ddffdd;
}
.highlight .go {
  color: #888888;
}
.highlight .gp {
  color: #555555;
}
.highlight .gs {
  font-weight: bold;
}
.highlight .gu {
  color: #aaaaaa;
}
.highlight .gt {
  color: #aa0000;
}
.highlight .kc {
  color: #000000;
  font-weight: bold;
}
.highlight .kd {
  color: #000000;
  font-weight: bold;
}
.highlight .kn {
  color: #000000;
  font-weight: bold;
}
.highlight .kp {
  color: #000000;
  font-weight: bold;
}
.highlight .kr {
  color: #000000;
  font-weight: bold;
}
.highlight .kt {
  color: #445588;
  font-weight: bold;
}
.highlight .m {
  color: #009999;
}
.highlight .s {
  color: #d01040;
}
.highlight .na {
  color: #008080;
}
.highlight .nb {
  color: #0086b3;
}
.highlight .nc {
  color: #445588;
  font-weight: bold;
}
.highlight .no {
  color: #008080;
}
.highlight .nd {
  color: #3c5d5d;
  font-weight: bold;
}
.highlight .ni {
  color: #800080;
}
.highlight .ne {
  color: #990000;
  font-weight: bold;
}
.highlight .nf {
  color: #990000;
  font-weight: bold;
}
.highlight .nl {
  color: #990000;
  font-weight: bold;
}
.highlight .nn {
  color: #555555;
}
.highlight .nt {
  color: #000080;
}
.highlight .nv {
  color: #008080;
}
.highlight .ow {
  color: #000000;
  font-weight: bold;
}
.highlight .w {
  color: #bbbbbb;
}
.highlight .mf {
  color: #009999;
}
.highlight .mh {
  color: #009999;
}
.highlight .mi {
  color: #009999;
}
.highlight .mo {
  color: #009999;
}
.highlight .sb {
  color: #d01040;
}
.highlight .sc {
  color: #d01040;
}
.highlight .sd {
  color: #d01040;
}
.highlight .s2 {
  color: #d01040;
}
.highlight .se {
  color: #d01040;
}
.highlight .sh {
  color: #d01040;
}
.highlight .si {
  color: #d01040;
}
.highlight .sx {
  color: #d01040;
}
.highlight .sr {
  color: #009926;
}
.highlight .s1 {
  color: #d01040;
}
.highlight .ss {
  color: #990073;
}
.highlight .bp {
  color: #999999;
}
.highlight .vc {
  color: #008080;
}
.highlight .vg {
  color: #008080;
}
.highlight .vi {
  color: #008080;
}
.highlight .il {
  color: #009999;
}
.CodeRay {
  background-color: #efefef;
  font-family: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 2.1667;
  color: #333332;
  margin-bottom: 1.5em;
}
.CodeRay pre {
  margin: 0px;
  padding: 1em;
}
span.CodeRay {
  white-space: pre;
  border: 0px;
  padding: 2px;
}
table.CodeRay {
  border-collapse: collapse;
  width: 100%;
  padding: 2px;
}
table.CodeRay td {
  padding: 1em 0.5em;
  vertical-align: top;
}
.CodeRay .line-numbers,
.CodeRay .no {
  background-color: #ECECEC;
  color: #AAA;
  text-align: right;
}
.CodeRay .line-numbers a {
  color: #AAA;
}
.CodeRay .line-numbers tt {
  font-weight: bold;
}
.CodeRay .line-numbers .highlighted {
  color: #ff0000;
}
.CodeRay .line {
  display: block;
  float: left;
  width: 100%;
}
.CodeRay span.line-numbers {
  padding: 0 24px 0 4px;
}
.CodeRay .code {
  width: 100%;
}
ol.CodeRay {
  font-size: 10pt;
}
ol.CodeRay li {
  white-space: pre;
}
.CodeRay .code pre {
  overflow: auto;
}
.CodeRay .debug {
  color: white ! important;
  background: blue ! important;
}
.CodeRay .annotation {
  color: #000077;
}
.CodeRay .attribute-name {
  color: #ff0088;
}
.CodeRay .attribute-value {
  color: #770000;
}
.CodeRay .binary {
  color: #509;
  font-weight: bold;
}
.CodeRay .comment {
  color: #998;
  font-style: italic;
}
.CodeRay .char {
  color: #0044dd;
}
.CodeRay .char .content {
  color: #0044dd;
}
.CodeRay .char .delimiter {
  color: #003399;
}
.CodeRay .class {
  color: #458;
  font-weight: bold;
}
.CodeRay .complex {
  color: #A08;
  font-weight: bold;
}
.CodeRay .constant {
  color: teal;
}
.CodeRay .color {
  color: #00aa00;
}
.CodeRay .class-variable {
  color: #336699;
}
.CodeRay .decorator {
  color: #B0B;
}
.CodeRay .definition {
  color: #099;
  font-weight: bold;
}
.CodeRay .directive {
  color: #088;
  font-weight: bold;
}
.CodeRay .delimiter {
  color: #000000;
}
.CodeRay .doc {
  color: #997700;
}
.CodeRay .doctype {
  color: #3344bb;
}
.CodeRay .doc-string {
  color: #D42;
  font-weight: bold;
}
.CodeRay .escape {
  color: #666;
  font-weight: bold;
}
.CodeRay .entity {
  color: #800;
  font-weight: bold;
}
.CodeRay .error {
  color: #F00;
  background-color: #ffaaaa;
}
.CodeRay .exception {
  color: #C00;
  font-weight: bold;
}
.CodeRay .filename {
  color: #099;
}
.CodeRay .function {
  color: #900;
  font-weight: bold;
}
.CodeRay .global-variable {
  color: teal;
  font-weight: bold;
}
.CodeRay .hex {
  color: #058;
  font-weight: bold;
}
.CodeRay .integer {
  color: #099;
}
.CodeRay .include {
  color: #B44;
  font-weight: bold;
}
.CodeRay .inline {
  color: #000000;
}
.CodeRay .inline .inline {
  background: #cccccc;
}
.CodeRay .inline .inline .inline {
  background: #bbbbbb;
}
.CodeRay .inline .inline-delimiter {
  color: #D14;
}
.CodeRay .inline-delimiter {
  color: #D14;
}
.CodeRay .important {
  color: #f00;
}
.CodeRay .interpreted {
  color: #B2B;
  font-weight: bold;
}
.CodeRay .instance-variable {
  color: #008080;
}
.CodeRay .label {
  color: #970;
  font-weight: bold;
}
.CodeRay .local-variable {
  color: #996633;
}
.CodeRay .octal {
  color: #40E;
  font-weight: bold;
}
.CodeRay .predefined-constant {
  font-weight: bold;
}
.CodeRay .predefined {
  color: #369;
  font-weight: bold;
}
.CodeRay .preprocessor {
  color: #579;
}
.CodeRay .pseudo-class {
  color: #00C;
  font-weight: bold;
}
.CodeRay .predefined-type {
  color: #074;
  font-weight: bold;
}
.CodeRay .reserved,
.keyword {
  color: #000;
  font-weight: bold;
}
.CodeRay .key {
  color: #808;
}
.CodeRay .key .delimiter {
  color: #606;
}
.CodeRay .key .char {
  color: #80f;
}
.CodeRay .value {
  color: #088;
}
.CodeRay .regexp {
  background-color: #fff0ff;
}
.CodeRay .regexp .content {
  color: #880088;
}
.CodeRay .regexp .delimiter {
  color: #440044;
}
.CodeRay .regexp .modifier {
  color: #cc22cc;
}
.CodeRay .regexp .function {
  color: #404;
  font-weight: bold;
}
.CodeRay .string {
  color: #D20;
}
.CodeRay .string .string .string {
  background-color: #ffd0d0;
}
.CodeRay .string .content {
  color: #D14;
}
.CodeRay .string .char {
  color: #D14;
}
.CodeRay .string .delimiter {
  color: #D14;
}
.CodeRay .shell {
  color: #dd1144;
}
.CodeRay .shell .delimiter {
  color: #dd1144;
}
.CodeRay .symbol {
  color: #990073;
}
.CodeRay .symbol .content {
  color: #aa6600;
}
.CodeRay .symbol .delimiter {
  color: #663300;
}
.CodeRay .tag {
  color: #007700;
}
.CodeRay .tag-special {
  color: #D70;
  font-weight: bold;
}
.CodeRay .type {
  color: #339;
  font-weight: bold;
}
.CodeRay .variable {
  color: #003366;
}
.CodeRay .insert {
  background: #afa;
}
.CodeRay .delete {
  background: #faa;
}
.CodeRay .change {
  color: #aaf;
  background: #007;
}
.CodeRay .head {
  color: #f8f;
  background: #550055;
}
.CodeRay .insert .insert {
  color: #080;
  font-weight: bold;
}
.CodeRay .delete .delete {
  color: #800;
  font-weight: bold;
}
.CodeRay .change .change {
  color: #66f;
}
.CodeRay .head .head {
  color: #f4f;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.hidden {
  display: none;
  visibility: hidden;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  position: static;
  clip: auto;
  height: auto;
  width: auto;
  margin: 0;
  overflow: visible;
}
/* Figures, images, social media, other elements =========== */
hr {
  display: block;
  margin: 1em 0;
  padding: 0;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #fff;
}
/* Figures and images ==================================== */
article img {
  max-width: 100%;
  height: auto;
  border-width: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic;
}
svg:not(:root) {
  overflow: hidden;
}
.half {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
}
.half:before,
.half:after {
  display: table;
  content: "";
}
.half:after {
  clear: both;
}
.half:before,
.half:after {
  display: table;
  content: "";
  line-height: 0;
}
.half:after {
  clear: both;
}
.half img {
  display: inline;
  float: left;
  width: 50%;
}
.half figcaption {
  display: inline;
  float: left;
  width: 100%;
}
.third {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
}
.third:before,
.third:after {
  display: table;
  content: "";
}
.third:after {
  clear: both;
}
.third:before,
.third:after {
  display: table;
  content: "";
  line-height: 0;
}
.third:after {
  clear: both;
}
.third img {
  display: inline;
  float: left;
  width: 33.333333333333336%;
}
.third figcaption {
  display: inline;
  float: left;
  width: 100%;
}
/* Buttons ============================================== */
.btn {
  display: inline-block;
  margin-bottom: 20px;
  padding: 8px 20px;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #111111;
  color: #ffffff;
  border: 2px solid #111111 !important;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.btn:visited {
  color: #ffffff;
}
.btn:hover {
  background-color: #ffffff;
  color: #111111;
}
.btn:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
/* Well ================================================= */
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
/* Custom set of Icomoon webfont icons ===================== */
@font-face {
  font-family: 'icomoon';
  src: url('../fonts/icomoon.eot');
  src: url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('../fonts/icomoon.woff') format('woff'), url('../fonts/icomoon.ttf') format('truetype'), url('../fonts/icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
  font-family: 'icomoon';
  content: attr(data-icon);
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
/* Use the following CSS code if you want to have a class per icon */
/*
Instead of a list of all class selectors,
you can use the generic selector below, but it's slower:
[class*="icon-"] {
*/
.icon-instagram,
.icon-facebook,
.icon-twitter,
.icon-google-plus,
.icon-feed,
.icon-feed-2,
.icon-linkedin,
.icon-tumblr,
.icon-lastfm,
.icon-mail,
.icon-github {
  font-family: 'icomoon';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
.icon-instagram:before {
  content: "\e004";
}
.icon-facebook:before {
  content: "\e003";
}
.icon-twitter:before {
  content: "\e007";
}
.icon-google-plus:before {
  content: "\e00a";
}
.icon-feed:before {
  content: "\e00b";
}
.icon-feed-2:before {
  content: "\e00c";
}
.icon-linkedin:before {
  content: "\e001";
}
.icon-tumblr:before {
  content: "\e002";
}
.icon-lastfm:before {
  content: "\e005";
}
.icon-mail:before {
  content: "\e006";
}
.icon-github:before {
  content: "\e000";
}
/* Standard form controls ================================== */
form {
  margin: 0 0 5px 0;
}
form fieldset {
  margin-bottom: 5px;
  padding: 0;
  border-width: 0;
}
form legend {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  *margin-left: -7px;
  padding: 0;
  color: #333332;
  border: 0;
  border-bottom: 1px solid #dddddd;
  white-space: normal;
}
form p {
  margin-bottom: 2.5px;
}
form ul {
  list-style-type: none;
  margin: 0 0 5px 0;
  padding: 0;
}
form br {
  display: none;
}
label,
input,
button,
select,
textarea {
  vertical-align: baseline;
  *vertical-align: middle;
}
input,
button,
select,
textarea {
  font-family: 'PT Serif', serif;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
label {
  display: block;
  margin-bottom: 1.25px;
  font-weight: bold;
  color: #333332;
  cursor: pointer;
}
label input,
label textarea,
label select {
  display: block;
}
input,
textarea,
select {
  display: inline-block;
  width: 100%;
  padding: 4px;
  margin-bottom: 1.25px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  color: #333332;
}
input:hover,
textarea:hover,
select:hover {
  border-color: #919191;
}
.input-mini {
  width: 60px;
}
.input-small {
  width: 90px;
}
input[type="image"],
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  height: auto;
  padding: 0;
  margin: 3px 0;
  *margin-top: 0;
  line-height: normal;
  cursor: pointer;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border: 0 \9;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  *width: 13px;
  *height: 13px;
}
input[type="image"] {
  border: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
input[type="file"] {
  width: auto;
  padding: initial;
  line-height: initial;
  border: initial;
  background-color: transparent;
  background-color: initial;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
input[type="button"],
input[type="reset"],
input[type="submit"] {
  width: auto;
  height: auto;
  cursor: pointer;
  *overflow: visible;
}
select,
input[type="file"] {
  *margin-top: 4px;
}
select {
  width: auto;
  background-color: #ffffff;
}
select[multiple],
select[size] {
  height: auto;
}
textarea {
  resize: vertical;
  height: auto;
  overflow: auto;
  vertical-align: top;
}
input[type="hidden"] {
  display: none;
}
.radio,
.checkbox {
  padding-left: 18px;
  font-weight: normal;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
  float: left;
  margin-left: -18px;
}
.radio.inline,
.checkbox.inline {
  display: inline-block;
  padding-top: 5px;
  margin-bottom: 0;
  vertical-align: middle;
}
.radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline {
  margin-left: 10px;
}
/* disabled ==================================== */
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  cursor: not-allowed;
}
/* focus and active ============================ */
input:focus,
textarea:focus {
  border-color: #111111;
  outline: 0;
  outline: thin dotted \9;
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus,
select:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
/* help text ==================================== */
.help-block,
.help-inline {
  color: #919191;
}
.help-block {
  display: block;
  margin-bottom: 1em;
  line-height: 1em;
}
.help-inline {
  display: inline-block;
  vertical-align: middle;
  padding-left: 5px;
}
/* .form-inline ================================= */
.form-inline input,
.form-inline textarea,
.form-inline select {
  display: inline-block;
  margin-bottom: 0;
}
.form-inline label {
  display: inline-block;
}
.form-inline .radio,
.form-inline .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px;
}
/* .form-search ================================= */
.form-search input,
.form-search textarea,
.form-search select {
  display: inline-block;
  margin-bottom: 0;
}
.form-search .search-query {
  padding-left: 14px;
  padding-right: 14px;
  margin-bottom: 0;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
}
.form-search label {
  display: inline-block;
}
.form-search .radio,
.form-search .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px;
}
/* Page level layout styles ================================ */
body {
  background-color: #ffffff;
  font-family: 'PT Serif', serif;
  font-color: #333332;
}
.navigation-wrapper {
  margin: 0 auto;
  width: 100%;
  padding: 2em 0 3em;
  font-family: 'PT Sans Narrow', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}
.site-name {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 1em;
}
.top-navigation {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 1em;
}
.top-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.top-navigation li {
  list-style-type: none;
  display: inline;
  margin-right: 25px;
}
.top-navigation li a {
  decoration: none;
  border-bottom: 0 solid transparent;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
#main {
  counter-reset: captions;
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
  clear: both;
  margin-top: 1em;
}
#main:before,
#main:after {
  display: table;
  content: "";
}
#main:after {
  clear: both;
}
#main:before,
#main:after {
  display: table;
  content: "";
  line-height: 0;
}
#main:after {
  clear: both;
}
#main article {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
#index {
  margin: 0 auto;
  width: 100%;
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
#index h3 {
  margin: 0;
  padding-bottom: .5em;
  font-size: 28px;
  font-size: 1.75rem;
  border-bottom: 1px solid #c3c3c3;
}
#index article h2 {
  margin-bottom: 0;
  font-size: 24px;
  font-size: 1.5rem;
}
#index article p + p {
  text-indent: 0;
}
.image-wrap {
  position: relative;
  margin-bottom: 2em;
}
.image-wrap:after {
  content: " ";
  display: block;
  position: absolute;
  bottom: -1px;
  left: 8%;
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-bottom-color: #ffffff;
}
.image-wrap img {
  width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
}
.image-wrap .headline-wrap {
  position: absolute;
  bottom: 25px;
  margin-left: 8.333333333333334%;
}
.image-wrap .headline-wrap h1,
.image-wrap .headline-wrap h2 {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.byline {
  clear: both;
  font-size: 80%;
}
.article-author-top h3,
.article-author-bottom h3 {
  margin-bottom: 0;
}
.article-author-top p,
.article-author-bottom p {
  font-size: 80%;
  font-style: italic;
}
.article-author-top a,
.article-author-bottom a,
.article-author-top a:hover,
.article-author-bottom a:hover {
  border-bottom: 0 solid transparent;
}
.article-author-top img.bio-photo,
.article-author-bottom img.bio-photo {
  width: 100px;
  height: 100px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
}
.author-social {
  display: block;
  margin-bottom: 5px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #111111;
}
.author-social:visited {
  color: #111111;
}
.author-social:hover {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}
.author-social:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
.article-author-top {
  display: none;
  text-align: center;
}
.article-author-bottom {
  margin-bottom: 1em;
}
.article-author-bottom .bio-photo {
  float: left;
  margin-right: 25px;
}
.article-author-bottom .author-social {
  display: inline-block;
  margin-right: 5px;
}
.article-wrap p > a,
.article-wrap li > a {
  border-bottom: 1px dotted #b3b3b3;
}
.article-wrap p > a:hover,
.article-wrap li > a:hover {
  border-bottom-style: solid;
}
.article-wrap p > a.reversefootnote,
.article-wrap li > a.reversefootnote {
  border-bottom-width: 0;
}
.toc {
  display: none;
  font-size: 95%;
  -webkit-opacity: 0.7;
  -moz-opacity: 0.7;
  opacity: 0.7;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.toc:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
.toc header {
  background: #2b2b2b;
}
.toc h3 {
  margin: 0;
  padding: 5px 10px;
  color: #ffffff;
}
.toc h3:hover {
  cursor: pointer;
}
.toc ul {
  margin: 2px 0 0;
  padding: 0;
  background: #5e5e5e;
  line-height: 1;
}
.toc li {
  display: block;
  margin: 0;
  padding: 0;
  font-family: 'PT Sans Narrow', sans-serif;
  border-bottom: 1px solid #808080;
}
.toc li:last-child {
  border-bottom: 0 solid transparent;
}
.toc li a,
.toc li a:hover {
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
.toc li a {
  padding: 10px;
  display: block;
}
.toc li ul {
  margin: 0;
  border-top: 1px solid #808080;
}
.image-grid {
  *zoom: 1;
  list-style: none;
  margin: 0 0 1em;
  padding: 0;
}
.image-grid:before,
.image-grid:after {
  display: table;
  content: "";
}
.image-grid:after {
  clear: both;
}
.image-grid:before,
.image-grid:after {
  display: table;
  content: "";
  line-height: 0;
}
.image-grid:after {
  clear: both;
}
.image-grid li {
  display: inline;
  float: left;
  width: 50%;
}
.recent-grid {
  *zoom: 1;
  list-style: none;
  margin: 1em 0;
}
.recent-grid:before,
.recent-grid:after {
  display: table;
  content: "";
}
.recent-grid:after {
  clear: both;
}
.recent-grid:before,
.recent-grid:after {
  display: table;
  content: "";
  line-height: 0;
}
.recent-grid:after {
  clear: both;
}
.recent-grid li {
  display: inline;
}
.recent-grid li a {
  border-bottom: 0 solid transparent;
}
.recent-grid li a:hover {
  border-bottom: 0 solid transparent;
}
.recent-grid img {
  width: 19%;
  margin-bottom: 1%;
}
.holder {
  font-family: 'PT Sans Narrow', sans-serif;
}
.holder a {
  cursor: pointer;
  margin: 0 5px;
}
.holder a.jp-previous {
  margin-left: 0;
  margin-right: 15px;
}
.holder a.jp-next {
  margin-left: 15px;
  margin-right: 0;
}
.holder a.jp-current {
  font-weight: bold;
}
.holder a.jp-current,
.holder a.jp-current:hover,
.holder a.jp-disabled,
.holder a.jp-disabled:hover {
  cursor: default;
  background: none;
}
.holder span {
  margin: 0 5px;
}
.footer-wrap {
  margin: 0 auto;
  width: 100%;
  *zoom: 1;
  clear: both;
  margin-top: 1em;
  padding-top: 2em;
  padding-bottom: 3em;
  background-color: #111111;
}
.footer-wrap:before,
.footer-wrap:after {
  display: table;
  content: "";
}
.footer-wrap:after {
  clear: both;
}
.footer-wrap:before,
.footer-wrap:after {
  display: table;
  content: "";
  line-height: 0;
}
.footer-wrap:after {
  clear: both;
}
.footer-wrap a,
.footer-wrap a:active,
.footer-wrap a:visited,
.footer-wrap p,
.footer-wrap h4,
.footer-wrap h5,
.footer-wrap h6,
.footer-wrap span {
  color: #bfbfbf;
}
.footer-wrap span {
  font-size: 14px;
  font-size: 0.875rem;
}
.footer-wrap a {
  border-bottom: 0 solid transparent;
}
.footer-wrap a:hover {
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
.footer-wrap footer {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
}
.related-articles {
  display: inline;
  float: left;
  width: 83.33333333333334%;
  margin-left: 8.333333333333334%;
  margin-right: 8.333333333333334%;
  margin-bottom: 2em;
}
.related-articles h4 {
  text-transform: uppercase;
  margin-bottom: 0;
}
.related-articles li {
  margin-bottom: 0;
  color: #ffffff;
}
.footer-icons li {
  display: inline-block;
  padding-right: 5px;
}
.footer-icons li a {
  color: #9a9a9a;
  -webkit-transition: 0.4s linear;
  -moz-transition: 0.4s linear;
  -ms-transition: 0.4s linear;
  -o-transition: 0.4s linear;
  transition: 0.4s linear;
}
.footer-icons li a:hover {
  text-decoration: none;
  border-bottom: none;
}
.footer-icons li a:hover .icon-twitter,
.footer-icons li a:hover .icon-twitter-sign {
  color: #2aa9df;
}
.footer-icons li a:hover .icon-facebook,
.footer-icons li a:hover .icon-facebook-sign {
  color: #3a5a98;
}
.footer-icons li a:hover .icon-instagram,
.footer-icons li a:hover .icon-instagram-sign {
  color: #306088;
}
.footer-icons li a:hover .icon-google-plus,
.footer-icons li a:hover .icon-google-plus-sign {
  color: #b63324;
}
.footer-icons li a:hover .icon-lastfm,
.footer-icons li a:hover .icon-lastfm-sign {
  color: #d80049;
}
.footer-icons li a:hover .icon-github {
  color: #4183c4;
}
.browser-upgrade {
  background: #000;
  margin: 0 0 2em 0;
  padding: 10px;
  text-align: center;
  color: #ffffff;
}
.browser-upgrade a {
  color: #ffffff;
  border-bottom: 1px dotted #ffffff;
  text-decoration: none;
}
.browser-upgrade a:hover {
  border-bottom: 1px solid #ffffff;
}
#goog-fixurl ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
#goog-fixurl ul li {
  list-style-type: none;
}
#goog-wm-qt {
  width: auto;
  margin-right: 10px;
  margin-bottom: 20px;
  padding: 8px 20px;
  display: inline-block;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #ffffff;
  color: #111111;
  border-width: 2px !important;
  border-style: solid !important;
  border-color: #919191;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#goog-wm-sb {
  display: inline-block;
  margin-bottom: 20px;
  padding: 8px 20px;
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #111111;
  color: #ffffff;
  border: 2px solid #111111 !important;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
#goog-wm-sb:visited {
  color: #ffffff;
}
#goog-wm-sb:hover {
  background-color: #ffffff;
  color: #111111;
}
#goog-wm-sb:active {
  -webkit-transform: translate(0, 2px);
  -moz-transform: translate(0, 2px);
  -ms-transform: translate(0, 2px);
  -o-transform: translate(0, 2px);
  transform: translate(0, 2px);
}
/* jQuery Magnific-Popup =================================== */
/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 502;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 503;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}
.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.mfp-align-top .mfp-container:before {
  display: none;
}
.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 505;
}
.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}
.mfp-inline-holder .mfp-content:after,
.mfp-ajax-holder .mfp-content:after {
  content: '';
  display: block;
  width: auto;
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.mfp-ajax-cur {
  cursor: progress;
}
.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}
.mfp-zoom,
.image-popup {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}
.mfp-auto-cursor .mfp-content {
  cursor: auto;
}
.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.mfp-loading.mfp-figure {
  display: none;
}
.mfp-hide {
  display: none !important;
}
.mfp-preloader {
  color: #cccccc;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 504;
}
.mfp-preloader a {
  color: #cccccc;
}
.mfp-preloader a:hover {
  color: white;
}
.mfp-s-ready .mfp-preloader {
  display: none;
}
.mfp-s-error .mfp-content {
  display: none;
}
button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  border: 0;
  -webkit-appearance: none;
  display: block;
  padding: 0;
  z-index: 506;
}
button.mfp-close {
  background: transparent;
}
button::-moz-focus-inner {
  padding: 0;
  border: 0;
}
.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: white;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}
.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
}
.mfp-close:active {
  top: 1px;
}
.mfp-close-btn-in .mfp-close {
  color: #333333;
}
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: white;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}
.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #cccccc;
  font-size: 12px;
  line-height: 18px;
}
.mfp-arrow {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  position: absolute;
  top: 0;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  background-color: #111111;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.mfp-arrow:active {
  margin-top: -54px;
}
.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
}
.mfp-arrow:before,
.mfp-arrow:after,
.mfp-arrow .mfp-b,
.mfp-arrow .mfp-a {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: solid transparent;
}
.mfp-arrow:after,
.mfp-arrow .mfp-a {
  opacity: 0.8;
  border-top-width: 12px;
  border-bottom-width: 12px;
  top: 8px;
}
.mfp-arrow:before,
.mfp-arrow .mfp-b {
  border-top-width: 20px;
  border-bottom-width: 20px;
}
.mfp-arrow-left {
  left: 0;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
.mfp-arrow-left:after,
.mfp-arrow-left .mfp-a {
  border-right: 12px solid #fff;
  left: 5px;
}
.mfp-arrow-left:before,
.mfp-arrow-left .mfp-b {
  border-right: 20px solid #fff;
}
.mfp-arrow-right {
  right: 0;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 5px;
  -moz-border-radius-topleft: 5px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
.mfp-arrow-right:after,
.mfp-arrow-right .mfp-a {
  border-left: 12px solid #fff;
  left: 3px;
}
.mfp-arrow-right:before,
.mfp-arrow-right .mfp-b {
  border-left: 20px solid #fff;
}
.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}
.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}
.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: black;
}
.mfp-iframe-holder .mfp-close {
  top: -40px;
}
/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}
/* The shadow behind the image */
.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.mfp-figure {
  line-height: 0;
}
.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}
.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #f3f3f3;
}
.mfp-figure small {
  color: #bdbdbd;
  display: block;
  font-size: 12px;
  line-height: 14px;
}
.mfp-image-holder .mfp-content {
  max-width: 100%;
}
.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
     * Remove all paddings around the image on small screen
     */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }
  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }
  /* The shadow behind the image */
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }
}
@media all and (max-width: 800px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0;
  }
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
  }
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}
.mfp-ie7 .mfp-img {
  padding: 0;
}
.mfp-ie7 .mfp-bottom-bar {
  width: 600px;
  left: 50%;
  margin-left: -300px;
  margin-top: 5px;
  padding-bottom: 5px;
}
.mfp-ie7 .mfp-container {
  padding: 0;
}
.mfp-ie7 .mfp-content {
  padding-top: 44px;
}
.mfp-ie7 .mfp-close {
  top: 0;
  right: 0;
  padding-top: 0;
}
/**
 * Fade-zoom animation for first dialog
 */
/* start state */
.mfp-fade .zoom-anim-dialog {
  opacity: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8);
}
/* animate in */
.mfp-fade.mfp-ready .zoom-anim-dialog {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
/* animate out */
.mfp-fade.mfp-removing .zoom-anim-dialog {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8);
  opacity: 0;
}
/* Dark overlay, start state */
.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -ms-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  transition: opacity 0.3s ease-out;
}
/* animate in */
.mfp-fade.mfp-ready.mfp-bg {
  opacity: 0.8;
}
/* animate out */
.mfp-fade.mfp-removing.mfp-bg {
  opacity: 0;
}
/* Print =================================================== */
@media print {
  * {
    background: transparent !important;
    color: black !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
    position: static !important;
  }
  @page  {
    margin: 0.5cm;
  }
  h2,
  h3 {
    orphans: 3;
    widows: 3;
    page-break-after: avoid;
  }
  p {
    orphans: 3;
    widows: 3;
  }
  pre,
  blockquote {
    border: 1px solid #333;
    page-break-inside: avoid;
    padding: 1em;
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }
  img {
    max-width: 100% !important;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr {
    page-break-inside: avoid;
  }
}
/* 480px wide ============================================== */
@media only screen and (min-width: 30em) {
  .article-author-top,
  .article-author-bottom {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-opacity: 0.7;
    -moz-opacity: 0.7;
    opacity: 0.7;
  }
  .article-author-top:hover,
  .article-author-bottom:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
  }
  .image-grid li {
    width: 33.333333%;
  }
}
/* 600px wide ============================================== */
@media only screen and (min-width: 37.5em) {
  .site-name {
    display: inline;
    float: left;
    width: 16.666666666666668%;
    margin-left: 4.166666666666667%;
    margin-right: 4.166666666666667%;
  }
  .top-navigation {
    display: inline;
    float: left;
    width: 75%;
    margin-left: 0%;
    margin-right: 0%;
  }
  .image-wrap .headline-wrap,
  .image-wrap:after {
    left: 25%;
  }
  .image-wrap .headline-wrap {
    margin-left: 0;
  }
  .image-credit {
    display: inline;
    float: left;
    width: 75%;
    margin-left: 0%;
    margin-right: 0%;
  }
  #main article {
    display: inline;
    float: left;
    width: 50%;
    margin-left: 0%;
    margin-right: 0%;
  }
  #index {
    display: inline;
    float: left;
    width: 50%;
    margin-left: 0%;
    margin-right: 0%;
  }
  .footer-wrap footer {
    display: inline;
    float: left;
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
  }
  .article-author-top {
    display: block;
    display: inline;
    float: left;
    width: 16.666666666666668%;
    margin-left: 4.166666666666667%;
    margin-right: 4.166666666666667%;
  }
  .article-author-bottom {
    display: none;
  }
  .toc {
    display: block;
    display: inline;
    float: left;
    width: 16.666666666666668%;
    margin-left: 4.166666666666667%;
    margin-right: 4.166666666666667%;
    position: fixed;
    top: 120px;
    right: 0;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  }
  .image-grid li {
    width: 25%;
  }
  .related-articles {
    display: inline;
    float: left;
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
  }
}
/* 768px wide ============================================== */
@media only screen and (min-width: 48em) {
  /* Image Grid ============================================== */
  .image-grid li {
    width: 20%;
  }
}
/* 992px wide ============================================== */
@media only screen and (min-width: 62em) {
  .article-author-top img.bio-photo,
  .article-author-bottom img.bio-photo {
    width: 150px;
    height: 150px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    border-radius: 150px;
  }
  /* Image Grid ============================================== */
  .image-grid li {
    width: 16.666666666%;
  }
}
/* 1382px wide ============================================= */
@media only screen and (min-width: 86.375em) {
  .site-name {
    display: inline;
    float: left;
    width: 12.5%;
    margin-left: 16.666666666666668%;
  }
  .top-navigation {
    display: inline;
    float: left;
    width: 66.66666666666667%;
  }
  .image-wrap:after {
    left: 33.333333333%;
  }
  .image-wrap .headline-wrap {
    margin-left: 8.333333333333334%;
  }
  .image-credit {
    display: inline;
    float: left;
    width: 70.83333333333334%;
  }
  #main article {
    display: inline;
    float: left;
    width: 37.5%;
  }
  #index {
    display: inline;
    float: left;
    width: 37.5%;
  }
  .related-articles {
    display: inline;
    float: left;
    width: 37.5%;
    margin-left: 33.333333333333336%;
    margin-right: 29.166666666666668%;
  }
  .footer-wrap footer {
    display: inline;
    float: left;
    width: 37.5%;
    margin-left: 33.333333333333336%;
    margin-right: 29.166666666666668%;
  }
  .article-author-top {
    display: inline;
    float: left;
    width: 12.5%;
    margin-left: 16.666666666666668%;
  }
}
/* 2x for retina displays ================================== */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  
}


M assets/less/1382.less => assets/less/1382.less +3 -0
@@ 18,6 18,9 @@
		.prefix(12,1);
	}
}
.image-credit {
	.grid(12,8.5);
}
#main article {
	.grid(12,4.5);
}


M assets/less/480.less => assets/less/480.less +8 -0
@@ 3,6 3,14 @@
// TEXTURE ====================================================
// ELEMENTS ===================================================
// LAYOUT =====================================================
.article-author-top,
.article-author-bottom {
	.transition(all .2s ease);
	.opacity(.7);
	&:hover {
		.opacity(1);
	}
}
.image-grid {
	li {
		width: 33.333333%;


M assets/less/600.less => assets/less/600.less +5 -3
@@ 1,7 1,4 @@
// ROOT =======================================================
html {
	font-size: 95%;
}
// TYPOGRAPHY =================================================
// TEXTURE ====================================================
// ELEMENTS ===================================================


@@ 23,6 20,11 @@ html {
.image-wrap .headline-wrap {
	margin-left: 0;
}
.image-credit {
	.grid(12,9);
	.prefix(12,0);
	.suffix(12,0);
}
#main article {
	.grid(12,6);
	.prefix(12,0);


M assets/less/768.less => assets/less/768.less +0 -3
@@ 1,7 1,4 @@
// ROOT =======================================================
html {
	font-size: 100%;
}
// TYPOGRAPHY =================================================
// TEXTURE ====================================================
// ELEMENTS ===================================================


M assets/less/992.less => assets/less/992.less +8 -3
@@ 1,11 1,16 @@
// ROOT =======================================================
html {
	font-size: 112.5%;
}
// TYPOGRAPHY =================================================
// TEXTURE ====================================================
// ELEMENTS ===================================================
// LAYOUT =====================================================
.article-author-top,
.article-author-bottom {
	img.bio-photo {
		width: 150px;
		height: 150px;
		.rounded(150px);
	}
}
/* Image Grid ============================================== */
.image-grid {
	li {


M assets/less/coderay.less => assets/less/coderay.less +6 -7
@@ 1,14 1,13 @@
.CodeRay {
  background-color: #efefef;
  font-family: @codefont;
  font-size: 80%;
  font-family: @code-font;
  .font(12);
  color: #333332;
  margin-bottom: 1.5em;
}

.CodeRay pre {
  margin: 0px;
  padding: 1em;
  pre {
    margin: 0px;
    padding: 1em;
  }
}

div.CodeRay { }


M assets/less/elements.less => assets/less/elements.less +12 -35
@@ 38,49 38,26 @@ svg:not(:root) {
    .grid(12,12);
  }
}
/* Buttons =============================================== */
/* Buttons ============================================== */
.btn {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1;
  padding: 12px 24px;
  margin-bottom: 2em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  border: 4px double @textcolor;
  .rounded(50px);
  cursor: pointer;
  *margin-left: .3em;
  .transition(.4s linear); 
  &:visited {
    border: 4px double @linkcolorvisited;
  }
  &:hover {
    border: 4px double @linkcolorhover;
  }
}
.btn:first-child {
  *margin-left: 0; 
}
.btn-inverse {
  border: 4px double @white;
  color: @white;
  margin-bottom: 20px;
  padding: 8px 20px;
  .font-rem(14);
  background-color: @black;
  color: @white;
  border: 2px solid @black !important;
  .rounded(20px);
  &:visited {
    color: @white;
    border-color: @white;
  }
  &:hover {
    color: @white;
    border-color: @white;
    background-color: @white;
    color: @black;
  }
  &:active {
    .translate(0, 2px);
  }
}
.btn-small {
  font-size: 60%;
  padding: 6px 12px;
}
/* Well ================================================= */
.well {


M assets/less/forms.less => assets/less/forms.less +1 -1
@@ 40,7 40,7 @@ input,
button,
select,
textarea {
	font-family: @basefont; 
	font-family: @base-font; 
	.box-sizing(border-box); 
}
label {


M assets/less/ie.less => assets/less/ie.less +0 -2
@@ 11,8 11,6 @@
/* Site wide styles (html, body, global classes) =========== */
@import "site.less";
// TYPOGRAPHY =================================================
/* Typeplate.com typographic starter pack ================== */
@import "typeplate.less";
@import "typography.less";
// MIXINS =====================================================
@import "mixins.less";


M assets/less/main.less => assets/less/main.less +2 -2
@@ 11,11 11,11 @@
/* Site wide styles (html, body, global classes) =========== */
@import "site.less";
// TYPOGRAPHY =================================================
/* Typeplate.com typographic starter pack ================== */
@import "typeplate.less";
@import "typography.less";
/* Pygments Syntax highlighting ============================= */
@import "pygments.less";
// Coderay Syntax highlighting ===============================
@import "coderay.less";
// MIXINS =====================================================
@import "mixins.less";
@import "grid.less";


M assets/less/mixins.less => assets/less/mixins.less +121 -124
@@ 1,76 1,126 @@
// ===========================================================
// UTILITY MIXINS
// --------------------------------------------------

// Clearfix
// --------------------
// For clearing floats like a boss h5bp.com/q
.clearfix {
  *zoom: 1;
  &:before,
  &:after {
    display: table;
    content: "";
    // Fixes Opera/contenteditable bug:
    // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952
    line-height: 0;
  }
  &:after {
    clear: both;
  }
}

// 320 and Up by Andy Clarke
// Version: 3.0
// URL: http://stuffandnonsense.co.uk/projects/320andup/
// Apache License: v2.0. http://www.apache.org/licenses/LICENSE-2.0
// Modified by: Michael Rose
// Webkit-style focus
// --------------------
.tab-focus() {
  // Default
  outline: thin dotted #333;
  // Webkit
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

// ===========================================================/
// Center-align a block level element
// ----------------------------------
.center-block() {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

// TYPOGRAPHY
// --------------------------------------------------

// Full-fat vertical rhythm
// ------------------------
.font-size(@size) {
  font-size: 0px + @size;
  font-size: 0rem + @size / @doc-font-size;
  line-height: 0 + round(@doc-line-height / @size*10000) / 10000;
  margin-bottom: 0px + @doc-line-height;
  margin-bottom: 0rem + (@doc-line-height / @doc-font-size);
}

// ROOT =====================================================
// TYPOGRAPHY ===============================================
.font-size(@font-size: 16){
@rem: (@font-size / 10);
font-size : @font-size * 1px;
font-size : ~"@{rem}rem"; }
// Just the REMs
// -------------
.font-rem(@size) {
  font-size: 0px + @size;
  font-size: 0rem + @size / @doc-font-size;
}

.lineheight(@font-size: 16){
@rem: (@font-size / 10);
line-height: @font-size * 1px;
line-height: ~"@{rem}rem"; }
// Just font-size and line-height
// ------------------------------
.font(@size) {
  font-size: 0px + @size;
  font-size: 0rem + @size / @doc-font-size;
  line-height: 0 + round(@doc-line-height / @size*10000) / 10000;
}

.text-overflow() {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }

// COLOR ====================================================
// TEXTURE ==================================================
/* Gradients ============================================= */
@indent-var: 0rem + (@doc-line-height / @doc-font-size);

// GRADIENTS
// --------------------------------------------------

.horizontal(@startColor : @white, @endColor : @lightergrey) {
background-color: @endColor;
background-image  : -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
background-image  : -webkit-linear-gradient(left, @startColor, @endColor); 					 // Safari 5.1+, Chrome 10+
background-image  : -moz-linear-gradient(left, @startColor, @endColor); 					 // FF 3.6+
background-image  : -ms-linear-gradient(left, @startColor, @endColor); 						 // IE10
background-image  : -o-linear-gradient(left, @startColor, @endColor); 						 // Opera 11.10
background-image  : linear-gradient(left, @startColor, @endColor); 							 // W3C
background-image  : -webkit-linear-gradient(left, @startColor, @endColor);           // Safari 5.1+, Chrome 10+
background-image  : -moz-linear-gradient(left, @startColor, @endColor);            // FF 3.6+
background-image  : -ms-linear-gradient(left, @startColor, @endColor);             // IE10
background-image  : -o-linear-gradient(left, @startColor, @endColor);              // Opera 11.10
background-image  : linear-gradient(left, @startColor, @endColor);               // W3C
background-repeat : repeat-x; }

.vertical(@startColor : @white, @endColor:  @lightergrey) {
background-image  : -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
background-image  : -webkit-linear-gradient(top, @startColor, @endColor); 					 // Safari 5.1+, Chrome 10+
background-image  : -webkit-linear-gradient(top, @startColor, @endColor);            // Safari 5.1+, Chrome 10+
background-color  : @endColor;
background-image  : -moz-linear-gradient(top, @startColor, @endColor);   					 // FF 3.6+
background-image  : -ms-linear-gradient(top, @startColor, @endColor); 						 // IE10
background-image  : -o-linear-gradient(top, @startColor, @endColor); 						 // Opera 11.10
background-image  : linear-gradient(top, @startColor, @endColor); 							 // W3C
background-image  : -moz-linear-gradient(top, @startColor, @endColor);             // FF 3.6+
background-image  : -ms-linear-gradient(top, @startColor, @endColor);              // IE10
background-image  : -o-linear-gradient(top, @startColor, @endColor);             // Opera 11.10
background-image  : linear-gradient(top, @startColor, @endColor);                // W3C
background-repeat : repeat-x; }

.directional(@startColor : @white, @endColor : @lightergrey, @deg : 45deg) {
background-color  : @endColor;
background-image  : -moz-linear-gradient(@deg, @startColor, @endColor); 					// FF 3.6+
background-image  : -ms-linear-gradient(@deg, @startColor, @endColor); 						// IE10
background-image  : -webkit-linear-gradient(@deg, @startColor, @endColor); 					// Safari 5.1+, Chrome 10+
background-image  : -o-linear-gradient(@deg, @startColor, @endColor); 						// Opera 11.10
background-image  : linear-gradient(@deg, @startColor, @endColor); 							// W3C
background-image  : -moz-linear-gradient(@deg, @startColor, @endColor);           // FF 3.6+
background-image  : -ms-linear-gradient(@deg, @startColor, @endColor);            // IE10
background-image  : -webkit-linear-gradient(@deg, @startColor, @endColor);          // Safari 5.1+, Chrome 10+
background-image  : -o-linear-gradient(@deg, @startColor, @endColor);             // Opera 11.10
background-image  : linear-gradient(@deg, @startColor, @endColor);              // W3C
background-repeat : repeat-x; }

/* .bordered(COLOR, COLOR, COLOR, COLOR); ================ */
// .bordered(COLOR, COLOR, COLOR, COLOR);
.bordered(@top-color: #eee, @right-color: #eee, @bottom-color: #eee, @left-color: #eee) {
border-top : solid 1px @top-color;
border-left : solid 1px @left-color;
border-right : solid 1px @right-color;
border-bottom : solid 1px @bottom-color; }

/* .rounded(VALUE); ====================================== */
// ROUND CORNERS
// --------------------------------------------------

// .rounded(VALUE);
.rounded(@radius:4px) {
-webkit-border-radius : @radius;
-moz-border-radius : @radius;
border-radius : @radius; }

/* .border-radius(VALUE,VALUE,VALUE,VALUE); ============== */
// .border-radius(VALUE,VALUE,VALUE,VALUE);
.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
-webkit-border-top-right-radius : @topright;
-webkit-border-bottom-right-radius : @bottomright;


@@ 88,29 138,32 @@ border-top-left-radius : @topleft;
-moz-background-clip : padding;  
background-clip : padding-box; }

/* .box-shadow(HORIZONTAL VERTICAL BLUR COLOR)) =========== */
// .box-shadow(HORIZONTAL VERTICAL BLUR COLOR))
.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
-webkit-box-shadow : @shadow;
-moz-box-shadow : @shadow;
box-shadow : @shadow; }

/* .drop-shadow(HORIZONTAL, VERTICAL, BLUR, ALPHA); ======= */
// .drop-shadow(HORIZONTAL, VERTICAL, BLUR, ALPHA);
.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) {
-webkit-box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
-moz-box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); }

/* .text-shadow(); ======================================== */
// .text-shadow();
.text-shadow(@shadow: 0 2px 3px rgba(0,0,0,.25)) {
text-shadow : @shadow; }

/* .opacity(VALUE); ======================================= */
// .opacity(VALUE);
.opacity(@opacity : .5) {
-webkit-opacity : @opacity;
-moz-opacity : @opacity;
opacity : @opacity; }

/* .rotate(VALUEdeg); ===================================== */
// TRANSFORMATIONS
// --------------------------------------------------

// .rotate(VALUEdeg);
.rotate(@deg) {
-webkit-transform : rotate(@deg);
-moz-transform : rotate(@deg);


@@ 118,7 171,7 @@ opacity : @opacity; }
-o-transform : rotate(@deg);
transform : rotate(@deg); }

/* .scale(VALUE); ========================================= */
// .scale(VALUE);
.scale(@ratio) {
-webkit-transform : scale(@ratio);
-moz-transform : scale(@ratio);


@@ 126,7 179,7 @@ transform : rotate(@deg); }
-o-transform : scale(@ratio);
transform : scale(@ratio); }

/* .skew(VALUE, VALUE); =================================== */
// .skew(VALUE, VALUE);
.skew(@x: 0, @y: 0) {
-webkit-transform : skew(@x, @y);
-moz-transform : skew(@x, @y);


@@ 134,7 187,7 @@ transform : scale(@ratio); }
-o-transform : skew(@x, @y);
transform : skew(@x, @y); }

/* .transition(PROPERTY DURATION DELAY(OPTIONAL) TIMING-FINCTION); */
// .transition(PROPERTY DURATION DELAY(OPTIONAL) TIMING-FINCTION);
.transition(@transition) {
-webkit-transition : @transition;
-moz-transition : @transition;


@@ 142,7 195,7 @@ transform : skew(@x, @y); }
-o-transition : @transition;
transition : @transition; }

/* .translate(VALUE, VALUE) =============================== */
// .translate(VALUE, VALUE)
.translate(@x: 0, @y: 0) {
-webkit-transform : translate(@x, @y);
-moz-transform : translate(@x, @y);


@@ 157,51 210,46 @@ transform : translate(@x, @y); }
-o-transform : translate(@x, @y, @z);
transform : translate(@x, @y, @z); }

// ELEMENTS ==================================================
/* .background-alpha(VALUE VALUE); ======================== */
.animation(@name, @duration: 300ms, @delay: 0, @ease: ease) {
  -webkit-animation: @name @duration @delay @ease;
  -moz-animation:    @name @duration @delay @ease;
  -ms-animation:     @name @duration @delay @ease;
}

// BACKGROUND
// --------------------------------------------------

// .background-alpha(VALUE VALUE);
.background-alpha(@color: @white, @alpha: 1) {
background-color : hsla(hue(@color), saturation(@color), lightness(@color), @alpha); }

/* .background-size(VALUE VALUE); ========================= */
// .background-size(VALUE VALUE);
.background-size(@size){
-webkit-background-size : @size;
-moz-background-size : @size;
-o-background-size : @size;
background-size : @size; }

/* .background-clip(VALUE); (border-box, padding-box, content-box) */
// .background-clip(VALUE); (border-box, padding-box, content-box)
.background-clip(@clip) {
-webkit-background-clip : @clip;
-moz-background-clip : @clip;
background-clip : @clip; }

/* .box-sizing(VALUE); (border-box, padding-box, content-box) */
// .box-sizing(VALUE); (border-box, padding-box, content-box)
.box-sizing(@boxsize: border-box) {
-webkit-box-sizing : @boxsize;
-moz-box-sizing : @boxsize;
-ms-box-sizing : @boxsize;
box-sizing : @boxsize; }

/* Contain floats ========================================= */
.clearfix() {
	*zoom:1;
	&:before,
	&:after {
	    content:"";
	    display:table;
	}
	&:after {
	    clear:both;
	}
}

/* For image replacement ================================== */
// For image replacement
.hide-text() {
text-indent : 100%;
white-space : nowrap;
overflow : hidden; }

/* Hide from visual and speaking browsers ================= */
// Hide from visual and speaking browsers
.hidden() {
display : none !important; 
visibility : hidden; }


@@ 210,23 258,23 @@ visibility : hidden; }
  visibility: hidden;
}

/* Hide but maintain layout =============================== */
// Hide but maintain layout
.invisible() { 
visibility : hidden; }

/* .resize(VALUE) (none, both, horizontal, vertical, inherit) */
// .resize(VALUE) (none, both, horizontal, vertical, inherit)
.resize(@direction: both) {
resize : @direction;
overflow : auto; }

/* .userselect(VALUE) (all, element, none, text) ========== */
// .userselect(VALUE) (all, element, none, text)
.user-select(@select) {
-webkit-user-select : @select;
-moz-user-select : @select;
-o-user-select : @select;
user-select : @select; }

/* Hidden but available to speaking browsers ============== */
// Hidden but available to speaking browsers
.visuallyhidden() { 
overflow : hidden; 
position : absolute;


@@ 237,7 285,7 @@ margin : -1px;
padding : 0; 
border : 0; }

/* Make visuallyhidden focusable with a keyboard ========== */
// Make visuallyhidden focusable with a keyboard
.visuallyhidden.focusable:active, 
.visuallyhidden.focusable:focus { 
position : static;


@@ 245,55 293,4 @@ clip : auto;
height : auto; 
width : auto;
margin : 0; 
overflow: visible; }

/* Responsive visibility utilities =================================== */
/* For desktops =========================================== */
.visible-phone     { display: none !important; }
.visible-tablet    { display: none !important; }
.visible-desktop   { } // Don't set initially
.hidden-phone      { }
.hidden-tablet     { }
.hidden-desktop    { display: none !important; }
/* Mobile phones only  =====================================*/
@media (max-width: 767px) {
  // Show
  .visible-phone     { display: inherit !important; } // Use inherit to restore previous behavior
  // Hide
  .hidden-phone      { display: none !important; }
  // Hide everything else
  .hidden-desktop    { display: inherit !important; }
  .visible-desktop   { display: none !important; }
}
/* Tablets & small desktops only ========================== */
@media (min-width: 768px) and (max-width: 979px) {
  // Show
  .visible-tablet    { display: inherit !important; }
  // Hide
  .hidden-tablet     { display: none !important; }
  // Hide everything else
  .hidden-desktop    { display: inherit !important; }
  .visible-desktop   { display: none !important ; }
}

// LAYOUT ==================================================== 
/* .columns(250px, 0, 24px, COLOR, solid, 1px) ============ */
.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #eee, @columnRuleStyle: solid, @columnRuleWidth: 1px) {
-webkit-column-width : @colwidth;
-webkit-column-count : @colcount;
-webkit-column-gap : @colgap;
-webkit-column-rule-color : @columnRuleColor;
-webkit-column-rule-style : @columnRuleStyle;
-webkit-column-rule-width : @columnRuleWidth;
-moz-column-width : @colwidth;
-moz-column-count : @colcount;
-moz-column-gap : @colgap;
-moz-column-rule-color : @columnRuleColor;
-moz-column-rule-style : @columnRuleStyle;
-moz-column-rule-width : @columnRuleWidth;
column-width : @colwidth;
column-count : @colcount;
column-gap : @colgap;
column-rule-color : @columnRuleColor;
column-rule-style : @columnRuleStyle;
column-rule-width : @columnRuleWidth; }
\ No newline at end of file
overflow: visible; }
\ No newline at end of file


M assets/less/normalize.less => assets/less/normalize.less +1 -1
@@ 171,7 171,7 @@ samp {
 */

pre {
    white-space: pre-wrap;
    white-space: pre;
}

/**


M assets/less/page.less => assets/less/page.less +92 -30
@@ 1,13 1,12 @@
html {
body {
	background-color: @bodycolor;
	font-family: @basefont;
	font-family: @base-font;
	font-color: @textcolor;
	font-size: 90%;
}
.navigation-wrapper {
	.container();
	padding: 2em 0 3em;
	font-family: @baseheadingfont;
	font-family: @heading-font;
	font-weight: 700;
	text-transform: uppercase;
}


@@ 62,10 61,16 @@ html {
	.prefix(12,1);
	.suffix(12,1);
	margin-bottom: 2em;
	h3 {
		margin: 0;
		padding-bottom: .5em;
		.font-rem(28);
		border-bottom: 1px solid lighten(@black,70);
	}
	article {
		h2 {
			.delta();
			margin-bottom: 0;
			.font-rem(24);
		}
		p+p {
			text-indent: 0;


@@ 101,31 106,14 @@ html {
		}
	}
}
.headline-wrap {
	h1 {
		.beta();
	}
	h2 {
		.delta();
		text-transform: uppercase;
	}
}
.article-wrap {
	h2 {
		.gamma();
	}
	h3 {
		.delta();
	}
}
.byline {
	clear: both;
	font-size: 80%;
}
.article-author-top,
.article-author-bottom {
	h4 {
		margin-bottom: 0.5em;
	h3 {
		margin-bottom: 0;
	}
	p {
		font-size: 80%;


@@ 135,17 123,54 @@ html {
		border-bottom: 0 solid transparent;
	}
	img.bio-photo {
		width: 100px;
		height: 100px;
		.rounded(100px);
	}
}
.author-social {
  display: block;
  margin-bottom: 5px;
  .font-rem(14);
  color: @black;
  &:visited {
    color: @black;
  }
  &:hover {
    .scale(1.1);
  }
  &:active {
    .translate(0, 2px);
  }
}
.article-author-top {
	display: none;
	text-align: center;
}
.article-author-bottom {
	margin-bottom: 1em;
	.bio-photo {
		float: left;
		margin-right: 25px;
	}
	.author-social {
		display: inline-block;
		margin-right: 5px;
	}
}
.article-wrap {
	// Dotted line underlines for links
	p > a,
	li > a {
		border-bottom: 1px dotted lighten(@link-color, 50);
		&:hover {
			border-bottom-style: solid;
		}
	}
	p > a.reversefootnote, 
	li > a.reversefootnote {
		border-bottom-width: 0;
	}
}
.toc {
	display: none;


@@ 176,7 201,7 @@ html {
		display: block;
		margin: 0;
		padding: 0;
		font-family: @baseheadingfont;
		font-family: @heading-font;
		border-bottom: 1px solid darken(@white, 50);
		&:last-child {
			border-bottom: 0 solid transparent;


@@ 223,7 248,7 @@ html {
	}
}
.holder {
	font-family: @baseheadingfont;
	font-family: @heading-font;
	a {
		cursor: pointer;
		margin: 0 5px;


@@ 267,9 292,13 @@ html {
	p,
	h4,
	h5,
	h6 {
	h6,
	span {
		color: darken(@white, 25);
	}
	span { 
		.font-rem(14);
	}
	a {
		border-bottom: 0 solid transparent;
		&:hover {


@@ 287,8 316,9 @@ html {
	.grid(12,10);
	.prefix(12,1);
	.suffix(12,1);
	margin-bottom: 2em;
	h4 {
		.epsilon();
		
		text-transform: uppercase;
		margin-bottom: 0;
	}


@@ 302,7 332,6 @@ html {
		display: inline-block;
		padding-right: 5px;
		a {
			.delta();
			color: lighten(@basecolor, 40%);
			.transition(.4s linear);
			&:hover {


@@ 335,7 364,10 @@ html {
		}
	}
}
.chrome-frame {

// Browser Upgrade
// --------------------------------------------------
.browser-upgrade {
	background: #000;
	text-align: center;
	margin: 0 0 2em 0;


@@ 350,4 382,34 @@ html {
			border-bottom: 1px solid @white;
		}
	}
}

// Google Search
// --------------------------------------------------
#goog-fixurl {
	ul {
		list-style: none;
		margin-left: 0;
		padding-left: 0;
		li {
			list-style-type: none;
		}
	}
}
#goog-wm-qt {
	width: auto;
	margin-right: 10px;
	margin-bottom: 20px;
	padding: 8px 20px;
	display: inline-block;
	.font-rem(14);
	background-color: @white;
	color: @black;
	border-width: 2px !important;
	border-style: solid !important;
	border-color: lighten(@black,50);
	.rounded(3px);
}
#goog-wm-sb {
	.btn();
}
\ No newline at end of file


M assets/less/pygments.less => assets/less/pygments.less +73 -73
@@ 1,74 1,74 @@
.highlight {
  background-color: #efefef;
  font-family: @codefont;
  font-size: 80%;
  color: #333332;
  margin-bottom: 1.5em;
}

.highlight pre {
  margin: 0px;
  padding: 1em;
}

.hll { background-color: #ffffcc }
.c { color: #999988; font-style: italic } /* Comment */
.err { color: #a61717; background-color: #e3d2d2 } /* Error */
.k { color: #000000; font-weight: bold } /* Keyword */
.o { color: #000000; font-weight: bold } /* Operator */
.cm { color: #999988; font-style: italic } /* Comment.Multiline */
.cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
.c1 { color: #999988; font-style: italic } /* Comment.Single */
.cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.ge { color: #000000; font-style: italic } /* Generic.Emph */
.gr { color: #aa0000 } /* Generic.Error */
.gh { color: #999999 } /* Generic.Heading */
.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.go { color: #888888 } /* Generic.Output */
.gp { color: #555555 } /* Generic.Prompt */
.gs { font-weight: bold } /* Generic.Strong */
.gu { color: #aaaaaa } /* Generic.Subheading */
.gt { color: #aa0000 } /* Generic.Traceback */
.kc { color: #000000; font-weight: bold } /* Keyword.Constant */
.kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
.kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
.kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
.kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
.kt { color: #445588; font-weight: bold } /* Keyword.Type */
.m { color: #009999 } /* Literal.Number */
.s { color: #d01040 } /* Literal.String */
.na { color: #008080 } /* Name.Attribute */
.nb { color: #0086B3 } /* Name.Builtin */
.nc { color: #445588; font-weight: bold } /* Name.Class */
.no { color: #008080 } /* Name.Constant */
.nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
.ni { color: #800080 } /* Name.Entity */
.ne { color: #990000; font-weight: bold } /* Name.Exception */
.nf { color: #990000; font-weight: bold } /* Name.Function */
.nl { color: #990000; font-weight: bold } /* Name.Label */
.nn { color: #555555 } /* Name.Namespace */
.nt { color: #000080 } /* Name.Tag */
.nv { color: #008080 } /* Name.Variable */
.ow { color: #000000; font-weight: bold } /* Operator.Word */
.w { color: #bbbbbb } /* Text.Whitespace */
.mf { color: #009999 } /* Literal.Number.Float */
.mh { color: #009999 } /* Literal.Number.Hex */
.mi { color: #009999 } /* Literal.Number.Integer */
.mo { color: #009999 } /* Literal.Number.Oct */
.sb { color: #d01040 } /* Literal.String.Backtick */
.sc { color: #d01040 } /* Literal.String.Char */
.sd { color: #d01040 } /* Literal.String.Doc */
.s2 { color: #d01040 } /* Literal.String.Double */
.se { color: #d01040 } /* Literal.String.Escape */
.sh { color: #d01040 } /* Literal.String.Heredoc */
.si { color: #d01040 } /* Literal.String.Interpol */
.sx { color: #d01040 } /* Literal.String.Other */
.sr { color: #009926 } /* Literal.String.Regex */
.s1 { color: #d01040 } /* Literal.String.Single */
.ss { color: #990073 } /* Literal.String.Symbol */
.bp { color: #999999 } /* Name.Builtin.Pseudo */
.vc { color: #008080 } /* Name.Variable.Class */
.vg { color: #008080 } /* Name.Variable.Global */
.vi { color: #008080 } /* Name.Variable.Instance */
.il { color: #009999 } /* Literal.Number.Integer.Long */
\ No newline at end of file
	background-color: #efefef;
	font-family: @code-font;
	.font(12);
	color: #333332;
	margin-bottom: 1.5em;
	pre {
		position: relative;
		margin: 0;
		padding: 1em;
	}
	.lineno { padding-right: 24px; color: lighten(#333332,50);}
	.hll { background-color: #ffffcc }
	.c { color: #999988; font-style: italic } /* Comment */
	.err { color: #a61717; background-color: #e3d2d2 } /* Error */
	.k { color: #000000; font-weight: bold } /* Keyword */
	.o { color: #000000; font-weight: bold } /* Operator */
	.cm { color: #999988; font-style: italic } /* Comment.Multiline */
	.cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
	.c1 { color: #999988; font-style: italic } /* Comment.Single */
	.cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
	.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
	.ge { color: #000000; font-style: italic } /* Generic.Emph */
	.gr { color: #aa0000 } /* Generic.Error */
	.gh { color: #999999 } /* Generic.Heading */
	.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
	.go { color: #888888 } /* Generic.Output */
	.gp { color: #555555 } /* Generic.Prompt */
	.gs { font-weight: bold } /* Generic.Strong */
	.gu { color: #aaaaaa } /* Generic.Subheading */
	.gt { color: #aa0000 } /* Generic.Traceback */
	.kc { color: #000000; font-weight: bold } /* Keyword.Constant */
	.kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
	.kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
	.kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
	.kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
	.kt { color: #445588; font-weight: bold } /* Keyword.Type */
	.m { color: #009999 } /* Literal.Number */
	.s { color: #d01040 } /* Literal.String */
	.na { color: #008080 } /* Name.Attribute */
	.nb { color: #0086B3 } /* Name.Builtin */
	.nc { color: #445588; font-weight: bold } /* Name.Class */
	.no { color: #008080 } /* Name.Constant */
	.nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
	.ni { color: #800080 } /* Name.Entity */
	.ne { color: #990000; font-weight: bold } /* Name.Exception */
	.nf { color: #990000; font-weight: bold } /* Name.Function */
	.nl { color: #990000; font-weight: bold } /* Name.Label */
	.nn { color: #555555 } /* Name.Namespace */
	.nt { color: #000080 } /* Name.Tag */
	.nv { color: #008080 } /* Name.Variable */
	.ow { color: #000000; font-weight: bold } /* Operator.Word */
	.w { color: #bbbbbb } /* Text.Whitespace */
	.mf { color: #009999 } /* Literal.Number.Float */
	.mh { color: #009999 } /* Literal.Number.Hex */
	.mi { color: #009999 } /* Literal.Number.Integer */
	.mo { color: #009999 } /* Literal.Number.Oct */
	.sb { color: #d01040 } /* Literal.String.Backtick */
	.sc { color: #d01040 } /* Literal.String.Char */
	.sd { color: #d01040 } /* Literal.String.Doc */
	.s2 { color: #d01040 } /* Literal.String.Double */
	.se { color: #d01040 } /* Literal.String.Escape */
	.sh { color: #d01040 } /* Literal.String.Heredoc */
	.si { color: #d01040 } /* Literal.String.Interpol */
	.sx { color: #d01040 } /* Literal.String.Other */
	.sr { color: #009926 } /* Literal.String.Regex */
	.s1 { color: #d01040 } /* Literal.String.Single */
	.ss { color: #990073 } /* Literal.String.Symbol */
	.bp { color: #999999 } /* Name.Builtin.Pseudo */
	.vc { color: #008080 } /* Name.Variable.Class */
	.vg { color: #008080 } /* Name.Variable.Global */
	.vi { color: #008080 } /* Name.Variable.Instance */
	.il { color: #009999 } /* Literal.Number.Integer.Long */
}
\ No newline at end of file


M assets/less/site.less => assets/less/site.less +10 -1
@@ 18,7 18,11 @@
	float: left;
}
.pull-right {
	float:right;
	float: right;
}
.image-pull-right {
	float: right;
	margin-top: 0;
}
.clearfix {
	*zoom: 1;


@@ 38,4 42,9 @@
	li {
		list-style-type: none;
	}
}

/* Global Transition ==================================== */
b, i, strong, em, blockquote, p, q, span, figure, img, h1, h2, header, input, a {
	.transition(all .2s ease);
}
\ No newline at end of file


D assets/less/typeplate.less => assets/less/typeplate.less +0 -727
@@ 1,727 0,0 @@
/*!
+---------------------------------------------------------------------+
|        _                               _         _                  |
|       | |_  _   _  _ __    ___  _ __  | |  __ _ | |_  ___           |
|       | __|| | | || '_ \  / _ \| '_ \ | | / _` || __|/ _ \          |
|       | |_ | |_| || |_) ||  __/| |_) || || (_| || |_|  __/          |
|        \__| \__, || .__/  \___|| .__/ |_| \__,_| \__|\___|          |
|             |___/ |_|          |_|                                  |
|                                                                     |
|                                                                     |
| URL: http://typeplate.com                                           |
| VERSION: 1.0.1                                                      |
| Github: https://github.com/typePlate/typeplate.github.com           |
| AUTHORS: Zachary Kain (@zakkain) & Dennis Gaebel (@gryghostvisuals) |
| LICENSE: Creative Commmons                                          |
| http://creativecommons.org/licenses/by/3.0                          |
|                                                                     |
+---------------------------------------------------------------------+
*/


// ==========================================================================
//
// $V a r i a b l e s
//
// ==========================================================================


// $B a s e  T y p e
// --------------------------------------------------------------------------

@weight: normal;
@line-height: 1.65;
@font-size: 112.5; // percentage value (16 * 112.5% = 18px)
@font-base: 16 * (@font-size/100); // converts our percentage to a pixel value
@measure: @font-base * @line-height;
@font-family: serif;
@font-family-sans: sans-serif;

//the serif boolean var can be redeclared from another stylesheet. However
//the var must be placed after your @import "typeplate.less";
@serif-boolean: true;


// $C o l o r
// --------------------------------------------------------------------------

@body-copy-color: @textcolor;
@heading-color: @textcolor;


// $A M P E R S A N D  @font-face
// --------------------------------------------------------------------------

@amp-fontface-name: Ampersand;
@amp-fontface-source: local("Georgia"), local("Garamond"), local("Palatino"), local("Book Antiqua");
@amp-fontface-fallback: local("Georgia");


// $A M P E R S A N D  e l e m e n t
// --------------------------------------------------------------------------

// Allows for our ampersand element to have differing
// font-family from the ampersand unicode font-family.
@amp-font-family: Verdana, sans-serif;


// $T y p e  S c a l e
// --------------------------------------------------------------------------

@tera: 117;		//	117	= 18 × 6.5
@giga: 90;		//	90  = 18 × 5
@mega: 72;		//	72  = 18 × 4
@alpha: 60;		//	60  = 18 × 3.3333
@beta: 48;		//	48  = 18 × 2.6667
@gamma: 36;		//	36  = 18 × 2
@delta: 24;		//	24  = 18 × 1.3333
@epsilon: 21;	//	21  = 18 × 1.1667
@zeta: 18; 		//	18  = 18 × 1


// $T y p e  S c a l e  U n i t
// --------------------------------------------------------------------------

@type-scale-unit-value: rem;


// $T e x t  I n d e n t a t i o n
// --------------------------------------------------------------------------

@indent-val: 1.5em;


// $S t a t s  T a b
// --------------------------------------------------------------------------

@stats-font-size: 1.5rem;
@stats-list-margin: 0 0.625rem 0 0;
@stats-list-padding: 0 0.625rem 0 0;
@stats-item-font-size: 0.875rem;
@stats-item-margin: 0.125rem 0 0 0;
@stats-border-style: 0.125rem solid #ccc;



// ==========================================================================
//
// $F o n t f a c e s
//
// ==========================================================================


// $U N I C O D E - R A N G E    A m p e r s a n d
// --------------------------------------------------------------------------

@font-face {
	font-family: "@{amp-fontface-name}";
	src: @amp-fontface-source;
	unicode-range: ~"U+270C";
}

// Ampersand fallback font for unicode range
@font-face {
	font-family: "@{amp-fontface-name}";
	src: @amp-fontface-fallback;
	unicode-range: ~"U+270C";
}



// ==========================================================================
//
// $F u n c t i o n s
//
// ==========================================================================


// $C o n t e x t    C a l c u l a t o r
// --------------------------------------------------------------------------

// Less conversion: No function support
//.ems(@target, @context) {
//	@return (@target/@context)#{em};
//}


// $M o d u l a r    S c a l e
// --------------------------------------------------------------------------
// http://thesassway.com/projects/modular-scale

// Less conversion: No function support
//@function modular-scale(@scale, @base, @value) {
//	// divide a given font-size by base font-size & return a relative em value
//	@return (@scale/@base)#{@value};
//}

// Less conversion: No function support
//@function measure-margin(@scale, @measure, @value) {
//	// divide 1 unit of measure by given font-size & return a relative em value
//	@return (@measure/@scale)#{@value};
//}



// ==========================================================================
//
// $M i x i n s
//
// ==========================================================================


// $M o d u l a r    S c a l e
// --------------------------------------------------------------------------

// @Typographic scale
.modular-scale (@scale, @base, @value, @measure:"") when (@measure = "") {
	font-size: ~"@{scale}px";
	@font: (@scale/@base) + @value;
	font-size: ~"@{font}rem";
}
.modular-scale (@scale, @base, @value, @measure:"") when not (@measure = "") {
	font-size: ~"@{scale}px";
	@font: (@scale/@base) + @value;
	font-size: ~"@{font}rem";
	@margin: (@measure/@scale) + @value;
	margin-bottom: ~"@{margin}rem";
}


// $B o d y    C o p y
// --------------------------------------------------------------------------

.base-type (@weight, @line-height, @font-size, @font-family, @serif-boolean: true) when (@serif-boolean = true) {
	font: @weight ~"@{font-size}%/@{line-height}" @font-family;
}
.base-type (@weight, @line-height, @font-size, @font-family, @serif-boolean: true) when not (@serif-boolean = true) {
	font: @weight ~"@{font-size}%/@{line-height}" @font-family-sans;
}


// $H y p h e n
// --------------------------------------------------------------------------
//http://trentwalton.com/2011/09/07/css-hyphenation

.css-hyphens (@val) {
	// Accepted values: [ none | manual | auto ]
	-webkit-hyphens: @val;	// Safari 5.1 thru 6, iOS 4.2 thru 6
	-moz-hyphens: @val;		// Firefox 16 thru 20
	-ms-hyphens: @val;		// IE10
	-o-hyphens: @val;		// PRESTO...haha LOL
	hyphens: @val;			// W3C standard
}


// $S m a l l c a p s
// --------------------------------------------------------------------------
// http://blog.hypsometry.com/articles/true-small-capitals-with-font-face
// ISSUE#1 : https://github.com/zakkain/web-thang/issues/1

.smallcaps (@color, @font-weight) {
	// depends on the font family.
	// some font-families don't support small caps
	// or don't provide them with their web font.
	font-variant: small-caps;
	font-weight: @font-weight;
	text-transform: lowercase;
	color: @color;
}


// $F o n t - S i z e  - A d j u s t
// --------------------------------------------------------------------------
// correct x-height for fallback fonts: requires secret formula
// yet to be discovered. This is still wacky for support. Use
// wisely grasshopper.

.font-size-adjust (@adjust-value) {
	// firefox 17+ only (as of Feb. 2013)
	font-size-adjust: @adjust-value;
}


// $A m p e r s a n d
// --------------------------------------------------------------------------

.ampersand (@amp-font-family) {
	font-family: @amp-font-family;
}

.ampersand-placeholder {
	.ampersand(@amp-font-family);
}

// Call your ampersand on any element you wish from another stylesheet
// using this Sass extend we've provided...
// @extend %ampersand-placeholder;



// $W o r d    W r a p
// --------------------------------------------------------------------------
// Silent Sass Classes - A.K.A Placeholders
//
// normal: Indicates that lines may only break at normal word break points.
// break-word : Indicates that normally unbreakable words may be broken at
// arbitrary points if there are no otherwise acceptable break points in the line.

.breakword {
	word-wrap: break-word;
}

.normal-wrap {
	word-wrap: normal;
}

.inherit-wrap {
	word-wrap: auto;
}


// $D r o p c a p s
// --------------------------------------------------------------------------
/**
 * Dropcap Sass @include
 * Use the following Sass @include with any selector you feel necessary.
 *
	@include dropcap(@float: left, @font-size: 4em, @font-family: inherit, @text-indent: 0, @margin: inherit, @padding: inherit, @color: inherit, @lineHeight: 1, @bg: transparent);
 *
 * Extend this object into your custom stylesheet.
 *
 */

// Include your '@include dropcap()' mixin and pass the following
// arguments below. Feel free to pass in arguments we've provided.
// At this time you cannot pass in font-family arguments but you're gonna
// change that anyway so why not just make that separately in your declaration.
.dropcap (@float: left, @font-size: 4em, @font-family: inherit, @text-indent: 0, @margin: inherit, @padding: inherit, @color: inherit, @lineHeight: 1, @bg: transparent) {
	&:first-letter {
		float: @float;
		margin: @margin;
		padding: @padding;
		font-size: @font-size;
		font-family: @font-family;
		line-height: @lineHeight;
		text-indent: @text-indent;
		background: @bg;
		color: @color;
	}
}

.drop-cap {
	.dropcap;
}

// $D e f i n i t i o n    L i s t
// --------------------------------------------------------------------------
// lining
// http://lea.verou.me/2012/02/flexible-multiline-definition-lists-with-2-lines-of-css
//
// dictionary-style
// http://lea.verou.me/2012/02/flexible-multiline-definition-lists-with-2-lines-of-css

.definition-list-style (@style) when (@style = lining) {
	dt,
	dd {
		display: inline;
		margin: 0;
	}
	dt,
	dd {
		& + dt {
			&:before {
				content: "\A";
				white-space: pre;
			}
		}
	}
	dd {
		& + dd {
			&:before {
				content: ", ";
			}
		}
		&:before {
				content: ": ";
				margin-left: -0.2rem; //removes extra space between the dt and the colon
		}
	}
}
// dictionary-style
.definition-list-style (@style) when (@style = dictionary-style) {
	dt {
		display: inline;
		counter-reset: definitions;
		& + dt {
			&:before {
				content: ", ";
				margin-left: -0.2rem; // removes extra space between the dt and the comma
			}
		}
	}
	dd {
		display: block;
		counter-increment: definitions;
		&:before {
			content: ~"counter(definitions, decimal)" ". ";
		}
	}
}



// ==========================================================================
//
// $T y p e l a t e  S t y l i n g
//
// ==========================================================================


// $G l o b a l s
// --------------------------------------------------------------------------

html {
	.base-type(@weight, @line-height, @font-size, @font-family, @serif-boolean);
}

body {
	// Ala Trent Walton
	// .css-hyphens (auto);

	// normal-wrap: Indicates that lines may only break at normal word break points.
	// breakword : Indicates that normally unbreakable words may be broken at ...
	// arbitrary points if there are no otherwise acceptable break points in the line.
	.normal-wrap;
	color: @body-copy-color;
}


// $H e a d i n g s
// --------------------------------------------------------------------------

// styles for all headings, in the style of @csswizardry
.hN () {
	// voodoo to enable ligatures and kerning
	text-rendering: optimizeLegibility;
	// this fixes huge spaces when a heading wraps onto two lines
	line-height: 1;
	margin-top: 0;
}

// for each size in the scale, create a class
.tera 		{ .modular-scale(@tera, @font-base, @type-scale-unit-value, @measure); }
.giga 		{ .modular-scale(@giga, @font-base, @type-scale-unit-value, @measure); }
.mega 		{ .modular-scale(@mega, @font-base, @type-scale-unit-value, @measure); }
.alpha 		{ .modular-scale(@alpha, @font-base, @type-scale-unit-value, @measure); }
.beta 		{ .modular-scale(@beta, @font-base, @type-scale-unit-value, @measure); }
.gamma 		{ .modular-scale(@gamma, @font-base, @type-scale-unit-value, @measure); }
.delta 		{ .modular-scale(@delta, @font-base, @type-scale-unit-value, @measure); }
.epsilon 	{ .modular-scale(@epsilon, @font-base, @type-scale-unit-value, @measure); }
.zeta 		{ .modular-scale(@zeta, @font-base, @type-scale-unit-value, @measure); }

// associate h1-h6 tags with their appropriate greek heading
h1 {
	.alpha;
	.hN;
}

h2 {
	.beta;
	.hN;
}

h3 {
	.gamma;
	.hN;
}

h4 {
	.delta;
	.hN;
}

h5 {
	.epsilon;
	.hN;
}

h6 {
	.zeta;
	.hN;
}


// $ P a r a g r a p h s
// --------------------------------------------------------------------------

p {
	margin: 0 0 @indent-val;
	& + p {
		//siblings indentation
		text-indent: @indent-val;
		margin-top: -@indent-val;
	}
}


// $ H y p h e n s
// --------------------------------------------------------------------------
// http://meyerweb.com/eric/thoughts/2012/12/17/where-to-avoid-css-hyphenation

abbr,
acronym,
blockquote,
code,
dir,
kbd,
listing,
plaintext,
q,
samp,
tt,
var,
xmp {
	.css-hyphens (none);
}


// $C o d e b l o c k s
// --------------------------------------------------------------------------

// White Space Mixins
.white-space-pre-wrap () {
	white-space: -moz-pre-wrap; // Firefox 1.0-2.0
	white-space: pre-wrap;			// Current Browsers
}
.white-space-pre () {
	white-space: pre;
}

pre code {
	.normal-wrap;
	.white-space-pre-wrap;
}
pre {
	.white-space-pre;
}
code {
	.white-space-pre;
	font-family: monospace;
}


// $ S m a l l c a p s
// --------------------------------------------------------------------------

/**
 * Abbreviations Markup
 *
	<abbr title="hyper text markup language">HMTL</abbr>
 *
 * Extend this object into your markup.
 *
 */
abbr {
	.smallcaps(@textcolor, 400);
	&:hover {
		cursor: help;
	}
}


// $ H e a d i n g s    C o l o r
// --------------------------------------------------------------------------

h1,
h2,
h3,
h4,
h5,
h6 {
	color: @heading-color;
}


// $ D e f i n i t i o n    L i s t s
// --------------------------------------------------------------------------

/**
 * Lining Definition Style Markup
 *
	<dl class="lining">
		<dt><b></b></dt>
		<dd></dd>
	</dl>
 *
 * Extend this object into your markup.
 *
 */
.lining {
	.definition-list-style(lining);
}

/**
 * Dictionary Definition Style Markup
 *
	<dl class="dictionary-style">
		<dt><b></b></dt>
			<dd></dd>
	</dl>
 *
 * Extend this object into your markup.
 *
 */
.dictionary-style {
	.definition-list-style(dictionary-style);
}


// $S t a t s    T a b
// --------------------------------------------------------------------------

/**
 * Stats Tab Markup
 *
	<ul class="stats-tabs">
		<li><a href="#">[value]<b>[name]</b></a></li>
	</ul>
 *
 * Extend this object into your markup.
 *
 */
.stats-tabs {
	padding: 0;
	li {
		display: inline-block;
		margin: @stats-list-margin;
		padding: @stats-list-padding;
		border-right: @stats-border-style;
		&:last-child {
			margin: 0;
			padding: 0;
			border: none;
		}
		a {
			display: inline-block;
			font-size: @stats-font-size;
			font-weight: bold;
			b {
				display: block;
				margin: @stats-item-margin;
				font-size: @stats-item-font-size;
				font-weight: normal;
			}
		}
	}
}


// @Blockquote Cites
// --------------------------------------------------------------------------
/**
 * Blockquote Markup
 *
	<blockquote cite="">
		<p>&Prime;&Prime;</p>
		<cite>
			<small><a href=""></a></small>
		</cite>
	</blockquote>
 *
 * Extend this object into your markup.
 *
 */

.cite-style(@display:block, @text-align:right, @font-size: .875em) {
	display: @display;
	font-size: @font-size;
	text-align: @text-align;
}

.cite {
	.cite-style;
}


// @Pull Quotes
// --------------------------------------------------------------------------
// http://24ways.org/2005/swooshy-curly-quotes-without-images
//
// http://todomvc.com - Thanks sindresorhus!
// https://github.com/typeplate/typeplate.github.com/issues/49

/**
 * Pull Quotes Markup
 *
	<aside class="pull-quote">
		<blockquote>
			<p></p>
		</blockquote>
	</aside>
 *
 * Extend this object into your custom stylesheet.
 *
 */

.pull-quotes(@font-size, @opacity) {
	position: relative;
	padding: (@font-size/@font-size);
	&:before,
	&:after {
		height: (@font-size/@font-size);
		opacity: @opacity;
		position: absolute;
		font-size: @font-size;
	}
	&:before {
		content: '“';
		top:  0em;
		left: 0em;
	}
	&:after {
		content: '”';
		bottom: 0em;
		right: 0em;
	}
}

.pull-quote {
	.pull-quotes(4em, .15);
}


// @Figures
// --------------------------------------------------------------------------

/**
 * Figures Markup
 *
	<figure>
		<figcaption>
			<strong>Fig. 4.2 | </strong>Type Anatomy, an excerpt from Mark Boulton's book<cite title="http://designingfortheweb.co.uk/book/part3/part3_chapter11.php">"Designing for the Web"</cite>
		</figcaption>
	</figure>
 *
 * Extend this object into your markup.
 *
 */


 // @Footnotes
// --------------------------------------------------------------------------

/**
 * Footnote Markup : Replace 'X' with your unique number for each footnote
 *
	<article>
		<p><sup><a href="#fn-itemX" id="fn-returnX"></a></sup></p>
		<footer>
			<ol class="foot-notes">
				<li id="fn-itemX"><a href="#fn-returnX">↩</a></li>
			</ol>
		</footer>
	</article>
 *
 * Extend this object into your markup.
 *
 */


M assets/less/typography.less => assets/less/typography.less +107 -78
@@ 1,25 1,48 @@
/* Headings ============================================== */
// Body
// --------------------------------------------------
body {
	font-family: @base-font;
	color: @text-color;
}

// Headings
// --------------------------------------------------
h1, h2, h3, h4, h5, h6 {
	font-family: @baseheadingfont;
	font-weight: 700;
	font-family: @heading-font;
}
h1 {
	.font-size(32)
}
h2 {
	.font-size(28)
}
h3 {
	.font-size(24)
}
h4 {
	.font-size(18)
}
h5 {
	.font-size(16)
}
h6 {
	font-weight: 400;
	.font-size(14);
}

/* Links ================================================= */
// Links
// --------------------------------------------------
a { 
	text-decoration: none;
	color: @linkcolor; 
	color: @link-color; 
	&:visited { 
		color: @linkcolorvisited; 
		color: lighten(@link-color, 20); 
	}
	&:hover { 
		color: @linkcolorhover; 
		color: darken(@link-color, 20); 
	}
	&:focus { 
		outline: thin dotted; 
		color: @linkcolorfocus; 
		color: darken(@link-color, 20);
	}
	&:hover, 
	&:active { 


@@ 27,88 50,94 @@ a {
	}
}

b, strong { 
	font-weight: 700;
}

/* Lists ============================================== */
ul {
	li {
		list-style-type: square
	}
}
ol {
	li {
		list-style-type: upper-roman;
	}
}

/* Add underline for main links ======================= */
p > a,
li > a,
em > a,
a > em,
footer a {
	text-decoration: none;
	border-bottom: 1px dotted lighten(@textcolor, 50%);
}
p > a:hover,
li > a:hover,
em > a:hover,
footer a:hover {
	text-decoration: none;
	border-bottom: 1px solid lighten(@textcolor, 50%);
// Figures
// --------------------------------------------------
figcaption {
	padding-top: 10px;
	.font(14);
	line-height: 1.3;
	color: lighten(@text-color, 10);
}

/* Figure caption ===================================== */
figcaption {
	margin-top: (@indent-val / 2);
	line-height: 1.25;
	.zeta();
	font-family: @baseheadingfont;
	counter-increment: captions;
	&:before {
		font-weight: 700;
		text-transform: uppercase;
		content: "Figure " counter(captions) ": ";
// Feature Image Caption
// --------------------------------------------------
.image-credit {
	.grid(12,10);
	.prefix(12,1);
	.suffix(12,1);
	display: block;
	text-align: right;
	.font(12);
	line-height: 1.3;
	font-style: italic;
	color: lighten(@text-color, 30);
	a {
		color: lighten(@text-color, 30);
	}
}

/* Notice ============================================== */
// Note text
// --------------------------------------------------
.notice {
	margin-top: 1.5em;
	padding: .5em 1em;
	text-indent: 0;
	font-size: 90%;
	background-color: #ddd;
	border-left: 10px solid #ccc;
	.font-rem(14);
	background-color: @body-color;
	border: 1px solid darken(@body-color,20);
	.rounded(3px);
}
/* Blockquote =========================================== */

// Blockquotes
// --------------------------------------------------
blockquote {
	margin-left: -28px;
	padding-left: 20px;
	border-left: 8px solid @border-color;
	font-family: @alt-font;
	font-style: italic;
	border-left: 10px solid #ccc;
	margin-left: 0;
	padding-left: 1em;
	border-left: 10px solid #ccc;
	p+p {
		text-indent: 0;
		margin-top: 0;
	}
	.font-rem(24);
}
/* Footnotes ============================================= */

// Footnotes
// --------------------------------------------------
.footnotes {
	font-size: 90%;
	ol, li, p {
		.font-size(14);
	}
}
/* Code ================================================== */

// Paragraphs
// --------------------------------------------------
p {
	margin: 0 0 @indent-var;
	& + p {
		//siblings indentation
		text-indent: @indent-var;
		margin-top: -(@indent-var);
	}
}

// Code
// --------------------------------------------------
tt, code, kbd, samp, pre {
	font-family: @codefont;
}
p code {
	font-size: 80%;
	white-space: nowrap;
	margin: 0 2px;
	padding: 0 5px;
	border: 1px solid lighten(@black, 90);
	background-color: lighten(@black, 95);
	.rounded(3px);
}
\ No newline at end of file
	font-family: @code-font;
}
p,
li { 
	code {
		.font-rem(12);
		line-height: 1.5;
		white-space: nowrap;
		margin: 0 2px;
		padding: 0 5px;
		border: 1px solid lighten(@black, 90);
		background-color: lighten(@black, 95);
		.rounded(3px);
	}
}
pre {
	.font-rem(12);
	line-height: 1.5;
	overflow-x: auto;
}


M assets/less/variables.less => assets/less/variables.less +11 -4
@@ 1,19 1,26 @@
// TYPOGRAPHY ================================================
@basefont: 'PT Serif', serif;
@baseheadingfont: 'PT Sans Narrow', sans-serif;
@codefont: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
@doc-font-size: 16;
@doc-line-height: 26;
@base-font: 'PT Serif', serif;
@heading-font: 'PT Sans Narrow', sans-serif;
@code-font: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
@alt-font: @base-font;

// COLOR ====================================================
@bodycolor      : #fff;
@body-color: @bodycolor;
@textcolor      : #333332;
@text-color     : @textcolor;
@border-color: @text-color;
@basecolor 		: #343434;	  
@compcolor 		: spin(@basecolor, 180); 
@bordercolor    : @basecolor;
@white          : #fff;
@black          : #000;
@black          : #111;
@accentcolor    : @black;
/* Links ================================================= */
@linkcolor 		    : #343434;
@link-color: @linkcolor;
@linkcolorhover 	: darken(@linkcolor, 10);
@linkcolorvisited   : lighten(@linkcolorhover, 20);
@linkcolorfocus 	: darken(@linkcolorvisited, 10);
\ No newline at end of file


M images/bio-photo.jpg => images/bio-photo.jpg +0 -0
M index.md => index.md +2 -0
@@ 4,4 4,6 @@ description: "A responsive Jekyll theme with editorial tendencies by designer Mi
tags: [Jekyll, theme, responsive, blog, template]
image:
  feature: texture-feature-01.jpg
  credit: Texture Lovers
  creditlink: http://texturelovers.com
---
\ No newline at end of file


M theme-setup.md => theme-setup.md +13 -2
@@ 6,6 6,8 @@ description: "Instructions on how to install and customize the Jekyll theme Mini
tags: [Jekyll, theme, responsive]
image:
  feature: texture-feature-02.jpg
  credit: Texture Lovers
  creditlink: http://texturelovers.com
---

<section id="table-of-contents" class="toc">


@@ 32,7 34,7 @@ General notes and suggestions for customizing Minimal Mistakes.
minimal-mistakes/
├── _includes
|    ├── author-bio.html  //bio stuff goes here
|    ├── chrome-frame.html  //displays on IE8 and less
|    ├── browser-upgrade.html  //displays on IE8 and less
|    ├── footer.html  //site footer
|    ├── head.html  //site head
|    ├── navigation.html //site top nav


@@ 60,7 62,7 @@ minimal-mistakes/

### _config.yml

Most of the variables found here are used in the .html files found in `_includes` if you need to add or remove anything. A good place to start would be to change the title, tagline, description, and url of your site. When working locally comment out `url` or else you will get a bunch of broken links because they are absolute and prefixed with `{{ site.url }}` in the various `_includes` and `_layouts`. Just remember to uncomment `url` when building for deployment or pushing to **gh-pages**...
Most of the variables found here are used in the .html files found in `_includes` if you need to add or remove anything. A good place to start would be to change the title, tagline, description, and url of your site. When working locally comment out `url` or else you will get a bunch of broken links because they are absolute and prefixed with `{{ "{{ site.url " }}}}` in the various `_includes` and `_layouts`. Just remember to uncomment `url` when building for deployment or pushing to **gh-pages**...

#### Owner/Author Information



@@ 106,6 108,15 @@ image:
  thumb: thumbnail-image.jpg #keep it square 200x200 px is good
{% endhighlight %}

If you want to apply attribution to a feature image use the following YAML front matter on posts or pages. Image credits appear directly below the feature image with a link back to the original source.

{% highlight yaml %}
image:
  feature: feature-image-filename.jpg
  credit: Michael Rose #name of the person or site you want to credit
  creditlink: http://mademistakes.com #url to their site or licensing
{% endhighlight %}

#### Thumbnails for OG and Twitter Cards

Post and page thumbnails work the same way. These are used by [Open Graph](https://developers.facebook.com/docs/opengraph/) and [Twitter Cards](https://dev.twitter.com/docs/cards) meta tags found in *head.html*. If you don't assign a thumbnail the default graphic *(default-thumb.png)* is used. I'd suggest changing this to something more meaningful --- your logo or avatar are good options.