/* CSS for responsive UI */

/*******   INDEX  :: 4 Small Banners ********************/

.feature-banner {
	width: 100% !important;
	display: block;
	padding: 0;margin: 20px 0; float: left; text-align: center;
}
.banner4-wrap {width: 100%;}
.banner4-wrap ul {
	margin: 0; padding: 0;
	text-align: left;
	list-style: none;
}
.banner4-wrap li {
	list-style: none;float: left;display: inline;text-align: center;
	padding:0; }
	
	.banner4-wrap li.Feature-AR {
		background: url("../../images/banner/sm-banner1.png") no-repeat center center; 
		margin: 0 5px 5px 0; 
	}
	.banner4-wrap li.Feature-Refer {
		background: url("../../images/banner/sm-banner2.png") no-repeat center center; 
		margin: 0 0 5px 0; 
	}
	.banner4-wrap li.Feature-Reward {
		background: url("../../images/banner/sm-banner3.png") no-repeat center center; 
		margin: 0 5px 5px 0; 
	}
	.banner4-wrap li.Feature-IntlCall {
		background: url("../../images/banner/sm-banner4.png") no-repeat center center; 
		margin: 0; 
	}

@media (min-width:992px) {
	.banner4-wrap {margin: 0 auto; display: block;padding: 0; text-align: center; }
	.banner4-wrap li {
		width: 475px;
		height: 207px;
	}
}

@media (min-width:768px) and (max-width:991px) {
	.banner4-wrap {margin: 0 auto; max-width:765px; width:100%;padding: 0; text-align: center; float:none; }
	.banner4-wrap li {
		width: 380px;
		height: 166px;
	}
	.banner4-wrap li.Feature-AR, .banner4-wrap li.Feature-Refer,
	.banner4-wrap li.Feature-Reward, .banner4-wrap li.Feature-IntlCall
	{background-size: 100% 100%;}
}

@media (min-width:481px) and (max-width:767px) {
	.banner4-wrap {margin: 0 auto; display: block; width:475px;padding: 0; text-align: center; float:none;}
	.banner4-wrap li {
		display: block !important;
		width: 475px;
		height: 207px;
	}
	.banner4-wrap li.Feature-AR, .banner4-wrap li.Feature-Refer,
	.banner4-wrap li.Feature-Reward, .banner4-wrap li.Feature-IntlCall
	{background-size: 100% 100%;}
	.RWDplan .plantable-index h3 {font-size: 19px;}
	.RWDplan .plantable-index p {font-size: 15px;}
}

@media (max-width:480px) {
	.banner4-wrap {margin: 0 auto;width:300px;padding: 0; text-align: center; float:none;}
	.banner4-wrap li {
		display: block !important;
		width: 300px;
		height: 131px;
	}
	.banner4-wrap li.Feature-AR, .banner4-wrap li.Feature-Refer,
	.banner4-wrap li.Feature-Reward, .banner4-wrap li.Feature-IntlCall
	{background-size: 100% 100%;}
	.phoneDeal-img img {
	    width: 80%;}
}