From 3b1cefde2795a35716c406c1ef327bea67e720f3 Mon Sep 17 00:00:00 2001 From: Michael Rose Date: Wed, 9 Mar 2016 22:19:11 -0500 Subject: [PATCH] First pass at cleaning out the CSS cruft - Dump unused styles - Use breakpoint mixin for media queries --- _assets/css/_coderay.scss | 137 --- _assets/css/_elements.scss | 6 +- _assets/css/_forms.scss | 266 ++--- _assets/css/_page.scss | 955 ++++++++---------- _assets/css/_syntax.scss | 164 +-- _assets/css/_typography.scss | 15 +- _assets/css/_variables.scss | 25 +- _assets/css/main.scss | 11 +- .../css/vendor/breakpoint/_breakpoint.scss | 114 +++ _assets/css/vendor/breakpoint/_context.scss | 95 ++ _assets/css/vendor/breakpoint/_helpers.scss | 151 +++ .../vendor/breakpoint/_legacy-settings.scss | 50 + _assets/css/vendor/breakpoint/_no-query.scss | 15 + _assets/css/vendor/breakpoint/_parsers.scss | 215 ++++ .../css/vendor/breakpoint/_respond-to.scss | 82 ++ _assets/css/vendor/breakpoint/_settings.scss | 71 ++ .../vendor/breakpoint/parsers/_double.scss | 33 + .../css/vendor/breakpoint/parsers/_query.scss | 82 ++ .../breakpoint/parsers/_resolution.scss | 31 + .../vendor/breakpoint/parsers/_single.scss | 26 + .../vendor/breakpoint/parsers/_triple.scss | 36 + .../parsers/double/_default-pair.scss | 21 + .../breakpoint/parsers/double/_default.scss | 22 + .../parsers/double/_double-string.scss | 22 + .../parsers/resolution/_resolution.scss | 60 ++ .../breakpoint/parsers/single/_default.scss | 13 + .../breakpoint/parsers/triple/_default.scss | 18 + .../magnific-popup/_magnific-popup.scss | 2 +- .../css/vendor/magnific-popup/_settings.scss | 2 +- assets/css/main.css | 2 +- 30 files changed, 1824 insertions(+), 918 deletions(-) delete mode 100644 _assets/css/_coderay.scss create mode 100755 _assets/css/vendor/breakpoint/_breakpoint.scss create mode 100755 _assets/css/vendor/breakpoint/_context.scss create mode 100755 _assets/css/vendor/breakpoint/_helpers.scss create mode 100755 _assets/css/vendor/breakpoint/_legacy-settings.scss create mode 100755 _assets/css/vendor/breakpoint/_no-query.scss create mode 100755 _assets/css/vendor/breakpoint/_parsers.scss create mode 100755 _assets/css/vendor/breakpoint/_respond-to.scss create mode 100755 _assets/css/vendor/breakpoint/_settings.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/_double.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/_query.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/_resolution.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/_single.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/_triple.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/double/_default-pair.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/double/_default.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/double/_double-string.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/resolution/_resolution.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/single/_default.scss create mode 100755 _assets/css/vendor/breakpoint/parsers/triple/_default.scss diff --git a/_assets/css/_coderay.scss b/_assets/css/_coderay.scss deleted file mode 100644 index 55dd71bc..00000000 --- a/_assets/css/_coderay.scss +++ /dev/null @@ -1,137 +0,0 @@ -/* ========================================================================== - Coderay syntax highlighting - ========================================================================== */ - -.CodeRay { - background-color: #efefef; - font-family: $code-font; - @include font(12); - color: #333332; - margin-bottom: 1.5em; - @include rounded(4px); - pre { - margin: 0px; - padding: 1em; - } -} - -div.CodeRay { } -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: red } -.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:#007 } -.CodeRay .attribute-name { color:#f08 } -.CodeRay .attribute-value { color:#700 } -.CodeRay .binary { color:#509; font-weight:bold } -.CodeRay .comment { color:#998; font-style: italic;} -.CodeRay .char { color:#04D } -.CodeRay .char .content { color:#04D } -.CodeRay .char .delimiter { color:#039 } -.CodeRay .class { color:#458; font-weight:bold } -.CodeRay .complex { color:#A08; font-weight:bold } -.CodeRay .constant { color:teal; } -.CodeRay .color { color:#0A0 } -.CodeRay .class-variable { color:#369 } -.CodeRay .decorator { color:#B0B; } -.CodeRay .definition { color:#099; font-weight:bold } -.CodeRay .directive { color:#088; font-weight:bold } -.CodeRay .delimiter { color:black } -.CodeRay .doc { color:#970 } -.CodeRay .doctype { color:#34b } -.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:#FAA } -.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: black } -.CodeRay .inline .inline { background: #ccc } -.CodeRay .inline .inline .inline { background: #bbb } -.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:teal } -.CodeRay .label { color:#970; font-weight:bold } -.CodeRay .local-variable { color:#963 } -.CodeRay .octal { color:#40E; font-weight:bold } -.CodeRay .operator { } -.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:#808 } -.CodeRay .regexp .delimiter { color:#404 } -.CodeRay .regexp .modifier { color:#C2C } -.CodeRay .regexp .function { color:#404; font-weight: bold } - -.CodeRay .string { color: #D20; } -.CodeRay .string .string { } -.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:#D14 } -.CodeRay .shell .content { } -.CodeRay .shell .delimiter { color:#D14 } - -.CodeRay .symbol { color:#990073 } -.CodeRay .symbol .content { color:#A60 } -.CodeRay .symbol .delimiter { color:#630 } - -.CodeRay .tag { color:#070 } -.CodeRay .tag-special { color:#D70; font-weight:bold } -.CodeRay .type { color:#339; font-weight:bold } -.CodeRay .variable { color:#036 } - -.CodeRay .insert { background: #afa; } -.CodeRay .delete { background: #faa; } -.CodeRay .change { color: #aaf; background: #007; } -.CodeRay .head { color: #f8f; background: #505 } - -.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; } diff --git a/_assets/css/_elements.scss b/_assets/css/_elements.scss index 3dddd2af..6d97d6c4 100644 --- a/_assets/css/_elements.scss +++ b/_assets/css/_elements.scss @@ -37,7 +37,7 @@ svg:not(:root) { .half { @include container; @include clearfix; - @media #{$micro} { + @include breakpoint($micro) { img { @include grid(12,6); } @@ -52,7 +52,7 @@ svg:not(:root) { .third { @include container; @include clearfix; - @media #{$micro} { + @include breakpoint($micro) { img { @include grid(12,4); } @@ -73,7 +73,7 @@ svg:not(:root) { margin-bottom: 20px; padding: 8px 20px; @include font-rem(14); - font-family: $heading-font; + font-family: $sans-serif-narrow; font-weight: 700; background-color: $primary; color: $white; diff --git a/_assets/css/_forms.scss b/_assets/css/_forms.scss index 8ce54490..b23f1ee7 100644 --- a/_assets/css/_forms.scss +++ b/_assets/css/_forms.scss @@ -3,164 +3,164 @@ ========================================================================== */ btnform { - margin: 0 0 5px 0; - fieldset { - margin-bottom: 5px; - padding: 0; - border-width: 0; - } - legend { - display: block; - width: 100%; - margin-bottom: 5px * 2; - *margin-left: -7px; - padding: 0; - color: $textcolor; - border: 0; - border-bottom: 1px solid lighten($black, 80); - white-space: normal; - } - p { - margin-bottom: 5px / 2; - } - ul { - list-style-type: none; - margin: 0 0 5px 0; - padding: 0; - } - br { - display: none; - } + margin: 0 0 5px 0; + fieldset { + margin-bottom: 5px; + padding: 0; + border-width: 0; + } + legend { + display: block; + width: 100%; + margin-bottom: 5px * 2; + *margin-left: -7px; + padding: 0; + color: $textcolor; + border: 0; + border-bottom: 1px solid lighten($black, 80); + white-space: normal; + } + p { + margin-bottom: 5px / 2; + } + ul { + list-style-type: none; + margin: 0 0 5px 0; + padding: 0; + } + br { + display: none; + } } label, input, button, select, textarea { - vertical-align: baseline; - *vertical-align: middle; + vertical-align: baseline; + *vertical-align: middle; } input, button, select, textarea { - font-family: $base-font; - @include box-sizing(border-box); + font-family: $serif; + @include box-sizing(border-box); } label { - display: block; - margin-bottom: 10px / 8; - font-weight: bold; - color: $textcolor; - cursor: pointer; - input, - textarea, - select { - display: block; - } + display: block; + margin-bottom: 10px / 8; + font-weight: bold; + color: $textcolor; + cursor: pointer; + input, + textarea, + select { + display: block; + } } input, textarea, select { - display: inline-block; - width: 100%; - padding: 4px; - margin-bottom: 5px / 4; - background-color: $white; - border: 1px solid lighten($black, 80); - color: $textcolor; - &:hover { - border-color: lighten($accentcolor, 50); - } + display: inline-block; + width: 100%; + padding: 4px; + margin-bottom: 5px / 4; + background-color: $white; + border: 1px solid lighten($black, 80); + color: $textcolor; + &:hover { + border-color: lighten($accentcolor, 50); + } } .input-mini { - width: 60px; + width: 60px; } .input-small { - width: 90px; + 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; - @include rounded(0); - border: 0 \9; + width: auto; + height: auto; + padding: 0; + margin: 3px 0; + *margin-top: 0; + line-height: normal; + cursor: pointer; + @include rounded(0); + border: 0 \9; } input[type="checkbox"], input[type="radio"] { - @include box-sizing(border-box); - padding: 0; - *width: 13px; - *height: 13px; + @include box-sizing(border-box); + padding: 0; + *width: 13px; + *height: 13px; } input[type="image"] { - border: 0; - @include box-shadow(none); + border: 0; + @include box-shadow(none); } input[type="file"] { - width: auto; - padding: initial; - line-height: initial; - border: initial; - background-color: transparent; - background-color: initial; - @include box-shadow(none); + width: auto; + padding: initial; + line-height: initial; + border: initial; + background-color: transparent; + background-color: initial; + @include box-shadow(none); } input[type="button"], input[type="reset"], input[type="submit"] { - width : auto; - height : auto; - cursor : pointer; - *overflow : visible; + width : auto; + height : auto; + cursor : pointer; + *overflow : visible; } select, input[type="file"] { - *margin-top : 4px; + *margin-top : 4px; } select { - width : auto; - background-color : $white; + width : auto; + background-color : $white; } select[multiple], select[size] { - height : auto; + height : auto; } textarea { - @include resize(vertical); - height : auto; - overflow : auto; - vertical-align : top; + @include resize(vertical); + height : auto; + overflow : auto; + vertical-align : top; } input[type="hidden"] { - display : none; + display : none; } .radio, .checkbox { - padding-left : 18px; - font-weight : normal; + padding-left : 18px; + font-weight : normal; } .radio input[type="radio"], .checkbox input[type="checkbox"] { - float : left; - margin-left : -18px; + float : left; + margin-left : -18px; } .radio.inline, .checkbox.inline { - display : inline-block; - padding-top : 5px; - margin-bottom : 0; - vertical-align : middle; + display : inline-block; + padding-top : 5px; + margin-bottom : 0; + vertical-align : middle; } .radio.inline + .radio.inline, .checkbox.inline + .checkbox.inline { - margin-left : 10px; + margin-left : 10px; } /* @@ -173,8 +173,8 @@ textarea[disabled], input[readonly], select[readonly], textarea[readonly] { - @include opacity(.5); - cursor : not-allowed; + @include opacity(.5); + cursor : not-allowed; } /* @@ -183,15 +183,15 @@ textarea[readonly] { input:focus, textarea:focus { - border-color : $accentcolor; - outline : 0; - outline : thin dotted \9; + border-color : $accentcolor; + outline : 0; + outline : thin dotted \9; } input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus, select:focus { - @include box-shadow(none); + @include box-shadow(none); } /* @@ -200,17 +200,17 @@ select:focus { .help-block, .help-inline { - color : lighten($black, 50); + color : lighten($black, 50); } .help-block { - display : block; - margin-bottom : 1em; - line-height : 1em; + display : block; + margin-bottom : 1em; + line-height : 1em; } .help-inline { - display : inline-block; - vertical-align : middle; - padding-left : 5px; + display : inline-block; + vertical-align : middle; + padding-left : 5px; } /* @@ -220,24 +220,24 @@ select:focus { .form-inline input, .form-inline textarea, .form-inline select { - display : inline-block; - margin-bottom : 0; + display : inline-block; + margin-bottom : 0; } .form-inline label { - display : inline-block; + display : inline-block; } .form-inline .radio, .form-inline .checkbox, .form-inline .radio { - padding-left : 0; - margin-bottom : 0; - vertical-align : middle; + 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; } + float : left; + margin-left : 0; + margin-right : 3px; } /* .form-search @@ -246,28 +246,28 @@ select:focus { .form-search input, .form-search textarea, .form-search select { - display : inline-block; - margin-bottom : 0; + display : inline-block; + margin-bottom : 0; } .form-search .search-query { - padding-left : 14px; - padding-right : 14px; - margin-bottom : 0; - @include rounded(14px); + padding-left : 14px; + padding-right : 14px; + margin-bottom : 0; + @include rounded(14px); } .form-search label { - display : inline-block; + display : inline-block; } .form-search .radio, .form-search .checkbox, .form-inline .radio { - padding-left : 0; - margin-bottom : 0; - vertical-align : middle; + 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; + float : left; + margin-left : 0; + margin-right : 3px; } diff --git a/_assets/css/_page.scss b/_assets/css/_page.scss index 4ee39087..8a62d9d9 100644 --- a/_assets/css/_page.scss +++ b/_assets/css/_page.scss @@ -3,9 +3,9 @@ ========================================================================== */ body { - background-color: $bodycolor; - font-family: $base-font; - color: $text-color; + background-color: $bodycolor; + font-family: $serif; + color: $text-color; } /* @@ -13,237 +13,114 @@ body { ========================================================================== */ .navigation-wrapper { - @include container; - padding: 2em 0 1em; - font-family: $heading-font; - font-weight: 700; - text-transform: uppercase; - @include clearfix; + @include container; + padding: 2em 0 1em; + font-family: $sans-serif-narrow; + font-weight: 700; + text-transform: uppercase; + @include clearfix; } /* Site name */ .site-name { - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - margin-bottom: 1em; - float: none; - display: block; - @include font-rem(24); - @media #{$small} { - @include grid(12,2); - @include prefix(12,0.5); - @include suffix(12,0.5); - @include font-rem(16); - } - @media #{$x-large} { - @include grid(12,1.5); - @include prefix(12,2); - } + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + margin-bottom: 1em; + float: none; + display: block; + @include font-rem(24); + @include breakpoint($small) { + @include grid(12,2); + @include prefix(12,0.5); + @include suffix(12,0.5); + @include font-rem(16); + } + @include breakpoint($x-large) { + @include grid(12,1.5); + @include prefix(12,2); + } } /* Top navigation links */ .top-navigation { - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - margin-bottom: 1em; - float: none; - display: block; - @media #{$small} { - @include grid(12,9); - @include prefix(12,0); - @include suffix(12,0); - } - @media #{$x-large} { - @include grid(12,8); - } - ul { - margin: 0; - padding: 0; - clear: both; - list-style-type: none; - } - li { - display: block; - list-style-type: none; - border-bottom: 1px solid lighten($black,80); - border-bottom: 1px solid fade($black,10); - @include font-rem(16); - &:last-child { - border-bottom: 0 solid transparent; - } - @media #{$small} { - display: inline; - margin-right: 25px; - white-space: nowrap; - border-bottom: 0 solid transparent; - } - a { - display: block; - padding: 10px 0; - decoration: none; - border-bottom: 0 solid transparent; - @include transition(all .2s); - @media #{$small} { - display: inline; - padding: 0; - } - } - } -} - -/* Animated lines for mobile nav button */ -$button-size: 1.5rem; -@mixin navicon-line() { - display: inline-block; - width: $button-size; - height: $button-size/7; - // line color - background: $white; - border-radius: $button-size/14; - transition: .3s; -} -.navicon-lines-button { - padding: $button-size/4 $button-size/2; - transition: .3s; - cursor: pointer; - user-select: none; - border-radius: $button-size/7; -} -.navicon-lines-button:hover { - opacity: 1; -} -.navicon-lines-button:active { - transition: 0; -} -.navicon-lines { - margin-right: 10px; - margin-bottom: $button-size/5; - // create middle line - @include navicon-line; - position: relative; - // create the upper and lower lines as pseudo-elements of the middle line - &:before, - &:after { - @include navicon-line; - position: absolute; - left: 0; - content: ''; - -webkit-transform-origin: $button-size/14 center; - transform-origin: $button-size/14 center; - } - &:before { top: $button-size/4; } - &:after { top: -$button-size/4; } -} -.navicon-lines-button:hover { - opacity: 1; - .navicon-lines { - &:before { top: $button-size/3.5; } - &:after { top: -$button-size/3.5; } - } -} -.navicon-lines-button.x.active .navicon-lines { - // hide the middle line - background: transparent; - // overlap the lines by setting both their top values to 0 - &:before, - &:after { - -webkit-transform-origin: 50% 50%; - transform-origin: 50% 50%; - top: 0; - width: $button-size; - } - // rotate the lines to form the x shape - &:before { - -webkit-transform: rotate3d(0,0,1,45deg); - transform: rotate3d(0,0,1,45deg); - } - &:after { - -webkit-transform: rotate3d(0,0,1,-45deg); - transform: rotate3d(0,0,1,-45deg); - } -} -// Style the toggle menu link and hide it -.nav .navtoggle { - @include font-rem(18); - font-weight: normal; - background-color: $black; - color: $white; - border: none; - cursor: pointer; - @media #{$small} { - display: none; - } -} -.nav button { - border: none; - background: none; -} -.navtoggle i { - z-index:-1; -} -.icon-menu { - position: relative; - top: 3px; - line-height: 0; -} -// When JavaScript is disabled, we hide the toggle button -.no-js .nav .navtoggle { - display: none; -} -// When JavaScript is disabled, we show the menu -.no-js .nav ul { - max-height: 30em; - overflow: hidden; -} -// When JavaScript is enabled, we hide the menu -.js .nav ul { - max-height: 0; - overflow: hidden; - @media #{$small} { - max-height: 30em; - } -} -// Displaying the menu when the user has clicked on the button -.js .nav .active + ul { - max-height: 30em; - overflow: hidden; - -webkit-transition: max-height .4s; - -moz-transition: max-height .4s; - -o-transition: max-height .4s; - -ms-transition: max-height .4s; - transition: max-height .4s; + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + margin-bottom: 1em; + float: none; + display: block; + @include breakpoint($small) { + @include grid(12,9); + @include prefix(12,0); + @include suffix(12,0); + } + @include breakpoint($x-large) { + @include grid(12,8); + } + ul { + margin: 0; + padding: 0; + clear: both; + list-style-type: none; + } + li { + display: block; + list-style-type: none; + border-bottom: 1px solid lighten($black,80); + border-bottom: 1px solid fade($black,10); + @include font-rem(16); + &:last-child { + border-bottom: 0 solid transparent; + } + @include breakpoint($small) { + display: inline; + margin-right: 25px; + white-space: nowrap; + border-bottom: 0 solid transparent; + } + a { + display: block; + padding: 10px 0; + decoration: none; + border-bottom: 0 solid transparent; + @include transition(all .2s); + @include breakpoint($small) { + display: inline; + padding: 0; + } + } + } } /* Main content */ #main { - counter-reset: captions; - @include container; - @include clearfix; - clear: both; - margin-top: 2em; - h1 { - margin-top: 0; - } - .post { - @include container; - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - margin-bottom: 2em; - @media #{$small} { - @include grid(12,8); - @include prefix(12,0); - @include suffix(12,0); - } - @media #{$large} { - @include grid(12,6); - } - @media #{$x-large} { - @include grid(12,5); - } - } + counter-reset: captions; + @include container; + @include clearfix; + clear: both; + margin-top: 2em; + h1 { + margin-top: 0; + } + .post { + @include container; + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + margin-bottom: 2em; + @include breakpoint($small) { + @include grid(12,8); + @include prefix(12,0); + @include suffix(12,0); + } + @include breakpoint($large) { + @include grid(12,6); + } + @include breakpoint($x-large) { + @include grid(12,5); + } + } figcaption { padding-top: 10px; @include font(14); @@ -254,121 +131,121 @@ $button-size: 1.5rem; /* Archive listing specific styling */ .archive { - @include container; - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - margin-bottom: 2em; - @media #{$small} { - @include grid(12,8); - @include prefix(12,0); - @include suffix(12,0); - } - @media #{$large} { - @include grid(12,6); - } - @media #{$x-large} { - @include grid(12,5); - } - h3 { - margin: 0; - padding-bottom: .5em; - @include font-rem(28); - border-bottom: 1px solid lighten($black,70); - } - article { - h2 { - margin-bottom: 4px; - @include font-rem(20); - &.link-post { - margin-bottom: 0px + $doc-line-height; - margin-bottom: 0rem + ($doc-line-height / $doc-font-size); - } - } - p { - @include font-rem(14); - } - p+p { - text-indent: 0; - } - } + @include container; + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + margin-bottom: 2em; + @include breakpoint($small) { + @include grid(12,8); + @include prefix(12,0); + @include suffix(12,0); + } + @include breakpoint($large) { + @include grid(12,6); + } + @include breakpoint($x-large) { + @include grid(12,5); + } + h3 { + margin: 0; + padding-bottom: .5em; + @include font-rem(28); + border-bottom: 1px solid lighten($black,70); + } + article { + h2 { + margin-bottom: 4px; + @include font-rem(20); + &.link-post { + margin-bottom: 0px + $doc-line-height; + margin-bottom: 0rem + ($doc-line-height / $doc-font-size); + } + } + p { + @include font-rem(14); + } + p+p { + text-indent: 0; + } + } } /* Large feature header image */ .image-wrap { - position: relative; - margin-bottom: 2em; - @include clearfix; - &:after { - content: " "; - display: block; - position: absolute; - bottom: 0; - left: 8%; - width: 0; - height: 0; - border: 10px solid transparent; - border-bottom-color: $bodycolor; - @media #{$small} { - left: 25%; - } - @media #{$large} { - border-width: 20px; - } - @media #{$x-large} { - left: 33.333333333%; - } - } - img { - width: 100%; - height: auto; - -ms-interpolation-mode: bicubic; - } + position: relative; + margin-bottom: 2em; + @include clearfix; + &:after { + content: " "; + display: block; + position: absolute; + bottom: 0; + left: 8%; + width: 0; + height: 0; + border: 10px solid transparent; + border-bottom-color: $bodycolor; + @include breakpoint($small) { + left: 25%; + } + @include breakpoint($large) { + border-width: 20px; + } + @include breakpoint($x-large) { + left: 33.333333333%; + } + } + img { + width: 100%; + height: auto; + -ms-interpolation-mode: bicubic; + } } /* Post byline */ .byline { - clear: both; - font-size: 80%; + clear: both; + font-size: 80%; } /* Author profile */ .sidebar { - display: none; - a, a:hover { - border-bottom: 0 solid transparent; - } + display: none; + a, a:hover { + border-bottom: 0 solid transparent; + } img { width: 100%; } - @media #{$small} { - display: block; - @include grid(12,2); - @include prefix(12,0.5); - @include suffix(12,0.5); - } - @media #{$x-large} { - @include grid(12,1.5); - @include prefix(12,2); - } + @include breakpoint($small) { + display: block; + @include grid(12,2); + @include prefix(12,0.5); + @include suffix(12,0.5); + } + @include breakpoint($x-large) { + @include grid(12,1.5); + @include prefix(12,2); + } } .author-name { - margin-bottom: 0; - @media #{$small} { - margin-top: 10px; - margin-bottom: 10px; - } + margin-bottom: 0; + @include breakpoint($small) { + margin-top: 10px; + margin-bottom: 10px; + } } .author-bio { - font-size: 80%; - font-style: italic; - @media #{$small} { - margin-bottom: 20px; - } + font-size: 80%; + font-style: italic; + @include breakpoint($small) { + margin-bottom: 20px; + } } .author-avatar { - max-width: 110px; - @include rounded(150px); + max-width: 110px; + @include rounded(150px); } .author-social { display: block; @@ -385,144 +262,144 @@ $button-size: 1.5rem; @include translate(0, 2px); } .fa { - margin-right: 5px; - } + margin-right: 5px; + } } -@media #{$small} { - display: block; - max-width: 125px; +@include breakpoint($small) { + display: block; + max-width: 125px; } -@media #{$large} { - .author-name, - .author-avatar, - .author-bio, - .author-social { - max-width: 150px; - } +@include breakpoint($large) { + .author-name, + .author-avatar, + .author-bio, + .author-social { + max-width: 150px; + } } /* Post content wrapper */ .article-wrap { - // Dotted line underlines for links - p > a, - p > em > a, - p > strong > a, - li > a { - text-decoration: underline; - } + // Dotted line underlines for links + p > a, + p > em > a, + p > strong > a, + li > a { + text-decoration: underline; + } } /* Table of contents */ .toc { - font-size: 95%; - @media #{$large} { - display: block; - @include grid(12,2); - @include prefix(12,0.5); - @include suffix(12,0.5); - position: absolute; - top: 5.5em; - right: 0; - background-color: $white; - } - header { - background: lighten($black, 10); - } - h3 { - margin: 0; - padding: 5px 10px; - color: $white; - @include font-rem(16); - text-transform: uppercase; - &:hover { - cursor: pointer; - } - } - ul { - margin: 2px 0 0; - padding: 0; - line-height: 1; - } - li { - display: block; - margin: 0 0 1px 0; - padding: 0; - font-family: $heading-font; - list-style-type: none; - &:last-child { - border-bottom-width: 0; - } - a { - padding: 10px; - display: block; - color: $white; - text-decoration: none; - background: lighten($black, 30); - @include opacity(0.7); - @include transition(opacity 0.2s ease-in-out); - &:hover { - @include opacity(1); - } - } - ul { - margin: 1px 0 0; - li a { - padding-left: 20px; - } - } - } + font-size: 95%; + @include breakpoint($large) { + display: block; + @include grid(12,2); + @include prefix(12,0.5); + @include suffix(12,0.5); + position: absolute; + top: 5.5em; + right: 0; + background-color: $white; + } + header { + background: lighten($black, 10); + } + h3 { + margin: 0; + padding: 5px 10px; + color: $white; + @include font-rem(16); + text-transform: uppercase; + &:hover { + cursor: pointer; + } + } + ul { + margin: 2px 0 0; + padding: 0; + line-height: 1; + } + li { + display: block; + margin: 0 0 1px 0; + padding: 0; + font-family: $sans-serif-narrow; + list-style-type: none; + &:last-child { + border-bottom-width: 0; + } + a { + padding: 10px; + display: block; + color: $white; + text-decoration: none; + background: lighten($black, 30); + @include opacity(0.7); + @include transition(opacity 0.2s ease-in-out); + &:hover { + @include opacity(1); + } + } + ul { + margin: 1px 0 0; + li a { + padding-left: 20px; + } + } + } } /* TOC trigger for collapsing */ #drawer { - max-height: 100%; - overflow: hidden; - &.js-hidden { - max-height: 0; - } + max-height: 100%; + overflow: hidden; + &.js-hidden { + max-height: 0; + } } /* Image grid - not used */ .image-grid { - @include clearfix; - list-style: none; - margin: 0 0 1em; - padding: 0; - li { - @include grid(12,6); - @media #{$micro} { - width: 33.333333%; - } - @media #{$small} { - width: 25%; - } - @media #{$medium} { - width: 20%; - } - @media #{$large} { - width: 16.666666666%; - } - } + @include clearfix; + list-style: none; + margin: 0 0 1em; + padding: 0; + li { + @include grid(12,6); + @include breakpoint($micro) { + width: 33.333333%; + } + @include breakpoint($small) { + width: 25%; + } + @include breakpoint($medium) { + width: 20%; + } + @include breakpoint($large) { + width: 16.666666666%; + } + } } /* Recent grid - not used */ .recent-grid { - @include clearfix; - list-style: none; - margin: 1em 0; - li { - display: inline; - a { - border-bottom: 0 solid transparent; - &:hover { - border-bottom: 0 solid transparent; - } - } - } - img { - width: 19%; - margin-bottom: 1%; - } + @include clearfix; + list-style: none; + margin: 1em 0; + li { + display: inline; + a { + border-bottom: 0 solid transparent; + &:hover { + border-bottom: 0 solid transparent; + } + } + } + img { + width: 19%; + margin-bottom: 1%; + } } /* Social sharing links */ @@ -531,12 +408,12 @@ $button-size: 1.5rem; margin-bottom: 0px + $doc-line-height; margin-bottom: 0rem + ($doc-line-height / $doc-font-size); ul, li { - margin: 0; - padding: 0; - list-style: none; + margin: 0; + padding: 0; + list-style: none; } li { - display: inline-block; + display: inline-block; } $social: (facebook, $facebook-color), @@ -557,58 +434,58 @@ $button-size: 1.5rem; } } a { - display: block; - padding: 8px 20px; - text-decoration: none !important; - text-transform: uppercase; - @include font-rem(14); - font-family: $heading-font; - font-weight: 700; - color: $white; - opacity: 0.8; - &:hover { - opacity: 1; - } - } - span { - display: none; - @media #{$medium} { - display: inline; - padding-left: 5px; - } - } - h4 { - @include font-rem(14); - margin-bottom: 10px; - text-transform: uppercase; - } + display: block; + padding: 8px 20px; + text-decoration: none !important; + text-transform: uppercase; + @include font-rem(14); + font-family: $sans-serif-narrow; + font-weight: 700; + color: $white; + opacity: 0.8; + &:hover { + opacity: 1; + } + } + span { + display: none; + @include breakpoint($medium) { + display: inline; + padding-left: 5px; + } + } + h4 { + @include font-rem(14); + margin-bottom: 10px; + text-transform: uppercase; + } } /* Footer wrapper */ .footer-wrap { - @include container; - @include clearfix; - clear: both; - padding-bottom: 3em; - .copyright { - @include font-rem(14); - } - footer { - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - @media #{$small} { - @include grid(12,6); - @include prefix(12,3); - @include suffix(12,3); - } - @media #{$x-large} { - @include grid(12,4.5); - @include prefix(12,4); - @include suffix(12,3.5); - } - } + @include container; + @include clearfix; + clear: both; + padding-bottom: 3em; + .copyright { + @include font-rem(14); + } + footer { + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + @include breakpoint($small) { + @include grid(12,6); + @include prefix(12,3); + @include suffix(12,3); + } + @include breakpoint($x-large) { + @include grid(12,4.5); + @include prefix(12,4); + @include suffix(12,3.5); + } + } } /* Follow links */ @@ -629,27 +506,27 @@ $button-size: 1.5rem; /* Related articles list */ .related-articles { - @include grid(12,10); - @include prefix(12,1); - @include suffix(12,1); - margin-bottom: 2em; - @media #{$small} { - @include grid(12,6); - @include prefix(12,3); - @include suffix(12,3); - } - @media #{$x-large} { - @include grid(12,4.5); - @include prefix(12,4); - @include suffix(12,3.5); - } - h4 { - text-transform: uppercase; - margin-bottom: 0; - } - li { - margin-bottom: 0; - } + @include grid(12,10); + @include prefix(12,1); + @include suffix(12,1); + margin-bottom: 2em; + @include breakpoint($small) { + @include grid(12,6); + @include prefix(12,3); + @include suffix(12,3); + } + @include breakpoint($x-large) { + @include grid(12,4.5); + @include prefix(12,4); + @include suffix(12,3.5); + } + h4 { + text-transform: uppercase; + margin-bottom: 0; + } + li { + margin-bottom: 0; + } } /* @@ -657,20 +534,20 @@ $button-size: 1.5rem; ========================================================================== */ .browser-upgrade { - background: #000; - text-align: center; - margin: 0 0 2em 0; - padding: 10px; - text-align: center; - color: $white; - a { - color: $white; - border-bottom: 1px dotted $white; - text-decoration: none; - &:hover { - border-bottom: 1px solid $white; - } - } + background: #000; + text-align: center; + margin: 0 0 2em 0; + padding: 10px; + text-align: center; + color: $white; + a { + color: $white; + border-bottom: 1px dotted $white; + text-decoration: none; + &:hover { + border-bottom: 1px solid $white; + } + } } /* @@ -678,31 +555,31 @@ $button-size: 1.5rem; ========================================================================== */ #goog-fixurl { - ul { - list-style: none; - margin-left: 0; - padding-left: 0; - li { - list-style-type: none; - } - } + 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; - @include font-rem(14); - background-color: $white; - color: $black; - border-width: 2px !important; - border-style: solid !important; - border-color: lighten($black,50); - @include rounded(3px); + width: auto; + margin-right: 10px; + margin-bottom: 20px; + padding: 8px 20px; + display: inline-block; + @include font-rem(14); + background-color: $white; + color: $black; + border-width: 2px !important; + border-style: solid !important; + border-color: lighten($black,50); + @include rounded(3px); } #goog-wm-sb { - @extend .btn; + @extend .btn; } /* diff --git a/_assets/css/_syntax.scss b/_assets/css/_syntax.scss index 7d8824f3..1a592250 100644 --- a/_assets/css/_syntax.scss +++ b/_assets/css/_syntax.scss @@ -2,83 +2,93 @@ Syntax highlighting ========================================================================== */ -pre.highlight { - padding: 1em; +div.highlighter-rouge { + margin-bottom: 1em; + padding: 1em; + border: 1px solid #ddd; + border-radius: $border-radius; + .highlight { + margin: 0; + font-family: $monospace; + @include font-rem(12); + line-height: 1.5; + } } -.highlight { - background-color: #efefef; - font-family: $code-font; - @include font-rem(12); - line-height: 1.5; - color: #333332; - margin-bottom: 1.5em; - @include rounded(4px); - 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 */ +.highlight table td { padding: 5px; } +.highlight table pre { margin: 0; } +.highlight, .highlight .w { + color: #303030; +} +.highlight .err { + color: #151515; + background-color: #ac4142; +} +.highlight .c, .highlight .cd, .highlight .cm, .highlight .c1, .highlight .cs { + color: #505050; +} +.highlight .cp { + color: #f4bf75; +} +.highlight .nt { + color: #f4bf75; +} +.highlight .o, .highlight .ow { + color: #d0d0d0; +} +.highlight .p, .highlight .pi { + color: #d0d0d0; +} +.highlight .gi { + color: #90a959; +} +.highlight .gd { + color: #ac4142; +} +.highlight .gh { + color: #6a9fb5; + background-color: #151515; + font-weight: bold; +} +.highlight .k, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kv { + color: #aa759f; +} +.highlight .kc { + color: #d28445; +} +.highlight .kt { + color: #d28445; +} +.highlight .kd { + color: #d28445; +} +.highlight .s, .highlight .sb, .highlight .sc, .highlight .sd, .highlight .s2, .highlight .sh, .highlight .sx, .highlight .s1 { + color: #90a959; +} +.highlight .sr { + color: #75b5aa; +} +.highlight .si { + color: #8f5536; +} +.highlight .se { + color: #8f5536; +} +.highlight .nn { + color: #f4bf75; +} +.highlight .nc { + color: #f4bf75; +} +.highlight .no { + color: #f4bf75; +} +.highlight .na { + color: #6a9fb5; +} +.highlight .m, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mb, .highlight .mx { + color: #90a959; +} +.highlight .ss { + color: #90a959; } diff --git a/_assets/css/_typography.scss b/_assets/css/_typography.scss index 7489d6c8..4a13c174 100644 --- a/_assets/css/_typography.scss +++ b/_assets/css/_typography.scss @@ -7,7 +7,7 @@ ========================================================================== */ h1, h2, h3, h4, h5, h6 { - font-family: $heading-font; + font-family: $serif; } h1 { @include font-size(32); @@ -65,12 +65,12 @@ a { line-height: 1.3; font-style: italic; color: lighten($text-color, 30); - @media #{$small} { + @include breakpoint($small) { @include grid(12,9); @include prefix(12,0); @include suffix(12,0); } - @media #{$x-large} { + @include breakpoint($x-large) { @include grid(12,8.5); } a { @@ -100,7 +100,7 @@ blockquote { margin-left: -28px; padding-left: 20px; border-left: 8px solid $border-color; - font-family: $alt-font; + font-family: $serif; font-style: italic; } @@ -135,18 +135,13 @@ p { ========================================================================== */ tt, code, kbd, samp, pre { - font-family: $code-font; + font-family: $monospace; } p, li { code { @include font-rem(12); line-height: 1.5; - margin: 0 2px; - padding: 0 5px; - border: 1px solid lighten($black, 90); - background-color: #efefef; - @include rounded(3px); } } pre { diff --git a/_assets/css/_variables.scss b/_assets/css/_variables.scss index 945b7d78..97e16b29 100644 --- a/_assets/css/_variables.scss +++ b/_assets/css/_variables.scss @@ -1,5 +1,5 @@ /* ========================================================================== - Sass variables + Variables ========================================================================== */ /* @@ -9,10 +9,11 @@ $doc-font-size: 16; $doc-line-height: 26; $paragraph-indent: true !default; -$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; + +$serif : "PT Serif", serif; +$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif; +$sans-serif-narrow : "PT Sans Narrow", sans-serif; +$monospace : Monaco, Consolas, "Lucida Console", monospace; /* Colors @@ -58,12 +59,16 @@ $linkcolorhover : darken($linkcolor, 10); $linkcolorvisited : lighten($linkcolorhover, 20); $linkcolorfocus : darken($linkcolorvisited, 10); +$border-radius : 4px; + /* Breakpoints ========================================================================== */ -$micro : "only screen and (min-width: 30em)"; -$small : "only screen and (min-width: 37.5em)"; -$medium : "only screen and (min-width: 48em)"; -$large : "only screen and (min-width: 62em)"; -$x-large : "only screen and (min-width: 86.375em)"; +@include breakpoint-set("to ems", true); + +$micro : 480px; +$small : 600px; +$medium : 768px; +$large : 992px; +$x-large : 1382px; \ No newline at end of file diff --git a/_assets/css/main.scss b/_assets/css/main.scss index 71dc51e7..5724abf3 100644 --- a/_assets/css/main.scss +++ b/_assets/css/main.scss @@ -1,13 +1,13 @@ /* + * Minimal Mistakes Jekyll Theme * - * Minimal Mistakes - * - * Designer: Michael Rose - * Twitter: http://twitter.com/mmistakes + * - Michael Rose + * - mademistakes.com + * - https://twitter.com/mmistakes * */ -// Partials +@import "vendor/breakpoint/breakpoint"; // media query mixins @import "variables"; @import "grid"; @import "mixins"; @@ -15,7 +15,6 @@ @import "site"; @import "typography"; @import "syntax"; -@import "coderay"; @import "elements"; @import "forms"; @import "page"; diff --git a/_assets/css/vendor/breakpoint/_breakpoint.scss b/_assets/css/vendor/breakpoint/_breakpoint.scss new file mode 100755 index 00000000..a0528eb8 --- /dev/null +++ b/_assets/css/vendor/breakpoint/_breakpoint.scss @@ -0,0 +1,114 @@ +////////////////////////////// +// Default Variables +////////////////////////////// +$Breakpoint-Settings: ( + 'default media': all, + 'default feature': min-width, + 'default pair': width, + + 'force all media type': false, + 'to ems': false, + 'transform resolutions': true, + + 'no queries': false, + 'no query fallbacks': false, + + 'base font size': 16px, + + 'legacy syntax': false +); + +$breakpoint: () !default; + +////////////////////////////// +// Imports +////////////////////////////// +@import "settings"; +@import "context"; +@import "helpers"; +@import "parsers"; +@import "no-query"; + +@import "respond-to"; + +@import "legacy-settings"; + +////////////////////////////// +// Breakpoint Mixin +////////////////////////////// + +@mixin breakpoint($query, $no-query: false) { + @include legacy-settings-warning; + + // Reset contexts + @include private-breakpoint-reset-contexts(); + + $breakpoint: breakpoint($query, false); + + $query-string: map-get($breakpoint, 'query'); + $query-fallback: map-get($breakpoint, 'fallback'); + + $private-breakpoint-context-holder: map-get($breakpoint, 'context holder') !global; + $private-breakpoint-query-count: map-get($breakpoint, 'query count') !global; + + // Allow for an as-needed override or usage of no query fallback. + @if $no-query != false { + $query-fallback: $no-query; + } + + @if $query-fallback != false { + $context-setter: private-breakpoint-set-context('no-query', $query-fallback); + } + + // Print Out Query String + @if not breakpoint-get('no queries') { + @media #{$query-string} { + @content; + } + } + + @if breakpoint-get('no query fallbacks') != false or breakpoint-get('no queries') == true { + + $type: type-of(breakpoint-get('no query fallbacks')); + $print: false; + + @if ($type == 'bool') { + $print: true; + } + @else if ($type == 'string') { + @if $query-fallback == breakpoint-get('no query fallbacks') { + $print: true; + } + } + @else if ($type == 'list') { + @each $wrapper in breakpoint-get('no query fallbacks') { + @if $query-fallback == $wrapper { + $print: true; + } + } + } + + // Write Fallback + @if ($query-fallback != false) and ($print == true) { + $type-fallback: type-of($query-fallback); + + @if ($type-fallback != 'bool') { + #{$query-fallback} & { + @content; + } + } + @else { + @content; + } + } + } + + @include private-breakpoint-reset-contexts(); +} + + +@mixin mq($query, $no-query: false) { + @include breakpoint($query, $no-query) { + @content; + } +} diff --git a/_assets/css/vendor/breakpoint/_context.scss b/_assets/css/vendor/breakpoint/_context.scss new file mode 100755 index 00000000..57947f5c --- /dev/null +++ b/_assets/css/vendor/breakpoint/_context.scss @@ -0,0 +1,95 @@ +////////////////////////////// +// Private Breakpoint Variables +////////////////////////////// +$private-breakpoint-context-holder: (); +$private-breakpoint-query-count: 0 !default; + +////////////////////////////// +// Breakpoint Has Context +// Returns whether or not you are inside a Breakpoint query +////////////////////////////// +@function breakpoint-has-context() { + @if length($private-breakpoint-query-count) { + @return true; + } + @else { + @return false; + } +} + +////////////////////////////// +// Breakpoint Get Context +// $feature: Input feature to get it's current MQ context. Returns false if no context +////////////////////////////// +@function breakpoint-get-context($feature) { + @if map-has-key($private-breakpoint-context-holder, $feature) { + $get: map-get($private-breakpoint-context-holder, $feature); + // Special handling of no-query from get side so /false/ prepends aren't returned + @if $feature == 'no-query' { + @if type-of($get) == 'list' and length($get) > 1 and nth($get, 1) == false { + $get: nth($get, length($get)); + } + } + @return $get; + } + @else { + @if breakpoint-has-context() and $feature == 'media' { + @return breakpoint-get('default media'); + } + @else { + @return false; + } + } +} + +////////////////////////////// +// Private function to set context +////////////////////////////// +@function private-breakpoint-set-context($feature, $value) { + @if $value == 'monochrome' { + $feature: 'monochrome'; + } + + $current: map-get($private-breakpoint-context-holder, $feature); + @if $current and length($current) == $private-breakpoint-query-count { + @warn "You have already queried against `#{$feature}`. Unexpected things may happen if you query against the same feature more than once in the same `and` query. Breakpoint is overwriting the current context with `#{$value}`"; + } + + @if not map-has-key($private-breakpoint-context-holder, $feature) { + $v-holder: (); + @for $i from 1 to $private-breakpoint-query-count { + @if $feature == 'media' { + $v-holder: append($v-holder, breakpoint-get('default media')); + } + @else { + $v-holder: append($v-holder, false); + } + } + $v-holder: append($v-holder, $value); + $private-breakpoint-context-holder: map-merge($private-breakpoint-context-holder, ($feature: $v-holder)) !global; + } + @else { + $v-holder: map-get($private-breakpoint-context-holder, $feature); + $length: length($v-holder); + @for $i from $length to $private-breakpoint-query-count - 1 { + @if $feature == 'media' { + $v-holder: append($v-holder, breakpoint-get('default media')); + } + @else { + $v-holder: append($v-holder, false); + } + } + $v-holder: append($v-holder, $value); + $private-breakpoint-context-holder: map-merge($private-breakpoint-context-holder, ($feature: $v-holder)) !global; + } + + @return true; +} + +////////////////////////////// +// Private function to reset context +////////////////////////////// +@mixin private-breakpoint-reset-contexts { + $private-breakpoint-context-holder: () !global; + $private-breakpoint-query-count: 0 !global; +} \ No newline at end of file diff --git a/_assets/css/vendor/breakpoint/_helpers.scss b/_assets/css/vendor/breakpoint/_helpers.scss new file mode 100755 index 00000000..97e522d1 --- /dev/null +++ b/_assets/css/vendor/breakpoint/_helpers.scss @@ -0,0 +1,151 @@ +////////////////////////////// +// Converts the input value to Base EMs +////////////////////////////// +@function breakpoint-to-base-em($value) { + $value-unit: unit($value); + + // Will convert relative EMs into root EMs. + @if breakpoint-get('base font size') and type-of(breakpoint-get('base font size')) == 'number' and $value-unit == 'em' { + $base-unit: unit(breakpoint-get('base font size')); + + @if $base-unit == 'px' or $base-unit == '%' or $base-unit == 'em' or $base-unit == 'pt' { + @return base-conversion($value) / base-conversion(breakpoint-get('base font size')) * 1em; + } + @else { + @warn '#{breakpoint-get(\'base font size\')} is not set in valid units for font size!'; + @return false; + } + } + @else { + @return base-conversion($value); + } +} + +@function base-conversion($value) { + $unit: unit($value); + + @if $unit == 'px' { + @return $value / 16px * 1em; + } + @else if $unit == '%' { + @return $value / 100% * 1em; + } + @else if $unit == 'em' { + @return $value; + } + @else if $unit == 'pt' { + @return $value / 12pt * 1em; + } + @else { + @return $value; +// @warn 'Everything is terrible! What have you done?!'; + } +} + +////////////////////////////// +// Returns whether the feature can have a min/max pair +////////////////////////////// +$breakpoint-min-max-features: 'color', + 'color-index', + 'aspect-ratio', + 'device-aspect-ratio', + 'device-height', + 'device-width', + 'height', + 'monochrome', + 'resolution', + 'width'; + +@function breakpoint-min-max($feature) { + @each $item in $breakpoint-min-max-features { + @if $feature == $item { + @return true; + } + } + @return false; +} + +////////////////////////////// +// Returns whether the feature can have a string value +////////////////////////////// +$breakpoint-string-features: 'orientation', + 'scan', + 'color', + 'aspect-ratio', + 'device-aspect-ratio', + 'pointer', + 'luminosity'; + +@function breakpoint-string-value($feature) { + @each $item in $breakpoint-string-features { + @if breakpoint-min-max($item) { + @if $feature == 'min-#{$item}' or $feature == 'max-#{$item}' { + @return true; + } + } + @else if $feature == $item { + @return true; + } + } + @return false; +} + +////////////////////////////// +// Returns whether the feature is a media type +////////////////////////////// +$breakpoint-media-types: 'all', + 'braille', + 'embossed', + 'handheld', + 'print', + 'projection', + 'screen', + 'speech', + 'tty', + 'tv'; + +@function breakpoint-is-media($feature) { + @each $media in $breakpoint-media-types { + @if ($feature == $media) or ($feature == 'not #{$media}') or ($feature == 'only #{$media}') { + @return true; + } + } + + @return false; +} + +////////////////////////////// +// Returns whether the feature can stand alone +////////////////////////////// +$breakpoint-single-string-features: 'color', + 'color-index', + 'grid', + 'monochrome'; + +@function breakpoint-single-string($feature) { + @each $item in $breakpoint-single-string-features { + @if $feature == $item { + @return true; + } + } + @return false; +} + +////////////////////////////// +// Returns whether the feature +////////////////////////////// +@function breakpoint-is-resolution($feature) { + $resolutions: 'device-pixel-ratio', 'dpr'; + + @if breakpoint-get('transform resolutions') { + $resolutions: append($resolutions, 'resolution'); + } + + @each $reso in $resolutions { + @if index($feature, $reso) or index($feature, 'min-#{$reso}') or index($feature, 'max-#{$reso}') { + @return true; + } + } + + @return false; +} diff --git a/_assets/css/vendor/breakpoint/_legacy-settings.scss b/_assets/css/vendor/breakpoint/_legacy-settings.scss new file mode 100755 index 00000000..e060ebe3 --- /dev/null +++ b/_assets/css/vendor/breakpoint/_legacy-settings.scss @@ -0,0 +1,50 @@ +@mixin legacy-settings-warning { + $legacyVars: ( + 'default-media': 'default media', + 'default-feature': 'default feature', + 'force-media-all': 'force all media type', + 'to-ems': 'to ems', + 'resolutions': 'transform resolutions', + 'no-queries': 'no queries', + 'no-query-fallbacks': 'no query fallbacks', + 'base-font-size': 'base font size', + 'legacy-syntax': 'legacy syntax' + ); + + @each $legacy, $new in $legacyVars { + @if global-variable-exists('breakpoint-' + $legacy) { + @warn "In order to avoid variable namspace collisions, we have updated the way to change settings for Breakpoint. Please change all instances of `$breakpoint-#{$legacy}: {{setting}}` to `@include breakpoint-set('#{$new}', {{setting}})`. Variable settings, as well as this warning will be deprecated in a future release." + } + }; + + ////////////////////////////// + // Hand correct each setting + ////////////////////////////// + @if global-variable-exists('breakpoint-default-media') and $breakpoint-default-media != breakpoint-get('default media') { + @include breakpoint-set('default media', $breakpoint-default-media); + } + @if global-variable-exists('breakpoint-default-feature') and $breakpoint-default-feature != breakpoint-get('default feature') { + @include breakpoint-set('default feature', $breakpoint-default-feature); + } + @if global-variable-exists('breakpoint-force-media-all') and $breakpoint-force-media-all != breakpoint-get('force all media type') { + @include breakpoint-set('force all media type', $breakpoint-force-media-all); + } + @if global-variable-exists('breakpoint-to-ems') and $breakpoint-to-ems != breakpoint-get('to ems') { + @include breakpoint-set('to ems', $breakpoint-to-ems); + } + @if global-variable-exists('breakpoint-resolutions') and $breakpoint-resolutions != breakpoint-get('transform resolutions') { + @include breakpoint-set('transform resolutions', $breakpoint-resolutions); + } + @if global-variable-exists('breakpoint-no-queries') and $breakpoint-no-queries != breakpoint-get('no queries') { + @include breakpoint-set('no queries', $breakpoint-no-queries); + } + @if global-variable-exists('breakpoint-no-query-fallbacks') and $breakpoint-no-query-fallbacks != breakpoint-get('no query fallbacks') { + @include breakpoint-set('no query fallbacks', $breakpoint-no-query-fallbacks); + } + @if global-variable-exists('breakpoint-base-font-size') and $breakpoint-base-font-size != breakpoint-get('base font size') { + @include breakpoint-set('base font size', $breakpoint-base-font-size); + } + @if global-variable-exists('breakpoint-legacy-syntax') and $breakpoint-legacy-syntax != breakpoint-get('legacy syntax') { + @include breakpoint-set('legacy syntax', $breakpoint-legacy-syntax); + } +} \ No newline at end of file diff --git a/_assets/css/vendor/breakpoint/_no-query.scss b/_assets/css/vendor/breakpoint/_no-query.scss new file mode 100755 index 00000000..0b5a81f6 --- /dev/null +++ b/_assets/css/vendor/breakpoint/_no-query.scss @@ -0,0 +1,15 @@ +@function breakpoint-no-query($query) { + @if type-of($query) == 'list' { + $keyword: nth($query, 1); + + @if type-of($keyword) == 'string' and ($keyword == 'no-query' or $keyword == 'no query' or $keyword == 'fallback') { + @return nth($query, 2); + } + @else { + @return false; + } + } + @else { + @return false; + } +} diff --git a/_assets/css/vendor/breakpoint/_parsers.scss b/_assets/css/vendor/breakpoint/_parsers.scss new file mode 100755 index 00000000..f0b053fe --- /dev/null +++ b/_assets/css/vendor/breakpoint/_parsers.scss @@ -0,0 +1,215 @@ +////////////////////////////// +// Import Parser Pieces +////////////////////////////// +@import "parsers/query"; +@import "parsers/single"; +@import "parsers/double"; +@import "parsers/triple"; +@import "parsers/resolution"; + +$Memo-Exists: function-exists(memo-get) and function-exists(memo-set); + +////////////////////////////// +// Breakpoint Function +////////////////////////////// +@function breakpoint($query, $contexts...) { + $run: true; + $return: (); + + // Grab the Memo Output if Memoization can be a thing + @if $Memo-Exists { + $return: memo-get(breakpoint, breakpoint $query $contexts); + + @if $return != null { + $run: false; + } + } + + @if not $Memo-Exists or $run { + // Internal Variables + $query-string: ''; + $query-fallback: false; + $return: (); + + // Reserve Global Private Breakpoint Context + $holder-context: $private-breakpoint-context-holder; + $holder-query-count: $private-breakpoint-query-count; + + // Reset Global Private Breakpoint Context + $private-breakpoint-context-holder: () !global; + $private-breakpoint-query-count: 0 !global; + + + // Test to see if it's a comma-separated list + $or-list: if(list-separator($query) == 'comma', true, false); + + + @if ($or-list == false and breakpoint-get('legacy syntax') == false) { + $query-string: breakpoint-parse($query); + } + @else { + $length: length($query); + + $last: nth($query, $length); + $query-fallback: breakpoint-no-query($last); + + @if ($query-fallback != false) { + $length: $length - 1; + } + + @if (breakpoint-get('legacy syntax') == true) { + $mq: (); + + @for $i from 1 through $length { + $mq: append($mq, nth($query, $i), comma); + } + + $query-string: breakpoint-parse($mq); + } + @else { + $query-string: ''; + @for $i from 1 through $length { + $query-string: $query-string + if($i == 1, '', ', ') + breakpoint-parse(nth($query, $i)); + } + } + } + + $return: ('query': $query-string, + 'fallback': $query-fallback, + 'context holder': $private-breakpoint-context-holder, + 'query count': $private-breakpoint-query-count + ); + @if length($contexts) > 0 and nth($contexts, 1) != false { + @if $query-fallback != false { + $context-setter: private-breakpoint-set-context('no-query', $query-fallback); + } + $context-map: (); + @each $context in $contexts { + $context-map: map-merge($context-map, ($context: breakpoint-get-context($context))); + } + $return: map-merge($return, (context: $context-map)); + } + + // Reset Global Private Breakpoint Context + $private-breakpoint-context-holder: () !global; + $private-breakpoint-query-count: 0 !global; + + @if $Memo-Exists { + $holder: memo-set(breakpoint, breakpoint $query $contexts, $return); + } + } + + @return $return; +} + +////////////////////////////// +// General Breakpoint Parser +////////////////////////////// +@function breakpoint-parse($query) { + // Increase number of 'and' queries + $private-breakpoint-query-count: $private-breakpoint-query-count + 1 !global; + + // Set up Media Type + $query-print: ''; + + $force-all: ((breakpoint-get('force all media type') == true) and (breakpoint-get('default media') == 'all')); + $empty-media: true; + @if ($force-all == true) or (breakpoint-get('default media') != 'all') { + // Force the print of the default media type if (force all is true and default media type is all) or (default media type is not all) + $query-print: breakpoint-get('default media'); + $empty-media: false; + } + + + $query-resolution: false; + + $query-holder: breakpoint-parse-query($query); + + + + // Loop over each parsed out query and write it to $query-print + $first: true; + + @each $feature in $query-holder { + $length: length($feature); + + // Parse a single feature + @if ($length == 1) { + // Feature is currently a list, grab the actual value + $feature: nth($feature, 1); + + // Media Type must by convention be the first item, so it's safe to flat override $query-print, which right now should only be the default media type + @if (breakpoint-is-media($feature)) { + @if ($force-all == true) or ($feature != 'all') { + // Force the print of the default media type if (force all is true and default media type is all) or (default media type is not all) + $query-print: $feature; + $empty-media: false; + + // Set Context + $context-setter: private-breakpoint-set-context(media, $query-print); + } + } + @else { + $parsed: breakpoint-parse-single($feature, $empty-media, $first); + $query-print: '#{$query-print} #{$parsed}'; + $first: false; + } + } + // Parse a double feature + @else if ($length == 2) { + @if (breakpoint-is-resolution($feature) != false) { + $query-resolution: $feature; + } + @else { + $parsed: null; + // If it's a string/number pair, + // we check to see if one is a single-string value, + // then we parse it as a normal double + $alpha: nth($feature, 1); + $beta: nth($feature, 2); + @if breakpoint-single-string($alpha) or breakpoint-single-string($beta) { + $parsed: breakpoint-parse-single($alpha, $empty-media, $first); + $query-print: '#{$query-print} #{$parsed}'; + $first: false; + $parsed: breakpoint-parse-single($beta, $empty-media, $first); + $query-print: '#{$query-print} #{$parsed}'; + } + @else { + $parsed: breakpoint-parse-double($feature, $empty-media, $first); + $query-print: '#{$query-print} #{$parsed}'; + $first: false; + } + } + } + // Parse a triple feature + @else if ($length == 3) { + $parsed: breakpoint-parse-triple($feature, $empty-media, $first); + $query-print: '#{$query-print} #{$parsed}'; + $first: false; + } + + } + + @if ($query-resolution != false) { + $query-print: breakpoint-build-resolution($query-print, $query-resolution, $empty-media, $first); + } + + // Loop through each feature that's been detected so far and append 'false' to the the value list to increment their counters + @each $f, $v in $private-breakpoint-context-holder { + $v-holder: $v; + $length: length($v-holder); + @if length($v-holder) < $private-breakpoint-query-count { + @for $i from $length to $private-breakpoint-query-count { + @if $f == 'media' { + $v-holder: append($v-holder, breakpoint-get('default media')); + } + @else { + $v-holder: append($v-holder, false); + } + } + } + $private-breakpoint-context-holder: map-merge($private-breakpoint-context-holder, ($f: $v-holder)) !global; + } + + @return $query-print; +} diff --git a/_assets/css/vendor/breakpoint/_respond-to.scss b/_assets/css/vendor/breakpoint/_respond-to.scss new file mode 100755 index 00000000..e2462c5f --- /dev/null +++ b/_assets/css/vendor/breakpoint/_respond-to.scss @@ -0,0 +1,82 @@ +//////////////////////// +// Default the Breakpoints variable +//////////////////////// +$breakpoints: () !default; +$BREAKPOINTS: () !default; + +//////////////////////// +// Respond-to API Mixin +//////////////////////// +@mixin respond-to($context, $no-query: false) { + @if length($breakpoints) > 0 and length($BREAKPOINTS) == 0 { + @warn "In order to avoid variable namespace collisions, we have updated the way to add breakpoints for respond-to. Please change all instances of `$breakpoints: add-breakpoint()` to `@include add-breakpoint()`. The `add-breakpoint()` function will be deprecated in a future release."; + $BREAKPOINTS: $breakpoints !global; + $breakpoints: () !global; + } + + @if type-of($BREAKPOINTS) != 'map' { + // Just in case someone writes gibberish to the $breakpoints variable. + @warn "Your breakpoints aren't a map! `respond-to` expects a map. Please check the value of $BREAKPOINTS variable."; + @content; + } + @else if map-has-key($BREAKPOINTS, $context) { + @include breakpoint(map-get($BREAKPOINTS, $context), $no-query) { + @content; + } + } + @else if not map-has-key($BREAKPOINTS, $context) { + @warn "`#{$context}` isn't a defined breakpoint! Please add it using `$breakpoints: add-breakpoint(`#{$context}`, $value);`"; + @content; + } + @else { + @warn "You haven't created any breakpoints yet! Make some already! `@include add-breakpoint($name, $bkpt)`"; + @content; + } +} + +////////////////////////////// +// Add Breakpoint to Breakpoints +// TODO: Remove function in next release +////////////////////////////// +@function add-breakpoint($name, $bkpt, $overwrite: false) { + $output: ($name: $bkpt); + + @if length($breakpoints) == 0 { + @return $output; + } + @else { + @if map-has-key($breakpoints, $name) and $overwrite != true { + @warn "You already have a breakpoint named `#{$name}`, please choose another breakpoint name, or pass in `$overwrite: true` to overwrite the previous breakpoint."; + @return $breakpoints; + } + @else if not map-has-key($breakpoints, $name) or $overwrite == true { + @return map-merge($breakpoints, $output); + } + } +} + +@mixin add-breakpoint($name, $bkpt, $overwrite: false) { + $output: ($name: $bkpt); + + @if length($BREAKPOINTS) == 0 { + $BREAKPOINTS: $output !global; + } + @else { + @if map-has-key($BREAKPOINTS, $name) and $overwrite != true { + @warn "You already have a breakpoint named `#{$name}`, please choose another breakpoint name, or pass in `$overwrite: true` to overwrite the previous breakpoint."; + $BREAKPOINTS: $BREAKPOINTS !global; + } + @else if not map-has-key($BREAKPOINTS, $name) or $overwrite == true { + $BREAKPOINTS: map-merge($BREAKPOINTS, $output) !global; + } + } +} + +@function get-breakpoint($name: false) { + @if $name == false { + @return $BREAKPOINTS; + } + @else { + @return map-get($BREAKPOINTS, $name); + } +} diff --git a/_assets/css/vendor/breakpoint/_settings.scss b/_assets/css/vendor/breakpoint/_settings.scss new file mode 100755 index 00000000..05ee6894 --- /dev/null +++ b/_assets/css/vendor/breakpoint/_settings.scss @@ -0,0 +1,71 @@ +////////////////////////////// +// Has Setting +////////////////////////////// +@function breakpoint-has($setting) { + @if map-has-key($breakpoint, $setting) { + @return true; + } + @else { + @return false; + } +} + +////////////////////////////// +// Get Settings +////////////////////////////// +@function breakpoint-get($setting) { + @if breakpoint-has($setting) { + @return map-get($breakpoint, $setting); + } + @else { + @return map-get($Breakpoint-Settings, $setting); + } +} + +////////////////////////////// +// Set Settings +////////////////////////////// +@function breakpoint-set($setting, $value) { + @if (str-index($setting, '-') or str-index($setting, '_')) and str-index($setting, ' ') == null { + @warn "Words in Breakpoint settings should be separated by spaces, not dashes or underscores. Please replace dashes and underscores between words with spaces. Settings will not work as expected until changed."; + } + $breakpoint: map-merge($breakpoint, ($setting: $value)) !global; + @return true; +} + +@mixin breakpoint-change($setting, $value) { + $breakpoint-change: breakpoint-set($setting, $value); +} + +@mixin breakpoint-set($setting, $value) { + @include breakpoint-change($setting, $value); +} + +@mixin bkpt-change($setting, $value) { + @include breakpoint-change($setting, $value); +} +@mixin bkpt-set($setting, $value) { + @include breakpoint-change($setting, $value); +} + +////////////////////////////// +// Remove Setting +////////////////////////////// +@function breakpoint-reset($settings...) { + @if length($settings) == 1 { + $settings: nth($settings, 1); + } + + @each $setting in $settings { + $breakpoint: map-remove($breakpoint, $setting) !global; + } + @return true; +} + +@mixin breakpoint-reset($settings...) { + $breakpoint-reset: breakpoint-reset($settings); +} + +@mixin bkpt-reset($settings...) { + $breakpoint-reset: breakpoint-reset($settings); +} \ No newline at end of file diff --git a/_assets/css/vendor/breakpoint/parsers/_double.scss b/_assets/css/vendor/breakpoint/parsers/_double.scss new file mode 100755 index 00000000..24580c15 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/_double.scss @@ -0,0 +1,33 @@ +////////////////////////////// +// Import Pieces +////////////////////////////// +@import "double/default-pair"; +@import "double/double-string"; +@import "double/default"; + +@function breakpoint-parse-double($feature, $empty-media, $first) { + $parsed: ''; + $leader: ''; + // If we're forcing + @if not ($empty-media) or not ($first) { + $leader: 'and '; + } + + $first: nth($feature, 1); + $second: nth($feature, 2); + + // If we've got two numbers, we know we need to use the default pair because there are no media queries that has a media feature that is a number + @if type-of($first) == 'number' and type-of($second) == 'number' { + $parsed: breakpoint-parse-default-pair($first, $second); + } + // If they are both strings, we send it through the string parser + @else if type-of($first) == 'string' and type-of($second) == 'string' { + $parsed: breakpoint-parse-double-string($first, $second); + } + // If it's a string/number pair, we parse it as a normal double + @else { + $parsed: breakpoint-parse-double-default($first, $second); + } + + @return $leader + $parsed; +} diff --git a/_assets/css/vendor/breakpoint/parsers/_query.scss b/_assets/css/vendor/breakpoint/parsers/_query.scss new file mode 100755 index 00000000..b138b393 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/_query.scss @@ -0,0 +1,82 @@ +@function breakpoint-parse-query($query) { + // Parse features out of an individual query + $feature-holder: (); + $query-holder: (); + $length: length($query); + + @if $length == 2 { + // If we've got a string/number, number/string, check to see if it's a valid string/number pair or two singles + @if (type-of(nth($query, 1)) == 'string' and type-of(nth($query, 2)) == 'number') or (type-of(nth($query, 1)) == 'number' and type-of(nth($query, 2)) == 'string') { + + $number: ''; + $value: ''; + + @if type-of(nth($query, 1)) == 'string' { + $number: nth($query, 2); + $value: nth($query, 1); + } + @else { + $number: nth($query, 1); + $value: nth($query, 2); + } + + // If the string value can be a single value, check to see if the number passed in is a valid input for said single value. Fortunately, all current single-value options only accept unitless numbers, so this check is easy. + @if breakpoint-single-string($value) { + @if unitless($number) { + $feature-holder: append($value, $number, space); + $query-holder: append($query-holder, $feature-holder, comma); + @return $query-holder; + } + } + // If the string is a media type, split the query + @if breakpoint-is-media($value) { + $query-holder: append($query-holder, nth($query, 1)); + $query-holder: append($query-holder, nth($query, 2)); + @return $query-holder; + } + // If it's not a single feature, we're just going to assume it's a proper string/value pair, and roll with it. + @else { + $feature-holder: append($value, $number, space); + $query-holder: append($query-holder, $feature-holder, comma); + @return $query-holder; + } + + } + // If they're both numbers, we assume it's a double and roll with that + @else if (type-of(nth($query, 1)) == 'number' and type-of(nth($query, 2)) == 'number') { + $feature-holder: append(nth($query, 1), nth($query, 2), space); + $query-holder: append($query-holder, $feature-holder, comma); + @return $query-holder; + } + // If they're both strings and neither are singles, we roll with that. + @else if (type-of(nth($query, 1)) == 'string' and type-of(nth($query, 2)) == 'string') { + @if not breakpoint-single-string(nth($query, 1)) and not breakpoint-single-string(nth($query, 2)) { + $feature-holder: append(nth($query, 1), nth($query, 2), space); + $query-holder: append($query-holder, $feature-holder, comma); + @return $query-holder; + } + } + } + @else if $length == 3 { + // If we've got three items and none is a list, we check to see + @if type-of(nth($query, 1)) != 'list' and type-of(nth($query, 2)) != 'list' and type-of(nth($query, 3)) != 'list' { + // If none of the items are single string values and none of the values are media values, we're good. + @if (not breakpoint-single-string(nth($query, 1)) and not breakpoint-single-string(nth($query, 2)) and not breakpoint-single-string(nth($query, 3))) and ((not breakpoint-is-media(nth($query, 1)) and not breakpoint-is-media(nth($query, 2)) and not breakpoint-is-media(nth($query, 3)))) { + $feature-holder: append(nth($query, 1), nth($query, 2), space); + $feature-holder: append($feature-holder, nth($query, 3), space); + $query-holder: append($query-holder, $feature-holder, comma); + @return $query-holder; + } + // let's check to see if the first item is a media type + @else if breakpoint-is-media(nth($query, 1)) { + $query-holder: append($query-holder, nth($query, 1)); + $feature-holder: append(nth($query, 2), nth($query, 3), space); + $query-holder: append($query-holder, $feature-holder); + @return $query-holder; + } + } + } + + // If it's a single item, or if it's not a special case double or triple, we can simply return the query. + @return $query; +} diff --git a/_assets/css/vendor/breakpoint/parsers/_resolution.scss b/_assets/css/vendor/breakpoint/parsers/_resolution.scss new file mode 100755 index 00000000..19769adf --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/_resolution.scss @@ -0,0 +1,31 @@ +@import "resolution/resolution"; + +@function breakpoint-build-resolution($query-print, $query-resolution, $empty-media, $first) { + $leader: ''; + // If we're forcing + @if not ($empty-media) or not ($first) { + $leader: 'and '; + } + + @if breakpoint-get('transform resolutions') and $query-resolution { + $resolutions: breakpoint-make-resolutions($query-resolution); + $length: length($resolutions); + $query-holder: ''; + + @for $i from 1 through $length { + $query: '#{$query-print} #{$leader}#{nth($resolutions, $i)}'; + @if $i == 1 { + $query-holder: $query; + } + @else { + $query-holder: '#{$query-holder}, #{$query}'; + } + } + + @return $query-holder; + } + @else { + // Return with attached resolution + @return $query-print; + } +} diff --git a/_assets/css/vendor/breakpoint/parsers/_single.scss b/_assets/css/vendor/breakpoint/parsers/_single.scss new file mode 100755 index 00000000..d9fd764a --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/_single.scss @@ -0,0 +1,26 @@ +////////////////////////////// +// Import Pieces +////////////////////////////// +@import "single/default"; + +@function breakpoint-parse-single($feature, $empty-media, $first) { + $parsed: ''; + $leader: ''; + // If we're forcing + @if not ($empty-media) or not ($first) { + $leader: 'and '; + } + + // If it's a single feature that can stand alone, we let it + @if (breakpoint-single-string($feature)) { + $parsed: $feature; + // Set Context + $context-setter: private-breakpoint-set-context($feature, $feature); + } + // If it's not a stand alone feature, we pass it off to the default handler. + @else { + $parsed: breakpoint-parse-default($feature); + } + + @return $leader + '(' + $parsed + ')'; +} diff --git a/_assets/css/vendor/breakpoint/parsers/_triple.scss b/_assets/css/vendor/breakpoint/parsers/_triple.scss new file mode 100755 index 00000000..e2732067 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/_triple.scss @@ -0,0 +1,36 @@ +////////////////////////////// +// Import Pieces +////////////////////////////// +@import "triple/default"; + +@function breakpoint-parse-triple($feature, $empty-media, $first) { + $parsed: ''; + $leader: ''; + + // If we're forcing + @if not ($empty-media) or not ($first) { + $leader: 'and '; + } + + // separate the string features from the value numbers + $string: null; + $numbers: null; + @each $val in $feature { + @if type-of($val) == string { + $string: $val; + } + @else { + @if type-of($numbers) == 'null' { + $numbers: $val; + } + @else { + $numbers: append($numbers, $val); + } + } + } + + $parsed: breakpoint-parse-triple-default($string, nth($numbers, 1), nth($numbers, 2)); + + @return $leader + $parsed; + +} diff --git a/_assets/css/vendor/breakpoint/parsers/double/_default-pair.scss b/_assets/css/vendor/breakpoint/parsers/double/_default-pair.scss new file mode 100755 index 00000000..f88432cc --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/double/_default-pair.scss @@ -0,0 +1,21 @@ +@function breakpoint-parse-default-pair($first, $second) { + $default: breakpoint-get('default pair'); + $min: ''; + $max: ''; + + // Sort into min and max + $min: min($first, $second); + $max: max($first, $second); + + // Set Context + $context-setter: private-breakpoint-set-context(min-#{$default}, $min); + $context-setter: private-breakpoint-set-context(max-#{$default}, $max); + + // Make them EMs if need be + @if (breakpoint-get('to ems') == true) { + $min: breakpoint-to-base-em($min); + $max: breakpoint-to-base-em($max); + } + + @return '(min-#{$default}: #{$min}) and (max-#{$default}: #{$max})'; +} diff --git a/_assets/css/vendor/breakpoint/parsers/double/_default.scss b/_assets/css/vendor/breakpoint/parsers/double/_default.scss new file mode 100755 index 00000000..73190ed5 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/double/_default.scss @@ -0,0 +1,22 @@ +@function breakpoint-parse-double-default($first, $second) { + $feature: ''; + $value: ''; + + @if type-of($first) == 'string' { + $feature: $first; + $value: $second; + } + @else { + $feature: $second; + $value: $first; + } + + // Set Context + $context-setter: private-breakpoint-set-context($feature, $value); + + @if (breakpoint-get('to ems') == true) { + $value: breakpoint-to-base-em($value); + } + + @return '(#{$feature}: #{$value})' +} diff --git a/_assets/css/vendor/breakpoint/parsers/double/_double-string.scss b/_assets/css/vendor/breakpoint/parsers/double/_double-string.scss new file mode 100755 index 00000000..c6fd0cb0 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/double/_double-string.scss @@ -0,0 +1,22 @@ +@function breakpoint-parse-double-string($first, $second) { + $feature: ''; + $value: ''; + + // Test to see which is the feature and which is the value + @if (breakpoint-string-value($first) == true) { + $feature: $first; + $value: $second; + } + @else if (breakpoint-string-value($second) == true) { + $feature: $second; + $value: $first; + } + @else { + @warn "Neither #{$first} nor #{$second} is a valid media query name."; + } + + // Set Context + $context-setter: private-breakpoint-set-context($feature, $value); + + @return '(#{$feature}: #{$value})'; +} \ No newline at end of file diff --git a/_assets/css/vendor/breakpoint/parsers/resolution/_resolution.scss b/_assets/css/vendor/breakpoint/parsers/resolution/_resolution.scss new file mode 100755 index 00000000..36804212 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/resolution/_resolution.scss @@ -0,0 +1,60 @@ +@function breakpoint-make-resolutions($resolution) { + $length: length($resolution); + + $output: (); + + @if $length == 2 { + $feature: ''; + $value: ''; + + // Find which is number + @if type-of(nth($resolution, 1)) == 'number' { + $value: nth($resolution, 1); + } + @else { + $value: nth($resolution, 2); + } + + // Determine min/max/standard + @if index($resolution, 'min-resolution') { + $feature: 'min-'; + } + @else if index($resolution, 'max-resolution') { + $feature: 'max-'; + } + + $standard: '(#{$feature}resolution: #{$value})'; + + // If we're not dealing with dppx, + @if unit($value) != 'dppx' { + $base: 96dpi; + @if unit($value) == 'dpcm' { + $base: 243.84dpcm; + } + // Write out feature tests + $webkit: ''; + $moz: ''; + $webkit: '(-webkit-#{$feature}device-pixel-ratio: #{$value / $base})'; + $moz: '(#{$feature}-moz-device-pixel-ratio: #{$value / $base})'; + // Append to output + $output: append($output, $standard, space); + $output: append($output, $webkit, space); + $output: append($output, $moz, space); + } + @else { + $webkit: ''; + $moz: ''; + $webkit: '(-webkit-#{$feature}device-pixel-ratio: #{$value / 1dppx})'; + $moz: '(#{$feature}-moz-device-pixel-ratio: #{$value / 1dppx})'; + $fallback: '(#{$feature}resolution: #{$value / 1dppx * 96dpi})'; + // Append to output + $output: append($output, $standard, space); + $output: append($output, $webkit, space); + $output: append($output, $moz, space); + $output: append($output, $fallback, space); + } + + } + + @return $output; +} diff --git a/_assets/css/vendor/breakpoint/parsers/single/_default.scss b/_assets/css/vendor/breakpoint/parsers/single/_default.scss new file mode 100755 index 00000000..503ef427 --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/single/_default.scss @@ -0,0 +1,13 @@ +@function breakpoint-parse-default($feature) { + $default: breakpoint-get('default feature'); + + // Set Context + $context-setter: private-breakpoint-set-context($default, $feature); + + @if (breakpoint-get('to ems') == true) and (type-of($feature) == 'number') { + @return '#{$default}: #{breakpoint-to-base-em($feature)}'; + } + @else { + @return '#{$default}: #{$feature}'; + } +} diff --git a/_assets/css/vendor/breakpoint/parsers/triple/_default.scss b/_assets/css/vendor/breakpoint/parsers/triple/_default.scss new file mode 100755 index 00000000..7fa418dd --- /dev/null +++ b/_assets/css/vendor/breakpoint/parsers/triple/_default.scss @@ -0,0 +1,18 @@ +@function breakpoint-parse-triple-default($feature, $first, $second) { + + // Sort into min and max + $min: min($first, $second); + $max: max($first, $second); + + // Set Context + $context-setter: private-breakpoint-set-context(min-#{$feature}, $min); + $context-setter: private-breakpoint-set-context(max-#{$feature}, $max); + + // Make them EMs if need be + @if (breakpoint-get('to ems') == true) { + $min: breakpoint-to-base-em($min); + $max: breakpoint-to-base-em($max); + } + + @return '(min-#{$feature}: #{$min}) and (max-#{$feature}: #{$max})'; +} diff --git a/_assets/css/vendor/magnific-popup/_magnific-popup.scss b/_assets/css/vendor/magnific-popup/_magnific-popup.scss index ea1d732e..27b27bcc 100644 --- a/_assets/css/vendor/magnific-popup/_magnific-popup.scss +++ b/_assets/css/vendor/magnific-popup/_magnific-popup.scss @@ -292,7 +292,7 @@ button { font-style: normal; font-size: 28px; - font-family: $base-font; + font-family: $serif; &:hover, &:focus { diff --git a/_assets/css/vendor/magnific-popup/_settings.scss b/_assets/css/vendor/magnific-popup/_settings.scss index 1834a366..caaca026 100644 --- a/_assets/css/vendor/magnific-popup/_settings.scss +++ b/_assets/css/vendor/magnific-popup/_settings.scss @@ -40,7 +40,7 @@ $mfp-include-mobile-layout-for-image: true; // Removes pad // Image caption options $mfp-caption-title-color: #f3f3f3; // Caption title color $mfp-caption-subtitle-color: #bdbdbd; // Caption subtitle color -.mfp-counter { font-family: $base-font; } // Caption font family +.mfp-counter { font-family: $serif; } // Caption font family // A11y $mfp-use-visuallyhidden: false; diff --git a/assets/css/main.css b/assets/css/main.css index a6c24d06..5aa86867 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1,4 +1,4 @@ -/*! normalize.css v2.1.0 | MIT License | git.io/normalize */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{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}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;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;width:100%}::-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}.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}b,i,strong,em,blockquote,p,q,span,figure,img,h1,h2,header,input,a{transition:all 0.2s ease}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:#4e4e4e}a:hover{color:#1b1b1b}a:focus{outline:thin dotted;color:#343434}a:hover,a:active{outline:0}.image-caption{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;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}@media only screen and (min-width: 37.5em){.image-caption{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%}}@media only screen and (min-width: 86.375em){.image-caption{display:inline;float:left;width:70.83333%}}.image-caption a{color:#80807e}.notice{margin-top:1.5em;padding:.5em 1em;text-indent:0;font-size:14px;font-size:0.875rem;background-color:#fff;border:1px solid #ccc;border-radius:3px}blockquote{margin-left:-28px;padding-left:20px;border-left:8px solid #333332;font-family:"PT Serif",serif;font-style:italic}.footnotes ol,.footnotes li,.footnotes p{margin-bottom:0;font-size:14px;font-size:0.875rem}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;margin:0 2px;padding:0 5px;border:1px solid #f7f7f7;background-color:#efefef;border-radius:3px}pre{font-size:12px;font-size:0.75rem;line-height:1.5;overflow-x:auto}pre.highlight{padding:1em}.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:1.5;color:#333332;margin-bottom:1.5em;border-radius:4px}.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;border-radius:4px}.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:red}.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:#fff !important;background:blue !important}.CodeRay .annotation{color:#007}.CodeRay .attribute-name{color:#f08}.CodeRay .attribute-value{color:#700}.CodeRay .binary{color:#509;font-weight:bold}.CodeRay .comment{color:#998;font-style:italic}.CodeRay .char{color:#04D}.CodeRay .char .content{color:#04D}.CodeRay .char .delimiter{color:#039}.CodeRay .class{color:#458;font-weight:bold}.CodeRay .complex{color:#A08;font-weight:bold}.CodeRay .constant{color:teal}.CodeRay .color{color:#0A0}.CodeRay .class-variable{color:#369}.CodeRay .decorator{color:#B0B}.CodeRay .definition{color:#099;font-weight:bold}.CodeRay .directive{color:#088;font-weight:bold}.CodeRay .delimiter{color:black}.CodeRay .doc{color:#970}.CodeRay .doctype{color:#34b}.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:#FAA}.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:black}.CodeRay .inline .inline{background:#ccc}.CodeRay .inline .inline .inline{background:#bbb}.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:teal}.CodeRay .label{color:#970;font-weight:bold}.CodeRay .local-variable{color:#963}.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:#808}.CodeRay .regexp .delimiter{color:#404}.CodeRay .regexp .modifier{color:#C2C}.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:#D14}.CodeRay .shell .delimiter{color:#D14}.CodeRay .symbol{color:#990073}.CodeRay .symbol .content{color:#A60}.CodeRay .symbol .delimiter{color:#630}.CodeRay .tag{color:#070}.CodeRay .tag-special{color:#D70;font-weight:bold}.CodeRay .type{color:#339;font-weight:bold}.CodeRay .variable{color:#036}.CodeRay .insert{background:#afa}.CodeRay .delete{background:#faa}.CodeRay .change{color:#aaf;background:#007}.CodeRay .head{color:#f8f;background:#505}.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}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc;border-bottom:1px solid #fff}figure{margin-bottom:1.625rem}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:"";line-height:0}.half:after{clear:both}@media only screen and (min-width: 30em){.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:"";line-height:0}.third:after{clear:both}@media only screen and (min-width: 30em){.third img{display:inline;float:left;width:33.33333%}.third figcaption{display:inline;float:left;width:100%}}.btn,#goog-wm-sb{display:inline-block;margin-bottom:20px;padding:8px 20px;font-size:14px;font-size:0.875rem;font-family:"PT Sans Narrow",sans-serif;font-weight:700;background-color:#111;color:#fff;border-width:2px !important;border-style:solid !important;border-color:#111;text-decoration:none !important;border-radius:3px}.btn:visited,#goog-wm-sb:visited{color:#fff}.btn:hover,#goog-wm-sb:hover{background-color:#fff;color:#111}.btn-success{background-color:#5cb85c;color:#fff;border-color:#5cb85c}.btn-success:visited{color:#fff}.btn-success:hover{background-color:#fff;color:#5cb85c}.btn-warning{background-color:#dd8338;color:#fff;border-color:#dd8338}.btn-warning:visited{color:#fff}.btn-warning:hover{background-color:#fff;color:#dd8338}.btn-danger{background-color:#C64537;color:#fff;border-color:#C64537}.btn-danger:visited{color:#fff}.btn-danger:hover{background-color:#fff;color:#C64537}.btn-info{background-color:#308cbc;color:#fff;border-color:#308cbc}.btn-info:visited{color:#fff}.btn-info:hover{background-color:#fff;color:#308cbc}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}btnform{margin:0 0 5px 0}btnform fieldset{margin-bottom:5px;padding:0;border-width:0}btnform legend{display:block;width:100%;margin-bottom:10px;*margin-left:-7px;padding:0;color:#333332;border:0;border-bottom:1px solid #ddd;white-space:normal}btnform p{margin-bottom:5px / 2}btnform ul{list-style-type:none;margin:0 0 5px 0;padding:0}btnform br{display:none}label,input,button,select,textarea{vertical-align:baseline;*vertical-align:middle}input,button,select,textarea{font-family:"PT Serif",serif;-ms-box-sizing:border-box;box-sizing:border-box}label{display:block;margin-bottom:10px / 8;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:5px / 4;background-color:#fff;border:1px solid #ddd;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;border-radius:0;border:0 \9}input[type="checkbox"],input[type="radio"]{-ms-box-sizing:border-box;box-sizing:border-box;padding:0;*width:13px;*height:13px}input[type="image"]{border:0;box-shadow:none}input[type="file"]{width:auto;padding:initial;line-height:initial;border:initial;background-color:transparent;background-color:initial;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:#fff}select[multiple],select[size]{height:auto}textarea{resize:vertical;overflow:auto;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]{opacity:0.5;cursor:not-allowed}input:focus,textarea:focus{border-color:#111;outline:0;outline:thin dotted \9}input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus,select:focus{box-shadow:none}.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 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;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}body{background-color:#fff;font-family:"PT Serif",serif;color:#333332}.navigation-wrapper{margin:0 auto;width:100%;padding:2em 0 1em;font-family:"PT Sans Narrow",sans-serif;font-weight:700;text-transform:uppercase;*zoom:1}.navigation-wrapper:before,.navigation-wrapper:after{display:table;content:"";line-height:0}.navigation-wrapper:after{clear:both}.site-name{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:1em;float:none;display:block;font-size:24px;font-size:1.5rem}@media only screen and (min-width: 37.5em){.site-name{display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%;font-size:16px;font-size:1rem}}@media only screen and (min-width: 86.375em){.site-name{display:inline;float:left;width:12.5%;margin-left:16.66667%}}.top-navigation{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:1em;float:none;display:block}@media only screen and (min-width: 37.5em){.top-navigation{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%}}@media only screen and (min-width: 86.375em){.top-navigation{display:inline;float:left;width:66.66667%}}.top-navigation ul{margin:0;padding:0;clear:both;list-style-type:none}.top-navigation li{display:block;list-style-type:none;border-bottom:1px solid #ddd;border-bottom:1px solid fade(#111, 10);font-size:16px;font-size:1rem}.top-navigation li:last-child{border-bottom:0 solid transparent}@media only screen and (min-width: 37.5em){.top-navigation li{display:inline;margin-right:25px;white-space:nowrap;border-bottom:0 solid transparent}}.top-navigation li a{display:block;padding:10px 0;decoration:none;border-bottom:0 solid transparent;transition:all 0.2s}@media only screen and (min-width: 37.5em){.top-navigation li a{display:inline;padding:0}}.navicon-lines-button{padding:0.375rem 0.75rem;transition:.3s;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:0.21429rem}.navicon-lines-button:hover{opacity:1}.navicon-lines-button:active{transition:0}.navicon-lines{margin-right:10px;margin-bottom:0.3rem;display:inline-block;width:1.5rem;height:0.21429rem;background:#fff;border-radius:0.10714rem;transition:.3s;position:relative}.navicon-lines:before,.navicon-lines:after{display:inline-block;width:1.5rem;height:0.21429rem;background:#fff;border-radius:0.10714rem;transition:.3s;position:absolute;left:0;content:'';-webkit-transform-origin:0.10714rem center;transform-origin:0.10714rem center}.navicon-lines:before{top:0.375rem}.navicon-lines:after{top:-0.375rem}.navicon-lines-button:hover{opacity:1}.navicon-lines-button:hover .navicon-lines:before{top:0.42857rem}.navicon-lines-button:hover .navicon-lines:after{top:-0.42857rem}.navicon-lines-button.x.active .navicon-lines{background:transparent}.navicon-lines-button.x.active .navicon-lines:before,.navicon-lines-button.x.active .navicon-lines:after{-webkit-transform-origin:50% 50%;transform-origin:50% 50%;top:0;width:1.5rem}.navicon-lines-button.x.active .navicon-lines:before{-webkit-transform:rotate3d(0, 0, 1, 45deg);transform:rotate3d(0, 0, 1, 45deg)}.navicon-lines-button.x.active .navicon-lines:after{-webkit-transform:rotate3d(0, 0, 1, -45deg);transform:rotate3d(0, 0, 1, -45deg)}.nav .navtoggle{font-size:18px;font-size:1.125rem;font-weight:normal;background-color:#111;color:#fff;border:none;cursor:pointer}@media only screen and (min-width: 37.5em){.nav .navtoggle{display:none}}.nav button{border:none;background:none}.navtoggle i{z-index:-1}.icon-menu{position:relative;top:3px;line-height:0}.no-js .nav .navtoggle{display:none}.no-js .nav ul{max-height:30em;overflow:hidden}.js .nav ul{max-height:0;overflow:hidden}@media only screen and (min-width: 37.5em){.js .nav ul{max-height:30em}}.js .nav .active+ul{max-height:30em;overflow:hidden;transition:max-height .4s}#main{counter-reset:captions;margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:2em}#main:before,#main:after{display:table;content:"";line-height:0}#main:after{clear:both}#main h1{margin-top:0}#main .post{margin:0 auto;width:100%;display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media only screen and (min-width: 37.5em){#main .post{display:inline;float:left;width:66.66667%;margin-left:0%;margin-right:0%}}@media only screen and (min-width: 62em){#main .post{display:inline;float:left;width:50%}}@media only screen and (min-width: 86.375em){#main .post{display:inline;float:left;width:41.66667%}}#main figcaption{padding-top:10px;font-size:14px;font-size:0.875rem;line-height:1.8571;line-height:1.3;color:#4d4d4b}.archive{margin:0 auto;width:100%;display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media only screen and (min-width: 37.5em){.archive{display:inline;float:left;width:66.66667%;margin-left:0%;margin-right:0%}}@media only screen and (min-width: 62em){.archive{display:inline;float:left;width:50%}}@media only screen and (min-width: 86.375em){.archive{display:inline;float:left;width:41.66667%}}.archive h3{margin:0;padding-bottom:.5em;font-size:28px;font-size:1.75rem;border-bottom:1px solid #c4c4c4}.archive article h2{margin-bottom:4px;font-size:20px;font-size:1.25rem}.archive article h2.link-post{margin-bottom:26px;margin-bottom:1.625rem}.archive article p{font-size:14px;font-size:0.875rem}.archive article p+p{text-indent:0}.image-wrap{position:relative;margin-bottom:2em;*zoom:1}.image-wrap:before,.image-wrap:after{display:table;content:"";line-height:0}.image-wrap:after{clear:both}.image-wrap:after{content:" ";display:block;position:absolute;bottom:0;left:8%;width:0;height:0;border:10px solid transparent;border-bottom-color:#fff}@media only screen and (min-width: 37.5em){.image-wrap:after{left:25%}}@media only screen and (min-width: 62em){.image-wrap:after{border-width:20px}}@media only screen and (min-width: 86.375em){.image-wrap:after{left:33.333333333%}}.image-wrap img{width:100%;height:auto;-ms-interpolation-mode:bicubic}.byline{clear:both;font-size:80%}.sidebar{display:none}.sidebar a,.sidebar a:hover{border-bottom:0 solid transparent}.sidebar img{width:100%}@media only screen and (min-width: 37.5em){.sidebar{display:block;display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%}}@media only screen and (min-width: 86.375em){.sidebar{display:inline;float:left;width:12.5%;margin-left:16.66667%}}.author-name{margin-bottom:0}@media only screen and (min-width: 37.5em){.author-name{margin-top:10px;margin-bottom:10px}}.author-bio{font-size:80%;font-style:italic}@media only screen and (min-width: 37.5em){.author-bio{margin-bottom:20px}}.author-avatar{max-width:110px;border-radius:150px}.author-social{display:block;margin-bottom:5px;font-size:14px;font-size:0.875rem;color:#111}.author-social:visited{color:#111}.author-social:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.author-social:active{-webkit-transform:translate(0, 2px);transform:translate(0, 2px)}.author-social .fa{margin-right:5px}@media only screen and (min-width: 37.5em){display:block;max-width:125px}@media only screen and (min-width: 62em){.author-name,.author-avatar,.author-bio,.author-social{max-width:150px}}.article-wrap p>a,.article-wrap p>em>a,.article-wrap p>strong>a,.article-wrap li>a{text-decoration:underline}.toc{font-size:95%}@media only screen and (min-width: 62em){.toc{display:block;display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%;position:absolute;top:5.5em;right:0;background-color:#fff}}.toc header{background:#2b2b2b}.toc h3{margin:0;padding:5px 10px;color:#fff;font-size:16px;font-size:1rem;text-transform:uppercase}.toc h3:hover{cursor:pointer}.toc ul{margin:2px 0 0;padding:0;line-height:1}.toc li{display:block;margin:0 0 1px 0;padding:0;font-family:"PT Sans Narrow",sans-serif;list-style-type:none}.toc li:last-child{border-bottom-width:0}.toc li a{padding:10px;display:block;color:#fff;text-decoration:none;background:#5e5e5e;opacity:0.7;transition:opacity 0.2s ease-in-out}.toc li a:hover{opacity:1}.toc li ul{margin:1px 0 0}.toc li ul li a{padding-left:20px}#drawer{max-height:100%;overflow:hidden}#drawer.js-hidden{max-height:0}.image-grid{*zoom:1;list-style:none;margin:0 0 1em;padding:0}.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%}@media only screen and (min-width: 30em){.image-grid li{width:33.333333%}}@media only screen and (min-width: 37.5em){.image-grid li{width:25%}}@media only screen and (min-width: 48em){.image-grid li{width:20%}}@media only screen and (min-width: 62em){.image-grid li{width:16.666666666%}}.recent-grid{*zoom:1;list-style:none;margin:1em 0}.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%}.social-share{margin-bottom:26px;margin-bottom:1.625rem}.social-share ul,.social-share li{margin:0;padding:0;list-style:none}.social-share li{display:inline-block}.social-share .facebook{background:#3b5998}.social-share .flickr{background:#ff0084}.social-share .foursquare{background:#0cbadf}.social-share .google-plus{background:#dd4b39}.social-share .instagram{background:#4e433c}.social-share .linkedin{background:#4875b4}.social-share .pinterest{background:#cb2027}.social-share .rss{background:#fa9b39}.social-share .tumblr{background:#2c4762}.social-share .twitter{background:#55acee}.social-share .vimeo{background:#1ab7ea}.social-share .youtube{background:#f33}.social-share a{display:block;padding:8px 20px;text-decoration:none !important;text-transform:uppercase;font-size:14px;font-size:0.875rem;font-family:"PT Sans Narrow",sans-serif;font-weight:700;color:#fff;opacity:0.8}.social-share a:hover{opacity:1}.social-share span{display:none}@media only screen and (min-width: 48em){.social-share span{display:inline;padding-left:5px}}.social-share h4{font-size:14px;font-size:0.875rem;margin-bottom:10px;text-transform:uppercase}.footer-wrap{margin:0 auto;width:100%;*zoom:1;clear:both;padding-bottom:3em}.footer-wrap:before,.footer-wrap:after{display:table;content:"";line-height:0}.footer-wrap:after{clear:both}.footer-wrap .copyright{font-size:14px;font-size:0.875rem}.footer-wrap footer{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%}@media only screen and (min-width: 37.5em){.footer-wrap footer{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%}}@media only screen and (min-width: 86.375em){.footer-wrap footer{display:inline;float:left;width:37.5%;margin-left:33.33333%;margin-right:29.16667%}}.follow ul{margin:0;padding:0;list-style-type:none}.follow li{display:inline-block}.follow li+li:before{content:"";padding-right:5px}.related-articles{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media only screen and (min-width: 37.5em){.related-articles{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%}}@media only screen and (min-width: 86.375em){.related-articles{display:inline;float:left;width:37.5%;margin-left:33.33333%;margin-right:29.16667%}}.related-articles h4{text-transform:uppercase;margin-bottom:0}.related-articles li{margin-bottom:0}.browser-upgrade{background:#000;text-align:center;margin:0 0 2em 0;padding:10px;text-align:center;color:#fff}.browser-upgrade a{color:#fff;border-bottom:1px dotted #fff;text-decoration:none}.browser-upgrade a:hover{border-bottom:1px solid #fff}#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:#fff;color:#111;border-width:2px !important;border-style:solid !important;border-color:#919191;border-radius:3px}.breadcrumbs ol{padding:0;list-style:none}.breadcrumbs li{display:inline}.breadcrumbs .current{font-weight:bold}.pagination{padding-top:0.5em;border-top:1px solid #c4c4c4}.pagination ul{margin:0;padding:0;list-style-type:none}.pagination li{display:inline-block}.pagination li+li:before{content:"";padding-right:10px}.pagination .current{font-weight:bold}/*! +/*! normalize.css v2.1.0 | MIT License | git.io/normalize */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{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}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;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;width:100%}::-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}.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}b,i,strong,em,blockquote,p,q,span,figure,img,h1,h2,header,input,a{transition:all 0.2s ease}h1,h2,h3,h4,h5,h6{font-family:"PT Serif",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:#4e4e4e}a:hover{color:#1b1b1b}a:focus{outline:thin dotted;color:#343434}a:hover,a:active{outline:0}.image-caption{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;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}@media (min-width: 37.5em){.image-caption{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%}}@media (min-width: 86.375em){.image-caption{display:inline;float:left;width:70.83333%}}.image-caption a{color:#80807e}.notice{margin-top:1.5em;padding:.5em 1em;text-indent:0;font-size:14px;font-size:0.875rem;background-color:#fff;border:1px solid #ccc;border-radius:3px}blockquote{margin-left:-28px;padding-left:20px;border-left:8px solid #333332;font-family:"PT Serif",serif;font-style:italic}.footnotes ol,.footnotes li,.footnotes p{margin-bottom:0;font-size:14px;font-size:0.875rem}p{margin:0 0 1.625rem}p+p{text-indent:1.625rem;margin-top:-1.625rem}tt,code,kbd,samp,pre{font-family:Monaco,Consolas,"Lucida Console",monospace}p code,li code{font-size:12px;font-size:0.75rem;line-height:1.5}pre{font-size:12px;font-size:0.75rem;line-height:1.5;overflow-x:auto}div.highlighter-rouge{margin-bottom:1em;padding:1em;border:1px solid #ddd;border-radius:4px}div.highlighter-rouge .highlight{margin:0;font-family:Monaco,Consolas,"Lucida Console",monospace;font-size:12px;font-size:0.75rem;line-height:1.5}.highlight table td{padding:5px}.highlight table pre{margin:0}.highlight,.highlight .w{color:#303030}.highlight .err{color:#151515;background-color:#ac4142}.highlight .c,.highlight .cd,.highlight .cm,.highlight .c1,.highlight .cs{color:#505050}.highlight .cp{color:#f4bf75}.highlight .nt{color:#f4bf75}.highlight .o,.highlight .ow{color:#d0d0d0}.highlight .p,.highlight .pi{color:#d0d0d0}.highlight .gi{color:#90a959}.highlight .gd{color:#ac4142}.highlight .gh{color:#6a9fb5;background-color:#151515;font-weight:bold}.highlight .k,.highlight .kn,.highlight .kp,.highlight .kr,.highlight .kv{color:#aa759f}.highlight .kc{color:#d28445}.highlight .kt{color:#d28445}.highlight .kd{color:#d28445}.highlight .s,.highlight .sb,.highlight .sc,.highlight .sd,.highlight .s2,.highlight .sh,.highlight .sx,.highlight .s1{color:#90a959}.highlight .sr{color:#75b5aa}.highlight .si{color:#8f5536}.highlight .se{color:#8f5536}.highlight .nn{color:#f4bf75}.highlight .nc{color:#f4bf75}.highlight .no{color:#f4bf75}.highlight .na{color:#6a9fb5}.highlight .m,.highlight .mf,.highlight .mh,.highlight .mi,.highlight .il,.highlight .mo,.highlight .mb,.highlight .mx{color:#90a959}.highlight .ss{color:#90a959}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc;border-bottom:1px solid #fff}figure{margin-bottom:1.625rem}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:"";line-height:0}.half:after{clear:both}@media (min-width: 30em){.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:"";line-height:0}.third:after{clear:both}@media (min-width: 30em){.third img{display:inline;float:left;width:33.33333%}.third figcaption{display:inline;float:left;width:100%}}.btn,#goog-wm-sb{display:inline-block;margin-bottom:20px;padding:8px 20px;font-size:14px;font-size:0.875rem;font-family:"PT Sans Narrow",sans-serif;font-weight:700;background-color:#111;color:#fff;border-width:2px !important;border-style:solid !important;border-color:#111;text-decoration:none !important;border-radius:3px}.btn:visited,#goog-wm-sb:visited{color:#fff}.btn:hover,#goog-wm-sb:hover{background-color:#fff;color:#111}.btn-success{background-color:#5cb85c;color:#fff;border-color:#5cb85c}.btn-success:visited{color:#fff}.btn-success:hover{background-color:#fff;color:#5cb85c}.btn-warning{background-color:#dd8338;color:#fff;border-color:#dd8338}.btn-warning:visited{color:#fff}.btn-warning:hover{background-color:#fff;color:#dd8338}.btn-danger{background-color:#C64537;color:#fff;border-color:#C64537}.btn-danger:visited{color:#fff}.btn-danger:hover{background-color:#fff;color:#C64537}.btn-info{background-color:#308cbc;color:#fff;border-color:#308cbc}.btn-info:visited{color:#fff}.btn-info:hover{background-color:#fff;color:#308cbc}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}btnform{margin:0 0 5px 0}btnform fieldset{margin-bottom:5px;padding:0;border-width:0}btnform legend{display:block;width:100%;margin-bottom:10px;*margin-left:-7px;padding:0;color:#333332;border:0;border-bottom:1px solid #ddd;white-space:normal}btnform p{margin-bottom:5px / 2}btnform ul{list-style-type:none;margin:0 0 5px 0;padding:0}btnform br{display:none}label,input,button,select,textarea{vertical-align:baseline;*vertical-align:middle}input,button,select,textarea{font-family:"PT Serif",serif;-ms-box-sizing:border-box;box-sizing:border-box}label{display:block;margin-bottom:10px / 8;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:5px / 4;background-color:#fff;border:1px solid #ddd;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;border-radius:0;border:0 \9}input[type="checkbox"],input[type="radio"]{-ms-box-sizing:border-box;box-sizing:border-box;padding:0;*width:13px;*height:13px}input[type="image"]{border:0;box-shadow:none}input[type="file"]{width:auto;padding:initial;line-height:initial;border:initial;background-color:transparent;background-color:initial;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:#fff}select[multiple],select[size]{height:auto}textarea{resize:vertical;overflow:auto;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]{opacity:0.5;cursor:not-allowed}input:focus,textarea:focus{border-color:#111;outline:0;outline:thin dotted \9}input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus,select:focus{box-shadow:none}.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 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;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}body{background-color:#fff;font-family:"PT Serif",serif;color:#333332}.navigation-wrapper{margin:0 auto;width:100%;padding:2em 0 1em;font-family:"PT Sans Narrow",sans-serif;font-weight:700;text-transform:uppercase;*zoom:1}.navigation-wrapper:before,.navigation-wrapper:after{display:table;content:"";line-height:0}.navigation-wrapper:after{clear:both}.site-name{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:1em;float:none;display:block;font-size:24px;font-size:1.5rem}@media (min-width: 37.5em){.site-name{display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%;font-size:16px;font-size:1rem}}@media (min-width: 86.375em){.site-name{display:inline;float:left;width:12.5%;margin-left:16.66667%}}.top-navigation{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:1em;float:none;display:block}@media (min-width: 37.5em){.top-navigation{display:inline;float:left;width:75%;margin-left:0%;margin-right:0%}}@media (min-width: 86.375em){.top-navigation{display:inline;float:left;width:66.66667%}}.top-navigation ul{margin:0;padding:0;clear:both;list-style-type:none}.top-navigation li{display:block;list-style-type:none;border-bottom:1px solid #ddd;border-bottom:1px solid fade(#111, 10);font-size:16px;font-size:1rem}.top-navigation li:last-child{border-bottom:0 solid transparent}@media (min-width: 37.5em){.top-navigation li{display:inline;margin-right:25px;white-space:nowrap;border-bottom:0 solid transparent}}.top-navigation li a{display:block;padding:10px 0;decoration:none;border-bottom:0 solid transparent;transition:all 0.2s}@media (min-width: 37.5em){.top-navigation li a{display:inline;padding:0}}#main{counter-reset:captions;margin:0 auto;width:100%;*zoom:1;clear:both;margin-top:2em}#main:before,#main:after{display:table;content:"";line-height:0}#main:after{clear:both}#main h1{margin-top:0}#main .post{margin:0 auto;width:100%;display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media (min-width: 37.5em){#main .post{display:inline;float:left;width:66.66667%;margin-left:0%;margin-right:0%}}@media (min-width: 62em){#main .post{display:inline;float:left;width:50%}}@media (min-width: 86.375em){#main .post{display:inline;float:left;width:41.66667%}}#main figcaption{padding-top:10px;font-size:14px;font-size:0.875rem;line-height:1.8571;line-height:1.3;color:#4d4d4b}.archive{margin:0 auto;width:100%;display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media (min-width: 37.5em){.archive{display:inline;float:left;width:66.66667%;margin-left:0%;margin-right:0%}}@media (min-width: 62em){.archive{display:inline;float:left;width:50%}}@media (min-width: 86.375em){.archive{display:inline;float:left;width:41.66667%}}.archive h3{margin:0;padding-bottom:.5em;font-size:28px;font-size:1.75rem;border-bottom:1px solid #c4c4c4}.archive article h2{margin-bottom:4px;font-size:20px;font-size:1.25rem}.archive article h2.link-post{margin-bottom:26px;margin-bottom:1.625rem}.archive article p{font-size:14px;font-size:0.875rem}.archive article p+p{text-indent:0}.image-wrap{position:relative;margin-bottom:2em;*zoom:1}.image-wrap:before,.image-wrap:after{display:table;content:"";line-height:0}.image-wrap:after{clear:both}.image-wrap:after{content:" ";display:block;position:absolute;bottom:0;left:8%;width:0;height:0;border:10px solid transparent;border-bottom-color:#fff}@media (min-width: 37.5em){.image-wrap:after{left:25%}}@media (min-width: 62em){.image-wrap:after{border-width:20px}}@media (min-width: 86.375em){.image-wrap:after{left:33.333333333%}}.image-wrap img{width:100%;height:auto;-ms-interpolation-mode:bicubic}.byline{clear:both;font-size:80%}.sidebar{display:none}.sidebar a,.sidebar a:hover{border-bottom:0 solid transparent}.sidebar img{width:100%}@media (min-width: 37.5em){.sidebar{display:block;display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%}}@media (min-width: 86.375em){.sidebar{display:inline;float:left;width:12.5%;margin-left:16.66667%}}.author-name{margin-bottom:0}@media (min-width: 37.5em){.author-name{margin-top:10px;margin-bottom:10px}}.author-bio{font-size:80%;font-style:italic}@media (min-width: 37.5em){.author-bio{margin-bottom:20px}}.author-avatar{max-width:110px;border-radius:150px}.author-social{display:block;margin-bottom:5px;font-size:14px;font-size:0.875rem;color:#111}.author-social:visited{color:#111}.author-social:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.author-social:active{-webkit-transform:translate(0, 2px);transform:translate(0, 2px)}.author-social .fa{margin-right:5px}@media (min-width: 37.5em){display:block;max-width:125px}@media (min-width: 62em){.author-name,.author-avatar,.author-bio,.author-social{max-width:150px}}.article-wrap p>a,.article-wrap p>em>a,.article-wrap p>strong>a,.article-wrap li>a{text-decoration:underline}.toc{font-size:95%}@media (min-width: 62em){.toc{display:block;display:inline;float:left;width:16.66667%;margin-left:4.16667%;margin-right:4.16667%;position:absolute;top:5.5em;right:0;background-color:#fff}}.toc header{background:#2b2b2b}.toc h3{margin:0;padding:5px 10px;color:#fff;font-size:16px;font-size:1rem;text-transform:uppercase}.toc h3:hover{cursor:pointer}.toc ul{margin:2px 0 0;padding:0;line-height:1}.toc li{display:block;margin:0 0 1px 0;padding:0;font-family:"PT Sans Narrow",sans-serif;list-style-type:none}.toc li:last-child{border-bottom-width:0}.toc li a{padding:10px;display:block;color:#fff;text-decoration:none;background:#5e5e5e;opacity:0.7;transition:opacity 0.2s ease-in-out}.toc li a:hover{opacity:1}.toc li ul{margin:1px 0 0}.toc li ul li a{padding-left:20px}#drawer{max-height:100%;overflow:hidden}#drawer.js-hidden{max-height:0}.image-grid{*zoom:1;list-style:none;margin:0 0 1em;padding:0}.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%}@media (min-width: 30em){.image-grid li{width:33.333333%}}@media (min-width: 37.5em){.image-grid li{width:25%}}@media (min-width: 48em){.image-grid li{width:20%}}@media (min-width: 62em){.image-grid li{width:16.666666666%}}.recent-grid{*zoom:1;list-style:none;margin:1em 0}.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%}.social-share{margin-bottom:26px;margin-bottom:1.625rem}.social-share ul,.social-share li{margin:0;padding:0;list-style:none}.social-share li{display:inline-block}.social-share .facebook{background:#3b5998}.social-share .flickr{background:#ff0084}.social-share .foursquare{background:#0cbadf}.social-share .google-plus{background:#dd4b39}.social-share .instagram{background:#4e433c}.social-share .linkedin{background:#4875b4}.social-share .pinterest{background:#cb2027}.social-share .rss{background:#fa9b39}.social-share .tumblr{background:#2c4762}.social-share .twitter{background:#55acee}.social-share .vimeo{background:#1ab7ea}.social-share .youtube{background:#f33}.social-share a{display:block;padding:8px 20px;text-decoration:none !important;text-transform:uppercase;font-size:14px;font-size:0.875rem;font-family:"PT Sans Narrow",sans-serif;font-weight:700;color:#fff;opacity:0.8}.social-share a:hover{opacity:1}.social-share span{display:none}@media (min-width: 48em){.social-share span{display:inline;padding-left:5px}}.social-share h4{font-size:14px;font-size:0.875rem;margin-bottom:10px;text-transform:uppercase}.footer-wrap{margin:0 auto;width:100%;*zoom:1;clear:both;padding-bottom:3em}.footer-wrap:before,.footer-wrap:after{display:table;content:"";line-height:0}.footer-wrap:after{clear:both}.footer-wrap .copyright{font-size:14px;font-size:0.875rem}.footer-wrap footer{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%}@media (min-width: 37.5em){.footer-wrap footer{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%}}@media (min-width: 86.375em){.footer-wrap footer{display:inline;float:left;width:37.5%;margin-left:33.33333%;margin-right:29.16667%}}.follow ul{margin:0;padding:0;list-style-type:none}.follow li{display:inline-block}.follow li+li:before{content:"";padding-right:5px}.related-articles{display:inline;float:left;width:83.33333%;margin-left:8.33333%;margin-right:8.33333%;margin-bottom:2em}@media (min-width: 37.5em){.related-articles{display:inline;float:left;width:50%;margin-left:25%;margin-right:25%}}@media (min-width: 86.375em){.related-articles{display:inline;float:left;width:37.5%;margin-left:33.33333%;margin-right:29.16667%}}.related-articles h4{text-transform:uppercase;margin-bottom:0}.related-articles li{margin-bottom:0}.browser-upgrade{background:#000;text-align:center;margin:0 0 2em 0;padding:10px;text-align:center;color:#fff}.browser-upgrade a{color:#fff;border-bottom:1px dotted #fff;text-decoration:none}.browser-upgrade a:hover{border-bottom:1px solid #fff}#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:#fff;color:#111;border-width:2px !important;border-style:solid !important;border-color:#919191;border-radius:3px}.breadcrumbs ol{padding:0;list-style:none}.breadcrumbs li{display:inline}.breadcrumbs .current{font-weight:bold}.pagination{padding-top:0.5em;border-top:1px solid #c4c4c4}.pagination ul{margin:0;padding:0;list-style-type:none}.pagination li{display:inline-block}.pagination li+li:before{content:"";padding-right:10px}.pagination .current{font-weight:bold}/*! * Font Awesome 4.5.0 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */@font-face{font-family:'FontAwesome';src:url("../fonts/fontawesome-webfont.eot?v=4.5.0");src:url("../fonts/fontawesome-webfont.eot?#iefix&v=4.5.0") format("embedded-opentype"),url("../fonts/fontawesome-webfont.woff2?v=4.5.0") format("woff2"),url("../fonts/fontawesome-webfont.woff?v=4.5.0") format("woff"),url("../fonts/fontawesome-webfont.ttf?v=4.5.0") format("truetype"),url("../fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px / 1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333em;line-height:0.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14286em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14286em;width:2.14286em;top:0.14286em;text-align:center}.fa-li.fa-lg{left:-1.85714em}.fa-border{padding:.2em .25em .15em;border:solid 0.08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0);-webkit-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{-webkit-filter:none;filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:""}.fa-music:before{content:""}.fa-search:before{content:""}.fa-envelope-o:before{content:""}.fa-heart:before{content:""}.fa-star:before{content:""}.fa-star-o:before{content:""}.fa-user:before{content:""}.fa-film:before{content:""}.fa-th-large:before{content:""}.fa-th:before{content:""}.fa-th-list:before{content:""}.fa-check:before{content:""}.fa-remove:before,.fa-close:before,.fa-times:before{content:""}.fa-search-plus:before{content:""}.fa-search-minus:before{content:""}.fa-power-off:before{content:""}.fa-signal:before{content:""}.fa-gear:before,.fa-cog:before{content:""}.fa-trash-o:before{content:""}.fa-home:before{content:""}.fa-file-o:before{content:""}.fa-clock-o:before{content:""}.fa-road:before{content:""}.fa-download:before{content:""}.fa-arrow-circle-o-down:before{content:""}.fa-arrow-circle-o-up:before{content:""}.fa-inbox:before{content:""}.fa-play-circle-o:before{content:""}.fa-rotate-right:before,.fa-repeat:before{content:""}.fa-refresh:before{content:""}.fa-list-alt:before{content:""}.fa-lock:before{content:""}.fa-flag:before{content:""}.fa-headphones:before{content:""}.fa-volume-off:before{content:""}.fa-volume-down:before{content:""}.fa-volume-up:before{content:""}.fa-qrcode:before{content:""}.fa-barcode:before{content:""}.fa-tag:before{content:""}.fa-tags:before{content:""}.fa-book:before{content:""}.fa-bookmark:before{content:""}.fa-print:before{content:""}.fa-camera:before{content:""}.fa-font:before{content:""}.fa-bold:before{content:""}.fa-italic:before{content:""}.fa-text-height:before{content:""}.fa-text-width:before{content:""}.fa-align-left:before{content:""}.fa-align-center:before{content:""}.fa-align-right:before{content:""}.fa-align-justify:before{content:""}.fa-list:before{content:""}.fa-dedent:before,.fa-outdent:before{content:""}.fa-indent:before{content:""}.fa-video-camera:before{content:""}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:""}.fa-pencil:before{content:""}.fa-map-marker:before{content:""}.fa-adjust:before{content:""}.fa-tint:before{content:""}.fa-edit:before,.fa-pencil-square-o:before{content:""}.fa-share-square-o:before{content:""}.fa-check-square-o:before{content:""}.fa-arrows:before{content:""}.fa-step-backward:before{content:""}.fa-fast-backward:before{content:""}.fa-backward:before{content:""}.fa-play:before{content:""}.fa-pause:before{content:""}.fa-stop:before{content:""}.fa-forward:before{content:""}.fa-fast-forward:before{content:""}.fa-step-forward:before{content:""}.fa-eject:before{content:""}.fa-chevron-left:before{content:""}.fa-chevron-right:before{content:""}.fa-plus-circle:before{content:""}.fa-minus-circle:before{content:""}.fa-times-circle:before{content:""}.fa-check-circle:before{content:""}.fa-question-circle:before{content:""}.fa-info-circle:before{content:""}.fa-crosshairs:before{content:""}.fa-times-circle-o:before{content:""}.fa-check-circle-o:before{content:""}.fa-ban:before{content:""}.fa-arrow-left:before{content:""}.fa-arrow-right:before{content:""}.fa-arrow-up:before{content:""}.fa-arrow-down:before{content:""}.fa-mail-forward:before,.fa-share:before{content:""}.fa-expand:before{content:""}.fa-compress:before{content:""}.fa-plus:before{content:""}.fa-minus:before{content:""}.fa-asterisk:before{content:""}.fa-exclamation-circle:before{content:""}.fa-gift:before{content:""}.fa-leaf:before{content:""}.fa-fire:before{content:""}.fa-eye:before{content:""}.fa-eye-slash:before{content:""}.fa-warning:before,.fa-exclamation-triangle:before{content:""}.fa-plane:before{content:""}.fa-calendar:before{content:""}.fa-random:before{content:""}.fa-comment:before{content:""}.fa-magnet:before{content:""}.fa-chevron-up:before{content:""}.fa-chevron-down:before{content:""}.fa-retweet:before{content:""}.fa-shopping-cart:before{content:""}.fa-folder:before{content:""}.fa-folder-open:before{content:""}.fa-arrows-v:before{content:""}.fa-arrows-h:before{content:""}.fa-bar-chart-o:before,.fa-bar-chart:before{content:""}.fa-twitter-square:before{content:""}.fa-facebook-square:before{content:""}.fa-camera-retro:before{content:""}.fa-key:before{content:""}.fa-gears:before,.fa-cogs:before{content:""}.fa-comments:before{content:""}.fa-thumbs-o-up:before{content:""}.fa-thumbs-o-down:before{content:""}.fa-star-half:before{content:""}.fa-heart-o:before{content:""}.fa-sign-out:before{content:""}.fa-linkedin-square:before{content:""}.fa-thumb-tack:before{content:""}.fa-external-link:before{content:""}.fa-sign-in:before{content:""}.fa-trophy:before{content:""}.fa-github-square:before{content:""}.fa-upload:before{content:""}.fa-lemon-o:before{content:""}.fa-phone:before{content:""}.fa-square-o:before{content:""}.fa-bookmark-o:before{content:""}.fa-phone-square:before{content:""}.fa-twitter:before{content:""}.fa-facebook-f:before,.fa-facebook:before{content:""}.fa-github:before{content:""}.fa-unlock:before{content:""}.fa-credit-card:before{content:""}.fa-feed:before,.fa-rss:before{content:""}.fa-hdd-o:before{content:""}.fa-bullhorn:before{content:""}.fa-bell:before{content:""}.fa-certificate:before{content:""}.fa-hand-o-right:before{content:""}.fa-hand-o-left:before{content:""}.fa-hand-o-up:before{content:""}.fa-hand-o-down:before{content:""}.fa-arrow-circle-left:before{content:""}.fa-arrow-circle-right:before{content:""}.fa-arrow-circle-up:before{content:""}.fa-arrow-circle-down:before{content:""}.fa-globe:before{content:""}.fa-wrench:before{content:""}.fa-tasks:before{content:""}.fa-filter:before{content:""}.fa-briefcase:before{content:""}.fa-arrows-alt:before{content:""}.fa-group:before,.fa-users:before{content:""}.fa-chain:before,.fa-link:before{content:""}.fa-cloud:before{content:""}.fa-flask:before{content:""}.fa-cut:before,.fa-scissors:before{content:""}.fa-copy:before,.fa-files-o:before{content:""}.fa-paperclip:before{content:""}.fa-save:before,.fa-floppy-o:before{content:""}.fa-square:before{content:""}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:""}.fa-list-ul:before{content:""}.fa-list-ol:before{content:""}.fa-strikethrough:before{content:""}.fa-underline:before{content:""}.fa-table:before{content:""}.fa-magic:before{content:""}.fa-truck:before{content:""}.fa-pinterest:before{content:""}.fa-pinterest-square:before{content:""}.fa-google-plus-square:before{content:""}.fa-google-plus:before{content:""}.fa-money:before{content:""}.fa-caret-down:before{content:""}.fa-caret-up:before{content:""}.fa-caret-left:before{content:""}.fa-caret-right:before{content:""}.fa-columns:before{content:""}.fa-unsorted:before,.fa-sort:before{content:""}.fa-sort-down:before,.fa-sort-desc:before{content:""}.fa-sort-up:before,.fa-sort-asc:before{content:""}.fa-envelope:before{content:""}.fa-linkedin:before{content:""}.fa-rotate-left:before,.fa-undo:before{content:""}.fa-legal:before,.fa-gavel:before{content:""}.fa-dashboard:before,.fa-tachometer:before{content:""}.fa-comment-o:before{content:""}.fa-comments-o:before{content:""}.fa-flash:before,.fa-bolt:before{content:""}.fa-sitemap:before{content:""}.fa-umbrella:before{content:""}.fa-paste:before,.fa-clipboard:before{content:""}.fa-lightbulb-o:before{content:""}.fa-exchange:before{content:""}.fa-cloud-download:before{content:""}.fa-cloud-upload:before{content:""}.fa-user-md:before{content:""}.fa-stethoscope:before{content:""}.fa-suitcase:before{content:""}.fa-bell-o:before{content:""}.fa-coffee:before{content:""}.fa-cutlery:before{content:""}.fa-file-text-o:before{content:""}.fa-building-o:before{content:""}.fa-hospital-o:before{content:""}.fa-ambulance:before{content:""}.fa-medkit:before{content:""}.fa-fighter-jet:before{content:""}.fa-beer:before{content:""}.fa-h-square:before{content:""}.fa-plus-square:before{content:""}.fa-angle-double-left:before{content:""}.fa-angle-double-right:before{content:""}.fa-angle-double-up:before{content:""}.fa-angle-double-down:before{content:""}.fa-angle-left:before{content:""}.fa-angle-right:before{content:""}.fa-angle-up:before{content:""}.fa-angle-down:before{content:""}.fa-desktop:before{content:""}.fa-laptop:before{content:""}.fa-tablet:before{content:""}.fa-mobile-phone:before,.fa-mobile:before{content:""}.fa-circle-o:before{content:""}.fa-quote-left:before{content:""}.fa-quote-right:before{content:""}.fa-spinner:before{content:""}.fa-circle:before{content:""}.fa-mail-reply:before,.fa-reply:before{content:""}.fa-github-alt:before{content:""}.fa-folder-o:before{content:""}.fa-folder-open-o:before{content:""}.fa-smile-o:before{content:""}.fa-frown-o:before{content:""}.fa-meh-o:before{content:""}.fa-gamepad:before{content:""}.fa-keyboard-o:before{content:""}.fa-flag-o:before{content:""}.fa-flag-checkered:before{content:""}.fa-terminal:before{content:""}.fa-code:before{content:""}.fa-mail-reply-all:before,.fa-reply-all:before{content:""}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:""}.fa-location-arrow:before{content:""}.fa-crop:before{content:""}.fa-code-fork:before{content:""}.fa-unlink:before,.fa-chain-broken:before{content:""}.fa-question:before{content:""}.fa-info:before{content:""}.fa-exclamation:before{content:""}.fa-superscript:before{content:""}.fa-subscript:before{content:""}.fa-eraser:before{content:""}.fa-puzzle-piece:before{content:""}.fa-microphone:before{content:""}.fa-microphone-slash:before{content:""}.fa-shield:before{content:""}.fa-calendar-o:before{content:""}.fa-fire-extinguisher:before{content:""}.fa-rocket:before{content:""}.fa-maxcdn:before{content:""}.fa-chevron-circle-left:before{content:""}.fa-chevron-circle-right:before{content:""}.fa-chevron-circle-up:before{content:""}.fa-chevron-circle-down:before{content:""}.fa-html5:before{content:""}.fa-css3:before{content:""}.fa-anchor:before{content:""}.fa-unlock-alt:before{content:""}.fa-bullseye:before{content:""}.fa-ellipsis-h:before{content:""}.fa-ellipsis-v:before{content:""}.fa-rss-square:before{content:""}.fa-play-circle:before{content:""}.fa-ticket:before{content:""}.fa-minus-square:before{content:""}.fa-minus-square-o:before{content:""}.fa-level-up:before{content:""}.fa-level-down:before{content:""}.fa-check-square:before{content:""}.fa-pencil-square:before{content:""}.fa-external-link-square:before{content:""}.fa-share-square:before{content:""}.fa-compass:before{content:""}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:""}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:""}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:""}.fa-euro:before,.fa-eur:before{content:""}.fa-gbp:before{content:""}.fa-dollar:before,.fa-usd:before{content:""}.fa-rupee:before,.fa-inr:before{content:""}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:""}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:""}.fa-won:before,.fa-krw:before{content:""}.fa-bitcoin:before,.fa-btc:before{content:""}.fa-file:before{content:""}.fa-file-text:before{content:""}.fa-sort-alpha-asc:before{content:""}.fa-sort-alpha-desc:before{content:""}.fa-sort-amount-asc:before{content:""}.fa-sort-amount-desc:before{content:""}.fa-sort-numeric-asc:before{content:""}.fa-sort-numeric-desc:before{content:""}.fa-thumbs-up:before{content:""}.fa-thumbs-down:before{content:""}.fa-youtube-square:before{content:""}.fa-youtube:before{content:""}.fa-xing:before{content:""}.fa-xing-square:before{content:""}.fa-youtube-play:before{content:""}.fa-dropbox:before{content:""}.fa-stack-overflow:before{content:""}.fa-instagram:before{content:""}.fa-flickr:before{content:""}.fa-adn:before{content:""}.fa-bitbucket:before{content:""}.fa-bitbucket-square:before{content:""}.fa-tumblr:before{content:""}.fa-tumblr-square:before{content:""}.fa-long-arrow-down:before{content:""}.fa-long-arrow-up:before{content:""}.fa-long-arrow-left:before{content:""}.fa-long-arrow-right:before{content:""}.fa-apple:before{content:""}.fa-windows:before{content:""}.fa-android:before{content:""}.fa-linux:before{content:""}.fa-dribbble:before{content:""}.fa-skype:before{content:""}.fa-foursquare:before{content:""}.fa-trello:before{content:""}.fa-female:before{content:""}.fa-male:before{content:""}.fa-gittip:before,.fa-gratipay:before{content:""}.fa-sun-o:before{content:""}.fa-moon-o:before{content:""}.fa-archive:before{content:""}.fa-bug:before{content:""}.fa-vk:before{content:""}.fa-weibo:before{content:""}.fa-renren:before{content:""}.fa-pagelines:before{content:""}.fa-stack-exchange:before{content:""}.fa-arrow-circle-o-right:before{content:""}.fa-arrow-circle-o-left:before{content:""}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:""}.fa-dot-circle-o:before{content:""}.fa-wheelchair:before{content:""}.fa-vimeo-square:before{content:""}.fa-turkish-lira:before,.fa-try:before{content:""}.fa-plus-square-o:before{content:""}.fa-space-shuttle:before{content:""}.fa-slack:before{content:""}.fa-envelope-square:before{content:""}.fa-wordpress:before{content:""}.fa-openid:before{content:""}.fa-institution:before,.fa-bank:before,.fa-university:before{content:""}.fa-mortar-board:before,.fa-graduation-cap:before{content:""}.fa-yahoo:before{content:""}.fa-google:before{content:""}.fa-reddit:before{content:""}.fa-reddit-square:before{content:""}.fa-stumbleupon-circle:before{content:""}.fa-stumbleupon:before{content:""}.fa-delicious:before{content:""}.fa-digg:before{content:""}.fa-pied-piper:before{content:""}.fa-pied-piper-alt:before{content:""}.fa-drupal:before{content:""}.fa-joomla:before{content:""}.fa-language:before{content:""}.fa-fax:before{content:""}.fa-building:before{content:""}.fa-child:before{content:""}.fa-paw:before{content:""}.fa-spoon:before{content:""}.fa-cube:before{content:""}.fa-cubes:before{content:""}.fa-behance:before{content:""}.fa-behance-square:before{content:""}.fa-steam:before{content:""}.fa-steam-square:before{content:""}.fa-recycle:before{content:""}.fa-automobile:before,.fa-car:before{content:""}.fa-cab:before,.fa-taxi:before{content:""}.fa-tree:before{content:""}.fa-spotify:before{content:""}.fa-deviantart:before{content:""}.fa-soundcloud:before{content:""}.fa-database:before{content:""}.fa-file-pdf-o:before{content:""}.fa-file-word-o:before{content:""}.fa-file-excel-o:before{content:""}.fa-file-powerpoint-o:before{content:""}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:""}.fa-file-zip-o:before,.fa-file-archive-o:before{content:""}.fa-file-sound-o:before,.fa-file-audio-o:before{content:""}.fa-file-movie-o:before,.fa-file-video-o:before{content:""}.fa-file-code-o:before{content:""}.fa-vine:before{content:""}.fa-codepen:before{content:""}.fa-jsfiddle:before{content:""}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:""}.fa-circle-o-notch:before{content:""}.fa-ra:before,.fa-rebel:before{content:""}.fa-ge:before,.fa-empire:before{content:""}.fa-git-square:before{content:""}.fa-git:before{content:""}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:""}.fa-tencent-weibo:before{content:""}.fa-qq:before{content:""}.fa-wechat:before,.fa-weixin:before{content:""}.fa-send:before,.fa-paper-plane:before{content:""}.fa-send-o:before,.fa-paper-plane-o:before{content:""}.fa-history:before{content:""}.fa-circle-thin:before{content:""}.fa-header:before{content:""}.fa-paragraph:before{content:""}.fa-sliders:before{content:""}.fa-share-alt:before{content:""}.fa-share-alt-square:before{content:""}.fa-bomb:before{content:""}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:""}.fa-tty:before{content:""}.fa-binoculars:before{content:""}.fa-plug:before{content:""}.fa-slideshare:before{content:""}.fa-twitch:before{content:""}.fa-yelp:before{content:""}.fa-newspaper-o:before{content:""}.fa-wifi:before{content:""}.fa-calculator:before{content:""}.fa-paypal:before{content:""}.fa-google-wallet:before{content:""}.fa-cc-visa:before{content:""}.fa-cc-mastercard:before{content:""}.fa-cc-discover:before{content:""}.fa-cc-amex:before{content:""}.fa-cc-paypal:before{content:""}.fa-cc-stripe:before{content:""}.fa-bell-slash:before{content:""}.fa-bell-slash-o:before{content:""}.fa-trash:before{content:""}.fa-copyright:before{content:""}.fa-at:before{content:""}.fa-eyedropper:before{content:""}.fa-paint-brush:before{content:""}.fa-birthday-cake:before{content:""}.fa-area-chart:before{content:""}.fa-pie-chart:before{content:""}.fa-line-chart:before{content:""}.fa-lastfm:before{content:""}.fa-lastfm-square:before{content:""}.fa-toggle-off:before{content:""}.fa-toggle-on:before{content:""}.fa-bicycle:before{content:""}.fa-bus:before{content:""}.fa-ioxhost:before{content:""}.fa-angellist:before{content:""}.fa-cc:before{content:""}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:""}.fa-meanpath:before{content:""}.fa-buysellads:before{content:""}.fa-connectdevelop:before{content:""}.fa-dashcube:before{content:""}.fa-forumbee:before{content:""}.fa-leanpub:before{content:""}.fa-sellsy:before{content:""}.fa-shirtsinbulk:before{content:""}.fa-simplybuilt:before{content:""}.fa-skyatlas:before{content:""}.fa-cart-plus:before{content:""}.fa-cart-arrow-down:before{content:""}.fa-diamond:before{content:""}.fa-ship:before{content:""}.fa-user-secret:before{content:""}.fa-motorcycle:before{content:""}.fa-street-view:before{content:""}.fa-heartbeat:before{content:""}.fa-venus:before{content:""}.fa-mars:before{content:""}.fa-mercury:before{content:""}.fa-intersex:before,.fa-transgender:before{content:""}.fa-transgender-alt:before{content:""}.fa-venus-double:before{content:""}.fa-mars-double:before{content:""}.fa-venus-mars:before{content:""}.fa-mars-stroke:before{content:""}.fa-mars-stroke-v:before{content:""}.fa-mars-stroke-h:before{content:""}.fa-neuter:before{content:""}.fa-genderless:before{content:""}.fa-facebook-official:before{content:""}.fa-pinterest-p:before{content:""}.fa-whatsapp:before{content:""}.fa-server:before{content:""}.fa-user-plus:before{content:""}.fa-user-times:before{content:""}.fa-hotel:before,.fa-bed:before{content:""}.fa-viacoin:before{content:""}.fa-train:before{content:""}.fa-subway:before{content:""}.fa-medium:before{content:""}.fa-yc:before,.fa-y-combinator:before{content:""}.fa-optin-monster:before{content:""}.fa-opencart:before{content:""}.fa-expeditedssl:before{content:""}.fa-battery-4:before,.fa-battery-full:before{content:""}.fa-battery-3:before,.fa-battery-three-quarters:before{content:""}.fa-battery-2:before,.fa-battery-half:before{content:""}.fa-battery-1:before,.fa-battery-quarter:before{content:""}.fa-battery-0:before,.fa-battery-empty:before{content:""}.fa-mouse-pointer:before{content:""}.fa-i-cursor:before{content:""}.fa-object-group:before{content:""}.fa-object-ungroup:before{content:""}.fa-sticky-note:before{content:""}.fa-sticky-note-o:before{content:""}.fa-cc-jcb:before{content:""}.fa-cc-diners-club:before{content:""}.fa-clone:before{content:""}.fa-balance-scale:before{content:""}.fa-hourglass-o:before{content:""}.fa-hourglass-1:before,.fa-hourglass-start:before{content:""}.fa-hourglass-2:before,.fa-hourglass-half:before{content:""}.fa-hourglass-3:before,.fa-hourglass-end:before{content:""}.fa-hourglass:before{content:""}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:""}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:""}.fa-hand-scissors-o:before{content:""}.fa-hand-lizard-o:before{content:""}.fa-hand-spock-o:before{content:""}.fa-hand-pointer-o:before{content:""}.fa-hand-peace-o:before{content:""}.fa-trademark:before{content:""}.fa-registered:before{content:""}.fa-creative-commons:before{content:""}.fa-gg:before{content:""}.fa-gg-circle:before{content:""}.fa-tripadvisor:before{content:""}.fa-odnoklassniki:before{content:""}.fa-odnoklassniki-square:before{content:""}.fa-get-pocket:before{content:""}.fa-wikipedia-w:before{content:""}.fa-safari:before{content:""}.fa-chrome:before{content:""}.fa-firefox:before{content:""}.fa-opera:before{content:""}.fa-internet-explorer:before{content:""}.fa-tv:before,.fa-television:before{content:""}.fa-contao:before{content:""}.fa-500px:before{content:""}.fa-amazon:before{content:""}.fa-calendar-plus-o:before{content:""}.fa-calendar-minus-o:before{content:""}.fa-calendar-times-o:before{content:""}.fa-calendar-check-o:before{content:""}.fa-industry:before{content:""}.fa-map-pin:before{content:""}.fa-map-signs:before{content:""}.fa-map-o:before{content:""}.fa-map:before{content:""}.fa-commenting:before{content:""}.fa-commenting-o:before{content:""}.fa-houzz:before{content:""}.fa-vimeo:before{content:""}.fa-black-tie:before{content:""}.fa-fonticons:before{content:""}.fa-reddit-alien:before{content:""}.fa-edge:before{content:""}.fa-credit-card-alt:before{content:""}.fa-codiepie:before{content:""}.fa-modx:before{content:""}.fa-fort-awesome:before{content:""}.fa-usb:before{content:""}.fa-product-hunt:before{content:""}.fa-mixcloud:before{content:""}.fa-scribd:before{content:""}.fa-pause-circle:before{content:""}.fa-pause-circle-o:before{content:""}.fa-stop-circle:before{content:""}.fa-stop-circle-o:before{content:""}.fa-shopping-bag:before{content:""}.fa-shopping-basket:before{content:""}.fa-hashtag:before{content:""}.fa-bluetooth:before{content:""}.fa-bluetooth-b:before{content:""}.fa-percent:before{content:""}.mfp-counter{font-family:"PT Serif",serif}.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#000;opacity:0.8;filter:alpha(opacity=80)}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;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;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:1045}.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-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;-ms-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none !important}.mfp-preloader{color:#ccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-0.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#ccc}.mfp-preloader a:hover{color:#fff}.mfp-s-ready .mfp-preloader{display:none}.mfp-s-error .mfp-content{display:none}button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;box-shadow:none}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:1;filter:alpha(opacity=100);padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:"PT Serif",serif}.mfp-close:hover,.mfp-close:focus{opacity:1;filter:alpha(opacity=100)}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#fff}.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px}.mfp-arrow{position:absolute;opacity:1;filter:alpha(opacity=100);margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:hover,.mfp-arrow:focus{opacity:1;filter:alpha(opacity=100)}.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:medium inset transparent}.mfp-arrow:after,.mfp-arrow .mfp-a{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow:before,.mfp-arrow .mfp-b{border-top-width:21px;border-bottom-width:21px;opacity:0.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after,.mfp-arrow-left .mfp-a{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left:before,.mfp-arrow-left .mfp-b{margin-left:25px;border-right:27px solid #fff}.mfp-arrow-right{right:0}.mfp-arrow-right:after,.mfp-arrow-right .mfp-a{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right:before,.mfp-arrow-right .mfp-b{border-left:27px 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-holder .mfp-close{top:-40px}.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:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;box-sizing:border-box;padding:40px 0 40px;margin:0 auto}.mfp-figure{line-height:0}.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);background:#444}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-figure figcaption{margin-top:0;margin-bottom: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;word-wrap:break-word;padding-right:36px}.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-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;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}}@media all and (max-width: 900px){.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}@media print{.top-navigation,.social-share,.related-articles,.google-ads{display:none}}