 

.kz-cardwheel {
	position: relative;
	 
	z-index: 1;
}
.kz-cardwheel::after {
	content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/idxBrandBg.jpg) no-repeat bottom;
    background-size: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
}

.kz-cardwheel-item-body::before{
	content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .25);
   
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
}

@media (min-width:900px) {
	.kz-cardwheel {
		height: 430vh
	}@	supports (height:430lvh) {
		.kz-cardwheel{height: 430lvh
	}
}}
 

.kz-cardwheel-content {
	position: relative;
	z-index: 1;
	overflow: hidden
}

@media (min-width:900px) {
	.kz-cardwheel-content {
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		height: 100vh;
		padding: 0;
		white-space: nowrap
	}@	supports (height:100lvh) {
		.kz-cardwheel-content{height: 100lvh
	}
}}

@media (max-width:767px) {
	.kz-cardwheel-container {
		padding: 0 1rem
	}
}

.kz-cardwheel-header { 
 
	 
	z-index: 1
}
 
@media (min-width:900px) {
	.kz-cardwheel-header {
		position: absolute;
        width: 90%;
        margin-bottom: 200px;
        
	}

	.kz-cardwheel-header:lang(fr-CA) {
		width: 80%
	}
}
 

@media (min-width:900px) {
	.kz-cardwheel-main {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 2
	}
}

@media (min-width:900px) {
	.kz-cardwheel-body {
		position: relative;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		width: 100%;
		z-index: 1;
		transform: translateY(65vh)
	}
}

.kz-cardwheel-items {
	position: relative
}

@media (min-width:900px) {
	.kz-cardwheel-items {
		display: flex;
		justify-content: center;
		align-items: center;
		transform: translateY(177vw) rotate(40deg)	;
		-webkit-transform: translateY(177vw) rotate(40deg)	;
		-moz-transform: translateY(177vw) rotate(40deg)	;
		-ms-transform: translateY(177vw) rotate(40deg)	;
		-o-transform: translateY(177vw) rotate(40deg)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-items {
		transform: translateY(197vw) rotate(40deg)	;
		-webkit-transform: translateY(197vw) rotate(40deg)	;
		-moz-transform: translateY(197vw) rotate(40deg)	;
		-ms-transform: translateY(197vw) rotate(40deg)	;
		-o-transform: translateY(197vw) rotate(40deg)	;
}
}

.kz-cardwheel-item {
	height: 24.4vw;
	margin-bottom: 10px
}

.kz-cardwheel-item:last-child {
	margin-bottom: 0
}

@media (min-width:900px) {
	.kz-cardwheel-item:first-child {
		position: absolute;
		transform: translateY(48vh)
	}
}

@media (min-width:900px) {
	.kz-cardwheel-item {
		position: absolute;
		flex-shrink: 0;
		width: 27.5vw;
		height: 30.4vw;
		margin-bottom: 0;
		border-radius: 2vw;
		white-space: normal;
		transform: translateY(100vh)	;
		-webkit-border-radius: 2vw;
		-moz-border-radius: 2vw;
		-ms-border-radius: 2vw;
		-o-border-radius: 2vw;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item {
		width:   30.5vw;
		height:   33.8vw
	}
}
 


@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(1) {
		transform: rotate(-40deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(-40deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(-40deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(-40deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(-40deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(1) {
		transform: rotate(-40deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(-40deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(-40deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(-40deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(-40deg) translateY(-197vw) scale(1)	;
}
}

@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(2) {
		transform: rotate(-30deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(-30deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(-30deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(-30deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(-30deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(2) {
		transform: rotate(-30deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(-30deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(-30deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(-30deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(-30deg) translateY(-197vw) scale(1)	;
}
}

@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(3) {
		transform: rotate(-20deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(-20deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(-20deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(-20deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(-20deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(3) {
		transform: rotate(-20deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(-20deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(-20deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(-20deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(-20deg) translateY(-197vw) scale(1)	;
}
}

@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(4) {
		transform: rotate(-10deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(-10deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(-10deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(-10deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(-10deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(4) {
		transform: rotate(-10deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(-10deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(-10deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(-10deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(-10deg) translateY(-197vw) scale(1)	;
}
}

@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(5) {
		transform: rotate(0deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(0deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(0deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(0deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(0deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(5) {
		transform: rotate(0deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(0deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(0deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(0deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(0deg) translateY(-197vw) scale(1)	;
}
}


@media (min-width:900px) {
	.kz-cardwheel-item:nth-child(6) {
		transform: rotate(10deg) translateY(-177vw) scale(1)	;
		-webkit-transform: rotate(10deg) translateY(-177vw) scale(1)	;
		-moz-transform: rotate(10deg) translateY(-177vw) scale(1)	;
		-ms-transform: rotate(10deg) translateY(-177vw) scale(1)	;
		-o-transform: rotate(10deg) translateY(-177vw) scale(1)	;
}
}

@media (min-width:1920px) {
	.kz-cardwheel-item:nth-child(6) {
		transform: rotate(10deg) translateY(-197vw) scale(1)	;
		-webkit-transform: rotate(10deg) translateY(-197vw) scale(1)	;
		-moz-transform: rotate(10deg) translateY(-197vw) scale(1)	;
		-ms-transform: rotate(10deg) translateY(-197vw) scale(1)	;
		-o-transform: rotate(10deg) translateY(-197vw) scale(1)	;
}
}

.kz-cardwheel-item-body {
	height: 100%;
	background: rgba(255,255,255,.62);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-radius: 25px;
	background: linear-gradient(149deg, #D4E5FF 0%, #F3F9FF 59.55%, #E9FBFF 97.73%);
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	-ms-border-radius: 25px;
	-o-border-radius: 25px;
}

@media (min-width:900px) {
	.kz-cardwheel-item-body {
		width: 100%;
		height: 100%;
		 
	 
		border-radius: 2vw	;
		-webkit-border-radius: 2vw	;
		-moz-border-radius: 2vw	;
		-ms-border-radius: 2vw	;
		-o-border-radius: 2vw	;
}
}

.kz-cardwheel-item-body  .idxBrandIco{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }
.kz-cardwheel-item-body .flalt{ overflow: hidden; transform: scale(1,0); -webkit-transform: scale(1,0); -moz-transform: scale(1,0); -ms-transform: scale(1,0); -o-transform: scale(1,0); }
.kz-cardwheel-item-body .flalt .idxBrandIco{ filter: drop-shadow(100px 0 0 var(--color)); transform: translateX(-100px); -webkit-filter: drop-shadow(100px 0 0 var(--color)); }
.kz-cardwheel-item-body .flalt .idxMore{  }
/* .kz-cardwheel-item-body .flalt .idxMore:hover{ background: #fff;} */
.kz-cardwheel-item:hover .kz-cardwheel-item-body .flalt{ transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); }

.kz-cardwheel-item-body .flalt::after{ display: block; content: ''; width: 50%; height: 50% ; border-radius: 50%; position: absolute; bottom: -20%; right: -20%; background:rgba(255,255,255,.2) ; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }

@media screen and (max-width:900px) { 

	.kz-cardwheel{ padding-top: 30px;}
	.kz-cardwheel-item-body{ border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
	.kz-cardwheel-item{ height: 220px;}
	/* .idxBrandIco{ width: 40px;} */
}