diff --git a/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project02.scssc b/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project02.scssc
index df74c2c7fa3bd8135615f7e29fb916eb9a840683..160b4dc2715b41eea6443ebaa26f293236c4b47f 100644
Binary files a/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project02.scssc and b/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project02.scssc differ
diff --git a/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project03.scssc b/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project03.scssc
new file mode 100644
index 0000000000000000000000000000000000000000..5c8d187bf5ff65f66eb732a27dfafa5d6e0db683
Binary files /dev/null and b/chapter03/.sass-cache/01363d946bf787a990a37bfafc7390c7b38c4af2/chapter03-project03.scssc differ
diff --git a/chapter03/chapter03-project03.html b/chapter03/chapter03-project03.html
index 5bdf7b47fefde149ddcf62df9bae569b9711d73a..f9285d14393b5baced7789f9cd1e623147ea8558 100644
--- a/chapter03/chapter03-project03.html
+++ b/chapter03/chapter03-project03.html
@@ -4,6 +4,10 @@
<meta charset="utf-8">
<title>Hypothetical Art Store</title>
+ <link rel= "stylesheet" type="text/css" href= "css/reset.css" />
+ <link rel= "stylesheet" type="text/css" href= "css/chapter03-project03.css" />
+
+ <link href="https://fonts.googleapis.com/css?family=Six+Caps" rel="stylesheet">
</head>
<body>
<header>
diff --git a/chapter03/css/chapter03-project02.css b/chapter03/css/chapter03-project02.css
index 4e6f9d3cfec3d8d0b569db3cfd3dc1ae3ecfcb45..dad03e5ff7778d1d92d8af81553e852078d66681 100644
--- a/chapter03/css/chapter03-project02.css
+++ b/chapter03/css/chapter03-project02.css
@@ -1,4 +1,4 @@
-/* CSS for chapter03-project01 */
+/* CSS for chapter03-project02 */
/* Declare variables. */
/* Actual CSS. Organization simplified due to simplicity of project. */
a[href^="mailto"] {
diff --git a/chapter03/css/chapter03-project03.css b/chapter03/css/chapter03-project03.css
new file mode 100644
index 0000000000000000000000000000000000000000..84ca6ac19052977a98305c5abe13132634c78eec
--- /dev/null
+++ b/chapter03/css/chapter03-project03.css
@@ -0,0 +1,64 @@
+/* CSS for chapter03-project01 */
+/* Declare variables. */
+/* Actual CSS. Organization simplified due to simplicity of project. */
+body {
+ background: url(../images/art-background4.jpg);
+ background-size: cover;
+ background-repeat: no-repeat; }
+
+header {
+ width: 35%;
+ margin-left: 12%;
+ padding-left: 1em;
+ background-color: #ffffff; }
+
+header h1 {
+ padding-top: 0.5em;
+ padding-bottom: 0.2em;
+ font-family: 'Six Caps', sans-serif;
+ font-size: 3.5em; }
+header h2 {
+ font-size: 0.8em;
+ padding-bottom: 3em; }
+
+article {
+ display: flex;
+ flex-direction: column;
+ width: 50%;
+ min-height: 17em;
+ margin-top: 10em;
+ margin-left: 12%;
+ background-color: rgba(192, 192, 192, 0.6); }
+
+article h2 {
+ padding-top: 0.6em;
+ padding-bottom: 0.6em;
+ padding-left: 0.4em;
+ font-size: 1.5em;
+ background-color: rgba(192, 192, 192, 0.6); }
+article p {
+ display: flex;
+ flex-grow: 1;
+ align-items: center;
+ margin-left: 1em;
+ font-size: 1.5em;
+ font-weight: bold; }
+article #timeline {
+ justify-content: center;
+ width: 70%;
+ margin-bottom: 1em;
+ margin-left: 1em;
+ color: #ffffff;
+ background-color: rgba(0, 0, 0, 0.6); }
+article footer {
+ padding-top: 1em;
+ padding-bottom: 1em;
+ padding-left: 2em;
+ background-color: #ffffff; }
+article footer footer {
+ float: left;
+ margin-bottom: 0;
+ padding-bottom: 0;
+ background: url(../images/email.png) no-repeat 0 3px; }
+
+/*# sourceMappingURL=chapter03-project03.css.map */
diff --git a/chapter03/css/chapter03-project03.css.map b/chapter03/css/chapter03-project03.css.map
new file mode 100644
index 0000000000000000000000000000000000000000..d09f27cf6576685ebcb00abd8509e01ff8f82df9
--- /dev/null
+++ b/chapter03/css/chapter03-project03.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AACA,iCAAiC;AAEjC,wBAAwB;AASxB,uEAAuE;AAEvE,IAAK;EACD,UAAU,EAAE,kCAAkC;EAC9C,eAAe,EAAE,KAAK;EACtB,iBAAiB,EAAE,SAAS;;AAGhC,MAAO;EACH,KAAK,EAAE,GAAG;EACV,WAAW,EAAE,GAAG;EAChB,YAAY,EAAE,GAAG;EAEjB,gBAAgB,EApBN,OAAO;;AAyBjB,SAAG;EACC,WAAW,EAAE,KAAK;EAClB,cAAc,EAAE,KAAK;EAErB,WAAW,EAAE,sBAAsB;EACnC,SAAS,EAAE,KAAK;AAGpB,SAAG;EACC,SAAS,EAAE,KAAK;EAEhB,cAAc,EAAE,GAAG;;AAI3B,OAAQ;EACJ,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,KAAK,EAAE,GAAG;EACV,UAAU,EAAE,IAAI;EAChB,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,GAAG;EAEhB,gBAAgB,EA7CG,wBAAwB;;AAkD3C,UAAG;EACC,WAAW,EAAE,KAAK;EAClB,cAAc,EAAE,KAAK;EACrB,YAAY,EAAE,KAAK;EAEnB,SAAS,EAAE,KAAK;EAEhB,gBAAgB,EAzDD,wBAAwB;AA4D3C,SAAE;EACE,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,MAAM;EAEnB,WAAW,EAAE,GAAG;EAEhB,SAAS,EAAE,KAAK;EAChB,WAAW,EAAE,IAAI;AAGrB,iBAAU;EACN,eAAe,EAAE,MAAM;EAEvB,KAAK,EAAE,GAAG;EACV,aAAa,EAAE,GAAG;EAClB,WAAW,EAAE,GAAG;EAEhB,KAAK,EAjFC,OAAO;EAmFb,gBAAgB,EA9EA,kBAAkB;AAiFtC,cAAO;EACH,WAAW,EAAE,GAAG;EAChB,cAAc,EAAE,GAAG;EACnB,YAAY,EAAE,GAAG;EAGjB,gBAAgB,EA5FV,OAAO;AAiGb,qBAAO;EACH,KAAK,EAAE,IAAI;EACX,aAAa,EAAE,CAAC;EAChB,cAAc,EAAE,CAAC;EAEjB,UAAU,EAAE,wCAAwC",
+"sources": ["sass/chapter03-project03.scss"],
+"names": [],
+"file": "chapter03-project03.css"
+}
\ No newline at end of file
diff --git a/chapter03/css/sass/chapter03-project02.scss b/chapter03/css/sass/chapter03-project02.scss
index ca34957121337f960aa5f49f0674d5ecc6bb61ae..1a3cb35f72cb8ffb99b77ae97d5f8adb47d35131 100644
--- a/chapter03/css/sass/chapter03-project02.scss
+++ b/chapter03/css/sass/chapter03-project02.scss
@@ -1,5 +1,5 @@
-/* CSS for chapter03-project01 */
+/* CSS for chapter03-project02 */
/* Declare variables. */
diff --git a/chapter03/css/sass/chapter03-project03.scss b/chapter03/css/sass/chapter03-project03.scss
new file mode 100644
index 0000000000000000000000000000000000000000..b87516a264095bb44ced6e12eef04372c7d0adfb
--- /dev/null
+++ b/chapter03/css/sass/chapter03-project03.scss
@@ -0,0 +1,111 @@
+
+/* CSS for chapter03-project01 */
+
+/* Declare variables. */
+
+$color-white: #ffffff;
+$color-black: #000000;
+
+$color-greyMidOpacity: rgba(192, 192, 192, 0.6);
+$color-greyLowOpacity: rgba(192, 192, 192, 0.4);
+$color-blackMidOpacity: rgba(0, 0, 0, 0.6);
+
+/* Actual CSS. Organization simplified due to simplicity of project. */
+
+body {
+ background: url(../images/art-background4.jpg);
+ background-size: cover;
+ background-repeat: no-repeat;
+}
+
+header {
+ width: 35%;
+ margin-left: 12%;
+ padding-left: 1em;
+
+ background-color: $color-white;
+}
+
+header {
+
+ h1 {
+ padding-top: 0.5em;
+ padding-bottom: 0.2em;
+
+ font-family: 'Six Caps', sans-serif;
+ font-size: 3.5em;
+ }
+
+ h2 {
+ font-size: 0.8em;
+
+ padding-bottom: 3em;
+ }
+}
+
+article {
+ display: flex;
+ flex-direction: column;
+ width: 50%;
+ min-height: 17em;
+ margin-top: 10em;
+ margin-left: 12%;
+
+ background-color: $color-greyMidOpacity;
+}
+
+article {
+
+ h2 {
+ padding-top: 0.6em;
+ padding-bottom: 0.6em;
+ padding-left: 0.4em;
+
+ font-size: 1.5em;
+
+ background-color: $color-greyMidOpacity;
+ }
+
+ p {
+ display: flex;
+ flex-grow: 1;
+ align-items: center;
+
+ margin-left: 1em;
+
+ font-size: 1.5em;
+ font-weight: bold;
+ }
+
+ #timeline {
+ justify-content: center;
+
+ width: 70%;
+ margin-bottom: 1em;
+ margin-left: 1em;
+
+ color: $color-white;
+
+ background-color: $color-blackMidOpacity;
+ }
+
+ footer {
+ padding-top: 1em;
+ padding-bottom: 1em;
+ padding-left: 2em;
+
+ //background: url(../images/email.png) no-repeat 0 3px;
+ background-color: $color-white;
+ }
+
+ footer {
+
+ footer {
+ float: left;
+ margin-bottom: 0;
+ padding-bottom: 0;
+
+ background: url(../images/email.png) no-repeat 0 3px;
+ }
+ }
+}