Art.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Art</title>
    <link rel="icon" href="Images/Logo.png" type="image/x-icon" />
    <link rel="stylesheet" href="style-art.css" />
    <link rel="stylesheet" href="style-general.css" />
  </head>

  <body>
    <nav class="navbar">
      <div class="webname">Pecific</div>
      <div class="nav">
        <ul class="ul" type="none">
          <a href="index.html">
            <li class="li">Programming</li>
          </a>
          <li class="high li">Art</li>
          <a href="socials.html">
            <li class="li">Socials</li>
          </a>
        </ul>
      </div>
    </nav>

    <div class="post2">
      <div class="solar">
        <iframe class="frame" src="soarsystem.html" frameborder="5"></iframe>
      </div>

      <h1>--- Solar System ---</h1>
    </div>

    <div class="field">
      <h1 class="field_name">Gallery</h1>
    </div>

    <main class="content">
      <div class="post">
        <div class="container1"></div>

        <h1>--- Anime Tree : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/Blackhole 1.png"
            alt="A 3D render of a Blackhole"
            class="image"
          />
        </div>

        <h1>--- Blackhole 1 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/Blackhole 2.png"
            alt="A 3D render of a Blackhole"
            class="image"
          />
        </div>

        <h1>--- Blackhole 2 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/Blackhole 3.png"
            alt="A 3D render of a Blackhole"
            class="image"
          />
        </div>

        <h1>--- Blackhole 3 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container2">
          <img
            src="Images/Hollow_Knight.png"
            alt="A 3D render of a Character called Hornet from HolloKnight"
            class="image2"
          />
        </div>

        <h1>--- HollowKnight : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container2">
          <img
            src="Images/Keyboard.png"
            alt="A 3D render of a Keyboard"
            class="image2"
          />
        </div>

        <h1>--- Keyboard : 3D render ---</h1>
      </div>

      <div class="rvvp">
        <div class="container2">
          <img
            src="Images/Plant_render.png"
            alt="A 3D render of a plant in a big room"
            class="image2"
          />
          <h1>--- Plant : 3D render ---</h1>
        </div>

        <div class="container2">
          <img
            src="Images/Plant_viewport.png"
            alt="A 3D viewport of a plant in a big room"
            class="image2"
          />
          <h1>--- Plant : 3D Viewport ---</h1>
        </div>
      </div>

      <div class="rvvp1">
        <div class="container3">
          <img
            src="Images/Room_render.png"
            alt="A 3D render of a room"
            class="image4"
            style="padding-bottom: 10px"
          />
        </div>

        <h1>--- Room : 3D render ---</h1>

        <div class="container3">
          <img
            src="Images/Room_viewport.png"
            alt="A 3D viewport of a room"
            class="image4"
            style="padding-bottom: 10px"
          />
        </div>
        <h1>--- Room : 3D Viewport ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/hemlet one.png"
            alt="A 3D render of a sunset scene with a crusader helmet,
            sword and a dead tree in focus"
            class="image"
          />
        </div>

        <h1>--- Helmet 1 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/helmet two.png"
            alt="A 3D render of a foggy scene with a crusader helmet,
            sword and a dead tree in focus"
            class="image"
          />
        </div>

        <h1>--- Helmet 2 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/CellShaded_OldComputer.png"
            alt="A Cell Shaded 3D render of a room with and old computer."
            class="image"
          />
        </div>

        <h1>--- Cell Shaded 1 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/CellShaded_LivingRoom.png"
            alt="A Cell Shaded 3D render of a living room."
            class="image"
          />
        </div>

        <h1>--- Cell Shaded 2 : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container livrm">
          <img
            src="Images/LivingRoom.png"
            alt="A 3D render of a Living room"
            class="image3"
            style="padding-bottom: 10px"
          />
        </div>

        <h1>--- Living Room : 3D render ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/pelvic_gurdle.png"
            alt="A pencil drawing of human pelvic girdle, showing the joint of Acetabulum"
            class="image"
          />
        </div>

        <h1>--- Pelvic Girdle : Pencil Drawing ---</h1>
      </div>

      <div class="post">
        <div class="container">
          <img
            src="Images/Heart.png"
            alt="Two pencil drawings of human heart, one showing the names."
            class="image"
          />
        </div>

        <h1>--- Heart : Pencil Drawing ---</h1>
      </div>

      <div class="kit">
        <div class="post">
          <div class="container">
            <img
              src="Images/kitchen (1).png"
              alt="A 3D render of a miniature kitchen"
              class="image"
            />
          </div>
          <h1>--- Kitchen 1: 3D render ---</h1>
        </div>

        <div class="post">
          <div class="container">
            <img
              src="Images/kitchen (2).png"
              alt="A 3D render of a miniature kitchen"
              class="image"
            />
          </div>
          <h1>--- Kitchen 2: 3D render ---</h1>
        </div>

        <div class="post">
          <div class="container">
            <img
              src="Images/kitchen (3).png"
              alt="A 3D render of a miniature kitchen"
              class="image"
            />
          </div>
          <h1>--- Kitchen 3: 3D render ---</h1>
        </div>

        <div class="post">
          <div class="container post">
            <img
              src="Images/kitchen (4).png"
              alt="A 3D render of a miniature kitchen"
              class="image"
            />
          </div>
          <h1>--- Kitchen 4: 3D render ---</h1>
        </div>
      </div>
    </main>

    <aside class="btmbar">
      <a href="index.html">
        <span class="li" title="Programming">
          <img
            class="btbr_img"
            src="Images/icons/programming-svgrepo-com.svg"
            alt=""
          />
        </span>
      </a>
      <span class="raiseup high li" title="Art">
        <img
          class="btbr_img"
          src="Images/icons/art-palette-svgrepo-com.svg"
          alt=""
        />
      </span>
      <a href="socials.html">
        <span class="li" title="Socials">
          <img
            class="btbr_img"
            src="Images/icons/social-youtube-svgrepo-com.svg"
            alt=""
          />
        </span>
      </a>
    </aside>

  </body>
</html>