@media only screen and (min-width: 768px) {
	.offrcontent .btns{ margin-left: 0; }
	.offrcontent .offrimg{ text-align: left; display: block;     padding: 30px 30px 0px;  width: auto; }
}
@media only screen and (min-width: 1400px) {

}
@media only screen and (min-width: 1600px) {

 }

/*ipad - both*/
@media (min-width: 768px) and (max-width: 1023px){
#topbanner img{ max-width:100%;margin:0 auto;}
.ftgif{width: 30% !important;top: 70px;left: 100px;}
	#cat_carousel #top_offers .owl-item .validty p{ font-size: 9px}
	#cat_carousel #top_offers .offrbox .offcalout { font-size: 14px}
	#cat_carousel #top_offer_box .owl-item .validty p{ font-size: 9px}
	#cat_carousel #top_offer_box .offrbox .offcalout { font-size: 16px}
	.offer_box .button_group .bluebtn{ width: auto; padding: 5px; font-size: 0.8rem}
	.bodyheight .offer_box h3{ font-size:16px;}
	.bodyheight .offer_box h3 span{ font-size:15px;}
	.otherpg .retail_cards h5 { font-size:19px}
	.category_list .offrbox{ min-height:365px; }
} 
/*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), only screen and (min-width: 768px) and (max-width: 900px){

}

@media (min-width: 580px){
	#topbanner .item .vmob{display: none;}
	.bodyheight .offer_box h3{ font-size:16px;}
	.bodyheight .offer_box h3 span{ font-size:15px;}
	.otherpg .retail_cards h5 { font-size:19px}
}
/*all mobiles & small tabs*/
@media (max-width: 767px){

	ul{ margin-bottom: 0; }	
	/*.bodybg, .bodytexture ,#home{ background:url("../resources/images/bg.jpg") #d7f7fc center 60px; background-size: cover;}*/
	#debit_banner .applyNow_btn{left: 64%;}
	.container {    width: 100%;}
	#mainNav div .hdfclogo{ text-align: center; display: inline-block; width: 100%;}
	/* .bodybg{ background: url("../resources/images/bg.png") repeat-y top center #feeb4c; background-size: cover} */
	/* loan css start */
	.load_list{ margin: 0; }
	.load_list .loan_item{ flex: 1 0 33.33%;}
	.festive_cards{ display: block; }
	.festive_cards .fcard{ margin: 0 0 20px; }
	.offrbox .brndimg{width: 65%;}
	
	.pgtitle{text-align: left;font-size: 18px;margin-bottom: 10px;margin-top: -20px}
	.offrbox .brndimg{width: 65%;}
	#tab .nav-item .nav-link{ font-size:0.8rem}
	.smallS{ display:block}
	.largeS{ display:none}
	#offer_bx .owl-stage-outer{ margin-left:-25px}
	.cmn_carousel .owl-stage-outer ,#offer_bx .owl-stage-outer{ margin-left:-25px}
	.offer_all { min-height:380px}
	#topbanner img{  max-width:100% }
	.offrboxwim img{ width:100%}
	.loanProduct img.prodimg{ float:none}
	.mobmp0{ /*margin:0px; padding:0px;*/}
	.offrcontent_detail{ width: 100%; text-align: center; }
	.loanProduct .loansInfo.offrcontent_detail h2{ text-align: center; margin-bottom: 10px; }
	.offerInfo div.logoimg{    float: none; width: 100%;}
	.loansInfo{min-height:auto; padding:0px 15px 15px;  }
	.loanProduct img.prodimg{ margin:0}
	.offrcontent{ padding: 0; }
	.offrcontent .offrimg{ padding-bottom: 20px; }
	.loanProduct .loansInfo .intdet{font-size: 15px;margin-bottom: 10px;}
	.pfbox .Ntitle{ min-height: 50px; line-height: normal; font-size: 22px;}
	.pfbox .discoun{/* min-height: auto;*/ }
	.btn_grp a{ display:block !important; font-size: 0.9rem !important; width: 100% !important; margin:10px auto  !important;}
	.mobmp0 .loanProduct img.prodimg { margin: 0px; max-width: 190px }
	.ftgif{width: 160px !important;top: 50px;left: 60px; }
	.offer_box .button_group .bluebtn{ width: auto; padding: 5px; font-size: 0.8rem}
	.swiperArrow .swiperight{ margin-right:0px; display: none}
	#onlinestore .swiper-slide a p{font-family: 'Open Sans', sans-serif;}
	.owl-theme .owl-nav.disabled+.owl-dots{ margin: 0; }
	#explore_offers h3{ font-size: 12px; min-height: 30px;  margin: 0;}
	#explore_offers .item{ padding: 20px 15px; }
	.festive_cards .fcard .applyNow_btn{ bottom: 6px; width: 130px; font-size: 12px; }
	.otherpg .purchase_type{ margin-bottom: 0; }
	.tabspanes{ padding: 15px; }
	.tabspanes .tab-content .tab-pane h4{ padding-bottom: 0; }
	.validity{ margin-bottom: 20px; }
	#cat_carousel .item .offrbox{min-height: 380px;}
	#cat_carousel #top_offers .owl-item .validty p{ font-size: 9px}
	.otherpg .retail_cards h5 { font-size:19px}
	.shop_innerpg .pfbox .Ntitle{ font-size: 12px;}
	.pwa_ft{ display: block }	
	#super_offer_box.owl-carousel .owl-stage{ padding-left: 0 !important; }
	.blgicon{position: absolute;right: 20px;}

	#category_list .row>div:nth-child(3){ order: 4; }
	#category_list .row>div:nth-child(7){ order: 8; }
	.festive_cards .fcard img{width: 100%; }
	.spendscontent .itembx{ position:relative; width: 100%}
  .spendscontent .itembx .itemdet{ position:relative; width: 100%; min-height: 130px}
  .spendscontent .itembx .itemdet{ z-index:10; transition: 0.2s ease all;}
  .rangesl{ position:absolute; width:82%; top:60px}
  .fl_head{ width:65%;}
  .fr_amt{ width:30%;}
  .fr_amt input[type='text'] {width:75%;}
  .amountbx .col50{ width:100%}
  .resultbx{background-size: cover;border-radius: 10px;}
  .crownimg{margin-top: -50px;}
  .spendscontent{margin-bottom: 70px;}
  #spendcarousel{padding: 0 20px;}
  #spendcarousel .owl-nav button.owl-next{right: -10px;}
  #spendcarousel .owl-nav button.owl-prev{left: -10px;}
  .ollist li{display: block;width: 100%;}
  .fbx{margin:2px 0px;min-height: 40px;font-size: 0.9rem;padding: 12px 10px 12px 50px;}
  .festive_cards .fcard{display: block;width: 100%;margin:10px 0;}
}

