style.css

/**
 * Block Style: Rotate
 */

.is-style-rotate:not(.is-selected) {
	animation: spin 20s linear infinite;
}

@media (prefers-reduced-motion) {
	.is-style-rotate:not(.is-selected)  {
		animation: initial;
	}
}

@keyframes spin { 
	100% {
		-webkit-transform: rotate(360deg);
		transform:rotate(360deg); 
	}
}


/**
 * Block Style: Jazz Cover
 */

.is-style-jazz-cover {
	position: relative;
	transition: clip-path 0.2s;
	clip-path: polygon(43.27% 0.60%, 56.33% 0.07%, 57.39% 53.00%, 59.26% 26.94%, 72.26% 28.84%, 71.70% 36.61%, 83.14% 36.00%, 83.93% 66.60%, 87.00% 22.03%, 100.00% 23.85%, 95.69% 86.64%, 84.42% 85.06%, 84.78% 99.05%, 71.72% 99.74%, 70.51% 53.24%, 67.76% 91.60%, 54.76% 89.70%, 56.66% 63.17%, 44.54% 63.67%, 43.74% 23.94%, 40.64% 83.57%, 27.61% 82.19%, 27.98% 75.10%, 17.79% 74.83%, 18.69% 84.58%, 5.73% 87.01%, 0.00% 24.45%, 12.96% 22.03%, 15.60% 50.87%, 16.11% 11.68%, 29.18% 12.03%, 28.48% 65.48%, 30.88% 19.27%, 43.67% 20.63%, 43.27% 0.60%);
}

.is-style-jazz-cover img {
	filter: grayscale(100%) contrast(200%);
}

.is-style-jazz-cover:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: url('./assets/noise.gif');
	background-size: 2048px 2048px;
	z-index: 500;
	mix-blend-mode: exclusion;
	filter: grayscale(100%) contrast(200%);
}

.is-style-jazz-cover:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: red;
	z-index: 501;
	opacity: 0.9;
	filter: contrast(80%);
	mix-blend-mode: multiply;
}

.is-style-jazz-cover:hover {
  clip-path: polygon(41.19% 2.64%, 55.79% 0.00%, 57.49% 19.17%, 57.49% 18.93%, 72.21% 19.42%, 71.93% 36.30%, 82.67% 34.29%, 83.70% 45.43%, 85.31% 21.96%, 99.96% 24.01%, 95.65% 86.80%, 87.40% 85.65%, 88.43% 96.84%, 73.84% 99.58%, 71.34% 72.45%, 71.18% 82.49%, 56.46% 82.00%, 56.76% 63.42%, 46.72% 65.23%, 45.09% 46.80%, 43.18% 83.68%, 28.50% 82.12%, 29.10% 70.59%, 21.53% 70.39%, 23.43% 82.99%, 9.28% 87.33%, 0.00% 25.65%, 14.15% 21.31%, 15.78% 32.20%, 16.11% 7.14%, 30.83% 7.54%, 30.31% 47.29%, 31.77% 19.20%, 42.76% 20.37%, 41.19% 2.64%);
}

.is-style-jazz-cover figcaption {
	display: none;
}


/**
 * Block Style: Photocopy Image
 */

.wp-block-image.is-style-photocopy {
	position: relative;
}

.wp-block-image.is-style-photocopy img {
	filter: grayscale(100%) contrast(800%);
}

.wp-block-image.is-style-photocopy:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: url('./assets/noise.gif');
	background-size: 2048px 2048px;
	z-index: 500;
	mix-blend-mode: exclusion;
	filter: grayscale(100%) contrast(200%);
}

/* Use a higher-resolution noise pattern on high-res screens */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	.wp-block-image.is-style-photocopy:before {
		background-size: 1024px 1024px;
	}
}

svg.photocopier-svg-filter {
	position: absolute;
	height: 0;
	width: 0;
}

/* Try not to overlap the caption in the editor ¯\_(ツ)_/¯ */
.wp-block-image.is-selected.is-style-photocopy:before
.wp-block-image.is-focused.is-style-photocopy:before {
	bottom: calc( 1.5em + 13px );
}


/**
 * Block Style: Warped Text
 */

