/* triple frame support */

.mkdf-triple-frame-image-highlight {
	position: relative;
	text-align: center;
	visibility: hidden
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-inner {
	position: relative;
	display: inline-block
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-link {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 100
}
.mkdf-triple-frame-image-highlight img {
	display: block;
	position: relative;
	z-index: 10;
	width:100%;
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-left-image-holder, .mkdf-triple-frame-image-highlight .mkdf-tfih-right-image-holder {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	visibility: hidden;
	-webkit-transition: -webkit-transform 1s cubic-bezier(.19, 1, .22, 1) .2s, transform-origin 1s cubic-bezier(.19, 1, .22, 1) .2s, visibility 0s .2s;
	-moz-transition: -moz-transform 1s cubic-bezier(.19, 1, .22, 1) .2s, transform-origin 1s cubic-bezier(.19, 1, .22, 1) .2s, visibility 0s .2s;
	transition: transform 1s cubic-bezier(.19, 1, .22, 1) .2s, transform-origin 1s cubic-bezier(.19, 1, .22, 1) .2s, visibility 0s .2s
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-centered-image-holder {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	z-index: 10;
	-webkit-transform: scale(.7);
	-moz-transform: scale(.7);
	transform: scale(.7);
	-webkit-transition: -webkit-transform .4s cubic-bezier(.86, 0, .07, 1);
	-moz-transition: -moz-transform .4s cubic-bezier(.86, 0, .07, 1);
	transition: transform .4s cubic-bezier(.86, 0, .07, 1)
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-left-trigger, .mkdf-triple-frame-image-highlight .mkdf-tfih-right-trigger {
	position: absolute;
	top: 0;
	width: 15%;
	height: 100%;
	z-index: 300;
	cursor: pointer
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-left-trigger {
	left: 0
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-right-trigger {
	right: 0
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-frame {
	position: absolute;
	top: -10%;
	left: 0;
	height: 110%;
	width: 100%;
	background-color: #fff;
	border: 1px solid #fff;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	box-shadow: 0 10px 30px 0 rgba(137,173,255,.45)
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar {
	position: absolute;
	top: 0;
	left: 0;
	height: calc(10% - 5px);
	width: 100%
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left, .mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-right {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: space-around
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left {
	top: 0;
	height: 100%;
	left: 2%;
	width: 50px
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left>span {
	height: 8px;
	width: 8px;
	border-radius: 8px
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left>span:first-child {
	background-color: #5580ff
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left>span:nth-child(2) {
	background-color: #7bb9ff
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-left>span:last-child {
	background-color: #ff8a73
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-right {
	right: 0;
	height: 60%;
	top: 20%;
	width: 50px;
	flex-direction: column
}
.mkdf-triple-frame-image-highlight .mkdf-tfih-top-bar-right>span {
	height: 4px;
	width: 4px;
	border-radius: 4px;
	background-color: #232845
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav {
	position: relative;
	text-align: center
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-triple-frame-image-highlight {
	display: inline-block;
	width: 80%;
	padding-top: 3%
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-tfih-inner {
	max-width: 60%
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-tfih-nav {
	position: absolute;
	max-height: 42px;
	max-width: 23px;
	top: 50%;
	height: 2%;
	width: 2%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	transform: translateY(-50%);
	cursor: pointer;
	fill: #58468c;
	-webkit-transition: fill .2s;
	-moz-transition: fill .2s;
	transition: fill .2s
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-tfih-nav:hover {
	fill: #ff8a73
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-tfih-left {
	left: 5%
}
.mkdf-triple-frame-image-highlight-holder.mkdf-tfih-with-nav .mkdf-tfih-right {
	right: 5%
}
.mkdf-triple-frame-image-highlight-holder:not(.mkdf-tfih-with-nav) .mkdf-tfih-inner {
	max-width: 70%
}