@media handheld, only screen and (max-width: 1440px){
 #banner-new {     padding-top: 30px;}
.specsTitle { padding-bottom: 35px; padding-top: 10px;}
.specsDetCon {/* padding-top: 40px;*/}
.videoPlay_btn { width: 100%; max-width: 275px;}
 
.spdt_rt { line-height: 24px;}
/*.specsBike { top: -400px; margin-left: -250px; max-width: 500px; width: 100%;}
.specsBike img{ width: 100%; height: auto; }*/
.spectDetBlurb ul li { padding: 1px 0px 0 0;}
#sect_360 { padding: 20px 0px 90px 0px; background-size: 100% 100%;}
.get_hooked { padding-bottom: 10px;}
.draggerCon { padding-top: 10px;}
.image360Pan{ width: 668px; height: 403px; }
 
 
/*.featureCon{ max-width: 620px; }
.fet_tabs ul li{ max-width: 115px; margin: 0 10px; padding: 12px 0px 12px 0px;}*/
.carouselCon p { line-height: 30px; padding: 10px 0px;}
.fet_tabs { padding: 0px 0px 20px 0px;}
#color_sect { padding: 40px 0px 0px 0px;}
 
.colorPalate { padding: 0 0 0px 0;}
.colorPalate ul li span{ font-size: 14px; }
.gallery_tl { padding-bottom: 25px;}
#footerHolder { padding: 200px 0px 0px 0px;}
.ft_x200 { max-width: 680px;}
 
.bk_specs_list ul li{ padding:12px; }

}


@media handheld, only screen and (max-width: 1365px){
.carouselCon .owl-next{ right: -70px!important;}
.carouselCon .owl-prev{ left: -70px!important;}
.carouselCon .owl-next, .carouselCon .owl-prev { margin-top: -60px!important;}
}


@media handheld, only screen and (max-width: 1200px){
.menuBtnCon { right: 20px; }
.specsBike img{ width: 100%; height: auto; }
.carouselCon .owl-next{ right: 10px!important;}
.carouselCon .owl-prev{ left: 10px!important;}
}

@media handheld, only screen and (max-width: 1100px){
.specsBike { top:10%; width: 100%; max-width: 440px; margin-left: -220px;}
 
.bk_specs_list { position: relative; max-width: 300px; z-index: 9; margin-left:25%;}
 

.specsDetCon { position: relative; max-width: 370px; z-index: 9;}
#sect_360 { padding: 30px 0px 100px 0px;}
.carouselCon .owl-next{ right: 10px!important; }
.carouselCon .owl-prev{ left: 10px!important; }
#key_features { padding: 50px 0px 110px 0px;}
.navPan { /*display:none;*/ max-width: 745px; margin-right: 75px;}
.navPan ul li{ /*display:block;*/  text-align: center;  padding: 15px 6px 0px 6px;  }
.test_ride_con{ padding: 0 10px; }

}

