.HPSPbut-1{
	position: absolute;
    left: 50%;
    top: 40%;
    margin-left: -25px;
    margin-top: -50px;
}

.HPSPprev-but{
	width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #f6770c;
    opacity: 0.8;
	cursor: pointer;
}

.HPSPnext-but{
	width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #ffad52;
    opacity: 0.8;
	cursor: pointer;
}

    /* On hover, add a black background color with a little bit see-through */
    .HPSPprev-but:hover,
    .HPSPnext-but:hover {
        opacity:1;
    }


.HPSPbut-i-p{
	font-family: "iconfont" !important;
	font-size: 24px;
    color: #FFFFFF;
	font-style: normal;
    -webkit-font-smoothing: antialiased;
}

.HPSPbut-i-n{
	font-family: "iconfont" !important;
	font-size: 24px;
    color: #FFFFFF;
	font-style: normal;
    -webkit-font-smoothing: antialiased;
}



.HPSPrightTitle{
	width: 100px;
    margin-top: 30px;
    margin-left: 8%;
	
}

.HPSPrightText{
	margin-left: 8%;
	/* -webkit-touch-callout: none; */
    /* -webkit-user-select: none; */
    /* -khtml-user-select: none; */
    /* -moz-user-select: none; */
    /* -ms-user-select: none; */
    /* user-select: none; */
	
}

.HPSPp{
	color: #FFFFFF;
    font-size: 16px;
}

.HPSPul{
	width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    padding: 20px 0;
    font-size: 0;
    background: #FFFFFF;
}

.HPSPlicolumn{
	width: 190px;
    height: 126px;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px;
    cursor: pointer;
    position: relative;
}

.HPSPinner{
	width: 100%;
    height: 167px;
    display: inline-block;
	
}

.HPSPImgLiText {
	display: block;
	width: 100%;
    height: 100%;
    line-height: 126px;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0,0,0,0.5);
}

@media only screen and (max-width: 991px){
.HPSPlicolumn{
    width: 18%;
    height: 108px;
    margin: 0 5px;
}
}

@media only screen and (max-width: 1199px){
	.HPSPlicolumn{
	width: 168px;
    height: 114px;
	}
}

/* .HPSPcontainer { */
  /* position: relative; */
  /* text-align: center; */
  /* color: white; */
/* } */

.HPSPimgHeight{
	width: 50%;
    height: 514px;
    float: left;
    background-size: cover !important;
    background-position: center top !important;
}

@media screen and (max-width: 1615px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:14%;
		margin-left:-1.5%
    }
}

@media screen and (max-width: 1555px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:14%;
		margin-left:-1.6%
    }
}

@media screen and (max-width: 1500px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:14%;
		margin-left:-1.7%
    }
}

@media screen and (max-width: 1380px) {
	.HPSPimgHeight{
		height: 450px;
	}

}

@media screen and (max-width: 1250px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:14%;
		margin-left:-2.0%
    }
}

@media screen and (max-width: 1200px) {
	.HPSPimgHeight{
		height: 420px;
	}
}

@media screen and (max-width: 1130px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:15%;
		margin-left:-2.2%
    }
}

@media screen and (max-width: 1040px) {
    .spButton {
        float:left;
		width:0%;
		margin-top:16%;
		margin-left:-2.5%
    }
}

@media screen and (max-width: 990px){
	.HPSPimgHeight{
		height: 400px;
	}
	
    .spButton {
        float:left;
		width:0%;
		margin-top:16%;
		margin-left:-2.7%
    }
	
}

@media screen and (max-width: 950px){
	    .spButton {
        float:left;
		width:0%;
		margin-top:17%;
		margin-left:-2.7%
    }
	
	
}

@media screen and (max-width: 900px){
	    .spButton {
        float:left;
		width:0%;
		margin-top:18%;
		margin-left:-2.9%
    }
	
	
}

@media screen and (max-width: 875px){
	.spButton {
        float:left;
		width:0%;
		margin-top:19%;
		margin-left:-3.1%
    }
	
	
}

