.film-0 {
	position: absolute;
	z-index: 1;

	width: 956px;
	height: 416px;
	grid-template-columns: 956px;
	grid-template-rows: 8px 400px 8px;
}

.redzone-1 { 
	box-sizing: border-box;
	background: linear-gradient(to bottom, rgba(145,46,23,1), rgba(33,50,75,1)); 
    	overflow: hidden;

	width: 956px;
	height: 8px;
}

.redzone-2 { 
	box-sizing: border-box;
	background: transparent; 
    	overflow: hidden;

	width: 956px;
	height: 400px;
}

.redzone-3 { 
	box-sizing: border-box;
	background: linear-gradient(to top, rgba(145,46,23,1), rgba(33,50,75,1)); 
    	overflow: hidden;

	width: 956px;
	height: 8px;
}

.film-1 {
	position: absolute;
	z-index: 2;

	width: 956px;
	height: 416px;
	grid-template-columns: 97px 24px 70px 16px 478px 16px 48px 16px 70px 24px 97px;
	grid-template-rows: 416px;
}

.bar-1 {
	box-sizing: border-box;
	background: transparent; 
    	overflow: hidden;

	box-shadow:
		0 0 4px rgba(0,0,0,0.30) inset,
		0 0 8px rgba(0,0,0,0.25) inset,
		0 0 12px rgba(0,0,0,0.20) inset,
		0 0 16px rgba(0,0,0,0.15) inset;

	width: 97px;
	height: 416px;
}

.bar-2 {
	box-sizing: border-box;
	background: rgba(0,0,0,1); 
    	overflow: hidden;

	width: 24px;
	height: 416px;
}

.bar-3 {
	width: 70px;
	height: 416px;
	grid-template-columns: 70px;
	grid-template-rows: 27px 50px 54px 50px 54px 50px 54px 50px 27px;
}

.bar-3a {
	box-sizing: border-box;
	background: rgba(0,0,0,1); 
    	overflow: hidden;

	width: 70px;
	height: 27px;
}

.bar-3b {
	box-sizing: border-box;
	background: transparent; 
    	overflow: hidden;

	width: 70px;
	height: 50px;
}

.bar-3c {
	box-sizing: border-box;
	background: rgba(0,0,0,1); 
    	overflow: hidden;

	width: 70px;
	height: 54px;
}


.bar-4 {
	box-sizing: border-box;
	background: rgba(0,0,0,1); 
    	overflow: hidden;

	width: 16px;
	height: 416px;
}

.bar-5 {
	box-sizing: border-box;
	background: rgba(0,0,0,1); 
    	overflow: hidden;

	width: 478px;
	height: 416px;
}

.bar-6 {
	box-sizing: border-box;
	background: rgba(0,162,232,0.20);
	box-shadow: 0 0 20px rgba(0,0,0,0.30) inset;
    	overflow: hidden;
	justify-items: stretch;
	align-items: stretch;
	display: grid;

	width: 48px;
	height: 416px;
	grid-template-columns: 4px 16px 8px 16px 4px;
	grid-template-rows: 
		22px 
		16px 8px 16px 
		43px
		16px 8px 16px 
		43px
		16px 8px 16px 
		43px
		16px 8px 16px 
		43px
		16px 8px 16px 
		22px;
}

/* corner cutout anti-seam safe */
.tra { background: transparent; }
.bbb { background: rgba(0,0,0,0.50); }
.llb { background: linear-gradient( to right, rgba(0,0,0,1.00) 0%, rgba(0,0,0,0.50) 75%, rgba(0,0,0,0.50) 100%); }
.rrb { background: linear-gradient( to left,  rgba(0,0,0,1.00) 0%, rgba(0,0,0,0.50) 75%, rgba(0,0,0,0.50) 100%); }
.ltc { background: radial-gradient( farthest-side at 100% 100%, transparent 0%, transparent calc(100% - 0.5px), rgba(0,0,0,0.50) 100% ); }
.rtc { background: radial-gradient( farthest-side at 0% 100%, transparent 0%, transparent calc(100% - 0.5px), rgba(0,0,0,0.50) 100% ); }
.lbc { background: radial-gradient( farthest-side at 100% 0%, transparent 0%, transparent calc(100% - 0.5px), rgba(0,0,0,0.50) 100% ); }
.rbc { background: radial-gradient( farthest-side at 0% 0%, transparent 0%, transparent calc(100% - 0.5px), rgba(0,0,0,0.50) 100%); }

.perforation-hole{
	position: relative;
	top: calc(-1 * 12px);
	left: calc(-1 * 12px);	
	width: 94px;
	height: 74px;
	background: transparent;
}

.perforation-hole::before{
	content:"";
	position:absolute;
	inset:0;
	border-radius:24px;
	background:#000;
	pointer-events:none;

	--ring: 12px;
	padding: var(--ring);

	-webkit-mask:
	linear-gradient(#fff 0 0) content-box,
	linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	-webkit-mask-repeat: no-repeat;

	mask:
	linear-gradient(#fff 0 0) content-box,
	linear-gradient(#fff 0 0);
	mask-composite: exclude;
	mask-repeat: no-repeat;
}

.viewbox {
	position: relative;
	top: 8px;
	height: 400px;
	width: 478px;
	border-radius: 16px;
	background: rgba(218,192,160,0.90);
	box-shadow:
		0 0 2px  rgba(0,0,0,0.70) inset,
		0 0 4px  rgba(0,0,0,0.60) inset,
		0 0 8px  rgba(0,0,0,0.50) inset,
		0 0 16px rgba(0,0,0,0.40) inset;
}








