.device,.device *,.device *:after,.device *:before{backface-visibility:hidden}.device{background:#616774;border-radius:25px;box-shadow:6px 6px 0 rgba(0,0,0,.05);transition:all .65s cubic-bezier(.19,1,.22,1)}.device__header{position:absolute;top:22.5px;left:50%;margin-left:-15px;width:30px;height:3px;background:#7c7c7c;border-radius:1.5px;transition:all .65s cubic-bezier(.19,1,.22,1)}.device__header:after,.device__header:before{position:absolute;content:"";transition:all .65s cubic-bezier(.19,1,.22,1)}.device__header:before{top:-.5px;left:-9px;width:4px;height:4px;border-radius:2px;border:1px solid #333;background:#333}.device__header:after{top:-12.5px;left:50%;margin-left:-3px;width:6px;height:6px;border-radius:3px;background:#7c7c7c}.device__content{width:290px;height:450px;background:#fff;border:1px solid #333;border-radius:1.5px;margin:40px 7.5px;transition:all .65s cubic-bezier(.19,1,.22,1)}.device__footer{position:absolute;bottom:5px;left:50%;background:#f7f7f7;margin-left:-15px;width:30px;height:30px;border-radius:15px;transition:all .65s cubic-bezier(.19,1,.22,1)}.device__footer:after{content:"";position:absolute;top:50%;left:50%;margin-left:-5px;margin-top:-5px;width:10px;height:10px;border:1px solid #a8a8a8;border-radius:2.5px;transition:all .65s cubic-bezier(.19,1,.22,1)}.device--ipad .device__header,.device--ipad-mini .device__header{width:0;margin-left:0;border-radius:0;background:0 0}.device--ipad .device__header:before,.device--ipad-mini .device__header:before{transform:scale(0)}.device--ipad .device__header:after,.device--ipad-mini .device__header:after{transform:translate(0,7.5px)}.device--ipad .device__content{width:384px;height:512px;margin:40px}.device--ipad-mini .device__content{width:460px;height:614px;margin:40px 12.5px}.device--browser{border-radius:4px;border-bottom-right-radius:2px;border-bottom-left-radius:2px;border:1px solid #666}.device--browser .device__header,.device--browser .device__header:after,.device--browser .device__header:before{width:7px;height:7px;left:5px;top:0;transform:translate(0px,0px) scale(1);margin-left:0;border-radius:4px;background:0 0;border:1px solid #333}.device--browser .device__header{top:6px;background-color:#fb625d}.device--browser .device__header:before{left:9px;top:-1px;background-color:#fac86b}.device--browser .device__header:after{left:19px;top:-1px;background-color:#a0d57a}.device--browser .device__content{width:800px;height:550px;border-right-width:0;border-left-width:0;border-bottom-width:0;border-radius:0;border-bottom-right-radius:2px;border-bottom-left-radius:2px;margin:20px 0 0}.device--browser .device__footer{transform:scale(0)}@media screen and (max-width:980px){#devicelab{display:none}}.isometric{-webkit-transform:rotateX(33deg) rotateY(0deg) rotateZ(-15deg) translate(-14%,-20%) scale3d(1,1,1);-moz-transform:rotateX(33deg) rotateY(0deg) rotateZ(-15deg) translate(-14%,-20%) scale3d(1,1,1);-ms-transform:rotateX(33deg) rotateY(0deg) rotateZ(-15deg) translate(-14%,-20%) scale3d(1,1,1);-o-transform:rotateX(33deg) rotateY(0deg) rotateZ(-15deg) translate(-14%,-20%) scale3d(1,1,1);transform:rotateX(33deg) rotateY(0deg) rotateZ(-15deg) translate(-14%,0%) scale3d(1,1,1);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d}.content{padding:22px;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d}.phone-card{width:100%;height:160px;border-radius:2px;background:rgba(238,238,238,.8);border-bottom:2px solid #c7c7c7;border-left:2px solid #c7c7c7;-webkit-transform:translate3d(0,0,12px);-moz-transform:translate3d(0,0,12px);-ms-transform:translate3d(0,0,12px);-o-transform:translate3d(0,0,12px);transform:translate3d(0,0,12px);box-shadow:-14.4px 18px 6px rgba(0,0,0,.1),-14.4px 15.6px 6px rgba(0,0,0,.1);-webkit-transition:background .5s ease-out,-webkit-transform .5s,box-shadow .5s;-moz-transition:background .5s ease-out,-moz-transform .5s,box-shadow .5s;transition:background .5s ease-out,transform .5s,box-shadow .5s;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-animation:hideDelay .5s,drop 2s .5s;-moz-animation:hideDelay .5s,drop 2s .5s;animation:hideDelay .5s,drop 2s .5s;cursor:pointer;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-bottom:8px;padding:8px;float:left}.phone-card:before{-webkit-transform:rotateX(-90deg) rotateY(-45deg) rotateZ(0deg) translate3d(0,0,40px);-moz-transform:rotateX(-90deg) rotateY(-45deg) rotateZ(0deg) translate3d(0,0,40px);-ms-transform:rotateX(-90deg) rotateY(-45deg) rotateZ(0deg) translate3d(0,0,40px);-o-transform:rotateX(-90deg) rotateY(-45deg) rotateZ(0deg) translate3d(0,0,40px);transform:rotateX(-90deg) rotateY(-45deg) rotateZ(0deg) translate3d(0,0,40px);display:block;position:absolute;right:100%;top:50%;margin-top:-1em;opacity:0;-webkit-transition:opacity .5s,-webkit-transform .5s;-moz-transition:opacity .5s,-moz-transform .5s;transition:opacity .5s,transform .5s}.phone-card1:before{content:"Edit text and add new elements"}.phone-card2:before{content:"Images and text rendered separately"}.phone-card:hover{background:#fff;-webkit-transform:translate3d(0,0,38px);-moz-transform:translate3d(0,0,38px);-ms-transform:translate3d(0,0,38px);-o-transform:translate3d(0,0,38px);transform:translate3d(0,0,38px);box-shadow:-21.6px 27px 9px rgba(0,0,0,.1),-21.6px 23.4px 9px rgba(0,0,0,.1)}.phone-card:hover:before{-webkit-transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0,0,56px);-moz-transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0,0,56px);-ms-transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0,0,56px);-o-transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0,0,56px);transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(-50px,20px,56px);opacity:.8}.floor{width:auto;height:auto;border-radius:4px;background:#fff;border-bottom:8px solid #bbb;border-left:4px solid #bbb;display:block;width:320px;height:560px;padding:0;position:absolute;left:0;top:-80px}.hidden{opacity:0;pointer-events:none}@-webkit-keyframes drop{0%,from{-webkit-transform:translate3d(0,0,90px);box-shadow:-108px 135px 45px rgba(0,0,0,.1),-108px 117px 45px rgba(0,0,0,.1);opacity:0}50%{opacity:1}}@-moz-keyframes drop{0%,from{-moz-transform:translate3d(0,0,90px);box-shadow:-108px 135px 45px rgba(0,0,0,.1),-108px 117px 45px rgba(0,0,0,.1);opacity:0}50%{opacity:1}}@keyframes drop{0%,from{-webkit-transform:translate3d(0,0,90px);-moz-transform:translate3d(0,0,90px);-ms-transform:translate3d(0,0,90px);-o-transform:translate3d(0,0,90px);transform:translate3d(0,0,90px);box-shadow:-108px 135px 45px rgba(0,0,0,.1),-108px 117px 45px rgba(0,0,0,.1);opacity:0}50%{opacity:1}}@-webkit-keyframes hideDelay{from,to{opacity:0}}@-moz-keyframes hideDelay{from,to{opacity:0}}@keyframes hideDelay{from,to{opacity:0}}.desc{text-align:center}.desc h1{text-transform:uppercase;font-weight:300}.desc a{color:#008fa1;font-weight:500;text-decoration:none}.material-icons.md-18{font-size:18px}.material-icons.md-24{font-size:24px}.material-icons.md-36{font-size:36px}.material-icons.md-48{font-size:48px}.md-light{color:#fff}#drawerOpener{cursor:pointer}.iphone{width:16.06em;height:30.6em;border-radius:1.875em;position:relative;background:#eee}.iphone:before{content:"";width:14.5em;height:20.938em;position:absolute;top:4.75em;left:.75em;background:#4f4f4f}.iphone:after{content:"";position:absolute;top:4.75em;left:.75em;border-top:20.938em solid #595959;border-left:14.5em solid transparent}.powerButton{width:2.188em;height:.188em;background:#e0e0e0;position:absolute;right:2.5em;top:-.188em}.leftButtons{width:.188em;height:1.25em;top:3.25em;left:-.188em;position:absolute;background:#e0e0e0}.leftButtons:before{content:"";width:.188em;height:.875em;position:absolute;top:3em;background:#e0e0e0}.leftButtons:after{content:"";width:.188em;height:.875em;position:absolute;top:5.5em;background:#e0e0e0}.details{width:2em;height:.25em;border-radius:.25em;position:absolute;top:1.313em;left:7em;background:#7c7c7c}.details:before{content:"";width:2.5em;height:.25em;border-radius:.25em;position:absolute;top:1em;left:-.25em;background:#7c7c7c}.details:after{content:"";width:.438em;height:.438em;border-radius:100%;position:absolute;top:.9em;left:-1.25em;background:#4f4f4f}.homeButton{width:2.25em;height:2.25em;border-radius:100%;position:absolute;bottom:1em;right:6.75em;background:#f7f7f7}.homeButton:before{content:"";width:.813em;height:.813em;border:.15em solid #a8a8a8;border-radius:.2em;position:absolute;top:.6em;left:.77em}