diff --git a/css/demo.css b/css/demo.css
new file mode 100644
index 0000000..9bc58f1
--- /dev/null
+++ b/css/demo.css
@@ -0,0 +1,239 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800,900');
+
+html {
+ box-sizing: border-box;
+}
+*, *:before, *:after {
+ box-sizing: inherit;
+}
+
+article, header, section, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
+ display: block;
+}
+body {
+ background:#eef5ce none repeat scroll 0 0;
+ color: #222;
+ font-size: 100%;
+ line-height: 24px;
+ margin: 0;
+ padding:0;
+ font-family: "Raleway",sans-serif;
+}
+a{
+ font-family: "Raleway",sans-serif;
+ text-decoration: none;
+ outline: none;
+}
+a:hover, a:focus {
+ color: #373e18;
+}
+section {
+ float: left;
+ width: 100%;
+ padding-bottom:3em;
+}
+h2 {
+ color: #1a0e0e;
+ font-size: 26px;
+ font-weight: 700;
+ margin: 0;
+ line-height: normal;
+ text-transform:uppercase;
+}
+h2 span {
+ display: block;
+ padding: 0;
+ font-size: 18px;
+ opacity: 0.7;
+ margin-top: 5px;
+ text-transform:uppercase;
+}
+
+#float-right{
+ float:right;
+}
+
+/* ******************************************************
+ Script Top
+*********************************************************/
+
+.ScriptTop {
+ background: #fff none repeat scroll 0 0;
+ float: left;
+ font-size: 0.69em;
+ font-weight: 600;
+ line-height: 2.2;
+ padding: 12px 0;
+ text-transform: uppercase;
+ width: 100%;
+}
+
+/* To Navigation Style 1*/
+.ScriptTop ul {
+ margin: 24px 0;
+ padding: 0;
+ text-align: left;
+}
+.ScriptTop li{
+ list-style:none;
+ display:inline-block;
+}
+.ScriptTop li a {
+ background: #6a4aed none repeat scroll 0 0;
+ color: #fff;
+ display: inline-block;
+ font-size: 14px;
+ font-weight: 600;
+ padding: 5px 18px;
+ text-decoration: none;
+ text-transform: capitalize;
+}
+.ScriptTop li a:hover{
+ background:#000;
+ color:#fff;
+}
+
+
+/* ******************************************************
+ Script Header
+*********************************************************/
+
+.ScriptHeader {
+ float: left;
+ width: 100%;
+ padding: 2em 0;
+}
+.rt-heading {
+ margin: 0 auto;
+ text-align:center;
+}
+.Scriptcontent{
+ line-height:28px;
+}
+.ScriptHeader h1{
+ font-family: "brandon-grotesque", "Brandon Grotesque", "Source Sans Pro", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;
+ text-rendering: optimizeLegibility;
+ -webkit-font-smoothing: antialiased;
+ color: #6a4aed;
+ font-size: 26px;
+ font-weight: 700;
+ margin: 0;
+ line-height: normal;
+
+}
+.ScriptHeader h2 {
+ color: #312c8f;
+ font-size: 20px;
+ font-weight: 400;
+ margin: 5px 0 0;
+ line-height: normal;
+
+}
+.ScriptHeader h1 span {
+ display: block;
+ padding: 0;
+ font-size: 22px;
+ opacity: 0.7;
+ margin-top: 5px;
+
+}
+.ScriptHeader span {
+ display: block;
+ padding: 0;
+ font-size: 22px;
+ opacity: 0.7;
+ margin-top: 5px;
+}
+
+/* ******************************************************
+ Responsive Grids
+*********************************************************/
+
+.rt-container {
+ margin: 0 auto;
+ padding-left:12px;
+ padding-right:12px;
+}
+.rt-row:before, .rt-row:after {
+ display: table;
+ line-height: 0;
+ content: "";
+}
+
+.rt-row:after {
+ clear: both;
+}
+[class^="col-rt-"] {
+ box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ -o-box-sizing: border-box;
+ -ms-box-sizing: border-box;
+ padding: 0 15px;
+ min-height: 1px;
+ position: relative;
+}
+
+
+@media (min-width: 768px) {
+ .rt-container {
+ width: 750px;
+ }
+ [class^="col-rt-"] {
+ float: left;
+ width: 49.9999999999%;
+ }
+ .col-rt-6, .col-rt-12 {
+ width: 100%;
+ }
+
+}
+
+@media (min-width: 1200px) {
+ .rt-container {
+ width: 1170px;
+ }
+ .col-rt-1 {
+ width:16.6%;
+ }
+ .col-rt-2 {
+ width:30.33%;
+ }
+ .col-rt-3 {
+ width:50%;
+ }
+ .col-rt-4 {
+ width: 67.664%;
+ }
+ .col-rt-5 {
+ width: 83.33%;
+ }
+
+
+}
+
+@media only screen and (min-width:240px) and (max-width: 768px){
+ .ScriptTop h1, .ScriptTop ul {
+ text-align: center;
+ }
+ .ScriptTop h1{
+ margin-top:0;
+ margin-bottom:15px;
+ }
+ .ScriptTop ul{
+ margin-top:12px;
+ }
+
+ .ScriptHeader h1,
+ .ScriptHeader h2,
+ .scriptnav ul{
+ text-align:center;
+ }
+ .scriptnav ul{
+ margin-top:12px;
+ }
+ #float-right{
+ float:none;
+ }
+
+}
\ No newline at end of file
diff --git a/css/style_resources.css b/css/style_resources.css
new file mode 100644
index 0000000..f349bec
--- /dev/null
+++ b/css/style_resources.css
@@ -0,0 +1,78 @@
+body {
+ font-family: "Raleway";
+}
+
+h1 {
+ font-family: "Poppins";
+ text-align: center;
+}
+
+.row {
+ display: flex;
+ flex-wrap: wrap;
+ padding: 0 4px;
+}
+
+.column {
+ flex: 100%;
+ max-width: 100%;
+}
+
+.column img {
+ vertical-align: middle;
+}
+
+.container {
+ position: relative;
+ width: 100%;
+}
+
+.image {
+ display: block;
+ width: 100%;
+ height: auto;
+}
+.overlay {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 100%;
+ width: 100%;
+ opacity: 0;
+ transition: 0.5s ease;
+ background-color: black;
+}
+
+.container:hover .overlay {
+ opacity: 0.75;
+}
+
+.text {
+ color: white;
+ font-size: 20px;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ -ms-transform: translate(-50%, -50%);
+ text-align: center;
+}
+
+/* Tablet Styles */
+@media only screen and (min-width: 480px) {
+ .column {
+ flex: 50%;
+ max-width: 50%;
+ }
+}
+
+
+/* Desktop Styles */
+@media only screen and (min-width: 1024px) {
+ .column {
+ flex: 33.3%;
+ max-width: 33.3%;
+ }
+}
\ No newline at end of file
diff --git a/img/gitHub.png b/img/gitHub.png
new file mode 100644
index 0000000..5b92d8a
Binary files /dev/null and b/img/gitHub.png differ
diff --git a/img/hackClub.png b/img/hackClub.png
new file mode 100644
index 0000000..749c7e6
Binary files /dev/null and b/img/hackClub.png differ
diff --git a/img/replit.png b/img/replit.png
new file mode 100644
index 0000000..2907690
Binary files /dev/null and b/img/replit.png differ
diff --git a/index.html b/index.html
index 3b10f6b..0203ec8 100644
--- a/index.html
+++ b/index.html
@@ -44,6 +44,9 @@
Ongoing Projects
+
+ Resources
+
Contact Us
@@ -243,4 +246,4 @@ Hacktoberfest
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"
>
-