@media (max-width: 580px){
	.mult_item #category_list .offrbox{min-height: 250px;}
	
	.mult_item #category_list .offrbox > p{font-size: 0.85rem;}

	.mult_item .offrbox  > h3{padding:75px 5px 10px 5px !important;font-size: 1rem !important;}
	.col-md-4 .offrbox {width: 100%;margin: 0px auto 20px;}
	.burger-menu {width: 100%;left: -100%}   
	#topbanner .item .vdesk{display: none;}
	#cat_carousel #top_offers .offrbox .offcalout { font-size: 14px}
	.otherpg .retail_cards h5 { font-size:19px}
	#top_offers .owl-nav .owl-prev{left: -10px}
	#top_offers .owl-nav .owl-next{right: -10px}
	#swip_cat{padding:0px 10px;}
	.offrsbike img{display: block;margin:0 auto;}
	.inblogpg .content h1{font-size: 22px;}
	.mult_item .offrbox .brndimg{ padding-top: 50px;}
		.mult_item #category_list .row{margin-left:-8px;margin-right:-8px;}
		.mult_item #category_list .col-6.col-md-4{padding-left:8px;padding-right:8px;}
		.mult_item #category_list .col-sm-12{padding-left:8px;padding-right:8px;}
		.offrbox .offrcta{bottom:1%;}
	.mBnr li{width: 100%}
   .mBnr li img{width: 200px}
   .mBnr h2{color: #fff;font-size: 16px;line-height: 22px;}   
}

@media (max-width: 480px){
	.ftgif{width: 120px !important;top: 40px;}
	.otherpg .retail_cards{min-height: 280px}
	#cat_carousel #top_offers .offrbox .offcalout { font-size: 18px}
	.otherpg .retail_cards h5 { font-size:23px}
	.SafetyCarousel h4{font-size: 18px;}
}
@media (max-width: 420px){
	.offrbox .offrcta a{font-size: 12px;width: 80%;}
	.offrbox h4{font-size: 22px;min-height: 80px;}
	.ftgif{left: 40px;}
	.otherpg .retail_cards{min-height: 280px}
	#onlinestore .swiper-slide a img{width: 100%}
	.blogmenu .retail_cards, #article_bx .retail_cards{min-height: 230px;}
	  .switch .slider:before{width: 16px;height: 16px;}
  .switch{height: 24px;width: 50px;margin: 5px 5px}
  .cdList li:last-child{font-size: 14px;}
}

@media (max-width: 360px){
	.ftgif{width: 100px !important;}
	.otherpg .retail_cards{min-height: 280px}
}

@media (max-width: 320px){
	#onlinesh .swiper-slide a p{width: 100px}
}