diff --git a/.idea/runConfigurations/PDF.xml b/.idea/runConfigurations/PDF.xml
new file mode 100644
index 0000000..fdfae02
--- /dev/null
+++ b/.idea/runConfigurations/PDF.xml
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Writerside/c.list b/Writerside/c.list
new file mode 100644
index 0000000..c4c77a2
--- /dev/null
+++ b/Writerside/c.list
@@ -0,0 +1,6 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/Writerside/cfg/buildprofiles.xml b/Writerside/cfg/buildprofiles.xml
new file mode 100644
index 0000000..bb0fbb2
--- /dev/null
+++ b/Writerside/cfg/buildprofiles.xml
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+ false
+
+
+
+
diff --git a/Writerside/images/install_python.png b/Writerside/images/install_python.png
new file mode 100644
index 0000000..2d54d60
Binary files /dev/null and b/Writerside/images/install_python.png differ
diff --git a/Writerside/imgal.tree b/Writerside/imgal.tree
new file mode 100644
index 0000000..8236a6c
--- /dev/null
+++ b/Writerside/imgal.tree
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Writerside/redirection-rules.xml b/Writerside/redirection-rules.xml
new file mode 100644
index 0000000..292bab7
--- /dev/null
+++ b/Writerside/redirection-rules.xml
@@ -0,0 +1,21 @@
+
+
+
+
+
+ Created after removal of "About Imgal" from Imgal
+ starter-topic.html
+
+
+ Created after removal of "Prerequisites" from Imgal
+ Prerequisites.html
+
+
+ Created after removal of "Section Starting Page" from Imgal
+ Section-Starting-Page.html
+
+
\ No newline at end of file
diff --git a/Writerside/topics/Creating-an-Image-gallery.md b/Writerside/topics/Creating-an-Image-gallery.md
new file mode 100644
index 0000000..4687403
--- /dev/null
+++ b/Writerside/topics/Creating-an-Image-gallery.md
@@ -0,0 +1,27 @@
+# Creating an Image gallery
+
+### Prerequisites
+
+To use Imgal you need Python and the Pillow package installed. Learn how to do that [here](Prerequisites.md).
+
+### Organizing your files before creating the gallery
+
+Extract the Imgal zip file.
+
+In a folder, place the `imagal.py` file and the `templates` folder found in the zip file.
+
+In the same folder, create another folder, and place your images in it.
+
+### Creating the image gallery
+
+In your Terminal or Powershell, go to the directory where the `imgal.py` file is.
+
+Then run the command :
+```Shell
+python imgal.py
+```
+
+Now follow the instructions of the program. When it's done, you will find the website structure in the
+folder where the images were stored. You can then delete the `templates` folder and `imgal.py`.
+
+**You can now upload the gallery to your web server.**
\ No newline at end of file
diff --git a/Writerside/topics/Introduction.md b/Writerside/topics/Introduction.md
new file mode 100644
index 0000000..261fd36
--- /dev/null
+++ b/Writerside/topics/Introduction.md
@@ -0,0 +1,13 @@
+# Introduction
+
+### What is Imgal
+
+Imgal is a program for creating photo galleries. It's written in Python.
+
+Imgal is completely opensource and the code can be found on GitHub.
+
+You can find example/demo image libraries created with Imgal at [](https://demo.imgal.kioydiolabs.org).
+
+### Creating gallery with Imgal
+
+Learn how to create an image gallery with Imgal
\ No newline at end of file
diff --git a/Writerside/topics/Prerequisites.md b/Writerside/topics/Prerequisites.md
new file mode 100644
index 0000000..e35a594
--- /dev/null
+++ b/Writerside/topics/Prerequisites.md
@@ -0,0 +1,6 @@
+# Prerequisites
+
+To install the prerequisites for Imgal, choose the appropriate guide below :
+
+- [Windows](windows-prereq.md)
+- [Linux](linux-prereq.md)
\ No newline at end of file
diff --git a/Writerside/topics/linux-prereq.md b/Writerside/topics/linux-prereq.md
new file mode 100644
index 0000000..1540c9b
--- /dev/null
+++ b/Writerside/topics/linux-prereq.md
@@ -0,0 +1,27 @@
+# Linux Prerequisites Installation
+
+### Installing Python
+
+To install Python, open the Terminal and run the command below
+
+```Shell
+sudo apt update && sudo apt install python3 -y
+```
+
+### Installing the Pillow package
+
+After you have installed Python, you need to install the Pillow package that's used for resizing images and creating thumbails.
+
+To do that, open the Terminal and run the following command
+
+```Shell
+pip install Pillow
+```
+
+If the command above doesn't work, or you get an error that pip could not be found, run the command below instead
+
+```Shell
+python -m install Pillow
+```
+
+**You now have all the prerequisites you need installed! Go back to [Creating an image gallery](Creating-an-Image-gallery.md) to learn how to create a gallery!**
\ No newline at end of file
diff --git a/Writerside/topics/windows-prereq.md b/Writerside/topics/windows-prereq.md
new file mode 100644
index 0000000..56fba1e
--- /dev/null
+++ b/Writerside/topics/windows-prereq.md
@@ -0,0 +1,27 @@
+# Windows Prerequisites Installation
+
+### Installing Python
+
+To install Python, go to [](https://www.python.org/downloads/) and download the latest version.
+
+
+
+Then, run the executable and follow the installation instructions.
+
+### Installing the Pillow package
+
+After you have installed Python, you need to install the Pillow package that's used for resizing images and creating thumbails.
+
+To do that, open Powershell and run the following command
+
+```Shell
+pip install Pillow
+```
+
+If the command above doesn't work, or you get an error that pip could not be found, run the command below instead
+
+```Shell
+python -m install Pillow
+```
+
+**You now have all the prerequisites you need installed! Go back to [Creating an image gallery](Creating-an-Image-gallery.md) to learn how to create a gallery!**
\ No newline at end of file
diff --git a/Writerside/v.list b/Writerside/v.list
new file mode 100644
index 0000000..2d12cb3
--- /dev/null
+++ b/Writerside/v.list
@@ -0,0 +1,5 @@
+
+
+
+
+
diff --git a/Writerside/writerside.cfg b/Writerside/writerside.cfg
new file mode 100644
index 0000000..b2205d3
--- /dev/null
+++ b/Writerside/writerside.cfg
@@ -0,0 +1,8 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/builder/templates/sleek.css b/builder/templates/sleek.css
new file mode 100644
index 0000000..c8ae587
--- /dev/null
+++ b/builder/templates/sleek.css
@@ -0,0 +1,193 @@
+:root{
+ --width: 426px;
+ --widthPad: 406px;
+}
+
+body{
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background-color: hsl(228, 10%, 10%);
+}
+
+#header{
+ width: var(--width);
+ font-family: Arial;
+ text-align: center;
+}
+
+#header #title{
+ color: hsl(0, 0%, 79%);
+ font-weight: bold;
+ font-size: 1.3em;
+ margin-bottom: 0px;
+ text-align: center;
+}
+
+.hr{
+ border: 1px dashed hsl(0, 0%, 41%);
+ margin-top: 3px;
+ margin-bottom: 0px;
+ width: var(--width);
+ opacity: 0;
+}
+
+#header #description{
+ color: hsl(0, 0%, 79%);
+ font-weight: bold;
+ font-size: 1em;
+ margin-top: 7px;
+ margin-bottom: 0px;
+}
+
+
+#header #author{
+ color: hsl(0, 0%, 79%);
+ font-weight: lighter;
+ font-size: 0.8em;
+ margin-top: 5px;
+}
+
+
+#gallery{
+ margin-top: 25px;
+ display: flex;
+ width: var(--width);
+ flex-direction: row;
+ justify-content: left;
+ flex-wrap: wrap;
+ /*padding: 10px;*/
+}
+
+.images{
+ --divMax: max-content;
+ height: 120px;
+ width: 120px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ margin: 0px;
+ padding: 10px;
+ object-fit: scale-down;
+}
+
+.emptyDiv{
+ display: none;
+}
+
+.images img:hover{
+ transform: scale(105%);
+}
+
+.images img{
+ transition: 0.2s;
+ /*box-shadow: 2px 3px 7px black;*/
+}
+
+.images a{
+ height: 100%;
+ width: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+}
+
+#smallFooter a{
+ color: white;
+ font-family: Arial;
+ margin-right: 20px;
+}
+
+#smallFooter{
+ margin-top: 10px;
+ display: flex;
+ flex-direction: row;
+ width: var(--width);
+ justify-content: center;
+}
+
+#smallFooter a{
+ color: hsl(0, 0%, 79%);
+ margin: 0;
+ text-decoration: none;
+}
+
+.activePage{
+ border: 1px solid rgba(255, 255, 255, 0.29);
+ padding: 7px;
+ border-radius: 2px;
+}
+
+#smallFooter #pageNumbs a:hover{
+ color: white;
+}
+
+#smallFooter #prevNext a{
+ margin: 0px;
+ font-weight: bold;
+ margin-left: 10px;
+}
+
+#smallFooter #contact{
+ text-align: center;
+ background-color: #004fb1;
+ padding-top: 4px;
+ padding-bottom: 4px;
+ padding-right: 10px;
+ padding-left: 10px;
+ border-radius: 35px;
+ font-weight: bold;
+ transition: 0.3s;
+}
+
+#smallFooter #contact:hover{
+ background-color: #0068e4;
+ cursor: pointer;
+}
+
+#footer{
+ color: hsl(0, 0%, 21%);
+ font-weight: bold;
+ font-size: 0.8em;
+ margin-top: 5px;
+ font-family: arial;
+ position: static;
+ bottom: 0px;
+}
+
+
+
+#imgOuterGal{
+ display: flex;
+ width: var(--widthPad);
+ height: 300px;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ padding: 10px;
+ overflow: visible;
+}
+
+#imgOuterGal img{
+ border-radius: 10px;
+ transition: box-shadow 5s;
+}
+
+#imgOuterGal img:hover{
+ box-shadow: 1px 1px 75px rgba(255, 255, 255, 0.32);
+}
+
+.images img{
+ border-radius: 10px;
+}
+
+@keyframes glowViewer {
+ from{
+ box-shadow: none;
+ }
+ to{
+ box-shadow: 1px 1px 75px white;
+ }
+}
\ No newline at end of file