*, *:after, *:before{-webkit-box-sizing:border-box;box-sizing:border-box;}
.clearfix:before, .clearfix:after{content:'';display:table;}
.clearfix:after{clear:both;}
body{}
a{}
.demo-1{}
.demo-1 a{}
.demo-2{}
.demo-2 a{}
a:hover, a:focus{}
section{}
.codrops-header{margin:0 auto;padding:2em;text-align:center;}
.codrops-header h1{margin:0;font-weight:300;font-size:2.5em;line-height:1.3;}
.codrops-header h1 span{display:block;padding:0 0 0.6em 0.1em;font-size:60%;opacity:0.7;}
.codrops-top{width:100%;text-transform:uppercase;font-weight:700;font-size:0.69em;line-height:2.2;}
.codrops-top a{display:inline-block;padding:2em;text-decoration:none;letter-spacing:1px;}
.codrops-top span.right{float:right;}
.codrops-top span.right a{display:block;float:left;}
.codrops-demos{padding:2em 0 1em;font-size:0.8em;text-align:center;}
.codrops-demos a{display:inline-block;margin:0.5em 0.75em;line-height:1.5;outline:none;text-decoration:none;text-transform:uppercase;letter-spacing:1px;font-weight:700;}
.codrops-demos a.current-demo{color:inherit;}
body #cdawrap{background:none;top:50px;opacity:0;-webkit-transition:opacity 0.3s 1.2s;transition:opacity 0.3s 1.2s;font-family:Helvetica, Arial, sans-serif;}
body #cdawrap a{color:#fff !important;}
body .loaded ~ #cdawrap{opacity:1;}
body #cdawrap #cda-remove{top:20px;right:25px;width:20px;height:20px;opacity:0;}
body #cdawrap:hover #cda-remove{opacity:1;}
@media screen and (max-width:35em){.codrops-icon span{display:none;}
}
@font-face{font-weight:normal;font-style:normal;font-family:'Blokk';src:url('../fonts/blokk/BLOKKRegular.eot');src:url('../fonts/blokk/BLOKKRegular.eot?#iefix') format('embedded-opentype'),
url('../fonts/blokk/BLOKKRegular.woff') format('woff'),
url('../fonts/blokk/BLOKKRegular.svg#BLOKKRegular') format('svg');}
@font-face{font-weight:normal;font-style:normal;font-family:'feather';src:url('../fonts/feather/feather.eot?-9jv4cc');src:url('../fonts/feather/feather.eot?#iefix-9jv4cc') format('embedded-opentype'),
url('../fonts/feather/feather.woff?-9jv4cc') format('woff'),
url('../fonts/feather/feather.ttf?-9jv4cc') format('truetype'),
url('../fonts/feather/feather.svg?-9jv4cc#feather') format('svg');}
.ip-header{position:fixed;top:0;z-index:100;min-height:480px;width:100%;height:100%;background:url(../images/footer_logo.png) center no-repeat #f1f1f1;}
.ip-header h1{margin:0;}
.ip-logo,
.ip-loader{position:absolute;left:0;width:100%;opacity:0;cursor:default;pointer-events:none;}
.ip-logo{top:0;height:100%;-webkit-transform:translate3d(0,25%,0);transform:translate3d(0,25%,0);}
.ip-loader{bottom:20%;}
.ip-header .ip-inner{display:block;margin:0 auto;}
.ip-header .ip-logo svg{min-width:320px;max-width:480px;width:25%;}
.ip-header .ip-logo svg path{fill:#ef6e7e;}
.ip-header .ip-loader svg path{fill:none;stroke-width:6;}
.ip-header .ip-loader svg path.ip-loader-circlebg{stroke:#ddd;}
.ip-header .ip-loader svg path.ip-loader-circle{-webkit-transition:stroke-dashoffset 0.2s;transition:stroke-dashoffset 0.2s;stroke:#ef6e7e;}
.ip-main{}
.ip-main h2{}
.browser{margin:0 auto;padding-top:8%;min-height:400px;max-width:1000px;width:100%;border-radius:8px;background:#fff url(../img/browser.png) no-repeat 50% 0;background-size:100%;color:#d3d3d3;}
.box{float:left;padding:3.5em;width:33.3%;font-size:0.7em;line-height:1.5;}
.box p{font-family:'Blokk', Arial, sans-serif;}
[class^="icon-"]::before,
[class*=" icon-"]::before{display:block;margin-bottom:0.5em;padding:0.5em;border-radius:5px;background:#dfdfdf;color:#fff;text-align:center;text-transform:none;font-weight:normal;font-style:normal;font-variant:normal;font-size:5em;font-family:'feather';line-height:1;speak:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.icon-bell:before{content:"\e006";}
.icon-cog:before{content:"\e023";}
.icon-heart:before{content:"\e024";}
.loading .ip-logo,
.loading .ip-loader{opacity:1;-webkit-animation:animInitialHeader 1s cubic-bezier(0.7,0,0.3,1) both;animation:animInitialHeader 1s cubic-bezier(0.7,0,0.3,1) both;}
.loading .ip-loader{-webkit-animation-delay:0.2s;animation-delay:0.2s;}
@-webkit-keyframes animInitialHeader{from{opacity:0;-webkit-transform:translate3d(0,800px,0);}
}
@keyframes animInitialHeader{from{opacity:0;-webkit-transform:translate3d(0,800px,0);transform:translate3d(0,800px,0);}
}
.loaded .ip-logo,
.loaded .ip-loader{opacity:1;}
.loaded .ip-logo{-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-animation:animLoadedLogo 1s cubic-bezier(0.7,0,0.3,1) forwards;animation:animLoadedLogo 1s cubic-bezier(0.7,0,0.3,1) forwards;}
@-webkit-keyframes animLoadedLogo{to{-webkit-transform:translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);}
}
@keyframes animLoadedLogo{to{-webkit-transform:translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);transform:translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);}
}
.loaded .ip-loader{-webkit-animation:animLoadedLoader 0.5s cubic-bezier(0.7,0,0.3,1) forwards;animation:animLoadedLoader 0.5s cubic-bezier(0.7,0,0.3,1) forwards;}
@-webkit-keyframes animLoadedLoader{to{opacity:0;-webkit-transform:translate3d(0,-100%,0) scale3d(0.3,0.3,1);}
}
@keyframes animLoadedLoader{to{opacity:0;-webkit-transform:translate3d(0,-100%,0) scale3d(0.3,0.3,1);transform:translate3d(0,-100%,0) scale3d(0.3,0.3,1);}
}
.loaded .ip-logo svg path{-webkit-transition:all 0.5s ease 0.3s;transition:all 0.5s ease 0.3s;fill:#fff;}
.loaded .ip-header{-webkit-animation:animLoadedHeader 1s cubic-bezier(0.7,0,0.3,1) forwards;animation:animLoadedHeader 1s cubic-bezier(0.7,0,0.3,1) forwards;}
@-webkit-keyframes animLoadedHeader{to{-webkit-transform:translate3d(0,-100%,0);}
}
@keyframes animLoadedHeader{to{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);}
}
.loaded .ip-main h2,
.loaded .ip-main .browser,
.loaded .ip-main .browser .box,
.loaded .codrops-demos{-webkit-animation:animLoadedContent 1s cubic-bezier(0.7,0,0.3,1) both;animation:animLoadedContent 1s cubic-bezier(0.7,0,0.3,1) both;}
.loaded .ip-main .browser,
.loaded .ip-main .browser .box:first-child{-webkit-animation-delay:0.1s;animation-delay:0.1s;}
.loaded .ip-main .browser .box:nth-child(2){-webkit-animation-delay:0.15s;animation-delay:0.15s;}
.loaded .ip-main .browser .box:nth-child(3){-webkit-animation-delay:0.2s;animation-delay:0.2s;}
@-webkit-keyframes animLoadedContent{from{opacity:0;-webkit-transform:translate3d(0,200px,0);}
}
@keyframes animLoadedContent{from{opacity:0;-webkit-transform:translate3d(0,200px,0);transform:translate3d(0,200px,0);}
}
.layout-switch .ip-header{position:absolute;}
.no-js .ip-header{position:relative;min-height:0px;}
.no-js .ip-header .ip-logo{margin-top:20px;height:180px;opacity:1;-webkit-transform:none;transform:none;}
.no-js .ip-header .ip-logo svg path{fill:#fff;}
@media screen and (max-width:45em){.ip-main h2{font-size:2.25em;font-size:10vw;}
.box{width:100%%;}
}