/* Owl Carousel overrides */
.owl-carousel {
	// Override inherited margin
	#main & {
		margin: 0;
	}
	.owl-controls {
		margin-bottom: -5px;
	}
	.owl-nav {
		button.owl-next, button.owl-prev {
			position: absolute;
			top: 50%;
			font-size: 4rem;
			&:hover, &:active {
				color: $accent-primary;
			}
			&.disabled {
				color: $text-disabled;
				cursor: not-allowed;
			}
		}
		button.owl-next {
			right: 0;
		}
		button.owl-prev {
			left: 0;
		}
	}
	.owl-dots {
		background: $bg-content;
		text-align: center;
	}
	button.owl-dot {
		display: inline-block;
		width: 12px;
		height: 12px;
		margin: 5px 7px;
		border: 2px solid $accent-primary;
		border-radius: 20px;
		text-indent: -9999px;
		transition: background-color .2s ease-in, border-color .2s ease-in;
	}
	.owl-dot:hover {
		background-color: $accent-primary;
	}
	.owl-dot.active {
		border-color: $accent-primary;
		background-color: $accent-primary;
	}
	.owl-video-play-icon {
		background: svg-load("../.build/svgmin/play.svg") top center no-repeat;
	}
}

.viewer .item {
	display: block;
}
.viewer.owl-carousel .item {
	height: 20em;
	color: $white;
	text-align: left;
	img {
		width: auto;
		max-width: 100%;
	}
}
.thumbs.owl-carousel {
	margin-top: 1.5em;
	.item {
		width: 90%;
		padding-top: 66%;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		text-align: center;
		cursor: pointer;
	}
}
@media (min-width: 800px) {
	.viewer.owl-carousel .item {
		height: 25em;
		img {
			max-width: 100%;
		}
	}
}