.grid--cell {
      width: 75%;
      text-align: center;
      
      vertical-align: top;
      display: inline-block;
      padding-left: 0px;
      padding-bottom: 10px;
    }
    
    .animation-wrapper2 {
      position: relative;
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      overflow: hidden;
      border-radius: 5%;
      width: 100%;
      padding-bottom: 100%;
    }
    
    .animation-wrapper--software-bg {
      background: linear-gradient(-135deg, #ff3231, #b90100);
    }
    
    .animation-wrapper--website-bg {
      background: linear-gradient(-135deg, #bcd74c, #7f9d01);
    }
    
    .animation-wrapper--webapp-bg {
      background: linear-gradient(-135deg, #f68e51, #eb5700);
    }
    
    .animation-wrapper--win-app-bg {
      background: linear-gradient(-135deg, #fcc000, #da8e00);
    }
    
    .animation-wrapper--win-mobile-app-bg {
      background: linear-gradient(-135deg, #01bcf3, #006e8e);
    }
    
    .title {
      display: inline-block;
      font-size: 75%;
      font-weight: bold;
      color: #fff;
      padding: 6px 9px;
      margin-top: 15px;
      border-radius: 5px;
    }
    
    .title--software {
      background-color: #ff3231;
    }
    
    .title--webdev {
      background-color: #7f9d01;
    }
    
    .title--webapp {
      background-color: #eb5700;
    }
    
    .title--win-app {
      background-color: #d8a500;
    }
    
    .title--win-mobile-app {
      background-color: #0195c0;
    }
    
    .screen-shine {
      position: relative;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      text-align: right;
      background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_modular_screen_shine.svg");
      background-size: cover;
      background-position: top right;
      opacity: 0.3;
    }
    
    .absolute2 {
      position: absolute;
      top: 0;
      width: 100%;
    }
    
    .software-monitor {
      left: 0;
      top: 6%;
      height: 100%;
      z-index: 6;
    }
    
    .software-screen--bg {
      left: 0;
      height: 100%;
    }
    
    @-webkit-keyframes software-screen--fg-mask {
      0% {
        height: 0%;
      }
      65% {
        height: 35%;
      }
      85% {
        height: 35%;
      }
      100% {
        height: 0%;
      }
    }
    
    @keyframes software-screen--fg-mask {
      0% {
        height: 0%;
      }
      65% {
        height: 35%;
      }
      85% {
        height: 35%;
      }
      100% {
        height: 0%;
      }
    }
    .software-screen--fg-mask {
      vertical-align: top;
      left: 0%;
      margin-top: 10%;
      height: 30%;
      overflow: hidden;
      -webkit-animation: software-screen--fg-mask 3s linear infinite;
              animation: software-screen--fg-mask 3s linear infinite;
    }
    
    @-webkit-keyframes software-screen--fg {
      0% {
        -webkit-transform: translate(0, -10%);
                transform: translate(0, -10%);
      }
      69% {
        -webkit-transform: translate(0, -10%);
                transform: translate(0, -10%);
      }
      90% {
        -webkit-transform: translate(0, -50%);
                transform: translate(0, -50%);
      }
      100% {
        -webkit-transform: translate(0, -50%);
                transform: translate(0, -50%);
      }
    }
    
    @keyframes software-screen--fg {
      0% {
        -webkit-transform: translate(0, -10%);
                transform: translate(0, -10%);
      }
      69% {
        -webkit-transform: translate(0, -10%);
                transform: translate(0, -10%);
      }
      90% {
        -webkit-transform: translate(0, -50%);
                transform: translate(0, -50%);
      }
      100% {
        -webkit-transform: translate(0, -50%);
                transform: translate(0, -50%);
      }
    }
    .software-screen--fg {
      left: 0;
      -webkit-animation: software-screen--fg 3s linear infinite;
              animation: software-screen--fg 3s linear infinite;
    }
    
    .software-screen--shine {
      right: 0;
      height: 100%;
      opacity: 0.6;
      z-index: 10;
    }
    
    .software-keyboard {
      left: 0;
      top: 7%;
      height: 100%;
    }
    
    .software-hand {
      left: 0;
      top: 7%;
      height: 100%;
      background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_software_development_hand.svg");
      background-size: 600% 100%;
      background-position: top left;
    }
    
    @-webkit-keyframes software-hand--left {
      0% {
        background-position: -300% 0;
      }
      5% {
        background-position: -200% 0;
      }
      10% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 0%) scale(-1, 1);
                transform: translate(0, 0%) scale(-1, 1);
      }
      15% {
        background-position: 0 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      20% {
        background-position: -100% 0;
      }
      25% {
        background-position: -200% 0;
      }
      30% {
        background-position: -400% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      35% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 0) scale(-1, 1);
                transform: translate(0, 0) scale(-1, 1);
      }
      40% {
        background-position: 0% 0;
      }
      45% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0) scale(-1, 1);
                transform: translate(0, 0) scale(-1, 1);
      }
      50% {
        background-position: 0% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      55% {
        background-position: -100% 0;
      }
      60% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      65% {
        background-position: 0 0;
        -webkit-transform: translate(-2%, 7%) scale(-1, 1);
                transform: translate(-2%, 7%) scale(-1, 1);
      }
      95% {
        background-position: 0 0;
        -webkit-transform: translate(0, 2%) scale(-1, 1);
                transform: translate(0, 2%) scale(-1, 1);
      }
    }
    
    @keyframes software-hand--left {
      0% {
        background-position: -300% 0;
      }
      5% {
        background-position: -200% 0;
      }
      10% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 0%) scale(-1, 1);
                transform: translate(0, 0%) scale(-1, 1);
      }
      15% {
        background-position: 0 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      20% {
        background-position: -100% 0;
      }
      25% {
        background-position: -200% 0;
      }
      30% {
        background-position: -400% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      35% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 0) scale(-1, 1);
                transform: translate(0, 0) scale(-1, 1);
      }
      40% {
        background-position: 0% 0;
      }
      45% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0) scale(-1, 1);
                transform: translate(0, 0) scale(-1, 1);
      }
      50% {
        background-position: 0% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      55% {
        background-position: -100% 0;
      }
      60% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 5%) scale(-1, 1);
                transform: translate(0, 5%) scale(-1, 1);
      }
      65% {
        background-position: 0 0;
        -webkit-transform: translate(-2%, 7%) scale(-1, 1);
                transform: translate(-2%, 7%) scale(-1, 1);
      }
      95% {
        background-position: 0 0;
        -webkit-transform: translate(0, 2%) scale(-1, 1);
                transform: translate(0, 2%) scale(-1, 1);
      }
    }
    .software-hand--left {
      -webkit-transform: scale(-1, 1);
              transform: scale(-1, 1);
      -webkit-animation: software-hand--left 3s steps(1, end) infinite;
              animation: software-hand--left 3s steps(1, end) infinite;
    }
    
    @-webkit-keyframes software-hand--right {
      0% {
        background-position: 0 0;
      }
      2% {
        background-position: -100% 0;
      }
      4% {
        background-position: 0 0;
      }
      6% {
        background-position: -500% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      8% {
        background-position: 0 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      10% {
        background-position: -100% 0;
      }
      12% {
        background-position: -0 0;
      }
      14% {
        background-position: -200% 0;
      }
      16% {
        background-position: 0 0;
      }
      18% {
        background-position: -200% 0;
      }
      20% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      22% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      24% {
        background-position: 0 0;
      }
      26% {
        background-position: -500% 0;
      }
      28% {
        background-position: 0 0;
      }
      30% {
        background-position: -200% 0;
      }
      32.5% {
        background-position: -400% 0;
      }
      50% {
        background-position: 0 0;
      }
      52% {
        background-position: -200% 0;
      }
      54% {
        background-position: -500% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      56% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      58% {
        background-position: 0 0;
      }
      60% {
        background-position: -200% 0;
      }
      62% {
        background-position: -100% 0;
      }
      64% {
        background-position: 0 0;
      }
      66% {
        background-position: -500% 0;
      }
      68% {
        background-position: -200% 0;
      }
      70% {
        background-position: 0% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      72% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      74% {
        background-position: -300% 0;
      }
      76% {
        background-position: -500% 0;
      }
      78% {
        background-position: 0 0;
      }
      80% {
        background-position: -500% 0;
      }
      82.5% {
        background-position: -400% 0;
      }
      100% {
        background-position: -400% 0;
      }
    }
    
    @keyframes software-hand--right {
      0% {
        background-position: 0 0;
      }
      2% {
        background-position: -100% 0;
      }
      4% {
        background-position: 0 0;
      }
      6% {
        background-position: -500% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      8% {
        background-position: 0 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      10% {
        background-position: -100% 0;
      }
      12% {
        background-position: -0 0;
      }
      14% {
        background-position: -200% 0;
      }
      16% {
        background-position: 0 0;
      }
      18% {
        background-position: -200% 0;
      }
      20% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      22% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      24% {
        background-position: 0 0;
      }
      26% {
        background-position: -500% 0;
      }
      28% {
        background-position: 0 0;
      }
      30% {
        background-position: -200% 0;
      }
      32.5% {
        background-position: -400% 0;
      }
      50% {
        background-position: 0 0;
      }
      52% {
        background-position: -200% 0;
      }
      54% {
        background-position: -500% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      56% {
        background-position: -100% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      58% {
        background-position: 0 0;
      }
      60% {
        background-position: -200% 0;
      }
      62% {
        background-position: -100% 0;
      }
      64% {
        background-position: 0 0;
      }
      66% {
        background-position: -500% 0;
      }
      68% {
        background-position: -200% 0;
      }
      70% {
        background-position: 0% 0;
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
      }
      72% {
        background-position: -200% 0;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
      }
      74% {
        background-position: -300% 0;
      }
      76% {
        background-position: -500% 0;
      }
      78% {
        background-position: 0 0;
      }
      80% {
        background-position: -500% 0;
      }
      82.5% {
        background-position: -400% 0;
      }
      100% {
        background-position: -400% 0;
      }
    }
    .software-hand--right {
      right: 0;
      -webkit-animation: software-hand--right 6s steps(1, end) infinite;
              animation: software-hand--right 6s steps(1, end) infinite;
    }
    
    
    
    
    <style>
    .web-hardware {
      margin: 0 auto;
      border-radius: 6px;
    }
    
    .web-hardware--desktop {
      width: 70%;
      height: 55%;
      top: 14%;
      left: 8%;
      padding: 6% 3%;
      background-color: #262626;
    }
    
    .web-hardware--mobile {
      width: 25%;
      height: 45%;
      top: 30%;
      right: 8%;
      padding: 5% 2%;
      background-color: #444;
    }
    
    @-webkit-keyframes web-scroller-anim {
      0% {
        background-position: 0 0;
      }
      35% {
        background-position: 0 99.5%;
      }
      36% {
        background-position: 0 100%;
      }
      50% {
        background-position: 0 100%;
      }
      85% {
        background-position: 0 0.5%;
      }
      86% {
        background-position: 0 0;
      }
      100% {
        background-position: 0 0;
      }
    }
    
    @keyframes web-scroller-anim {
      0% {
        background-position: 0 0;
      }
      35% {
        background-position: 0 99.5%;
      }
      36% {
        background-position: 0 100%;
      }
      50% {
        background-position: 0 100%;
      }
      85% {
        background-position: 0 0.5%;
      }
      86% {
        background-position: 0 0;
      }
      100% {
        background-position: 0 0;
      }
    }
    .web-screen {
      width: 100%;
      height: 100%;
      background-color: #000;
      border-radius: 2px;
      -webkit-animation: web-scroller-anim 9s infinite;
              animation: web-scroller-anim 9s infinite;
    }
    
    .web-screen--website-desktop {
      background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_website_development_desktop.svg");
      background-size: 100%;
    }
    
    .web-screen--website-mobile {
      background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_website_development_mobile.svg");
      background-size: 100%;
    }
    
    .web-screen--webapp-desktop {
      background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_webapp_development_desktop.svg");
      background-size: 100%;
    }
    
    .web-screen--webapp-mobile {
      background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/350480/animation_webapp_development_mobile.svg");
      background-size: 100%;
    }
    
    
    
    
    .win-mobile {
      left: 0;
      height: 100%;
    }
    
    @-webkit-keyframes win-mobile--home-back {
      61% {
        fill: #333;
      }
      61.2% {
        fill: #fff;
      }
      63% {
        fill: #333;
      }
      86% {
        fill: #333;
      }
      86.2% {
        fill: #fff;
      }
      88% {
        fill: #333;
      }
      90% {
        fill: #333;
      }
      90.2% {
        fill: #fff;
      }
      91.9% {
        fill: #333;
      }
      92% {
        fill: #333;
      }
      92.2% {
        fill: #fff;
      }
      94% {
        fill: #333;
      }
    }
    
    @keyframes win-mobile--home-back {
      61% {
        fill: #333;
      }
      61.2% {
        fill: #fff;
      }
      63% {
        fill: #333;
      }
      86% {
        fill: #333;
      }
      86.2% {
        fill: #fff;
      }
      88% {
        fill: #333;
      }
      90% {
        fill: #333;
      }
      90.2% {
        fill: #fff;
      }
      91.9% {
        fill: #333;
      }
      92% {
        fill: #333;
      }
      92.2% {
        fill: #fff;
      }
      94% {
        fill: #333;
      }
    }
    .win-mobile--home-back {
      fill: #333;
      -webkit-animation: win-mobile--home-back 10s linear infinite;
              animation: win-mobile--home-back 10s linear infinite;
    }
    
    .win-mobile--home {
      opacity: 1;
    }
    
    @-webkit-keyframes win-mobile--home-bg {
      8% {
        opacity: 0;
      }
      16% {
        opacity: 1;
      }
      95% {
        opacity: 1;
      }
      99% {
        opacity: 0;
      }
    }
    
    @keyframes win-mobile--home-bg {
      8% {
        opacity: 0;
      }
      16% {
        opacity: 1;
      }
      95% {
        opacity: 1;
      }
      99% {
        opacity: 0;
      }
    }
    .win-mobile--home-bg {
      opacity: 0;
      -webkit-animation: win-mobile--home-bg 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
              animation: win-mobile--home-bg 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--home-row-01 {
      9% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      11% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      94% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      97% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    
    @keyframes win-mobile--home-row-01 {
      9% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      11% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      94% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      97% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    .win-mobile--home-row-01 {
      -webkit-transform: scale(0, 1);
              transform: scale(0, 1);
      -webkit-transform-origin: 33% 0;
              transform-origin: 33% 0;
      opacity: 0;
      -webkit-animation: win-mobile--home-row-01 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
              animation: win-mobile--home-row-01 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--home-row-02 {
      10% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      12% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      95% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      98% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    
    @keyframes win-mobile--home-row-02 {
      10% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      12% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      95% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      98% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    .win-mobile--home-row-02 {
      -webkit-transform: scale(0, 1);
              transform: scale(0, 1);
      -webkit-transform-origin: 48% 0;
              transform-origin: 48% 0;
      opacity: 0;
      -webkit-animation: win-mobile--home-row-02 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
              animation: win-mobile--home-row-02 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--home-row-03 {
      11% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      13% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      96% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      98% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    
    @keyframes win-mobile--home-row-03 {
      11% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
      13% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      96% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      98% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
                transform: scale(0, 1);
      }
    }
    .win-mobile--home-row-03 {
      -webkit-transform: scale(0, 1);
              transform: scale(0, 1);
      -webkit-transform-origin: 60% 0;
              transform-origin: 60% 0;
      opacity: 0;
      -webkit-animation: win-mobile--home-row-03 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
              animation: win-mobile--home-row-03 10s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--home-shortcut {
      17% {
        fill: #D60000;
      }
      17.2% {
        fill: #fff;
      }
      25% {
        fill: #D60000;
      }
    }
    
    @keyframes win-mobile--home-shortcut {
      17% {
        fill: #D60000;
      }
      17.2% {
        fill: #fff;
      }
      25% {
        fill: #D60000;
      }
    }
    .win-mobile--home-shortcut {
      fill: #D60000;
      -webkit-animation: win-mobile--home-shortcut 10s linear infinite;
              animation: win-mobile--home-shortcut 10s linear infinite;
    }
    
    @-webkit-keyframes win-mobile--app-01 {
      23% {
        opacity: 0;
        -webkit-transform: scale(0.5, 0.5);
                transform: scale(0.5, 0.5);
      }
      26% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      90% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      94% {
        opacity: 0;
        -webkit-transform: scale(0.5, 0.5);
                transform: scale(0.5, 0.5);
      }
    }
    
    @keyframes win-mobile--app-01 {
      23% {
        opacity: 0;
        -webkit-transform: scale(0.5, 0.5);
                transform: scale(0.5, 0.5);
      }
      26% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      90% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      94% {
        opacity: 0;
        -webkit-transform: scale(0.5, 0.5);
                transform: scale(0.5, 0.5);
      }
    }
    .win-mobile--app-01 {
      -webkit-transform: scale(0.5, 0.5);
              transform: scale(0.5, 0.5);
      opacity: 0;
      -webkit-animation: win-mobile--app-01 10s cubic-bezier(0.77, 0, 0.175, 1) infinite;
              animation: win-mobile--app-01 10s cubic-bezier(0.77, 0, 0.175, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--app-01--bg {
      26% {
        fill: red;
      }
      34% {
        fill: #330000;
      }
      100% {
        fill: #330000;
      }
    }
    
    @keyframes win-mobile--app-01--bg {
      26% {
        fill: red;
      }
      34% {
        fill: #330000;
      }
      100% {
        fill: #330000;
      }
    }
    .win-mobile--app-01--bg {
      fill: red;
      -webkit-animation: win-mobile--app-01--bg 10s cubic-bezier(0.77, 0, 0.175, 1) infinite;
              animation: win-mobile--app-01--bg 10s cubic-bezier(0.77, 0, 0.175, 1) infinite;
    }
    
    @-webkit-keyframes win-mobile--app-01-icons {
      30% {
        opacity: 0;
      }
      32% {
        opacity: 1;
      }
      100% {
        opacity: 1;
      }
    }
    
    @keyframes win-mobile--app-01-icons {
      30% {
        opacity: 0;
      }
      32% {
        opacity: 1;
      }
      100% {
        opacity: 1;
      }
    }
    .win-mobile--app-01-icons {
      opacity: 0;
      -webkit-animation: win-mobile--app-01-icons 10s linear infinite;
              animation: win-mobile--app-01-icons 10s linear infinite;
    }
    
    @-webkit-keyframes win-mobile--app-01--shortcut-01 {
      36% {
        opacity: 0.2;
      }
      36.2% {
        opacity: 1;
      }
      44% {
        opacity: 0.2;
      }
    }
    
    @keyframes win-mobile--app-01--shortcut-01 {
      36% {
        opacity: 0.2;
      }
      36.2% {
        opacity: 1;
      }
      44% {
        opacity: 0.2;
      }
    }
    .win-mobile--app-01--icons--shortcut-01 {
      opacity: 0.2;
      fill: #fff;
      -webkit-animation: win-mobile--app-01--shortcut-01 10s linear infinite;
              animation: win-mobile--app-01--shortcut-01 10s linear infinite;
    }
    
    .win-mobile--app-01--icons--shortcut-02 {
      opacity: 0.2;
      fill: #fff;
      -webkit-animation: win-mobile--app-01--shortcut-01 10s 3.25s linear infinite;
              animation: win-mobile--app-01--shortcut-01 10s 3.25s linear infinite;
    }
    
    @-webkit-keyframes win-mobile--app-02 {
      42% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      44% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      62% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      64% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      72% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      74% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      88% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      90% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      100% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
    }
    
    @keyframes win-mobile--app-02 {
      42% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      44% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      62% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      64% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      72% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      74% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      88% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
                transform: scale(1, 1);
      }
      90% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
      100% {
        opacity: 0;
        -webkit-transform: scale(0.9, 0.9);
                transform: scale(0.9, 0.9);
      }
    }
    .win-mobile--app-02 {
      opacity: 0;
      -webkit-transform: scale(0.9, 0.9);
              transform: scale(0.9, 0.9);
      -webkit-animation: win-mobile--app-02 10s linear infinite;
              animation: win-mobile--app-02 10s linear infinite;
    }
    
    @-webkit-keyframes win-mobile--app-02--button {
      51% {
        fill: #4d4d4d;
      }
      51.2% {
        fill: #bbb;
      }
      65% {
        fill: #bbb;
      }
      65.2% {
        fill: #4d4d4d;
      }
    }
    
    @keyframes win-mobile--app-02--button {
      51% {
        fill: #4d4d4d;
      }
      51.2% {
        fill: #bbb;
      }
      65% {
        fill: #bbb;
      }
      65.2% {
        fill: #4d4d4d;
      }
    }
    .win-mobile--app-02--button_01 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s linear infinite;
              animation: win-mobile--app-02--button 10s linear infinite;
    }
    
    .win-mobile--app-02--button_02 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s 0.2s linear infinite;
              animation: win-mobile--app-02--button 10s 0.2s linear infinite;
    }
    
    .win-mobile--app-02--button_03 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s 0.4s linear infinite;
              animation: win-mobile--app-02--button 10s 0.4s linear infinite;
    }
    
    .win-mobile--app-02--button_04 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s 2.9s linear infinite;
              animation: win-mobile--app-02--button 10s 2.9s linear infinite;
    }
    
    .win-mobile--app-02--button_05 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s 3.04s linear infinite;
              animation: win-mobile--app-02--button 10s 3.04s linear infinite;
    }
    
    .win-mobile--app-02--button_06 {
      fill: #4d4d4d;
      -webkit-animation: win-mobile--app-02--button 10s 3.19s linear infinite;
              animation: win-mobile--app-02--button 10s 3.19s linear infinite;
    }