/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}


.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

/* Navigation crap */

.mfp-close {
	display: block;
	color: white;
	border: 0;
	padding:0;
	font-size: 1.5em;
	width: 2em;
	height: 2em;
	line-height: 2em;
	background-color: rgba(0,0,0,.5);

	position: absolute;
	z-index: 1045;
	top: 	 .5em;
	right: .5em;
	-webkit-appearance: none;
	-moz-appearance: none;
}
.mfp-arrow {
	display: block;
	color: white;
	border: 0;
	padding: 0;
	font-size: 1.5em;
	width: 2em;
	height: 2em;
	line-height: 2em;
	background-color: rgba(0,0,0,.5);

	position: absolute;
	z-index: 1045;
	top: 50%;
	margin-top: -1em;
	-webkit-appearance: none;
	-moz-appearance: none;
}
.mfp-close:hover,
.mfp-arrow:hover {
	background-color: black;
}
.mfp-arrow-left {
	left: 0;
}
.mfp-arrow-left:after {
	content: '';
	width: 0;
	height: 0;
	border-top: .6em solid transparent;
	border-bottom: .6em solid transparent;
	border-right: 1em solid white;
	position: absolute;
	position: a;
	top: .45em;
	right: 25%;
}

.mfp-arrow-right {
	right: 0;
}
.mfp-arrow-right:after {
	content: '';
	width: 0;
	height: 0;
	border-top: .6em solid transparent;
	border-bottom: .6em solid transparent;
	border-left: 1em solid white;
	position: absolute;
	position: a;
	top: .45em;
	left: 25%;
}

/* Caption */

.mfp-bottom-bar {
	position: absolute;
	bottom: 1em;
	left: 1em;
	right: 1em;
}
.mfp-title {
	display: inline-block;
	padding: 0 1em;
	color: white;	
	background-color: rgba(0,0,0,.5);
}
.mfp-counter {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0 1em;
	color: white;
	background-color: rgba(0,0,0,.5);
}

@media screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-device-pixel-ratio: 2) and (orientation:portrait) {

	.mfp-close {
		top: -2em;
		right: 0;
		background-color: black;
		-ms-transform: scale(.5);
		-webkit-transform: scale(.5);
		transform: scale(.5);
	}
	.mfp-arrow {
		background-color: black;
		-ms-transform: scale(.5);
		-webkit-transform: scale(.5);
		transform: scale(.5);
	}
	.mfp-arrow-right {
		right: 0;
		-ms-transform-origin:100% 50%;
		-webkit-transform-origin:100% 50%;
		-transform-origin:100% 50%;
	}
	.mfp-arrow-left {
		left: 0;
		-ms-transform-origin:0 50%;
		-webkit-transform-origin:0 50%;
		-transform-origin:0 50%;
	}
	.mfp-bottom-bar {
		display: block;
		padding: 0 .75em;
		line-height: 2em;
		left: 0;
		top: -2.25em;
		bottom: -2.25em;
		right: 0;
	}
	.mfp-title {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		box-sizing: border-box;
		padding: 0 1em;
		background-color: black;
		font-size: .8em;
	}
	.mfp-counter {
		display: none;
	}

}

@media (min-width:35em) {

	.mfp-close {
		width: 1.5em;
		height: 1.5em;
		line-height: 1.5em;
		font-size: 2em;
	}
	.mfp-arrow {
		width: 1.5em;
		height: 1.5em;
		line-height: 1.5em;
		font-size: 2em;
		margin-top: -.75em;
	}
	.mfp-arrow-right:after {
		border-top: .3em solid transparent;
		border-bottom: .3em solid transparent;
		border-left: .5em solid white;
		left: 33%;
	}
	.mfp-arrow-left:after {
		border-top: .3em solid transparent;
		border-bottom: .3em solid transparent;
		border-right: .5em solid white;
		right: 33%;
	}

}

@media (min-width:65em) { 

	.mfp-close {
		font-size: 2.5em;
	}
	.mfp-arrow {
		font-size: 2.5em;
		margin-top: -.8em;
	}

}