diff --git a/index.html b/index.html index bd29b9c..2bfd772 100644 --- a/index.html +++ b/index.html @@ -25,11 +25,8 @@ - - - - - + + diff --git a/package.json b/package.json index c193c58..14c90fc 100644 --- a/package.json +++ b/package.json @@ -28,12 +28,18 @@ }, "homepage": "https://github.com/jlantunez/webslides#readme", "devDependencies": { + "autoprefixer": "^6.7.6", "babel-cli": "^6.23.0", "babel-core": "^6.23.1", "babel-loader": "^6.3.2", "babel-preset-es2015": "^6.22.0", + "css-loader": "^0.26.2", + "extract-text-webpack-plugin": "^2.1.0", "npm-run-all": "^4.0.2", + "postcss-loader": "^1.3.3", "rimraf": "^2.6.0", + "sass-loader": "^6.0.2", + "style-loader": "^0.13.2", "webpack": "^2.2.1", "webpack-dev-server": "^2.4.1" }, diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..ab1ee60 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,7 @@ +module.exports = { + plugins: [ + require('autoprefixer')({ + browsers: ['last 2 versions'], + }) + ] +}; \ No newline at end of file diff --git a/src/js/full.js b/src/js/full.js index ad71d64..14b3b2a 100644 --- a/src/js/full.js +++ b/src/js/full.js @@ -1,3 +1,4 @@ import WebSlides from './modules/webslides'; +require('../scss/full.scss'); window.WebSlides = WebSlides; diff --git a/static/css/base.css b/src/scss/_base.scss similarity index 100% rename from static/css/base.css rename to src/scss/_base.scss diff --git a/static/css/colors.css b/src/scss/_colors.scss similarity index 100% rename from static/css/colors.css rename to src/scss/_colors.scss diff --git a/src/scss/full.scss b/src/scss/full.scss new file mode 100644 index 0000000..a7262d9 --- /dev/null +++ b/src/scss/full.scss @@ -0,0 +1,2 @@ +@import 'base'; +@import 'colors'; \ No newline at end of file diff --git a/static/css/webslides.css b/static/css/webslides.css new file mode 100644 index 0000000..4218f71 --- /dev/null +++ b/static/css/webslides.css @@ -0,0 +1 @@ +a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}body{line-height:1}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;box-sizing:border-box}*,:after,:before{box-sizing:inherit}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}embed,iframe,object{max-width:100%}audio:not([controls]){display:none;height:0}[hidden],template{display:none}ul{list-style:square;text-indent:inherit}ol{list-style:decimal}b,strong{font-weight:600}a{background-color:transparent}a:active,a:hover{outline:0}sub,sup{font-size:.75em;line-height:2.2em;height:0;line-height:0;position:relative;vertical-align:baseline}sup{bottom:1ex}sub{top:.5ex}small{font-size:.75em;line-height:1.72}big{font-size:1.25em}hr{border:none;clear:both;display:block;height:1px;width:100%;text-align:center;margin:3.2rem auto}h2+hr,h3+hr{margin-bottom:4.8rem}p+hr{margin-bottom:4rem}cite,dfn,em,i{font-style:italic}abbr,acronym{cursor:help}ins,mark{text-decoration:none;padding:0 4px;text-shadow:none}::-moz-selection{text-shadow:none}::-webkit-selection{text-shadow:none}::selection{text-shadow:none}img{border:0;height:auto;max-width:100%}img:hover{opacity:.9;filter:alpha(opacity=90)}svg:not(:root){overflow:hidden}figure{position:relative;margin:0;line-height:0}optgroup{font-weight:700}table{width:100%;border-collapse:collapse;border-spacing:0;margin-bottom:24px}td,th{padding:0}blockquote:after,blockquote:before,q:after,q:before{content:""}blockquote,q{quotes:"" ""}dt{font-weight:700}dd{margin:0}.clear:after,.clear:before,.wrap:after,.wrap:before,aside:after,aside:before,footer:after,footer:before,group:after,group:before,header:after,header:before,main:after,main:before,section:after,section:before{content:"";display:table}.clear:after,.wrap:after,aside:after,footer:after,group:after,header:after,main:after,section:after{clear:both}body,html{width:100%;height:100%;overflow:hidden}#webslides{height:100vh;overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch;-ms-overflow-style:none}#webslides::-webkit-scrollbar{display:none}body.baseline{background:url(../images/baseline.png) left top .8rem/.8rem}li li{margin-left:1.6rem}a,a:active,a:focus,a:visited,button,input:focus,textarea:focus{text-decoration:none;transition:all .3s ease-out}p a:active{position:relative;top:2px}.hidden,nav a[rel=external] em{clip:rect(1px,1px,1px,1px);position:absolute!important;height:1px;width:1px;overflow:hidden}.shadow{position:relative}.shadow:after,.shadow:before{z-index:-1;position:absolute;content:"";bottom:1.6rem;left:2.4rem;width:50%;top:80%;max-width:300px;transform:rotate(-3deg)}.shadow:after{transform:rotate(3deg);right:2.4rem;left:auto}.wrap,footer nav,header nav{position:relative;width:1200px;max-width:100%;margin-right:auto;margin-left:auto;z-index:2}.frame,.shadow{padding:2.4rem}.radius{border-radius:.4rem}.alignright{float:right}.alignleft{float:left}.aligncenter{margin-right:auto;margin-left:auto;text-align:center}img.aligncenter{display:block}img.aligncenter,img.alignleft,img.alignright{margin-top:2.4rem;margin-bottom:2.4rem}@media (min-width:768px){img.aligncenter{margin-top:.8rem;margin-bottom:.8rem}img.alignright,svg.alignright{margin:.8rem 0 .8rem 4.8rem}img.alignleft,svg.alignright{margin:.8rem 4.8rem .8rem 0}}@media (min-width:1024px){.size-80{width:80%}.size-70{width:70%}.size-60{width:60%}.size-50{width:50%}.size-40{width:40%}.size-30{width:30%}.size-20{width:20%}}code,pre{font-family:Cousine,monospace}pre{font-size:1.6rem;line-height:2.4rem;white-space:pre-wrap;word-wrap:break-word;text-align:left;padding:2.4rem;overflow:auto;width:100%}pre+p{margin-top:3.2rem}code{padding:.4rem}pre code{padding:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fadeIn{animation:fadeIn 1s}@keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}.fadeInUp{animation:fadeInUp 1s}@keyframes zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{animation:zoomIn 1s}@keyframes slideInLeft{0%{transform:translate3d(-100%,0,0);visibility:visible}to{transform:translateZ(0)}}.slideInLeft{animation:slideInLeft 1s}@keyframes slideInRight{0%{transform:translate3d(100%,0,0);visibility:visible}to{transform:translateZ(0)}}.slideInRight{animation:slideInRight 1s}@keyframes anim{0%{transform:translateY(0)}to{transform:translateY(-1200px)}}.slow{animation-duration:4s}.slow+.slow{animation-duration:5s}#navigation,footer,header{transition:all .4s ease-in-out}.embed{position:relative;height:0;overflow:hidden;padding-bottom:56.6%}.embed embed,.embed iframe,.embed object{position:absolute;top:0;left:0;width:100%;height:100%;margin:0}h1+.browser,h2+.browser,p+.browser{margin-top:4.8rem}.browser{overflow:hidden;border-radius:.3rem;max-width:1024px;margin:0 auto 3.2rem}.browser figcaption{padding:2.4rem}li .browser{margin-bottom:0}.browser:before{position:absolute;top:0;left:0;text-align:left;font-size:.8rem;padding:1.6rem;width:100%;line-height:0;content:"\25CF \25CF \25CF"}@media (min-width:768px){.browser:before{font-size:1.6rem}}.browser img{width:100%;margin-top:3.2rem}.grid{margin-right:auto;margin-left:auto;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;clear:both}.grid:before{content:"";display:table}.grid:after{clear:both}.grid>.column{position:relative;width:100%;display:-ms-flexbox;display:flex;-ms-flex:auto;flex:auto;-ms-flex-direction:column;flex-direction:column;transition:.3s;padding:2.4rem}.grid.vertical-align .column{-ms-flex-pack:center;justify-content:center}@media (min-width:768px){.grid>.column{width:25%}.grid.sm .column:first-child{width:30%}.grid.ms .column:first-child,.grid.sm .column:nth-child(2){width:70%}.grid.ms .column:nth-child(2){width:30%}.grid.sms .column:nth-child(2){width:50%}}body,html{line-height:1;text-rendering:optimizeLegibility;font-weight:300}body,html,input,select,textarea{font-family:Roboto,San Francisco,helvetica,arial,sans-serif;font-size:62.5%}body,textarea{font-size:1.8rem}big,label,li,p,table,textarea,time{line-height:3.2rem;margin-bottom:3.2rem}li,p:last-child{margin-bottom:0}ol>li,ul>li{margin-left:3.2rem}li li{font-size:100%}ul.description{padding:0}.description+p{margin-top:3.2rem}.description li{position:relative;padding-top:.8rem;padding-bottom:.8rem;transition:.3s}.description li:hover{padding-left:.4rem}.column ul li,ul.description li{list-style:none;margin-left:0}.column ol>li{margin-left:1.6rem}h1 svg,h2 svg,h3 svg,h4 svg{margin-top:-.8rem}.text-intro svg,.try svg,.wall p svg{margin-top:-.4rem}.flexblock li h2 svg,.flexblock li h3 svg{margin-top:0}h1{font-size:4rem;line-height:5.6rem}h1 span{font-style:italic}h2{font-size:3.2rem;line-height:4.8rem}h3{font-size:2.4rem}h3,h4{line-height:4rem}h4{font-size:2.2rem}h5{font-size:2rem}h5,h6{font-weight:600;line-height:3.2rem}h6{font-size:1.8rem}h2.alignleft+p.alignright{margin-top:1.2rem;margin-bottom:0}h3.alignleft+p.alignright{margin-top:.4rem;margin-bottom:0}@media (min-width:768px){h1{font-size:5.6rem;line-height:7.2rem}h2{font-size:4.8rem;line-height:6.4rem}h3{font-size:4rem;line-height:5.6rem}h4{font-size:3.2rem;line-height:4.8rem}}h1+h1,h1+h2,h1+h3,h1+h4,h1+h5,h1+h6,h2+h1,h2+h2,h2+h3,h2+h4,h2+h5,h2+h6,h3+h1,h3+h2,h3+h3,h3+h4,h3+h5,h3+h6,h4+h1,h4+h2,h4+h3,h4+h4,h4+h5,h4+h6,h5+h1,h5+h2,h5+h3,h5+h4,h5+h5,h5+h6,h6+h1,h6+h2,h6+h3,h6+h4,h6+h5,h6+h6{margin-top:.8rem}h1+img,h2+img,h3+img{margin-top:4.8rem;margin-bottom:4.8rem}[class*=content-]>[class*=content-] h2,[class*=content-]>[class*=content-] h3,[class*=content-]>[class*=content-] h4{font-size:2.4rem;line-height:4rem}h1[class*=bg-],h2[class*=bg-],h3[class*=bg-],h4[class*=bg-],h5[class*=bg-],h6[class*=bg-],li[class*=bg-],ol[class*=bg-],p[class*=bg-],ul[class*=bg-]{padding:2.4rem}h1 [class*=bg-],h2 [class*=bg-],h3 [class*=bg-]{padding:.4rem .8rem}.text-intro,[class*=content-] p{font-size:2.4rem;line-height:4rem}.text-serif,h1 span{font-family:Maitree,times,serif}.text-landing{letter-spacing:.4rem;text-transform:uppercase}@media (min-width:768px){.text-landing{letter-spacing:1.6rem}}p.text-subtitle{font-size:1.6rem}p.text-subtitle svg{vertical-align:text-top}.text-subtitle{text-transform:uppercase;letter-spacing:.2rem;margin-bottom:0}.text-subtitle+p{margin-top:3.2rem}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-data{font-size:6.4rem;line-height:8rem;margin-bottom:.8rem}@media (min-width:768px){.text-data{font-size:15.2rem;line-height:16.8rem}}.text-label{font-weight:600;display:inline-block;width:12.8rem;text-transform:uppercase}@media (min-width:768px){.text-cols{-moz-column-count:2;column-count:2;-moz-column-gap:4.8rem;column-gap:4.8rem;text-align:left}.text-landing+.text-cols{margin-top:3.2rem}}.text-cols p:first-child:first-letter{font-size:11rem;font-weight:600;text-transform:uppercase;float:left;padding:0;margin:-.4rem 1.6rem 0 0;line-height:1}.text-context{position:relative}.text-context.text-uppercase{letter-spacing:.1rem}.text-context:before{content:"";display:block;width:12rem;height:.2rem;margin-bottom:.6rem}.column .text-context:before{width:100%}.text-symbols{font-weight:600;letter-spacing:.8rem;text-align:center}.text-separator{margin-top:2.4rem}.text-separator:before{position:absolute;width:16%;height:.4rem;content:"";margin-top:-1.6rem;left:0}@media (min-width:568px){.text-separator{width:80%;margin-top:0;margin-left:20%}.text-separator:before{margin-top:1.2rem}}[class*=text-pull]{position:relative;font-size:2.4rem;line-height:4rem;font-weight:400;margin-right:2.4rem;margin-left:2.4rem}[class*=text-pull-]{padding-top:1.4rem;margin-top:.8rem}@media (min-width:1024px){[class*=text-pull]{margin-right:-4rem;margin-left:-4rem}}@media (min-width:568px){[class*=text-pull-]{width:32rem}.text-pull-right{float:right;margin-right:-2.4rem;margin-left:2.4rem}.text-pull-left{float:left;margin-left:-2.4rem;margin-right:2.4rem}}.text-info{font-size:1.6rem;line-height:2.4rem}.bg-apple,.text-apple{font-family:San Francisco,helvetica,arial,sans-serif}@font-face{font-family:San Francisco;font-weight:100;src:url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-ultralight-webfont.woff2")}@font-face{font-family:San Francisco;font-weight:200;src:url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-thin-webfont.woff2")}@font-face{font-family:San Francisco;font-weight:400;src:url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-regular-webfont.woff2")}@font-face{font-family:San Francisco;font-weight:700;src:url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-bold-webfont.woff2")}#navigation,footer,header{width:100%;padding:2.4rem}footer p,header p{line-height:4.8rem;margin-bottom:0}footer img,header[role=banner] img{height:4rem;vertical-align:middle}header,section footer{position:absolute;top:0;left:0;z-index:3}section footer{top:auto;bottom:0}header[role=banner]{opacity:0}header[role=banner]:hover{opacity:1}@media (max-width:767px){footer .alignleft,footer .alignright{float:none;display:block}}.logo{text-transform:lowercase}.logo a{background:url(../images/logos/logo.svg) no-repeat 0 0;background-size:4.8rem;width:4.8rem;height:4.8rem;vertical-align:middle;float:left;text-indent:-4000px}nav ul{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:start;justify-content:flex-start}nav ul li{position:relative;float:left;list-style:none}nav[role=navigation] ul li,nav ul li:first-child{margin-left:0}nav[role=navigation] li a{position:relative;padding:0 1.6rem;line-height:4.8rem;text-decoration:none;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;max-width:100%}nav[role=navigation] li a svg{margin:1.5rem .4rem 1.5rem 0}header nav ul{margin:0;-ms-flex-pack:end;justify-content:flex-end}.aligncenter nav ul,nav.aligncenter ul{-ms-flex-pack:center;justify-content:center}nav.navbar ul li{-ms-flex:1 1 auto;flex:1 1 auto}@media (max-width:568px){nav.navbar ul{-ms-flex-flow:column wrap;flex-flow:column wrap;padding:0}nav.navbar li a{-ms-flex-pack:start;justify-content:flex-start}}section *{animation:fadeIn .3s ease-in-out}[class*=background-].dark,[class*=background-].light,section .background,section .background-video{animation-duration:0s}.slide,section{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding:2.4rem;word-wrap:break-word;page-break-after:always;min-height:100vh}@media (min-width:1024px){.slide,section{padding-top:12rem;padding-bottom:12rem}}.fullscreen{padding:0}.slide-top{-ms-flex-pack:start;justify-content:flex-start}.slide-bottom{-ms-flex-pack:end;justify-content:flex-end}[class*=content-]{position:relative;text-align:left}.wrap.frame,.wrap[class*=bg-],[class*=align][class*=bg-],[class*=content-].frame,[class*=content-][class*=bg-]{padding:4.8rem}[class*=content-]>[class*=content-] p{font-size:1.8rem;line-height:3.2rem}.content-center{margin:0 auto;text-align:center}@media (min-width:768px){[class*=content-]{width:50%}.content-left{float:left}.content-right{float:right}[class*=content-]+[class*=content-]{padding-left:2.4rem;margin-bottom:4.8rem}[class*=content-]+[class*=size-]{margin-top:6.4rem;clear:both}[class*=content-]:after,[class*=content-]:before{content:"";display:table}[class*=content-]:after{clear:both}}#navigation{position:fixed;width:24.4rem;margin-right:auto;margin-left:auto;right:0;bottom:0;left:0;z-index:3;animation:fadeIn 16s;opacity:0}#navigation:hover{opacity:1}#counter{position:relative;display:block;width:10rem;margin-right:auto;margin-left:auto;text-align:center;line-height:4.8rem}#navigation p{margin-bottom:0}#navigation a{position:absolute;width:4rem;height:4rem;border-radius:.4rem;text-align:center;font-size:2.4rem;padding:.8rem;cursor:pointer}a#next{right:3.2rem}a#previous{left:3.2rem}@media (max-width:1024px){#navigation{background:url("../images/swipe.svg") no-repeat top;background-size:4.8rem;animation:fadeIn 6s}#counter,#navigation a{display:none}}.background,[class*=background-]{position:absolute;top:0;right:0;bottom:0;left:0;background-repeat:no-repeat}.background{background-position:50%;background-size:cover}.background-top{background-position:top;background-size:cover}.background-bottom{background-position:bottom;background-size:cover}.background-video{width:100%;height:100%;object-fit:fill}.background-center{background-position:50%}.background-center-top{background-position:top}.background-right-top{background-position:100% 0}.background-left-top{background-position:0 0}.background-center-bottom,.background-left,.background-left-bottom,.background-right,.background-right-bottom{background-position:bottom}@media (min-width:1024px){.background-left-bottom{background-position:0 100%}.background-right-bottom{background-position:100% 100%}.background-right{background-position:100%}.background-left{background-position:0}}[class*=bg-] .background.light,[class*=bg-] [class*=background-].light{filter:alpha(opacity=8000);opacity:.8;filter:alpha(opacity=8)}[class*=bg-] .background.dark,[class*=bg-] [class*=background-].dark{filter:alpha(opacity=2000);opacity:.2;filter:alpha(opacity=2)}[class*=bg-] .background-video.dark{filter:alpha(opacity=5000);opacity:.5;filter:alpha(opacity=5)}@media (max-width:1023px){[class*=background-]{opacity:.2;animation:fadeIn ease-in .2}.background-video{opacity:.8}}.background.anim{height:200%;background-size:100%;background-repeat:repeat;background-position:top;animation:anim 80s linear infinite}.flexblock{margin-right:auto;margin-left:auto;padding:0;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;clear:both}.flexblock:before{content:"";display:table}.flexblock:after{clear:both}.flexblock.blink li>a,.flexblock li{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:0;padding:2.4rem}.flexblock li{-ms-flex:auto;flex:auto;text-align:left;width:100%;transition:.3s}.flexblock li:hover{transform:translateY(-.2rem)}.flexblock.aligncenter li{text-align:center}.flexblock.vertical-align li{-ms-flex-pack:center;justify-content:center}.flexblock.blink li{padding:0}@media (min-width:600px){.flexblock li{width:50%}}@media (min-width:1024px){.flexblock li{width:25%}}div+ol,div+ul,h1+.flexblock,h2+.flexblock,h3+.flexblock{margin-top:3.2rem}.flexblock li h2,.flexblock li h3,footer .column h2,footer .column h3{margin-bottom:0;font-size:1.8rem;font-weight:600;line-height:3.2rem}.flexblock.features>li{width:100%;border-radius:.4rem;margin-bottom:4.8rem}@media (min-width:768px){.flexblock.features{margin-right:-2%;margin-left:-2%}.flexblock.features>li{margin-right:2%;margin-left:2%;width:29%}.size-50 .flexblock.features>li{width:46%}.column .flexblock.features>li{width:100%}footer .flexblock.features>li{margin-bottom:0}}.features li h2{text-transform:uppercase}.features li span{font-weight:300}.features li p{margin:0}.features li p em{display:block}.features li span,.features li svg{font-size:6.4rem;line-height:1;display:block;margin:0}.features li img{width:6.4rem}.features li span sup{font-size:3rem}@media (min-width:1200px){.features li img,.features li span,.features li svg{float:left;margin-right:.8rem}}.flexblock.clients.blink li>a,.flexblock.clients li{padding:0}.flexblock.clients li figcaption{padding:0 2.4rem 2.4rem}.flexblock.clients.border li figcaption{padding-top:2.4rem}.clients.blink li>a,.clients li{-ms-flex-pack:inherit;justify-content:inherit}.clients li img,.clients li svg{display:block;padding:2.4rem}.clients.border li img,.clients.border li svg{margin-right:auto;margin-left:auto;display:block}.clients li:hover{z-index:1}.steps li{width:100%}.steps li img,.steps li span{margin:0 auto .8rem;display:block}.steps li span{font-size:6.4rem}@media (min-width:768px){.steps li{width:50%}}@media (min-width:1024px){.steps li{width:25%}.process{position:absolute;top:60px;left:0;width:0;height:0;border-left-style:solid;border-left-width:15px}}.metrics li{text-align:center;width:100%}.metrics li strong{display:block}.metrics li span,.metrics li svg{font-size:6.4rem;line-height:7.2rem;display:block;margin:0 auto}@media (min-width:568px){.metrics li{width:50%}}@media (min-width:1024px){.metrics li{width:25%}}.card-50 .metrics li{width:50%}.specs li{width:100%;text-align:left}.specs li:after{content:"";height:1px;display:block;position:relative;bottom:-2.4rem}.specs li:hover{transform:translateX(.2rem)}.specs li span,.specs li svg{font-size:6.4rem;line-height:1;display:block;margin:0}.specs li img{width:6.4rem}.specs li span{font-weight:300}.specs li span sup{font-size:3rem}@media (min-width:1024px){.specs li img,.specs li span,.specs li svg{float:left;margin-right:2.4rem}}.flexblock.reasons li{text-align:left;width:100%;counter-increment:list}.reasons li:hover{transform:translateY(-.2rem)}.reasons li:before{content:counter(list) ".";font-size:6.4rem;line-height:1}.reasons li:after{position:relative;bottom:-2.4rem;content:"";height:1px;display:block}@media (min-width:768px){.reasons li{padding-left:8.8rem}.reasons li:before{position:absolute;left:2.4rem}}.flexblock.gallery li{margin-bottom:4.8rem}.flexblock.gallery.blink li>a,.flexblock.gallery li{padding:0}.gallery h2{text-transform:uppercase}.gallery h2+p,.gallery h3+p{margin-top:.8rem}.gallery p{font-size:1.6rem;line-height:2.4rem;margin-bottom:0}.flexblock.gallery li figcaption{position:relative;padding:1.6rem}.gallery li figcaption:before{content:"";position:absolute;width:0;height:0;margin-left:-.5em;top:.4rem;left:20%;transform-origin:0 0;transform:rotate(135deg);transition:.1s}.gallery li:hover figcaption:before{top:.3rem}.aligncenter .gallery li figcaption:before{margin-left:0;left:55%}.gallery li footer{position:relative;padding:1.2rem 0 0;margin-top:.8rem}@media (min-width:600px){.flexblock.gallery{margin-right:-2%;margin-left:-2%}.flexblock.gallery li{margin-right:2%;margin-left:2%;width:46%}}@media (min-width:1024px){.flexblock.gallery li{width:21%}.grid.ms .flexblock.gallery li,.grid.sm .flexblock.gallery li{width:29%}.grid.sms .flexblock.gallery li{width:46%}}.gallery li img{margin-right:auto;margin-left:auto;display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;opacity:1;z-index:2;width:100%;height:100%;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;transition:all .3s linear}li .overlay{-ms-flex-align:center;align-items:center}li .overlay h2{text-transform:uppercase;margin:0;padding:0 2.4rem;letter-spacing:.2rem;width:100%;text-align:center}.overlay p,.overlay time{margin-bottom:0}li:hover .overlay{cursor:pointer}.flexblock.plans>li{text-align:center;border-radius:3px;z-index:1;margin-bottom:4.8rem}.plans.blink li>a,.plans li{padding:0}.plans.blink li>a div,.plans li div{padding-bottom:3.2rem}.plans li h2,.plans li p{padding:.8rem 3.2rem}.plans li h2{float:left;width:100%;text-transform:uppercase;letter-spacing:.1rem;font-weight:400}.plans .price{font-size:4.8rem;line-height:6.2rem;padding:2.4rem;font-weight:400;display:block;clear:both}.price sup{font-size:1.8rem;margin-right:.4rem}.plans li ul{margin-bottom:2.4rem}.flexblock.plans li ul li{width:100%;padding:.8rem 3.2rem;text-align:left;display:block}@media (min-width:1024px){.flexblock.plans{margin-right:-2%;margin-left:-2%}.flexblock.plans>li{margin-right:2%;margin-left:2%;width:29%}.plans>li:hover,.plans>li:nth-child(2){position:relative;z-index:2;transform:scale(1.08)}.plans:hover li:nth-child(2):not(:hover){position:relative;z-index:1;transform:scale(1)}}.flexblock.activity{-ms-flex-direction:column;flex-direction:column}.activity li{position:relative;-ms-flex:1;flex:1;width:auto}.activity p{vertical-align:top;margin-bottom:0}.activity img{display:block}.activity .title,.activity .year{display:inline;font-weight:600}.activity .summary{width:100%}.activity .title{margin-left:1rem}@media (min-width:768px){.activity p{float:left}.activity .year{width:15%}.activity .title{width:27%;margin-right:4%;margin-left:4%}.activity .summary{width:50%}}.flexblock.blink li li,.flexblock li li{padding:0;width:100%}[class*=content-] .flexblock li p{font-size:1.8rem;line-height:3.2rem}.content-left .flexblock.features li,.content-right .flexblock.features li{width:46%}.cta{-ms-flex-wrap:wrap;flex-wrap:wrap}.cta,.cta .benefit,.number{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.cta .benefit,.number{padding:.8rem;max-width:100%;-ms-flex-direction:column;flex-direction:column}.cta .benefit,.number{text-align:center}.cta .benefit{max-width:100%}.number span{font-size:8rem;line-height:8rem;display:block}.number span sup{font-size:4rem}.cta p{margin-bottom:0}@media (min-width:768px){.cta .benefit,.number{padding:4.8rem;max-width:50%}.cta .benefit{text-align:left}.number span{font-size:16rem;line-height:16rem}.number span sup{font-size:6rem;vertical-align:middle}}.cta-cover{display:table;width:100%}.cta-cover h1 strong{font-weight:400}@media (min-width:1024px){.cta-cover h1{max-width:80%;float:left}.cta-cover h1 strong{display:block}.cta-cover .button{margin-top:1.2rem}.cta-cover .try{text-align:center}}@media (max-width:1023px){.cta-cover .alignright{float:none}}h1+.work,h2+.work,h3+.work,p+.work{margin-top:4.8rem}.work{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;clear:both;text-align:left}.work li{position:relative;-ms-flex:1;flex:1;list-style:none;margin:0}.work-label{float:left;width:100%;padding:0 0 2.4rem;font-weight:600}.work p{margin-bottom:0}.work li a{display:block;float:left;width:100%;height:100%;padding:2.4rem 0}.work-title{display:block;width:75%;padding-right:1.2rem}.work li:first-child a:hover p:first-child,.work li a p{transition:.3s}.work li p{padding-left:1.2rem}.work li.work-label p{padding-left:0}.work li a:hover p:first-child{padding-left:1.6rem}.work li p:last-child{position:absolute;top:2.4rem;right:1.2rem}.work li.work-label p:last-child{top:0;right:0}@media (min-width:768px){.work-label p,.work li p{width:25%;margin-right:2%;float:left}.work li.work-label p:last-child,.work li p:last-child{position:relative;float:right;top:auto;right:auto;margin-right:0;text-align:right;padding-right:1.2rem}.work li p.work-date{width:120px}}@media (max-width:768px){.work-client,.work-label .work-services{clip:rect(1px,1px,1px,1px);position:absolute!important;height:1px;width:1px;overflow:hidden}}.chapter,.toc,.toc ol>li:before{position:relative;z-index:2}.toc ol{position:relative;counter-reset:item}.toc ol>li:before{content:counters(item,".") ". ";display:table-cell;width:2.4rem;padding-right:.8rem}.toc ol li li:before{content:counters(item,".") " "}.toc li{width:100%;display:table;counter-increment:item;font-weight:400;margin-bottom:.8rem;margin-left:0;transition:.3s}.toc li li{font-weight:300;margin-left:0;margin-bottom:0}.chapter{display:inline-block;font-size:1.8rem;line-height:3.2rem;padding-right:.8rem}.toc-page{float:right}.toc li .toc-page:before{position:absolute;right:4rem;left:0;margin-top:1.8rem;content:"";display:block}.toc li>a{display:inline-block;width:100%}.toc li a:hover span{font-weight:600}.toc li a:hover .toc-page:before{border-bottom-width:2px}[class*=card-],[class*=card-]>a{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;clear:both}.fullscreen [class*=card-],.fullscreen [class*=card-]>a{min-height:100vh}[class*=card-] figure img{margin:0 auto;display:block}@media (min-width:768px){.fullscreen [class*=card-] figure,[class*=card-][class*=bg-] figure{vertical-align:middle;text-align:center;min-width:380px;max-height:100%}.fullscreen [class*=card-] figure img,[class*=card-][class*=bg-] figure img{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}}.flex-content,[class*=card-] blockquote{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding:2.4rem}.flex-content p{position:relative}@media (min-width:768px){.card-50 .flex-content,.card-50 blockquote,.card-50 figure{width:50%}.card-30 figure,.card-70 .flex-content,.card-70 blockquote{width:30%}.card-40 figure,.card-60 .flex-content,.card-60 blockquote{width:40%}.card-40 .flex-content,.card-40 blockquote,.card-60 figure{width:60%}.card-30 .flex-content,.card-30 blockquote,.card-70 figure{width:70%}[class*=card-]:nth-child(odd) figure{-ms-flex-order:0;order:0}[class*=card-]:nth-child(2n) figure{-ms-flex-order:1;order:1}.flex-content,[class*=card-] blockquote{padding:4.8rem}.fullscreen [class*=card-] .flex-content,.fullscreen [class*=card-] blockquote{padding:6.4rem}}@media (max-width:767px){[class*=card-],[class*=card-]>a{-ms-flex-flow:column;flex-flow:column}.card figure,.card header{width:100%}}[class*=card-] figure figcaption{position:absolute;bottom:0;left:0;padding:.8rem 2.4rem;font-size:1.4rem;line-height:2.4rem;z-index:2}[class*=card-] figure figcaption.cover{top:0;right:0;width:100%;height:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}[class*=card-] figure figcaption svg{font-size:1rem}blockquote{position:relative;display:inline-block}blockquote p{font-size:2.4rem;line-height:4rem}.bg-apple blockquote p{font-family:San Francisco,Roboto,helvetica,arial,sans-serif;font-weight:300}cite{text-align:center}cite,cite span{display:block}cite:before{content:"\2014 \2009";margin-right:6px}blockquote.wall:before{position:absolute;top:-6.4rem;left:-.8rem;content:"\201C";font-family:arial,sans-serif;width:6.4rem;height:6.4rem;font-size:16rem;line-height:1;text-align:center}@media (min-width:768px){blockquote.wall{padding-left:8rem}blockquote.wall p{font-size:3.2rem;line-height:4.8rem}blockquote.wall:before{top:-3.2rem;left:.8rem}}cite img,img[class*=avatar-]{display:inline-block;vertical-align:middle;margin-right:6px}img[class*=avatar-]{border-radius:50%}img.avatar-80{width:80px;height:80px}img.avatar-72{width:72px;height:72px}img.avatar-64{width:64px;height:64px}img.avatar-56{width:56px;height:56px}img.avatar-48{width:48px;height:48px}img.avatar-40{width:40px;height:40px}table{margin-top:3.2rem;margin-bottom:3.2rem}table td,th,thead{border-spacing:0;padding:.7rem 2.4rem}th,thead th{text-align:left;cursor:default;white-space:nowrap;font-weight:600;text-transform:uppercase}td.goals,thead{font-weight:600;text-shadow:none}tr>td{font-weight:400}form{text-align:left}form+p,input+p,textarea+p{margin-top:.8rem}input[type=email],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{appearance:none;-moz-appearance:none;-webkit-appearance:none;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0}button,input,select{position:relative;display:inline-block;margin:0;width:100%;height:4.8rem;padding:.7rem;font-weight:400;font-size:1.6rem}input[type=checkbox],input[type=radio]{width:auto;height:auto;padding:4px}button[type=submit],textarea{width:100%}textarea{padding:.7rem}button{width:auto}.button,button{text-align:center;cursor:pointer}.button{display:inline-block;line-height:4.8rem;font-size:1.8rem;font-weight:400;min-width:16rem;padding:0 1.6rem}.button.radius,button.radius,input.radius{border-radius:2.4rem}button,input[type=submit]{text-transform:uppercase;font-weight:400;letter-spacing:.1rem}.button svg{font-size:2.4rem}.plans .button{width:50%;margin-right:auto;margin-left:auto}.try{display:block;font-size:1.6rem;margin-top:1.6rem}fieldset{padding:2.4rem}legend{padding:1.6rem 2.4rem;border:none;width:100%;text-align:center;text-transform:uppercase;letter-spacing:.1rem;font-weight:400}input:focus,select:focus,textarea:focus{border-width:1px}[class*=badge-]{width:135px;height:40px;line-height:4rem;background-size:cover;background-repeat:no-repeat;display:inline-block;text-indent:-4000px;border-radius:.6rem}@media (min-width:1024px){[class*=badge-]{width:162px;height:48px;line-height:4.8rem}}.badge-ios{background-image:url("../images/bt-appstore.png")}.badge-android{background-image:url("../images/bt-playstore.png")}a.button:hover,button[type=submit]:hover,input[type=submit]:hover{transform:scale(1.01)}[class*=badge-]:hover{opacity:.7}.user input{margin-bottom:0}.user input[type=email],.user input[type=search],.user input[type=text]{width:100%}.user button,.user input[type=submit]{left:0;width:100%}@media (min-width:500px){.user input[type=email],.user input[type=search],.user input[type=text]{width:70%;float:left}.user button,.user input[type=submit]{width:30%;cursor:pointer}[class*=badge]+[class*=badge],[class*=button]+[class*=button]{margin-left:1.8rem}}@media (max-width:499px){[class*=badge]+[class*=badge],[class*=button]+[class*=button]{margin-top:.8rem}}:disabled,button:disabled:hover{cursor:not-allowed}.cta:after,.cta:before,.flexblock:after,.flexblock:before,.grid:after,.grid:before{width:0}@media print{.slide,section{position:relative;display:block!important}#counter,#navigation{display:none}}body{color:#333;background-color:#f7f9fb}:focus{box-shadow:0 0 2px #96bbee}svg{fill:currentColor}[class*=bg-] a,[class*=bg-gradient-] a{color:#bce}.bg-brown a{color:#c23}.bg-gradient-white a,.bg-light a,.bg-white a,a{color:#44d}a:hover{color:#3af}.flexblock li>a,[class*=bg-] li>a,[class*=bg-gradient-] li>a,article header a{color:inherit}hr{background:rgba(0,20,80,.2);background:radial-gradient(ellipse at center,rgba(0,20,80,.2) 0,hsla(0,0%,100%,0) 75%)}hr:after{background-color:hsla(0,0%,100%,.8);color:#333}abbr,acronym{border-bottom:1px dotted #333}ins,mark{background-color:rgba(221,238,255,.8);color:inherit}::-moz-selection{background-color:rgba(221,238,255,.8)}::-webkit-selection{background-color:rgba(221,238,255,.8)}::selection{background-color:rgba(221,238,255,.8)}pre{border:1px solid rgba(0,20,80,.1);box-shadow:0 8px 16px rgba(0,20,80,.04),0 4px 16px rgba(0,0,0,.08);background:#fff}pre:hover{box-shadow:0 8px 16px rgba(0,40,160,.08),0 8px 24px rgba(0,0,0,.08)}[class*=bg-] pre,code{background-color:hsla(0,0%,100%,.09)}.bg-white code{background:rgba(0,20,80,.03)}.bg-primary{background-color:#44d}.bg-secondary{background-color:#67d}.bg-light{background-color:#edf2f7}.bg-black{background-color:#111}.bg-black-blue{background-color:#123}.bg-blue{background-color:#346}.bg-brown{background-color:#f8f8f9}.bg-gray{background-color:#d5d9e2}.bg-green{background-color:#077}.bg-purple{background-color:#62b}.bg-red{background-color:#c23}.bg-white{background-color:#fff}[class*=bg-] .bg-white{text-shadow:none;color:#333}.bg-apple{background:linear-gradient(180deg,#000 0,#1a2028 50%,#293845)}.bg-facebook{background:#3b5998}.bg-apple,.bg-blue,.bg-facebook,.bg-green,.bg-primary,.bg-purple,.bg-red,.bg-secondary,.bg-trans-dark,.bg-trans-gradient,[class*=bg-black],[class*=bg-gradient-]{color:#fff;text-shadow:0 1px 0 #013}.bg-light p{color:#456}.bg-brown p{color:#666}.bg-trans-dark{background:rgba(0,0,0,.8)}.bg-trans-light{background:rgba(0,0,0,.2)}.bg-trans-gradient{background:linear-gradient(0deg,rgba(0,0,0,.8) 0,transparent)}.bg-gradient-h{background:linear-gradient(134deg,#32b,#62b)}.bg-gradient-v{background:linear-gradient(0deg,#62b 0,#32b)}.bg-gradient-r{background:radial-gradient(ellipse at center,#62b 0,#32b 100%)}.bg-gradient-white{background:linear-gradient(180deg,#f2f4f6,#fff);color:#333;text-shadow:none}.bg-gradient-gray{background:linear-gradient(90deg,#f7f9fb,#dee2e6);color:#333;text-shadow:none}.frame{border:.8rem solid #fff}.pre,.shadow{position:relative}.shadow:after,.shadow:before{box-shadow:0 16px 24px rgba(0,20,80,.3)}.text-separator:before{background-color:rgba(170,0,0,.8)}[class*=text-pull-]{border-top:4px solid rgba(0,0,0,.5)}[class*=bg-] .text-context:before{background-color:#fff}.bg-white .text-context:before,.text-context:before{background-color:rgba(0,20,80,.2)}.text-shadow{text-shadow:0 0 40px rgba(0,0,0,.5)}[class*=card-] time,h1 span{color:#abd}.code-comment{color:rgba(70,170,130,.9);text-shadow:none}header[role=banner]{background-color:#fff}.logo a{color:inherit}nav[role=navigation] li a{background-color:rgba(50,50,50,.9)}nav[role=navigation] li a:hover{background-color:rgba(50,50,50,.7)}nav[role=navigation] li a,nav[role=navigation] li a:hover{color:#fff}nav[role=navigation] li.active a{background-color:#555;color:#fff}nav li.twitter a:hover{background-color:#1da1f3}nav li.facebook a:hover{background-color:#3b5998}nav li.linkedin a:hover{background-color:#1683bb}nav li.dribbble a:hover{background-color:#ea4c89}nav li.github a:hover{background-color:#60b044}nav li.email a:hover{background:#dd4b39}.flexblock li.active a,.metrics li:hover,.reasons li:hover,.specs li:hover{background-color:rgba(0,20,80,.03)}.clients li,.features li{background-color:hsla(0,0%,100%,.9)}[class*=bg-] .clients li,[class*=bg-] .features li{background-color:hsla(0,0%,100%,.1)}.clients li:hover,.features li:hover{box-shadow:0 8px 16px rgba(0,20,80,.02),0 4px 16px rgba(0,0,0,.08)}.border{border-right:1px solid rgba(0,20,80,.1);border-bottom:1px solid rgba(0,20,80,.1)}.border li{border-top:1px solid rgba(0,20,80,.1);border-left:1px solid rgba(0,20,80,.1)}.flexblock.border li li{border:none}.steps li:first-child{background-color:#e8eef7}.steps li:nth-child(2){background-color:#dde5f3}.steps li:nth-child(3){background-color:#cdd8ec}.steps li:nth-child(4){background-color:#bbcdec}.process{border-top:15px solid transparent;border-bottom:15px solid transparent}.steps.blink li:hover>a,.steps li:hover{background-color:#b8cef7}@media (min-width:1024px){.process.step-2{border-left-color:#e8eef7}.process.step-3{border-left-color:#dde5f3}.process.step-4{border-left-color:#cdd8ec}.steps li:hover+li [class*=step-]{border-left-color:#b8cef7}}.specs li:after{background:linear-gradient(90deg,rgba(0,20,80,0) 0,rgba(0,20,80,.2) 50%,rgba(0,20,80,0))}.specs li:last-child:after{background:none}.reasons li:after{background:linear-gradient(90deg,rgba(0,20,80,0) 0,rgba(0,20,80,.2) 50%,rgba(0,20,80,0))}.reasons li:last-child:after{background:none}.overlay{background-color:rgba(0,0,0,.2)}li:hover .overlay{background-color:rgba(0,0,0,.1)}.overlay,.overlay a{color:#fff;text-shadow:0 1px 0 #111}.gallery li{background-color:rgba(0,20,80,.06);box-shadow:0 1px 1px rgba(0,0,0,.2),0 4px 8px rgba(0,0,0,.03)}.gallery li figcaption{background-color:#fff}.flexblock.gallery li:hover{box-shadow:0 1px 1px rgba(0,0,0,.2),0 4px 8px rgba(0,0,0,.08)}.gallery li footer{border-top:1px solid rgba(0,20,80,.1)}.gallery li a{color:#333;text-shadow:none}.flesblock.gallery li a footer{color:#aaa}.gallery li figcaption:before{border:.8rem solid #000;border-color:transparent transparent #fff #fff}.flexblock.plans li:hover div,.plans>li div{background-color:#fff}.plans>li:hover,.plans>li:nth-child(2){box-shadow:0 1px 1px rgba(0,0,0,.1),0 8px 16px rgba(0,0,0,.1)}.plans:hover li:nth-child(2):not(:hover){box-shadow:none}.plans li h2{background-color:rgba(0,20,80,.5);color:#fff}.plans ul li{border-bottom:1px solid rgba(0,20,80,.1)}.plans ul li:last-child{border-bottom:none}.plans>li>a{color:inherit;color:#333;text-shadow:none}.activity li{border-top:.1rem solid rgba(0,20,80,.1)}.activity li:hover{background-color:rgba(0,20,80,.02)}.work-label,.work li a{border-bottom:1px solid rgba(0,20,80,.1)}.work li:nth-child(odd)>a{background-color:rgba(0,20,80,.03)}.work li a:hover{background-color:rgba(0,20,80,.04)}.clients.border figcaption{border-top:1px solid rgba(0,20,80,.1)}img.blacklogo{background:none;filter:grayscale(100%) brightness(10%) contrast(100%)}img.graylogo{filter:grayscale(100%) brightness(10%) contrast(10%)}img.whitelogo{filter:brightness(0) invert(1)}img.blacklogo:hover,img.graylogo:hover,li:hover img.blacklogo,li:hover img.graylogo{background:none;filter:grayscale(0);filter:none;transition:all .6s ease}[class*=card-]>a{color:inherit}.description>li{border-bottom:1px solid rgba(0,20,80,.1)}.description>li:last-child{border-bottom:none}[class*=card-][class*=bg-] figure{background-color:rgba(0,20,80,.06)}[class*=card-] figcaption,[class*=card-] figcaption a{color:#fff;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.2))}@media (min-width:768px){.cta .benefit{border-left-width:1px;border-style:solid;border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.4) 50%,transparent) 1 100%;-moz-border-image:-moz-linear-gradient(90deg,transparent,rgba(0,0,0,.4) 50%,transparent) 1 100%}}table td,th,thead{border:1px solid rgba(0,0,0,.5)}thead{background-color:rgba(0,0,0,.3)}tr:nth-child(2n)>td{background:rgba(0,0,0,.1)}tr>td{border-top:1px solid rgba(0,0,0,.5)}td:hover,tr:nth-child(2n)>td:hover{background-color:hsla(0,0%,100%,.5)}.browser{border:1px solid rgba(0,20,80,.1)}.browser:hover{box-shadow:0 1px 1px rgba(0,0,0,.1),0 8px 16px rgba(0,0,0,.1)}.browser:before{background-color:rgba(0,20,80,.1);color:hsla(0,0%,100%,.9);border-bottom:1px solid rgba(0,20,80,.2)}.browser:hover:before{background-color:rgba(0,20,80,.12);color:#fff}input,textarea{background-color:#fafbfc}input:focus,textarea:focus{background-color:#fff;box-shadow:0 0 5px #51cbee}input:focus::-moz-placeholder{color:#ddd}input:focus::-webkit-input-placeholder{color:#ddd}[class*=badge-],a.button,button[type=submit],input{box-shadow:0 10px 16px -8px rgba(0,20,80,.3)}.button,.button:hover,button,button[type=submit],button[type=submit]:hover,input,input[type=submit],input[type=submit]:hover,select,textarea{border:1px solid #44d}.button,.button:hover,button[type=submit],button[type=submit]:hover,input[type=submit],input[type=submit]:hover{color:#fff;background-color:#44d;text-shadow:0 1px 0 #123}.button:active,button[type=submit]:active,input[type=submit]:active{background-color:#17d}.ghost,.ghost:hover{background:none;color:inherit;text-shadow:none}.bg-primary .button,.bg-primary button,.bg-primary button:hover,.bg-primary input,.bg-primary select,.bg-primary textarea,[class*=bg-] a.button.ghost,[class*=bg-gradient-] .button{border-color:#fff}[class*=bg-] a.button{color:#fff}.bg-gradient-white a.button.ghost,.bg-white a.button.ghost{color:#333;border:1px solid #44d}:disabled,button:disabled:hover{background-color:#eee;border-color:#eee;color:#ccc}fieldset{border:1px solid #44d;background-color:rgba(0,20,80,.2)}legend{background-color:rgba(0,0,0,.6);color:#fff}input:hover,select:hover{box-shadow:0 0 8px rgba(0,0,0,.3)}[class*=badge-]{border:1px solid #345;background-color:#000}form .flexblock li:hover{background-color:rgba(0,0,0,.05)}.chapter,.toc,.toc ol>li:before{background-color:#f7f9fb}.toc li .toc-page:before{border-bottom:1px dotted rgba(0,0,0,.9)}#counter,#navigation a{color:#abc}#webslides:hover #navigation a:hover{color:#fff;background-color:rgba(0,0,0,.9)}footer[role=contentinfo]{background-color:#fff} \ No newline at end of file diff --git a/static/js/webslides.js b/static/js/webslides.js index 0a46daa..b4aa2d3 100644 --- a/static/js/webslides.js +++ b/static/js/webslides.js @@ -63,7 +63,7 @@ /******/ __webpack_require__.p = "/static/js/"; /******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = 16); +/******/ return __webpack_require__(__webpack_require__.s = 17); /******/ }) /************************************************************************/ /******/ ([ @@ -71,7 +71,7 @@ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__custom_event__ = __webpack_require__(13); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__custom_event__ = __webpack_require__(14); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -182,6 +182,10 @@ var DOM = function () { var Keys = { ENTER: 13, SPACE: 32, + RE_PAGE: 33, + AV_PAGE: 34, + END: 35, + HOME: 36, LEFT: 37, UP: 38, RIGHT: 39, @@ -294,10 +298,10 @@ var MobileDetector = function () { /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__plugins_plugins__ = __webpack_require__(10); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__slide__ = __webpack_require__(4); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__plugins_plugins__ = __webpack_require__(11); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__slide__ = __webpack_require__(5); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__utils_dom__ = __webpack_require__(0); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_scroll_to__ = __webpack_require__(15); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__utils_scroll_to__ = __webpack_require__(16); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -325,16 +329,29 @@ var PLUGINS = { var WebSlides = function () { /** * Options for WebSlides - * @param {number|boolean} autoslide Is false by default. If a number is - * @param {boolean} changeOnClick Is false by default. If true, it will allow + * @param {number|boolean} autoslide If a number is provided, it will allow + * autosliding by said amount of miliseconds. + * @param {boolean} changeOnClick If true, it will allow * clicking on any place to change the slide. + * @param {number} minWheelDelta Controls the amount of needed scroll to + * trigger navigation. + * @param {number} scrollWait Controls the amount of time to wait till + * navigation can occur again with scroll. + * @param {number} slideOffset Controls the amount of needed touch delta to + * trigger navigation. */ function WebSlides() { var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref$autoslide = _ref.autoslide, autoslide = _ref$autoslide === undefined ? false : _ref$autoslide, _ref$changeOnClick = _ref.changeOnClick, - changeOnClick = _ref$changeOnClick === undefined ? false : _ref$changeOnClick; + changeOnClick = _ref$changeOnClick === undefined ? false : _ref$changeOnClick, + _ref$minWheelDelta = _ref.minWheelDelta, + minWheelDelta = _ref$minWheelDelta === undefined ? 40 : _ref$minWheelDelta, + _ref$scrollWait = _ref.scrollWait, + scrollWait = _ref$scrollWait === undefined ? 450 : _ref$scrollWait, + _ref$slideOffset = _ref.slideOffset, + slideOffset = _ref$slideOffset === undefined ? 50 : _ref$slideOffset; _classCallCheck(this, WebSlides); @@ -388,18 +405,16 @@ var WebSlides = function () { */ this.interval_ = null; /** - * Amount of time to wait to go to next slide automatically or false to - * disable the feature. - * @type {boolean|number} - * @private + * Options dictionary. + * @type {Object} */ - this.autoslide_ = autoslide; - /** - * Whether navigation should initiate on click or not. - * @type {boolean} - * @private - */ - this.changeOnClick_ = changeOnClick; + this.options = { + autoslide: autoslide, + changeOnClick: changeOnClick, + minWheelDelta: minWheelDelta, + scrollWait: scrollWait, + slideOffset: slideOffset + }; if (!this.el) { throw new Error('Couldn\'t find the webslides container!'); @@ -494,7 +509,7 @@ var WebSlides = function () { value: function goToSlide(slideI) { var forward = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; - if (this.isValidIndexSlide_(slideI) && !this.isMoving) { + if (this.isValidIndexSlide_(slideI) && !this.isMoving && this.currentSlideI_ !== slideI) { this.isMoving = true; var isMovingForward = false; @@ -704,7 +719,7 @@ var WebSlides = function () { * automatically. */ value: function play(time) { - time = time || this.autoslide_; + time = time || this.options.autoslide; if (!this.interval_ && typeof time === 'number' && time > 0) { this.interval_ = setInterval(this.goNext.bind(this), time); @@ -737,6 +752,12 @@ var WebSlides = function () { /***/ }), /* 4 */ +/***/ (function(module, exports) { + +// removed by extract-text-webpack-plugin + +/***/ }), +/* 5 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -853,7 +874,7 @@ var Slide = function () { /* harmony default export */ __webpack_exports__["a"] = Slide; /***/ }), -/* 5 */ +/* 6 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -877,7 +898,7 @@ var ClickNav = function () { */ this.ws_ = wsInstance; - if (wsInstance.changeOnClick_) { + if (wsInstance.options.changeOnClick) { this.ws_.el.addEventListener('click', this.onClick_.bind(this)); } } @@ -905,7 +926,7 @@ var ClickNav = function () { /* harmony default export */ __webpack_exports__["a"] = ClickNav; /***/ }), -/* 6 */ +/* 7 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -969,7 +990,7 @@ var Grid = function () { /* harmony default export */ __webpack_exports__["a"] = Grid; /***/ }), -/* 7 */ +/* 8 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1069,7 +1090,7 @@ var Hash = function () { /* harmony default export */ __webpack_exports__["a"] = Hash; /***/ }), -/* 8 */ +/* 9 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1109,27 +1130,50 @@ var Keyboard = function () { key: 'onKeyPress_', value: function onKeyPress_(event) { var method = void 0; + var argument = void 0; - if (event.which === __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].SPACE) { - method = this.ws_.goNext; - } else { - if (this.ws_.isVertical) { - if (event.which === __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].DOWN) { - method = this.ws_.goNext; - } else if (event.which === __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].UP) { - method = this.ws_.goPrev; - } - } else { - if (event.which === __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].RIGHT) { - method = this.ws_.goNext; - } else if (event.which === __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].LEFT) { - method = this.ws_.goPrev; - } + // Check if there's a focused element that might use the keyboard. + if (document.activeElement) { + var isContentEditable = document.activeElement.contentEditable !== 'inherit'; + var isInput = ['INPUT', 'SELECT', 'OPTION', 'TEXTAREA'].indexOf(document.activeElement.tagName) > -1; + + if (isInput || isContentEditable) { + return; } } + switch (event.which) { + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].AV_PAGE: + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].SPACE: + method = this.ws_.goNext; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].RE_PAGE: + method = this.ws_.goPrev; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].HOME: + method = this.ws_.goToSlide; + argument = 0; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].END: + method = this.ws_.goToSlide; + argument = this.ws_.maxSlide_ - 1; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].DOWN: + method = this.ws_.isVertical ? this.ws_.goNext : null; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].UP: + method = this.ws_.isVertical ? this.ws_.goPrev : null; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].LEFT: + method = !this.ws_.isVertical ? this.ws_.goPrev : null; + break; + case __WEBPACK_IMPORTED_MODULE_0__utils_keys__["a" /* default */].RIGHT: + method = !this.ws_.isVertical ? this.ws_.goNext : null; + break; + } + if (method) { - method.call(this.ws_); + method.call(this.ws_, argument); } } }]); @@ -1140,7 +1184,7 @@ var Keyboard = function () { /* harmony default export */ __webpack_exports__["a"] = Keyboard; /***/ }), -/* 9 */ +/* 10 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1292,17 +1336,17 @@ var Navigation = function () { /* harmony default export */ __webpack_exports__["a"] = Navigation; /***/ }), -/* 10 */ +/* 11 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__click_nav__ = __webpack_require__(5); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__grid__ = __webpack_require__(6); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__hash__ = __webpack_require__(7); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__keyboard__ = __webpack_require__(8); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__navigation__ = __webpack_require__(9); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__scroll__ = __webpack_require__(11); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__touch__ = __webpack_require__(12); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__click_nav__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__grid__ = __webpack_require__(7); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__hash__ = __webpack_require__(8); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__keyboard__ = __webpack_require__(9); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__navigation__ = __webpack_require__(10); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__scroll__ = __webpack_require__(12); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__touch__ = __webpack_require__(13); @@ -1322,7 +1366,7 @@ var Navigation = function () { }; /***/ }), -/* 11 */ +/* 12 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1333,8 +1377,6 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons -var MIN_WHEEL_DELTA = 40; - var Scroll = function () { /** * Scroll handler for the WebSlides. @@ -1396,7 +1438,7 @@ var Scroll = function () { this.timeout_ = setTimeout(function () { _this.timeout_ = null; - }, 450); + }, this.ws_.options.scrollWait); } /** @@ -1433,7 +1475,7 @@ var Scroll = function () { } } - if (Math.abs(wheelDeltaY) >= MIN_WHEEL_DELTA || Math.abs(wheelDeltaX) >= MIN_WHEEL_DELTA) { + if (Math.abs(wheelDeltaY) >= this.ws_.options.minWheelDelta || Math.abs(wheelDeltaX) >= this.ws_.options.minWheelDelta) { if (isHorizontalMovement && this.isGoingLeft_ || !isHorizontalMovement && this.isGoingUp_) { this.ws_.goPrev(); } else { @@ -1452,7 +1494,7 @@ var Scroll = function () { ; /***/ }), -/* 12 */ +/* 13 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1476,8 +1518,6 @@ var EVENTS = { } }; -var SLIDE_OFFSET = 50; - var Touch = function () { /** * @param {WebSlides} wsInstance The WebSlides instance @@ -1590,9 +1630,9 @@ var Touch = function () { // It's an horizontal drag if (Math.abs(diffX) > Math.abs(diffY)) { - if (diffX < -SLIDE_OFFSET) { + if (diffX < -this.ws_.options.slideOffset) { this.ws_.goPrev(); - } else if (diffX > SLIDE_OFFSET) { + } else if (diffX > this.ws_.options.slideOffset) { this.ws_.goNext(); } } @@ -1632,7 +1672,7 @@ var Touch = function () { ; /***/ }), -/* 13 */ +/* 14 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1675,7 +1715,7 @@ var WSCustomEvent = canIuseNativeCustom() ? NativeCustomEvent : IECustomEvent; /* harmony default export */ __webpack_exports__["a"] = WSCustomEvent; /***/ }), -/* 14 */ +/* 15 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -1700,11 +1740,11 @@ function linear(p) { /* harmony default export */ __webpack_exports__["a"] = { swing: swing, linear: linear }; /***/ }), -/* 15 */ +/* 16 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__easing__ = __webpack_require__(14); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__easing__ = __webpack_require__(15); /* harmony export (immutable) */ __webpack_exports__["a"] = scrollTo; @@ -1751,13 +1791,14 @@ function scrollTo(y) { } /***/ }), -/* 16 */ +/* 17 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__modules_webslides__ = __webpack_require__(3); +__webpack_require__(4); window.WebSlides = __WEBPACK_IMPORTED_MODULE_0__modules_webslides__["a" /* default */]; diff --git a/static/js/webslides.min.js b/static/js/webslides.min.js index 46766d3..cd55e8b 100644 --- a/static/js/webslides.min.js +++ b/static/js/webslides.min.js @@ -1 +1 @@ -!function(e){function t(i){if(n[i])return n[i].exports;var r=n[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,i){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:i})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/static/js/",t(t.s=16)}([function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(13),a=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:"",n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",i=document.createElement(e);return i.id=t,n&&(i.textContent=n),i}},{key:"hide",value:function(e){e.style.display="none"}},{key:"show",value:function(e){e.style.display=""}},{key:"fireEvent",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=new r.a(t,{detail:n});e.dispatchEvent(i)}},{key:"toArray",value:function(e){return[].slice.call(e)}}]),e}();t.a=o},function(e,t,n){"use strict";var i={ENTER:13,SPACE:32,LEFT:37,UP:38,RIGHT:39,DOWN:40};t.a=i},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{},n=t.autoslide,r=void 0!==n&&n,a=t.changeOnClick,o=void 0!==a&&a;if(i(this,e),this.el=document.getElementById("webslides"),this.isMoving=!1,this.slides=null,this.currentSlideI_=-1,this.currentSlide_=null,this.maxSlide_=0,this.isVertical=this.el.classList.contains(l.VERTICAL),this.plugins={},this.interval_=null,this.autoslide_=r,this.changeOnClick_=o,!this.el)throw new Error("Couldn't find the webslides container!");this.removeChildren_(),this.grabSlides_(),this.createPlugins_(),this.initSlides_(),this.play(),this.onInit_()}return u(e,[{key:"removeChildren_",value:function(){for(var e=this.el.childNodes,t=e.length;t--;){var n=e[t];a.a.isCandidate(n)||this.el.removeChild(n)}}},{key:"createPlugins_",value:function(){var e=this;Object.keys(c).forEach(function(t){var n=c[t];e.plugins[t]=new n(e)})}},{key:"onInit_",value:function(){o.a.fireEvent(this.el,"ws:init")}},{key:"grabSlides_",value:function(){this.slides=o.a.toArray(this.el.childNodes).map(function(e,t){return new a.a(e,t)}),this.maxSlide_=this.slides.length}},{key:"goToSlide",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(this.isValidIndexSlide_(e)&&!this.isMoving){this.isMoving=!0;var n=!1;null!==t?n=t:this.currentSlideI_>=0&&(n=e>this.currentSlideI_);var i=this.slides[e];null===this.currentSlide_||!this.isVertical||this.plugins.touch&&this.plugins.touch.isEnabled?this.transitionToSlide_(n,i,this.onSlideChange_):this.scrollTransitionToSlide_(n,i,this.onSlideChange_)}}},{key:"scrollTransitionToSlide_",value:function(e,t,i){var r=this;this.el.style.overflow="none",e?t.show():(t.moveBeforeFirst(),t.show(),n.i(s.a)(this.currentSlide_.el.offsetTop,0)),n.i(s.a)(t.el.offsetTop,500,function(){r.currentSlide_.hide(),e&&r.currentSlide_.moveAfterLast(),r.el.style.overflow="auto",setTimeout(function(){i.call(r,t)},150)})}},{key:"transitionToSlide_",value:function(e,t,i){n.i(s.a)(0,0),e||t.moveBeforeFirst(),this.currentSlide_&&(e&&this.currentSlide_.moveAfterLast(),this.currentSlide_.hide()),t.show(),i.call(this,t)}},{key:"onSlideChange_",value:function(e){this.currentSlide_=e,this.currentSlideI_=e.i,this.isMoving=!1,o.a.fireEvent(this.el,"ws:slide-change",{slides:this.maxSlide_,currentSlide0:this.currentSlideI_,currentSlide:this.currentSlideI_+1})}},{key:"goNext",value:function(){var e=this.currentSlideI_+1;e>=this.maxSlide_&&(e=0),this.goToSlide(e,!0)}},{key:"goPrev",value:function(){var e=this.currentSlideI_-1;e<0&&(e=this.maxSlide_-1),this.goToSlide(e,!1)}},{key:"isValidIndexSlide_",value:function(e){return e>=0&&e=this.maxSlide_)&&(e=0),0!==e)for(var t=0;t0&&(this.interval_=setInterval(this.goNext.bind(this),e))}},{key:"stop",value:function(){this.interval_&&(clearInterval(this.interval_),this.interval_=null)}}],[{key:"registerPlugin",value:function(e,t){c[e]=t}}]),e}();t.a=h},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(0),a=function(){function e(e,t){for(var n=0;nMath.abs(t);if(this.isGoingUp_=t<0,this.isGoingLeft_=n<0,r){if(i)return;e.preventDefault()}(Math.abs(t)>=o||Math.abs(n)>=o)&&(r&&this.isGoingLeft_||!r&&this.isGoingUp_?this.ws_.goPrev():this.ws_.goNext(),e.preventDefault())}}]),e}();t.a=s},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(2),a=function(){function e(e,t){for(var n=0;nMath.abs(t)&&(e<-s?this.ws_.goPrev():e>s&&this.ws_.goNext())}}],[{key:"normalizeEventInfo",value:function(e){var t=void 0,n=void 0,i={pageX:0,pageY:0};return"undefined"!=typeof e.changedTouches?i=e.changedTouches[0]:"undefined"!=typeof e.originalEvent&&"undefined"!=typeof e.originalEvent.changedTouches&&(i=e.originalEvent.changedTouches[0]),t=e.offsetX||e.layerX||i.pageX,n=e.offsetY||e.layerY||i.pageY,{x:t,y:n}}}]),e}();t.a=u},function(e,t,n){"use strict";function i(){try{var e=new r("t",{detail:{a:"b"}});return"t"===e.type&&"b"===e.detail.a}catch(e){}return!1}var r=window.CustomEvent,a=function(e,t){var n=document.createEvent("CustomEvent");return t?n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail):n.initCustomEvent(e,!1,!1,void 0),n},o=i()?r:a;t.a=o},function(e,t,n){"use strict";function i(e){return.5-Math.cos(e*Math.PI)/2}function r(e){return e}t.a={swing:i,linear:r}},function(e,t,n){"use strict";function i(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:500,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},i=e-a.scrollTop,o=a.scrollTop,s=16;if(!t)return a.scrollTop=e,void n();var u=function u(l){l+=s;var c=Math.min(1,l/t),h=r.a.swing(c,l*c,e,i,t);a.scrollTop=Math.floor(o+h*i),l1&&void 0!==arguments[1]?arguments[1]:"",n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",i=document.createElement(e);return i.id=t,n&&(i.textContent=n),i}},{key:"hide",value:function(e){e.style.display="none"}},{key:"show",value:function(e){e.style.display=""}},{key:"fireEvent",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=new r.a(t,{detail:n});e.dispatchEvent(i)}},{key:"toArray",value:function(e){return[].slice.call(e)}}]),e}();t.a=a},function(e,t,n){"use strict";var i={ENTER:13,SPACE:32,RE_PAGE:33,AV_PAGE:34,END:35,HOME:36,LEFT:37,UP:38,RIGHT:39,DOWN:40};t.a=i},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{},n=t.autoslide,r=void 0!==n&&n,s=t.changeOnClick,a=void 0!==s&&s,o=t.minWheelDelta,l=void 0===o?40:o,c=t.scrollWait,h=void 0===c?450:c,d=t.slideOffset,f=void 0===d?50:d;if(i(this,e),this.el=document.getElementById("webslides"),this.isMoving=!1,this.slides=null,this.currentSlideI_=-1,this.currentSlide_=null,this.maxSlide_=0,this.isVertical=this.el.classList.contains(u.VERTICAL),this.plugins={},this.interval_=null,this.options={autoslide:r,changeOnClick:a,minWheelDelta:l,scrollWait:h,slideOffset:f},!this.el)throw new Error("Couldn't find the webslides container!");this.removeChildren_(),this.grabSlides_(),this.createPlugins_(),this.initSlides_(),this.play(),this.onInit_()}return l(e,[{key:"removeChildren_",value:function(){for(var e=this.el.childNodes,t=e.length;t--;){var n=e[t];s.a.isCandidate(n)||this.el.removeChild(n)}}},{key:"createPlugins_",value:function(){var e=this;Object.keys(c).forEach(function(t){var n=c[t];e.plugins[t]=new n(e)})}},{key:"onInit_",value:function(){a.a.fireEvent(this.el,"ws:init")}},{key:"grabSlides_",value:function(){this.slides=a.a.toArray(this.el.childNodes).map(function(e,t){return new s.a(e,t)}),this.maxSlide_=this.slides.length}},{key:"goToSlide",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(this.isValidIndexSlide_(e)&&!this.isMoving&&this.currentSlideI_!==e){this.isMoving=!0;var n=!1;null!==t?n=t:this.currentSlideI_>=0&&(n=e>this.currentSlideI_);var i=this.slides[e];null===this.currentSlide_||!this.isVertical||this.plugins.touch&&this.plugins.touch.isEnabled?this.transitionToSlide_(n,i,this.onSlideChange_):this.scrollTransitionToSlide_(n,i,this.onSlideChange_)}}},{key:"scrollTransitionToSlide_",value:function(e,t,i){var r=this;this.el.style.overflow="none",e?t.show():(t.moveBeforeFirst(),t.show(),n.i(o.a)(this.currentSlide_.el.offsetTop,0)),n.i(o.a)(t.el.offsetTop,500,function(){r.currentSlide_.hide(),e&&r.currentSlide_.moveAfterLast(),r.el.style.overflow="auto",setTimeout(function(){i.call(r,t)},150)})}},{key:"transitionToSlide_",value:function(e,t,i){n.i(o.a)(0,0),e||t.moveBeforeFirst(),this.currentSlide_&&(e&&this.currentSlide_.moveAfterLast(),this.currentSlide_.hide()),t.show(),i.call(this,t)}},{key:"onSlideChange_",value:function(e){this.currentSlide_=e,this.currentSlideI_=e.i,this.isMoving=!1,a.a.fireEvent(this.el,"ws:slide-change",{slides:this.maxSlide_,currentSlide0:this.currentSlideI_,currentSlide:this.currentSlideI_+1})}},{key:"goNext",value:function(){var e=this.currentSlideI_+1;e>=this.maxSlide_&&(e=0),this.goToSlide(e,!0)}},{key:"goPrev",value:function(){var e=this.currentSlideI_-1;e<0&&(e=this.maxSlide_-1),this.goToSlide(e,!1)}},{key:"isValidIndexSlide_",value:function(e){return e>=0&&e=this.maxSlide_)&&(e=0),0!==e)for(var t=0;t0&&(this.interval_=setInterval(this.goNext.bind(this),e))}},{key:"stop",value:function(){this.interval_&&(clearInterval(this.interval_),this.interval_=null)}}],[{key:"registerPlugin",value:function(e,t){c[e]=t}}]),e}();t.a=h},function(e,t){},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(0),s=function(){function e(e,t){for(var n=0;n-1||i)return}switch(e.which){case r.a.AV_PAGE:case r.a.SPACE:t=this.ws_.goNext;break;case r.a.RE_PAGE:t=this.ws_.goPrev;break;case r.a.HOME:t=this.ws_.goToSlide,n=0;break;case r.a.END:t=this.ws_.goToSlide,n=this.ws_.maxSlide_-1;break;case r.a.DOWN:t=this.ws_.isVertical?this.ws_.goNext:null;break;case r.a.UP:t=this.ws_.isVertical?this.ws_.goPrev:null;break;case r.a.LEFT:t=this.ws_.isVertical?null:this.ws_.goPrev;break;case r.a.RIGHT:t=this.ws_.isVertical?null:this.ws_.goNext}t&&t.call(this.ws_,n)}}]),e}();t.a=a},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(0),s=function(){function e(e,t){for(var n=0;nMath.abs(t);if(this.isGoingUp_=t<0,this.isGoingLeft_=n<0,r){if(i)return;e.preventDefault()}(Math.abs(t)>=this.ws_.options.minWheelDelta||Math.abs(n)>=this.ws_.options.minWheelDelta)&&(r&&this.isGoingLeft_||!r&&this.isGoingUp_?this.ws_.goPrev():this.ws_.goNext(),e.preventDefault())}}]),e}();t.a=a},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=n(2),s=function(){function e(e,t){for(var n=0;nMath.abs(t)&&(e<-this.ws_.options.slideOffset?this.ws_.goPrev():e>this.ws_.options.slideOffset&&this.ws_.goNext())}}],[{key:"normalizeEventInfo",value:function(e){var t=void 0,n=void 0,i={pageX:0,pageY:0};return void 0!==e.changedTouches?i=e.changedTouches[0]:void 0!==e.originalEvent&&void 0!==e.originalEvent.changedTouches&&(i=e.originalEvent.changedTouches[0]),t=e.offsetX||e.layerX||i.pageX,n=e.offsetY||e.layerY||i.pageY,{x:t,y:n}}}]),e}();t.a=o},function(e,t,n){"use strict";function i(){try{var e=new r("t",{detail:{a:"b"}});return"t"===e.type&&"b"===e.detail.a}catch(e){}return!1}var r=window.CustomEvent,s=function(e,t){var n=document.createEvent("CustomEvent");return t?n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail):n.initCustomEvent(e,!1,!1,void 0),n},a=i()?r:s;t.a=a},function(e,t,n){"use strict";function i(e){return.5-Math.cos(e*Math.PI)/2}function r(e){return e}t.a={swing:i,linear:r}},function(e,t,n){"use strict";function i(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:500,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},i=e-s.scrollTop,a=s.scrollTop,o=16;if(!t)return s.scrollTop=e,void n();!function l(u){u+=o;var c=Math.min(1,u/t),h=r.a.swing(c,u*c,e,i,t);s.scrollTop=Math.floor(a+h*i),u