blockquote
{
	border: 3px groove black;
	border-radius: 20px;
	box-shadow: 6px 6px 8px 2px #666;
	font-size: larger;
	margin: 2.5ex 4ex ! important;
	overflow-x: hidden;
	padding: 4ex;
	position: relative;
}

blockquote:not(.no-clear)
{
	clear: both;
}

blockquote.attention, blockquote.quotation
{
	border-left: none;
	border-right: none;
	padding-left: 8.5ex;
	overflow-y: hidden;
}

blockquote.attention.high
{
	border-top: 1px solid #400;
	border-bottom: 3px solid #800;
	box-shadow: 6px 6px 8px 2px #600;
	font-weight: 700;
}

blockquote.attention.normal
{
	border-top: 1px solid #044;
	border-bottom: 3px solid #088;
	box-shadow: 6px 6px 8px 2px #066;
	font-weight: 600;
}

blockquote.quotation
{
	border-bottom: 3px solid #0BB;
	border-top: 1px solid #044;
	box-shadow: 6px 6px 8px 2px #066;
}

blockquote > figcaption.visual-mark
{
	bottom: 0;
	color: white;
	display: block;
	font-size: 300%;
	border: none;
	left: 0;
	position: absolute;
	text-align: center;
	text-shadow: black 1px 1px 10px;
	top: -1px;
	width: 1.5ex;
}

blockquote > figcaption.visual-mark > span
{
	display: inline-block;
	margin-top: 0.5ex;
}

blockquote.attention.high > figcaption.visual-mark
{
	background-image: linear-gradient(120deg, #400, #800 45%, #C00);
}

blockquote.attention.normal > figcaption.visual-mark
{
	background-image: linear-gradient(120deg, #044, #088 45%, #0CC);
}

blockquote.attention > figcaption.visual-mark > span:before
{
	content: "❢";
}

blockquote.quotation > figcaption.visual-mark
{
	background-image: linear-gradient(120deg, #044, #088 45%, #0CC);
}

blockquote.quotation > figcaption.visual-mark > span
{
	bottom: 1ex;
	display: inline-block;
	left: 0;
	position: absolute;
	right: 0;
}

blockquote.quotation > figcaption.visual-mark > span:before
{
	content: "❞";
}

blockquote > figcaption:not(.visual-mark)
{
	position: absolute;
	width: 100%;
	top: 0.25em;
	left: 0;
	padding-left: calc(0.8 * 4ex);
	border-bottom: 5px silver groove;
	font-size: 120%;
	font-weight: bolder;
}