How to create a responsive cover for flipbook lightbox?

Add the following code in custom CSS. Minimize the screen size to see the smaller cover size.

Green Nature

._df_thumb {
    height: 400px;
	width: 240px;
}

/*responsive*/
@media only screen and (max-width: 600px) {
	
	._df_thumb{
	height:200px;
	width: 140px;
	}
}

If you want to resize only some flipbook's cover, not all, just create a div and place the shortcode inside the div. Give the div a class, for example:

<div class="responsive_flipbooks">
 flipbook shortcode goes here
</div>

Then in custom CSS,

.responsive_flipbooks > ._df_thumb {
    height: 400px;
	width: 240px;
}

/*responsive*/
@media only screen and (max-width: 600px) {
	
	.responsive_flipbooks > ._df_thumb{
	height:200px;
	width: 140px;
	}
}