.phone .frame:after,.phone .frame:before{content:'';display:block}body{margin:0}.main{background-color:#FF5A5F;width:300px;height:250px;position:relative;overflow:hidden}.first-half,.second-half{position:absolute;top:0;left:0;width:100%;height:100%}.first-half{opacity:0}.animate .first-half{-webkit-animation:first-half 9s 3;-moz-animation:first-half 9s 3;-o-animation:first-half 9s 3;animation:first-half 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.first-half img{width:100%}.second-half{text-align:center;color:#fff}.second-half div{display:block;margin-left:auto;margin-right:auto}.second-half .logo{opacity:0;margin-top:25px}.animate .second-half .logo{-webkit-animation:logo 9s 3;-moz-animation:logo 9s 3;-o-animation:logo 9s 3;animation:logo 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.second-half .welcome{opacity:0;margin-top:9px}.animate .second-half .welcome{-webkit-animation:welcome 9s 3;-moz-animation:welcome 9s 3;-o-animation:welcome 9s 3;animation:welcome 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.second-half .experience{opacity:0;margin-top:11px}.animate .second-half .experience{-webkit-animation:experience 9s 3;-moz-animation:experience 9s 3;-o-animation:experience 9s 3;animation:experience 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.second-half .learn-more{opacity:0;margin-top:10px;position:relative;z-index:1}.animate .second-half .learn-more{-webkit-animation:learn-more 9s 3;-moz-animation:learn-more 9s 3;-o-animation:learn-more 9s 3;animation:learn-more 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.animate .second-half .learn-more img{-webkit-transition:opacity .25s ease-in-out;-moz-transition:opacity .25s ease-in-out;-o-transition:opacity .25s ease-in-out;transition:opacity .25s ease-in-out}.animate .second-half .learn-more img:hover{opacity:.5}.clickable-link{position:absolute;width:100%;height:100%;top:0;left:0}.phone{opacity:0;text-align:center;position:relative;height:100%}.animate .phone{opacity:1;-webkit-animation:phone 9s 3;-moz-animation:phone 9s 3;-o-animation:phone 9s 3;animation:phone 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards}.phone .frame{opacity:0;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);-moz-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);width:95px;height:196px;background-color:#f77a7e;background-image:-webkit-linear-gradient(90deg,#f54b50,#f56266 5%,#f77a7e);background-image:-moz-linear-gradient(90deg,#f54b50,#f56266 5%,#f77a7e);background-image:-o-linear-gradient(90deg,#f54b50,#f56266 5%,#f77a7e);background-image:linear-gradient(0deg,#f54b50,#f56266 5%,#f77a7e);-webkit-border-radius:12.78px;-moz-border-radius:12.78px;border-radius:12.78px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:#ef4346 0 0 .43px .85px inset,#f6555b 0 0 0 1.7px inset,#ed4145 0 .43px 0 1.7px inset,rgba(0,0,0,.15) 0 0 4px 3px;-moz-box-shadow:#ef4346 0 0 .43px .85px inset,#f6555b 0 0 0 1.7px inset,#ed4145 0 .43px 0 1.7px inset,rgba(0,0,0,.15) 0 0 4px 3px;box-shadow:#ef4346 0 0 .43px .85px inset,#f6555b 0 0 0 1.7px inset,#ed4145 0 .43px 0 1.7px inset,rgba(0,0,0,.15) 0 0 4px 3px}.animate .phone .frame{-webkit-animation:phone-case 9s 3;-moz-animation:phone-case 9s 3;-o-animation:phone-case 9s 3;animation:phone-case 9s 3;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0}.phone .frame:before{position:absolute;width:93%;height:191px;left:50%;top:50%;-webkit-transform:translate3d(-50%,-50%,0);-moz-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);background-color:#f66465;background-image:-webkit-linear-gradient(90deg,#f6555b 30%,#f66465);background-image:-moz-linear-gradient(90deg,#f6555b 30%,#f66465);background-image:-o-linear-gradient(90deg,#f6555b 30%,#f66465);background-image:linear-gradient(0deg,#f6555b 30%,#f66465);-moz-border-radius-topleft:8.52px 12.78px;-moz-border-radius-topright:8.52px 12.78px;-moz-border-radius-bottomleft:8.52px 12.78px;-moz-border-radius-bottomright:8.52px 12.78px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-filter:blur(.8px);-moz-filter:blur(.8px);-ms-filter:blur(.8px);-o-filter:blur(.8px);filter:blur(.8px);-webkit-border-radius:8.52px/12.78px;border-radius:8.52px/12.78px}.phone .frame:after{width:85px;height:150px;position:absolute;top:23.4px;left:50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);background-color:#363535;-webkit-border-radius:3.5px;-moz-border-radius:3.5px;border-radius:3.5px}.phone .screen-container{position:relative;top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}.phone .screen-container img{-webkit-transform:scale(.2875);-moz-transform:scale(.2875);-ms-transform:scale(.2875);-o-transform:scale(.2875);transform:scale(.2875)}.animate .phone .screen-container img{-webkit-animation:phone-screen 9s 3;-moz-animation:phone-screen 9s 3;-o-animation:phone-screen 9s 3;animation:phone-screen 9s 3}.overlay{position:absolute;width:100%;height:100%;top:0;left:0;background-color:#FF5A5F;opacity:0;z-index:3;pointer-events:none}.animate .overlay{-webkit-animation:overlay 9s 2;-moz-animation:overlay 9s 2;-o-animation:overlay 9s 2;animation:overlay 9s 2;animation-fill-mode:backwards}@-webkit-keyframes first-half{0%,100%,33%{opacity:0}24%,4%{opacity:1}}@-moz-keyframes first-half{0%,100%,33%{opacity:0}24%,4%{opacity:1}}@-o-keyframes first-half{0%,100%,33%{opacity:0}24%,4%{opacity:1}}@keyframes first-half{0%,100%,33%{opacity:0}24%,4%{opacity:1}}@-webkit-keyframes second-half{0%,42%{opacity:0}100%,47%{opacity:1}}@-moz-keyframes second-half{0%,42%{opacity:0}100%,47%{opacity:1}}@-o-keyframes second-half{0%,42%{opacity:0}100%,47%{opacity:1}}@keyframes second-half{0%,42%{opacity:0}100%,47%{opacity:1}}@-webkit-keyframes phone{0%,47%{-webkit-transform:translateY(0);transform:translateY(0)}100%,56%{-webkit-transform:translateY(250px);transform:translateY(250px)}}@-moz-keyframes phone{0%,47%{-moz-transform:translateY(0);transform:translateY(0)}100%,56%{-moz-transform:translateY(250px);transform:translateY(250px)}}@-o-keyframes phone{0%,47%{-o-transform:translateY(0);transform:translateY(0)}100%,56%{-o-transform:translateY(250px);transform:translateY(250px)}}@keyframes phone{0%,47%{-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}100%,56%{-webkit-transform:translateY(250px);-moz-transform:translateY(250px);-o-transform:translateY(250px);transform:translateY(250px)}}@-webkit-keyframes phone-screen{0%{opacity:0;-webkit-transform:scale(.2875);transform:scale(.2875);-webkit-border-radius:0;border-radius:0}4%{opacity:1}33%{-webkit-transform:scale(.2875);transform:scale(.2875);-webkit-border-radius:0;border-radius:0}39%{-webkit-transform:scale(.5);transform:scale(.5);-webkit-border-radius:1.5px;border-radius:1.5px}100%{opacity:1;-webkit-transform:scale(.5);transform:scale(.5);-webkit-border-radius:1.5px;border-radius:1.5px}}@-moz-keyframes phone-screen{0%{opacity:0;-moz-transform:scale(.2875);transform:scale(.2875);-moz-border-radius:0;border-radius:0}4%{opacity:1}33%{-moz-transform:scale(.2875);transform:scale(.2875);-moz-border-radius:0;border-radius:0}39%{-moz-transform:scale(.5);transform:scale(.5);-moz-border-radius:1.5px;border-radius:1.5px}100%{opacity:1;-moz-transform:scale(.5);transform:scale(.5);-moz-border-radius:1.5px;border-radius:1.5px}}@-o-keyframes phone-screen{0%{opacity:0;-o-transform:scale(.2875);transform:scale(.2875);border-radius:0}4%{opacity:1}33%{-o-transform:scale(.2875);transform:scale(.2875);border-radius:0}39%{-o-transform:scale(.5);transform:scale(.5);border-radius:1.5px}100%{opacity:1;-o-transform:scale(.5);transform:scale(.5);border-radius:1.5px}}@keyframes phone-screen{0%{opacity:0;-webkit-transform:scale(.2875);-moz-transform:scale(.2875);-o-transform:scale(.2875);transform:scale(.2875);-webkit-border-radius:0;-moz-border-radius:0;border-radius:0}4%{opacity:1}33%{-webkit-transform:scale(.2875);-moz-transform:scale(.2875);-o-transform:scale(.2875);transform:scale(.2875);-webkit-border-radius:0;-moz-border-radius:0;border-radius:0}39%{-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5);-webkit-border-radius:1.5px;-moz-border-radius:1.5px;border-radius:1.5px}100%{opacity:1;-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5);-webkit-border-radius:1.5px;-moz-border-radius:1.5px;border-radius:1.5px}}@-webkit-keyframes phone-case{0%,33%{opacity:0;-webkit-transform:scale(.575) translate3d(-50%,-50%,0);transform:scale(.575) translate3d(-50%,-50%,0)}100%,39%{opacity:1;-webkit-transform:scale(1) translate3d(-50%,-50%,0);transform:scale(1) translate3d(-50%,-50%,0)}}@-moz-keyframes phone-case{0%,33%{opacity:0;-moz-transform:scale(.575) translate3d(-50%,-50%,0);transform:scale(.575) translate3d(-50%,-50%,0)}100%,39%{opacity:1;-moz-transform:scale(1) translate3d(-50%,-50%,0);transform:scale(1) translate3d(-50%,-50%,0)}}@-o-keyframes phone-case{0%,33%{opacity:0;-o-transform:scale(.575) translate3d(-50%,-50%,0);transform:scale(.575) translate3d(-50%,-50%,0)}100%,39%{opacity:1;-o-transform:scale(1) translate3d(-50%,-50%,0);transform:scale(1) translate3d(-50%,-50%,0)}}@keyframes phone-case{0%,33%{opacity:0;-webkit-transform:scale(.575) translate3d(-50%,-50%,0);-moz-transform:scale(.575) translate3d(-50%,-50%,0);-o-transform:scale(.575) translate3d(-50%,-50%,0);transform:scale(.575) translate3d(-50%,-50%,0)}100%,39%{opacity:1;-webkit-transform:scale(1) translate3d(-50%,-50%,0);-moz-transform:scale(1) translate3d(-50%,-50%,0);-o-transform:scale(1) translate3d(-50%,-50%,0);transform:scale(1) translate3d(-50%,-50%,0)}}@-webkit-keyframes logo{0%,46%{opacity:0;-webkit-transform:scale(1.5);transform:scale(1.5)}100%,52%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-moz-keyframes logo{0%,46%{opacity:0;-moz-transform:scale(1.5);transform:scale(1.5)}100%,52%{opacity:1;-moz-transform:scale(1);transform:scale(1)}}@-o-keyframes logo{0%,46%{opacity:0;-o-transform:scale(1.5);transform:scale(1.5)}100%,52%{opacity:1;-o-transform:scale(1);transform:scale(1)}}@keyframes logo{0%,46%{opacity:0;-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)}100%,52%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-webkit-keyframes welcome{0%,48%{opacity:0;-webkit-transform:scale(1.5);transform:scale(1.5)}54%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-moz-keyframes welcome{0%,48%{opacity:0;-moz-transform:scale(1.5);transform:scale(1.5)}54%{opacity:1;-moz-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-o-keyframes welcome{0%,48%{opacity:0;-o-transform:scale(1.5);transform:scale(1.5)}54%{opacity:1;-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@keyframes welcome{0%,48%{opacity:0;-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)}54%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-webkit-keyframes experience{0%,50%{opacity:0;-webkit-transform:scale(1.5);transform:scale(1.5)}56%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-moz-keyframes experience{0%,50%{opacity:0;-moz-transform:scale(1.5);transform:scale(1.5)}56%{opacity:1;-moz-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-o-keyframes experience{0%,50%{opacity:0;-o-transform:scale(1.5);transform:scale(1.5)}56%{opacity:1;-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@keyframes experience{0%,50%{opacity:0;-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)}56%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-webkit-keyframes learn-more{0%,52%{opacity:0;-webkit-transform:scale(1.5);transform:scale(1.5)}58%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-moz-keyframes learn-more{0%,52%{opacity:0;-moz-transform:scale(1.5);transform:scale(1.5)}58%{opacity:1;-moz-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-o-keyframes learn-more{0%,52%{opacity:0;-o-transform:scale(1.5);transform:scale(1.5)}58%{opacity:1;-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@keyframes learn-more{0%,52%{opacity:0;-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)}58%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{opacity:1}}@-webkit-keyframes overlay{0%,91%{opacity:0}100%{opacity:1}}@-moz-keyframes overlay{0%,91%{opacity:0}100%{opacity:1}}@-o-keyframes overlay{0%,91%{opacity:0}100%{opacity:1}}@keyframes overlay{0%,91%{opacity:0}100%{opacity:1}}