.block-personal-note::before {
	background: url(personal-note-block.jpg) no-repeat center;
	background-size: cover;
	content: '';
	display: block;
	height: 250px;
	margin-top: calc( -1 * var(--wp--custom--layout--block-gap) );
	margin-bottom: var(--wp--custom--layout--block-gap);
}

.block-personal-note::after {
	content: "";
	display: block;
	width: 118px;
	height: 49px;
	background: url(signature.png) no-repeat left top;
	background-size: contain;
	margin-top: var(--wp--custom--layout--block-gap);
}

@media only screen and (max-width: 767px) {

	.block-personal-note.has-background {
		padding: var(--wp--custom--layout--padding);
	}

	.block-personal-note::before {
		margin-inline: calc( -1 * var(--wp--custom--layout--padding) );
		width: calc( 100% + calc( 2 * var(--wp--custom--layout--padding) ) );
	}

}

@media only screen and (min-width: 768px) {

	.block-personal-note.has-background {
		padding: 16px 32px;
	}

	.block-personal-note::before {
		margin-inline: calc( -1 * 32px );
		width: calc( 100% + calc( 2 * 32px ) );
	}

}