diff --git a/Art/animcss/index.html b/Art/animcss/index.html
new file mode 100644
index 000000000..621353376
--- /dev/null
+++ b/Art/animcss/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ Simple CSS Animation
+
+
+
+
+
+
diff --git a/Art/animcss/style.css b/Art/animcss/style.css
new file mode 100644
index 000000000..59debf00c
--- /dev/null
+++ b/Art/animcss/style.css
@@ -0,0 +1,31 @@
+body {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ margin: 0;
+ background-color: #f0f0f0;
+}
+
+.animated-box {
+ width: 150px;
+ height: 150px;
+ background-color: #3498db;
+ position: relative;
+ animation: moveAndColorChange 4s infinite alternate;
+}
+
+@keyframes moveAndColorChange {
+ 0% {
+ left: 0;
+ background-color: #3498db;
+ }
+ 50% {
+ left: 200px;
+ background-color: #e74c3c;
+ }
+ 100% {
+ left: 400px;
+ background-color: #2ecc71;
+ }
+}
diff --git a/include.js b/include.js
index d79416a3a..e50c1b3bd 100644
--- a/include.js
+++ b/include.js
@@ -2922,6 +2922,13 @@ let cards = [
author: 'Yumi Machino',
githubLink: 'https://github.com/YumiMachino'
},
+ {
+ artName: 'animcss',
+ pageLink: './Art//index.html',
+ imageLink: './Art//box.gif',
+ author: 'Kamil',
+ githubLink: 'https://github.com/BravoKolos'
+ }
];
/* -------------------------------------------------------------------------- */