#products li{
	float: left;
    width: 31%;
    margin-right: 3.33%;
	margin-bottom: 30px;
}
#products li:nth-child(3n){
    margin-right: 0;
}
#products li .photo{
	background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    border-radius: 7px;
    border: 1px solid #cccccc;
}
#products li .photo a{
	display:block;
	position:relative;
	background: -moz-linear-gradient(bottom,  rgba(15, 16, 16, 0.81) 0%, rgba(0,0,0,0) 50%); /* FF3.6-15 */
	background: -webkit-linear-gradient(bottom, rgba(15, 16, 16, 0.81) 0%,rgba(0,0,0,0) 50%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to top, rgba(15, 16, 16, 0.81) 0%,rgba(0,0,0,0) 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6398e89', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
#products li .photo a:hover{
	background: -moz-linear-gradient(bottom, rgba(15, 16, 16, 0.81) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(bottom, rgba(15, 16, 16, 0.81) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to top, rgba(15, 16, 16, 0.81) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#products li .photo a img{
	width:100%;
}
#products li .photo .txt{
    color: #fff;
    text-align: center;
    position: absolute;
    bottom: 10%;
    width: 100%;
}
#products li .photo .txt span{
	font-size: 18px;
    margin-bottom: 10px;
    display: block;
    text-align: center;
}
#products li .photo .txt h4{
    font-size: 23px;
    text-align: center;
    margin: 0 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#products_detail{
	
}
#products_detail #pro-article{
	
}
.other-product{
    margin-top: 100px;	
}
.other-product h5{
    margin: 0;
    font-size: 20px;
    color: #65b7b7;
    line-height: 100%;	
	border-bottom:1px solid #65b7b7;
	padding-bottom:10px;
	text-align:center;
}
.other-product li{
	float: left;
    width: 25%;
    margin: 10px 0;	
}
.other-product li{
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.other-product li p{
	text-align:center;
}
.other-product li a{
    color: #717171;	
	font-size: 16px;
}
.ask{
    text-align: right;
    margin: 20px 0;	
}
.ask a{
    display: inline-block;
    background: #828282;
    color: #fff;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 8px;
    border: 1px solid #868686;
    text-shadow: 1px 1px 2px #501717;
	transition:all linear 0.1s;	
}
.ask a:hover{
    background: #da3232;
}
@media screen and (max-width: 980px) {
	#products li .photo .txt h4{
		font-size:20px;
	}
	#products li .photo .txt span{
		font-size: 14px;
		margin-bottom: 0;		
	}
	.other-product li{
		width:50%;
	}
	.other-product h5{
		text-align:left;
	}
}
@media screen and (max-width: 640px) {
	#products li,
	#products li:nth-child(3n){
		width: 49%;
		margin-right: 2%;
	}
	#products li:nth-child(2n){
		margin-right: 0;
	}
	#products li .photo .txt h4{
	    white-space: normal;	
		font-size: 18px;
	    height: 46px;
		overflow: hidden;	
	}
	#products li{
		margin-bottom:10px;
	}
	.ask a{
	    font-size: 16px;
		padding: 5px 20px;	
	}
	.ask{
		text-align:center;
	}
}
@media screen and (max-width: 480px) {
	.other-product li{
		width:80%;
		padding:0 10%;
	}
	.other-product h5,
	.other-product li p{
		text-align:center;
	}
}