<div id="workspace"></div>
#workspace {
	height: 400px;
	background-color: #525d62;
	background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/macbook.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/mouse.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/hdd.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/phone.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/ipad.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/coffee.png'),
		url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/210284/camera.png');
	background-repeat: no-repeat;
	background-position: 50% 50%, 75% 295px, 75% 230px, 96% 240px, 20% 250px, 22% 190px, 7% 280px;
	animation: 3s ease 0s inView forwards;
}
@keyframes inView {
	0% {
		background-position-y: 
			600%, 
			451px, 
			-448px, 
			240px, 
			496px, 
			-44px, 
			280px;
		background-position-x: 
			50%, 
			75%, 
			75%, 
			200%, 
			20%, 
			22%, 
			-100%;
	}
	20% {
		background-position-y: 
			50%, 
			451px, 
			-448px, 
			240px, 
			496px, 
			-44px, 
			280px;
		background-position-x: 
			50%, 
			75%, 
			75%, 
			200%, 
			20%, 
			22%, 
			-100%;
	}
	30% {
		background-position-y: 
			50%, 
			295px, 
			-448px, 
			240px, 
			496px, 
			-44px, 
			280px;	
		background-position-x: 
			50%, 
			75%, 
			75%, 
			200%, 
			20%, 
			22%, 
			-100%;
	}
	40% {
		background-position-y: 
			50%, 
			295px, 
			230px, 
			240px, 
			250px, 
			-44px, 
			280px;
		background-position-x: 
			50%, 
			75%, 
			75%, 
			200%,
			20%, 
			22%, 
			-100%;
	}
	50% {
		background-position-y: 
			50%, 
			295px, 
			230px, 
			240px, 
			250px, 
			190px, 
			280px;
		background-position-x: 
			50%, 
			75%, 
			75%, 
			96%,
			20%, 
			22%, 
			-100%;
	}
	60% {
		background-position-y: 
			50%, 
			295px, 
			230px, 
			240px, 
			250px, 
			190px, 
			280px;
		background-position-x: 
			50%, 
			75%, 
			75%, 
			96%,
			20%, 
			22%, 
			7%;
	}
	100% {
		background-position-y: 
			50%, 
			295px, 
			230px, 
			240px, 
			250px, 
			190px, 
			280px; 
	}
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.