.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;
        }
    }
    img { max-width: 100%;}
    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: 23%;
        margin-right: 25px;
        height: 550px;
    }
}
.book-list .even {
    @include breakpoint(alpha-2) {
        margin-right: 0;
    }
    @include breakpoint(gamma) {
        margin-right: 25px;
    }
}
.book-list .tres {
    @include breakpoint(gamma) {
        margin-right: 0;
    }
    @include breakpoint(delta) {
        margin-right: 25px;
    }
}
.book-stars {
    display: block;
}
.book {
    margin-top: 2em;    
    @include breakpoint(gamma) {
        margin-top: 3em;    
    }
}
.book:after {
    @include constrain_narrow;
    color: white;
    @include faded_line_after;
    margin-top: 2em;
    @include breakpoint(gamma) {
        margin-top: 3em;    
    }
}
.book-title {
    @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-wrapper {
    @include breakpoint(gamma) {
        display: block;
        @include constrain_wide;
        img {
            float: left;
            width: 250px; 
            margin-right: 32px;
        }
    }
    @include breakpoint(delta) {
        img {
            max-width: 250px; 
        }
    }
}