.product-page-one{
	.show-product{
		p{
			margin: 0;
			color: #444444;
			font-size: 16px;
		}
	}
	.product-filters{
		margin-bottom: 50px;
	}
	.product-filter{
		.filter-con{
			li{
				display: inline-block;
				border-left: 1px solid #cccccc;
				select{
					border: none;
					font-size: 16px;
					color: #444444;
					font-weight: 700;
					padding: 0 18px;
					cursor: pointer;
					option{
						font-size: 16px;
						color: #444444;
						font-weight: 700;
					}
				}
				&:first-child{
					border: none;
				}
				&.grid-list{
					border: none;
					ul{
						li{
							border: none;
							a{
								display: block;
								color: #a8a8a8;
								border: 1px solid #a8a8a8;
								width: 36px;
								height: 33px;
								text-align: center;
								padding: 3px 0;
								span{

								}
							}
						}
					}
				}
			}
		}
	}
	.single-product{
		margin: 0 0 26px;
		figure{
			position: relative;
			img{
				width: 100%;
				&.normal{
					display: block;
				}
				&.hover{
					display: none;
				}
			}
			span{
				&.product-position{
					position: absolute;
					top: 10px;
					left: 20px;
					font-weight: 700;
					font-size: 13px;
					color: #fff;
					letter-spacing: 1px;
					padding: 0 15px;
					border-radius: 30px;
					box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
				}
				&.color1{
					background: #2962ff;
				}
				&.color2{
					background: #f44336;
				}
			}
			ul{
				position: absolute;
				top: 20%;
				right: 5px;
				transform: scaleY(0.5);
				transition: $transition;
				li{
					padding: 2px 0;
					opacity: 0;
					transition: $transition;
					a{
						display: block;
						color: #333333;
						width: 40px;
						height: 40px;
						background: #fff;
						text-align: center;
						padding:8px 0;
					}
				}
			}
		}
		.product-content{
			position: relative;
			padding-top: 26px;
			h4{
				font-weight: 700;
				color: #000;
				margin: 0 0 10px;
			}
			h5{
				color: #838383;
				margin: 0;
			}
			p{
				display: none;
			}
			span{
				position: absolute;
				top: 26px;
				right: 20%;
				font-size: 20px;
				font-weight: 700;
			}
		}
		&:hover{
			figure{
				img{
					&.normal{
						display: none;
					}
					&.hover{
						display: block;
					}
				}
				span{
					&.product-position{

					}
				}
				ul{
					transform: scaleY(1);
					li{
						opacity: 1;
						a{

						}
					}
				}
			}
		}
	}
	.page-single-product{
		width: 100%;
		.single-product{
			margin: 0 0 26px;
			float: left;
			figure{
				position: relative;
				display: inline-block;
				float: left;
				margin-right:30px;
				img{
					width: 100%;
					&.normal{
						display: block;
					}
					&.hover{
						display: none;
					}
				}
				span{
					&.product-position{
						position: absolute;
						top: 10px;
						left: 20px;
						font-weight: 700;
						font-size: 13px;
						color: #fff;
						letter-spacing: 1px;
						padding: 0 15px;
						border-radius: 30px;
						box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
					}
					&.color1{
						background: #2962ff;
					}
					&.color2{
						background: #f44336;
					}
				}
				ul{
					position: absolute;
					bottom: 0;
					top: inherit;
					right: -60%;
					transform: scale(1);
					li{
						padding: 2px 0;
						display: inline-block;
						opacity: 1;
						a{
							display: block;
							color: #333333;
							width: 40px;
							height: 40px;
							background: #fff;
							border: 1px solid #e7e7e7;
							text-align: center;
							padding:8px 0;
						}
					}
				}
			}
			.product-content{
				position: relative;
				padding-top: 26px;
				display: table;
				h4{
					font-weight: 700;
					color: #000;
					margin: 0 0 10px;
				}
				h5{
					color: #838383;
					margin: 0 0 26px;
				}
				p{
					margin: 0;
					display: inline-block;
					color: #444;
					font-size: 16px;
				}
				span{
					position: relative !important;
					font-size: 20px;
					font-weight: 700;
					right: 0;
					top: 0;
					display: block;
					margin: 0 0 30px;
				}
			}
			&:hover{
				figure{
					img{
						&.normal{
							display: none;
						}
						&.hover{
							display: block;
						}
					}
					span{
						&.product-position{

						}
					}
				}
			}
		}
	}
}
.product-page-two{
	.show-product{
		p{
			margin: 0;
			color: #444444;
			font-size: 16px;
		}
	}
	.product-filters{
		margin-bottom: 50px;
	}
	.product-filter{
		.filter-con{
			li{
				display: inline-block;
				border-left: 1px solid #cccccc;
				select{
					border: none;
					font-size: 16px;
					color: #444444;
					font-weight: 700;
					padding: 0 18px;
					cursor: pointer;
					option{
						font-size: 16px;
						color: #444444;
						font-weight: 700;
					}
				}
				&:first-child{
					border: none;
				}
				&.grid-list{
					border: none;
					ul{
						li{
							border: none;
							a{
								display: block;
								color: #a8a8a8;
								border: 1px solid #a8a8a8;
								width: 36px;
								height: 33px;
								text-align: center;
								padding: 3px 0;
								span{

								}
							}
						}
					}
				}
			}
		}
	}
	.single-product{
		margin: 0 0 26px;
		figure{
			position: relative;
			img{
				width: 100%;
				&.normal{
					display: block;
				}
				&.hover{
					display: none;
				}
			}
			span{
				&.product-position{
					position: absolute;
					top: 10px;
					left: 20px;
					font-weight: 700;
					font-size: 13px;
					color: #fff;
					letter-spacing: 1px;
					padding: 0 15px;
					border-radius: 30px;
					box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
				}
				&.color1{
					background: #2962ff;
				}
				&.color2{
					background: #f44336;
				}
			}
			ul{
				position: absolute;
				top: 20%;
				right: 5px;
				transform: scaleY(0.5);
				transition: $transition;
				li{
					padding: 2px 0;
					opacity: 0;
					transition: $transition;
					a{
						display: block;
						color: #333333;
						width: 40px;
						height: 40px;
						background: #fff;
						text-align: center;
						padding:8px 0;
					}
				}
			}
		}
		.product-content{
			position: relative;
			padding-top: 26px;
			h4{
				font-weight: 700;
				color: #000;
				margin: 0 0 10px;
			}
			h5{
				color: #838383;
				margin: 0;
			}
			p{
				display: none;
			}
			span{
				position: absolute;
				top: 26px;
				right: 20%;
				font-size: 20px;
				font-weight: 700;
			}
		}
		&:hover{
			figure{
				img{
					&.normal{
						display: none;
					}
					&.hover{
						display: block;
					}
				}
				span{
					&.product-position{

					}
				}
				ul{
					transform: scaleY(1);
					li{
						opacity: 1;
						a{

						}
					}
				}
			}
		}
	}
	.page-single-product{
		width: 100%;
		.single-product{
			margin: 0 0 26px;
			float: left;
			figure{
				position: relative;
				display: inline-block;
				float: left;
				margin-right:30px;
				img{
					width: 100%;
					&.normal{
						display: block;
					}
					&.hover{
						display: none;
					}
				}
				span{
					&.product-position{
						position: absolute;
						top: 10px;
						left: 20px;
						font-weight: 700;
						font-size: 13px;
						color: #fff;
						letter-spacing: 1px;
						padding: 0 15px;
						border-radius: 30px;
						box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
					}
					&.color1{
						background: #2962ff;
					}
					&.color2{
						background: #f44336;
					}
				}
				ul{
					position: absolute;
					bottom: 0;
					top: inherit;
					right: -60%;
					transform: scale(1);
					li{
						padding: 2px 0;
						display: inline-block;
						opacity: 1;
						a{
							display: block;
							color: #333333;
							width: 40px;
							height: 40px;
							background: #fff;
							border: 1px solid #e7e7e7;
							text-align: center;
							padding:8px 0;
						}
					}
				}
			}
			.product-content{
				position: relative;
				padding-top: 26px;
				display: table;
				h4{
					font-weight: 700;
					color: #000;
					margin: 0 0 10px;
				}
				h5{
					color: #838383;
					margin: 0 0 26px;
				}
				p{
					margin: 0;
					display: inline-block;
					color: #444;
					font-size: 16px;
				}
				span{
					position: relative !important;
					font-size: 20px;
					font-weight: 700;
					right: 0;
					top: 0;
					display: block;
					margin: 0 0 30px;
				}
			}
			&:hover{
				figure{
					img{
						&.normal{
							display: none;
						}
						&.hover{
							display: block;
						}
					}
					span{
						&.product-position{

						}
					}
				}
			}
		}
	}
}