.navbar-toggler { display: none; } .notFound { padding-top: 5rem; text-align: center; padding-bottom: 8rem; } .notFound img { height: 500px; } .notFound h1 { font-style: italic; } .notFound .message { position: absolute; max-width: 20rem; top: 40%; left: 30%; } /* ============= Device specific fixes ======= */ /* Extra small devices (portrait phones, less than 576px) */ /* No media query for `xs` since this is the default in Bootstrap */ /* Extra large devices (large desktops, 1200px and up) */ @media (max-width: 1400px) { } @media (max-width: 1200px) { .notFound .message { top: 50%; left: 25%; } } /* Large devices (desktops, 992px and up) */ @media (max-width: 992px) { .notFound .message { top: 46%; left: 25%; } } /* Medium devices (tablets, 768px and up) */ @media only screen and (max-width: 768px) { .notFound img { height: 400px; } .notFound .message { top: 20rem; left: 4rem; } } /* Small devices (landscape phones, 576px and up) */ @media only screen and (max-width: 576px) { .notFound img { height: 250px; } .notFound .message { top: 20rem; left: 2rem; } }