.gridLine{stroke:#DDD;stroke-width:.1;stroke-miterlimit:1}.device{fill:#F8F8F8}.deviceScreen{fill:none;stroke:#C9CACA;stroke-miterlimit:10}.deviceGradient{fill:url(#SVGID_1_)}.notch{fill:#E0E0E0}.animText{font-family:apax;font-size:12px}.animText.medium{font-family:apax;font-size:9px}.animText.small{font-size:6px}.canvas{position:relative;width:100%}.canvas .canvasElements{position:absolute;width:100%;height:100%;top:0%;left:0%}.canvas .canvasElements .fixed{position:absolute;width:100%;height:100%}.canvas.latopScreen .canvasBg{width:100%;height:100%;position:absolute;top:0;z-index:-1}.canvas.latopScreen .canvasElements{position:absolute;width:75%;height:85%;top:5%;left:12.5%}.canvas.latopScreen .dropShadow{position:absolute;top:0;left:10%;width:80%;height:95%;z-index:-1;background:#FFF;-webkit-box-shadow:0 60px 50px -40px rgba(0,0,0,.5);-moz-box-shadow:0 60px 50px -40px rgba(0,0,0,.5);box-shadow:0 60px 50px -40px rgba(0,0,0,.5)}.canvas.latopScreen .dropShadow::before{position:absolute;content:"";background:#FFF;z-index:0;width:10%;height:100%;left:-10%;top:0}.canvas.latopScreen .dropShadow::after{position:absolute;content:"";background:#FFF;z-index:0;width:10%;height:100%;left:100%;top:0}.canvas.mobileScreen .canvasBg{width:100%;height:100%;position:absolute;top:0;z-index:1}.canvas.mobileScreen .canvasElements{position:absolute;width:35%;height:93.33%;top:3.33%;left:32.5%;overflow:hidden}.canvas.mobileScreen .dropShadow{position:absolute;top:1%;left:30%;width:40%;height:98%;border-radius:7%;-webkit-box-shadow:10px 15px 10px 1px rgba(0,0,0,.2);-moz-box-shadow:10px 15px 10px 1px rgba(0,0,0,.2);box-shadow:10px 15px 10px 1px rgba(0,0,0,.2)}.canvas .headerBar{fill:#E6ECF1;background:#E6ECF1}.canvas .screenBox{stroke:#787a7a;stroke-width:.1;fill:#FFF;background:#FFF;border:1px solid #DADEDE}.canvas .graph{fill:#DBAE29;background:#DBAE29}.canvas .graph.green{fill:#6ECF72;background:#6ECF72}.canvas .graph.red{fill:#E1141D;background:#E1141D}.canvas .graph.blue{fill:#00467B;background:#00467B}.canvas .canvasButton{width:13%;height:8%;fill:#CDDCF6;background:#CDDCF6}.canvas .arrow{width:5%;height:10%;fill:#000}.canvas .click{width:10%;height:10%;fill:#FFF}.resetAnimation{width:30px;height:30px;margin:30px auto 0;cursor:pointer}.resetAnimation path{fill:#0650D0;opacity:.25;-webkit-transition:-webkit-transform .5s ease-in-out;transition:transform .5s ease-in-out;-webkit-transform-origin:50% 50%;-moz-transform-origin:50% 50%;-o-transform-origin:50% 50%;transform-origin:50% 50%}.resetAnimation:hover path{opacity:1;-webkit-transform:rotate(360deg);transform:rotate(360deg);-webkit-transform-origin:50% 50%;-moz-transform-origin:50% 50%;-o-transform-origin:50% 50%;transform-origin:50% 50%}.st0,.fill-none{fill:none}.st1,.fill-red-60{fill:#E1141D}.st2,.fill-black-100{fill:#000}.st3{fill:none;stroke:#000;stroke-width:2;stroke-miterlimit:10}.st4{fill:none;stroke:#E1141D;stroke-width:2;stroke-miterlimit:10}#icon-innovation.canvas .iconEl2{position:absolute;opacity:0;width:100%;height:100%}#icon-innovation.canvas .iconEl1{position:absolute;opacity:0;width:100%;height:100%}.animationInView #icon-innovation .iconEl2{animation-name:icon-innovation-el2;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-innovation .iconEl1{animation-name:icon-innovation-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-innovation-el2{0%{opacity:0}10%{opacity:0}30%{opacity:1}100%{opacity:1}}@keyframes icon-innovation-el1{0%{opacity:0}30%{opacity:0}50%{opacity:1}60%{opacity:1}65%{opacity:.6}78%{opacity:1}85%{opacity:1}90%{opacity:.7}93%{opacity:1}100%{opacity:1}}#icon-drink-coffee.canvas .iconEl1{position:absolute;width:100%;top:20%;height:100%}#icon-drink-coffee.canvas .iconEl2{position:absolute;opacity:0;width:100%;left:-20%;height:100%}#icon-drink-coffee.canvas .iconEl3{position:absolute;opacity:0;width:100%;height:100%}.animationInView #icon-drink-coffee .iconEl1{animation-name:icon-drink-coffee-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-drink-coffee .iconEl2{animation-name:icon-drink-coffee-el2;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-drink-coffee .iconEl3{animation-name:icon-drink-coffee-el3;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-drink-coffee-el1{0%{top:20%}30%{top:0}100%{top:0}}@keyframes icon-drink-coffee-el2{0%{opacity:0;left:-20%}20%{opacity:0;left:-20%}30%{opacity:1;left:0}100%{opacity:1;left:0}}@keyframes icon-drink-coffee-el3{0%{opacity:0}25%{opacity:0}45%{opacity:1}100%{opacity:1}}#icon-e-learning.canvas .iconEl1{position:absolute;width:100%;top:30%;left:-10%;opacity:0;height:100%}.animationInView #icon-e-learning .iconEl1{animation-name:icon-e-learning-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-e-learning-el1{0%{opacity:0;left:-10%;top:30%}30%{opacity:0;left:-10%;top:30%}60%{opacity:1;left:0;top:0}100%{opacity:1;left:0;top:0}}#icon-environment.canvas .iconEl1{position:absolute;opacity:0;transform-origin:50% 50%;transform:scale(0,0);height:100%;width:100%}.animationInView #icon-environment .iconEl1{animation-name:icon-environment-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-environment-el1{0%{opacity:0;transform:scale(0,0)}30%{opacity:0;transform:scale(0,0)}60%{opacity:1;transform:scale(1,1)}100%{opacity:1;transform:scale(1,1)}}#icon-client.canvas .iconEl1{position:absolute;opacity:0;transform-origin:50% 50%;transform:scale(0,0);height:100%;width:100%}.animationInView #icon-client .iconEl1{animation-name:icon-client-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-client-el1{0%{opacity:0;transform:scale(0,0)}30%{opacity:0;transform:scale(0,0)}60%{opacity:1;transform:scale(1,1)}100%{opacity:1;transform:scale(1,1)}}#icon-solving-problems.canvas .iconEl1{position:absolute;transform:rotate(29deg);left:-22.4%;width:100%;height:100%}#icon-solving-problems .puzzle{fill:#000}.animationInView #icon-solving-problems .iconEl1{animation-name:icon-solving-problems-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-solving-problems .puzzle{animation-name:icon-solving-problems-puzzle;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-solving-problems-el1{0%{transform:rotate(29deg);left:-22.4%}50%{transform:rotate(29deg);left:-22.4%}100%{transform:rotate(0deg);left:0%}}@keyframes icon-solving-problems-puzzle{0%{fill:#000}50%{fill:#000}100%{fill:#E1141D}}#icon-hour-registration.canvas .iconEl1{position:absolute;width:100%;transform:rotate(0deg);transform-origin:50% 50%;height:100%;width:100%}.animationInView #icon-hour-registration .iconEl1{animation-name:icon-hour-registration-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-hour-registration-el1{0%{transform:rotate(0deg)}30%{transform:rotate(0deg)}60%{transform:rotate(360deg)}100%{transform:rotate(360deg)}}#icon-standard-solution.canvas .iconEl1{position:absolute;width:100%;opacity:0;height:100%}.animationInView #icon-standard-solution .iconEl1{animation-name:icon-standard-solution-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-standard-solution-el1{0%{opacity:0}30%{opacity:0}60%{opacity:1}100%{opacity:1}}#icon-integrated-solution.canvas .iconEl1{position:absolute;width:100%;opacity:0;height:100%}.animationInView #icon-integrated-solution .iconEl1{animation-name:icon-integrated-solution-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-integrated-solution-el1{0%{opacity:0}30%{opacity:0}60%{opacity:1}100%{opacity:1}}#icon-diversity.canvas .iconEl1{position:absolute;width:100%;height:100%;transform-origin:80% 50%;transform:scale(0,0);opacity:0}.animationInView #icon-diversity .iconEl1{animation-name:icon-diversity-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-diversity-el1{0%{opacity:0;transform:scale(0,0)}30%{opacity:0;transform:scale(0,0)}60%{opacity:1;transform:scale(1,1)}100%{opacity:1;transform:scale(1,1)}}#icon-order-cash.canvas .iconEl1{position:absolute;width:100%;height:100%;top:30%;opacity:0}.animationInView #icon-order-cash .iconEl1{animation-name:icon-order-cash-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-order-cash-el1{0%{opacity:0;top:30%}30%{opacity:0;top:30%}60%{opacity:1;top:0}100%{opacity:1;top:0}}#icon-calendar.canvas .iconEl1{position:absolute;width:100%;height:100%;opacity:0}.animationInView #icon-calendar .iconEl1{animation-name:icon-calendar-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-calendar-el1{0%{opacity:0}30%{opacity:0}60%{opacity:1}100%{opacity:1}}#icon-manufacturing.canvas .iconEl1{position:absolute;width:100%;height:100%;transform:rotate(0deg);transform-origin:80.5% 73.6%}#icon-manufacturing.canvas .iconEl2{position:absolute;width:100%;height:100%;transform:rotate(360deg);transform-origin:33.8% 50%}#icon-manufacturing.canvas .iconEl3{position:absolute;width:100%;height:100%;transform:rotate(0deg);transform-origin:80.5% 29.5%}.animationInView #icon-manufacturing .iconEl1{animation-name:icon-manufacturing-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-manufacturing .iconEl2{animation-name:icon-manufacturing-el2;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-manufacturing .iconEl3{animation-name:icon-manufacturing-el3;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-manufacturing-el1{0%{transform:rotate(0deg)}10%{transform:rotate(0deg)}80%{transform:rotate(360deg)}100%{transform:rotate(360deg)}}@keyframes icon-manufacturing-el2{0%{transform:rotate(360deg)}15%{transform:rotate(360deg)}85%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}@keyframes icon-manufacturing-el3{0%{transform:rotate(0deg)}20%{transform:rotate(0deg)}90%{transform:rotate(360deg)}100%{transform:rotate(360deg)}}#icon-apps-add-ons.canvas .iconEl1{position:absolute;width:100%;height:100%;opacity:0}#icon-apps-add-ons.canvas .iconEl2{position:absolute;width:100%;height:100%;opacity:0}.animationInView #icon-apps-add-ons .iconEl1{animation-name:icon-apps-add-ons-el1;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}.animationInView #icon-apps-add-ons .iconEl2{animation-name:icon-apps-add-ons-el2;animation-duration:3s;animation-delay:1.2s;animation-fill-mode:forwards}@keyframes icon-apps-add-ons-el1{0%{opacity:0}20%{opacity:0}60%{opacity:1}100%{opacity:1}}@keyframes icon-apps-add-ons-el2{0%{opacity:0}30%{opacity:0}70%{opacity:1}100%{opacity:1}}