index.css 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. html,
  2. body {
  3. width: 100%;
  4. height: 100%;
  5. padding: 0;
  6. margin: 0;
  7. background-color: white;
  8. }
  9. body {
  10. background: url("LogoV3.png");
  11. background-position: center center;
  12. background-repeat: no-repeat;
  13. }
  14. .container {
  15. width: calc(100% - 50px);
  16. display: flex;
  17. flex-wrap: wrap;
  18. justify-content: center;
  19. align-items: center;
  20. background: rgba(255, 255, 255, 0.6);
  21. margin: auto;
  22. margin-top: 10px;
  23. margin-bottom: 10px;
  24. outline: 2px solid black;
  25. max-width: 1000px;
  26. }
  27. .containerTitle {
  28. width: 100%;
  29. order: 1;
  30. display: flex;
  31. background-color: rgba(0, 0, 0, 0.8);
  32. height: 50px;
  33. }
  34. .title {
  35. font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  36. font-size: 40px;
  37. color: white;
  38. text-align: center;
  39. margin-left: 20px;
  40. order: 1;
  41. }
  42. .result {
  43. color: green;
  44. font-size: 30px;
  45. order: 2;
  46. text-align: center;
  47. margin-top: 5px;
  48. margin-left: 20px;
  49. }
  50. .result.failed {
  51. color: red;
  52. }
  53. .waitRing {
  54. order: 3;
  55. height: 40px;
  56. margin-top: 5px;
  57. margin-bottom: 5px;
  58. }
  59. .waitRing.hidden {
  60. display: none;
  61. }
  62. babylon {
  63. position: absolute !important;
  64. transform: translateX(-600px);
  65. width: 600px;
  66. height: 400px !important;
  67. }
  68. .renderImage {
  69. order: 1;
  70. flex-basis: 50%;
  71. width: 50%;
  72. }
  73. .resultImage {
  74. width: 50%;
  75. flex-basis: 50%;
  76. order: 2;
  77. }