+
+
+ Intro
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis eros vel libero bibendum
+ vulputate. Sed vel enim porttitor, mattis eros sit amet, tempor enim. Morbi in tincidunt neque.
+ Maecenas vitae bibendum justo. Praesent pharetra mollis ante quis sodales. Nulla in vestibulum
+ augue, at varius augue. Quisque finibus urna eu elit porta, ac rhoncus metus imperdiet. Donec
+ auctor ipsum nisi, eu pulvinar turpis egestas sit amet.
+
+
+
+
+
+ Upcoming Events
+
+
+
+
+
+ The Team
+
+ 
+
+ Insert Bio Here.....
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Desktop/Projects/TPcode/main.scss b/Desktop/Projects/TPcode/main.scss
new file mode 100644
index 0000000..1a52f18
--- /dev/null
+++ b/Desktop/Projects/TPcode/main.scss
@@ -0,0 +1,140 @@
+$fontColor: (
+ primaryFont: white,
+ secondaryFont: black,
+);
+
+$backgroundColor: (
+ intro: white,
+ upComingEvent: white,
+ theTeam: white,
+);
+
+@function backgroundColor($color-name) {
+ @return map-get($backgroundColor , $color-name)
+}
+
+@function fontColor($color-name) {
+ @return map-get($fontColor, $color-name)
+}
+
+body, html {
+ height: 100%;
+}
+
+body {
+ margin: 0%;
+ font-family: 'Helvetica';
+}
+
+
+.bgimg {
+ position: relative;
+ height: 100vh;
+ width: 100vw;
+ z-index: -1;
+}
+
+.headerCard {
+ height: 100%;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ background-image: url('/img/nashuaBG.jpg');
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+}
+
+header {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+
+ h1 {
+ font-size: 3rem;
+ color: fontColor(primaryFont);
+ font-weight: normal;
+ margin: 0rem;
+ }
+
+ p {
+ font-size: 1rem;
+ color: fontColor(primaryFont);
+ margin-bottom: 1rem;
+ }
+
+ .arrowDown {
+ color: fontColor(primaryFont)
+ }
+}
+
+.main {
+ height: 100%;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ text-align: center;
+}
+
+.intro {
+ flex-basis: 33%;
+ background-color: backgroundColor(intro);
+
+ h2 {
+ margin-top: .5rem;
+ margin-bottom: 0;
+ color: fontColor(secondaryFont);
+ align-self: center;
+ }
+ p {
+ margin-left: .8rem;
+ margin-right: .8rem;
+ align-self: center;
+ }
+}
+
+.eventCard {
+ flex-basis: 33%;
+ background-color: backgroundColor(upComingEvent);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+
+ h2 {
+ margin: 0;
+ }
+
+ ul {
+ list-style: none;
+ padding: 0;
+
+ li {
+ margin-bottom: .4rem;
+
+ .eventLink {
+ text-decoration: none;
+ color: fontColor(secondaryFont);
+ }
+ }
+ }
+}
+
+.teamCard {
+ flex-basis: 33%;
+ background-color: backgroundColor(theTeam);
+
+ h2 {
+ margin: 0;
+ }
+
+ p {
+ margin-left: .8rem;
+ margin-right: .8rem;
+ }
+ .tommyAvatar {
+ border-radius: 50%;
+ }
+}
+