accordion-view {
	display: block;
	position: relative;
	height: 100%;
	overflow: hidden;
}

accordion-view .accordionContainer {
	/* .accordionContainer will be 100% of the width of its parent. Each of the panels inside it will be 50% wide. */
	/* If more than two panels are present, they will overflow .accordionContainer. THIS IS DELIBERATE! */
	/* If you need to apply a background or something, do it to accordion-view or the .panel elements. */
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	white-space: nowrap;
	position: absolute;
}

accordion-view .panel {
	position: relative;
	display: inline-block;
	width: 50%;
	height: 100%;
	vertical-align: top;
	border-right: 2px solid black;
	box-sizing: border-box; /* This prevents the border from appearing on the left */
}

accordion-view .panel > .backgroundHighlight {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
}

accordion-view .panel > .backgroundHighlight.linked {
	opacity: 0.3;
}

accordion-view .panel.containsFocus > .backgroundHighlight {
	opacity: 0.5;
}