style.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. * {
  2. padding: 0;
  3. margin: 0;
  4. box-sizing: border-box;
  5. }
  6. .container_nomount{
  7. display: flex;
  8. justify-content: center;
  9. align-items: center;
  10. flex-direction: column;
  11. box-sizing: border-box;
  12. position: fixed;
  13. width: 100%;
  14. height: 100%;
  15. overflow: hidden;
  16. font-family: 'Poppins', sans-serif;
  17. background-color: black;
  18. }
  19. .container_nomount h2{
  20. margin-top: 20px;
  21. font-size: 1.5em;
  22. margin-block-start: 0.83em;
  23. margin-block-end: 0.83em;
  24. margin-inline-start: 0px;
  25. margin-inline-end: 0px;
  26. font-weight: bold;
  27. color: #1890ff;
  28. }
  29. .container_nomount .loading{
  30. width: 80px;
  31. height: 40px;
  32. margin: 0 auto;
  33. margin-top: -40px;
  34. }
  35. .container_nomount .loading span{
  36. display: inline-block;
  37. width: 8px;
  38. height: 100%;
  39. border-radius: 4px;
  40. background: #1890ff;
  41. animation: load 1s ease infinite;
  42. }
  43. @keyframes load{
  44. 0%,100%{
  45. height: 40px;
  46. background: #ff3378;
  47. }
  48. 50%{
  49. height: 70px;
  50. margin: -15px 0;
  51. background: #1890ff;
  52. }
  53. }
  54. .container_nomount .loading span:nth-child(2){
  55. animation-delay:0.2s;
  56. }
  57. .container_nomount .loading span:nth-child(3){
  58. animation-delay:0.4s;
  59. }
  60. .container_nomount .loading span:nth-child(4){
  61. animation-delay:0.6s;
  62. }
  63. .container_nomount .loading span:nth-child(5){
  64. animation-delay:0.8s;
  65. }