.dw-notepad {
	background-color: var(--wp--preset--color--base);
	border: solid 1px hsla(0, 0%, 0%, 0.1);
	padding: 0;
	box-shadow: var(--wp--preset--shadow--lifted);
}

.dw-notepad__clips {
	position: relative;
	top: -.5rem;
	width: 100%;
	height: 2rem;
	background-size: 2rem 2rem;
	background-position: center;
	background-repeat: repeat-x;
	background-image: url("data:image/svg+xml,%3Csvg width='14' height='28' viewBox='0 0 14 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6.99096' cy='20.8833' r='6.44481' stroke='black' stroke-opacity='0.2'/%3E%3Cpath d='M6.34817 23.3862C6.34817 24.1763 5.70536 24.8205 4.91704 24.8205C4.12872 24.8205 3.47381 24.1763 3.47381 23.3862V2.05419C3.47381 1.25196 4.11659 0.607742 4.91704 0.607742C5.70536 0.607742 6.34817 1.25196 6.34817 2.05419V23.3862Z' fill='%23A4A7A9'/%3E%3Cpath d='M4.90493 25.4282C3.77702 25.4282 2.85529 24.5045 2.85529 23.3862V2.05419C2.85529 0.92378 3.77702 0 4.90493 0C6.03285 0 6.94244 0.92378 6.94244 2.05419V23.3862C6.94244 24.5166 6.02072 25.4282 4.90493 25.4282ZM4.90493 1.2155C4.44407 1.2155 4.06809 1.5923 4.06809 2.05419V23.3862C4.06809 23.8481 4.44407 24.2127 4.90493 24.2127C5.3658 24.2127 5.72964 23.8359 5.72964 23.3862V2.05419C5.72964 1.5923 5.35367 1.2155 4.90493 1.2155Z' fill='%237B7D80'/%3E%3Cpath d='M10.5202 23.3862C10.5202 24.1763 9.87742 24.8205 9.0891 24.8205C8.28865 24.8205 7.64587 24.1763 7.64587 23.3862V2.05419C7.64587 1.25196 8.28865 0.607742 9.0891 0.607742C9.87742 0.607742 10.5202 1.25196 10.5202 2.05419V23.3862Z' fill='%23A4A7A9'/%3E%3Cpath d='M9.0891 25.4282C7.96119 25.4282 7.03945 24.5045 7.03945 23.3862V2.05419C7.03945 0.92378 7.96119 0 9.0891 0C10.217 0 11.1266 0.92378 11.1266 2.05419V23.3862C11.1266 24.5166 10.2049 25.4282 9.0891 25.4282ZM9.0891 1.2155C8.62823 1.2155 8.25226 1.5923 8.25226 2.05419V23.3862C8.25226 23.8481 8.62823 24.2127 9.0891 24.2127C9.54996 24.2127 9.91383 23.8359 9.91383 23.3862V2.05419C9.91383 1.5923 9.53784 1.2155 9.0891 1.2155Z' fill='%237B7D80'/%3E%3C/svg%3E%0A");
}

.dw-notepad__padder { padding: 0 var(--wp--preset--spacing--20) var(--wp--preset--spacing--20) var(--wp--preset--spacing--20) }

.dw-notepad__paper {
	border-radius: 1rem;
	background-color: white;
	padding: var(--wp--preset--spacing--30) 0;
}

.dw-notepad__lines {
	background-size: 100% .5rem;
	background-image: url("data:image/svg+xml,%3Csvg width='274' height='2' viewBox='0 0 274 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='0.989243' y1='0.975708' x2='273.785' y2='0.975708' stroke='%23DDDDDD' stroke-opacity='0.5'/%3E%3C/svg%3E%0A");
	background-repeat: repeat-y;
	background-position: top left;

	text-align: center;
	font-style: italic;
	font-size: var(--wp--preset--font-size--medium-small);
}