style.css 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. body { margin: 0; padding: 0; overflow-x: hidden; }
  2. header { position: fixed; text-align: center; top: 0; left: 0; right: 0; transition: background .5s; }
  3. header ul { display: flex; margin: 0 auto; padding: .75em 0; list-style-type: none; max-width: 600px; }
  4. header li { flex: 1; display: inline-block; }
  5. header li a { color: white; }
  6. .body { display: inline-flex; margin: 0 auto; padding: 0 12%; width: 100vw; min-height: 100vh; box-sizing: border-box; background-repeat: no-repeat; background-position: center 82%; background-size: cover; }
  7. .body { text-align: center; justify-content: center; }
  8. .body.body-centered > .container { display: flex; text-align: center; align-items: center; width: 100%; }
  9. .body.body-centered > .container > * { width: 100%; max-width: 250px; margin: auto; }
  10. .joinform .logo { margin: 0 auto 2em auto; max-width: 50%; }
  11. .joinform label { display: block; margin-bottom: 1em; text-align: left; }
  12. .joinform * { width: 100%; }
  13. .container { font-size: 0; }
  14. .container > div { display: inline-block; vertical-align: top; font-size: 1rem; padding: 1em; box-sizing: border-box; }
  15. .block-1f1{ width: 100%; }
  16. .block-1f2 { width: 50%; }
  17. .block-1f3 { width: 33.333%; }
  18. .block-2f3 { width: 66.666%; }
  19. .block-1f4 { width: 25%; }
  20. .block-3f4 { width: 75%; }
  21. .block-1f5 { width: 20%; }
  22. .block-2f5 { width: 40%; }
  23. .block-3f5 { width: 60%; }
  24. .block-4f5 { width: 80%; }
  25. .block-1f6 { width: 16.666%; }
  26. .block-5f6 { width: 83.333%; }
  27. .block-0f { display: none !important; }
  28. @media screen and (max-width: 720px) {
  29. .body { margin: 0; padding: 0; }
  30. .block-1s1{ width: 100%; }
  31. .block-1s2 { width: 50%; }
  32. .block-1s3 { width: 33.333%; }
  33. .block-2s3 { width: 66.666%; }
  34. .block-1s4 { width: 25%; }
  35. .block-3s4 { width: 75%; }
  36. .block-1s5 { width: 20%; }
  37. .block-2s5 { width: 40%; }
  38. .block-3s5 { width: 60%; }
  39. .block-4s5 { width: 80%; }
  40. .block-1s6 { width: 16.666%; }
  41. .block-5s6 { width: 83.333%; }
  42. .block-0s { display: none !important; }
  43. }