.break {
	position: relative;
	padding: 13vh 0 7vh;
	z-index: 40; }

	.break .container {	
		position: relative; 
		z-index: 5; }

	.break.left .container { 
		padding-left: 25%; }
	.break.right .container { 
		padding-right: 25%; }

.break .sup {
	color: var(--bexco-zwei);
	text-transform: uppercase;
	font-family: var(--bexco-bold);
	font-size: 8vw;
	font-weight: 800;
	line-height: 0.8; }

	.break .sup .outline {
		color: var(--bexco-dark);
		letter-spacing: 2px;
		text-shadow: -1px -1px 0 var(--bexco-zwei), 1px -1px 0 var(--bexco-zwei), -1px 1px 0 var(--bexco-zwei), 1px 1px 0 var(--bexco-zwei); }

.break .sub {
	color: var(--bexco-lite);
	font-weight: 300;
	padding: 40px 0; }

.break .break-image {
	position: absolute;
	width: 25vw;
	height: 25vw;
	background-position: center;
	background-size: cover;
	transform: scale(0);
	transition: 0.3s;
	clip-path: polygon(0% 50%, 50% 0%, 100% 50%, 50% 100%);
	z-index: 1; }

	.break.open .break-image {
		transition: 0.6s; }

	.break.right .break-image.eins {
	    top: 12vw;
    	right: 2vw; }
	.break.right .break-image.zwei {
	    top: -5vw;
    	right: -9vw; }
	.break.right .break-image.color {
		background: linear-gradient(to top, var(--bexco-zwei) 0%, var(--bexco-eins) 100%);
    	top: 4vw;
    	right: -18vw; }

	.break.left .break-image.eins {
    	top: 5vw;
    	left: -5vw; }
	.break.left .break-image.zwei {
    	top: 21vw;
    	left: 12vw; }
	.break.left .break-image.color {
		background: linear-gradient(to top, var(--bexco-zwei) 0%, var(--bexco-eins) 100%);
	    top: 25vw;
    	left: -13vw; }

	.break.right.open .break-image.eins {
		transform: scale(1.5);
		transition-delay: 0.4s; }
	.break.right.open .break-image.zwei {
	    transform: scale(0.7);
		transition-delay: 0.6s; }
	.break.right.open .break-image.color {
	    transform: scale(0.7);
		transition-delay: 0.8s; }

	.break.left.open .break-image.eins {
		transform: scale(1.7);
		transition-delay: 0.4s; }
	.break.left.open .break-image.zwei {
		transform: scale(0.9);
		transition-delay: 0.6s; }
	.break.left.open .break-image.color {
		transform: scale(0.5);
		transition-delay: 0.8s; }

.break .form {
	display: flex;
	justify-content: space-between;
	gap: 1px; }
	.break .form .field {
		width: 75%; }
	.break .form .submit {
		width: 25%; }


@media (max-width: 900px) { 
	.break { width: 100%; overflow: hidden; }
	.break .container {	
		padding: 0 30px !important; }
	.break .sup { 
		font-size: 30vw; }


	.break.right.open .break-image.eins {
		transform: scale(3);
		opacity:  0.7;
		transition-delay: 0.4s; }
	.break.right.open .break-image.zwei {
	    display: none; }
	.break.right.open .break-image.color {
	    display: none; }

	.break.left.open .break-image.eins {
		top: 20vw;
        left: unset;
        right: 2vw;
		transform: scale(3);
		opacity:  0.7;
		transition-delay: 0.4s; }
	.break.left.open .break-image.zwei {
		display: none; }
	.break.left.open .break-image.color {
		display: none; }

	.break .form .field {
		width: 60%; }
	.break .form .submit {
		width: 40%; }
}