index.css 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. body {
  2. padding: 0;
  3. margin: 0;
  4. background-image: url("background2.svg");
  5. background-size: 1200px auto;
  6. background-repeat: repeat-x;
  7. animation: background-move 60000s infinite linear;
  8. background-position-y: calc(100% - 60px);
  9. font-family: 'Open Sans', sans-serif;
  10. }
  11. h1 {
  12. position: absolute;
  13. top: 30px;
  14. left: 30px;
  15. }
  16. #stats {
  17. position: absolute;
  18. bottom: 10px;
  19. right: 10px;
  20. font-style: italic;
  21. color: white;
  22. }
  23. .container {
  24. background-image: url("background.svg");
  25. background-size: 1000px auto;
  26. background-repeat: repeat-x;
  27. animation: background-move 30000s infinite linear;
  28. background-position-y: bottom;
  29. height: 100%;
  30. display: flex;
  31. align-items: center;
  32. justify-content: center;
  33. }
  34. .dialog {
  35. background-color: white;
  36. max-width: 500px;
  37. padding: 20px;
  38. border-radius: 10px;
  39. box-shadow: 0px 8px 32px 12px rgba(0, 0, 0, 0.61);
  40. }
  41. #new-game-url a{
  42. display:block
  43. }
  44. p {
  45. margin-top: 0;
  46. }
  47. #new-game {
  48. all: unset;
  49. color: white;
  50. padding: 10px 20px;
  51. border-radius: 5px;
  52. cursor: pointer;
  53. background-color: #303F9F;
  54. }
  55. @keyframes background-move {
  56. from {
  57. background-position-x: 0%;
  58. }
  59. to {
  60. background-position-x: 100000%;
  61. }
  62. }