@media screen and (max-width: 835px) {
	.HPSPrightTitle{
		margin-left:0px;
	}
	
	.HPSPrightText{
		margin-left:0px;
	}
	
	.HPSPinner{
		opacity:0;
	}
	
	.HPSPimgHeight{
		height: 350px;
	}

.HPSPbut-1{
	width: 100%;
    left: 0;
    top: 300px;
    margin-left: 0;
    margin-top: 0px;
    overflow: hidden;
}

.HPSPprev-but{
	float:left;
}

.HPSPnext-but{
	float:right;
}

}

/* @media screen and (max-width: 815px){ */

/* .spprev { */
	/* cursor: pointer; */
	/* position: absolute; */
    /* top: 59.2%; */
    /* margin-top: -50px; */
	/* margin-left: 23px; */
	/* line-height: 50px; */
	/* text-align: center; */
	/* background: #f6770c; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
	
/* .spnext { */
	/* right: 0; */
    /* border-radius: 3px 0 0 3px; */
	/* line-height: 50px; */
	/* cursor: pointer; */
    /* position: absolute; */
    /* top: 59.2%; */
    /* margin-top: -50px; */
	/* text-align: center; */
	/* background: #ffad52; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
/* } */

/* @media screen and (max-width: 795px){ */

/* .spprev { */
	/* cursor: pointer; */
	/* position: absolute; */
    /* top: 59.6%; */
    /* margin-top: -50px; */
	/* margin-left: 23px; */
	/* line-height: 50px; */
	/* text-align: center; */
	/* background: #f6770c; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
	
/* .spnext { */
	/* right: 0; */
    /* border-radius: 3px 0 0 3px; */
	/* line-height: 50px; */
	/* cursor: pointer; */
    /* position: absolute; */
    /* top: 59.6%; */
    /* margin-top: -50px; */
	/* text-align: center; */
	/* background: #ffad52; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
/* } */

/* @media screen and (max-width: 780px){ */

/* .spprev { */
	/* cursor: pointer; */
	/* position: absolute; */
    /* top: 60.2%; */
    /* margin-top: -50px; */
	/* margin-left: 23px; */
	/* line-height: 50px; */
	/* text-align: center; */
	/* background: #f6770c; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
	
/* .spnext { */
	/* right: 0; */
    /* border-radius: 3px 0 0 3px; */
	/* line-height: 50px; */
	/* cursor: pointer; */
    /* position: absolute; */
    /* top: 60.2%; */
    /* margin-top: -50px; */
	/* text-align: center; */
	/* background: #ffad52; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
/* } */

/* @media screen and (max-width: 760px){ */

/* .spprev { */
	/* cursor: pointer; */
	/* position: absolute; */
    /* top: 60.8%; */
    /* margin-top: -50px; */
	/* margin-left: 23px; */
	/* line-height: 50px; */
	/* text-align: center; */
	/* background: #f6770c; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
	
/* .spnext { */
	/* right: 0; */
    /* border-radius: 3px 0 0 3px; */
	/* line-height: 50px; */
	/* cursor: pointer; */
    /* position: absolute; */
    /* top: 60.8%; */
    /* margin-top: -50px; */
	/* text-align: center; */
	/* background: #ffad52; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
/* } */

/* @media screen and (max-width: 735px){ */

/* .spprev { */
	/* cursor: pointer; */
	/* position: absolute; */
    /* top: 61.4%; */
    /* margin-top: -50px; */
	/* margin-left: 23px; */
	/* line-height: 50px; */
	/* text-align: center; */
	/* background: #f6770c; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
	
/* .spnext { */
	/* right: 0; */
    /* border-radius: 3px 0 0 3px; */
	/* line-height: 50px; */
	/* cursor: pointer; */
    /* position: absolute; */
    /* top: 61.4%; */
    /* margin-top: -50px; */
	/* text-align: center; */
	/* background: #ffad52; */
	/* color: white; */
	/* opacity: 0.8; */
	/* font-size: 20px; */
	/* border-radius: 0 3px 3px 0; */
    /* user-select: none; */
    /* -webkit-user-select: none; */
	/* } */
	
/* } */