loading.css 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. /**
  2. * @name loading.css
  3. * @author Tobias Reich
  4. * @copyright 2014 by Tobias Reich
  5. */
  6. #loading {
  7. position: fixed;
  8. width: 100%;
  9. height: 3px;
  10. background-size: 100px 3px;
  11. background-repeat: repeat-x;
  12. border-bottom: 1px solid rgba(0,0,0,.3);
  13. display: none;
  14. animation-name: moveBackground;
  15. animation-duration: .3s;
  16. animation-iteration-count: infinite;
  17. animation-timing-function: linear;
  18. }
  19. /* Modes ------------------------------------------------*/
  20. #loading.loading {
  21. background-image: linear-gradient(to right, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%);
  22. z-index: 2;
  23. }
  24. #loading.error {
  25. background-image: linear-gradient(to right, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%);
  26. z-index: 1;
  27. }
  28. /* Content ------------------------------------------------*/
  29. #loading h1 {
  30. margin: 13px 13px 0px 13px;
  31. color: #ddd;
  32. font-size: 14px;
  33. font-weight: bold;
  34. text-shadow: 0px 1px 0px #000;
  35. text-transform: capitalize;
  36. }
  37. #loading h1 span {
  38. margin-left: 10px;
  39. font-weight: normal;
  40. text-transform: none;
  41. }