.masonry-layout.full-width-content .site-inner { max-width: 100%; }
.masonry-layout .book-item { text-align: center; }
.masonry-layout .book-item a {
    display: block;
    position: relative;
}

.masonry-layout .book-item .title {
    background: rgba(17, 17, 17, 0.78);
    color: #fff;
    bottom: 8px;
    font-size: 14px;
    padding: 20px 0px;
    position: absolute;
    text-align: center;
    width: 100%;
}

#grid[data-columns]::before {
    content: '5 .column.size-1of5';
}

/* These are the classes that are going to be applied: */
.column { float: left; }
.size-1of5 { width: 20%; padding: 0px 10px;}

@media screen and (max-width: 480px){
    #grid[data-columns]::before {
        content: '1 .column.size-1of1';
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
    #grid[data-columns]::before {
        content: '2 .column.size-1of2';
    }
}