calibre-web/views/css/style.less

body{
background: #e1e4eb;
background: -moz-linear-gradient(-45deg,  #e1e4eb 0%, #fbfbfb 49%, #edeef2 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#e1e4eb), color-stop(49%,#fbfbfb), color-stop(100%,#edeef2));
background: -webkit-linear-gradient(-45deg,  #e1e4eb 0%,#fbfbfb 49%,#edeef2 100%);
background: -o-linear-gradient(-45deg,  #e1e4eb 0%,#fbfbfb 49%,#edeef2 100%);
background: -ms-linear-gradient(-45deg,  #e1e4eb 0%,#fbfbfb 49%,#edeef2 100%);
background: linear-gradient(135deg,  #e1e4eb 0%,#fbfbfb 49%,#edeef2 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1e4eb', endColorstr='#edeef2',GradientType=1 );
//http://www.colorzilla.com/gradient-editor/#e1e4eb+0,fbfbfb+49,edeef2+100;Custom
color: #7c7e93;
}

.overlay{
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    position: fixed;
    display: none;
}

.pagetitle{
    text-shadow: 0px 2px 3px #fff;
    color: #9da5b2;
    padding-top: 20px;
}

.index, .single{

    .row{
        margin-top: 30px;

        &:last-child{
            margin-bottom: 100px
        }
    }


    .book{
        padding: 10px;
        border: 1px solid #d9dadf;
        background: #eae9ef;
        background: -moz-linear-gradient(left, #eae9ef 0%, #fbfbfb 49%, #eae9ef 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#eae9ef), color-stop(49%,#fbfbfb), color-stop(100%,#eae9ef));
        background: -webkit-linear-gradient(left, #eae9ef 0%,#fbfbfb 49%,#eae9ef 100%);
        background: -o-linear-gradient(left, #eae9ef 0%,#fbfbfb 49%,#eae9ef 100%);
        background: -ms-linear-gradient(left, #eae9ef 0%,#fbfbfb 49%,#eae9ef 100%);
        background: linear-gradient(to right, #eae9ef 0%,#fbfbfb 49%,#eae9ef 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eae9ef', endColorstr='#eae9ef',GradientType=1 );
        box-shadow: 0 10px 10px -6px #898ea4;
        xborder-bottom: 1px solid #898ea4;



        .title{
            padding-top: 10px;
            color: #9da5b2;
            font-weight: bold;
            text-transform: uppercase;
            font-size: 20px;
            width: 100%;
            height: auto;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            line-height: 20px;
            text-shadow: 0px 2px 3px #fff;
        }

        .cover{
            height: 300px;
            overflow: hidden;
            border: 1px solid #999;

            img{
                border: 1px solid #333;
                width: 100%;
            }
        }
    }
}

.single{
    .cover{
        height: auto !important
    }

    .content{
        font-size: 16px;
    }

    .button{
        padding: 10px;
        border: 1px solid #d9dadf;
        background: #fbfbfb;
        background: -moz-linear-gradient(top,  #fbfbfb 0%, #eae9ef 98%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(98%,#eae9ef));
        background: -webkit-linear-gradient(top,  #fbfbfb 0%,#eae9ef 98%);
        background: -o-linear-gradient(top,  #fbfbfb 0%,#eae9ef 98%);
        background: -ms-linear-gradient(top,  #fbfbfb 0%,#eae9ef 98%);
        background: linear-gradient(to bottom,  #fbfbfb 0%,#eae9ef 98%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#eae9ef',GradientType=0 );
        box-shadow: 0 10px 10px -6px #898ea4;
        border-bottom: 1px solid #898ea4;
        display: inline-block;
    }

    // .tags:after{
    //     content: ",";
    // }

}