h1.is-style-warped:not(.is-selected),
h2.is-style-warped:not(.is-selected),
h3.is-style-warped:not(.is-selected),
h4.is-style-warped:not(.is-selected),
h5.is-style-warped:not(.is-selected),
h6.is-style-warped:not(.is-selected) {
	filter: url(#photocopy-filter-warp-text);
	transform: scale(1,2) translateY(-15%);
}


/**
 * Block Style: Baseline Shift
 */

.is-style-baseline-shift > span {
	position: relative;
	transition: all 0.4s ease-in-out;
}

.is-style-baseline-shift:hover > span {
	top: 0 !important;
}

.is-style-baseline-shift > span:nth-child(5n+1),
.is-style-baseline-shift > span:nth-child(5n+4) {
	top: 0;
}

.is-style-baseline-shift > span:nth-child(6n+2) {
	top: 0.25em;
}

.is-style-baseline-shift > span:nth-child(10n+5) {
	top: 0.5em;
}

.is-style-baseline-shift > span:nth-child(10n+3),
.is-style-baseline-shift > span:nth-child(10n+7) {
	top: -0.25em;
}

.is-style-baseline-shift > span:nth-child(10n+10) {
	top: -0.5em;
}

/**
 * Block Style: Baseline Shift (Intense)
 */

.is-style-baseline-shift-intense > span {
	position: relative;
	transition: all 2s ease-in-out;
}

.is-style-baseline-shift-intense:hover > span {
	top: 0 !important;
	right: 0 !important;
	left: 0 !important;
}

.is-style-baseline-shift-intense > span:nth-child(5n+1),
.is-style-baseline-shift-intense > span:nth-child(5n+4) {
	top: 0;
	left: -1.5em;
}

.is-style-baseline-shift-intense > span:nth-child(6n+2) {
	top: 1em;
	right: 0.5em;
}

.is-style-baseline-shift-intense > span:nth-child(10n+5) {
	top: 2em;
	right: 1em;
}

.is-style-baseline-shift-intense > span:nth-child(10n+3),
.is-style-baseline-shift-intense > span:nth-child(10n+7) {
	top: -1em;
}

.is-style-baseline-shift-intense > span:nth-child(10n+10) {
	top: -2em;
	left: 2em;
}

/**
 * Block Style: Photocopy Collage
 */

/* Gallery Shared Rules */

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) {
	position: relative;
	flex-wrap: nowrap;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
}

.wp-block-gallery.blocks-gallery-grid.has-nested-images.columns-default.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) figure.wp-block-image {
	width: 100% !important;
	margin: 0;
	padding: 0;
}

.wp-block-gallery.is-style-collage-stacked .wp-block-image {
	filter: grayscale(100%) contrast(800%);
	object-fit: cover;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image figcaption {
	display: none;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected):before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: url('./assets/noise.gif');
	background-size: 125px 125px;
	z-index: 500;
	mix-blend-mode: exclusion;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:not(:nth-child(2)) {
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: cover;
	-webkit-mask-size: cover;
	mask-position: center;
	-webkit-mask-position: center;
}

/* Gallery Individual Rules */

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:first-child {
	z-index: 2;
	mask-image: url('./assets/tear-a.svg');
	-webkit-mask-image: url('./assets/tear-a.svg');
	height: 400px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(2) {
	z-index: 1;
	margin-top: -100px !important;
	height: 500px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(2):last-child {
	margin-top: -100px !important;
	height: 400px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(3) {
	z-index: 2;
	mask-image: url('./assets/tear-b.svg');
	-webkit-mask-image: url('./assets/tear-b.svg');
	height: 500px;
	margin-top: -130px !important;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(3):last-child {
	margin-top: -100px !important;
	height: 400px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(4) {
	z-index: 3;
	mask-image: url('./assets/tear-c.svg');
	-webkit-mask-image: url('./assets/tear-c.svg');
	height: 700px;
	margin-top: -350px !important;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(4):last-child {
	margin-top: -300px !important;
	height: 600px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(5) {
	z-index: 4;
	mask-image: url('./assets/tear-d.svg');
	-webkit-mask-image: url('./assets/tear-d.svg');
	height: 700px;
	margin-top: -350px !important;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(5):last-child {
	margin-top: -300px !important;
	height: 600px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(6) {
	z-index: 5;
	mask-image: url('./assets/tear-e.svg');
	-webkit-mask-image: url('./assets/tear-e.svg');
	height: 700px;
	margin-top: -350px !important;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(6):last-child {
	margin-top: -300px !important;
	height: 600px;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(7) {
	z-index: 5;
	mask-image: url('./assets/tear-f.svg');
	-webkit-mask-image: url('./assets/tear-f.svg');
	height: 700px;
	margin-top: -350px !important;
}

.wp-block-gallery.is-style-collage-stacked:not(.is-selected):not(.has-child-selected) .wp-block-image:nth-child(7):last-child {
	margin-top: -300px !important;
	height: 600px;
}