+ In our grand introduction to the HTML/CSS world, our Ada teachers asked us to design our first webpage project: Meowspace. Of course, most of us used the opportunity to show off our cats as the kitty-celebrities we always knew they should be. To be frank, it was incredibly difficult! My first foray into (and dismay of) the "fiddlyness" of CSS...
+
+ Our first six weeks of school culminated in this week-long project to design a hotel backend reservation system using TDD and object-oriented design principles. Based on the user stories provided, I designed classes and methods that keep track of which rooms are reserved when.
+
+ For this in-class project, I practiced pair programming with my fantastic fellow student Christiane. We used Test Driven Development (TDD) to create a collection of Ruby classes that would provide the foundation for creating a scrabble game.
+
+
+
+
+
+
+
diff --git a/stylesheets/normalize.css b/stylesheets/normalize.css
new file mode 100644
index 000000000..fa4e73dd4
--- /dev/null
+++ b/stylesheets/normalize.css
@@ -0,0 +1,447 @@
+/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+ ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in
+ * IE on Windows Phone and in iOS.
+ */
+
+html {
+ line-height: 1.15; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+ ========================================================================== */
+
+/**
+ * Remove the margin in all browsers (opinionated).
+ */
+
+body {
+ margin: 0;
+}
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+article,
+aside,
+footer,
+header,
+nav,
+section {
+ display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+/* Grouping content
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in IE.
+ */
+
+figcaption,
+figure,
+main { /* 1 */
+ display: block;
+}
+
+/**
+ * Add the correct margin in IE 8.
+ */
+
+figure {
+ margin: 1em 40px;
+}
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+ box-sizing: content-box; /* 1 */
+ height: 0; /* 1 */
+ overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+ ========================================================================== */
+
+/**
+ * 1. Remove the gray background on active links in IE 10.
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+ */
+
+a {
+ background-color: transparent; /* 1 */
+ -webkit-text-decoration-skip: objects; /* 2 */
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+ border-bottom: none; /* 1 */
+ text-decoration: underline; /* 2 */
+ text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+ */
+
+b,
+strong {
+ font-weight: inherit;
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+ font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font style in Android 4.3-.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/**
+ * Add the correct background and color in IE 9-.
+ */
+
+mark {
+ background-color: #ff0;
+ color: #000;
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+sup {
+ top: -0.5em;
+}
+
+/* Embedded content
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+audio,
+video {
+ display: inline-block;
+}
+
+/**
+ * Add the correct display in iOS 4-7.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/**
+ * Remove the border on images inside links in IE 10-.
+ */
+
+img {
+ border-style: none;
+}
+
+/**
+ * Hide the overflow in IE.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* Forms
+ ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers (opinionated).
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ font-family: sans-serif; /* 1 */
+ font-size: 100%; /* 1 */
+ line-height: 1.15; /* 1 */
+ margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+ overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+ text-transform: none;
+}
+
+/**
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+ * controls in Android 4.
+ * 2. Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+html [type="button"], /* 1 */
+[type="reset"],
+[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+ border-style: none;
+ padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+ outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+ padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ * `fieldset` elements in all browsers.
+ */
+
+legend {
+ box-sizing: border-box; /* 1 */
+ color: inherit; /* 2 */
+ display: table; /* 1 */
+ max-width: 100%; /* 1 */
+ padding: 0; /* 3 */
+ white-space: normal; /* 1 */
+}
+
+/**
+ * 1. Add the correct display in IE 9-.
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+ display: inline-block; /* 1 */
+ vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Remove the default vertical scrollbar in IE.
+ */
+
+textarea {
+ overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10-.
+ * 2. Remove the padding in IE 10-.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-cancel-button,
+[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+ -webkit-appearance: button; /* 1 */
+ font: inherit; /* 2 */
+}
+
+/* Interactive
+ ========================================================================== */
+
+/*
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in Edge, IE, and Firefox.
+ */
+
+details, /* 1 */
+menu {
+ display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+ display: list-item;
+}
+
+/* Scripting
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+canvas {
+ display: inline-block;
+}
+
+/**
+ * Add the correct display in IE.
+ */
+
+template {
+ display: none;
+}
+
+/* Hidden
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 10-.
+ */
+
+[hidden] {
+ display: none;
+}
diff --git a/stylesheets/styles.css b/stylesheets/styles.css
new file mode 100644
index 000000000..c5adfe4af
--- /dev/null
+++ b/stylesheets/styles.css
@@ -0,0 +1,259 @@
+/*font-family: 'Montserrat Alternates', sans-serif;
+font-family: 'Bungee Inline', cursive;
+font-family: 'Biryani', sans-serif;
+font-family: 'Bungee', cursive;
+font-family: 'Open Sans', sans-serif;*/
+
+/*font-family: 'Linden Hill', serif;
+font-family: 'Julius Sans One', sans-serif;
+font-family: 'Lekton', sans-serif;
+font-family: 'Harmattan', sans-serif;
+font-family: 'Rubik Mono One', sans-serif;
+font-family: 'Pavanam', sans-serif;*/
+
+h1,h2,h3, h4,li {
+ font-family: 'Julius Sans One', sans-serif;
+ margin: 0;
+}
+
+p {
+ font-family: 'Harmattan', sans-serif;
+ font-size: 1.3em;
+}
+
+html {
+ overflow-x:hidden;
+}
+
+body {
+ width: 100%;
+ margin: 0;
+}
+
+footer {
+ display: flex;
+ text-align: center;
+ background-color: cyan;
+ margin-top: 100px;
+}
+
+footer ul{
+ list-style: none;
+}
+
+body {
+ /*background-image: url("http://www.freepik.com/free-vector/tropical-leaves-pattern-background_1111195.htm");*/
+ /*background-image: "images/banana.jpg"*/
+}
+
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*HEADER */
+
+@media all and (min-width: 600px) {
+ header h1 { flex: 1 auto; }
+ ul { flex: 1 0; }
+}
+
+header {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: nowrap;
+ margin: 5px;
+ align-items: center;
+}
+
+header h1 {
+ font-size: 4em;
+ font-family: 'Rubik Mono One', sans-serif;
+ /*border: 10px dotted purple;*/
+ margin: 0px;
+ padding-left: 10px;
+}
+
+nav {
+ flex-direction: row;
+ flex-wrap: nowrap;
+ justify-content: center;
+}
+
+nav ul {
+ display: inline-flex;
+ /*border: 10px dotted blue;*/
+}
+
+nav ul li {
+ list-style-type: none;
+ padding-right: 60px;
+
+}
+
+header a:hover {
+ color: orange;
+}
+
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*HOME PAGE: ARROW AND HEADSHOT BELOW HEADER*/
+
+/*@media all and (min-width: 600px) {
+ .arrow { flex: 1 0; }
+ .headshot { flex: 1 0; }
+}*/
+
+.arrow-headshot {
+ display:flex;
+ flex-wrap: nowrap;
+ padding-left: 190px;
+ /*background-image: url(https://mdn.mozillademos.org/files/12005/starsolid.gif)*/
+}
+
+.arrow {
+ max-height: 200px;
+ align-self:flex-start;
+}
+
+.headshot {
+ max-height: 300px;
+ border-radius: 50%
+}
+
+/*TRYING TO MAKE THE PHOTO DIAMOND SHAPED (OR OTHER IDEAS IN THIS CODEPEN)*/
+/*https://codepen.io/CreativeJuiz/pen/Hizkh*/
+/*.diamond, .dia {
+ margin: 0 auto;
+ transform-origin: 50% 50%;
+ overflow: hidden;
+}
+
+.diamond {
+ transform: rotate(45deg) translateY(-25px) translateX(-25px);
+}
+
+.diamond .dia {
+ transform: rotate(-45deg);
+}*/
+
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*FOOTER- TO EVENTUALLY INCLUDE LINKS AND ICONS TO LINKEDIN AND GITHUB*/
+/*footer-links.fa {
+ padding: 20px;
+ font-size: 30px;
+ width: 50px;
+ text-align: center;
+ text-decoration: none;
+}
+
+.fa:hover {
+ opacity: 0.7;
+}
+
+.fa-twitter {
+ background: #55ACEE;
+ color: white;
+}*/
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*HOBBY BLOG*/
+.projectdescription a {
+ text-decoration: none;
+ color: black;
+}
+
+.projectdescription a:hover {
+ color: orange;
+}
+
+
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*PORTFOLIO PAGE*/
+.project-posts-and-hobbies-container {
+ /*width: 960px;*/
+ padding-left: 100px;
+ padding-right: 100px;
+}
+
+.page-heading {
+ text-align: center;
+ margin: 40px;
+ font-weight:800;
+ font-size: 3em;
+ /*text-decoration: underline;*/
+
+}
+
+.project {
+ display: flex;
+ flex-wrap: nowrap;
+ /*border: 10px dotted green;*/
+}
+
+.project-info {
+ /*padding-right: 20px*/
+ padding-top: 10px
+}
+
+.projectname {
+ font-size: 2em;
+ font-weight:600;
+ /*border: 10px dotted purple;*/
+}
+
+.projectname:hover {
+ color: orange;
+}
+
+.projectimage {
+ display:inline-flex;
+ max-width: auto;
+ height:300px;
+ margin: 10px;
+ padding:10px;
+ border: 2px solid gray;
+}
+
+.projectdate, .technology {
+ margin-top: 10px;
+}
+
+.projectdescription {
+ /*border: 10px dotted yellow;*/
+ line-height: 1.4em;
+
+
+}
+
+/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*ABOUT ME PAGE*/
+
+.about-me {
+
+}
+
+.introduction {
+ display: flex;
+ /*width: 60%;*/
+ justify-content:center;
+ align-items: center;
+ /*width: 960px;*/
+ /*border: 10px dotted blue;*/
+ padding-top: 50px;
+}
+
+.about-me-photo {
+ /*order: 2;*/
+ max-width: auto;
+ max-height: 300px;
+ /*border: 10px dotted purple;*/
+
+}
+
+.about-me-text {
+ /*order: 1;*/
+ width:600px;
+ /*align-self:center;*/
+ /*border: 10px dotted purple;*/
+ padding-left: 50px;
+}
+
+.about-me-text ul {
+ line-height: 1.3em;
+
+}
+
+ 
+
+ 
+ 
+ 
+ 
+
+ 
+