@media handheld, only screen and (max-width: 1440px){
.logo { width: 155px;}
.navPan ul li { padding: 15px 23px 0px 23px;}
.menuBtnCon { top: 17px;}
#flimSect { padding: 45px 0px 400px 0px;}
.specsTitle { padding-bottom: 35px; padding-top: 10px;}
.specsDetCon { padding-top: 40px;}
.videoPlay_btn { width: 100%; max-width: 275px;}
.btn{padding: 20px 0px 20px 0px;}
#flimSect p { padding: 0px 0px 20px 0px;  line-height: 34px;}
.spdt_rt { line-height: 24px;}
.specsBike { top: -400px; margin-left: -250px; max-width: 500px; width: 100%;}
.specsBike img{ width: 100%; height: auto; }
#specSect { padding: 40px 0px 85px 0px;}
.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: 400px; }
#key_features { padding: 20px 0px 110px 0px;}
.feture_tl { padding-bottom: 15px;}
.featureCon{ max-width: 620px; }
.fet_tabs ul li{ max-width: 120px; margin: 0 10px; padding: 12px 0px 12px 0px;}
.carouselCon p { line-height: 30px; padding: 10px 0px 0px 0px;}
.fet_tabs { padding: 0px 0px 20px 0px;}
#color_sect { padding: 40px 0px 0px 0px;}
.color_tl { padding-bottom: 5px;}
.colorPalate { padding: 0 0 0px 0;}
.colorPalate ul li span{ font-size: 14px; }
#gallery { padding: 60px 0px 0px 0px;}
.gallery_tl { padding-bottom: 25px;}
#footerHolder { padding: 400px 0px 0px 0px;}
.ft_x200 { max-width: 680px;}
.socialTab { padding: 70px 0px 10px 0px;}
.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; }
#flimSect{ padding: 160px 0px 400px 0px;}
#specSect{ padding: 110px 10px 129px 10px;}
.specsBike{ top: -390px; width: 100%; max-width: 500px; margin-left: -250px; }
.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){
#flimSect { padding: 100px 0px 300px 0px;}
.specsBike { top: -330px; width: 100%; max-width: 440px; margin-left: -220px;}
.bk_specs_list { position: relative; max-width: 300px; z-index: 9;}
.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 { max-width: 680px; margin-right: 75px;}

}

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

#banner {margin-top:0px; }
#flimSect { padding: 60px 0px 80px 0px; background-size: 100% 100%;}

.specsBike{ position: relative; max-width: 200px; margin: 0 auto 20px auto; left:auto; top: auto; }
.bk_specs_list{ max-width: 100%; }
#specSect { padding: 40px 10px 75px 10px;}
.specsTitle{ text-align: center; padding-bottom: 20px; }
.spectDetBlurb{ display: none; padding: 0px 0; }
.spdt_lt { width: 30%;}
.spectDetBlurb ul li{ font-size: 12px; }
.bk_specs_list ul li{ letter-spacing: 0; }
#key_features { padding: 50px 0px 50px 0px;}
.tollTitle{ display: none; }
.bk_specs_list ul li{ border: none; border: none; margin: 0; padding: 5px 0 5px 0; /*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; }
.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; }

.image360Pan{ width: 668px; height: 400px; }
.featureCon{ max-width: 650px; }

.fet_tabs ul li { max-width: 140px; margin: 0 5px;}
.ScrollPatchDiv { width: 480px;}
.draggerCon { max-width: 620px; padding-top: 50px;}
.colorPalate{ text-align: center; }
.colorBike img { width: 100%; margin-left: -50%;}
#wrapper .owl-nav{ display: none; }
#wrapper .owl-carousel .owl-controls .owl-dot{ display: inline-block; width: 15px; height: 15px; border: #ed1c22 1px solid; margin: 0 5px; border-radius: 200px 200px 200px 200px; -moz-border-radius: 200px 200px 200px 200px; -webkit-border-radius: 200px 200px 200px 200px; }
#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;}

}

@media handheld, only screen and (max-width: 679px){
#banner { padding-top: 40px; min-height: 300px;}
#flimSect { background: url(https://www.heromotocorp.com/en-in/xtreme200r/images/bg-video-sect-mobile.jpg) no-repeat center top;}
#flimSect p{ font-size: 14px; line-height: 29px; } 
.btn{padding: 15px 0px 14px 0px;}
.videoPlay_btn { max-width: 210px; margin-top: 0px;}
#sect_360 { padding: 0px 0px 100px 0px;}
.image360Pan{ width: 468px; height: 284px; }
.featureCon{ max-width: 650px; }
.ScrollPatchDiv{ position: relative; margin: 0 auto; }
.bike360Name{ display: block; float: none; text-align: center; }
.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 { max-width: 90px; font-size: 12px; margin: 0 0px; padding: 8px 0px 8px 0px;}
.spdt_lt { width: 42%;}
.spdt_rt{ width: 50%; line-height: 24px; }
.bk_specs_list ul li span{ padding: 10px 0px; }
#sect_360{ background: #151515; }
.specsTitle, .get_hooked, .feture_tl, .color_tl, .gallery_tl{ font-size: 30px; }
#specSect { padding: 40px 10px 40px 10px;}
#color_sect { padding: 50px 0px 0px 0px;}
.colorPalate { max-width: 445px;}
.colorPalate ul li { min-width: 75px; margin: 0 10px;}
.colorPalate ul li > div{ width: 51px; }

.colorPalate ul li span{ font-size: 13px; }
#gallery { padding: 60px 0px 40px 0px;}
.specsBike{ max-width: 180px;}

#footerHolder{ margin-top: 0;  padding: 88px 0px 0px 0px; background: url(https://www.heromotocorp.com/en-in/xtreme200r/images/footer-bg-mobile.jpg) no-repeat center top; background-size: 100% 100%; }
.ft_x200 { max-width: 480px;}
.socialTab { padding: 50px 0px 20px 0px;}
.footer { padding: 20px 0px;}
.carouselCon p { padding: 20px 0px 15px 0px;}
.scrollPageTop{ display: none; }
#key_features { background: url(https://www.heromotocorp.com/en-in/xtreme200r/images/bg-key-features-mobile.jpg) no-repeat center top;}
.mfp-arrow{ margin-top: -30px;}
.color_bike_con{margin-top: 200px !important;}
}

@media handheld, only screen and (max-width: 479px){
.videoPlay_btn { margin-top: 20px;}
#flimSect { padding: 40px 0px 65px 0px;}
#flimSect p{ padding: 0 10px; }
#flimSect p br{ display: none;  }
#flimSect p span{ display: block; }
.spdt_lt { width: 48%;}
.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: 18px; padding: 15px 0px 0px 0px;}
.colorPalate ul li { margin: 0 0 10px 0;}
.specsTitle, .get_hooked, .feture_tl, .color_tl, .gallery_tl{ font-size: 26px; padding-bottom: 20px; }
.popImg{ width: 50%; }
.galleryCon{ padding: 0 30px; }
.ft_x200 { max-width: 370px;}
.socialTab ul li { max-width: 80px;}
.image360Pan{ width: 350px; height: 242px; }
.specsBike{ max-width: 150px;}
.mobileColor_bike{ display: block; }
.sup360Adj sup { position: absolute; right: -9px; top: -5px;}
}

@media handheld, only screen and (max-width: 370px){
#flimSect p { font-size: 12px; line-height: 22px;}
.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: 200px; }

}