code,
pre {
 tab-size:4
}
.mfp-preloader {
 font-size:13px
}
.get-code-window {
 position:relative;
 background:#FFF;
 padding:2em 3em;
 width:auto;
 margin:20px auto;
 max-width:600px
}
#magnific_popup_documentation {
 font-size:3em;
 margin-bottom:1em;
 font-weight:700;
 text-align:center
}
.grid-c {
 clear:both
}
.grid-c p {
 margin-bottom:.5em
}
.grid-c {
 overflow:hidden;
 margin:0 -1em
}
.gc3 {
 -moz-box-sizing:border-box;
 -webkit-box-sizing:border-box;
 box-sizing:border-box;
 width:50%;
 float:left;
 padding:1em;
 overflow:hidden
}
.grid-c .gc3:nth-of-type(2n+1) {
 clear:left
}
#broken-glass {
 height:100%;
 -webkit-tap-highlight-color:transparent;
 position:absolute;
 left:0;
 top:0;
 width:100%
}
#header-links {
 font-size:16px
}
#markdown-toc {
 position:fixed;
 left:0;
 top:50px;
 padding:20px;
 background:rgba(255,255,255,.71);
 -webkit-backface-visibility:hidden;
 list-style:none
}
#markdown-toc a[href="#magnific-popup-docs"] {
 display:none
}
#markdown-toc:before {
 content:'Table of contents';
 font-weight:700;
 display:block;
 margin-bottom:10px
}
@media all and (max-width:75em) {
 #markdown-toc {
  position:static;
  padding:0;
  background:0 0
 }
}
#markdown-toc code,
pre {
 font-family:Consolas,"Liberation Mono",Courier,monospace
}
code {
 background:#F8F8F8;
 padding:.1em .4em;
 color:#c82829;
 font-size:13px
}
pre {
 background:0 0;
 line-height:18px;
 overflow:auto;
 padding:20px 25px;
 border-radius:2px
}
pre code {
 border:0;
 padding:0;
 background:0 0;
 color:#000;
 font-size:13px
}
.highlight {
 position:relative;
 margin-bottom:.5em;
 margin-left:-1.5em;
 width:100%;
 padding:0 1.5em;
 background-color:#F5FAFC
}
pre code:before {
 display:block;
 position:absolute;
 right:3px;
 top:6px;
 padding:3px 7px 0;
 color:#889499;
 font-size:12px;
 line-height:13px
}
code.html:before {
 content:'HTML'
}
code.javascript:before {
 content:'JS'
}
code.css:before {
 content:'CSS'
}
#mc_embed_signup {
 max-width:350px;
 padding:32px;
 background:#EEE
}
#mc_embed_signup input[type=email] {
 border:1px solid #CCC;
 border-top:1px solid #999;
 padding:5px;
 font-size:18px;
 width:200px;
 margin-right:10px;
 height:25px;
 transition:all .3s ease;
 -moz-transition:all .3s ease;
 -webkit-transition:all .3s ease;
 border-radius:2px;
 -moz-border-radius:2px;
 -webkit-border-radius:2px
}
#mc_embed_signup input[type=email]:focus {
 background-color:#FFF;
 border:1px solid #3169B3;
 box-shadow:#3169B3 0 0 5px;
 -moz-box-shadow:#3169B3 0 0 5px;
 -webkit-box-shadow:#3169B3 0 0 5px;
 outline:0
}
#mc_embed_signup input[type=submit] {
 border:1px solid #3169B3;
 font-size:13px;
 font-weight:700;
 color:#FFF;
 height:auto;
 padding:8px 13px;
 cursor:pointer;
 background-color:#3169B3;
 display:inline-block;
 width:auto;
 -webkit-appearance:none;
 border-radius:2px;
 -moz-border-radius:2px;
 -webkit-border-radius:2px;
 vertical-align:top
}
.embed-form {
 position:relative
}
#mc_embed_signup #main-wrapper {
 background:0 0;
 max-width:800px;
 width:100%;
 margin:2em auto 4em;
 padding:0 3em 3em;
 -moz-box-sizing:border-box;
 -webkit-box-sizing:border-box;
 box-sizing:border-box;
 position:relative
}
.white-popup-block {
 background:#FFF;
 padding:20px 30px;
 text-align:left;
 max-width:650px;
 margin:40px auto;
 position:relative
}
#examples:after {
 content:'to view source click on the title of example';
 opacity:.4;
 font-weight:400;
 font-size:14px;
 margin-top:13px;
 float:right
}
.example {
 margin-bottom:20px;
 position:relative
}
.square-tmb {
 margin:0 10px 0 0;
 cursor:pointer
}
.zoom-cursor {
 cursor:-webkit-zoom-in;
 cursor:-moz-zoom-in;
 cursor:zoom-in
}
.example a,
a.popup-link {
 text-decoration:none;
 border-bottom:1px dotted
}
.example a:hover,
a.popup-link:hover {
 text-decoration:none
}
#image-gallery a,
#single-image {
 border-bottom:none
}
.not-ready-yet-notice {
 padding:20px;
 background:#EEE
}
#footer {
 border-top:1px solid #DDD;
 padding-top:3em;
 margin:5em 0 0;
 width:100%;
 text-align:center;
 opacity:.9
}
#conditional-lightbox-notice {
 display:none
}
#logo-status {
 opacity:0;
 -webkit-transition:opacity .5s;
 -moz-transition:opacity .5s;
 transition:opacity .5s;
 width:100%;
 text-align:center
}
#logo-status.down {
 opacity:1
}
code.def {
 padding:0;
 background:#FFF;
 border:0;
 display:block;
 margin-bottom:8px;
 margin-top:-10px;
 color:#A3A3A3
}
@media all and (max-width:50em) {
 #logo
}
@media all and (max-width:30em) {
 #examples:after {
  display:none
 }
 .gc3 {
  width:100%
 }
 .grid-c .gc3:nth-of-type(2n+1) {
  clear:none
 }
 #main-wrapper {
  padding:1em;
  margin-top:0
 }
 .highlight {
  padding:.2em 1em;
  margin:1em -1em
 }
}
@media all and (max-width:700px) {
 .zoom-cursor {
  cursor:pointer
 }
 #conditional-lightbox-notice {
  display:block;
  padding:10px;
  background:#FFEAEA
 }
}
#logo-overlay {
 width:100%;
 height:75px;
 background:red;
 position:absolute;
 left:0;
 top:0;
 opacity:0
}
#mfp-build-tool {
 background:#FFF;
 padding:30px 40px 40px;
 max-width:500px;
 text-align:left;
 margin:10px auto;
 position:relative
}
#mfp-build-tool #mfp-build-form label {
 display:block;
 margin-bottom:5px;
 min-height:18px;
 padding-left:18px
}
#mfp-build-form input[type=checkbox] {
 margin:3px 5px 3px -18px;
 line-height:normal;
 cursor:pointer;
 width:auto;
 float:left
}
#mfp-build-status {
 min-height:40px
}
#mfp-build-status .error {
 color:#830C0C
}
#mfp-build-status .success {
 color:#014B04
}
#mfp-build-status .progress {
 color:#000
}
#smashing {
 text-align:center;
 font-weight:700
}
#smashing strong {
 color:#EF4A35
}
.smashing-link {
 margin-left:29px;
 position:relative
}
.smashing-link:before {
 content:'';
 display:inline-block;
 width:24px;
 height:24px;
 background:url(http://dimsemenov.com/images/sm-logo-24x24.png);
 position:absolute;
 top:-4px;
 left:-28px
}
#hackernews {
 margin-left:24px
}
#hackernews:before {
 background:url(http://dimsemenov.com/images/hn-logo-18x18.gif);
 width:18px;
 height:18px;
 top:-1px;
 left:-22px
}
.share-buttons {
 text-align:center
}
.share-buttons .share-buttons {
 position:relative;
 margin:70px 0
}
#tweet {
 background:#0096c4
}
#like {
 background:#3b5998
}
#gplus {
 background:#d34836
}
#vkcom {
 background:#6e8fb1
}
pre .comment,
pre .diff .header,
pre .javadoc,
pre .template_comment {
 color:#998;
 font-style:italic
}
pre .css .rule .keyword,
pre .javascript .title,
pre .keyword,
pre .nginx .title,
pre .request,
pre .status,
pre .subst,
pre .winutils {
 color:#333;
 font-weight:700
}
pre .hexcolor,
pre .number,
pre .ruby .constant {
 color:#099
}
pre .phpdoc,
pre .string,
pre .tag .value,
pre .tex .formula {
 color:#D01040
}
pre .id,
pre .title {
 color:#900;
 font-weight:700
}
pre .clojure .title,
pre .javascript .title,
pre .lisp .title,
pre .subst {
 font-weight:400
}
pre .class .title,
pre .haskell .type,
pre .tex .command,
pre .vhdl .literal {
 color:#458;
 font-weight:700
}
pre .django .tag .keyword,
pre .rules .property,
pre .tag,
pre .tag .title {
 color:navy;
 font-weight:400
}
pre .attribute,
pre .lisp .body,
pre .variable {
 color:teal
}
pre .regexp {
 color:#009926
}
pre .class {
 color:#458;
 font-weight:700
}
pre .built_in,
pre .clojure .built_in,
pre .lisp .title {
 color:#0086b3
}
pre .cdata,
pre .doctype,
pre .pi,
pre .preprocessor,
pre .shebang {
 color:#999;
 font-weight:700
}
pre .deletion {
 background:#fdd
}
pre .addition {
 background:#dfd
}
pre .diff .change {
 background:#0086b3
}
pre .chunk {
 color:#aaa
}
#documentation-intro {
 background:#2b2b2b;
 text-align:center;
 padding:3em;
 width:100%;
 margin-left:-3em;
 margin-bottom:3em
}
#documentation-intro #id1 {
 display:none
}
.hll {
 background-color:#ffc
}
.c {
 color:#998;
 font-style:italic
}
.err {
 color:#a61717;
 background-color:#e3d2d2
}
.k,
.o {
 color:#000;
 font-weight:700
}
.cm {
 color:#998;
 font-style:italic
}
.cp {
 color:#999;
 font-weight:700;
 font-style:italic
}
.c1 {
 color:#998;
 font-style:italic
}
.cs {
 color:#999;
 font-weight:700;
 font-style:italic
}
.gd {
 color:#000;
 background-color:#fdd
}
.ge {
 color:#000;
 font-style:italic
}
.gr {
 color:#a00
}
.gh {
 color:#999
}
.gi {
 color:#000;
 background-color:#dfd
}
.go {
 color:#888
}
.gp {
 color:#555
}
.gs {
 font-weight:700
}
.gu {
 color:#aaa
}
.gt {
 color:#a00
}
.kc,
.kd,
.kn,
.kp,
.kr {
 color:#000;
 font-weight:700
}
.kt {
 color:#458;
 font-weight:700
}
.m {
 color:#099
}
.s {
 color:#d01040
}
.na {
 color:teal
}
.nb {
 color:#0086b3
}
.nc {
 color:#458;
 font-weight:700
}
.no {
 color:teal
}
.nd {
 color:#3c5d5d;
 font-weight:700
}
.ni {
 color:purple
}
.ne,
.nf,
.nl {
 color:#900;
 font-weight:700
}
.nn {
 color:#555
}
.nt {
 color:navy
}
.nv {
 color:teal
}
.ow {
 color:#000;
 font-weight:700
}
.w {
 color:#bbb
}
.mf,
.mh,
.mi,
.mo {
 color:#099
}
.s2,
.sb,
.sc,
.sd,
.se,
.sh,
.si,
.sx {
 color:#d01040
}
.sr {
 color:#009926
}
.s1 {
 color:#d01040
}
.ss {
 color:#990073
}
.bp {
 color:#999
}
.vc,
.vg,
.vi {
 color:teal
}
.il {
 color:#099
}
.mfp-bg {
 top:0;
 left:0;
 width:100%;
 height:100%;
 z-index:1042;
 overflow:hidden;
 position:fixed;
 background:#0b0b0b;
 opacity:.8;
 filter:alpha(opacity=80)
}
.mfp-wrap {
 top:0;
 left:0;
 width:100%;
 height:100%;
 z-index:1043;
 position:fixed;
 outline:0!important;
 -webkit-backface-visibility:hidden
}
.mfp-container {
 text-align:center;
 position:absolute;
 width:100%;
 height:100%;
 left:0;
 top:0;
 padding:0 8px;
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 box-sizing:border-box
}
.mfp-container:before {
 content:'';
 display:inline-block;
 height:100%;
 vertical-align:middle
}
.mfp-align-top .mfp-container:before {
 display:none
}
.mfp-content {
 position:relative;
 display:inline-block;
 vertical-align:middle;
 margin:0 auto;
 text-align:left;
 z-index:1045
}
.mfp-ajax-holder .mfp-content,
.mfp-inline-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:-moz-zoom-out;
 cursor:-webkit-zoom-out;
 cursor:zoom-out
}
.mfp-zoom {
 cursor:pointer;
 cursor:-webkit-zoom-in;
 cursor:-moz-zoom-in;
 cursor:zoom-in
}
.mfp-auto-cursor .mfp-content {
 cursor:auto
}
.mfp-arrow,
.mfp-close,
.mfp-counter,
.mfp-preloader {
 -webkit-user-select:none;
 -moz-user-select:none;
 user-select:none
}
.mfp-loading.mfp-figure {
 display:none
}
.mfp-hide {
 display:none!important
}
.mfp-preloader {
 color:#CCC;
 position:absolute;
 top:50%;
 width:auto;
 text-align:center;
 margin-top:-.8em;
 left:8px;
 right:8px;
 z-index:1044
}
.mfp-s-error .mfp-content,
.mfp-s-ready .mfp-preloader {
 display:none
}
button.mfp-arrow,
button.mfp-close {
 overflow:visible;
 cursor:pointer;
 background:0 0;
 border:0;
 -webkit-appearance:none;
 display:block;
 outline:0;
 padding:0;
 z-index:1046;
 -webkit-box-shadow:none;
 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:.65;
 filter:alpha(opacity=65);
 padding:0 0 18px 10px;
 color:#FFF;
 font-style:normal;
 font-size:28px;
 font-family:Arial,Baskerville,monospace
}
.mfp-close:focus,
.mfp-close:hover {
 opacity:1;
 filter:alpha(opacity=100)
}
.mfp-close:active {
 top:1px
}
.mfp-close-btn-in .mfp-close {
 color:#333
}
.mfp-iframe-holder .mfp-close,
.mfp-image-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;
 white-space:nowrap
}
.mfp-arrow {
 position:absolute;
 opacity:.65;
 filter:alpha(opacity=65);
 margin:-55px 0 0;
 top:50%;
 padding:0;
 width:90px;
 height:110px;
 -webkit-tap-highlight-color:transparent
}
.mfp-arrow:active {
 margin-top:-54px
}
.mfp-arrow:focus,
.mfp-arrow:hover {
 opacity:1;
 filter:alpha(opacity=100)
}
.mfp-arrow .mfp-a,
.mfp-arrow .mfp-b,
.mfp-arrow:after,
.mfp-arrow:before {
 content:'';
 display:block;
 width:0;
 height:0;
 position:absolute;
 left:0;
 top:0;
 margin-top:35px;
 margin-left:35px;
 border:inset transparent
}
.mfp-arrow .mfp-a,
.mfp-arrow:after {
 border-top-width:13px;
 border-bottom-width:13px;
 top:8px
}
.mfp-arrow .mfp-b,
.mfp-arrow:before {
 border-top-width:21px;
 border-bottom-width:21px;
 opacity:.7
}
.mfp-arrow-left {
 left:0
}
.mfp-arrow-left .mfp-a,
.mfp-arrow-left:after {
 border-right:17px solid #FFF;
 margin-left:31px
}
.mfp-arrow-left .mfp-b,
.mfp-arrow-left:before {
 margin-left:25px;
 border-right:27px solid #3F3F3F
}
.mfp-arrow-right {
 right:0
}
.mfp-arrow-right .mfp-a,
.mfp-arrow-right:after {
 border-left:17px solid #FFF;
 margin-left:39px
}
.mfp-arrow-right .mfp-b,
.mfp-arrow-right:before {
 border-left:27px solid #3F3F3F
}
.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,.6);
 background:#000
}
img.mfp-img {
 width:auto;
 max-width:100%;
 height:auto;
 display:block;
 line-height:0;
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 box-sizing:border-box;
 padding:40px 0;
 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,.6);
 background:#444
}
.mfp-figure small {
 color:#BDBDBD;
 display:block;
 font-size:12px;
 line-height:14px
}
.mfp-figure figure {
 margin: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,.6);
  bottom:0;
  margin:0;
  top:auto;
  padding:3px 5px;
  position:fixed;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box
 }
 .mfp-img-mobile .mfp-bottom-bar:empty {
  padding:0
 }
 .mfp-img-mobile .mfp-counter {
  right:5px;
  top:3px
 }
 .mfp-img-mobile .mfp-close {
  top:0;
  right:0;
  width:35px;
  height:35px;
  line-height:35px;
  background:rgba(0,0,0,.6);
  position:fixed;
  text-align:center;
  padding:0
 }
}
@media all and (max-width:900px) {
 .mfp-arrow {
  -webkit-transform:scale(.75);
  transform:scale(.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