/*all desktop*/
@media (min-width:1200px) {
}

/*all small devices*/
@media (max-width:1200px) {
	.wrapper {
		width: 90%;
	}

}

@media (min-width:991px) and (max-width:1200px) {
	.card-detail img {
		padding-bottom: 0;
		height: 32px;
	}

	.card-detail h4 {
		font-size: 18px;
		padding-bottom: 8px;
	}

}

@media (min-width:768px) and (max-width:990px) {
	.col3 {
		width: 50%;
	}

	.card>img {
		min-width: 100%;
	}

}

/*ipad - both*/
@media (min-width:768px) and (max-width:1024px) {
}

/*ipad - landscape*/
@media (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
}

/*ipad - portrait*/
@media (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
}

/*all mobiles & small tabs*/
@media (max-width:767px) {
	.vmobile {
		display: block;
	}

	.vdesc {
		display: none;
	}

	.col12, .col7, .col6, .col5, .col3 {
		width: 100%;
	}

	.top-banner {
		background-position: center right;
		background: #dcf2fd;
	}

	.top-content {
		padding: 0px 0px 40px;
	}

	.top-content>img {
		padding-bottom: 5px;
	}

	.top-content h1>span {
		font-size: 35px;
	}

	.top-content h4 {
		font-size: 21px;
	}

	.card>img {
		min-width: 100%;
	}

	.onbanner {
		width: 100%;
	}

	.textOne p:nth-child(2) {
		font-size: 25px;
	}

	.textOne p:first-child {
		font-size: 45px;
	}

	.textOne span {
		font-size: 80px;
	}

	.textTwo {
		text-align: center;
	}

	.textTwo p:first-child {
		padding-bottom: 10px
	}

	.top-section {
		background: url(../resources/images/mobile-banner-offer-details.png) no-repeat;
		background-size: 100% 80%
	}

}

@media (max-width:1024px) {
	.onbanner {
		float: none;
		max-width: 800px
	}

	.innerlogo {
		display: block;
		margin: 0 auto
	}

	.topText {
		padding-top: 30px
	}

}

@media (max-width:1200px) {
	.onbanner {
		max-width: 650px
	}

}

/*mobile*/
@media (max-width:580px) {
	.top-content h1 {
		font-size: 25px;
	}

	.top-content h1>span {
		font-size: 16px;
	}

	.top-content h4 {
		font-size: 13px;
	}

	.redbtn {
		font-size: 14px;
		padding: 12px 30px;
	}

	.top-content .left {
		width: 50%;
		display: inline-block;
		vertical-align: top;
		float: left;
	}

	.top-content .right {
		width: 48%;
		display: inline-block;
		vertical-align: top;
		float: right;
	}

	.top-content {
		padding: 0px 0px 10px;
	}

	.top-content>div {
		margin-bottom: 10px;
	}

	.home-offers {
		padding: 20px 0 30px;
	}

	.home-offers h1 {
		font-size: 25px;
		margin-bottom: 15px;
	}

	.col3 {
		width: 50%;
	}

	.card-detail {
		width: 95%;
	}

	.card-detail p {
		font-size: 10px;
	}

	.card-detail h4>span {
		font-size: 14px;
	}

	.card-detail img {
		padding-bottom: 0;
		height: 16px;
	}

	.card-detail h4 {
		font-size: 15px;
		padding-bottom: 0;
	}

	.viewBtn {
		margin: 0 10px 25px;
	}

	.viewBtn h5 {
		font-size: 12px;
		padding: 10px 5px;
	}
	.desv{display: none;}
	.mobv .right nobr{font-size: 18px}

}

@media (max-width:500px) {
	.textOne {
		text-align: center;margin-bottom: 10px
	}

	.textTwo p:first-child {
		padding-bottom: 10px;
	}

	.textOne span nobr {
		font-size: 40px;
	}

	.listBanner li {
		line-height: 30px;
		background-position: 0px 9px;
	}

	.availList h1, .offerterms h1 {
		font-size: 22px;
	}

	.termsList li {
		line-height: 25px;
		background-position: 0px 9px;
	}

	.innerlogo{padding: 0;margin-bottom: -40px;}
	.top-section{background-size: 100% 50%;}
	.textOne span{font-size: 70px}
	.textOne p:first-child{font-size: 25px}
	.offerBtn{margin: 20px auto 20px auto}
	.topText{padding-top:20px;}
	.textOne p:nth-child(2){font-size: 22px}
	.listBanner{font-size: 14px}
	.mobv .innerlogo{width: 80%}
	.mobv .right p{font-size: 16px}
	
}

@media (max-width:320px){
	.top-section{background-size: 100% 35%;}
	.topText img{width: 50%}
	.textOne p:first-child{font-size: 22px;line-height: 20px;} .textOne span nobr{font-size:30px;}
	.innerlogo{margin-bottom: -30px} .textOne p:nth-child(2){font-size: 18px}
	.textTwo span{font-size: 16px} .textOne{margin-bottom: 20px}
	.textTwo p:first-child{font-size: 14px}
	.listBanner li{line-height: 25px}
	.removeBr br{content: ''}
	.bgBanner{background-size: 100% 45%}
	.mobv .right p{font-size: 14px;}
}

@media (min-width:581px){
	.mobv{display: none;}
}