Update index.html

Merge pull request #19 from t404owo/main
Update to unstable branch
2025-12-12 09:58:46 +00:00 · 2025-10-17 05:05:18 +02:00 · 2025-10-17 05:04:37 +02:00 · 2025-10-17 03:03:00 +00:00 · 2025-10-17 03:00:21 +00:00 · 2025-10-17 02:49:38 +00:00
10 changed files with 559 additions and 45 deletions
--- a/about_me/index.html
+++ b/about_me/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <title>t404:null | Home</title>
+    <title>t404:null | About Me</title>
    <meta
      name="description"
      content="Hello there! I'm t404:null (a.k.a t404owo).
@@ -224,6 +224,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
        </div>
      </div>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>
 </html>
--- a/activity/index.html
+++ b/activity/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <title>t404:null | Home</title>
+    <title>t404:null | Activities / Previous Events</title>
    <meta
      name="description"
      content="Hello there! I'm t404:null (a.k.a t404owo).
@@ -278,6 +278,6 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
        </a>
      </div>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>
 </html>
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -7,21 +7,30 @@ body {
  margin: 0px;
  height: 100%;
 }
-main {
+
+main,
+textarea,
+textfield {
  font-family: Jost, "Noto Sans Japanese", sans-serif, --apple-system;
+}
+
+main {
  margin: 0.75rem;
  height: 100%;
  margin-bottom: 0;
  margin-top: 0;
  min-height: calc(100vh - 10vh);
 }
+
 .main-page {
  max-width: 2300px;
  margin: 0 auto;
 }
+
 hr {
  margin: 2rem 0px;
 }
+
 nav {
  z-index: 4;
  position: -webkit-sticky;
@@ -39,21 +48,25 @@ nav {
  box-shadow: 0px 0px 12px 0.1px #d0d0d0;
  display: grid;
  grid-template-columns: auto 1fr auto;
+
  ul {
    padding-left: 15px;
    list-style-type: none;
    margin: 0px;
    align-content: center;
+
    li {
      display: inline-block;
      padding-right: 4px;
      vertical-align: middle;
+
      p {
        padding-top: 0.4rem;
        vertical-align: middle;
        margin: 0.5rem 1rem;
      }
    }
+
    img {
      margin-top: 0.25rem;
      height: 1.5rem;
@@ -61,6 +74,7 @@ nav {
      padding-right: 0.3rem;
    }
  }
+
  a {
    color: black;
    text-decoration: none;
@@ -72,19 +86,23 @@ nav {
    -ms-user-select: none;
    user-select: none;
  }
+
  .vertical-line {
    width: 0.1rem;
    background-color: black;
    height: 100%;
  }
+
  .social {
    font-size: 2.5rem;
    padding-bottom: 0.4rem;
    transition: 0.3s;
  }
+
  .social:hover {
    opacity: 50%;
  }
+
  .dropdown {
    margin: 0.75rem;
    position: absolute;
@@ -120,6 +138,7 @@ nav {
 .menu {
  padding-top: 0.4rem;
  padding-bottom: 0.8rem;
+
  p {
    background-size: 0% 0.2em;
    background-image: linear-gradient(#000, #000);
@@ -128,6 +147,7 @@ nav {
    background-repeat: no-repeat;
    transition: 0.3s ease-in-out;
  }
+
  p:hover,
  .currentpage {
    opacity: 60%;
@@ -147,6 +167,7 @@ nav {
  background-color: #f5f5f5;
  border-radius: 12px;
  transition: 0.2s ease-in-out;
+
  span {
    transition: 0.2s ease-in-out;
    box-sizing: border-box;
@@ -154,12 +175,14 @@ nav {
    background-color: #000;
    border-radius: 2px;
  }
+
  #hamburger {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0%;
    left: 0%;
+
    span {
      width: 70%;
      height: 5%;
@@ -168,16 +191,20 @@ nav {
      position: relative;
      margin: 12% 0;
    }
+
    span:nth-child(1) {
      transition-delay: 0.2s;
    }
+
    span:nth-child(2) {
      transition-delay: 0.3s;
    }
+
    span:nth-child(3) {
      transition-delay: 0.4s;
    }
  }
+
  #cross {
    position: absolute;
    height: 100%;
@@ -190,11 +217,13 @@ nav {
      height: 0%;
      width: 5%;
      position: absolute;
-      right: 46%; /*a / */
+      right: 46%;
+      /*a / */
      top: 10%;
      transform: translate(-50%);
      transition-delay: 0s;
    }
+
    span:nth-child(2) {
      width: 0%;
      height: 5%;
@@ -215,21 +244,26 @@ nav {
    span {
      width: 0%;
    }
+
    span:nth-child(1) {
      transition-delay: 0s;
    }
+
    span:nth-child(2) {
      transition-delay: 0.1s;
    }
+
    span:nth-child(3) {
      transition-delay: 0.2s;
    }
  }
+
  #cross {
    span:nth-child(1) {
      height: 80%;
      transition-delay: 0.3s;
    }
+
    span:nth-child(2) {
      width: 80%;
      transition-delay: 0.3s;
@@ -242,6 +276,7 @@ nav {
  overflow: auto;
  max-height: 70vh;
 }
+
 /*---- main ----*/
 .container {
  position: relative;
@@ -250,6 +285,7 @@ nav {
  margin: auto;
  margin-top: 1rem;
 }
+
 .carousel {
  z-index: 1;
  width: 100%;
@@ -259,6 +295,7 @@ nav {
  position: relative;
  overflow: hidden;
 }
+
 .slider-bg {
  height: 100%;
  width: 100%;
@@ -279,6 +316,7 @@ nav {
  border-radius: 0.5rem;
  transform: scale(1.1);
 }
+
 .slider section {
  overflow: hidden;
  z-index: 1;
@@ -293,6 +331,7 @@ nav {
  border-radius: 0.5rem;
  font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif,
    --apple-system;
+
  div {
    color: #fff;
    position: relative;
@@ -303,27 +342,33 @@ nav {
    grid-template-rows: 3.5fr 1fr 1fr 5rem;
    grid-template-columns: 1fr auto 1fr;
  }
+
  h1 {
    font-size: 2rem;
    grid-row-start: 2;
    grid-row-end: 3;
  }
+
  p {
    font-size: 1.25rem;
    grid-row-start: 3;
    grid-row-end: 4;
  }
+
  p,
  h1 {
    width: 60vw;
    text-align: center;
-    grid-column-start: 2; /*|•|*/
+    grid-column-start: 2;
+    /*|•|*/
    grid-column-end: 3;
  }
 }
+
 .slider:hover {
  cursor: pointer;
 }
+
 .prev,
 .next {
  background-color: rgba(0, 0, 0, 0.3);
@@ -346,12 +391,15 @@ nav {
  -ms-user-select: none;
  user-select: none;
 }
+
 .next {
  right: 1rem;
 }
+
 .prev {
  left: 1rem;
 }
+
 .pgctrl {
  font-family: sans-serif, --apple-system;
  z-index: 1;
@@ -379,6 +427,7 @@ nav {
  -ms-user-select: none;
  user-select: none;
 }
+
 .control {
  text-align: center;
 }
@@ -393,6 +442,7 @@ nav {
  grid-template-rows: repeat(auto-fill, 23rem);
  grid-template-columns: repeat(auto-fill, 23rem);
  grid-gap: 1rem;
+
  .card {
    transition: 0.75s;
    color: black;
@@ -400,6 +450,7 @@ nav {
    height: 23rem;
    border-radius: 7px;
    text-decoration: none;
+
    div {
      z-index: 1;
      position: inherit;
@@ -409,12 +460,15 @@ nav {
      border-radius: 7px;
      transition: 0.5s;
    }
+
    h2 {
      font-size: 1.9rem;
    }
+
    p {
      font-size: 1.2rem;
    }
+
    h2,
    p {
      color: white;
@@ -424,6 +478,7 @@ nav {
      opacity: 0;
      transition: 0.5s;
    }
+
    .bg-img {
      /*       background: url(/assets/img/t404_null-logo.png); */
      background-size: cover;
@@ -432,11 +487,13 @@ nav {
      width: 23rem;
    }
  }
+
  .card:hover {
    .bg-img {
      filter: blur(5px) brightness(50%);
      -webkit-filter: blur(5px) brightness(50%);
    }
+
    h2,
    p {
      filter: none;
@@ -453,6 +510,7 @@ nav {
  grid-template-rows: repeat(auto-fill, 30rem);
  grid-template-columns: repeat(auto-fill, minmax(23rem, 60rem));
  grid-gap: 1rem;
+
  .card {
    transition: 0.75s;
    color: black;
@@ -460,6 +518,7 @@ nav {
    height: 30rem;
    border-radius: 7px;
    text-decoration: none;
+
    div {
      z-index: 1;
      position: inherit;
@@ -469,12 +528,15 @@ nav {
      border-radius: 7px;
      transition: 0.5s;
    }
+
    h2 {
      font-size: 1.9rem;
    }
+
    p {
      font-size: 1.1rem;
    }
+
    h2,
    p {
      /*       color: black; */
@@ -484,6 +546,7 @@ nav {
      opacity: 0;
      transition: 0.5s;
    }
+
    .bg-img {
      /*       background: url(/assets/img/t404_null-logo.png); */
      background-size: cover;
@@ -493,6 +556,7 @@ nav {
      width: 30rem;
    }
  }
+
  .card:hover {
    .bg-img {
      filter: brightness(40%);
@@ -500,6 +564,7 @@ nav {
      width: 8vw;
      border-radius: 7px 0px 0px 7px;
    }
+
    h2,
    p {
      padding: 0.3rem 5vw 0.3rem 10vw;
@@ -515,17 +580,113 @@ nav {
  grid-gap: 1rem;
  justify-content: center;
  padding: 0;
+
  li {
    border-radius: 7px;
    background-color: #ddd;
  }
 }

+
+
+.contact-email {
+
+  .inputbox {
+    outline: none;
+    height: 3rem;
+    width: 100%;
+    display: block;
+    background: #EFEFEF;
+    color: black;
+    border: 0px solid #505050;
+    border-radius: 5px;
+    transition: 0.3s;
+    margin-top: 0.5rem;
+    margin-left:-5px;
+    padding: 5px;
+  }
+
+  :not(textarea) {
+    text-align: center;
+  }
+
+  .inputbox:hover {
+    background: #DEDEDE;
+  }
+
+  .inputbox:focus {
+    background: #CECECE;
+  }
+
+  button {
+    width: 100%;
+    height: 3rem;
+    border-radius: 5px;
+    text-align: center;
+  }
+
+  .formbutton {
+    background: #272727;
+    color: #fff;
+    border: 0px;
+    transition-duration: 300ms;
+    cursor: pointer;
+  }
+
+  .formbutton:hover {
+    background: #727272;
+  }
+
+  .form {
+    border-radius: 5px;
+    align-items: center;
+    justify-content: center;
+    margin: auto;
+    padding: 4rem 2.5rem;
+    width: 65%;
+    background: #FDFDFD;
+    box-shadow: rgba(50, 50, 50, 0.1) 0px 4px 12px;
+  }
+
+  .error_box {
+    background: #FFEEEE;
+    border-radius: 5px;
+
+    margin: auto;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 1rem 1rem;
+    margin-bottom: 1.5rem;
+  }
+
+  .box {
+    height:2rem;
+    width: 100%;
+    text-align: center;
+    border-radius: 5px;
+    margin: auto;
+    align-items: center;
+    justify-content: center;
+    padding: 0.5rem 0px;
+    margin-bottom: 1rem;
+  }
+}
+
+textarea,
+textfield {
+  padding: 5px;
+  font-size: 0.95rem;
+  resize: vertical;
+  min-height: 5rem;
+}
+
 .topic {
  padding: 1rem;
  font-size: 3rem;
  margin-top: 3vw;
  margin-bottom: 7vw;
+
  a {
    text-decoration: none;
    color: black;
@@ -536,6 +697,7 @@ nav {
    background-repeat: no-repeat;
    transition: 0.3s ease-in-out;
  }
+
  a:hover {
    opacity: 70%;
    background-size: 100% 0.2em;
@@ -547,10 +709,12 @@ nav {
  font-size: 2.25rem;
  font-weight: 500;
 }
+
@font-face {
  font-family: "NerdFontsSymbols Nerd Font";
  src: url("/assets/fonts/nf-symbols.woff2") format("woff2");
 }
+
 .nf-icons {
  font-family: "NerdFontsSymbols Nerd Font";
 }
@@ -564,9 +728,11 @@ nav {
  padding: 5vw 5vw;
  border-radius: 10px;
  border: 1px solid #ddd;
+
  strong {
    color: #fff;
  }
+
  .text-box {
    max-width: 1250px;
    margin: 25% auto;
@@ -576,6 +742,7 @@ nav {
    padding: 2rem;
    border-radius: 7px;
    font-size: 1.2rem;
+
    a {
      text-decoration: none;
      color: #fff;
@@ -586,6 +753,7 @@ nav {
      background-repeat: no-repeat;
      transition: 0.3s ease-in-out;
    }
+
    a:hover {
      color: #ccc;
      background-size: 100% 0.2em;
@@ -598,9 +766,11 @@ nav {
  text-decoration: none;
  list-style-type: none;
  font-size: 1.4rem;
+
  li {
    padding: 1rem;
  }
+
  a {
    text-decoration: none;
    color: #46f;
@@ -611,22 +781,27 @@ nav {
    background-repeat: no-repeat;
    transition: 0.3s ease-in-out;
  }
+
  a:hover {
    opacity: 70%;
    background-size: 100% 0.2em;
  }
+
  .title {
    font-size: 1.6rem;
  }
 }
+
 .subdiv {
  padding: 1rem;
 }
+
 .long-br {
  display: block;
  height: 2rem;
 }
-@media screen and (width >= 1180px) and (width<=1690px) {
+
+@media screen and (width >=1180px) and (width<=1690px) {
  /*if(width<1620px&&width>=1125px)*/

  nav {
@@ -635,6 +810,7 @@ nav {
        position: relative;
        width: 17.5rem;
        padding: 0rem 0rem;
+
        a {
          transition: 0.2s;
          display: flex;
@@ -642,33 +818,40 @@ nav {
          border-radius: 7px;
          margin: 0.3rem 0;
        }
+
        a:hover {
          background-color: #ddd;
        }
+
        strong {
          margin-left: auto;
          margin-right: auto;
          align-content: center;
        }
+
        p {
          margin: 0.5rem 0;
        }
      }
+
      .dropdown-menu {
        display: none;
      }
    }
+
    .menu,
    .dropdown-open.dropdown,
    .dropdown-open.dropdown-social {
      opacity: 1;
      display: initial;
    }
+
    .social,
    .dropdown-open.dropdown-menu {
      opacity: 0;
      display: none;
    }
+
    .burger {
      display: block;
    }
@@ -680,11 +863,13 @@ nav {

  nav {
    font-size: 1.4rem;
+
    ul {
      img {
        height: 2.5rem;
      }
    }
+
    .social {
      font-size: 2rem;
    }
@@ -693,19 +878,24 @@ nav {
      height: 100px;
      width: 100px;
    }
+
    .dropdown {
+
      .dropdown-social,
      .dropdown-menu {
        position: relative;
      }
+
      .dropdown-menu {
        width: 18rem;
        padding: 0rem 0rem;
      }
+
      .dropdown-social {
        display: flex;
        flex-wrap: wrap;
      }
+
      .dropdown-menu p,
      .dropdown-social a {
        transition: 0.2s;
@@ -713,6 +903,7 @@ nav {
        border-radius: 7px;
        margin: 0.3rem 0;
      }
+
      .dropdown-menu p:hover {
        background-color: #ddd;
      }
@@ -720,31 +911,37 @@ nav {
      .dropdown-social a:hover {
        opacity: 50%;
      }
+
      hr {
        margin: 0.75rem 0rem;
        padding: 1rem;
        border: 1px solid #aaa;
      }
    }
+
    .social-name {
      display: none;
    }
+
    .social,
    .menu-item {
      display: none;
    }
+
    .dropdown-open {
      transition: 0.3s;
      opacity: 1;
      display: initial;
+
      .dropdown,
      .dropdown-social,
      .downdown-menu {
        display: initial;
      }
    }
+
    .burger {
      display: block;
    }
  }
-}
+}
--- a/assets/css/old.css
+++ b/assets/css/old.css
@@ -1,25 +1,35 @@
@import url("/assets/css/fonts/jost.css");
@import url("/assets/css/fonts/noto-sans-jp.css");
@import url("/assets/css/fonts/plus-jarkata-sans.css");
+
 body {
  margin: 0px;
  height: 100%;
 }
-main {
+
+main,
+textarea,
+textfield {
  font-family: Jost, "Noto Sans Japanese", sans-serif, --apple-system;
+}
+
+main {
  margin: 0.75rem;
  height: 100%;
  margin-bottom: 0;
  margin-top: 0;
  min-height: calc(100vh - 10vh);
 }
+
 .main-page {
  max-width: 2300px;
  margin: 0 auto;
 }
+
 hr {
  margin: 2rem 0px;
 }
+
 nav {
  z-index: 4;
  position: -webkit-sticky;
@@ -28,8 +38,7 @@ nav {
 	 */
  top: 10px;
  background-color: #f5f5f5;
-  font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif,
-    --apple-system;
+  font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, --apple-system;
  font-size: 1.25rem;
  padding: 4px;
  margin: 10px;
@@ -39,28 +48,33 @@ nav {
  display: grid;
  grid-template-columns: auto 1fr auto;
 }
+
 nav ul {
  padding-left: 15px;
  list-style-type: none;
  margin: 0px;
  align-content: center;
 }
+
 nav ul li {
  display: inline-block;
  padding-right: 4px;
  vertical-align: middle;
 }
+
 nav ul li p {
  padding-top: 0.4rem;
  vertical-align: middle;
  margin: 0.5rem 1rem;
 }
+
 nav ul img {
  margin-top: 0.25rem;
  height: 1.5rem;
  vertical-align: middle;
  padding-right: 0.3rem;
 }
+
 nav a {
  color: black;
  text-decoration: none;
@@ -71,19 +85,23 @@ nav a {
  -ms-user-select: none;
  user-select: none;
 }
+
 nav .vertical-line {
  width: 0.1rem;
  background-color: black;
  height: 100%;
 }
+
 nav .social {
  font-size: 2.5rem;
  padding-bottom: 0.4rem;
  transition: 0.3s;
 }
+
 nav .social:hover {
  opacity: 50%;
 }
+
 nav .dropdown {
  margin: 0.75rem;
  position: absolute;
@@ -97,6 +115,7 @@ nav .dropdown {
  opacity: 0;
  transition: 0.3s;
 }
+
 .footer {
  font-family: Jost, "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif;
  position: sticky;
@@ -114,11 +133,13 @@ nav .dropdown {
  text-align: center;
  align-content: center;
 }
+
 /*---nav---*/
 .menu {
  padding-top: 0.4rem;
  padding-bottom: 0.8rem;
 }
+
 .menu p {
  background-size: 0% 0.2em;
  background-image: linear-gradient(#000, #000);
@@ -127,11 +148,13 @@ nav .dropdown {
  background-repeat: no-repeat;
  transition: 0.3s ease-in-out;
 }
+
 .menu p:hover,
 .menu .currentpage {
  opacity: 60%;
  background-size: 100% 0.2em;
 }
+
 .burger {
  border: none;
  display: none;
@@ -145,6 +168,7 @@ nav .dropdown {
  border-radius: 12px;
  transition: 0.2s ease-in-out;
 }
+
 .burger span {
  transition: 0.2s ease-in-out;
  box-sizing: border-box;
@@ -152,6 +176,7 @@ nav .dropdown {
  background-color: #000;
  border-radius: 2px;
 }
+
 .burger #hamburger {
  position: absolute;
  height: 100%;
@@ -159,6 +184,7 @@ nav .dropdown {
  top: 0%;
  left: 0%;
 }
+
 .burger #hamburger span {
  width: 70%;
  height: 5%;
@@ -167,15 +193,19 @@ nav .dropdown {
  position: relative;
  margin: 12% 0;
 }
+
 .burger #hamburger span:nth-child(1) {
  transition-delay: 0.2s;
 }
+
 .burger #hamburger span:nth-child(2) {
  transition-delay: 0.3s;
 }
+
 .burger #hamburger span:nth-child(3) {
  transition-delay: 0.4s;
 }
+
 .burger #cross {
  position: absolute;
  height: 100%;
@@ -184,6 +214,7 @@ nav .dropdown {
  left: 1.5%;
  transform: rotate(45deg);
 }
+
 .burger #cross span:nth-child(1) {
  height: 0%;
  width: 5%;
@@ -194,6 +225,7 @@ nav .dropdown {
  transform: translate(-50%);
  transition-delay: 0s;
 }
+
 .burger #cross span:nth-child(2) {
  width: 0%;
  height: 5%;
@@ -202,34 +234,43 @@ nav .dropdown {
  top: 48%;
  transition-delay: 0s;
 }
+
 .burger:hover {
  opacity: 40%;
 }
+
 .burger.open #hamburger span {
  width: 0%;
 }
+
 .burger.open #hamburger span:nth-child(1) {
  transition-delay: 0s;
 }
+
 .burger.open #hamburger span:nth-child(2) {
  transition-delay: 0.1s;
 }
+
 .burger.open #hamburger span:nth-child(3) {
  transition-delay: 0.2s;
 }
+
 .burger.open #cross span:nth-child(1) {
  height: 80%;
  transition-delay: 0.3s;
 }
+
 .burger.open #cross span:nth-child(2) {
  width: 80%;
  transition-delay: 0.3s;
 }
+
 .dropdown {
  display: none;
  overflow: auto;
  max-height: 70vh;
 }
+
 /*---- main ----*/
 .container {
  position: relative;
@@ -238,6 +279,7 @@ nav .dropdown {
  margin: auto;
  margin-top: 1rem;
 }
+
 .carousel {
  z-index: 1;
  width: 100%;
@@ -247,6 +289,7 @@ nav .dropdown {
  position: relative;
  overflow: hidden;
 }
+
 .slider-bg {
  height: 100%;
  width: 100%;
@@ -267,6 +310,7 @@ nav .dropdown {
  border-radius: 0.5rem;
  transform: scale(1.1);
 }
+
 .slider section {
  overflow: hidden;
  z-index: 1;
@@ -279,9 +323,9 @@ nav .dropdown {
  width: 100%;
  height: 100%;
  border-radius: 0.5rem;
-  font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif,
-    --apple-system;
+  font-family: "Plus Jakarta Sans", "Noto Sans Japanese", sans-serif, --apple-system;
 }
+
 .slider section div {
  color: #fff;
  position: relative;
@@ -292,16 +336,19 @@ nav .dropdown {
  grid-template-rows: 3.5fr 1fr 1fr 5rem;
  grid-template-columns: 1fr auto 1fr;
 }
+
 .slider section h1 {
  font-size: 2rem;
  grid-row-start: 2;
  grid-row-end: 3;
 }
+
 .slider section p {
  font-size: 1.25rem;
  grid-row-start: 3;
  grid-row-end: 4;
 }
+
 .slider section p,
 .slider section h1 {
  width: 60vw;
@@ -310,9 +357,11 @@ nav .dropdown {
  /*|•|*/
  grid-column-end: 3;
 }
+
 .slider:hover {
  cursor: pointer;
 }
+
 .prev,
 .next {
  background-color: rgba(0, 0, 0, 0.3);
@@ -334,12 +383,15 @@ nav .dropdown {
  -ms-user-select: none;
  user-select: none;
 }
+
 .next {
  right: 1rem;
 }
+
 .prev {
  left: 1rem;
 }
+
 .pgctrl {
  font-family: sans-serif, --apple-system;
  z-index: 1;
@@ -366,9 +418,11 @@ nav .dropdown {
  -ms-user-select: none;
  user-select: none;
 }
+
 .control {
  text-align: center;
 }
+
 /* Cards */
 .album-cards {
  margin: auto;
@@ -379,6 +433,7 @@ nav .dropdown {
  grid-template-columns: repeat(auto-fill, 23rem);
  grid-gap: 1rem;
 }
+
 .album-cards .card {
  transition: 0.75s;
  color: black;
@@ -387,6 +442,7 @@ nav .dropdown {
  border-radius: 7px;
  text-decoration: none;
 }
+
 .album-cards .card div {
  z-index: 1;
  position: inherit;
@@ -396,12 +452,15 @@ nav .dropdown {
  border-radius: 7px;
  transition: 0.5s;
 }
+
 .album-cards .card h2 {
  font-size: 1.9rem;
 }
+
 .album-cards .card p {
  font-size: 1.2rem;
 }
+
 .album-cards .card h2,
 .album-cards .card p {
  color: white;
@@ -411,6 +470,7 @@ nav .dropdown {
  opacity: 0;
  transition: 0.5s;
 }
+
 .album-cards .card .bg-img {
  /* background: url(/assets/img/t404_null-logo.png);
 	 */
@@ -419,15 +479,18 @@ nav .dropdown {
  height: 23rem;
  width: 23rem;
 }
+
 .album-cards .card:hover .bg-img {
  filter: blur(5px) brightness(50%);
  -webkit-filter: blur(5px) brightness(50%);
 }
+
 .album-cards .card:hover h2,
 .album-cards .card:hover p {
  filter: none;
  opacity: 1;
 }
+
 .half-image-cards {
  margin: auto;
  margin-bottom: 2.5rem;
@@ -437,6 +500,7 @@ nav .dropdown {
  grid-template-columns: repeat(auto-fill, minmax(23rem, 60rem));
  grid-gap: 1rem;
 }
+
 .half-image-cards .card {
  transition: 0.75s;
  color: black;
@@ -445,6 +509,7 @@ nav .dropdown {
  border-radius: 7px;
  text-decoration: none;
 }
+
 .half-image-cards .card div {
  z-index: 1;
  position: inherit;
@@ -454,12 +519,15 @@ nav .dropdown {
  border-radius: 7px;
  transition: 0.5s;
 }
+
 .half-image-cards .card h2 {
  font-size: 1.9rem;
 }
+
 .half-image-cards .card p {
  font-size: 1.1rem;
 }
+
 .half-image-cards .card h2,
 .half-image-cards .card p {
  /* color: black;
@@ -470,6 +538,7 @@ nav .dropdown {
  opacity: 0;
  transition: 0.5s;
 }
+
 .half-image-cards .card .bg-img {
  /* background: url(/assets/img/t404_null-logo.png);
 	 */
@@ -479,18 +548,21 @@ nav .dropdown {
  height: 30rem;
  width: 30rem;
 }
+
 .half-image-cards .card:hover .bg-img {
  filter: brightness(40%);
  -webkit-filter: brightness(40%);
  width: 8vw;
  border-radius: 7px 0px 0px 7px;
 }
+
 .half-image-cards .card:hover h2,
 .half-image-cards .card:hover p {
  padding: 0.3rem 5vw 0.3rem 10vw;
  filter: none;
  opacity: 1;
 }
+
 .contact-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, 23rem);
@@ -498,16 +570,108 @@ nav .dropdown {
  justify-content: center;
  padding: 0;
 }
+
 .contact-cards li {
  border-radius: 7px;
  background-color: #ddd;
 }
+
+
+.contact-email .inputbox {
+  outline: none;
+  height: 3rem;
+  width: 100%;
+  display: block;
+  background: #EFEFEF;
+  color: black;
+  border: 0px solid #505050;
+  border-radius: 5px;
+  transition: 0.3s;
+  margin-top: 0.5rem;
+  margin-left: -5px;
+  padding: 5px;
+}
+
+.contact-email :not(textarea) {
+  text-align: center;
+}
+
+.contact-email .inputbox:hover {
+  background: #dedede;
+}
+
+.contact-email .inputbox:focus {
+  background: #cecece;
+}
+
+.contact-email button {
+  width: 100%;
+  height: 3rem;
+  border-radius: 5px;
+  text-align: center;
+}
+
+.contact-email .formbutton {
+  background: #272727;
+  color: #fff;
+  border: 0px;
+  transition-duration: 300ms;
+  cursor: pointer;
+}
+
+.contact-email .formbutton:hover {
+  background: #727272;
+}
+
+.contact-email .form {
+  border-radius: 5px;
+  align-items: center;
+  justify-content: center;
+  margin: auto;
+  padding: 4rem 2.5rem;
+  width: 65%;
+  background: #fdfdfd;
+  box-shadow: rgba(50, 50, 50, 0.1) 0px 4px 12px;
+}
+
+.contact-email .error_box {
+  background: #fee;
+  border-radius: 5px;
+  margin: auto;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  padding: 1rem 1rem;
+  margin-bottom: 1.5rem;
+}
+
+.contact-email .box {
+  height: 2rem;
+  width: 100%;
+  text-align: center;
+  border-radius: 5px;
+  margin: auto;
+  align-items: center;
+  justify-content: center;
+  padding: 0.5rem 0px;
+  margin-bottom: 1rem;
+}
+
+textarea,
+textfield {
+  padding: 5px;
+  font-size: 0.95rem;
+  resize: vertical;
+  min-height: 5rem;
+}
+
 .topic {
  padding: 1rem;
  font-size: 3rem;
  margin-top: 3vw;
  margin-bottom: 7vw;
 }
+
 .topic a {
  text-decoration: none;
  color: black;
@@ -518,22 +682,27 @@ nav .dropdown {
  background-repeat: no-repeat;
  transition: 0.3s ease-in-out;
 }
+
 .topic a:hover {
  opacity: 70%;
  background-size: 100% 0.2em;
 }
+
 /* overall */
 .icons {
  font-size: 2.25rem;
  font-weight: 500;
 }
+
@font-face {
  font-family: "NerdFontsSymbols Nerd Font";
  src: url("/assets/fonts/nf-symbols.woff2") format("woff2");
 }
+
 .nf-icons {
  font-family: "NerdFontsSymbols Nerd Font";
 }
+
 /* Releases */
 .release-track {
  background-size: cover;
@@ -544,9 +713,11 @@ nav .dropdown {
  border-radius: 10px;
  border: 1px solid #ddd;
 }
+
 .release-track strong {
  color: #fff;
 }
+
 .release-track .text-box {
  max-width: 1250px;
  margin: 25% auto;
@@ -557,6 +728,7 @@ nav .dropdown {
  border-radius: 7px;
  font-size: 1.2rem;
 }
+
 .release-track .text-box a {
  text-decoration: none;
  color: #fff;
@@ -567,19 +739,23 @@ nav .dropdown {
  background-repeat: no-repeat;
  transition: 0.3s ease-in-out;
 }
+
 .release-track .text-box a:hover {
  color: #ccc;
  background-size: 100% 0.2em;
 }
+
 /* info */
 .info {
  text-decoration: none;
  list-style-type: none;
  font-size: 1.4rem;
 }
+
 .info li {
  padding: 1rem;
 }
+
 .info a {
  text-decoration: none;
  color: #46f;
@@ -590,27 +766,34 @@ nav .dropdown {
  background-repeat: no-repeat;
  transition: 0.3s ease-in-out;
 }
+
 .info a:hover {
  opacity: 70%;
  background-size: 100% 0.2em;
 }
+
 .info .title {
  font-size: 1.6rem;
 }
+
 .subdiv {
  padding: 1rem;
 }
+
 .long-br {
  display: block;
  height: 2rem;
 }
-@media screen and (width >= 1180px) and (width<=1690px) {
+
+@media screen and (width >=1180px) and (width<=1690px) {
+
  /*if(width<1620px&&width>=1125px)*/
  nav .dropdown .dropdown-social {
    position: relative;
    width: 17.5rem;
    padding: 0rem 0rem;
  }
+
  nav .dropdown .dropdown-social a {
    transition: 0.2s;
    display: flex;
@@ -618,62 +801,78 @@ nav .dropdown {
    border-radius: 7px;
    margin: 0.3rem 0;
  }
+
  nav .dropdown .dropdown-social a:hover {
    background-color: #ddd;
  }
+
  nav .dropdown .dropdown-social strong {
    margin-left: auto;
    margin-right: auto;
    align-content: center;
  }
+
  nav .dropdown .dropdown-social p {
    margin: 0.5rem 0;
  }
+
  nav .dropdown .dropdown-menu {
    display: none;
  }
+
  nav .menu,
  nav .dropdown-open.dropdown,
  nav .dropdown-open.dropdown-social {
    opacity: 1;
    display: initial;
  }
+
  nav .social,
  nav .dropdown-open.dropdown-menu {
    opacity: 0;
    display: none;
  }
+
  nav .burger {
    display: block;
  }
 }
+
@media screen and (width<1180px) {
+
  /*if(width<1125px)*/
  nav {
    font-size: 1.4rem;
  }
+
  nav ul img {
    height: 2.5rem;
  }
+
  nav .social {
    font-size: 2rem;
  }
+
  nav .burger {
    height: 100px;
    width: 100px;
  }
+
  nav .dropdown .dropdown-social,
  nav .dropdown .dropdown-menu {
    position: relative;
  }
+
  nav .dropdown .dropdown-menu {
    width: 18rem;
    padding: 0rem 0rem;
  }
+
  nav .dropdown .dropdown-social {
    display: flex;
    flex-wrap: wrap;
  }
+
  nav .dropdown .dropdown-menu p,
  nav .dropdown .dropdown-social a {
    transition: 0.2s;
@@ -681,35 +880,43 @@ nav .dropdown {
    border-radius: 7px;
    margin: 0.3rem 0;
  }
+
  nav .dropdown .dropdown-menu p:hover {
    background-color: #ddd;
  }
+
  nav .dropdown .dropdown-social a:hover {
    opacity: 50%;
  }
+
  nav .dropdown hr {
    margin: 0.75rem 0rem;
    padding: 1rem;
    border: 1px solid #aaa;
  }
+
  nav .social-name {
    display: none;
  }
+
  nav .social,
  nav .menu-item {
    display: none;
  }
+
  nav .dropdown-open {
    transition: 0.3s;
    opacity: 1;
    display: initial;
  }
+
  nav .dropdown-open .dropdown,
  nav .dropdown-open .dropdown-social,
  nav .dropdown-open .downdown-menu {
    display: initial;
  }
+
  nav .burger {
    display: block;
  }
-}
+}
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -10,7 +10,8 @@ let carousel = document.querySelector(".carousel");
 let bg = document.querySelector(".slider-bg");

 //Album-cards
-let album_cards = document.querySelector(".album-cards");
+let album_cards = document.querySelector(".album-cards"),
+half_img_cards = document.querySelector(".half-image-cards");

 //The Database call.
 import { createClient } from "https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm";
@@ -55,8 +56,8 @@ if (!params.get("release")) {
    document.title = "t404:null | Home";
    build_event(0);
  }
-  if (path_name === "/" || path_name === "/release") build_event(1);
-  if (path_name === "/" || path_name === "/activity") build_event(2);
+  if (path_name === "/" || path_name === "/release" || path_name === "/release/") build_event(1);
+  if (path_name === "/" || path_name === "/activity" || path_name === "/activity/") build_event(2);
 } else {
  let main = document.querySelector("main");
  main.innerHTML = "";
@@ -291,6 +292,7 @@ async function init_releases(d) {
          <p> "Even if you don't remember me now, I will bring the you I once knew back from them." </p>
        </a>
 */
+    if(releases.length>0)album_cards.innerHTML="";
    releases.forEach((a) => {
      let _card = document.createElement("a"),
        _bg_img = document.createElement("div"),
@@ -321,7 +323,7 @@ async function init_activities(d) {
  if (d.error) {
    console.error("Error fetching data:", d.error);
  } else {
-    releases = d.data;
+    activities = d.data;
    /*<a class="card" href="/activity">
          <div class="bg-img" style="
              background-image: url(https://cdn.glitch.global/f594d6b7-e72e-477c-b5cb-d71abbd39f44/fof-genesis.png);
@@ -369,7 +371,8 @@ async function init_activities(d) {
          <p>???</p>
          <p>???</p>
        </a>*/
-    releases.forEach((a) => {
+    if(activities.length>0)album_cards.innerHTML="";
+    activities.forEach((a) => {
      let _card = document.createElement("a"),
        _bg_img = document.createElement("div"),
        _h2 = document.createElement("h2"),
@@ -390,7 +393,7 @@ async function init_activities(d) {
      _card.appendChild(_h2);
      _card.appendChild(_p_subtitle);
      _card.appendChild(_p_preview);
-      album_cards.appendChild(_card);
+      half_img_cards.appendChild(_card);
    });
  }
 }
--- a/assets/js/mail.js
+++ b/assets/js/mail.js
@@ -0,0 +1,50 @@
+import { createClient } from "https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm";
+
+const supabaseUrl = "https://owbamcqdmqetrgcznxva.supabase.co";
+const supabaseKey =
+  "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im93YmFtY3FkbXFldHJnY3pueHZhIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MjI5NDU5NjIsImV4cCI6MjAzODUyMTk2Mn0.xNen7b513ZGwJ-Qu5iZ6K8qrmvy4QVjS10wiYbEEwKc";
+//anon key, you cant access private stuffs or add hilarious stuffs w/ this...
+//(unless sending me some malicious links but I delete your msg)
+//the moment you notice you need an API endpoint.
+const supabase = createClient(supabaseUrl, supabaseKey);
+
+const   form = document.getElementById("mail-form"),
+        nameInput = document.getElementById("name"),
+        emailInput = document.getElementById("email"),
+        subjectInput = document.getElementById("subject"),
+        messageInput = document.getElementById("message"),
+        statusMessage = document.querySelector(".box");
+
+form.addEventListener("submit", async (e) => {
+    e.preventDefault();
+
+    const name = nameInput.value.trim();
+    const email = emailInput.value.trim();
+    const subject = subjectInput.value.trim();
+    const message = messageInput.value.trim();
+
+    if (!name || !email || !subject || !message || 
+        name.length==0 || email.length==0 || subject.length==0 || message.length==0) {
+        statusMessage.textContent = "Please fill in all fields.";
+        statusMessage.style = "background: #FFDCDC";
+        return;
+    }
+
+    try {
+        const { data, error } = await supabase
+            .from("mail")
+            .insert([{ name, email, subject, message }]);
+
+        if (error) {
+            throw error;
+        }
+
+        statusMessage.textContent = "Message sent successfully!";
+        statusMessage.style = "background: #DDF6D2";
+        form.reset();
+    } catch (error) {
+        console.error("Error sending message:", error);
+        statusMessage.textContent = "Error sending message. Please try again.";
+        statusMessage.style = "background: #FFDCDC";
+    }
+});
--- a/contacts/index.html
+++ b/contacts/index.html
@@ -1,12 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <title>t404:null | Home</title>
+    <title>t404:null | Contacts</title>
    <meta name="description" content="Hello there! I'm t404:null (a.k.a t404owo).
-I write/make/produce EDM music(DTM), and for every releases I'll post my music on this website. If you have any requests or questions, feel free contact me." />
+
+Here is my contact list. Feel free to contact me in case you need anything in my reach ;)" />
    <link rel="icon" type="image/x-icon" href="https://cdn.glitch.global/2d9e31c1-a947-46cd-9fd2-8c92be70abe2/t404_null%20Icon.png" />
    <meta charset="UTF-8" />
    <link rel="stylesheet" type="text/css" href="/assets/css/main.css" />
+    <script src="/assets/js/mail.js" type="module"></script>
  </head>
  <body>
    <nav>
@@ -200,6 +202,12 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
        <li>
          <strong class="title" style="color:#555"><b class="nf-icons icons">&#xf42f;</b> Email</strong>
          <p class="desc">
+            <a href="mailto:info@t404null.com" class="text-info">info@t404null.com</a>
+            <br />
+            <a href="mailto:request@t404null.com" class="text-info">request@t404null.com</a>
+            <br />
+            <a href="mailto:t404.null@t404null.com" class="text-info">t404.null@t404null.com</a>
+            <br /><br />Or:<br />
            <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
            <br />
            <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
@@ -215,12 +223,34 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
            </a>
        </li>
        <li><a href="https://x.com/t404_null" style="color:black; background: none">
-          <strong class="title"><b class="icons">&Xopf;</b> X / Twitter</strong>
+          <strong class="title"><b class="nf-icons icons">&#xe8c9;</b> X / Twitter</strong>
          <p class="desc">@t404_null</p>
          </a>
        </li>
      </ul>
+      <hr />
+      <h1 class="topic">
+        (Or) Contact me here
+      </h1>
+      <div class="contact-email">
+        <form method="POST" class="form" id="mail-form">
+                <label for="name">Subject:</label>
+                <input type="text" name="name" id="name" class="inputbox" placeholder="Your Name" required>
+                <br>
+                <label for="email">Email:</label>
+                <input type="email" name="email" id="email" class="inputbox" placeholder="your.email@here.please" autocomplete="email" required>
+                <br>
+                <label for="subject">Subject:</label>
+                <input type="text" name="subject" id="subject" class="inputbox" placeholder="Your topic here ;)" required>
+                <br>
+                <label for="message">Message:</label>
+                <textarea type="text" name="message" id="message" class="inputbox" placeholder="Message here." required></textarea>
+                <br>
+                <div class="box"></div>
+                <button type="submit" class="formbutton">Submit</button>
+          </form>
+      </div>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>
 </html>
--- a/index.html
+++ b/index.html
@@ -219,14 +219,18 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
      <h1 class="topic">
        <a href="/release">Releases (Click for more)</a>
      </h1>
-      <div class="album-cards"></div>
+      <div class="album-cards">
+        Nothing here yet. ;D
+      </div>
      <hr />
      <h1 class="topic">
        <a href="/activity">Activities</a>
      </h1>
-      <div class="half-image-cards"></div>
+      <div class="half-image-cards">
+        Nothing here yet. ;D
+      </div>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>

  <script src="/assets/js/index.js" type="module"></script>
--- a/release/index.html
+++ b/release/index.html
@@ -192,9 +192,10 @@ I write/make/produce EDM music(DTM), and for every releases I'll post my music o
    <main class= "main-page">
      <h1 class="topic">Releases</h1>
      <div class="album-cards">
+        Nothing here yet. ;D
      </div>
      <script src="/assets/js/index.js" type="module"></script>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>
 </html>
--- a/song_usage_terms/index.html
+++ b/song_usage_terms/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <title>t404:null | Home</title>
+    <title>t404:null | Usage of my song(s) / track(s)</title>
    <meta name="description" content="Hello there! Please be friendly and read this ”terms of using my songs” before using my(t404:null's) song for any purposes." />
    <link rel="icon" type="image/x-icon" href="https://cdn.glitch.global/2d9e31c1-a947-46cd-9fd2-8c92be70abe2/t404_null%20Icon.png" />
    <meta charset="UTF-8" />
@@ -202,23 +202,33 @@
          <div class="long-br"></div> All use of the music/track(s)/song(s) is at your own risk. I'm not responsible for any damage, problems caused by your use of my music/track(s)/song(s) and won't be involved in by any way.
        </li>
        <li>
-          <strong class="title">1.) In the case if you want to use my song(s) / track(s) as a corporation / a company</strong>
-          <br /> If you wish to use my song as a corporation / a company, no matter how you use it, please contact me and get confirmation at one of the following email address(es): <br />
-          <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
-          <br />
-          <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
-          <br />
-          <a href="mailto:tags4owo@gmail.com" class="text-info">tags4owo@gmail.com</a>
-        </li>
-        <li>
-          <div class="subdiv">
-            <strong class="title">1.1.) In the case if you want to use my song(s) / track(s) as an educational institution or a volunteer organization / a company for volunteer</strong>
-            <br /> You are allowed use my songs as well as individuals. <br /> If you can, it would be (very) helpful for me if you could confirm it once in the following email adress(es): <br />
+          <strong class="title">1.) In the case if you want to use my song(s) / track(s) as a corporation / a company material</strong>
+          <br /> If you wish to use my song as a corporation / a company material, no matter how you use it, please contact me and get confirmation at one of the following email address(es): <br />
+          <a href="mailto:request@t404null.com" class="text-info">request@t404null.com</a>
+            <div class="long-br"></div>
+            Or:
+            <br />
            <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
            <br />
            <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
            <br />
            <a href="mailto:tags4owo@gmail.com" class="text-info">tags4owo@gmail.com</a>
+            <br />
+        </li>
+        <li>
+          <div class="subdiv">
+            <strong class="title">1.1.) In the case if you want to use my song(s) / track(s) as an educational institution or a volunteer organization / a company for volunteer</strong>
+            <br /> You are allowed use my songs as well as individuals. <br /> If you can, it would be (very) helpful for me if you could confirm it once in the following email adress(es): <br />
+            <a href="mailto:info@t404null.com" class="text-info">info@t404null.com</a>
+            <div class="long-br"></div>
+            Or:
+            <br />
+            <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
+            <br />
+            <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
+            <br />
+            <a href="mailto:tags4owo@gmail.com" class="text-info">tags4owo@gmail.com</a>
+            <br />
            <br /> Please note that this is intended primarily, but not exclusively, for educational institutions related to music.
          </div>
        </li>
@@ -254,6 +264,10 @@
          <div class="subdiv">
            <strong class="title">3.2.) If you want to distribute the music as an official chart / official music for a rhythm game (in short, if you're a developer/offical charter/owner of that game) or if you want to use my song/track as a BGM that is included for a program / a game or its directory</strong>
            <br /> Please contact me at one of the following email address(es): <br />
+            <a href="mailto:request@t404null.com" class="text-info">request@t404null.com</a>
+            <div class="long-br"></div>
+            Or:
+            <br />
            <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
            <br />
            <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
@@ -266,6 +280,10 @@
          <div class="dubdiv">
            <strong class="title">3.3.) If you want to repost my song</strong>
            <br /> Please contact me at one of the following email address(es): <br />
+            <a href="mailto:request@t404null.com" class="text-info">request@t404null.com</a>
+            <div class="long-br"></div>
+            Or:
+            <br />
            <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
            <br />
            <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
@@ -277,6 +295,10 @@
        <li>
          <strong class="title">4.) Other Uses</strong>
          <br /> Please contact me at one of the following email address(es): <br />
+          <a href="mailto:info@t404null.com" class="text-info">info@t404null.com</a>
+          <div class="long-br"></div>
+          Or:
+          <br />
          <a href="mailto:t404.null@gmail.com" class="text-info">t404.null@gmail.com</a>
          <br />
          <a href="mailto:t404owo@gmail.com" class="text-info">t404owo@gmail.com</a>
@@ -284,9 +306,9 @@
          <a href="mailto:tags4owo@gmail.com" class="text-info">tags4owo@gmail.com</a>
          <br />
        </li>
-        <div class="long-br"></div> &copy; t404:null 2021-2024 - All Rights Reserved.
+        <div class="long-br"></div> &copy; t404:null 2021-2025 - All Rights Reserved.
      </ul>
    </main>
-    <div class="footer">&copy; t404:null 2021-2024 - All Rights Reserved</div>
+    <div class="footer">&copy; t404:null 2021-2025 - All Rights Reserved</div>
  </body>
 </html>
Author	SHA1	Message	Date
t404owo	58d8e7ec39	Update index.html	2025-10-17 05:05:18 +02:00
t404owo	2d0a5c1ce5	Merge pull request #19 from t404owo/main Update to unstable branch	2025-10-17 05:04:37 +02:00
t404owo	92b0e1232e	remove eruda for cleaniness	2025-10-17 03:03:00 +00:00
t404owo	3ede610b6d	Form alignment fix	2025-10-17 03:00:21 +00:00
t404owo	066490f850	some cosmetics fix	2025-10-17 02:49:38 +00:00
t404owo	849dfeda89	Site Update Added contact formular Some Descriptions / Titles update Terms of Usage (ToU) update. Minor Copyright (C) update.	2025-10-17 04:18:23 +02:00
t404owo	c28949f2fc	Site metadata update	2025-10-17 02:15:21 +00:00
t404owo	38e174a28f	test #4.2 some size adjestment	2025-10-17 02:06:13 +00:00
t404owo	64e22d3eb9	test #4.1 another UI test	2025-10-17 02:02:28 +00:00
t404owo	40f9194271	test #4 old .css	2025-10-17 01:58:14 +00:00
t404owo	422b417c29	test #4 design check	2025-10-17 01:57:04 +00:00
t404owo	17c26b0fb0	test#3 reedited color	2025-10-17 01:48:53 +00:00
t404owo	f46d90f06e	test #3 style adjustment	2025-10-17 01:43:56 +00:00
t404owo	522d3a69db	test#2 added id for test	2025-10-17 01:39:38 +00:00
t404owo	b11e68a4d2	test#1 color fix	2025-10-17 01:36:29 +00:00
t404owo	f996359f3a	test #1	2025-10-17 01:33:43 +00:00
t404owo	87b9d03ca8	Merge pull request #17 from t404owo/main Main	2025-10-17 02:59:06 +02:00
t404owo	b0709aa77e	old.css updated	2025-10-17 00:56:29 +00:00
t404owo	0a0310b410	fixed X icons thingy...	2025-10-17 00:52:43 +00:00
t404owo	b6034115c8	some cosmetics fix ;D	2025-10-17 00:39:48 +00:00
t404owo	f936514228	.	2025-10-16 23:58:17 +00:00
t404owo	da810d6a03	JS fix about /release and /release/ issue	2025-10-16 23:55:56 +00:00
t404owo	d704e025a6	replaced login submit...	2025-10-16 23:50:42 +00:00
t404owo	1104fd3998	Fixed a bug.... "context", lmao I cringed hard, replaced w/ innerHTML.	2025-10-16 23:46:14 +00:00
t404owo	9e7ca86494	Updated serveral stuffs JS: added for Empty slots a msg (user request). Updated copyright and ToS/ToU for my tracks / properties.	2025-10-16 23:42:15 +00:00
t404owo	1149d1fdfb	made the text not too serious to delight my client ofc ;D Some form edit b4 CSS and JS involved....	2025-10-16 23:11:37 +00:00
t404owo	cdb6222553	updated form nor now ._." Time to apply CSS and JS	2025-10-16 23:06:21 +00:00
t404owo	90b7aa5b6f	Delete CNAME	2025-10-16 03:36:04 +02:00
t404owo	d5915b1b59	Create CNAME	2025-10-16 03:34:39 +02:00
t404owo	81d6fd2475	updated pass to subject xD	2025-10-08 12:15:27 +00:00
t404owo	66b845fd11	uhhh removed stuffs :DDD	2025-10-08 12:14:10 +00:00
t404owo	f4bc2178cb	added contact form (rework soon)	2025-10-08 12:13:32 +00:00