@font-face{font-family:'icons';src:url('../assets/fonts/icons/icons.eot');src:url('../assets/fonts/icons/icons.ttf') format('truetype');font-weight:normal;font-style:normal}.photostack,.photostack:after,.photostack:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.clearfix:before,.clearfix:after{content:'';display:table}.clearfix:after{clear:both}.photostack{background:#ddd;position:relative;text-align:center;overflow:hidden}.photostack a{color:#8e888a;text-decoration:none;outline:0}.photostack a:hover,.photostack a:focus{color:#a7a0a2}.codrops-header{margin:0 auto;padding:9em 2em;text-align:center;background:#444;color:#f2f8f8;position:relative;overflow:hidden}.codrops-header h1{margin:0;font-weight:300;font-size:3.5em;line-height:1.3;position:relative}.codrops-header h1 span{display:block;padding:0 0 .6em .1em;font-size:60%;opacity:.7}.codrops-top{background:#444;width:100%;text-transform:uppercase;font-weight:700;font-size:.69em;line-height:2.2}.codrops-top a{display:inline-block;padding:0 1em;text-decoration:none;letter-spacing:1px;color:#919191}.codrops-top a:hover{color:#fff}.codrops-top span.right{float:right}.codrops-top span.right a{display:block;float:left}.codrops-icon:before{margin:0 4px;text-transform:none;font-weight:normal;font-style:normal;font-variant:normal;font-family:'codropsicons';line-height:1;speak:none;-webkit-font-smoothing:antialiased}.codrops-icon-drop:before{content:"\e001"}.codrops-icon-prev:before{content:"\e004"}.description{padding:6em 8em;overflow:hidden}.description p{font-size:200%;text-align:center;max-width:800px}.description p,.codrops-header p{margin:0 auto 1em;font-weight:300;line-height:1.4}.codrops-header p{opacity:.5;text-align:left;font-size:200%}.columns p{-webkit-column-break-inside:avoid;-moz-column-break-inside:avoid;column-break-inside:avoid}svg.polaroid{margin:0 auto;display:block;max-width:100%}.description svg.polaroid{padding:5px 0 30px}svg.polaroid rect{stroke:#beb4b7;fill:#fff;stroke-width:6}.codrops-header svg.polaroid{position:absolute;top:50%;z-index:0;opacity:.1;left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.codrops-header svg.polaroid rect{fill:#444;stroke-width:2}.related{text-align:center;font-size:1.35em;padding:6em 2em;overflow:hidden;background-color:#444}.related>a{border:3px solid #3c3c3c;display:inline-block;text-align:center;margin:20px 10px;padding:25px;color:#3c3c3c;-webkit-transition:color .3s,border-color .3s;transition:color .3s,border-color .3s}.related a:hover{color:#beb4b7;border-color:#beb4b7}.related a img{max-width:100%;opacity:.8;-webkit-transition:opacity .3s;transition:opacity .3s}.related a:hover img,.related a:active img{opacity:1}.related a h3{margin:0;padding:.5em 0 .3em;max-width:300px;text-align:left}.js .photostack{height:580px}.photostack-start{cursor:pointer}.photostack>div{width:100%;height:100%;margin:0 auto}.photostack figure{width:320px;height:360px;position:relative;display:inline-block;background:#fff;padding:40px;text-align:center;margin:5px}.js .photostack figure{position:absolute;display:block;margin:0}.photostack figcaption h2{margin:20px 0 0 0;color:#a7a0a2;font-size:16px}.photostack-img{outline:0;display:block;width:240px;height:240px;background:#f9f9f9}.photostack-back{display:none;position:absolute;width:100%;height:100%;top:0;left:0;background:#fff;font-family:"Give You Glory",cursive;color:#a7a0a2;padding:50px 40px;text-align:left;font-size:22px;line-height:1.25;z-index:1}.photostack-back p{margin:0}.photostack-back p span{text-decoration:line-through}.photostack nav{position:absolute;width:100%;bottom:30px;z-index:90;text-align:center;left:0;-webkit-transition:opacity .3s;transition:opacity .3s}.photostack-start nav{opacity:0}.photostack nav span{position:relative;display:inline-block;margin:0 5px;width:30px;height:30px;cursor:pointer;background:#aaa;border-radius:50%;text-align:center;-webkit-transition:-webkit-transform .6s ease-in-out,background .3s;transition:transform .6s ease-in-out,background .3s;-webkit-transform:scale(0.48);transform:scale(0.48)}.photostack nav span:last-child{margin-right:0}.photostack nav span::after{content:"\e600";font-family:'icons';font-size:80%;speak:none;display:inline-block;vertical-align:top;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:30px;color:#fff;opacity:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-transition:opacity .3s;transition:opacity .3s;-webkit-backface-visibility:hidden;backface-visibility:hidden}.photostack nav span.current{background:#888;-webkit-transform:scale(1);transform:scale(1)}.photostack nav span.current.flip{-webkit-transform:scale(1) rotateY(-180deg) translateZ(-1px);transform:scale(1) rotateY(-180deg) translateZ(-1px);background:#555}
.photostack nav span.flippable::after{opacity:1;-webkit-transition-delay:.4s;transition-delay:.4s}.js .photostack::before{content:'';position:absolute;width:100%;height:100%;background:rgba(0,0,0,0.5);top:0;left:0;z-index:100;-webkit-transition:opacity .3s,visibility 0s .3s;transition:opacity .3s,visibility 0s .3s}.js .photostack-start::before{-webkit-transition:opacity .3s;transition:opacity .3s}.js .photostack::after{content:'View Works';font-weight:400;position:absolute;border:3px solid #fff;text-align:center;white-space:nowrap;left:50%;top:50%;-webkit-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%);padding:10px 20px;color:#fff;text-transform:uppercase;letter-spacing:1px;cursor:pointer;z-index:101}.js .photostack::before,.js .photostack::after{opacity:0;visibility:hidden}.js .photostack-start::before,.js .photostack-start:hover::after,.touch .photostack-start::after{opacity:1;visibility:visible}.photostack figure::after{content:'';position:absolute;width:100%;height:100%;top:0;left:0;visibility:visible;opacity:1;background:rgba(0,0,0,0.05);-webkit-transition:opacity .6s;transition:opacity .6s}figure.photostack-current::after{-webkit-transition:opacity .6s,visibility 0s .6s;transition:opacity .6s,visibility 0s .6s;opacity:0;visibility:hidden}.photostack-transition figure{-webkit-transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out}.photostack-perspective{-webkit-perspective:1800px;perspective:1800px}.photostack-perspective>div,.photostack-perspective figure{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.photostack-perspective figure,.photostack-perspective figure div{-webkit-backface-visibility:hidden;backface-visibility:hidden}.photostack-perspective figure.photostack-flip{-webkit-transform-origin:0 50%;transform-origin:0 50%}.csstransformspreserve3d figure.photostack-flip .photostack-back{-webkit-transform:rotateY(180deg);transform:rotateY(180deg);display:block}.no-csstransformspreserve3d figure.photostack-showback .photostack-back{display:block}.no-js .photostack figure{box-shadow:-2px 2px 0 rgba(0,0,0,0.05)}.no-js .photostack figure::after{display:none}.no-js .photostack figure:nth-child(3n){-webkit-transform:translateX(-10%) rotate(5deg);transform:translateX(-10%) rotate(5deg)}.no-js .photostack figure:nth-child(3n-2){-webkit-transform:translateY(10%) rotate(-3deg);transform:translateY(10%) rotate(-3deg)}#photostack-1 nav span.current{background:#888;-webkit-transform:scale(0.61);transform:scale(0.61)}@media screen and (min-width:60em){.columns{-moz-column-count:2;-moz-column-gap:1em;-webkit-column-count:2;-webkit-column-gap:1em;column-count:2;column-gap:1em}.codrops-header .columns{padding:3em 0 0;-moz-column-gap:2em;-webkit-column-gap:2em;column-gap:2em}}@media screen and (max-width:45em){.codrops-header,.description{font-size:80%}.description{padding:4em 1.5em}.codrops-header svg.polaroid{height:200px}}@media screen and (max-width:25em){.codrops-icon span{display:none}.codrops-icon:before{font-size:160%;line-height:2}}