.produto{
  width: 522px;
  height: 166px;
  position: absolute;
  top: 50px;
  right: 0px;
  z-index: 30;
}

.prod-1 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 33px;
  left: 86px;
  animation: prod-1 9s infinite;
}

.prod-2 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 33px;
  left: 272px;
  animation: prod-2 9s infinite;
}

.prod-3 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 33px;
  left: 462px;
  animation: prod-3 9s infinite;
}

.prod-4 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 114px;
  left: 86px;
  animation: prod-4 9s infinite;
}

.prod-5 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 114px;
  left: 272px;
  animation: prod-5 9s infinite;
}

.prod-6 {
  width: 20px;
  height: 20px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 114px;
  left: 462px;
  animation: prod-6 9s infinite;
}

.prod-7 {
  width: 10px;
  height: 10px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 120px;
  left: 62px;
  animation: prod-7 9s infinite;
}

.prod-8 {
  width: 10px;
  height: 10px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 120px;
  left: 42px;
  animation: prod-8 9s infinite;
}

.prod-9 {
  width: 10px;
  height: 10px;
  background-color: #3a3b85;
  border-radius: 100px;
  position: absolute;
  top: 120px;
  left: 22px;
  animation: prod-9 9s infinite;
}

@keyframes prod-1{
  0% { transform: scale(1); }
  2% { transform: scale(1.5);}
  4% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-2{
  0% { transform: scale(1); }
  10% { transform: scale(1); }
  12% { transform: scale(1.5);}
  14% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-3{
  0% { transform: scale(1); }
  20% { transform: scale(1); }
  22% { transform: scale(1.5);}
  24% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-6{
  0% { transform: scale(1); }
  30% { transform: scale(1); }
  32% { transform: scale(1.5);}
  34% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-5{
  0% { transform: scale(1); }
  40% { transform: scale(1); }
  42% { transform: scale(1.5);}
  44% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-4{
  0% { transform: scale(1); }
  50% { transform: scale(1); }
  52% { transform: scale(1.5);}
  54% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-7{
  0% { transform: scale(1); }
  60% { transform: scale(1); }
  62% { transform: scale(1.5);}
  64% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-8{
  0% { transform: scale(1); }
  70% { transform: scale(1); }
  72% { transform: scale(1.5);}
  74% { transform: scale(1);}
  100% { transform: scale(1);}
}

@keyframes prod-9{
  0% { transform: scale(1); }
  80% { transform: scale(1); }
  82% { transform: scale(1.5);}
  84% { transform: scale(1);}
  100% { transform: scale(1);}
}

@media (max-width: 660px) {
  .prod-1 {
    width: 15px;
    height: 15px;
    top: 15px;
    left: 45px;
  }

  .prod-2 {
    width: 15px;
    height: 15px;
    top: 15px;
    left: 150px;
  }

  .prod-3 {
    width: 15px;
    height: 15px;
    top: 15px;
    left: 258px;
  }

  .prod-4 {
    width: 15px;
    height: 15px;
    top: 62px;
    left: 45px;
  }

  .prod-5 {
    width: 15px;
    height: 15px;
    top: 62px;
    left: 150px;
  }

  .prod-6 {
    width: 15px;
    height: 15px;
    top: 62px;
    left: 258px;
  }

  .prod-7 {
    width: 7px;
    height: 7px;
    top: 66px;
    left: 29px;
  }

  .prod-8 {
    width: 7px;
    height: 7px;
    top: 66px;
    left: 12px;
  }

  .prod-9 {
    width: 7px;
    height: 7px;
    top: 66px;
    left: -8px;
  }
}