1 files changed, 118 insertions, 4 deletions
diff --git a/design/sass/_books.scss b/design/sass/_books.scss
index 3ed8e2e..ec81b7e 100644
--- a/design/sass/_books.scss
+++ b/design/sass/_books.scss
@@ -1,3 +1,80 @@
+.book-list {
+    @extend %clearfix;
+    @include constrain_wide;
+}
+
+.book-list-item {
+    margin: 2em 0;
+    h2 {
+        text-align: left;
+        margin: .25rem 4px;
+        font-weight: normal;
+        @include fontsize(24);
+        line-height: 1.2;
+        a {
+            color: $body_font;
+            text-decoration: none;
+            font-style: italic;
+        }
+        @include breakpoint(gamma) {
+            @include fontsize(22);
+            margin: .1rem 4px;
+        }
+    }
+    h4, {
+        @include fontsize(12);
+        @include smcaps;
+        font-weight: normal;
+        margin-top: 0;
+        margin-bottom: 0;
+        &:before {
+            content: "by "
+        }
+    }
+    @include breakpoint(alpha-2) {
+        text-align: left;
+        width: 45%;
+        float: left;
+        margin-right: 30px;
+        margin-top: 1em;
+        min-height: 500px;
+        .img-wrapper {
+            min-height: 350px;
+        }
+    }
+    @include breakpoint(gamma) {
+        width: 31%;
+        height: 650px;
+        float: left;
+        margin-right: 30px;
+        .img-wrapper {
+            min-height: 400px;
+        }
+    }
+    @include breakpoint(delta) {
+        width: 22%;
+        height: 550px;
+    }
+}
+.book-list .even {
+    @include breakpoint(alpha-2) {
+        margin-right: 0;
+    }
+    @include breakpoint(gamma) {
+        margin-right: 30px;
+    }
+}
+.book-list .tres {
+    @include breakpoint(gamma) {
+        margin-right: 0;
+    }
+    @include breakpoint(delta) {
+        margin-right: 30px;
+    }
+}
+.book-stars {
+    display: block;
+}
 .book {
     margin-top: 2em;    
     @include breakpoint(gamma) {
@@ -14,7 +91,6 @@
     }
 }
 .book-metadata {
-    @extend %clearfix;
     text-align: left;
     dd {
       display: inline;
@@ -30,27 +106,65 @@
     dt:after {
         content: ":";
     }
+    @include breakpoint(gamma) {
+        margin-left: 80px;
+    }
 }
 .book-title {
-    @include constrain_narrow;
+    @include constrain_wide;
     line-height: 1.3;
+    @include breakpoint(gamma) {
+        max-width: 660px;
+        text-align: left;
+        position: relative;
+        left: 150px;
+    }
+    @include breakpoint(delta) {
+        left: 165px;
+        max-width: 850px;
+    }
 }
-.book-cover {
+.book-cover-wrapper {
+    @include breakpoint(gamma) {
+        display: block;
+        @include constrain_wide;
+        img {
+            float: left;
+            width: 250px; 
+            margin-right: 32px;
+        }
+    }
+    @include breakpoint(delta) {
+        img {
+            max-width: 250px; 
+        }
+    }
 }
 .thoughts, .highlights, .meta-cover {
     @include constrain_narrow;
     text-align: left;
     p {
         max-width: 100%;
+        @include breakpoint(gamma) {
+            margin-left: 80px;
+        }
     }
 }
-.thoughts h5, .highlights h4, .meta-cover h5 {
+.meta-cover {
+}
+.thoughts h5, .highlights h4 {
     font-weight: 500;
     letter-spacing: 1px;
     margin: 3em 0 .5em 0;
     @include generic_sans;
     @include smcaps;
     @include fontsize(14);
+    @include breakpoint(gamma) {
+        margin-left: 80px;
+    }
+}
+.highlights article:first-of-type {
+    margin-top: 1em;
 }
 .highlights .foot {
     @include fontsize(14);