/*
  .icon {
    padding-top: 100px;
    padding-left: 50px;
    display:inline-block;
    height: 300px;
    vertical-align:top;
  }
  */
  
  .thumb {
    animation-name: rotate-thumb;
    animation-duration: 0.8s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
    transform-origin: 0% 20%;
  }
  
  .display-screen {
    animation-name: scroll-up;
    animation-duration: 1.6s;
    animation-delay: 0.8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
  
  }
  
  .extruder-head {
    animation-name: side-to-side;
    animation-duration: 0.5s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  }
  
  .toybot-toy {
    animation-name: bounce;
    animation-duration: 0.4s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
  }
  .toybot-bolt {
    animation-name: bounce;
    animation-duration: 0.4s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    animation-delay:0.1s;
  }
  
  .cloud-trail {
    animation-name: flicker;
    animation-duration: 0.1s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
  }
  
  .cloud-front-1 {
    animation-name: bubble-less;
    animation-duration: 0.8s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 25% 0%;
  }
  .cloud-front-2 {
    animation-name: bubble;
    animation-duration: 0.8s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 25% 10%;
    animation-delay: 0.2s;
  }
  .cloud-front-3 {
    animation-name: bubble;
    animation-duration: 0.6s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 5% 8%;
    animation-delay: 0.3s;
  }
  .cloud-front-4 {
    animation-name: bubble-less;
    animation-duration: 0.5s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 30% 5%;
    animation-delay: 0.4s;
  }
  .cloud-back-1 {
    animation-name: bubble-less;
    animation-duration: 0.5s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 20% 35%;
    animation-delay: 0.1s;
  }
  .cloud-back-2 {
    animation-name: bubble;
    animation-duration: 0.4s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 6% 10%;
  }
  .cloud-back-3 {
    animation-name: bubble;
    animation-duration: 0.4s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform-origin: 30% 10%;
    animation-delay: 0.3s;
  }
  
  
  @keyframes rotate-thumb {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(18deg);
    }
  }
    
  @keyframes scroll-up {
    from {
      transform: translateY(0px);
    }
    to {
      transform: translateY(-126px);
    }
  }
  
  @keyframes side-to-side {
    from {
      transform: translateX(10px);
    }
    to {
      transform: translateX(-10px);
    }
  }
  
  @keyframes bounce {
    from {
      transform: translateY(-1px);
    }
    to {
      transform: translateY(4px);
    }
  }
  @keyframes flicker {
    to {
      opacity: 0.9;
    }
  }
  
  @keyframes bubble {
    to {
      opacity: 0.95;
      transform: scale(1.4);
    }
  }
  @keyframes bubble-less {
    to {
      opacity: 0.95;
      transform: scale(1.2);
    }
  }