:root {
	--thumb-size: 50px;
}

.mixSlide-frame {
	z-index: 10;
}

.mixSlide-frame * {
	transition: all 0s ease;
}

.mixSlide-frame.fullscreen {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	background: rgba(0, 0, 0, .7);
	width: 100% !important;
	height: 100% !important;
}

.mixSlide-container {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: black;
	z-index: 0;
}

.mixSlide-frame.fullscreen .mixSlide-container {
	position: absolute !important;
	background: transparent;
}

.mixSlide-container .top {
	top: 0 !important;
}

.mixSlide-container .left {
	left: 0 !important;
}

.mixSlide-container .right {
	right: 0 !important;
}

.mixSlide-container .bottom {
	bottom: 20% !important;
	transform: translateY(40%);
}

.mixSlide-container .top-left {
	left: 0 !important;
	top: 0 !important;
}

.mixSlide-container .bottom-left {
	left: 0 !important;
	bottom: 0 !important;
}

.mixSlide-container .top-right {
	bottom: 0 !important;
	right: 50px !important;
	max-width: 300px;
}

.mixSlide-container .bottom-right {
	bottom: 0 !important;
	right: 0 !important;
}

.mixSlide-images {
	width: 100%;
	height: 100%;
}

.mixSlide-images>div {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 10;
}

.mixSlide-images>div img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.mixSlide-images>div article {
	position: absolute;
	z-index: 13;
	width: 100%;
	margin: 0;
	padding: 15px;
	font: 1.8em sans-serif;
	color: white;
	text-shadow: 1px 1px black;
	top: 60%;
	transform: translateY(-40%);
	left: 15%;
}

.mixSlide-images>div article.right,
.mixSlide-images>div article.top-right,
.mixSlide-images>div article.bottom-right {
	text-align: right;
}

.mixSlide-controls {
	position: absolute;
	z-index: 15;
	color: white;
	right: 0;
	font: 2em sans-serif;
	width: 100%;
}

.mixSlide-controls div {}

.mixSlide-slide-buttons {
	max-width: 200px;
	float: right;
	margin: 1%;
	justify-content: space-around;
	display: flex;
}

.mixSlide-slide-buttons span {
	padding: 5px 10px;
	background: transparent;
	text-align: center;
	cursor: pointer;
	display: inline-block;
	transition: all .2s ease;
	color: #fff;
}

.mixSlide-start-slide {
	background: black !important;
	display: none !important;
}
.mixSlide-open-close-fullscreen{
	display: none !important;
}

.mixSlide-slide-buttons span:hover {
	background: rgba(0, 0, 0, .8);
	color: white;
}

.mixSlide-points {
	display: flex;
	margin-left: 2%;
	margin-top: 2%;
	padding: 2px;
}

.mixSlide-points span {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	margin-left: 4px;
	background: rgb(230, 230, 230);
	box-shadow: 1px 1px 2px black;
	transition: all .5s ease;
}

.mixSlide-points span.active,
.mixSlide-points span:hover {
	background: rgb(30, 30, 30);
	box-shadow: 1px 1px 2px white;
}

.mixSlide-controls.minimal .mixSlide-points {
	width: 100%;
	justify-content: center !important;
	margin-top: -5% !important;
}

.mixSlide-thumbs {
	position: absolute;
	padding: 10px;
	z-index: 16;
	margin: 0;
	right: 0;
	overflow: auto;
	overflow-x: visible !important;
}

.mixSlide-thumbs.bottom,
.mixSlide-thumbs.top {
	height: 200px;
	width: auto;
	display: flex;
	flex-direction: column;
}

.mixSlide-thumbs.top-left,
.mixSlide-thumbs.top-right {
	width: var(--thumb-size);
	height: 100%;

}

.mixSlide-thumbs span {
	overflow: hidden;
	cursor: pointer;
	transition: all .25s ease;
	display: inline-block;
	border: 3px solid transparent;
}

.mixSlide-thumbs.bottom span,
.mixSlide-thumbs.top span {
	height: 100%;
	width: var(--thumb-size) !important;
	margin-left: 5px;
}

.mixSlide-thumbs.top-left span,
.mixSlide-thumbs.top-right span {
	width: 100%;
	height: var(--thumb-size) !important;
	margin-top: 5px;
}

.mixSlide-thumbs span:hover,
.mixSlide-thumbs span.active {
	border-color: white;
	box-shadow: 1px 1px 1px black;
}

.mixSlide-thumbs span.active img{
	width: 100px;
}

.mixSlide-thumbs span img {
	height: 100%;
}


/* Animation elements */
.mixSlide-div-over {
	z-index: 12 !important;
}

.mixSlide-div-clip {
	margin: 0;
	width: 100%;
	height: 100%;
	display: inline-block;
	overflow: hidden;
	position: absolute;
}

.mixSlide-div-clip img {}