profitcalc.css 679 B

123456789101112131415161718192021222324252627282930313233
  1. #profitcalccontainer {
  2. font-size: 2.5rem;
  3. font-weight: bold;
  4. color: #4caf50;
  5. text-align: center;
  6. padding: 20px;
  7. border: 2px solid #4caf50;
  8. border-radius: 10px;
  9. background: #e8f5e9;
  10. display: none;
  11. margin-top: 20px;
  12. transition: transform 0.2s ease, background-color 0.2s ease;
  13. }
  14. #profitcalccontainer.wehaveprofit {
  15. animation: data-update 0.5s ease-in-out;
  16. }
  17. @keyframes data-update {
  18. 0% {
  19. transform: scale(1);
  20. background-color: #a5d6a7;
  21. }
  22. 50% {
  23. transform: scale(1.2);
  24. background-color: #66bb6a;
  25. }
  26. 100% {
  27. transform: scale(1);
  28. background-color: #e8f5e9;
  29. }
  30. }