.events-panel {
	--torn-jean-size: calc(100% * 3 / 260);

	position: relative;
	padding-top: var(--torn-jean-size);
	padding-bottom: var(--torn-jean-size);
	margin-bottom: 40px;
}

.events-panel .jean-background {
	height: 100%;
	width: 100%;
	background-image: url(/includes/public/assets/shared/jean-texture.svg);
	background-size: cover;
	background-position: center;
	position: absolute;
	background-color: #1e3d6c;
	bottom: 0;
	pointer-events: none;
}

.events-panel .jean-background:before,
.events-panel .jean-background:after {
	content: '';
	background-image: url(/includes/public/assets/shared/jean-top-texture.svg);
	width: 100%;
	height: 0;
	padding-top: var(--torn-jean-size);;
	background-size: 100%;
	position: absolute;
	bottom: 100%;
	pointer-events: none;
}

.events-panel .jean-background:after {
	background-image: url(/includes/public/assets/shared/jean-bottom-texture.svg);
	bottom: unset;
	top: 100%;
}
@media (min-width: 40em) {
	.events-panel {
		padding-top: var(--torn-jean-size);
		padding-top: 0;
	}

	.events-panel .jean-background {
		height: calc(100% - var(--torn-jean-size) - 4px)
	}
}

@media (min-width: 64em) {
	.events-panel {
		margin-bottom: 55px;
	}
}