.ACCORDION {
	max-width: 1280rem;
	margin: 0 auto;
}

.ACCORDION .row {
	padding: 30rem;
	border-radius: var(--border-radius);
	border-bottom: 1rem solid var(--light-blue);
}

.ACCORDION .row.alt-active {
	background: var(--light-blue);
}

.ACCORDION .row:not(:last-child) {
	margin-bottom: 20rem;
}

.ACCORDION .heading {
	margin: 0;
	position: relative;
}

.ACCORDION .heading h3 {
	color: var(--dark-blue);
}

.ACCORDION .toggle {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	text-indent: -9999rem;
	border: none;
	padding: 0;
	margin: 0;
	cursor: pointer;
	background: none;
}

.ACCORDION .toggle::before {
	content: '';
	position: absolute;
	top: 15rem;
	right: 0;
	width: 23rem;
    height: 13rem;
    background: url(/wp-content/themes/wp-parchment/assets/images/ui-expand.svg) no-repeat center / 100%;
}

.ACCORDION .container {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.25s;
}

.ACCORDION .content {
	margin-top: 20rem;
}

/*.ACCORDION .row.alt-active .toggle {width: 40rem;}*/
.ACCORDION .row.alt-active .toggle::before {transform: scaleY(-1);}
.ACCORDION .rows.alt-singular .row.alt-active .toggle {display: none;}

@media screen and (max-width: 960px){
	.ACCORDION .row {padding: 20rem 15rem 20rem 20rem;}
	.ACCORDION .toggle::before {top:10rem;}
	.ACCORDION .heading h3 {max-width: 90%;}
}



/* image */

.ACCORDION[data-style="image"] .rows {
	position: relative;
	padding: 0 800rem 0 0;
}

.ACCORDION[data-style="image"] .image {
	overflow: hidden;
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	width: 760rem;
	transition: opacity 0.25s;
}

.ACCORDION[data-style="image"] .row.alt-active .image {opacity:1;}

@media screen and (max-width: 960px) {
	.ACCORDION[data-style="image"] .rows {min-height: 0 !important; padding: 0;}
	.ACCORDION[data-style="image"] .image {position:static; width:auto; padding: 0 20rem 20rem;}
}