.pipe {
	width: 143px;
	height: 460px;
	position: relative;
	cursor: pointer;
	margin: 0 auto;
}

.pipe .pipe-top {
	position: absolute;
	top: 50px;
    left: -24px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-items: center;
	align-items: center;
	pointer-events: none;
	width: 192px;
}

.pipe .pipe-top .desc {
	opacity: 1;
	position: relative;
	height: 0px;
	font-size: 0.875rem;
	line-height: 1.25rem;
	text-align: center;
}
.pipe .pipe-top .pipe-glow {
	width: 116px;
	height: 156px;
	left: 0px;
}

.pipe .pipe-bottom {
	position: absolute;
	bottom: -60px;
	left: 0;
	pointer-events: none;
}
.pipe .pipe-bottom .pipe-body {
	width: 144px;
	height: 216px;
	position: relative;
	z-index: 1;
	bottom: 0px;
}

.pipe .pipe-bottom .pipe-shadow {
	width: 164px;
	height: 148px;
	background-image: url(../img/stats/pipe-shadow.png);
	margin-top: -90px;
	margin-left: -60px;
}

.pipe .pipe-top .pipe-icon {
	width: 46px;
	height: 46px;
	margin: 0 auto;
}

.pipe.pipe1 .pipe-top .pipe-icon {
	background-image: url('../img/stats/pipe1-ico.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe1 .pipe-top .pipe-glow {
	background-image: url('../img/stats/pipe1-top.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe1 .pipe-bottom .pipe-body {
	background-image: url(../img/stats/pipe1.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.pipe.pipe2 .pipe-top .pipe-icon {
	background-image: url('../img/stats/pipe2-ico.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe2 .pipe-top .pipe-glow {
	background-image: url('../img/stats/pipe2-top.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe2 .pipe-bottom .pipe-body {
	background-image: url(../img/stats/pipe2.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.pipe.pipe3 .pipe-top .pipe-icon {
	background-image: url('../img/stats/pipe3-ico.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe3 .pipe-top .pipe-glow {
	background-image: url('../img/stats/pipe3-top.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe3 .pipe-bottom .pipe-body {
	background-image: url(../img/stats/pipe3.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.pipe.pipe4 .pipe-top .pipe-icon {
	background-image: url('../img/stats/pipe4-ico.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe4 .pipe-top .pipe-glow {
	background-image: url('../img/stats/pipe4-top.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe4 .pipe-bottom .pipe-body {
	background-image: url(../img/stats/pipe4.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.pipe.pipe5 .pipe-top .pipe-icon {
	background-image: url('../img/stats/pipe5-ico.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe5 .pipe-top .pipe-glow {
	background-image: url('../img/stats/pipe5-top.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.pipe.pipe5 .pipe-bottom .pipe-body {
	background-image: url(../img/stats/pipe5.png);
	background-repeat: no-repeat;
	background-size: contain;
}

@media only screen and (min-width: 1200px) {

	.pipe.pipe1,
	.pipe.pipe3,
	.pipe.pipe5 {
		margin-top: 5rem;
	}

}

@media only screen and (max-width: 639px) {

	.pipe .pipe-top .desc {
		*opacity: 1;
	}

}