@font-face{font-family:'PT Sans';src:url(../fonts/PTSans.woff) format("woff")}

@font-face{font-weight:bold;font-family:'PT Sans';src:url(../fonts/PTSans.Bold.woff) format("woff")}

@font-face{font-style:italic;font-family:'PT Sans';src:url(../fonts/PTSans.Italic.woff) format("woff")}

@font-face{font-style:italic;font-weight:bold;font-family:'PT Sans';src:url(../fonts/PTSans.Bold.Italic.woff) format("woff")}

@font-face{font-family:'PT Sans Narrow';font-weight:bold;src:url(../fonts/PTSans.Narrow.Bold.woff) format("woff")}

@font-face{font-family:'PT Mono';src:url(../fonts/PTMono.woff) format("woff")}


html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}

sub,sup {margin:0;padding:0;border:0;font-size:75%;font:inherit}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}


body{line-height:1}


ol,ul{list-style:none}


blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}


table{border-collapse:collapse;border-spacing:0}


body{counter-reset:slide;font:25px/2 "PT Sans",sans-serif}


a{text-decoration:none}


.caption{display:none;margin:0 0 50px;color:#3C3D40;text-shadow:0 1px 1px #8d8e90}


.caption h1{font:bold 50px/1 "PT Sans Narrow",sans-serif}

.caption a{color:#4B86C2;text-shadow:0 -1px 1px #1f3f60;text-decoration:none}

.caption a:hover{color:#5394D7}


.slide{position:relative;width:1024px;height:640px;color:#000;background-color:#fff;-webkit-print-color-adjust:exact;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none} /* background:#fff url(../images/ribbon.svg) 865px 0 no-repeat; */

.slide:after{position:absolute;left:120px;bottom:18px;color:#ffc700;counter-increment:slide;content:counter(slide, decimal-leading-zero);line-height:18px;font-size:18px}

.slide>div{position:absolute;top:0;left:0;overflow:hidden;padding:70px 120px 0;width:784px;height:570px}

.debug .slide{background:url(../images/grid-16x10.svg) no-repeat,#fff}
.slide h2{margin:0 0 37px;color:#666;font:bold 50px/1 "PT Sans Narrow",sans-serif}
.slide p{margin:0 0 50px}
.slide p.note{color:#999}
/* .slide a{border-bottom:0.1em solid;color:#0174A7} */
.slide b,.slide strong{font-weight:bold}
.slide i,.slide em{font-style:italic}
.slide kbd,.slide code,.slide samp{padding:3px 8px;border-radius:8px;background:#FAFAA2;color:#000;-moz-tab-size:4;-o-tab-size:4;tab-size:4;line-height:1;font-family:"PT Mono",monospace}
.slide blockquote{font-style:italic}
.slide blockquote:before{position:absolute;margin:-16px 0 0 -80px;color:#CCC;font:200px/1 "PT Sans",sans-serif;content:'\201C'}
.slide blockquote+figcaption{margin:-50px 0 50px;font-style:italic;font-weight:bold}
.slide ol,.slide ul{margin:0 0 50px 2em;counter-reset:list}
.slide ol li,.slide ul li{text-indent:-2em}
.slide ol li:before,.slide ul li:before{display:inline-block;width:2em;color:#BBB;text-align:right}
.slide ol ol,.slide ol ul,.slide ul ol,.slide ul ul{margin:0 0 0 2em}

/* .slide ul>li:before{content:'\2022\00A0\00A0'}
.slide ul>li:lang(ru):before{content:'\2014\00A0\00A0'}  */

.slide ol>li:before{counter-increment:list;content:counter(list) ".\00A0"}
.slide pre{margin:0 0 49px;padding:1px 0 0;counter-reset:code;white-space:normal}
.slide pre code{display:block;padding:0;background:none;white-space:pre;line-height:50px}
.slide pre code:before{position:absolute;margin:0 0 0 -110px;width:100px;color:#BBB;text-align:right;counter-increment:code;content:counter(code, decimal-leading-zero) "."}
.slide pre code:only-child:before{content:''}
.slide pre mark{padding:3px 8px;border-radius:8px;background:#F7FCA0;color:#000;font-style:normal}
.slide pre mark.important{background:#C00;color:#FFF;font-weight:normal}
.slide pre mark.comment{padding:0;background:none;color:#999}
.slide.cover,.slide.shout{z-index:1}
.slide.cover:after,.slide.shout:after{content:''}
.slide.cover{background:#000}
.slide.cover img,.slide.cover svg,.slide.cover video,.slide.cover object,.slide.cover canvas{position:absolute;top:0;left:0;z-index:-1}
.slide.cover.w img,.slide.cover.w svg,.slide.cover.w video,.slide.cover.w object,.slide.cover.w canvas{top:50%;width:100%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}
.slide.cover.h img,.slide.cover.h svg,.slide.cover.h video,.slide.cover.h object,.slide.cover.h canvas{left:50%;height:100%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%)}
.slide.cover.w.h img,.slide.cover.w.h svg,.slide.cover.w.h video,.slide.cover.w.h object,.slide.cover.w.h canvas{top:0;left:0;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
.slide.shout{background-image:none}
.slide.shout h2{position:absolute;top:50%;left:0;width:100%;text-align:center;line-height:1;font-size:150px;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}
.slide .place{position:absolute}
.slide .place.t,.slide .place.m,.slide .place.b{left:50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%)}
.slide .place.t{top:0}
.slide .place.b{bottom:0}
.slide .place.l,.slide .place.m,.slide .place.r{top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}
.slide .place.l{left:0}
.slide .place.m{-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}
.slide .place.r{right:0;left:auto}
.slide .place.t.l,.slide .place.t.r,.slide .place.b.r,.slide .place.b.l{-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}
.slide .place.t.l,.slide .place.t.r{top:0}
.slide .place.b.r,.slide .place.b.l{top:auto}
.slide footer{position:absolute;left:0;right:0;bottom:-640px;z-index:1;display:none;padding:20px 120px;background:#FAFAA2;box-shadow:0 0 0 2px rgba(0,0,0,0.05) inset;-webkit-transition:bottom 0.3s;-moz-transition:bottom 0.3s;-o-transition:bottom 0.3s;transition:bottom 0.3s}
.slide:hover footer{bottom:0}
@media screen{.list{position:absolute;clip:rect(0, auto, auto, 0);padding:80px 0 40px 100px;background:#585a5e url(../images/linen.png)}
.list .caption,.list .badge{display:block}
.list .slide{float:left;margin:0 -412px -220px 0;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-ms-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5)}
.list .slide:before{position:absolute;top:0;left:0;z-index:-1;width:512px;height:320px;box-shadow:0 0 30px rgba(0,0,0,0.005),0 20px 50px rgba(42,43,45,0.6);border-radius:2px;content:'';-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(2);-moz-transform:scale(2);-ms-transform:scale(2);-o-transform:scale(2);transform:scale(2)}
.list .slide:after{bottom:-80px;left:120px;color:#3C3D40;text-shadow:0 1px 1px #8d8e90;font-weight:bold;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(2);-moz-transform:scale(2);-ms-transform:scale(2);-o-transform:scale(2);transform:scale(2)}
.list .slide:hover:before{box-shadow:0 0 0 10px rgba(42,43,45,0.3),0 20px 50px rgba(42,43,45,0.6)}
.list .slide:target:before{box-shadow:0 0 0 1px #305f8d,0 0 0 10px #3c7cbd,0 20px 50px rgba(42,43,45,0.6)}
.list .slide:target:after{text-shadow:0 1px 1px rgba(42,43,45,0.6);color:#4B86C2}
.list .slide>div:before{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;content:''}
.list .slide.cover:after,.list .slide.shout:after{content:counter(slide)}
.list .slide footer{display:block}
.full{position:absolute;top:50%;left:50%;overflow:hidden;margin:-320px 0 0 -512px;width:1024px;height:640px;background:#000}
.full .slide{position:absolute;top:0;left:0;margin-left:150%}
.full .slide li.next{display:none}
.full .slide li.next.active{display:block}
.full .slide:target{margin:0}
.full .progress{position:absolute;right:118px;bottom:10px;left:118px}
.full .progress div{width:0;height:10px;box-shadow:0 0 0 1px rgb(255,204,0);border-radius:5px;background:rgba(177,177,177,0.4);-webkit-transition:width 0.2s linear;-moz-transition:width 0.2s linear;-o-transition:width 0.2s linear;transition:width 0.2s linear}
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi){.list{background-image:url(../images/linen@2x.png);background-size:256px}
}
@media screen and (max-width: 1324px){.list .slide{margin:0 -688px -400px 0;-webkit-transform:scale(0.25);-moz-transform:scale(0.25);-ms-transform:scale(0.25);-o-transform:scale(0.25);transform:scale(0.25)}
}
@media screen and (max-width: 1324px){.list .slide:before{width:256px;height:160px;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}
}
@media screen and (max-width: 1324px){.list .slide:after{bottom:-104px;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}
}
@media screen and (max-width: 1324px){.list .slide:target:before{box-shadow:0 0 0 1px #305f8d,0 0 0 10px #3c7cbd,0 20px 50px rgba(42,43,45,0.6)}
}
@page{margin:0;size:1024px 640px}

.wrapper ul
{
  width: 40em; 
}
.wrapper ul li
{
  float: left;
  width: 50%;  /* accommodate the widest item */
}
/* stop the floating after the list */
br
{
  clear: left;
}
/* separate the list from what follows it */
div.wrapper
{
  margin-bottom: 1em;
}

/* anchor styling */
ul li a
{
  text-decoration: none;
}
ul li a:hover
{
  color: #FFF; /* white */
  background-color: #A52A2A; /* brown */
}

.wrapper.vertical-list ul {
                width: 43%;
                float: left;
}

.wrapper.vertical-list ul li {
                float: none;
                width: auto;
}
