.pageContent{
	display: flex;
}
.sideBar{
	width: 20%;
	padding: 10px;
}
.GoodsDescription{
	width: 80%;
	padding: 10px;
}
.GoodsDescription p{
	text-align: justify;
	margin: 15px;
	text-indent: 20px;
}
.GoodsDescription h3{
	margin: 15px;
	font-weight: 600;
	text-align: center;
}
.sideBar ul li{
	margin: 10px 0;
	position: relative;
	overflow: hidden;
	padding: 5px 10px;
}
.sideBar ul li:before{
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	left: -100%;
	height: 1px;
	background-color: darkgreen;
	transition: .5s;
}
.sideBar ul li:hover:before{
	left: 100%;
}
.sideBar ul li a{
	display: block;
	width: 100%;
	position: relative;
	padding: 5px 10px;
	text-transform: uppercase;
	transition: 0.5s;
	font-weight: 600;
	color: transparent;
}
.sideBar ul li a:before, .sideBar ul li a:after{
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding: 5px 10px;
	box-sizing: border-box;
	transition: .5s;
	color: #000;
	transition-delay: .15s;
}
.sideBar ul li a:before{
	-webkit-clip-path:polygon(0 0, 100% 0,100% 50%, 0 50%);
	clip-path:polygon(0 0, 100% 0,100% 50%, 0 50%);
}
.sideBar ul li a:hover:before{
	color:darkgreen;
	transform: translate(10px,-2px);
	font-weight: 800;
}
.sideBar ul li a:after{
	-webkit-clip-path:polygon(0 50%, 100% 50%,100% 100%, 0 100%);
	clip-path:polygon(0 50%, 100% 50%,100% 100%, 0 100%);
}
.sideBar ul li a:hover:after{
	color:darkgreen;
	transform: translate(-10px,2px);
	font-weight: 800;
}
.GoodsDescription > h2{
	text-transform: uppercase;
	margin: 10px;
}
.GoodsDescription table{
	margin: 10px auto;
}