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

pages-view .pagesContainer {
	/* .pagesContainer will be 100% of the width of its parent. Each of the columns inside it will be 50% wide. */
	/* If more than one page is present, they will overflow .pagesContainer. THIS IS DELIBERATE! */
	/* If you need to apply a background or something, do it to pages-view or the .pagesViewPage elements. */
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	white-space: nowrap;
	position: absolute;
	left: 0;
	top: 0;
}

pages-view .pagesViewPage {
	display: inline-block;
	position: relative;
	width: 100%;
	height: 100%;
	/*transform: translateZ(0);*/
	box-sizing: border-box;
	vertical-align: top;
	white-space: normal;
}

pages-view .pagesViewPage > .backgroundHighlight {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	/*transform: translateZ(0);*/
	/*transition: opacity 0.3s linear;*/ /* This transition just causes lag, and the lag it causes prevents it from animating anyway */
}

pages-view .pagesViewPage > .backgroundHighlight.linked {
	opacity: 0.2;
}

pages-view .pagesViewPage.tizenhovered > .backgroundHighlight {
	opacity: 0.5;
}

pages-view .pagesViewPage {
	border-right: 4px solid;
}