diff --git a/contact.html b/contact.html
new file mode 100644
index 0000000..bc490c4
--- /dev/null
+++ b/contact.html
@@ -0,0 +1,43 @@
+
+
+
+ Krzak.org
+
+
+
+
+ Krzak.org
+
+
Contact:
+
+
Support:
+
+
+
\ No newline at end of file
diff --git a/index.html b/index.html
index 40a579d..97fba99 100755
--- a/index.html
+++ b/index.html
@@ -23,180 +23,17 @@
-
-
+
Krzak.org
Hi, welcome to krzak.org
-
We host:
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..a2331c2
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,155 @@
+:root {
+ --bg-gradient-1: #2a1a5e;
+ --bg-gradient-2: #8b4789;
+ --bg-gradient-3: #f4a261;
+ --container-bg: rgba(42, 26, 94, 0.7);
+ --container-border: rgba(244, 162, 97, 0.8);
+ --text-color: #ffe8d6;
+ --link-color: #f4a261;
+ --link-bg: rgba(139, 71, 137, 0.3);
+ --link-hover-bg: rgba(244, 162, 97, 0.3);
+ --link-hover-border: rgba(244, 162, 97, 0.8);
+ --subtitle-color: #dda15e;
+}
+
+body {
+ background: linear-gradient(
+ var(--bg-gradient-1),
+ var(--bg-gradient-2),
+ var(--bg-gradient-3)
+ )
+ no-repeat fixed;
+ color: var(--text-color);
+ font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
+ margin: 0;
+ padding: 0;
+ min-height: 100vh;
+ transition: all 0.5s ease;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+body::before {
+ content: "";
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ pointer-events: none;
+ z-index: 0;
+ transition: 0.5s ease;
+ background: radial-gradient(
+ circle at 20% 50%,
+ rgba(255, 255, 255, 0.08) 0%,
+ transparent 50%
+ );
+}
+
+.container {
+ background: var(--container-bg);
+ border-radius: 15px;
+ padding: 25px;
+ border: 1px solid var(--container-border);
+ backdrop-filter: blur(12px);
+ -webkit-backdrop-filter: blur(12px);
+ width: 40%;
+ margin: auto;
+ box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
+ transition: all 0.3s ease;
+ position: relative;
+ z-index: 1;
+}
+
+h1 {
+ margin: 20px 0;
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
+ color: var(--text-color);
+ transition: color 0.3s ease;
+}
+
+p {
+ color: var(--text-color);
+ transition: color 0.3s ease;
+}
+
+ul {
+ list-style: none;
+ padding: 0;
+ margin-top: 20px;
+}
+
+li a {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 15px;
+ border-radius: 8px;
+ color: var(--text-color);
+ text-decoration: none;
+ transition: all 0.3s ease;
+ margin-bottom: 10px;
+ background-color: var(--link-bg);
+ border: 1px solid transparent;
+}
+
+li a:hover {
+ background-color: var(--link-hover-bg);
+ border-color: var(--link-hover-border);
+ transform: scale(1.02);
+}
+
+li a strong {
+ font-weight: 600;
+ color: var(--link-color);
+ transition: color 0.3s ease;
+}
+
+li a span {
+ font-weight: 300;
+ color: var(--subtitle-color);
+ transition: color 0.3s ease;
+}
+
+@media (max-width: 1024px) {
+ .container {
+ width: 60%;
+ }
+}
+
+@media (max-width: 768px) {
+ body {
+ display: block;
+ }
+ .container {
+ width: 80%;
+ }
+ h1 {
+ font-size: 2em;
+ }
+}
+
+@media (max-width: 480px) {
+ .container {
+ width: 90%;
+ padding: 15px;
+ }
+ h1 {
+ font-size: 1.5em;
+ }
+}
+
+.icon {
+ width: 24px;
+ height: 24px;
+ margin-right: 8px;
+ background-size: contain;
+ background-repeat: no-repeat;
+ vertical-align: top;
+}
+
+h1 {
+ vertical-align: middle;
+}
+
+ Krzak.org
+