<figure title="Sample Image">
	<img src="https://uploads0.wikiart.org/images/leonardo-da-vinci.jpg!Portrait.jpg" alt="sample image" />
	<figcaption>Леонардо да Винчи</figcaption>
</figure>

<figure title="Sample Image">
	<img src="http://peika.bg/pictures/22641_650__3.jpg" alt="sample image" />
	<figcaption>Тайната вечеря</figcaption>
</figure>

<figure title="Sample Image">
	<img src="http://www.ibiblio.org/wm/paint/auth/vinci/ermine.jpg" alt="sample image" />
	<figcaption>Дамата с хермелина</figcaption>
</figure>

figure {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	border: {
		width: 10px;
		style: solid;
		top-color: #ccc;
		bottom-color: #efefef;
		left-color: #ddd;
		right-color: #ddd;
	}
	padding: 20px;
	box-shadow: 0 0 5px rgba(0,0,0,.5) inset, 0 5px 20px rgba(0,0,0,.5);
	overflow: hidden;
	&:before, &:after {
		content: '';
		display: block;
		position: absolute;
		top: 0; left: 0; right: 0; bottom: 0;
	}
	&:before {
		box-shadow: 0 0 5px black inset;
		border: 30px solid #ddc;
		z-index: -2;
	}
	&:after {
		background: transparent;
		border-top-left-radius: 300% 300%;
		box-shadow: -20px -20px 100px rgba(255,255,255,.5);
		z-index: -1;
	}
	figcaption {
		position: absolute;
		bottom: 6px;
		right: 30px;
		padding: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		display: inline-block;
		text-align: center;
		font-family: cursive;
		font-size: 16px;
		background: white;
		max-width: calc(100% - 60px);
		transition: .3s;
		transform-origin: bottom right;
		transform: scale(.6);
		cursor: -webkit-zoom-in;
		&:hover {
			transform: scale(1);
		}
	}
	img {
		height: 50vmin;
		width: auto;
		vertical-align: bottom;
		position: relative;
		z-index: -3;
	}
}

:root {
	text-align: center;
	box-sizing: border-box;
	padding: 45px;
	background: url('https://subtlepatterns.com/patterns/concrete_seamless.png') center;
	white-space: nowrap;
}
*, *:before, *:after {
	box-sizing: inherit;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.