.book{padding:15px 0 0;margin:auto}


@media screen and (min-width: 0px) and (max-width: 480px) { 
    .shelf {
        border-bottom: 30px solid #a5a5a5;
        top: -20px;
        z-index: -10;
        margin-bottom: 50px;
        margin-left: -5%
    }
    .shelf:after{content:'';background:url(../img/concrete_bg_dark.jpg) top left repeat-x #686868;height:20px;/*width:calc(100% + 40px);*/position:absolute;top:30px;left:0;right:0;z-index:1;
        /*margin:0 -20px*/}
}

    @media screen and (min-width: 481px) and (max-width: 991px) {  
        .shelf{border-bottom:30px solid #a5a5a5;border-left:20px solid transparent;border-right:20px solid transparent;top:-20px;z-index:-10;margin-bottom:50px}
        .shelf:after{content:'';background:url(../img/concrete_bg_dark.jpg) top left repeat-x #686868;height:20px;width:calc(100% + 40px);position:absolute;top:30px;left:0;right:0;z-index:1;margin:0 -20px}
       
   
    }   

@media screen and (min-width: 992px) and (max-width: 1300px) { 
    .shelf {
        border-bottom: 30px solid #a5a5a5;
        /*border-left: 20px solid transparent;*/
        top: -20px;
        z-index: -10;
        margin-bottom: 50px;
        margin-left: -5%
    }
    .shelf:after{content:'';background:url(../img/concrete_bg_dark.jpg) top left repeat-x #686868;height:20px;/*width:calc(100% + 40px);*/position:absolute;top:30px;left:0;right:0;z-index:1;
        /*margin:0 -20px*/}
}  

    @media screen and (min-width: 1301px) { 
        .shelf{border-bottom:30px solid #a5a5a5;border-left:20px solid transparent;border-right:20px solid transparent;top:-20px;z-index:-10;margin-bottom:50px}
        .shelf:after{content:'';background:url(../img/concrete_bg_dark.jpg) top left repeat-x #686868;height:20px;width:calc(100% + 40px);position:absolute;top:30px;left:0;right:0;z-index:1;margin:0 -20px}
    }