404.css 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. .navbar-toggler {
  2. display: none;
  3. }
  4. .notFound {
  5. padding-top: 5rem;
  6. text-align: center;
  7. padding-bottom: 8rem;
  8. }
  9. .notFound img {
  10. height: 500px;
  11. }
  12. .notFound h1 {
  13. font-style: italic;
  14. }
  15. .notFound .message {
  16. position: absolute;
  17. max-width: 20rem;
  18. top: 40%;
  19. left: 30%;
  20. }
  21. /* ============= Device specific fixes ======= */
  22. /* Extra small devices (portrait phones, less than 576px) */
  23. /* No media query for `xs` since this is the default in Bootstrap */
  24. /* Extra large devices (large desktops, 1200px and up) */
  25. @media (max-width: 1400px) {
  26. }
  27. @media (max-width: 1200px) {
  28. .notFound .message {
  29. top: 50%;
  30. left: 25%;
  31. }
  32. }
  33. /* Large devices (desktops, 992px and up) */
  34. @media (max-width: 992px) {
  35. .notFound .message {
  36. top: 46%;
  37. left: 25%;
  38. }
  39. }
  40. /* Medium devices (tablets, 768px and up) */
  41. @media only screen and (max-width: 768px) {
  42. .notFound img {
  43. height: 400px;
  44. }
  45. .notFound .message {
  46. top: 20rem;
  47. left: 4rem;
  48. }
  49. }
  50. /* Small devices (landscape phones, 576px and up) */
  51. @media only screen and (max-width: 576px) {
  52. .notFound img {
  53. height: 250px;
  54. }
  55. .notFound .message {
  56. top: 20rem;
  57. left: 2rem;
  58. }
  59. }