.parent
{
	position: relative;
	width: 80vw;
	height: 60vh;
	padding-top: 20vh;
	background-color: none;
	perspective-origin: 50% 0%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-wrap: wrap;
	perspective: 1000px;  
	transition: perspective-origin 1s ease 1s;
}

.parent:hover
{
  perspective-origin: 60% 100%;
}


.parent:hover .p70
{
	transform: translateZ(70px) rotateY(-20deg);
}
.parent:hover .p150
{
	transform: translateZ(150px);
}

.parent:hover .p200
{
	transform: translateZ(200px) rotateY(20deg);
}

.child
{
	margin-left: 20px;
	margin-right: auto;
	width: 5%;
	height: 8vh;
	
	transition: all 1s;
	transform: translateZ(0px);
}

.child:hover
{
	transform: rotateY(50deg);
}

.p70
{
	background-color: #EE786E;
	z-index: 1;
}

.p150
{
	background-color: #A2CCB6;
	z-index: 2;
}

.p200
{
	z-index: 3;
	background-color: #FCEEB5;
}



