@keyframes stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}
@keyframes stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4);transform:scaleY(.4)}20%{-webkit-transform:scaleY(1);transform:scaleY(1)}}
@-webkit-keyframes waves-r2l{0%{background-position:0 0}to{background-position:-552px 0}}
@keyframes waves-r2l{0%{background-position:0 0}to{background-position:-552px 0}}
@-webkit-keyframes waves-l2r{0%{background-position:0 0}to{background-position:552px 0}}
@keyframes waves-l2r{0%{background-position:0 0}to{background-position:552px 0}}
@-webkit-keyframes kan-swing{0%{-webkit-transform:rotate(1deg)}50%{-webkit-transform:rotate(-2deg)}to{-webkit-transform:rotate(1deg)}}
@keyframes kan-swing{0%{transform:rotate(1deg)}50%{transform:rotate(-2deg)}to{transform:rotate(1deg)}}
@keyframes blink{0%{opacity:1}50%{opacity:0}}
@-webkit-keyframes blink{0%,to{opacity:1}50%{opacity:0}to{opacity:1}}
html{color:#222;font-size:1em;line-height:1.4}
::-moz-selection{background:#b3d4fc;text-shadow:none}
::selection{background:#b3d4fc;text-shadow:none}
body.is-touch #banner{background-attachment:scroll}*{padding:0;margin:0}
body{font-family:Ubuntu,sans-serif;font-size:100%;background:#f8f8f8}
a{text-decoration:none;color:#666}
a:hover{color:#999}p{line-height:2em;margin:0 0 20px;text-align:center}
img{vertical-align:middle}
.loading{position:fixed;top:0;left:0;z-index:100;width:100%;height:100%;background-color:#000;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}
.spinner{position:absolute;top:50%;left:50%;margin-top:-40px;margin-left:-30px;width:50px;height:60px;text-align:center;font-size:10px}
.spinner>div{display:inline-block;width:6px;height:100%;background-color:#eee;-webkit-animation:stretchdelay 1.2s infinite ease-in-out;animation:stretchdelay 1.2s infinite ease-in-out}
.spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}
.spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}
.spinner .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}
.section_padding{padding:60px 0}
.project_area{padding-bottom:5pc;text-align:center}
.prject_area_title{margin-bottom:40px}
.prject_area_title h2{color:#202020;font-size:30px;line-height:40px;font-family:asapregular;margin-top:0;margin-bottom:25px}
.prject_area_title h2 span{font-family:asapbold;color:#ffc1c1}
.prject_area_title p{color:#666;font-family:karlaregular;font-size:1pc;line-height:29px;margin:0 15% 15px}
.single_project{margin-bottom:20px}
.work_img{position:relative}
.project_overlay{height:100%;left:0;position:absolute;top:0;width:100%;background:#ffc1c1 none repeat scroll 0 0;transform:scale(0);transition-duration:.3s;transition-property:transform;transition-timing-function:ease-out;opacity:.9}
.project_overlay a{border:2px solid #fff;border-radius:5px;color:#fff;font-family:asapregular;font-size:1pc;left:27%;padding:15px 40px;position:absolute;top:40%}
.project_overlay .button{border:3px solid #fff;display:inline-block;font-weight:700;left:0;letter-spacing:1px;outline:medium 0;overflow:hidden;padding:15px 40px;position:relative;text-transform:uppercase;top:40%;transition:all .3s ease 0s;text-decoration:none}
.project_overlay .button:after{content:'';position:absolute;z-index:-1;-webkit-transition:all .3s;transition:all .3s;border:3px solid #fff;color:#fff;width:100%;height:0;top:50%;left:50%;background:#fff;opacity:0;-webkit-transform:translateX(-50%) translateY(-50%) rotate(45deg);transform:translateX(-50%) translateY(-50%) rotate(45deg)}
.button:active,.project_overlay .button:hover{color:#aaa;text-decoration:none}
.project_overlay .button:active:after,.project_overlay .button:hover:after{height:225%;opacity:1}
.single_project img{width:100%;transition:all 1.2s linear}
.single_project h3{background:#eee none repeat scroll 0 0;border-radius:0 0 10px 10px;color:#202020;font-family:asapregular;font-size:20px;margin:0;padding:25px 0}
.single_project:hover div.project_overlay{transform:scale(1)}
#banner{background-attachment:fixed;background-color:#272833;background-image:url(../img/loli.jpg);background-position:center center;background-size:cover;box-shadow:0 .25em .5em 0 rgba(0,0,0,.25);min-height:100vh;position:relative;text-align:center;z-index:21}
#banner:before{content:'';display:inline-block;height:100vh;vertical-align:middle;width:1%}
#banner:after{background-image:-webkit-linear-gradient(top,rgba(23,24,32,.75),rgba(23,24,32,.65));background-image:linear-gradient(top,rgba(23,24,32,.95),rgba(23,24,32,.95));content:'';display:block;height:100%;left:0;position:absolute;top:0;width:100%}
#banner .content{margin-right:1%;max-width:95%;padding:6em;position:relative;text-align:right;z-index:1}
#banner .content,#banner .content header{display:inline-block;vertical-align:middle}
#banner .content header h2{font-size:2.5em;margin:0}
#banner .content header p{margin:.5em 0 0;top:0}
#banner .content .image{border-radius:100%;display:inline-block;height:18em;margin-left:3em;vertical-align:middle;width:18em}
#banner .content .image img{border-radius:100%;display:block;width:100%}
.wrap{max-width:600px;margin:150px auto}
.type-wrap{margin:10px auto;padding:20px;background:#f0f0f0;border-radius:5px;border:1px solid #ccc}
.links{margin:20px 0;font-size:.75em;text-align:center}
.typing-cursor{opacity:1;-webkit-animation:blink .7s infinite;animation:blink .7s infinite}
.kankore-bath .water{height:50px;background:url(../img/kankore-bath-water.png) repeat-x bottom;z-index:105;position:fixed;bottom:-1px;width:100%;opacity:.8;left:0;-webkit-animation:waves-r2l 10s linear infinite;animation:waves-r2l 10s linear infinite}
.kankore-bath .copyright{position:relative;top:30px;left:5px;color:#fff;font-size:80%;opacity:.8}
.kankore-bath .kan{cursor:pointer;position:fixed;top:999px;left:-20px;display:none;z-index:99}
.kankore-bath .kan.floating{-webkit-transition:left 1s linear,top 1s linear,-webkit-transform 1.5s ease!important;transition:left 1s linear,top 1s linear,transform 1.5s ease!important}
.kankore-bath .kan.dragging{-webkit-transition:none!important;transition:none!important;-webkit-animation:kan-swing .8s linear infinite;animation:kan-swing .8s linear infinite}
.kankore-bath .kan.dropping{-webkit-transition:top .8s cubic-bezier(.795,.21,.535,1.235)!important;transition:top .8s cubic-bezier(.795,.21,.535,1.235)!important}
.kankore-bath .kan img{opacity:1!important;outline:0;pointer-events:none;-moz-user-select:none;-webkit-user-select:none;user-select:none}