index.html 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <style>
  9. .container {
  10. max-width: 800px;
  11. margin: 15px auto;
  12. display: flex;
  13. justify-content: center;
  14. align-items: center;
  15. }
  16. #background {
  17. height: 300px;
  18. }
  19. #regulatorContainer img {
  20. width: 125px;
  21. }
  22. img {
  23. width: 175px;
  24. }
  25. #btn {
  26. width: 0;
  27. height: 0;
  28. border: 45px solid #000;
  29. border-right: none;
  30. border-top-color: transparent;
  31. border-bottom-color: transparent;
  32. background-color: #fff;
  33. padding: 0;
  34. transition: 0.3s ease-in;
  35. cursor: pointer;
  36. }
  37. #btn:hover {
  38. transform: scale(1.2)
  39. }
  40. #formContainer {
  41. max-width: 250px;
  42. flex-direction: column;
  43. align-items: flex-start;
  44. }
  45. #formContainer div {
  46. margin-bottom: 15px;
  47. }
  48. </style>
  49. </head>
  50. <body>
  51. <div class="container" id="regulators"></div>
  52. <div class="container" id="background"></div>
  53. <div class="container" id="regulatorContainer">
  54. <button id='btn'></button>
  55. <audio id="audio">
  56. <source src="https://vzvuke.net/play/MDE0MWViMGNjZGFiODQzYmRlNjJkMGE2ZDAwNzEyOWYubXAz/">
  57. </audio>
  58. </div>
  59. <div class="container" id="formContainer"></div>
  60. <script src="main.js"></script>
  61. </body>
  62. </html>