/*! Swipebox v1.3.0 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */

html.swipebox-html.swipebox-touch{
	overflow: hidden !important;
}

#swipebox-overlay{
	width: 100% !important;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2000 !important;
	overflow: hidden;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

#swipebox-container{
	position: relative;
	width: 100%;
	height: 100%;
}

#swipebox-slider{
	-webkit-transition: -webkit-transform .4s ease;
	        transition:         transform .4s ease;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
	white-space: nowrap;
	position: absolute;
	display: none;
	cursor: pointer;
}

#swipebox-slider .slide{
	height: 100%;
	width: 100%;
	line-height: 1px;
	text-align: center;
	display: inline-block;
}

#swipebox-slider .slide:before{
	content: '';
	display: inline-block;
	height: 50%;
	width: 1px;
	margin-right: -1px;
}

#swipebox-slider .slide img,
#swipebox-slider .slide .swipebox-video-container,
#swipebox-slider .slide .swipebox-inline-container{
	display: inline-block;
	max-height: 85%;
	max-width: 65%;
	margin: 0;
	padding: 0;
	width: auto;
	height: auto;
	vertical-align: middle;
	margin-top: -50px;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.24);
}


#swipebox-slider .slide .swipebox-video-container{
	background: none;
	max-width: 1140px;
	max-height: 100%;
	width: 100%;
	padding: 5%;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

#swipebox-slider .slide .swipebox-video-container .swipebox-video{
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
	overflow: hidden;
	position: relative;
}

#swipebox-slider .slide .swipebox-video-container .swipebox-video iframe{
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
}

#swipebox-slider .slide-loading{
	background: url(../img/loader.gif) no-repeat center center;
}

.swipebox-no-close-button #swipebox-close{
	display: none;
}

#swipebox-prev.disabled,
#swipebox-next.disabled{
	opacity: .3;
}

.swipebox-no-touch #swipebox-overlay.rightSpring #swipebox-slider{
	-webkit-animation: rightSpring .3s;
	        animation: rightSpring .3s;
}

.swipebox-no-touch #swipebox-overlay.leftSpring #swipebox-slider{
	-webkit-animation: leftSpring .3s;
	        animation: leftSpring .3s;
}

.swipebox-touch #swipebox-container:before,
.swipebox-touch #swipebox-container:after{
	-webkit-backface-visibility: hidden;
	        backface-visibility: hidden;
	-webkit-transition: all .3s ease;
	        transition: all .3s ease;
	content: ' ';
	position: absolute;
	z-index: 999;
	top: 0;
	height: 100%;
	width: 20px;
	opacity: 0;
}

.swipebox-touch #swipebox-container:before{
	left: 0;
	-webkit-box-shadow: inset 10px 0 10px -8px #656565;
	        box-shadow: inset 10px 0 10px -8px #656565;
}

.swipebox-touch #swipebox-container:after{
	right: 0;
	-webkit-box-shadow: inset -10px 0 10px -8px #656565;
	        box-shadow: inset -10px 0 10px -8px #656565;
}

.swipebox-touch #swipebox-overlay.leftSpringTouch #swipebox-container:before{
	opacity: 1;
}

.swipebox-touch #swipebox-overlay.rightSpringTouch #swipebox-container:after{
	opacity: 1;
}

@-webkit-keyframes rightSpring{
	0%{
		left: 0;
	}
	50%{
		left: -30px;
	}
	100%{
		left: 0;
	}
}

@keyframes rightSpring{
	0%{
		left: 0;
	}
	50%{
		left: -30px;
	}
	100%{
		left: 0;
	}
}

@-webkit-keyframes leftSpring{
	0%{
		left: 0;
	}
	50%{
		left: 30px;
	}
	100%{
		left: 0;
	}
}

@keyframes leftSpring{
	0%{
		left: 0;
	}
	50%{
		left: 30px;
	}
	100%{
		left: 0;
	}
}


/* Skin
--------------------------*/

#swipebox-overlay{
	/* background: linear-gradient( -146deg, rgb(33,42,58) 0%, rgb(2,178,176) 100%);
	background: linear-gradient( -146deg, rgb(48, 97, 107) 0%, rgb(18, 37, 41) 100%); */
	/* background-color: #343035; */
	background-color: rgba(255,248,220,.85);
}

#swipebox-prev{
	position: absolute;
	top: 44%;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #fff8dc;
	left: 60px;
	cursor: pointer;
	box-shadow: 0px 6px 17px 0 rgba(0, 0, 0, 0.15);
	transition: left .25s ease-in-out;
}

#swipebox-prev::after{
	content: "\f053";
	font-family: FontAwesome;
	color: #fff;
	font-size: 20px;
	line-height: 55px;
	padding-left: 16px;
	color: #822a3a;
}

#swipebox-prev:hover{
	left: 55px;
}

#swipebox-next{
	position: absolute;
	top: 44%;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #fff8dc;
	right: 60px;
	cursor: pointer;
	box-shadow: 0px 6px 17px 0 rgba(0, 0, 0, .15);
	transition: right .25s ease-in-out;
}

#swipebox-next::after{
	content: "\f054";
	font-family: FontAwesome;
	color: #fff;
	font-size: 20px;
	line-height: 55px;
	padding-left: 20px;
	color: #822a3a;
}

#swipebox-next:hover{
	right: 55px;
}

#swipebox-title{
	position: absolute;
   top: 30px;
   left: 60px;
   color: #fff;
   font-size: 18px;
	font-weight: 500;
}

#swipebox-close{
	position: absolute;
   top: 20px;
   right: 55px;
   width: 50px;
   height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
	color: #fff8dc;
   cursor: pointer;
	transition: opacity .2s ease-in-out;
}

#swipebox-close:hover{
	opacity: .7;
}


#swipebox-close::after{
	content: '';
	width: 41px;
	height: 4px;
	border-radius: 3px;
	background-color: #822a3a;
	transform: rotate(45deg);
	display: block;
}

#swipebox-close::before{
	content: '';
	width: 41px;
	height: 4px;
	border-radius: 3px;
	background-color: #822a3a;
	transform: rotate(-45deg);
	display: block;
	margin-right: -40px;
}
