/*
	Sets the style of the image slider wrapper <div> to be centered horizontally and vertically.
	It also sets its default dimensions and the overflowing hidden (to fix the IE image positioning bug).
*/

.threesixty-wrapper {
	position: relative;
    padding-top: 44.7%;
    max-width: 2560px;
	width: 75%;
    margin: 0 auto;
}

@media (min-width: 992px) {
	.threesixty-wrapper {
		padding-top: 30%;
	}
}

@media (min-width: 992px) {
	.threesixty-bg-d {
		background-color: #FFF;
		background-image: url(../../images/eqb/360_bg.jpg);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 100%;
		max-width: 2560px;
		margin: 0 auto;
		background-color: #e6e8ec;
	}
}

@media (max-width: 991px) {
	.threesixty-bg-m {
		background-color: #FFF;
		background-image: url(../../images/eqb/360_bg.jpg);
		background-repeat: no-repeat;
		background-position: center bottom;
		background-size: cover;
		max-width: 2560px;
		margin: 0 auto;
	}
}

#threesixty {
    /* max-width: 1440px; */
    /* max-height: 600px; */
    position: absolute;
    display: block;
    overflow: hidden;
	top: 0;
    left: 50%;
    transform: translateX(-50%);
    cursor: ew-resize;
    width: 100%;
	/* height: calc(100% - 291px); */
	/* height: calc(100% - 200px); */
	height: 100%;
}

#threesixty.full{
    max-width: 100%;
    max-height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    transform: unset;
    height: 100vh;
	z-index: 2;
	background: #000;
}

#threesixty_images {
	display: none;
}
/*
	Sets every image in the slider to be absolute positioned and dynamically sized.
*/
#threesixty img {
    position: absolute;
    top: 50%;
    width: 100%;
    height: auto;
    transform: translateY(-50%);
}
/*
	Sets the style of the visible current frame of the image slider animation
*/
.current-image {
	visibility:visible;
	width:100%;
}
/*
	Sets the style of the visible "previous" frame of the image slider animation
*/
.previous-image {
	visibility:hidden;
	width:0;
}
/*
	Sets the dimensions of the CanvasLoader placeholder <div>, it also centeres it horizontally and vertically inside the wrapper and makes it invisible by default
*/
#spinner {
	position:absolute;
	left:50%;
	top:50%;
	width:90px;
	height:90px;
	margin-left:-45px;
	margin-top:-50px;
	display:none;
}
/*
	Sets the style of the percentage <span> of the preloader by setting its dimensions and centering it horizontally and vertically 
*/
#spinner span {
	position:absolute;
	top:50%;
	width:100%;
	color:#333;
	font:0.8em Arial, Verdana, sans;
	text-align:center;
	line-height:0.6em;
	margin-top:-0.3em;
}
