guoziyun
/
artsite


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
							<!DOCTYPE html>
<html lang="en">

<head>
  <title><%= title %></title>
  <meta name="description" content="<%= description %>">
    <style>
      body {
        color: white;
        background-color: #fff3f3;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        width: 100vw;
        height: 100vh;
        margin: 0;
      }

      img {
        width: 60%;
        height: auto;
      }

      .container {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }

      .text-container {
        position: absolute;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding-top: 260px;
      }

      .not-found-text {
        color: #F94936;
        font-size: 52px;
        font-weight: 600;
        padding: 20px;
      }

      .back-home-text {
        color: #F94936;
        font-size: 20px;
      }

      /* for mobile */
      @media (max-width: 768px) {

        img {
          width: 90%;
          height: auto;
        }

        .not-found-text {
          font-size: 36px;
          padding: 10px;
        }

        .back-home-text {
          font-size: 18px;
        }

        .text-container {

          padding-top: 180px;
        }

      }
    </style>
</head>

<body>

  <div class="container">
    <img src="/assets/icon/404.png" alt="404 Not Found">
    <div class="text-container">
      <div class="not-found-text">Page Not Found</div>
      <a href="/" class="back-home-text">BACK TO HOME PAGE</a>
    </div>
  </div>

</body>

</html>