@media handheld, only screen and (max-width: 1023px){
/*.menuBtnCon { right: 20px; top: 18px;}*/
.navPan { display: none; position: absolute; right: 0px; top: 44px; max-width: 100%; margin-right: 0px; background: #161616; padding: 10px 0px 10px 10px;}
.navPan ul li{ display:block;  text-align: center;  padding: 15px 6px 0px 6px;  }

#banner {margin-top:0px; }
 
.specsBike{ position: relative; max-width: 400px; margin: 0 auto 20px auto; left:auto; top: auto; }
.bk_specs_list{ max-width: 100%; margin-left:0; }
#specSect { padding: 40px 10px 75px 10px;}
.specsTitle{ text-align: center; padding-bottom: 20px; }
.spectDetBlurb{ display: none; padding: 0px 0; }
.spdt_lt { width: 30%;}
.specsDetCon { display:none; }
.spectDetBlurb ul li{ font-size: 12px; }
.bk_specs_list ul li{ letter-spacing: 0; }
#key_features { padding: 40px 0px;}
.tollTitle{ display: none; }
.bk_specs_list ul li{ border: none; border: none; margin: 0; padding: 5px 0 ; /*color:#fff; border-top: #fff 1px solid;*/}
.bk_specs_list ul li.avtiveSpecs{ background: none; border: none; }
.bk_specs_list ul li:hover{ background: none; border: none;/* border-bottom: #fff 1px solid;*/}
.bk_specs_list ul li span{ display: block; padding: 15px 0; background: #ff0000; color:#fff; }
.spectDetBlurb  ul li{border-top: #555555 1px solid;}
.spectDetBlurb  ul li:first-child{border:none;}
.bk_specs_list ul li:hover .spectDetBlurb  ul li{border-top: #555555 1px solid;}
.bk_specs_list ul li:hover .spectDetBlurb  ul li:first-child{border:none;}
.spdt_lt, .spdt_rt{ text-align: left; }

#gallery { padding-top:40px;}
.image360Pan{ width: 668px; height: 403px; }
.featureCon{ max-width: 650px; }

.fet_tabs ul li { /*max-width: 115px; margin: 0 5px;*/ width:24%;}
.ScrollPatchDiv { width: 480px;}
.draggerCon { max-width: 620px; padding-top: 50px;}
.colorPalate{ text-align: center; }
.colorBike img { width: 80%; margin-left: -40%;}
#wrapper .owl-nav{ display: none; }
#wrapper .owl-carousel .owl-controls .owl-dot{ display: inline-block; width: 12px; height: 12px; border:none; margin: 2px 15px; border-radius: 200px 200px 200px 200px; -moz-border-radius: 200px 200px 200px 200px; -webkit-border-radius: 200px 200px 200px 200px; background-color: #fff;  }
#wrapper .owl-carousel .owl-controls .owl-dot.active{ background-color: #ed1c22; }
#wrapper  .owl-dots{ text-align: center; }
/*.colorPalate { max-width: 505px;}
.colorPalate ul li{ margin-bottom: 5px; }*/
.mfp-arrow-right { right: 10px!important;}
.mfp-arrow-left { left: 10px!important;}
.fields_holder .panel{ margin-right: 20px; }
.btnPanel{ width: 21%; margin-left: 0; }

.loginPop { width:100%; max-width:300px; }
.loginBlurbs p.formTitle { padding:5px 0 10px 15px; font-size:28px; background-size:10px auto; }

.brochurePop { width:100%; max-width:300px; padding:30px 20px; background-image:none; }
.brochurePop .loginBlurbs {   padding:0 20px; float:left; margin-bottom:10px;}

}

@media handheld, only screen and (max-width: 800px){
#featureimg  {   left:0; bottom:14%; width: 100%;    text-align: center;}
.test_ride_con{ max-width: 320px; text-align: center; }
.test_ride_con h2{ font-size: 30px; padding-bottom: 10px; }
.fields_holder .panel{ display: block; width: 100%; margin: 0 0 20px; }
#flimSect p{ max-width:480px; margin:0 auto; } 
 
.btnPanel{ width: 100%; max-width: 100%; }
.test_ride_con p{ line-height: 22px; }
#banner-new { padding-top:0px;}
.priceSect {    padding: 30px 0px ;}
.price_select_con {padding:0;}
}

@media handheld, only screen and (max-width: 679px){
#banner { padding-top: 40px; min-height: 300px;}
#flimSect { padding:40% 0 10% 0; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/bg-seeitinaxn-tab.jpg") no-repeat right top; background-size:cover;     background-color: #660015;}
 
.btn{padding: 15px 0px 14px 0px;}
.videoPlay_btn { max-width: 210px; margin-top: 0px;}
#sect_360 { padding: 30px 0px 100px 0px;}
.image360Pan{ width: 468px; height: 284px; }
.featureCon{ max-width: 650px; margin-top:30px; }
.ScrollPatchDiv{ position: relative; margin: 0 auto; }
.bike360Name{ display: block; float: none; text-align: center; padding-top: 15px; }
.ScrollPatchDiv { width: 400px;}
.draggerCon { max-width: 620px; padding-top: 20px;}
.featureCon {  max-width: 400px;}
.carouselCon .owl-next, .carouselCon .owl-prev{width: 36px; height: 36px; background-size: cover;}
.fet_tabs ul li {  width:45%;  font-size: 14px; margin: 1px ; padding: 8px 0px 8px 0px;}

.spdt_lt { width: 40%;}
.spdt_rt{ width: 58%; line-height: 24px; }
.bk_specs_list ul li span{ padding: 10px 0px; }
 
.specsTitle, .get_hooked, .feture_tl, .color_tl, .gallery_tl{ font-size: 30px; }
#specSect { padding: 40px 10px 40px 10px;}
 
.colorPalate { max-width: 445px; position:relative;}
.colorPalate ul li { /*min-width: 75px; */ margin: 0 10px 40px 0; min-width:60px; width:17%!important}
.colorPalate ul li > div{ width: 51px; }

.colorPalate ul li span{ font-size: 15px;    line-height: normal;    position: absolute;    bottom: 7px;    width: 100%;    text-align: center;    left: 0; }
#gallery { padding: 40px 0px;}
.specsBike{ max-width: 180px;}

#footerHolder{ margin-top: -100px;  padding: 88px 0px 0px 0px; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/footer-bg-mobile.png") no-repeat center top; background-size: 100% 100%; }
.ft_x200 { max-width: 480px;}
.socialTab { padding: 50px 0px 20px 0px;}
.footer { padding: 20px 0px;}
 
.scrollPageTop{ display: none; }
 
.mfp-arrow{ margin-top: -30px;}

.priceHolder ul li{ padding: 10px 0px 15px 0px; }
.priceHolder .price_var{ display: block; width: 100%; padding: 10px 0px 10px 0px; }
.priceHolder span{ display: block; }

#prodrangFT .prodpan p {color:#ffffff; }
}

@media handheld, only screen and (max-width:480px){
#featureimg  {   left:0; bottom:10%;  }
#featureimg  img{ max-width:220px;  }

.specsBike{ max-width: 150px; display:none;}
}
@media handheld, only screen and (max-width: 479px){
/*.videoPlay_btn { margin-top: 20px; margin-left:50px;}*/
 #flimSect p{ font-size: 20px; line-height: 25px; max-width:320px;     }
#priceSect .container{    max-width: 310px;    text-align: center; }
 
.spdt_lt { width: 40%;}
.ScrollPatchDiv { width: 300px;}
.fet_tabs ul li { max-width: 45%; font-size: 14px; margin: 0 0px 5px 0px; padding: 10px 0px 10px 0px;}
.featureCon { max-width: 350px;}
.carouselCon p { font-size: 14px;   line-height:normal;}
.colorPalate ul li { margin: 0 0 40px 0;}
.specsTitle, .get_hooked, .feture_tl, .color_tl, .gallery_tl{ font-size: 26px;   }
.popImg{ width: 24%; margin:0.5%; }
.galleryCon{ padding: 0 30px; }
.ft_x200 { max-width: 370px;}
.socialTab ul li { max-width: 80px;}
.image360Pan{ width: 350px; height: 251px; }

.mobileColor_bike{ display: block; }
.sup360Adj sup { position: absolute; right: -9px; top: -5px;}
.price_select_con .selectBoxHld{ padding: 0 10px; }
.selectdiv { width:98%; margin:2%;}
.price_select_con .selectBox{ display: block; width: 100%; margin: 0 0 10px 0; }
}

@media handheld, only screen and (max-width: 370px){
 
.featureCon { max-width: 300px;}
.colorPalate ul li > div { width: 36px;}
/*.colorPalate ul li span { font-size: 11px;}*/
.ft_x200 { max-width: 300px;}
.specsBike{ max-width: 120px;}
.image360Pan{ width: 320px; height: 230px; }

}