styles.css 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. .d-flex{
  2. display: flex;
  3. }
  4. .d-col{
  5. display: flex;
  6. flex-direction: column;
  7. }
  8. .mr-10{
  9. margin-right: 10px;
  10. }
  11. #scrollToTopBtn {
  12. position: fixed;
  13. bottom: 20px;
  14. right: 20px;
  15. display: none;
  16. color: #f04f48;
  17. background-color: transparent;
  18. font-weight: bold;
  19. border: 2px solid #f04f48;
  20. width: 70px;
  21. height: 70px;
  22. border-radius: 50%;
  23. padding: 15px;
  24. font-size: 24px;
  25. cursor: pointer;
  26. z-index: 100;
  27. transition: opacity 0.3s ease;
  28. }
  29. #scrollToTopBtn::before {
  30. content: '';
  31. position: absolute;
  32. top: 50%;
  33. left: 50%;
  34. width: 100%;
  35. height: 100%;
  36. border-radius: 50%;
  37. border: 2px solid rgba(240, 79, 72, 0.5);
  38. transform: translate(-50%, -50%) scale(1);
  39. opacity: 1;
  40. animation: radar-blur 2s infinite;
  41. z-index: -1;
  42. }
  43. #scrollToTopBtn:hover {
  44. cursor: pointer;
  45. }
  46. @keyframes radar-blur {
  47. 0% {
  48. transform: translate(-50%, -50%) scale(1);
  49. opacity: 1;
  50. }
  51. 80% {
  52. opacity: 0;
  53. }
  54. 100% {
  55. transform: translate(-50%, -50%) scale(2);
  56. opacity: 0;
  57. }
  58. }