diff --git a/init.js b/init.js
new file mode 100644
index 0000000..9cad0ff
--- /dev/null
+++ b/init.js
@@ -0,0 +1,10 @@
+//create toruf dir
+//create the components dir
+//create the objects dir
+//create the templates dir
+//if there is a site directory
+  //build asset dirs
+  //if the site directory contains html files
+    //reversebuildAll
+//else build the site directory
+  //build asset dirs
\ No newline at end of file
diff --git a/lib/attributeList.js b/lib/attributeList.js
new file mode 100644
index 0000000..7b59e1d
--- /dev/null
+++ b/lib/attributeList.js
@@ -0,0 +1,842 @@
+module.exports = {
+  "accept":{
+    "name":"accept",
+    "belongsTo":"<input>",
+    "description":"Specifies whether the content of an element is editable or not"
+  },
+  "accept-charset":{
+    "name":"accept-charset",
+    "belongsTo":"<form>",
+    "description":"Specifies that audio/video controls should be displayed (such as a play/pause button etc)"
+  },
+  "accesskey":{
+    "name":"accesskey",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the coordinates of the area"
+  },
+  "action":{
+    "name":"action",
+    "belongsTo":"<form>",
+    "description":"Specifies the URL of the resource to be used by the object"
+  },
+  "align":{
+    "name":"align",
+    "belongsTo":"Not supported in HTML 5.",
+    "description":"Used to store custom data private to the page or application"
+  },
+  "alt":{
+    "name":"alt",
+    "belongsTo":"<area>, <img>, <input>",
+    "description":"Specifies the date and time"
+  },
+  "async":{
+    "name":"async",
+    "belongsTo":"<script>",
+    "description":"Specifies that the track is to be enabled if the user's preferences do not indicate that another track would be more appropriate"
+  },
+  "autocomplete":{
+    "name":"autocomplete",
+    "belongsTo":"<form>, <input>",
+    "description":"Specifies that the script is executed when the page has finished parsing (only for external scripts)"
+  },
+  "autofocus":{
+    "name":"autofocus",
+    "belongsTo":"<button>, <input>, <select>, <textarea>",
+    "description":"Specifies the text direction for the content in an element"
+  },
+  "autoplay":{
+    "name":"autoplay",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies that the text direction will be submitted"
+  },
+  "bgcolor":{
+    "name":"bgcolor",
+    "belongsTo":"Not supported in HTML 5.",
+    "description":"Specifies that the specified element/group of elements should be disabled"
+  },
+  "border":{
+    "name":"border",
+    "belongsTo":"Not supported in HTML 5.",
+    "description":"Specifies that the target will be downloaded when a user clicks on the hyperlink"
+  },
+  "charset":{
+    "name":"charset",
+    "belongsTo":"<meta>, <script>",
+    "description":"Specifies whether an element is draggable or not"
+  },
+  "checked":{
+    "name":"checked",
+    "belongsTo":"<input>",
+    "description":"Specifies whether the dragged data is copied, moved, or linked, when dropped"
+  },
+  "cite":{
+    "name":"cite",
+    "belongsTo":"<blockquote>, <del>, <ins>, <q>",
+    "description":"Specifies how the form-data should be encoded when submitting it to the server (only for method="post")"
+  },
+  "class":{
+    "name":"class",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies which form element(s) a label/calculation is bound to"
+  },
+  "color":{
+    "name":"color",
+    "belongsTo":"Not supported in HTML 5.",
+    "description":"Specifies the name of the form the element belongs to"
+  },
+  "cols":{
+    "name":"cols",
+    "belongsTo":"<textarea>",
+    "description":"Specifies where to send the form-data when a form is submitted. Only for type="submit""
+  },
+  "colspan":{
+    "name":"colspan",
+    "belongsTo":"<td>, <th>",
+    "description":"Specifies one or more headers cells a cell is related to"
+  },
+  "content":{
+    "name":"content",
+    "belongsTo":"<meta>",
+    "description":"Specifies the height of the element"
+  },
+  "contenteditable":{
+    "name":"contenteditable",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies that an element is not yet, or is no longer, relevant"
+  },
+  "controls":{
+    "name":"controls",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the range that is considered to be a high value"
+  },
+  "coords":{
+    "name":"coords",
+    "belongsTo":"<area>",
+    "description":"Specifies the URL of the page the link goes to"
+  },
+  "data":{
+    "name":"data",
+    "belongsTo":"<object>",
+    "description":"Specifies the language of the linked document"
+  },
+  "data-*":{
+    "name":"data-*",
+    "belongsTo":"Global Attributes",
+    "description":"Provides an HTTP header for the information/value of the content attribute"
+  },
+  "datetime":{
+    "name":"datetime",
+    "belongsTo":"<del>, <ins>, <time>",
+    "description":"Specifies a unique id for an element"
+  },
+  "default":{
+    "name":"default",
+    "belongsTo":"<track>",
+    "description":"Specifies an image as a server-side image-map"
+  },
+  "defer":{
+    "name":"defer",
+    "belongsTo":"<script>",
+    "description":"Specifies the kind of text track"
+  },
+  "dir":{
+    "name":"dir",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the title of the text track"
+  },
+  "dirname":{
+    "name":"dirname",
+    "belongsTo":"<input>, <textarea>",
+    "description":"Specifies the language of the element's content"
+  },
+  "disabled":{
+    "name":"disabled",
+    "belongsTo":"<button>, <fieldset>, <input>, <optgroup>, <option>, <select>, <textarea>",
+    "description":"Refers to a <datalist> element that contains pre-defined options for an <input> element"
+  },
+  "download":{
+    "name":"download",
+    "belongsTo":"<a>, <area>",
+    "description":"Specifies that the audio/video will start over again, every time it is finished"
+  },
+  "draggable":{
+    "name":"draggable",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the range that is considered to be a low value"
+  },
+  "dropzone":{
+    "name":"dropzone",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the maximum value"
+  },
+  "enctype":{
+    "name":"enctype",
+    "belongsTo":"<form>",
+    "description":"Specifies the maximum number of characters allowed in an element"
+  },
+  "for":{
+    "name":"for",
+    "belongsTo":"<label>, <output>",
+    "description":"Specifies what media/device the linked document is optimized for"
+  },
+  "form":{
+    "name":"form",
+    "belongsTo":"<button>, <fieldset>, <input>, <label>, <meter>, <object>, <output>, <select>, <textarea>",
+    "description":"Specifies the HTTP method to use when sending form-data"
+  },
+  "formaction":{
+    "name":"formaction",
+    "belongsTo":"<button>, <input>",
+    "description":"Specifies a minimum value"
+  },
+  "headers":{
+    "name":"headers",
+    "belongsTo":"<td>, <th>",
+    "description":"Specifies that a user can enter more than one value"
+  },
+  "height":{
+    "name":"height",
+    "belongsTo":"<canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video>",
+    "description":"Specifies that the audio output of the video should be muted"
+  },
+  "hidden":{
+    "name":"hidden",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the name of the element"
+  },
+  "high":{
+    "name":"high",
+    "belongsTo":"<meter>",
+    "description":"Specifies that the form should not be validated when submitted"
+  },
+  "href":{
+    "name":"href",
+    "belongsTo":"<a>, <area>, <base>, <link>",
+    "description":"Script to be run on abort"
+  },
+  "hreflang":{
+    "name":"hreflang",
+    "belongsTo":"<a>, <area>, <link>",
+    "description":"Script to be run after the document is printed"
+  },
+  "http-equiv":{
+    "name":"http-equiv",
+    "belongsTo":"<meta>",
+    "description":"Script to be run before the document is printed"
+  },
+  "id":{
+    "name":"id",
+    "belongsTo":"Global Attributes",
+    "description":"Script to be run when the document is about to be unloaded"
+  },
+  "ismap":{
+    "name":"ismap",
+    "belongsTo":"<img>",
+    "description":"Script to be run when the element loses focus"
+  },
+  "kind":{
+    "name":"kind",
+    "belongsTo":"<track>",
+    "description":"Script to be run when a file is ready to start playing (when it has buffered enough to begin)"
+  },
+  "label":{
+    "name":"label",
+    "belongsTo":"<track>, <option>, <optgroup>",
+    "description":"Script to be run when a file can be played all the way to the end without pausing for buffering"
+  },
+  "lang":{
+    "name":"lang",
+    "belongsTo":"Global Attributes",
+    "description":"Script to be run when the value of the element is changed"
+  },
+  "list":{
+    "name":"list",
+    "belongsTo":"<input>",
+    "description":"Script to be run when the element is being clicked"
+  },
+  "loop":{
+    "name":"loop",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when a context menu is triggered"
+  },
+  "low":{
+    "name":"low",
+    "belongsTo":"<meter>",
+    "description":"Script to be run when the content of the element is being copied"
+  },
+  "max":{
+    "name":"max",
+    "belongsTo":"<input>, <meter>, <progress>",
+    "description":"Script to be run when the cue changes in a <track> element"
+  },
+  "maxlength":{
+    "name":"maxlength",
+    "belongsTo":"<input>, <textarea>",
+    "description":"Script to be run when the content of the element is being cut"
+  },
+  "media":{
+    "name":"media",
+    "belongsTo":"<a>, <area>, <link>, <source>, <style>",
+    "description":"Script to be run when the element is being double-clicked"
+  },
+  "method":{
+    "name":"method",
+    "belongsTo":"<form>",
+    "description":"Script to be run when the element is being dragged"
+  },
+  "min":{
+    "name":"min",
+    "belongsTo":"<input>, <meter>",
+    "description":"Script to be run at the end of a drag operation"
+  },
+  "multiple":{
+    "name":"multiple",
+    "belongsTo":"<input>, <select>",
+    "description":"Script to be run when an element has been dragged to a valid drop target"
+  },
+  "muted":{
+    "name":"muted",
+    "belongsTo":"<video>, <audio>",
+    "description":"Script to be run when an element leaves a valid drop target"
+  },
+  "name":{
+    "name":"name",
+    "belongsTo":"<button>, <fieldset>, <form>, <iframe>, <input>, <map>, <meta>, <object>, <output>, <param>, <select>, <textarea>",
+    "description":"Script to be run when an element is being dragged over a valid drop target"
+  },
+  "novalidate":{
+    "name":"novalidate",
+    "belongsTo":"<form>",
+    "description":"Script to be run at the start of a drag operation"
+  },
+  "onabort":{
+    "name":"onabort",
+    "belongsTo":"<audio>, <embed>, <img>, <object>, <video>",
+    "description":"Script to be run when dragged element is being dropped"
+  },
+  "onafterprint":{
+    "name":"onafterprint",
+    "belongsTo":"<body>",
+    "description":"Script to be run when the length of the media changes"
+  },
+  "onbeforeprint":{
+    "name":"onbeforeprint",
+    "belongsTo":"<body>",
+    "description":"Script to be run when something bad happens and the file is suddenly unavailable (like unexpectedly disconnects)"
+  },
+  "onbeforeunload":{
+    "name":"onbeforeunload",
+    "belongsTo":"<body>",
+    "description":"Script to be run when the media has reach the end (a useful event for messages like "thanks for listening")"
+  },
+  "onblur":{
+    "name":"onblur",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when an error occurs"
+  },
+  "oncanplay":{
+    "name":"oncanplay",
+    "belongsTo":"<audio>, <embed>, <object>, <video>",
+    "description":"Script to be run when the element gets focus"
+  },
+  "oncanplaythrough":{
+    "name":"oncanplaythrough",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when there has been changes to the anchor part of the a URL"
+  },
+  "onchange":{
+    "name":"onchange",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the element gets user input"
+  },
+  "onclick":{
+    "name":"onclick",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the element is invalid"
+  },
+  "oncontextmenu":{
+    "name":"oncontextmenu",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a user is pressing a key"
+  },
+  "oncopy":{
+    "name":"oncopy",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a user presses a key"
+  },
+  "oncuechange":{
+    "name":"oncuechange",
+    "belongsTo":"<track>",
+    "description":"Script to be run when a user releases a key"
+  },
+  "oncut":{
+    "name":"oncut",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the element is finished loading"
+  },
+  "ondblclick":{
+    "name":"ondblclick",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when media data is loaded"
+  },
+  "ondrag":{
+    "name":"ondrag",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when meta data (like dimensions and duration) are loaded"
+  },
+  "ondragend":{
+    "name":"ondragend",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run just as the file begins to load before anything is actually loaded"
+  },
+  "ondragenter":{
+    "name":"ondragenter",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a mouse button is pressed down on an element"
+  },
+  "ondragleave":{
+    "name":"ondragleave",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run as long as the mouse pointer is moving over an element"
+  },
+  "ondragover":{
+    "name":"ondragover",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a mouse pointer moves out of an element"
+  },
+  "ondragstart":{
+    "name":"ondragstart",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a mouse pointer moves over an element"
+  },
+  "ondrop":{
+    "name":"ondrop",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a mouse button is released over an element"
+  },
+  "ondurationchange":{
+    "name":"ondurationchange",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when a mouse wheel is being scrolled over an element"
+  },
+  "onemptied":{
+    "name":"onemptied",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when the browser starts to work offline"
+  },
+  "onended":{
+    "name":"onended",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when the browser starts to work online"
+  },
+  "onerror":{
+    "name":"onerror",
+    "belongsTo":"<audio>, <body>, <embed>, <img>, <object>, <script>, <style>, <video>",
+    "description":"Script to be run when a user navigates away from a page"
+  },
+  "onfocus":{
+    "name":"onfocus",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a user navigates to a page"
+  },
+  "onhashchange":{
+    "name":"onhashchange",
+    "belongsTo":"<body>",
+    "description":"Script to be run when the user pastes some content in an element"
+  },
+  "oninput":{
+    "name":"oninput",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the media is paused either by the user or programmatically"
+  },
+  "oninvalid":{
+    "name":"oninvalid",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the media has started playing"
+  },
+  "onkeydown":{
+    "name":"onkeydown",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the media has started playing"
+  },
+  "onkeypress":{
+    "name":"onkeypress",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the window's history changes."
+  },
+  "onkeyup":{
+    "name":"onkeyup",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the browser is in the process of getting the media data"
+  },
+  "onload":{
+    "name":"onload",
+    "belongsTo":"<body>, <iframe>, <img>, <input>, <link>, <script>, <style>",
+    "description":"Script to be run each time the playback rate changes (like when a user switches to a slow motion or fast forward mode)."
+  },
+  "onloadeddata":{
+    "name":"onloadeddata",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when a reset button in a form is clicked."
+  },
+  "onloadedmetadata":{
+    "name":"onloadedmetadata",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when the browser window is being resized."
+  },
+  "onloadstart":{
+    "name":"onloadstart",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when an element's scrollbar is being scrolled"
+  },
+  "onmousedown":{
+    "name":"onmousedown",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the user writes something in a search field (for <input='search'>)"
+  },
+  "onmousemove":{
+    "name":"onmousemove",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the seeking attribute is set to false indicating that seeking has ended"
+  },
+  "onmouseout":{
+    "name":"onmouseout",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the seeking attribute is set to true indicating that seeking is active"
+  },
+  "onmouseover":{
+    "name":"onmouseover",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the element gets selected"
+  },
+  "onmouseup":{
+    "name":"onmouseup",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when the browser is unable to fetch the media data for whatever reason"
+  },
+  "onmousewheel":{
+    "name":"onmousewheel",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a Web Storage area is updated"
+  },
+  "onoffline":{
+    "name":"onoffline",
+    "belongsTo":"<body>",
+    "description":"Script to be run when a form is submitted"
+  },
+  "ononline":{
+    "name":"ononline",
+    "belongsTo":"<body>",
+    "description":"Script to be run when fetching the media data is stopped before it is completely loaded for whatever reason"
+  },
+  "onpagehide":{
+    "name":"onpagehide",
+    "belongsTo":"<body>",
+    "description":"Script to be run when the playing position has changed (like when the user fast forwards to a different point in the media)"
+  },
+  "onpageshow":{
+    "name":"onpageshow",
+    "belongsTo":"<body>",
+    "description":"Script to be run when the user opens or closes the <details> element"
+  },
+  "onpaste":{
+    "name":"onpaste",
+    "belongsTo":"All visible elements.",
+    "description":"Script to be run when a page has unloaded (or the browser window has been closed)"
+  },
+  "onpause":{
+    "name":"onpause",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run each time the volume of a video/audio has been changed"
+  },
+  "onplay":{
+    "name":"onplay",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when the media has paused but is expected to resume (like when the media pauses to buffer more data)"
+  },
+  "onplaying":{
+    "name":"onplaying",
+    "belongsTo":"<audio>, <video>",
+    "description":"Script to be run when the mouse wheel rolls up or down over an element"
+  },
+  "onpopstate":{
+    "name":"onpopstate",
+    "belongsTo":"<body>",
+    "description":"Specifies that the details should be visible (open) to the user"
+  },
+  "onprogress":{
+    "name":"onprogress",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies what value is the optimal value for the gauge"
+  },
+  "onratechange":{
+    "name":"onratechange",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies a regular expression that an <input> element's value is checked against"
+  },
+  "onreset":{
+    "name":"onreset",
+    "belongsTo":"<form>",
+    "description":"Specifies a short hint that describes the expected value of the element"
+  },
+  "onresize":{
+    "name":"onresize",
+    "belongsTo":"<body>",
+    "description":"Specifies an image to be shown while the video is downloading, or until the user hits the play button"
+  },
+  "onscroll":{
+    "name":"onscroll",
+    "belongsTo":"All visible elements.",
+    "description":"Specifies if and how the author thinks the audio/video should be loaded when the page loads"
+  },
+  "onsearch":{
+    "name":"onsearch",
+    "belongsTo":"<input>",
+    "description":"Specifies that the element is read-only"
+  },
+  "onseeked":{
+    "name":"onseeked",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the relationship between the current document and the linked document"
+  },
+  "onseeking":{
+    "name":"onseeking",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies that the element must be filled out before submitting the form"
+  },
+  "onselect":{
+    "name":"onselect",
+    "belongsTo":"All visible elements.",
+    "description":"Specifies that the list order should be descending (9,8,7...)"
+  },
+  "onstalled":{
+    "name":"onstalled",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the visible number of lines in a text area"
+  },
+  "onstorage":{
+    "name":"onstorage",
+    "belongsTo":"<body>",
+    "description":"Specifies the number of rows a table cell should span"
+  },
+  "onsubmit":{
+    "name":"onsubmit",
+    "belongsTo":"<form>",
+    "description":"Enables an extra set of restrictions for the content in an <iframe>"
+  },
+  "onsuspend":{
+    "name":"onsuspend",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies whether a header cell is a header for a column, row, or group of columns or rows"
+  },
+  "ontimeupdate":{
+    "name":"ontimeupdate",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies that an option should be pre-selected when the page loads"
+  },
+  "ontoggle":{
+    "name":"ontoggle",
+    "belongsTo":"<details>",
+    "description":"Specifies the shape of the area"
+  },
+  "onunload":{
+    "name":"onunload",
+    "belongsTo":"<body>",
+    "description":"Specifies the width, in characters (for <input>) or specifies the number of visible options (for <select>)"
+  },
+  "onvolumechange":{
+    "name":"onvolumechange",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the size of the linked resource"
+  },
+  "onwaiting":{
+    "name":"onwaiting",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the number of columns to span"
+  },
+  "onwheel":{
+    "name":"onwheel",
+    "belongsTo":"All visible elements.",
+    "description":"Specifies whether the element is to have its spelling and grammar checked or not"
+  },
+  "open":{
+    "name":"open",
+    "belongsTo":"<details>",
+    "description":"Specifies the URL of the media file"
+  },
+  "optimum":{
+    "name":"optimum",
+    "belongsTo":"<meter>",
+    "description":"Specifies the HTML content of the page to show in the <iframe>"
+  },
+  "pattern":{
+    "name":"pattern",
+    "belongsTo":"<input>",
+    "description":"Specifies the language of the track text data (required if kind='subtitles')"
+  },
+  "placeholder":{
+    "name":"placeholder",
+    "belongsTo":"<input>, <textarea>",
+    "description":"Specifies the URL of the image to use in different situations"
+  },
+  "poster":{
+    "name":"poster",
+    "belongsTo":"<video>",
+    "description":"Specifies the start value of an ordered list"
+  },
+  "preload":{
+    "name":"preload",
+    "belongsTo":"<audio>, <video>",
+    "description":"Specifies the legal number intervals for an input field"
+  },
+  "readonly":{
+    "name":"readonly",
+    "belongsTo":"<input>, <textarea>",
+    "description":"Specifies an inline CSS style for an element"
+  },
+  "rel":{
+    "name":"rel",
+    "belongsTo":"<a>, <area>, <link>",
+    "description":"Specifies the tabbing order of an element"
+  },
+  "required":{
+    "name":"required",
+    "belongsTo":"<input>, <select>, <textarea>",
+    "description":"Specifies the target for where to open the linked document or where to submit the form"
+  },
+  "reversed":{
+    "name":"reversed",
+    "belongsTo":"<ol>",
+    "description":"Specifies extra information about an element"
+  },
+  "rows":{
+    "name":"rows",
+    "belongsTo":"<textarea>",
+    "description":"Specifies whether the content of an element should be translated or not"
+  },
+  "rowspan":{
+    "name":"rowspan",
+    "belongsTo":"<td>, <th>",
+    "description":"Specifies the type of element"
+  },
+  "sandbox":{
+    "name":"sandbox",
+    "belongsTo":"<iframe>",
+    "description":"Specifies an image as a client-side image-map"
+  },
+  "scope":{
+    "name":"scope",
+    "belongsTo":"<th>",
+    "description":"Specifies the value of the element"
+  },
+  "selected":{
+    "name":"selected",
+    "belongsTo":"<option>",
+    "description":"Specifies the width of the element"
+  },
+  "shape":{
+    "name":"shape",
+    "belongsTo":"<area>",
+    "description":"Specifies how the text in a text area is to be wrapped when submitted in a form"
+  },
+  "size":{
+    "name":"size",
+    "belongsTo":"<input>, <select>",
+    "description":"Specifies the width, in characters (for <input>) or specifies the number of visible options (for <select>)"
+  },
+  "sizes":{
+    "name":"sizes",
+    "belongsTo":"<img>, <link>, <source>",
+    "description":"Specifies the size of the linked resource"
+  },
+  "span":{
+    "name":"span",
+    "belongsTo":"<col>, <colgroup>",
+    "description":"Specifies the number of columns to span"
+  },
+  "spellcheck":{
+    "name":"spellcheck",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies whether the element is to have its spelling and grammar checked or not"
+  },
+  "src":{
+    "name":"src",
+    "belongsTo":"<audio>, <embed>, <iframe>, <img>, <input>, <script>, <source>, <track>, <video>",
+    "description":"Specifies the URL of the media file"
+  },
+  "srcdoc":{
+    "name":"srcdoc",
+    "belongsTo":"<iframe>",
+    "description":"Specifies the HTML content of the page to show in the <iframe>"
+  },
+  "srclang":{
+    "name":"srclang",
+    "belongsTo":"<track>",
+    "description":"Specifies the language of the track text data (required if kind='subtitles')"
+  },
+  "srcset":{
+    "name":"srcset",
+    "belongsTo":"<img>, <source>",
+    "description":"Specifies the URL of the image to use in different situations"
+  },
+  "start":{
+    "name":"start",
+    "belongsTo":"<ol>",
+    "description":"Specifies the start value of an ordered list"
+  },
+  "step":{
+    "name":"step",
+    "belongsTo":"<input>",
+    "description":"Specifies the legal number intervals for an input field"
+  },
+  "style":{
+    "name":"style",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies an inline CSS style for an element"
+  },
+  "tabindex":{
+    "name":"tabindex",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies the tabbing order of an element"
+  },
+  "target":{
+    "name":"target",
+    "belongsTo":"<a>, <area>, <base>, <form>",
+    "description":"Specifies the target for where to open the linked document or where to submit the form"
+  },
+  "title":{
+    "name":"title",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies extra information about an element"
+  },
+  "translate":{
+    "name":"translate",
+    "belongsTo":"Global Attributes",
+    "description":"Specifies whether the content of an element should be translated or not"
+  },
+  "type":{
+    "name":"type",
+    "belongsTo":"<a>, <button>, <embed>, <input>, <link>, <menu>, <object>, <script>, <source>, <style>",
+    "description":"Specifies the type of element"
+  },
+  "usemap":{
+    "name":"usemap",
+    "belongsTo":"<img>, <object>",
+    "description":"Specifies an image as a client-side image-map"
+  },
+  "value":{
+    "name":"value",
+    "belongsTo":"<button>, <input>, <li>, <option>, <meter>, <progress>, <param>",
+    "description":"Specifies the value of the element"
+  },
+  "width":{
+    "name":"width",
+    "belongsTo":"<canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video>",
+    "description":"Specifies the width of the element"
+  },
+  "wrap":{
+    "name":"wrap",
+    "belongsTo":"<textarea>",
+    "description":"Specifies how the text in a text area is to be wrapped when submitted in a form"
+  }
+}
\ No newline at end of file
diff --git a/lib/build.js b/lib/build.js
new file mode 100644
index 0000000..ef7a670
--- /dev/null
+++ b/lib/build.js
@@ -0,0 +1,180 @@
+var fs = require('fs')
+var attributeList = require('./attributeList')
+//function  templateMethod()
+
+module.exports = function buildOuput(filename){
+  //read template
+  if(filename.includes(".html")){
+    fs.readFile(`./toruf/templates/${filename}`, 'utf8', function(err, fileContent){
+      if(err) throw new Error(err)
+      else{
+        //replace components
+        replaceComponents(fileContent, {}, function(err,data){
+          if(err) throw new Error(err)
+          else{
+            //replace objects
+            replaceObjects(fileContent, function(err,data){
+              if(err) throw new Error(err)
+              else{
+                //if template method exists
+                //execute template method
+                fs.writeFileSync(`site/${filename}`, newFile)
+                console.log('success');
+                return 'success';
+              }
+            })
+          }
+        })
+      }
+    })
+  }
+}
+
+function recourseComponents(parentsArr, parent, component, callback){
+    var compArray = [];
+    fs.readdirSync('./toruf/components').forEach(function(filename){
+      if(filename.includes(".html")){
+        let name = filename.split('.html')[0];
+        compArray.push(name);
+      }
+    });
+    for(let comp of compArray){
+      let tag = '#'+comp.toUpperCase();
+      let start_tag = 
+      `<!-- ${tag} -->
+      `;
+      let end_tag = 
+      `
+      <!-- !${tag} -->`;
+      if(component.includes(`<${tag}>`)){
+        if(parentsArr.includes(comp)){
+          throw new Error('warning: you cannot have a child component that calls its parent.')
+        }
+        else {
+          let newComp = fs.readFileSync(`./toruf/components/${comp}.html`)
+          let htmlComp = '<'+start_tag+'>' + newComp + '<'+end_tag+'>'; 
+          let newParent = component.replace(tag, htmlComp)
+          let newParentsArr = parentsArr.append(comp)
+          recourseComponents(newParentsArr, newParent, newComp, callback)
+        }
+      }
+      else if(parent.includes(tag)){
+        if(parentsArr.includes(tag)){
+          throw new Error('warning: you cannot have a child component that calls its parent.')
+        }
+        else {
+          let newComp = fs.readFileSync(`./toruf/components/${comp}.html`)
+          let htmlComp = '<'+start_tag+'>' + newComp + '<'+end_tag+'>'; 
+          let newParent = parent.replace(tag, htmlComp)
+          recourseComponents(parentsArr, newParent, newComp, callback)
+        }
+      }
+      else {
+        callback(null, parent)
+      }
+    }
+}
+
+
+
+function replaceComponents(template, parents, callback) { 
+  if(template.includes('<#')){
+    var compArray = [];
+    fs.readdirSync('./toruf/components').forEach(function(filename){
+      if(filename.includes(".html")){
+        let name = filename.split('.html')[0];
+        compArray.push(name);
+      }
+    });
+    for(let i=0; i<compArray.length; i++){
+      if(!compArray[i]){
+        callback(null, template)
+      }
+      else{
+        let tag = '#'+comp.toUpperCase();
+        if(template.includes(tag)){
+          recourseComponents([], template, parents, function(err, data){
+            if(err) throw new Error(err)
+            else{
+              //replace component
+              template.replace(tag, data)
+            }
+          })
+        } 
+      }
+    }
+  } 
+}
+
+
+function replaceObjects(template, callback){
+  //create an array of objects
+  var objArray = [];
+  fs.readdirSync('./toruf/objects').forEach(function(filename){
+    if(filename.includes(".json")){
+      let name = filename.split('.json')[0];
+      objArray.push(name);
+    }
+  });
+  for(let obj of objArray){
+    let tag = obj.toUpperCase();
+    if(template.includes(`<${tag}>`)){
+      let start_tag = 
+      `<!-- <${tag}> -->
+      `;
+      let end_tag = 
+      `
+      <!-- </${tag}> -->`;
+      let objTemplate = template.split(`<${tag}>`)[1].split(`</${tag}>`)[0];
+      let htmlObj = "";
+      if(objTemplate.includes('{{') && objTemplate.includes('}}')){
+      let rawdata = fs.readFileSync(`./toruf/objects/${obj}.json`);
+      let db = JSON.parse(rawdata)
+      Object.keys(db).map(function(key, index){
+        let item = db[key]
+        let temp = objTemplate;
+        //insert ID in parent div toruf-OBJ-ID
+        Object.keys(item).map(function(key, index){
+          let temparr = temp.split(`{{${key}}}`)
+          //check if its an html attribute value
+          let beginAttr = temparr[0].substr(0, temparr[0].lastIndexOf('"'));
+          let endAttr = temparr[1].split('"')[1];
+          if(endAttr.startsWith(' ') && beginAttr.endsWith('=') || endAttr.startsWith('>') && beginAttr.endsWith('=')){    
+            //check for tag in attribute list
+            let tag = beginAttr.substr(beginAttr.lastIndexOf(' '), beginAttr.length)
+            console.log(tag)
+            if(attributeList[tag]){
+              //check if element already has a class item
+              let lastElem = temparr[0].split('<')[temparr[0].split('<').length - 1]
+              if(lastElem.includes('class=')){
+                let tempClassArr = temparr[0].split('class="')
+                let tempClass = tempClassArr[tempClassArr.length - 1]
+                temp = temp.replace(tempClass+`{{${key}}}`, `toruf${tag}_${key} `+ tempClass+item[key]);
+              }
+              else{
+                let newClass = `class="toruf${tag}_${key} href="${item[key]}`
+                temp = temp.replace(`href="{{${key}}}`, newClass);
+                newTempArr = temparr[0].split()
+              }
+            }
+            else {
+              throw new Error(`warning invalid html attribute ${tag}`);
+            }
+          }
+          else {
+            let newVal = `<span class="torufattr_${key}">${item[key]}</span>`
+            temp = temp.replace(`{{${key}}}`, newVal);
+          }
+        })
+        let initTemp = temp.split('>')[0]
+        temp = temp.replace(initTemp+'>', initTemp+` id="torufobj_${key}">`)
+        htmlObj+= temp;
+      });
+      let oldObj = `<${tag}>`+objTemplate+`</${tag}>`;
+      newHtmlObj = start_tag + htmlObj + end_tag; 
+      let newFile = template.replace(oldObj, newHtmlObj);
+      callback(newFile)
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/lib/buildAll.js b/lib/buildAll.js
new file mode 100644
index 0000000..0b22f8e
--- /dev/null
+++ b/lib/buildAll.js
@@ -0,0 +1,25 @@
+var fs = require('fs')
+var build = require('./build')
+
+module.exports = function buildAllOutput(){
+  var objArray = [];
+  var compArray = [];
+  //create an array of objects
+  fs.readdirSync('objects').forEach(function(filename){
+    if(filename.includes(".json")){
+      let name = filename.split('.json')[0];
+      objArray.push(name);
+    }
+  });
+  //create an array of components
+  fs.readdirSync('components').forEach(function(filename){
+    if(filename.includes(".html")){
+      let name = filename.split('.html')[0];
+      compArray.push(name);
+    }
+  });
+  //read all templates
+  fs.readdirSync('templates').forEach(function(filename){
+    build(filename);
+  });
+}
\ No newline at end of file
diff --git a/lib/copyDirs.js b/lib/copyDirs.js
new file mode 100644
index 0000000..e69de29
diff --git a/lib/reverseBuild.js b/lib/reverseBuild.js
new file mode 100644
index 0000000..1c57ae3
--- /dev/null
+++ b/lib/reverseBuild.js
@@ -0,0 +1,117 @@
+var fs = require('fs')
+
+module.exports = function buildTemplate(filename){
+  var objArray = [];
+  var compArray = [];
+  //create an array of objects
+  fs.readdirSync('./toruf/objects').forEach(function(filename){
+    if(filename.includes(".json")){
+      let name = filename.split('.json')[0];
+      objArray.push(name);
+    }
+  });
+  //create an array of components
+  fs.readdirSync('./toruf/components').forEach(function(filename){
+    if(filename.includes(".html")){
+      let name = filename.split('.html')[0];
+      compArray.push(name);
+    }
+  });
+  //read template
+  if(filename.includes(".html")){
+    fs.readFile(`./site/${filename}`, 'utf8', function(err, originFile){
+      if(err) throw new Error(err)
+      else{
+        if(originFile.includes('<!-- <')){
+          //for each model
+          for(let inst of objArray){
+            let start_tag = `<!-- <${inst.toUpperCase()}> -->`;
+            let end_tag = `<!-- </${inst.toUpperCase()}> -->`;
+            if(originFile.includes(start_tag)){
+              let object = originFile.split(start_tag)[1].split(end_tag)[0];
+              let rePiece = start_tag + object + end_tag;
+              let rawdata = fs.readFileSync(`objects/${inst}.json`);
+              let db = JSON.parse(rawdata)
+              if(object.includes('id="torufobj_')){
+                let objArr = originFile.split('id="torufobj_')
+                //update all objects
+                for(let i=1; i<objArr.length; i++){
+                  let objId = objArr[i].split('"')[0];
+                  let innerObj = {}
+                  let subFrag = objArr[i]
+                  if(subFrag.includes('torufattr_')){
+                    let attrArr = subFrag.split('torufattr_');
+                    for(let j=1; j<attrArr.length; j++){
+                      let attrId = attrArr[j].split('"')[0];
+                      let attrVal = attrArr[j].split('>')[1].split('<')[0];
+                      innerObj[attrId] = attrVal;
+                    }
+                  }
+                  if(subFrag.includes('torufhref_')){
+                    let attrArr = subFrag.split('torufhref_');
+                    for(let j=1; j<attrArr.length; j++){
+                      let attrId = attrArr[j].split(' ')[0];
+                      let attrVal = attrArr[j].split('href="')[1].split('"')[0];
+                      innerObj[attrId] = attrVal;
+                    }
+                  }
+                  db[objId] = innerObj;
+                }
+              }
+              //writeFile
+              let dbString =  JSON.stringify(db)
+              dbString = dbString.replace(/,/g, ',\n').replace(/{/g, '{\n').replace(/}/g, '\n}')
+              fs.writeFileSync(`./toruf/objects/${inst}.json`, dbString, 'utf8')
+              //replace Object with object template
+              console.log(inst)
+              let frag1 = object.split('id="torufobj_')[0].split('<')[1]
+              let beginFrag = '<' +frag1+'id="torufobj_'
+              let endPosition = object.split('id="torufobj_')[1].lastIndexOf('<')
+              let endFrag = object.split('id="torufobj_')[1].substr(0, endPosition)    
+              let newPiece = beginFrag + endFrag
+              if(object.includes('id="torufobj_')){
+                let objId = newPiece.split('id="torufobj_')[1].split('"')[0];
+                newPiece = newPiece.replace(`id="torufobj_${objId}"`, "")
+              } 
+              if(newPiece.includes('torufattr_')){
+                let attrArr = newPiece.split('torufattr_');
+                for(let j=1; j<attrArr.length; j++){
+                  let attrId = attrArr[j].split('"')[0];
+                  let attrVal = attrArr[j].split('>')[1].split('<')[0];
+                  newPiece = newPiece.replace(`<span class="torufattr_${attrId}">${attrVal}</span>`, `{${attrId}}`)
+                }
+              }
+              if(newPiece.includes('torufhref_')){
+                let attrArr = newPiece.split('torufhref_');
+                for(let j=1; j<attrArr.length; j++){
+                  let attrId = attrArr[j].split(' ')[0];
+                  let attrVal = attrArr[j].split('href="')[1].split('"')[0];
+                  newPiece = newPiece.replace(attrVal, `{${attrId}}`);
+                }
+              }
+              let objstart_tag = `<${inst.toUpperCase()}>
+              `;
+              let objend_tag = `
+              </${inst.toUpperCase()}>`;
+              let objTemplate = objstart_tag + newPiece + objend_tag;
+              originFile = originFile.replace(rePiece, objTemplate)
+            }
+          }
+        } 
+        //replace components
+        for(let comp of compArray){
+          let tag = `<#${comp.toUpperCase()}>`
+          if(originFile.includes(`<!-- ${tag} -->`)){
+            let component = originFile.split(`<!-- ${tag} -->`)[1].split(`<!-- !${tag} -->`)[0];
+            //save component
+            fs.writeFileSync(`./toruf/components/${comp}.html`, component)
+            let piece = `<!-- ${tag} -->` + component + `<!-- !${tag} -->`;
+            originFile = originFile.replace(piece, tag);
+          }
+        }
+        //save file
+        fs.writeFileSync(`./toruf/templates/${filename}`, originFile, 'utf8')
+      }
+    })
+  }
+}
diff --git a/lib/reverseBuildAll.js b/lib/reverseBuildAll.js
new file mode 100644
index 0000000..6686e0a
--- /dev/null
+++ b/lib/reverseBuildAll.js
@@ -0,0 +1,25 @@
+var fs = require('fs')
+var reverseBuild = require('./reverseBuild')
+
+module.exports = function buildAllTemplates(){
+  var objArray = [];
+  var compArray = [];
+  //create an array of objects
+  fs.readdirSync('objects').forEach(function(filename){
+    if(filename.includes(".json")){
+      let name = filename.split('.json')[0];
+      objArray.push(name);
+    }
+  });
+  //create an array of components
+  fs.readdirSync('components').forEach(function(filename){
+    if(filename.includes(".html")){
+      let name = filename.split('.html')[0];
+      compArray.push(name);
+    }
+  });
+  //read all templates
+  fs.readdirSync('output').forEach(function(filename){
+    reverseBuild(filename);
+  });
+}
diff --git a/site/css/flip-card.css b/site/css/flip-card.css
new file mode 100644
index 0000000..251ba46
--- /dev/null
+++ b/site/css/flip-card.css
@@ -0,0 +1,43 @@
+/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
+.flip-card {
+  background-color: transparent;
+  height: 20rem;
+  perspective: 1000px; /* Remove this if you don't want the 3D effect */
+}
+
+/* This container is needed to position the front and back side */
+.flip-card-inner {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  transition: transform 0.8s;
+  transform-style: preserve-3d;
+}
+
+/* Do an horizontal flip when you move the mouse over the flip box container */
+.flip-card:hover .flip-card-inner {
+  transform: rotateY(180deg);
+}
+
+/* Position the front and back side */
+.flip-card-front, .flip-card-back {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  -webkit-backface-visibility: hidden; /* Safari */
+  backface-visibility: hidden;
+}
+
+/* Style the front side (fallback if image is missing) */
+.flip-card-front {
+  background-color: hsla(0, 0%, 90%, .4);
+  color: black;
+}
+
+/* Style the back side */
+.flip-card-back {
+  background-color: hsla(0, 0%, 80%, .5);
+  color: white;
+  transform: rotateY(180deg);
+}
\ No newline at end of file
diff --git a/site/css/index.css b/site/css/index.css
new file mode 100644
index 0000000..7561e66
--- /dev/null
+++ b/site/css/index.css
@@ -0,0 +1,58 @@
+html,body {
+    width: 100%;
+    margin: 0px;
+    padding: 0px;
+    background-color: #160723;
+    background-image: linear-gradient(to top, hsla(265, 71%, 43%, .1), hsla(34, 100%, 61%, .2)); 
+}
+
+.bg-main {
+    background-color: #160723; 
+}
+
+.text-main {
+    color: #160723;
+}
+
+
+.padding-text
+{padding-top: 20% }
+
+section, header {
+    overflow-x: hidden;
+}
+
+header {
+    background: url('../img/header.png');
+    background-size: cover;
+    height: 20rem;
+}
+
+.bg-sun {
+    background-image: linear-gradient(to top, hsla(265, 71%, 43%, .1), hsla(34, 100%, 61%, .1)); 
+}
+
+.main-title {
+    padding-top: 7rem;
+    font-size: 3.5em;
+}
+
+.tool-logo {
+    max-height:12rem;
+    max-width:12rem;
+    padding-top: 2rem;
+    padding-bottom: 5%;
+}
+
+.tool-title{
+    padding-top: 1rem;
+    color: #efefef;
+}
+
+.tool-text {
+    color: #efefef;
+}
+
+.tool-element {
+    padding-bottom: 5%;
+}
\ No newline at end of file
diff --git a/site/img/.DS_Store b/site/img/.DS_Store
new file mode 100644
index 0000000..ce30983
Binary files /dev/null and b/site/img/.DS_Store differ
diff --git a/site/img/Inventory-logo.png b/site/img/Inventory-logo.png
new file mode 100644
index 0000000..375bfff
Binary files /dev/null and b/site/img/Inventory-logo.png differ
diff --git a/site/img/RMS-logo.png b/site/img/RMS-logo.png
new file mode 100644
index 0000000..4659896
Binary files /dev/null and b/site/img/RMS-logo.png differ
diff --git a/site/img/accounting-logo.png b/site/img/accounting-logo.png
new file mode 100644
index 0000000..f57ccef
Binary files /dev/null and b/site/img/accounting-logo.png differ
diff --git a/site/img/arjan-logo.svg b/site/img/arjan-logo.svg
new file mode 100644
index 0000000..d0db914
--- /dev/null
+++ b/site/img/arjan-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160.68 137.7"><defs><style>.cls-1{fill:#c69c6d;}.cls-2,.cls-3{fill:#fff;}.cls-3{stroke:#020000;stroke-miterlimit:10;stroke-width:2px;}.cls-4{fill:#e0b892;}.cls-5{fill:#070000;}</style></defs><title>arjan-logo_3</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M80.82,132.47c17.47,0,33.06,7.45,46.76-7.66,10.65-11.74,18.42-28.26,15.9-44.14-2.6-16.41-3.49-33.58.79-49.61.93-3.48,2.4-15.59,4.54-17.86,3.6-3.83,15.62.52,10.71-5.77-2.57-3.3-17-8-21.25-7.38-7.83,1.09-9,11.48-15.7,14-5.84,2.15-17.16-3.11-23.62-4.15-9.33-1.5-18.36-2.22-27.78-1.2-8.39.91-16.59,3.82-24.85,4.75-8.8,1-8.92-2.07-16.07-7.79C24.82,1.29,23,.89,16.93,2.65,14.81,3.27-.6,9.51,0,12.07s10.95-.52,13.5,2.62c1.55,1.9,4.29,15.83,5,18.84,3.82,16.57,1.16,33.51-.77,50.1-1.71,14.7,6.91,31,16.74,41.68C47.9,139.85,63.87,132.47,80.82,132.47Z"/><path class="cls-2" d="M118,115c2-15.11-11.34-22.41-18.86-33.73-9.76-14.69,2.93-24.9.52-40.07-1.28-8.1-6.43-14.9-8.11-22.87-.8-3.79.14-5.82-2.75-7.69-1.76-1.14-8.56-3.44-10.41-2-4,3-2,1-4.34,9.52a90.19,90.19,0,0,1-3.41,9.75c-3.21,8-6.32,14.88-4.4,23.61,1.41,6.4,5.7,12.33,4.94,19.17C70.35,77.81,64.5,83.93,60,89.16,49.59,101.38,45,107.61,49.45,124c2.62,9.71,3.17,13.39,13.88,12.91,8.07-.36,15.56-2.87,23.73-2.22,5.92.47,15.82,4.68,21.56,2.17C115.17,134,117.07,121.75,118,115Z"/><path class="cls-3" d="M37.4,57.15c9.18-8.61,17.68-6.43,23.48,4.61a1,1,0,0,1-.39,1.3c-7.2,3.85-16.24.06-22.93-4.17A1.11,1.11,0,0,1,37.4,57.15Z"/><path class="cls-4" d="M24.62,24.53c-1.4-6.4-7-17.86-.63-16.58a71.89,71.89,0,0,1,10.45,9.24.83.83,0,0,1-.13,1.18L25.95,25A.83.83,0,0,1,24.62,24.53Z"/><path class="cls-5" d="M89.8,99.63c-2.3-1.32-5.54-1.48-8.82-1.36h-.32c-3.28-.11-6.52,0-8.82,1.36-8.7,5-4.57,8.85,1.53,12.14,2.82,1.52,5.09,2.51,7.29,2.67H81c2.2-.16,4.47-1.14,7.29-2.67C94.37,108.48,98.49,104.6,89.8,99.63Z"/><path class="cls-4" d="M141.22,24.53c1.4-6.4,1.69-10.21.63-16.58a.83.83,0,0,0-1.4-.46,117.87,117.87,0,0,0-9.06,9.7.83.83,0,0,0,.13,1.18L139.89,25A.83.83,0,0,0,141.22,24.53Z"/><circle class="cls-5" cx="49.37" cy="57.95" r="5.69"/><path class="cls-3" d="M126.86,57.41C117.68,48.8,109.17,51,103.38,62a1,1,0,0,0,.39,1.3c7.2,3.85,16.24.06,22.93-4.17A1.11,1.11,0,0,0,126.86,57.41Z"/><circle class="cls-5" cx="114.74" cy="58.21" r="5.69"/></g></g></svg>
\ No newline at end of file
diff --git a/site/img/channel-logo.png b/site/img/channel-logo.png
new file mode 100644
index 0000000..6f031ca
Binary files /dev/null and b/site/img/channel-logo.png differ
diff --git a/site/img/crm-logo.png b/site/img/crm-logo.png
new file mode 100644
index 0000000..1b7de0b
Binary files /dev/null and b/site/img/crm-logo.png differ
diff --git a/site/img/cubera-logo.png b/site/img/cubera-logo.png
new file mode 100644
index 0000000..abe3833
Binary files /dev/null and b/site/img/cubera-logo.png differ
diff --git a/site/img/cubera-logo_1.svg b/site/img/cubera-logo_1.svg
new file mode 100644
index 0000000..c076d25
--- /dev/null
+++ b/site/img/cubera-logo_1.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 209 185"><defs><style>.cls-1{fill:none;}.cls-2{font-size:34.78px;font-family:MyriadPro-Regular, Myriad Pro;}.cls-3{letter-spacing:-0.01em;}.cls-4{letter-spacing:-0.01em;}.cls-5{letter-spacing:0em;}.cls-6{fill:url(#linear-gradient);}</style><linearGradient id="linear-gradient" x1="16.92" y1="90.55" x2="191.2" y2="90.55" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6120bc"/><stop offset="1" stop-color="#ffab5f"/></linearGradient></defs><title>cubera-logo_1</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><rect class="cls-1" width="209" height="185"/><text class="cls-2" transform="translate(15.67 102.71)"><tspan class="cls-3">C</tspan><tspan x="19.79" y="0">ool </tspan><tspan class="cls-4" x="73.56" y="0">C</tspan><tspan x="93.31" y="0">ube</tspan><tspan class="cls-5" x="149.69" y="0">r</tspan><tspan x="160.89" y="0">a</tspan></text><path class="cls-6" d="M34.69,101.94a15,15,0,0,1-6.19,1.11c-6.61,0-11.58-4.17-11.58-11.86,0-7.34,5-12.31,12.24-12.31a12.57,12.57,0,0,1,5.56,1L34,82.4a11,11,0,0,0-4.73-1c-5.49,0-9.15,3.51-9.15,9.67,0,5.74,3.3,9.42,9,9.42a12.11,12.11,0,0,0,4.94-1Z"/><path class="cls-6" d="M53.23,94.15c0,6.22-4.31,8.94-8.38,8.94-4.56,0-8.07-3.34-8.07-8.66,0-5.63,3.69-8.94,8.35-8.94C50,85.49,53.23,89,53.23,94.15Zm-13.35.17c0,3.69,2.12,6.47,5.11,6.47S50.1,98,50.1,94.26c0-2.85-1.43-6.47-5-6.47S39.88,91.13,39.88,94.33Z"/><path class="cls-6" d="M72.33,94.15c0,6.22-4.31,8.94-8.38,8.94-4.56,0-8.07-3.34-8.07-8.66,0-5.63,3.69-8.94,8.35-8.94C69.06,85.49,72.33,89,72.33,94.15ZM59,94.33c0,3.69,2.12,6.47,5.11,6.47S69.2,98,69.2,94.26c0-2.85-1.43-6.47-5-6.47S59,91.13,59,94.33Z"/><path class="cls-6" d="M76.19,78h3.06v24.69H76.19Z"/><path class="cls-6" d="M108.25,101.94a15,15,0,0,1-6.19,1.11c-6.61,0-11.58-4.17-11.58-11.86,0-7.34,5-12.31,12.24-12.31a12.57,12.57,0,0,1,5.56,1l-.73,2.47a11,11,0,0,0-4.73-1c-5.49,0-9.15,3.51-9.15,9.67,0,5.74,3.3,9.42,9,9.42a12.11,12.11,0,0,0,4.94-1Z"/><path class="cls-6" d="M125.61,98.12c0,1.74,0,3.27.14,4.59H123l-.17-2.75h-.07a6.33,6.33,0,0,1-5.56,3.13c-2.64,0-5.81-1.46-5.81-7.37V85.88h3.06V95.2c0,3.2,1,5.36,3.76,5.36a4.42,4.42,0,0,0,4-2.78,4.47,4.47,0,0,0,.28-1.56V85.88h3.06Z"/><path class="cls-6" d="M130.55,102.71c.07-1.15.14-2.85.14-4.35V78h3V88.59h.07a6.27,6.27,0,0,1,5.74-3.1c4.17,0,7.13,3.48,7.09,8.59,0,6-3.79,9-7.55,9a6,6,0,0,1-5.63-3.17h-.1l-.14,2.78ZM133.71,96a5.75,5.75,0,0,0,.14,1.11,4.72,4.72,0,0,0,4.59,3.58c3.2,0,5.11-2.61,5.11-6.47,0-3.37-1.74-6.26-5-6.26a4.88,4.88,0,0,0-4.66,3.76,6,6,0,0,0-.17,1.25Z"/><path class="cls-6" d="M152.18,94.85c.07,4.14,2.71,5.84,5.77,5.84a11.06,11.06,0,0,0,4.66-.87l.52,2.19a13.64,13.64,0,0,1-5.6,1c-5.18,0-8.28-3.41-8.28-8.49s3-9.08,7.89-9.08c5.5,0,7,4.83,7,7.93a11.69,11.69,0,0,1-.1,1.43Zm9-2.19c0-1.95-.8-5-4.24-5-3.09,0-4.45,2.85-4.69,5Z"/><path class="cls-6" d="M167.9,91.13c0-2,0-3.69-.14-5.25h2.68l.1,3.3h.14a5.05,5.05,0,0,1,4.66-3.69,3.32,3.32,0,0,1,.87.1v2.89a4.6,4.6,0,0,0-1-.1c-2.16,0-3.69,1.63-4.1,3.93a8.64,8.64,0,0,0-.14,1.43v9h-3Z"/><path class="cls-6" d="M188.42,102.71l-.24-2.12h-.1a6.27,6.27,0,0,1-5.15,2.5,4.8,4.8,0,0,1-5.15-4.83c0-4.07,3.62-6.29,10.12-6.26v-.35c0-1.39-.38-3.89-3.83-3.89A8.39,8.39,0,0,0,179.69,89l-.7-2a10.44,10.44,0,0,1,5.53-1.5c5.15,0,6.4,3.51,6.4,6.89v6.29a23.66,23.66,0,0,0,.28,4ZM188,94.12c-3.34-.07-7.13.52-7.13,3.79a2.71,2.71,0,0,0,2.89,2.92A4.19,4.19,0,0,0,187.8,98a3.19,3.19,0,0,0,.17-1Z"/></g></g></svg>
\ No newline at end of file
diff --git a/site/img/cubera-sq-logo.png b/site/img/cubera-sq-logo.png
new file mode 100644
index 0000000..b4949b3
Binary files /dev/null and b/site/img/cubera-sq-logo.png differ
diff --git a/site/img/cubera-sq-logo.svg b/site/img/cubera-sq-logo.svg
new file mode 100644
index 0000000..97be6b7
--- /dev/null
+++ b/site/img/cubera-sq-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 773.47 599"><defs><style>.cls-1{fill:#160723;}.cls-2{font-size:173px;font-family:MyriadPro-Regular, Myriad Pro;}.cls-3{letter-spacing:-0.01em;}.cls-4{letter-spacing:0em;}.cls-5{letter-spacing:-0.01em;}.cls-6{letter-spacing:0em;}.cls-7{fill:url(#linear-gradient);}</style><linearGradient id="linear-gradient" x1="134.07" y1="296.23" x2="635.07" y2="296.23" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6120bc"/><stop offset="1" stop-color="#ffab5f"/></linearGradient></defs><title>cuber-sq-logo</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><rect class="cls-1" width="773.47" height="599"/><text class="cls-2" transform="translate(203.79 252.89)"><tspan class="cls-3">C<tspan class="cls-4" x="98.44" y="0">ool </tspan></tspan><tspan class="cls-5" x="-75.95" y="207.6">C</tspan><tspan x="22.32" y="207.6">ube</tspan><tspan class="cls-6" x="302.74" y="207.6">r</tspan><tspan x="358.45" y="207.6">a</tspan></text><path class="cls-7" d="M298.42,249.09c-5.54,2.77-16.61,5.54-30.79,5.54-32.87,0-57.61-20.76-57.61-59,0-36.5,24.74-61.24,60.9-61.24,14.53,0,23.7,3.11,27.68,5.19L295,151.86c-5.71-2.77-13.84-4.84-23.53-4.84-27.33,0-45.5,17.47-45.5,48.1,0,28.55,16.44,46.88,44.81,46.88,9.17,0,18.51-1.9,24.57-4.84Z"/><path class="cls-7" d="M390.63,210.33c0,31-21.45,44.46-41.69,44.46-22.66,0-40.14-16.61-40.14-43.08,0-28,18.34-44.46,41.52-44.46C374.37,167.26,390.63,184.73,390.63,210.33Zm-66.43.86c0,18.34,10.55,32.18,25.43,32.18,14.53,0,25.43-13.67,25.43-32.52,0-14.19-7.09-32.18-25.09-32.18S324.2,195.28,324.2,211.2Z"/><path class="cls-7" d="M485.61,210.33c0,31-21.45,44.46-41.69,44.46-22.66,0-40.14-16.61-40.14-43.08,0-28,18.34-44.46,41.52-44.46C469.34,167.26,485.61,184.73,485.61,210.33Zm-66.43.86c0,18.34,10.55,32.18,25.43,32.18,14.53,0,25.43-13.67,25.43-32.52,0-14.19-7.09-32.18-25.09-32.18S419.17,195.28,419.17,211.2Z"/><path class="cls-7" d="M504.8,130.06H520V252.89H504.8Z"/><path class="cls-7" d="M222.48,456.69c-5.54,2.77-16.61,5.54-30.79,5.54-32.87,0-57.61-20.76-57.61-59,0-36.5,24.74-61.24,60.9-61.24,14.53,0,23.7,3.11,27.68,5.19L219,359.46c-5.71-2.77-13.84-4.84-23.53-4.84-27.33,0-45.5,17.47-45.5,48.1,0,28.55,16.44,46.88,44.81,46.88,9.17,0,18.51-1.9,24.57-4.84Z"/><path class="cls-7" d="M308.8,437.65c0,8.65.17,16.26.69,22.84H296l-.87-13.67h-.35a31.51,31.51,0,0,1-27.68,15.57c-13.15,0-28.89-7.27-28.89-36.68v-49h15.22v46.37c0,15.92,4.84,26.64,18.68,26.64,10.21,0,17.3-7.09,20.07-13.84a22.28,22.28,0,0,0,1.38-7.79V376.76H308.8Z"/><path class="cls-7" d="M333.36,460.49c.35-5.71.69-14.19.69-21.63V337.66h15.05v52.59h.35c5.36-9.34,15.05-15.4,28.55-15.4,20.76,0,35.47,17.3,35.29,42.73,0,29.93-18.86,44.81-37.54,44.81-12.11,0-21.8-4.67-28-15.74h-.52l-.69,13.84Zm15.74-33.56a28.46,28.46,0,0,0,.69,5.54c2.94,10.55,11.76,17.82,22.84,17.82,15.92,0,25.43-13,25.43-32.18,0-16.78-8.65-31.14-24.91-31.14-10.38,0-20.07,7.09-23.18,18.68a30,30,0,0,0-.87,6.23Z"/><path class="cls-7" d="M441,421.39c.35,20.59,13.49,29.06,28.72,29.06,10.9,0,17.47-1.9,23.18-4.33l2.59,10.9c-5.36,2.42-14.53,5.19-27.85,5.19-25.78,0-41.17-17-41.17-42.21s14.88-45.15,39.27-45.15c27.33,0,34.6,24,34.6,39.44a57.45,57.45,0,0,1-.52,7.09Zm44.63-10.9c.17-9.69-4-24.74-21.11-24.74-15.4,0-22.14,14.19-23.36,24.74Z"/><path class="cls-7" d="M519.16,402.88c0-9.86-.17-18.34-.69-26.12h13.32l.52,16.44H533c3.81-11.25,13-18.34,23.18-18.34a16.48,16.48,0,0,1,4.33.52v14.36a22.9,22.9,0,0,0-5.19-.52c-10.73,0-18.34,8.13-20.41,19.55a42.78,42.78,0,0,0-.69,7.09v44.63H519.16Z"/><path class="cls-7" d="M621.23,460.49,620,449.94h-.52c-4.67,6.57-13.67,12.46-25.6,12.46-17,0-25.61-11.94-25.61-24,0-20.24,18-31.31,50.34-31.14v-1.73c0-6.92-1.9-19.38-19-19.38a41.72,41.72,0,0,0-21.8,6.23l-3.46-10c6.92-4.5,17-7.44,27.51-7.44,25.6,0,31.83,17.47,31.83,34.25v31.31a117.89,117.89,0,0,0,1.38,20.07ZM619,417.76c-16.61-.35-35.47,2.6-35.47,18.86,0,9.86,6.57,14.53,14.36,14.53a20.83,20.83,0,0,0,20.24-14,15.88,15.88,0,0,0,.87-4.84Z"/></g></g></svg>
\ No newline at end of file
diff --git a/site/img/header.png b/site/img/header.png
new file mode 100644
index 0000000..15fe220
Binary files /dev/null and b/site/img/header.png differ
diff --git a/site/img/sef-logo.svg b/site/img/sef-logo.svg
new file mode 100644
index 0000000..35d4919
--- /dev/null
+++ b/site/img/sef-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 290 236.69"><defs><style>.cls-1{fill:url(#linear-gradient);}.cls-2{fill:#f9f8e5;}.cls-3{fill:#030200;}</style><linearGradient id="linear-gradient" y1="85.01" x2="290" y2="85.01" gradientTransform="matrix(1, 0, 0, -1, 0, 238)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a52121"/><stop offset="0.52" stop-color="#e9003a"/><stop offset="1" stop-color="#a92525"/></linearGradient></defs><title>sef-logo</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><g id="Layer_2-2" data-name="Layer 2"><g id="Layer_1-2-2" data-name="Layer 1-2"><path class="cls-1" d="M58.66,236.65a24.75,24.75,0,0,1-7-.74C35.53,231.08,19.48,226,3.31,221.24c-2.92-.86-4-1.76-2.87-4.88Q26.08,146.1,51.57,75.8c.24-.66,84.83-5.42,91.48-6.51.66-.11-53,5.88-53,6.61-.33,37.2-11.8,48.64-12.08,85.39,0,6.07,11.77,11,17.67,11,55.25-.24,63.78-10.24,119-10,5.74,0-39.94-64.2-40-70-.28-34.25,1.85,18.25,1.85-16,0-3.09-7.95-.91,0-3,.72-.19,57.07.88,57.32,1.61q27.64,69.21,55.36,138.29c1.56,3.87.9,5.24-2.9,6.46-16.22,5.2-32.36,10.63-48.5,16.08a23.23,23.23,0,0,1-7.64.94"/><path class="cls-2" d="M225.44,90.14c0,28.11-.12,56.23.11,84.34,0,4.73-.91,6.35-6.38,6.33q-75.21-.33-150.43,0c-4.5,0-6.44-.53-6.42-5.53q.3-85,0-170C62.36,1.41,63,0,67.58,0Q143.84.27,220.1,0c5.11,0,5.42,2,5.41,5.8C225.38,33.92,225.44,62,225.44,90.14Z"/><path class="cls-3" d="M143.34,137.5c-17.38,0-34.77-.34-52.14.18-6.38.19-6.62-2.58-6.26-6.93.31-3.74-1.85-8.05,5.84-8q52.48.57,105,0c7.58-.09,5.77,4,6.06,7.91.32,4.42,0,7.15-6.34,7C178.11,137.19,160.72,137.5,143.34,137.5Z"/><path class="cls-3" d="M144.1,50.93c-17.63,0-35.26-.29-52.88.15-6.54.16-5.79-3.35-5.52-7,.25-3.39-2.23-7.87,5.32-7.8q52.88.49,105.76,0c7-.08,6,3.38,5.92,7.31-.1,3.72,1.41,7.73-5.72,7.53C179.37,50.61,161.73,50.93,144.1,50.93Z"/><path class="cls-3" d="M142.76,94.86c-17.39,0-34.78-.15-52.16.1-4.48.06-5.87-1-5.74-5.36.28-9.25,0-9.25,10-9.25,33.62,0,67.24.24,100.85-.18,7.48-.09,5.92,3.85,6.16,7.81.26,4.29.32,7.24-6.2,7.05C178,94.53,160.38,94.86,142.76,94.86Z"/></g></g></g></g></svg>
\ No newline at end of file
diff --git a/site/img/square-logo.svg b/site/img/square-logo.svg
new file mode 100644
index 0000000..47c187d
--- /dev/null
+++ b/site/img/square-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 773.47 599"><defs><style>.cls-1{fill:#160723;}</style></defs><title>square-logo</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><rect class="cls-1" width="773.47" height="599"/></g></g></svg>
\ No newline at end of file
diff --git a/site/img/toruscms-logo.svg b/site/img/toruscms-logo.svg
new file mode 100644
index 0000000..8410761
--- /dev/null
+++ b/site/img/toruscms-logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 168.87 128.8"><defs><style>.cls-1,.cls-2,.cls-3,.cls-4,.cls-5,.cls-6,.cls-7,.cls-8,.cls-9{fill:none;stroke-miterlimit:10;stroke-width:4px;}.cls-1{stroke:url(#linear-gradient);}.cls-2{stroke:url(#linear-gradient-2);}.cls-3{stroke:url(#linear-gradient-3);}.cls-4{stroke:url(#linear-gradient-4);}.cls-5{stroke:url(#linear-gradient-5);}.cls-6{stroke:url(#linear-gradient-6);}.cls-7{stroke:url(#linear-gradient-7);}.cls-8{stroke:url(#linear-gradient-8);}.cls-9{stroke:url(#linear-gradient-9);}</style><linearGradient id="linear-gradient" y1="78.69" x2="168.87" y2="78.69" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8733aa"/><stop offset="1" stop-color="#0a0a99"/></linearGradient><linearGradient id="linear-gradient-2" y1="51.1" x2="168.87" y2="51.1" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-3" x1="49.16" y1="23.19" x2="119.71" y2="23.19" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-4" x1="17.31" y1="103.52" x2="151.55" y2="103.52" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-5" x1="61.26" y1="38.93" x2="107.61" y2="38.93" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-6" x1="49.16" y1="105.46" x2="119.71" y2="105.46" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-7" x1="17.31" y1="25.28" x2="151.55" y2="25.28" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-8" x1="61.26" y1="90.76" x2="107.61" y2="90.76" xlink:href="#linear-gradient"/><linearGradient id="linear-gradient-9" x1="67.01" y1="64.99" x2="101.85" y2="64.99" xlink:href="#linear-gradient"/></defs><title>toruscms-logo</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><ellipse class="cls-1" cx="84.43" cy="78.69" rx="82.43" ry="29.47"/><ellipse class="cls-2" cx="84.43" cy="51.1" rx="82.43" ry="29.47"/><ellipse class="cls-3" cx="84.43" cy="23.19" rx="33.28" ry="13.96"/><ellipse class="cls-4" cx="84.43" cy="103.52" rx="65.12" ry="23.28"/><ellipse class="cls-5" cx="84.43" cy="38.93" rx="21.18" ry="10.02"/><ellipse class="cls-6" cx="84.43" cy="105.46" rx="33.28" ry="13.96"/><ellipse class="cls-7" cx="84.43" cy="25.28" rx="65.12" ry="23.28"/><ellipse class="cls-8" cx="84.43" cy="90.76" rx="21.18" ry="10.02"/><ellipse class="cls-9" cx="84.43" cy="64.99" rx="15.42" ry="15.81"/></g></g></svg>
\ No newline at end of file
diff --git a/site/index.html b/site/index.html
new file mode 100644
index 0000000..29382c2
--- /dev/null
+++ b/site/index.html
@@ -0,0 +1,410 @@
+<!DOCTYPE html>
+<html lang="en">
+	<!-- <#HEAD> -->
+            <head>
+  <!-- Global site tag (gtag.js) - Google Analytics -->
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta name="description" content="A Free and open source tool that helps you create responsive HTML contact forms in an instant.">
+  <meta name="author" content="Torus Digital">
+
+  <title> Torus Project </title>
+  
+  <!-- Google Fonts -->
+  <!-- Bootstrap 4 -->
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+  <!-- Font Awesome Icons -->
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
+  <!-- favicon -->
+  <link rel="icon" href="img/sef-favicon.png">
+  <!-- Custom styles for this template -->
+  <link rel="stylesheet" href="../assets/css/index.css">
+  <link rel="stylesheet" href="../assets/css/flip-card.css">
+</head>
+            <!-- !<#HEAD> -->
+
+	<body id="page-top" class="text-left">
+
+		<!-- <#NAV> -->
+            <nav class="navbar navbar-expand-lg bg-primary px-5">
+  <div class="container-fluid">
+    <a class="navbar-brand" href="index.html">
+      <img src="../assets/img/toruscms-logo.svg" width="auto" height="60" alt="">
+    </a>
+    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="fa fa-2x fa-bars"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+      <ul class="navbar-nav ml-auto navbar-right">
+        <li class="nav-item active">
+          <a class="nav-link smooth-scroll" href="#about">About</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#projects">Projects</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#signup">Sign Up</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#tutorials">Tutorials</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</nav>
+            <!-- !<#NAV> -->
+
+
+		<header>
+			<div class="container">
+				<div class="row justify-content-center pt-5">
+					<h1 class="main-title text-main">Torus Project</h1>			
+				</div>
+				<div class="row justify-content-center pt-5">
+					<h4>Our mission is to help your open source projects/ideas come to light</h4>			
+				</div>
+			</div>
+		</header>
+
+
+		<section>
+			<div class="container">
+				<div class="row">
+					<div class="col-sm-12 py-5 text-center text-white-50 padding-text">
+						<h3>Torus Project is an ecosystem of intuitive and fully modular tools for your business needs.</h3>
+						<p>Our microservice based architecture and high tech stack provides us with an advantage allowing us to pass significatn cost savings for our end users.   Users will be able to pay for only what they need.  For example:  You could use Cubera Reservation and add a system channel manager, CRM, RMS ending up with a Full CRS centralized reservation system for your business. Aditionally users will be given the option for customer service, for an additional price.       </p>
+					</div>
+				</div>
+			</div>
+		</section>
+
+
+		<section id="projects">
+			<div class="container">
+				<div class="row">
+					<div class="col-12 text-center">
+						<h1 class="text-white">Projects</h1>
+					</div>
+				</div>
+				<div class="row align-items-center">
+
+					<!-- <PROJECTS> -->
+            
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_torus_framework">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">The Torus Framework</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">An open source serverless form generator</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://supereasyforms.com/#getting_started">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_bootlib">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Bootlib</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A bootstrap4 template generator and theme gallery for the torus framework.</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://bootlib.com">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://supereasyforms.com/#getting_started">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_super_easy_forms">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Super Easy Forms</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">An open source serverless form generator</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://supereasyforms.com/#getting_started">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_super_easy_forms_cli">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Super Easy Forms CLI</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_super_easy_docs">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Super Easy Docs</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_easy_md_to_html">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Easy MD to HTML</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A markdown to html converter with no external dependencies.</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_torus_cms">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Torus CMS</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_arjan_workflows">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Arjan Build</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A two-way templating framework for html that only uses html syntax</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_arjan_optimize">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Arjan Build</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A two-way templating framework for html that only uses html syntax</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_arjan_translate">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Arjan Translate</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A localization and translation solution for static html websites</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_arjan_deploy">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Arjan Deploy</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A localization and translation solution for static html websites</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card" id="torufobj_raspi_led_animation">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2><span class="torufattr_title">Raspberry Pi Ws1228b led animations</span></h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3"><span class="torufattr_description">A localization and translation solution for static html websites</span></p>
+									<div>
+										<a class="torufhref_website px-2" href="https://supereasyforms.com/#sef_cli">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="torufhref_github px-2" href="gkpty/super-easy-forms-cli">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="torufhref_installation px-2" href="https://www.npmjs.com/package/super-easy-forms-cli">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					
+            <!-- </PROJECTS> -->
+
+				</div>
+			</div>
+		</section>
+
+
+		<!-- <#FOOTER> -->
+            <footer class="bg-main text-center text-white py-4">
+  <div class="container">
+    <div class="row">
+      <div class="col-sm-6">
+        <p class="text-lg-left">Copyright &copy; Torus Project</p>
+      </div>
+      <div class="col-sm-6">
+         <p class="text-lg-right">powered by <a href="https://torus-digital.com">Torus</a></p>
+      </div>
+    </div>
+  </div>
+</footer>
+            <!-- !<#FOOTER> -->
+
+
+		<script
+			src="https://code.jquery.com/jquery-3.4.1.min.js"
+			integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
+			crossorigin="anonymous">
+		</script>
+
+		<script async defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o" crossorigin="anonymous"></script>
+
+		
+	</body>
+
+</html>
+
+
+
+
+
+
+		
\ No newline at end of file
diff --git a/starter_template.html b/starter_template.html
deleted file mode 100644
index daec584..0000000
--- a/starter_template.html
+++ /dev/null
@@ -1,327 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-	<head>
-		<!-- Global site tag (gtag.js) - Google Analytics -->
-
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-		<meta name="description" content="A Free and open source tool that helps you create responsive HTML contact forms in an instant.">
-		<meta name="author" content="Torus Digital">
-
-		<title> Super Easy Forms </title>
-		
-		<!-- Google Fonts -->
-		<!-- Bootstrap 4 -->
-		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
-		<!-- Font Awesome Icons -->
-		<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
-		<!-- favicon -->
-		<link rel="icon" href="img/sef-favicon.png">
-		<!-- Custom styles for this template -->
-		<link rel="stylesheet" href="index.min.css">
-
-	</head>
-
-	<body id="page-top" class="text-left">
-		
-		<!-- Navigation -->
-		<nav class="navbar navbar-expand-lg bg-light px-5" id="mainNav">
-			<div class="container-fluid">
-				<a class="navbar-brand" href="#">
-					Brand
-				</a>
-				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-					<span class="fa fa-2x fa-bars"></span>
-				</button>
-			
-				<div class="collapse navbar-collapse" id="navbarSupportedContent">
-					<ul class="navbar-nav ml-auto navbar-right">
-						<li class="nav-item active">
-							<a class="nav-link" href="#features">Features <span class="sr-only">(current)</span></a>
-						</li>
-						<li class="nav-item">
-							<a class="nav-link" href="#how-it-works">How it works</a>
-						</li>
-						<li class="nav-item">
-							<a class="nav-link" href="#roadmap">Roadmap</a>
-						</li>
-						<li class="nav-item">
-							<a class="nav-link" href="#vision">Vision</a>
-						</li>
-					</ul>
-				</div>
-			</div>
-		</nav>
-
-		<!-- HEADER -->
-		<header class="container">
-			<div class="row pt-5">
-				<div class="col-sm-12 text-center">
-						<h1 class="main-title">Header</h1>
-						<h3 class="pb-5 px-md-5">A Free and open source tool that helps you create responsive HTML contact forms in an instant.</h3>
-				</div>			
-			</div>
-		</header>
-
-		<!-- GET STARTED -->
-		<section class="try-it py-5" id="tryit">
-			<div class="row justify-content-center">
-				<a href="https://github.com/gkpty/super_easy_forms" target="_blank" class="btn btn-lg btn-main py-3 px-5">
-					<i class="fab fa-github h4"></i>
-					Try it Out!
-				</a>
-			</div>
-		</section>
-
-		<!-- FEATURES -->
-		<section id="features" class="section bg-cream">
-			<div class="container">
-				<div class="row justify-content-center">
-					<h3 class="text-center section-title h2">Features</h3>
-				</div>
-				<div class="row">
-					<div class="col-md-6">
-							<div class="list pt-2">
-								<ul class="h4 text-secondary"> 
-									<li>100% customizable html forms (No iframes)</li>
-									<li>Create an unlimited amount of forms</li>
-									<li>Store unlimited form submissions</li>
-									<li>Register an unlimited amount of emails.</li>
-									<li>Easily export submissions from the database</li>
-								</ul>
-							</div>
-					</div>
-					<div class="col-md-6 pb-0">
-						<div class="bg-primary p-4 ml-md-4">
-							<h4 class="text-center pb-4">Have Any Questions?</h4>
-							<!-- FORM BY SUPER EASY FORMS -->
-							<form id="super-easy-form" alt="Form by Super Easy Forms" action="#">
-								<input type="text" class="form-control mb-3" id="name" name="name" placeholder="name" required>
-								<input type="email" class="form-control mb-3" id="email" name="email" placeholder="email" required>
-								<textarea type="text" class="form-control mb-3" id="message" name="message" placeholder="message" required></textarea>
-								<h5 id="contact-status" class="text-secondary" style="display:none;">Thanks for Contacting Us</h5>
-								<button class="btn btn-light py-2 mt-3" type="submit" id="super-easy-btn-register">
-									<img src="img/SEF-LOGO.svg" width="auto" height="30" alt=""> Send
-								</button>
-							</form>
-							<div class="col-12 text-right">
-								<small class="mx-auto">
-									made with
-									<a href="http://supereasyforms.com" target="_blank">
-										<img src="img/SEF-LOGO.svg" width="auto" height="30" alt="">
-									</a> 
-								</small> <!-- Hope you enjoyed Super Easy Forms. Credit is always welcomed :) -->
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</section>
-
-		<!-- GET STARTED -->
-		<section class="bg-primary py-5" id="get-started">
-			<div class="container">
-				<div class="row justify-content-center">
-					<div class="col-sm-12 text-center pb-4">
-						<h3>Want to know more about Super Easy Forms?</h3>
-					</div>
-				</div>
-				<div class="row">
-					<!-- FORM BY SUPER EASY FORMS -->
-					<form id="super-easy-form-register" alt="Form by Super Easy Forms" class="form-inline col-12 w-100" action="#">
-						<div class="col-md-9 col-lg-10">
-							<input type="email" class="form-control py-4 w-100" id="register-email" name="email" placeholder="email" required>
-						</div>				
-						<div class="col-md-3 col-lg-2 col-6 pt-3 pt-md-0 ml-auto">
-								<button class="btn btn-light py-2 w-100" type="submit" id="super-easy-btn-register">
-									<img src="img/SEF-LOGO.svg" width="auto" height="30" alt=""> Sign Up
-								</button>			
-						</div>			
-					</form>
-				</div>
-				<div class="col-12">
-					<h5 id="contact-status-register" class="text-secondary" style="display:none;">Thanks for Contacting Us</h5>
-					<small class="ml-0">made with <a href="http://supereasyforms.com">super easy forms</a> </small> <!-- Hope you enjoyed Super Easy Forms. Credit is always welcomed :) -->
-				</div>
-			</div>
-		</section>
-
-		<!-- HOW IT WORKS -->
-		<section id="how-it-works" class="bg-cream section">
-			<div class="container ">
-				<div class="row">
-					<div class="col-md-12">
-						<h2 class="text-center section-title">How it Works</h2>
-						<p>Super Easy Forms is a simple CLI built with node js. It helps you register your email with AWS SES, it automatically creates the necessary resources for you in AWS, and it outputs a Bootstrap HTML form that's already connected to your API, ready to copy paste into your website.</p>    
-						<strong>Resources Created</strong>
-						<ol class="text-secondary">
-							<li>A Dynamodb table with your desired fields.</li>
-							<li>A lambda function that will send an email to your registered address and add the entry to the database.</li>
-							<li>A REST API endpoint for the lambda function with a POST method.</li>
-						</ol>
-						<strong>The Form</strong>
-						<ol class="text-secondary">
-							<li>Responsive bootsrap 4 layout</li>
-							<li>Automatic form fields with labels</li>
-							<li>JQuery CDN</li>
-							<li>JQuery handler connected to your API endpoint</li>
-						</ol>
-					</div>
-				</div>
-			</div>
-			<div class="row justify-content-center">
-				<img  class="lazy" src="img/placeholder.svg" data-src="img/architecture.svg" data-srcset="img/architecture.svg" alt="AWS architecture diagram of super easy forms" style="height: 100%; width: 80%; ">
-			</div>
-		</section>
-
-			<!-- BUILT WITH -->
-			<section class="bg-grey py-5" id="built-with">
-				<div class="container">
-					<div class="row justify-content-center">
-						<h3 class="h2 pb-4 title">Built With</h3>
-					</div>
-					<div class="row text-center align-middle pb-4">
-						<div class="col-md-4 p-2 px-lg-5 py-lg-0 py-4">
-							<a href="https://nodejs.org/en/" target="_blank">
-								<img class="tech-icon" src="img/Node.js_logo.svg" alt="node js logo">
-							</a>
-						</div>
-						<div class="col-md-4 p-2 px-lg-5 py-lg-0 py-4">
-							<a href="https://getbootstrap.com/" target="_blank">
-								<img class="tech-icon" src="img/bootstrap-solid.svg" alt="bootstrap logo">
-							</a>
-						</div>
-						<div class="col-md-4 p-2 px-lg-5 py-lg-0 py-4">
-							<a href="https://aws.amazon.com/" target="_blank">
-								<img class="tech-icon" src="img/Amazon_Web_Services_Logo.svg" alt="AWS logo">
-							</a>
-						</div>
-					</div>
-				</div>
-			</section>
-
-			<!-- INCLUDED -->
-			<section id="included-in-aws" class="section bg-white">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-12">
-							<h2 class="text-center section-title">Whats Included with AWS in Super Easy Forms?</h2>
-							<p class="pb-4">You need to have an AWS account to be able to use Super Easy Forms. In the near future we are going to solve our vendor-lock in but for now AWS is a pretty good start.</p>    
-							<span class="h3 font-weight-bold">Super Easy Forms uses the following services from AWS</span>
-							<ul class="pt-4 text-secondary">
-								<li><strong>SES </strong> Simple Email Service. 1,000 emails/month for free then $.10 for every 1,000 emails recieved.</li>
-								<li><strong>DynamoDB </strong> Fully managed NoSQL database. 25GB of storage free for always.</li>
-								<li><strong>Lambda </strong> Let’s you run code without managing servers. 1M requests/month free always. Then $.20 per 1M requests.</li>
-								<li><strong>API Gateway </strong> 1M REST API requests/month for 12months then $3.50/1M requests.</li>
-								<li><strong>S3 Bucket </strong> Object storage for your file submissions <span class="text-primary">(Coming soon!)</span>. 5Gb free for 12 months then $0.023 for GB.</li>
-							</ul>
-							<p>Want more info? <a href="https://aws.amazon.com/free/" target="_blank"> https://aws.amazon.com/free</a></p>
-						</div>
-					</div>
-				</div>
-			</section>
-
-			<!-- ROADMAP -->
-			<section id="roadmap" class="section bg-light">
-					<div class="container">
-						<div class="row">
-							<div class="col-md-12">
-								<h2 class="text-center section-title">Roadmap</h2>
-								<p class="pb-3">Super Easy Forms doesn't stop here. We have a bunch of features planned that will make it more easy and more Super!</p> 
-								<span class="h3 font-weight-bold">Some of these include</span>
-								<ul class="pt-3 text-secondary">
-									<li>File submissions (images, videos, PDFs and more!)</li>
-									<li>Payment forms (integrations with leading solution providers)</li>
-									<li>Direct integration with the gmail API</li>
-									<li>Direct export of submissions to XLS and CSV</li>
-									<li>Optional Captcha (Spam protection)</li>
-								</ul>
-							</div>
-						</div>
-						<div class="row">
-							<div class="col-sm-12">
-								<!-- FORM BY SUPER EASY FORMS -->
-								<div class="p-5 mt-5 bg-primary">
-									<h5 class="h3 text-center pb-4">Anything else you'd like us to consider?</h5>
-									<form id="super-easy-form-suggestion" alt="Form by Super Easy Forms" class="pb-3" action="#">
-										<textarea type="text" style="height: 10rem; font-size: 1.5rem;" class="form-control" id="message" name="message" placeholder="Type something here" required></textarea>	
-										<h5 id="contact-status-suggestion" class="text-secondary" style="display:none;">Thanks for Contacting Us</h5>
-										<div class="">
-											<button class="btn btn-light py-2 mt-3" type="submit" id="super-easy-btn-register">
-												<img src="img/SEF-LOGO.svg" width="auto" height="30" alt=""> Give Feedback
-											</button>
-										</div>
-									</form>
-									<div class="text-right">
-										<small class="">
-											made with
-											<a href="http://supereasyforms.com" target="_blank">
-												<img src="img/SEF-LOGO.svg" width="auto" height="30" alt="">
-											</a> 
-										</small> <!-- Hope you enjoyed Super Easy Forms. Credit is always welcomed :) -->
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-				</section>
-
-			<!-- VISION -->
-			<section id="vision" class="section bg-white">
-					<div class="container">
-						<div class="row">
-							<div class="col-md-12">
-								<h2 class="text-center section-title">Our Vision</h2>
-								<p><strong>The more Open Source the Better! </strong> We are working on a suite of free & open source tools that help people use microservices effectively in smaller use cases like building websites.</p>    
-								<strong>We believe that</strong>
-								<ol class="text-secondary">
-									<li>building websites should be fun, easy and free.</li>
-									<li>The websites you build should be fast, secure and should not require any maintenance.</li>
-									<li>There shouldn’t be a compromise between what the devs consider good tech and what the beginner perceives as user-friendly.</li>
-								</ol>
-							</div>
-						</div>
-						<div class="row justify-content-center">
-							<div class="col-sm-12">
-								<p>If you share our vision, or want to learn more check out the rest of our projects at <a href="http://torusproject.org">Torus Project</a>.</p>
-							</div>
-						</div>
-					</div>
-				</section>
-
-				<footer class="bg-dark text-center text-white py-4">
-					<div class="container">
-						<div class="row">
-							<div class="col-sm-6">
-								<p class="text-lg-left">Copyright &copy; Super Easy Forms 2019</p>
-							</div>
-							<div class="col-sm-6">
-								<p class="text-lg-right">powered by <a href="https://torus-digital.com">Torus</a></p>
-							</div>
-						</div>
-					</div>
-				</footer>
-
-		<!-- FULL JQUERY -->
-		<script
-			src="https://code.jquery.com/jquery-3.4.1.min.js"
-			integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
-			crossorigin="anonymous">
-		</script>
-		<!-- Bootstrap core JavaScript -->
-		<script async defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o" crossorigin="anonymous"></script>
-		<!-- Custom scripts for this template -->
-
-		<!-- FEATURES FORM-->
-		
-	</body>
-
-</html>
-
-
-
-
-
-
-		
\ No newline at end of file
diff --git a/test/testBuild.js b/test/testBuild.js
new file mode 100644
index 0000000..65cb4cc
--- /dev/null
+++ b/test/testBuild.js
@@ -0,0 +1,3 @@
+var build = require('../lib/build')
+
+build('index.html');
\ No newline at end of file
diff --git a/test/testBuildAll.js b/test/testBuildAll.js
new file mode 100644
index 0000000..d26ace2
--- /dev/null
+++ b/test/testBuildAll.js
@@ -0,0 +1,3 @@
+var buildAll = require('../lib/buildAll');
+
+buildAll();
\ No newline at end of file
diff --git a/test/testReverseBuild.js b/test/testReverseBuild.js
new file mode 100644
index 0000000..92ce0e3
--- /dev/null
+++ b/test/testReverseBuild.js
@@ -0,0 +1,3 @@
+var reverseBuild = require('../lib/reverseBuild');
+
+reverseBuild('index.html');
\ No newline at end of file
diff --git a/test/testReverseBuildAll.js b/test/testReverseBuildAll.js
new file mode 100644
index 0000000..a16e4c0
--- /dev/null
+++ b/test/testReverseBuildAll.js
@@ -0,0 +1,3 @@
+var reverseBuildAll = require('../lib/reverseBuildAll');
+
+reverseBuildAll();
\ No newline at end of file
diff --git a/toruf/components/footer.html b/toruf/components/footer.html
new file mode 100644
index 0000000..09abbd2
--- /dev/null
+++ b/toruf/components/footer.html
@@ -0,0 +1,12 @@
+<footer class="bg-main text-center text-white py-4">
+  <div class="container">
+    <div class="row">
+      <div class="col-sm-6">
+        <p class="text-lg-left">Copyright &copy; Torus Project</p>
+      </div>
+      <div class="col-sm-6">
+         <p class="text-lg-right">powered by <a href="https://torus-digital.com">Torus</a></p>
+      </div>
+    </div>
+  </div>
+</footer>
\ No newline at end of file
diff --git a/toruf/components/head.html b/toruf/components/head.html
new file mode 100644
index 0000000..6a47f14
--- /dev/null
+++ b/toruf/components/head.html
@@ -0,0 +1,20 @@
+<head>
+  <!-- Global site tag (gtag.js) - Google Analytics -->
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta name="description" content="A Free and open source tool that helps you create responsive HTML contact forms in an instant.">
+  <meta name="author" content="Torus Digital">
+
+  <title> Torus Project </title>
+  
+  <!-- Google Fonts -->
+  <!-- Bootstrap 4 -->
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+  <!-- Font Awesome Icons -->
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
+  <!-- favicon -->
+  <link rel="icon" href="img/sef-favicon.png">
+  <!-- Custom styles for this template -->
+  <link rel="stylesheet" href="../assets/css/index.css">
+  <link rel="stylesheet" href="../assets/css/flip-card.css">
+</head>
\ No newline at end of file
diff --git a/toruf/components/nav.html b/toruf/components/nav.html
new file mode 100644
index 0000000..81d1295
--- /dev/null
+++ b/toruf/components/nav.html
@@ -0,0 +1,26 @@
+<nav class="navbar navbar-expand-lg bg-primary px-5">
+  <div class="container-fluid">
+    <a class="navbar-brand" href="index.html">
+      <img src="../assets/img/toruscms-logo.svg" width="auto" height="60" alt="">
+    </a>
+    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="fa fa-2x fa-bars"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+      <ul class="navbar-nav ml-auto navbar-right">
+        <li class="nav-item active">
+          <a class="nav-link smooth-scroll" href="#about">About</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#projects">Projects</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#signup">Sign Up</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link smooth-scroll" href="#tutorials">Tutorials</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</nav>
\ No newline at end of file
diff --git a/toruf/methods/generic.js b/toruf/methods/generic.js
new file mode 100644
index 0000000..e69de29
diff --git a/toruf/methods/nav.js b/toruf/methods/nav.js
new file mode 100644
index 0000000..e69de29
diff --git a/toruf/objects/projects.json b/toruf/objects/projects.json
new file mode 100644
index 0000000..c3cccf9
--- /dev/null
+++ b/toruf/objects/projects.json
@@ -0,0 +1,111 @@
+
+{
+  "torus_framework": {
+    "title":"The Torus Framework",
+    "description":"An open source serverless form generator",
+    "language":"javascript",
+    "license":"mit",
+    "github":"gkpty/super-easy-forms",
+    "website":"https://supereasyforms.com",
+    "installation":"https://supereasyforms.com/#getting_started"
+  },
+  "bootlib": {
+    "title":"Bootlib",
+    "description":"A bootstrap4 template generator and theme gallery for the torus framework.",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms",
+    "website":"https://bootlib.com",
+    "installation":"https://supereasyforms.com/#getting_started"
+  },
+  "super_easy_forms": {
+    "title":"Super Easy Forms",
+    "description":"An open source serverless form generator",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms",
+    "website":"https://supereasyforms.com",
+    "installation":"https://supereasyforms.com/#getting_started"
+  },
+  "super_easy_forms_cli": {
+    "title":"Super Easy Forms CLI",
+    "description":"A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "super_easy_docs": {
+    "title":"Super Easy Docs",
+    "description":"A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "easy_md_to_html": {
+    "title":"Easy MD to HTML",
+    "description":"A markdown to html converter with no external dependencies.",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "torus_cms": {
+    "title":"Torus CMS",
+    "description":"A complete command line interface for super easy forms. Allows you to deploy both the frontend and backend of your forms with a single command.",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "arjan_workflows": {
+    "title":"Arjan Build",
+    "description":"A two-way templating framework for html that only uses html syntax",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "arjan_optimize": {
+    "title":"Arjan Build",
+    "description":"A two-way templating framework for html that only uses html syntax",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "arjan_translate": {
+    "title":"Arjan Translate",
+    "description":"A localization and translation solution for static html websites",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "arjan_deploy": {
+    "title":"Arjan Deploy",
+    "description":"A localization and translation solution for static html websites",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  },
+  "raspi_led_animation": {
+    "title":"Raspberry Pi Ws1228b led animations",
+    "description":"A localization and translation solution for static html websites",
+    "language":"",
+    "license":"",
+    "github":"gkpty/super-easy-forms-cli",
+    "website":"https://supereasyforms.com/#sef_cli",
+    "installation":"https://www.npmjs.com/package/super-easy-forms-cli"
+  }
+}
diff --git a/toruf/templates/index.html b/toruf/templates/index.html
new file mode 100644
index 0000000..a6cf11c
--- /dev/null
+++ b/toruf/templates/index.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+	<#HEAD>
+
+	<body id="page-top" class="text-left">
+
+		<#NAV>
+
+
+		<header>
+			<div class="container">
+				<div class="row justify-content-center pt-5">
+					<h1 class="main-title text-main">Torus Project</h1>			
+				</div>
+				<div class="row justify-content-center pt-5">
+					<h4>Our mission is to help your open source projects/ideas come to light</h4>			
+				</div>
+			</div>
+		</header>
+
+
+		<section>
+			<div class="container">
+				<div class="row">
+					<div class="col-sm-12 py-5 text-center text-white-50 padding-text">
+						<h3>Torus Project is an ecosystem of intuitive and fully modular tools for your business needs.</h3>
+						<p>Our microservice based architecture and high tech stack provides us with an advantage allowing us to pass significatn cost savings for our end users.   Users will be able to pay for only what they need.  For example:  You could use Cubera Reservation and add a system channel manager, CRM, RMS ending up with a Full CRS centralized reservation system for your business. Aditionally users will be given the option for customer service, for an additional price.       </p>
+					</div>
+				</div>
+			</div>
+		</section>
+
+
+		<section id="projects">
+			<div class="container">
+				<div class="row">
+					<div class="col-12 text-center">
+						<h1 class="text-white">Projects</h1>
+					</div>
+				</div>
+				<div class="row align-items-center">
+
+					<PROJECTS>
+						<div class="col-sm-6 col-lg-4 text-center tool-element flip-card">
+							<div class="flip-card-inner">
+								<div class="flip-card-front">
+									<img src="../assets/img/toruscms-logo.svg" class="tool-logo">
+									<h2>{title}</h2>
+								</div>
+								<div class="flip-card-back">
+									<p class="p-3">{description}</p>
+									<div>
+										<a class="px-2" href="{website}">
+											<i class="fas fa-lg fa-globe"></i>
+										</a>
+										<a class="px-2" href="{github}">
+											<i class="fab fa-lg fa-github"></i>
+										</a>
+										<a class="px-2" href="{installation}">
+											<i class="fas fa-lg fa-download"></i>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					</PROJECTS>
+
+				</div>
+			</div>
+		</section>
+
+
+		<#FOOTER>
+
+
+		<script
+			src="https://code.jquery.com/jquery-3.4.1.min.js"
+			integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
+			crossorigin="anonymous">
+		</script>
+
+		<script async defer src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o" crossorigin="anonymous"></script>
+
+		
+	</body>
+
+</html>
+
+
+
+
+
+
+		
\ No newline at end of file