diff --git a/src/art/Xros3x/icon.png b/src/art/Xros3x/icon.png
new file mode 100644
index 0000000..ee84d9a
Binary files /dev/null and b/src/art/Xros3x/icon.png differ
diff --git a/src/art/Xros3x/index.html b/src/art/Xros3x/index.html
new file mode 100644
index 0000000..434737a
--- /dev/null
+++ b/src/art/Xros3x/index.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Xros3x
+
+
+
+
+
diff --git a/src/art/Xros3x/meta.json b/src/art/Xros3x/meta.json
new file mode 100644
index 0000000..5d490ac
--- /dev/null
+++ b/src/art/Xros3x/meta.json
@@ -0,0 +1,5 @@
+{
+ "art_name": "The Portal",
+ "author_name": "Xros3x",
+ "author_github_url": "https://github.com/Xros3x/"
+ }
\ No newline at end of file
diff --git a/src/art/Xros3x/styles.css b/src/art/Xros3x/styles.css
new file mode 100644
index 0000000..6380bdd
--- /dev/null
+++ b/src/art/Xros3x/styles.css
@@ -0,0 +1,103 @@
+
+@property --rotate {
+ syntax: "";
+ initial-value: 132deg;
+ inherits: false;
+ }
+
+ :root {
+ --card-height: 70vh;
+ --card-width: calc(var(--card-height) / 1.5);
+ }
+
+
+ body {
+ min-height: 100vh;
+ display: flex;
+ background: linear-gradient(to right, rgb(66, 62, 62), rgb(0, 0, 0));
+ align-items: center;
+ flex-direction: column;
+ padding-top: 7rem;
+ padding-bottom: 2rem;
+ box-sizing: border-box;
+ }
+
+
+ .card {
+ background: linear-gradient(to left, rgb(49, 49, 49), rgb(9, 169, 155));
+ width: var(--card-width);
+ height: var(--card-height);
+ padding: 3px;
+ position: relative;
+ border-radius: 6px;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ display: flex;
+ font-size: 2.5em;
+ color: rgb(88 199 250 / 0%);
+ cursor: pointer;
+ font-family: cursive;
+ }
+
+ .card:hover {
+ color: rgb(0, 0, 0);
+ transition: color 1s;
+ }
+ .card:hover:before, .card:hover:after {
+ animation: none;
+ opacity: 0;
+ }
+
+
+ .card::before {
+ content: "";
+ width: 104%;
+ height: 102%;
+ border-radius: 8px;
+ background-image: linear-gradient(
+ var(--rotate)
+ , #7e39ee, #3ce379 43%, #000000, #7e39ee);
+ position: absolute;
+ z-index: -1;
+ top: -1%;
+ left: -2%;
+ animation: spin 2.5s linear infinite;
+ }
+
+ .card::after {
+ position: absolute;
+ content: "";
+ top: calc(var(--card-height) / 6);
+ left: 0;
+ right: 0;
+ z-index: -1;
+ height: 100%;
+ width: 100%;
+ margin: 0 auto;
+ transform: scale(0.8);
+ filter: blur(calc(var(--card-height) / 6));
+ background-image: linear-gradient(
+ var(--rotate)
+ , #7e39ee, #3ce379 43%, #000000, #7e39ee);
+ opacity: 1;
+ transition: opacity .5s;
+ animation: spin 2.5s linear infinite;
+ }
+
+ @keyframes spin {
+ 0% {
+ --rotate: 0deg;
+ }
+ 100% {
+ --rotate: 360deg;
+ }
+ }
+
+ a {
+ color: #212534;
+ text-decoration: none;
+ font-family: sans-serif;
+ font-weight: bold;
+ margin-top: 2rem;
+ }
\ No newline at end of file