.salesslider {
	position:relative;
	width:100%;
	padding-top:38%;
}
.salesslider > a{
	background-color:#c0c0c0;
	transition:all .2s;
	display:block;
}
.salesslider > a > img {
	width:100%;
	height:100%;
}
.salesslider > a:hover {
	transform:scale(1.03);
	-webkit-box-shadow: 0px 0px 12px -5px #000000; 
	box-shadow: 0px 0px 12px -5px #000000;
}
.salesslider .item1 {
	right:34.5%;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
}
.salesslider .item2 {
	right:0;
	position:absolute;
	top:0;
	width:32.8%;
	height:48.5%;
}
.salesslider .item3 {
	right:0;
	position:absolute;
	bottom:0;
	width:32.8%;
	height:48.5%;
}
@media (max-width: 480px) {
	.salesslider {
		padding-top:57%;
	}
	.salesslider .item1,
	.salesslider .item2,
	.salesslider .item3 {
		position:absolute;
		top:0;
		bottom:0;
		right:0;
		left:0;
		opacity:0;
		z-index:1;
		width:100%;
		height:100%;
	}
	.salesslider>a>img {
		width:100%;
	}
	.salesslider .item1 {
		animation:fading1 10s infinite;
	}
	.salesslider .item2 {
		animation:fading2 10s infinite;
	}
	.salesslider .item3 {
		animation:fading3 10s infinite;
	}

	@keyframes fading1{
		0%{
			opacity:1; 
			z-index:2
		}
		30%{
			opacity:1; 
			z-index:2
		}
		36%{
			opacity:0; 
			z-index:1
		}
		94%{
			opacity:0; 
			z-index:1}
		100% {
			opacity:1; 
			z-index:2}
	}
	@keyframes fading2{
		0%{
			opacity:0; 
			z-index:1
		}
		30%{
			opacity:0; 
			z-index:1
		}
		36%{
			opacity:1; 
			z-index:2
		}
		63%{
			opacity:1; 
			z-index:2
		}
		69%{
			opacity:0; 
			z-index:1
		}
		100% {
			opacity:0; 
			z-index:1
		}
	}
	@keyframes fading3{
		0%{
			opacity:0; z-index:1
		}
		63%{
			opacity:0; z-index:1
		}
		69%{
			opacity:1; 
			z-index:2
		}
		94%{
			opacity:1; 
			z-index:2
		}
		100% {
			opacity:0; 
			z-index:1
		}
	}
}