/* ----------------------------------------------------------------
	Canvas: Integro
-----------------------------------------------------------------*/

@import url("css/fonts/font_stylesheet.css"); /* Using a Font url */

 /* ----------------------------------------------------------------

	Canvas: Jewellery Boutique

-----------------------------------------------------------------*/



/* triggerEl.parent( menuItemT ).toggleClass('menu-item-open'); */




html {

	-webkit-font-smoothing: antialiased;

	-moz-osx-font-smoothing: grayscale;

}



.top-cart-number {

	top: -10px;

	right: -10px;

	background-color: transparent;

}



@keyframes MoveUpInitial {

	to {

		transform: translate3d(0,-105%,0);

	}

}



@keyframes MoveUpEnd {

	from {

		transform: translate3d(0,100%,0);

	}

	to {

		transform: translate3d(0,0,0);

	}

}





/* Image Hover */

.img-hover-block {

	z-index: 0;

}



.img-hover-block span {

	position: relative;

}



.img-hover-block:hover span {

	mix-blend-mode: difference;

	color: #FFF;

	z-index: 2;

}



.hover-reveal {

	position: fixed;

	width: 220px;

	height: 320px;

	top: 0;

	left: 0;

	pointer-events: none;

	opacity: 0;

	z-index: 1;

}



.hover-reveal__inner,

.hover-reveal__img {

	width: 100%;

	height: 100%;

	position: relative;

}



.hover-reveal__inner {

	overflow: hidden;

}



.hover-reveal__img {

	background-size: cover;

	background-position: 50% 50%;

}





@media (min-width: 992px) {

	/*.owl-stage {

	    right: -50px;

	}*/



	#wrapper::after {

		content: "";

		opacity: 0;

		position: absolute;

		width: 100%;

		height: 100%;

		top: 0;

		left: 0;

		z-index: 1;

		visibility: hidden;

		background-color: rgba(19, 8, 2, 0);

		transition: opacity 0.7s, background-color 0.2s ease;

	}



	

}






* {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

.stack-cards {
  position: relative;
  display: block;
}

.stack-cards-item {
	background: #2552A0;
	border-radius: 0.25rem;
	box-shadow: -5px 0 16px 8px rgba(0, 0, 0, 0.2);
	text-align: left;
	margin-bottom: 10px;
}

/*
If you use SASS you can shorten this one here like this:

@for $i from 0 through 5 {
  &:nth-of-type(#{$i}) {
    transform: translate(calc((#{$i} - 1) * var(--cnvs-stack-card-offset)), calc((#{$i} - 1) * var(--cnvs-stack-card-offset)));
  }
}
*/

@media (min-width: 992px) {

	.content-wrap {
		overflow:visible;
	}

	.stack-cards {
		position: relative;
		display: block;
	}

	.sticky-title {
		position: sticky;
		top: 8rem;
	}

	.stack-cards > .stack-cards-item + .stack-cards-item {
		margin-top: 40vh;
	}

	.stack-cards-item {
		--cnvs-stack-card-offset: 1.5em;
		max-width: 53rem;
		position: sticky;
		top: 20rem;
		margin-bottom: 0px;
	}

	.stack-cards-item:nth-of-type(0) {
		transform: translateY(calc((0 - 1) * var(--cnvs-stack-card-offset))) scale(0.85);
	}
	.stack-cards-item:nth-of-type(1) {
		transform: translateY(calc((1 - 1) * var(--cnvs-stack-card-offset))) scale(0.88);
	}
	.stack-cards-item:nth-of-type(2) {
		transform: translateY(calc((2 - 1) * var(--cnvs-stack-card-offset))) scale(0.91);
	}
	.stack-cards-item:nth-of-type(3) {
		transform: translateY(calc((3 - 1) * var(--cnvs-stack-card-offset))) scale(0.94);
	}
	.stack-cards-item:nth-of-type(4) {
		transform: translateY(calc((4 - 1) * var(--cnvs-stack-card-offset))) scale(0.97);
	}
	.stack-cards-item:nth-of-type(5) {
		transform: translateY(calc((5 - 1) * var(--cnvs-stack-card-offset))) scale(1);
	}
}