@charset "utf-8";
/* CSS Document */
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800");
@import url("https://fonts.googleapis.com/css?family=Fjalla+One");
@font-face {
    font-family:'Rupee_Foradian_1';
    src: url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.eot');
    src: url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.eot') format('embedded-opentype'),
         url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.woff2') format('woff2'),
         url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.woff') format('woff'),
         url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.ttf') format('truetype'),
         url('https://www.heromotocorp.com/en-in/xpulse200t/fonts/Rupee_Foradian_1.svg#Rupee_Foradian_1') format('svg');
}

/*Reset*/
*{ -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;  box-sizing: border-box;}
h1, h2, h3, h4, h5, h6, p, div, ul{ margin:0; padding:0; font-weight:normal; line-height:100%;  }
form { margin:0; padding:0; display:inline;}

a{ text-decoration:none; outline:none; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s;/**/}
*:focus{outline:none;}
ul{list-style:none;}
img { border:0; vertical-align:middle;}
body { position: relative; margin:0; padding:0; font-family:'Open Sans', Arial, Helvetica, sans-serif; color:#353535; width:100%; background:#8d7156 url("https://www.heromotocorp.com/en-in/xpulse200t/images/bg.jpg"); background-attachment:fixed;    }
.clear { clear:both; margin:0; padding:0; }
input[type="button"]{cursor:pointer;}
.f-left{float:left;}
.f-right{float:right;}
.Text-align-left{ text-align:left;}
.Text-align-right{ text-align:right;}
.clearfix:after {content: " "; /* Older browser do not support empty content */ visibility: hidden; display: block; height: 0; clear: both;}
.overFlow{ overflow-x:hidden;}
p{ font-size:14px; line-height:27px; color:#393939;}
.f-left{ float: left;}
.f-right{ float: right;}
svg, canvas{ pointer-events: none;}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

/*Reset*/
#wrapper{ width: 100%; margin:0 auto; padding: 0; max-width:1920px; }
.container{ position: relative; width: 100%; max-width: 1200px; margin:0 auto; }
section{ width: 100%; margin:0; padding:0; }

#headerHolder{ position: fixed; left: 0px; top: 0px; width: 100%; margin: 0; padding: 0; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/heder-bg.jpg") repeat-y center top; z-index: 9999;}
.headerCon{ background: #161616; }
.logo{ width: 200px; float: left;}
.logo img{ width: 100%; height: auto; }
.navPan{ width: 100%; max-width: 861px; float: right; margin-right: 55px; padding-bottom:14px; } 
.navPan ul{ margin: 0; padding: 0; text-align:right;}
.navPan ul li{ display: inline-block; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 18px; color: #ffffff; text-transform: uppercase; margin: 0; padding: 15px 11px 0px 11px;}
.navPan ul li a{ color: #ffffff; }
.navPan ul li a:hover, .navPan ul li a.activeNav{ color: #ed1e27; }

.menuBtnCon{ position: absolute; right: 5px; top: 14px; cursor: pointer; }
#banner-new { position:relative; }
#featureimg  { position:absolute;  left:3%; bottom:10%;    } 

#banner{ width: 100%; position: relative; /*overflow-x: hidden; margin-top: -70px; min-height: 1080px; */}
#banner img{ width: 120%; height: auto; margin-left: -10%; }
#banner .topImg{position: relative; z-index: 10; }
#banner .banner-logo{position:absolute; top:30%; left:68%; width: 23%; z-index: 11;}
#banner .banner-bike{position:absolute; top:30%; left:45%; width: 50%; margin-left: -25%;  z-index: 11;}


#banner .banner-smoke1{ position: absolute; top: 52%; left: 92%; width: 38%;
    margin-left: -26%;
    z-index: 11;
  }

#banner .banner-smoke2{
    position: absolute;
    top: 48%;
    left: 3%;
    width: 28%;
    z-index: 12;
  }

#flimSect{ position: relative; width: 100%; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/bg-seeitinaxn.jpg") no-repeat right top; background-size: cover; padding: 8.88% 0px; /*z-index: 99;*/ }
#flimSect p{ font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 30px; color: #ffffff; line-height: 37px; text-align: center; font-weight: 400; padding:0px 0px 20px 0px; }
#flimSect p span{ color: #ed1e27; }

.btn{ position: relative; font-size: 14px; color: #ffffff; text-align: center; font-weight: bold; background-color:#ff3333; text-transform: uppercase; border: #000 1px solid; margin: 50px auto 0; padding: 20px 0px 20px 0px; cursor: pointer; letter-spacing: 2px; word-spacing: 3px;  -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; }
.btn span{ color: #ed1e27; }
.btn:hover{ color: #ed1e27; background: #141414; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; }
.videoPlay_btn{ width: 100%; max-width: 300px; }

.playDragger{ display: none; position: absolute; right: -210px; top: 50%; width: 100%; max-width: 210px; margin-top: -20px; }
.pl_gragger_btn{ position: absolute; right: 0px; top: 0px; }

#specSect{ width: 100%; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/bg-specs.jpg") no-repeat center top; background-size: cover; padding: 125px 0px 240px 0px;}
.bk_specs_list{ width: 100%; max-width: 340px; margin-left:25%; float: left;}
.specsTitle{  padding-bottom: 50px;}


.bk_specs_list ul{ margin: 0; padding: 0; }
.bk_specs_list ul li{ width: 100%; margin: 10px 0; padding: 15px 0; font-size: 14px; color: #000; background-color:#fff; text-align: center; font-weight: bold; text-transform: uppercase; letter-spacing: 3px; border: #494d53 1px solid; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; cursor: pointer;}
.bk_specs_list ul li.avtiveSpecs{ color:#fff;}
.bk_specs_list ul li:hover, .bk_specs_list ul li.avtiveSpecs{ background: #ff0000; border: transparent 1px solid; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s;}

.specsDetCon{ width: 100%; max-width:530px; float:left; padding-top:15px; padding-left:2%; }
.tollTitle{font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 24px; color: #000; line-height: 44px; text-transform: uppercase; padding-bottom: 10px;}

.spectDetBlurb{ width: 100%; display: none; }
.spectDetBlurb ul li{ font-size: 14px; color: #000;   margin:0; padding: 3px 0px; border-top: #555555 1px solid; }
.spectDetBlurb ul li:first-child{ border: none; }
.spdt_lt{ display: inline-block; width: 35%; color: #ed1e27; line-height: 30px; vertical-align: top;}
.spdt_rt{ display: inline-block; width: 64%; line-height: 30px; vertical-align: top;}
.spdt_rt span { color: #ff0000!important;    background: none!important;}
.specsBike{ position: absolute; left: 2%; top:10%; margin-left: -23%; }

#priceSect {border-bottom: #ccc 1px solid;}
.priceSect{ position: relative; padding: 70px 0px 60px 0px; background-color:#fff; }

h2 { font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px; color: #ed1e27; text-align: center; text-transform: uppercase; }
h2 span { color:#000; }

.priceSect h2 { font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px; color: #ed1e27; text-align: center; text-transform: uppercase; }
.priceSect p{ font-size: 14px; color: #000; text-align: center; padding: 15px 0px; line-height: 100%; font-weight:600;}

.price_select_con{ width: 100%; padding: 20px 0px 10px 0px;  }
.price_select_con .selectBoxHld{ width: 100%; max-width: 700px; font-size: 0; margin: 0 auto; }
.selectdiv { display: inline-block;    width: 48%;    overflow: hidden;    background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/price-select-arrow.gif") no-repeat right 17px center;
    border: #494d53 1px solid; margin:0 1%; }
.price_select_con .selectBox{  display: inline-block; width: 44%; font-size: 14px; color: #000; margin: 0 3%; padding: 13px 10px; border: #494d53 1px solid; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/price-select-arrow.gif") no-repeat right 17px center; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color:#EBEBEB; 


 
    width: 120%;
    
  
    border: none;
    
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
   
    background: none; }
	
.price_select_con .selectBox option{ color: #303030!important; }

.priceHolder{ width: 100%; max-width: 700px; margin: 0 auto; padding: 0 10px;    text-align: center; }
.priceHolder .licationTL{ font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px;   text-transform: uppercase; padding: 35px 0px 15px 0px; }

.priceHolder ul{ margin: 0; padding: 0; }
.priceHolder ul li{ display: block; font-size:0; border-bottom: #494d53 1px solid; padding: 10px 0px 25px 0px; }
.priceHolder .price_var{ display: inline-block; width: 50%; vertical-align: top;}
.priceHolder span{ display: block; font-size: 14px; color: #ec1e22; line-height: 100%; display: none; }
.priceSect .priceHolder p{ font-size: 16px;  text-align: center; padding: 15px 0px 0px 0px; }
.priceSect .priceHolder p:last-child{ display: none; }
.priceSect .priceHolder p b{ font-family: 'Rupee_Foradian_1', Arial, Helvetica, sans-serif; font-size: 16px;  font-weight: normal; }

.priceHolder ul li:first-child span{ display: block; }
.priceHolder ul li:last-child{ border: none; }

.priceDicCon{ width: 100%; max-width: 700px; margin: 0 auto; padding: 35px 10px 0px 10px;     text-align: center;
 }
.priceDicCon .dis{ font-size: 14px; color: #ec1e22; font-weight: bold; text-transform: uppercase; }
.priceDicCon ul{ margin: 0; padding: 5px 0px 0px 0px; }
.priceDicCon ul li{ font-size: 12px; color: #ffffff; line-height: 100%; margin: 0; padding: 7px 0px 7px 15px; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/bullet-gif.gif") no-repeat left top 11px; }

#sect_360{ width: 100%;  background-size: cover; padding: 110px 0px 65px 0px; background-color:#fff;}
.get_hooked{font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px; color:#ffffff; text-align: center; line-height: 48px;  text-transform: uppercase; padding-bottom: 45px; }
.get_hooked span{ color: #000000; }
.get_hooked sup{ font-size: 14px; }
.loaderCon360{position: absolute; width: 100%; height: 100%;}
.loaderCon360 img{position: absolute; left: 50%; top: 50%; margin-top: -16px; margin-left: -16px; width: 32px!important; height: 32px!important;}
.sup360Adj{ position: relative; display: inline-block; position: relative; }
.sup360Adj sup{ position: absolute; right: -9px; top:-9px; }
.image360Pan{ width: 968px; height:584px; padding: 0; margin: 0 auto; position: relative;}
.image360Pan img{ width: 100%; height: auto; }
.draggerCon{ width: 100%; max-width: 800px; margin: 0 auto; padding-top: 10px; }
.bike360Name{ width: 100%; font-size: 14px; color: #000000; text-align: right; font-weight: bold; }
.ScrollPatchDiv {
    position: absolute;
    width: 650px;
    height: 21px;
    background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/vid-drag-line.gif") center repeat-x;
    margin: 0 0 0 0px;
}
.DragBtn {
    position: absolute;
    background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/dragger-circle.png") no-repeat;
    left: 0px;
    top: -20px;
    width: 39px;
    height: 39px;
    margin: 12px 0 0 0;
}


#key_features{ width: 100%;  padding: 110px 0px 140px 0px;}
.feture_tl{font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px; color: #ffffff; text-align: center; line-height: 48px;  text-transform: uppercase;   }
 
.featureCon{ width: 100%; max-width: 700px; margin: 45px auto 0; padding: 0px 0px 0px 0px; }
.fet_tabs{ text-align: center; padding: 0px 0px 40px 0px }
.fet_tabs ul{ margin: 0; padding: 0;   }
.fet_tabs ul li{ position: relative; display: inline-block; width: 100%; max-width:169px; height:60px; vertical-align:top; font-size: 14px; color: #000000; text-align: center; font-weight: 600; line-height: 100%;  margin: 0 1px; padding: 15px 0; cursor: pointer; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; border:0; }
.red_gradient{ display: none; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background:#ed1c22; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s;}
.fet_tabs ul li:hover{ color: #ffffff; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s;}
.fet_tabs ul li:hover .red_gradient{ display: block; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s;}
.fet_tabs ul li span{ /*position: relative; z-index: 999;*/ position: absolute;
    z-index: 999;    width: 100%;    left: 50%;    top: 50%;    transform: translateY(-50%) translateX(-50%); } 




.bg_thrilling, .bg_agile, .bg_headturner, .bg_precise {background:rgba(255, 255, 255, 0.5); }

#wrapper .carouselCon{ display: none; }
.carouselCon p{ font-size: 18px; color: #fff; text-align: center; line-height: normal; padding: 20px 0px 0px 0px; font-weight: normal; }
.carouselCon .owl-prev { position: absolute; left: -170px!important; top: 50%; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/arrow-prev.png") center no-repeat!important; display: block!important; height: 56px; width: 56px; margin-top: -60px; color: transparent;}
.carouselCon .owl-next { position: absolute; right: -170px!important; top: 50%; background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/arrow-next.png") center no-repeat!important; display: block!important; height: 56px; width: 56px; margin-top: -60px; color: transparent;}

#color_sect{   background-size: cover; padding: 100px 0px 0px 0px; }
.color_tl{  padding-bottom: 30px; }
 

.colorPalate{ width: 100%; max-width: 500px; margin: 0 auto; padding: 0 0 10px 0; text-align:center;}
.colorPalate ul{ margin: 0; padding: 0; position:relative; }
.colorPalate ul li{ display: inline-block; /*min-width: 165px;*/ margin:0 0 40px 0; vertical-align: top; text-align: center; cursor: pointer; width:19%;  }
.colorPalate ul li > div{ width: 90px; min-height: 25px; margin: 0 auto; }
.colorPalate ul li img{ margin: 0 auto; }
.colorPalate ul li span{ display: block; font-size: 15px; color: #fff; text-align: center; line-height: 24px;  visibility: hidden; padding-top: 5px; position:absolute; text-align:center; width:100%; left:0;  bottom:7px; }
.active_color{ display: none; }

.gray{ background: #647284; }
.blck{ background: #000000; }
.red{ background: #ff3031; }
.dark_blue{ background: #13171b; }
.sky_blue{ background: #0075c4; }

.color_bike_con{ position: relative; width: 100%; }
.color_bike_con .colorBanner{ width: 100%; height: auto; }
.colorBike{ position: absolute; left: 0; top:0px; width: 100%; height: 100%; }
.colorBike img{ position: absolute; width: 50%; height: auto; left: 50%; bottom: 0; margin-left: -25%;  }

/*.colorBike{ width: 100%; display: none; }
.colorBike img{ width: 100%; height: auto; }*/

.mobileColor_bike{ display: none; }

/*Navigation*/
#nav-icon1 {
	display:block;
  width: 30px;
  height: 22px;
  /*position: absolute; right:15px; top:11px;*/
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon1 span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #ffffff;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
}

#nav-icon1 span:nth-child(1) {
  top: 0px;
}

#nav-icon1 span:nth-child(2) {
  top: 10px;
  height: 1.5px;
}

#nav-icon1 span:nth-child(3) {
  top: 20px;
}

#nav-icon1.open span:nth-child(1) {
  top: 8px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#nav-icon1.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

#nav-icon1.open span:nth-child(3) {
  top: 8px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
/*Navigation*/

#gallery{ width: 100%;   padding: 110px 0px 0px 0px; }
.gallery_tl{  padding-bottom: 45px; }
 /*pop ups*/
.galleryCon{ width: 100%; max-width: 960px; margin: 0px auto 0px auto; }
.popImg{ width: 25%; float: left; overflow: hidden; }
.popImg img{ width: 100%; height: auto; transition: all .5s ease-in-out;}
.popImg:hover img{ -ms-transform: scale(1.05);  -webkit-transform: scale(1.05); transform: scale(1.05);}



/*pop ups*/
.popHolder { background-color:#ffffff; position:relative; font-size:13px; }
.loginPop { width:770px; padding:35px 0 50px 0; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/pop-divider.gif") repeat-y center top #ffffff; }
.loginBlurbs { width:305px; padding:0 35px 0 40px; float:left; }
.loginBlurbs p { padding:0 0 10px 0; }
.loginBlurbs p.formTitle { padding:5px 0 10px 25px; letter-spacing:-2px; font-size:38px; line-height:100%; color:#303030; font-family:'Open Sans', sans-serif; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/login-arrow.gif") no-repeat left top; }
.loginBlurbs a, .loginBlurbs span { color:#ed1c24; }
.loginBlurbs a.frgtpass { color:#ed1c24; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/password-arrow.gif") no-repeat right center; display:inline-block; padding-right:10px; }
.loginBox { width:190px; padding:5px 10px 5px 13px; border:0; border:1px solid #1c1c1c; background:#ffffff; outline:none; height:20px; font-size:13px; color:#303030; font-family:'Open Sans'; }

.brochurePop { width:776px; padding:35px 0 50px 0; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/pop-divider.gif") repeat-y center top #ffffff;  bg}
.brochurePop .loginBlurbs { width:auto; padding:0 35px 0 40px; float:left; }
.brochurePop .loginBlurbs p.formTitle { padding:5px 0 20px 25px; }
.loginBox {
    width: 190px;
    padding: 5px 10px 5px 13px;
    border: 0;
    border: 1px solid #1c1c1c;
    background: #ffffff;
    outline: none;
    height: 33px;
    font-size: 13px;
    color: #303030;
    font-family: 'Open Sans';
}


#footerHolder{ width: 100%; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/footer-bg.png") no-repeat center top; background-size: cover; padding: 380px 0px 0px 0px; margin-top: -270px; }
.ft_x200{ width: 100%; max-width: 880px; margin: 0 auto; }
.ft_x200 img{ width: 100%; height: auto; }

.socialTab{ width: 100%; max-width: 480px; margin: 0 auto; padding: 2% 0 0 0;  text-align: center; }
.socialTab ul{margin: 0; padding: 0; }
.socialTab ul li{ display: inline-block; width: 100%; max-width: 200px; text-align: center; margin: 0 15px; padding: 10px 0; border: #ffffff 1px solid; cursor: pointer; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; } 
.socialTab ul li:hover{ background-color: #141414; border: #141414 1px solid; -moz-transition-duration: .2s; -o-transition-duration: .2s; -webkit-transition-duration: .2s; transition-duration: .2s; }


.footer{ width: 100%;  margin: 0 auto; padding: 40px 0px; }
.copy_write{ font-size: 15px; color: #ffffff; text-align: center; line-height: 27px;   }
.created_by{font-size: 12px; color: #edaa8a; text-align: center;}
.created_by a{color: #edaa8a; }

#wrapper .owl-dots{ display: none; }

.scrollPageTop{ position: fixed; bottom: 60px; right: 10px; width: 55px; height: 55px; cursor: pointer; z-index: 9999; }
.scrollPageTop span{ display: block; background-color: #222222; border-radius: 200px 200px 200px 200px; -moz-border-radius: 200px 200px 200px 200px; -webkit-border-radius: 200px 200px 200px 200px; }
.scrollPageTop span:hover{ background-color: #ed1c22; }

.rotate0{ -ms-transform: rotate(0deg); /* IE 9 */ -webkit-transform: rotate(0deg); /* Safari 3-8 */ transform: rotate(0deg);}
.rotate180{ -ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari 3-8 */ transform: rotate(180deg);}

.mfp-arrow{ width: 56px!important; height: 56px!important; }
.mfp-arrow-right{ background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/arrow-next.png") no-repeat center center; right: 80px!important; }
.mfp-arrow-left{ background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/arrow-prev.png") no-repeat center center; left: 80px!important;}
 .mfp-arrow:before, .mfp-arrow-left:after, .mfp-arrow-left .mfp-a, .mfp-arrow-right:after, .mfp-arrow-right .mfp-a{ border: none!important;}


#testride{ padding: 90px 0px 90px 0px; background-color:#fff; text-align:center; border-bottom: #ccc 1px solid;}
.test_ride_con{ width: 100%; max-width: 1080px; margin:0 auto; }
.test_ride_con h2{ font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 36px; color: #ed1e27; text-transform: uppercase;  }
.test_ride_con p{ font-size:14px; color:#000; padding-top:0; font-weight: 600;}
.fields_holder{ font-size: 0px; padding-top: 30px; }
.fields_holder .panel{ display: inline-block; width: 18%; margin-right: 1%; position:relative; }
.textBox{ width: 100%; font-size:16px; color:#000; padding: 12px ; border: #494d53 1px solid; background: none; }


#prodrang { padding: 60px 0px 20px 0px; background-color:#fff; text-align:center;  border-bottom: #ccc 1px solid;}
.prodrang_con{ width: 100%; max-width:950px; margin:25px auto 0 auto; text-align:center;}    
.prodpan { max-width:297px; padding:0 3%; text-align:center; vertical-align:top; height:297px;  display:inline-block;}   
.prodpan p { font-size:15px; color:#000000; font-family:'Open Sans'; line-height:110%; }
.prodpan img{ width:100%;  display:inline-block;} 

#prodrangFT { padding: 210px 0px 25px 0px; text-align:center; } 
    	
.submit_btn{  background: none;    cursor: pointer;        -moz-appearance: none;    appearance: none;    -webkit-appearance: none; width: 100%;  margin: 0 auto; font-size: 14px; color: #ffffff; text-align: center; font-weight: bold; letter-spacing: 3px; background: #ed1e27;  padding: 15px; border: none; cursor: pointer;}
.submit_btn:hover{ background: #020202;}
.btnPanel{ display: inline-block; width: 100%; max-width: 100px; /*margin-left: 1%;*/ }
.test_ride_con .error{color:#ff0101}

::-webkit-input-placeholder { 
  color:#000;
}
::-moz-placeholder { 
  color:#000;
}
:-ms-input-placeholder { 
  color:#000;
}
:-moz-placeholder { 
  color:#000;
}

.ui-widget { font-size:16px; text-transform:none; color:#fff; }
.ui-widget-content { background:none;color:#fff; font-size:12px;}


#booknowbtn {position:fixed; top:48%; right:0; min-width:196px; background-color:red; border:1px solid #ccc;  padding:13px; text-align:center;}

#booknowbtn2 {position:fixed; top:58%; right:0; min-width:196px; height:30px;  text-align:center; padding:12px 10px 30px 10px  ;    background: url("https://www.heromotocorp.com/en-in/xpulse200t/images/bg-tab-thrilling.jpg") no-repeat center top;     background-size: cover; z-index:999;  border:1px solid #ccc;  }
/* highlight section  */
 #highlights{ padding:80px 0px 60px 0px;}
 #highlights .container { position:relative; max-width:1200px;}
 #highlights .item div{ display:inline-block; vertical-align:middle; width:33%; }
 #highlights .item .highlight{ font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:65px; color:#fff; text-align:right;   }
 #highlights .item .highlightred{ font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:65px; color:#000; text-align:left; padding-bottom: 10px; line-height: normal;  }
 #highlights .item img { max-width:100%;  }
 #highlights .item .highlightred .rupyee{ display:inline-block; font-family:'Rupee_Foradian_1'; font-size:55px; line-height:100%; vertical-align:top;}
.ex_showroom_price{ display:block; font-size:12px; color:#666666; text-align:center; line-height:100%; padding-top:10px;}
#highlights .item .highlightred sup{ font-size:45px;}

#highlights .owl-controls{ position:absolute; left:0px; bottom:-20px; width:100%; text-align:center;}
 #highlights .owl-dot{ display:inline-block; width:12px; height:12px; margin:0 25px; background:#fff; border-radius: 200px 200px 200px 200px; -moz-border-radius: 200px 200px 200px 200px; -webkit-border-radius: 200px 200px 200px 200px; border:none!important;}
 #highlights .owl-dot.active{  background:#ff0000; }

 #highlights .item { padding: 0 8%;}
#highlights .item h3 { position: relative; font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 25px; color: #ffffff; text-align:left; line-height:130%; text-transform: uppercase; padding:5% 0;  }
#highlights .item h3:before{ content: ''; position: absolute; left: -65px; top: 2px; width: 64px; height: 55px; background:url("https://www.heromotocorp.com/en-in/xpulse200t/images/ico-quot.png") no-repeat center center; background-size: cover;} 
#highlights .item p { font-size: 15px; color: #fff; text-align:left; line-height:170%; padding-bottom:20px;}


.seoFTpan {font-family:'Open Sans', Arial, Helvetica, sans-serif;}
.seoFTpan .fpanseo { width:100%; padding:2% 5% 1% 5%; border-bottom:1px dashed #3c3c3c;}
.seoFTpan .fpanseo p {  font-size:12px; /*color:#878787;*/ color:#515151; line-height:15px!important; /*line-height:130%; */padding-bottom:10px; text-align:justify;} 
.seoFTpan .fpanseo  a { color:#515151; font-weight:normal; text-decoration:none;}
.seoFTpan .fpanseo  h1 {font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size: 15px; text-align:left; padding-bottom:10px;  color:#515151; }
.seoFTpan .fpanseo  h2, .seoFTpan .fpanseo  h3, .seoFTpan .fpanseo  h4 {font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:13px; text-align:left; padding-bottom:10px;  color:#515151; text-transform:none!important; }
.seoFTpan .fpanseo ul, li { font-size:12px; color:#515151;   margin:0 0 5px 10px; padding:5px;}
.seoFTpan .fpanseo ul li  {list-style:disc;}

@media handheld, only screen and (max-width: 1100px){
  #highlights .item{ text-align:center;}
  #highlights .item .highlightred, #highlights .item .highlight{ width:100%; font-size:60px; text-align:center;}
  #highlights .item .highlightred sup{ font-size:32px;}
  #highlights .item .highlightred .rupyee{font-size: 45px;}
  #highlights .owl-controls{ bottom:0px; }
  #prodrangFT { padding:40px 0px 90px 0px; text-align:center; }
}
@media handheld, only screen and (max-width: 1000px){
  #highlights { padding: 40px 0px;}
  #highlights .item .highlight{ padding-top:20px;}
  #highlights .item{ padding-top:362px; }
  #wrapper  #highlights .owl-dot{ width:12px; height:12px;}
  #highlights .item .ban_pic{ display:block; width:100%; max-width:350px; position:absolute; left:50%; top:0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%);    -ms-transform: translateX(-50%); transform: translateX(-50%);}
  #highlights .owl-controls{ position:relative; padding-top:20px;}
  #testride { padding: 40px 0px;}
   
}

@media handheld, only screen and (max-width: 860px){
.prodpan { width:30%; height:auto;}
}

@media handheld, only screen and (max-width: 479px){
  #highlights .item{ padding-top:320px; }
  #highlights .item .ban_pic{max-width: 300px;}
  #highlights .item .highlightred, #highlights .item .highlight{ font-size:40px;}
  #highlights .item .highlightred sup{ font-size:22px;}
  #highlights .item .highlightred .rupyee { font-size: 26px;}
  #wrapper #highlights .owl-dot{margin:0 15px;}
  
  .prodpan p { font-size:12px;}
  #prodrangFT { padding:40px 0px 0 0px; text-align:center; }
}
.messagebox { padding-top:10px;}

.grayscale {
 -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  -webkit-filter: opacity(33%); /* Safari */
  filter: opacity(33%);
  opacity: 0.65;
 }
/* otp */

.otp {
  position: relative;
  display: inline-block;
  background: #c70c1d;
  color: #fff;
  padding: 20px 5px;
  margin: 2px;
  font-size: 12px; vertical-align:bottom;
}
.otp:hover {
  background: #FF7E85;
}
.getOtp {
  position: absolute;
  right: 0;
  top: 0;
}
.otpbox {
  width: 100%;
  /*max-width:195px;*/
  text-transform: uppercase;
}
/* otp ends */ 


/* temp to remove after email for download is enabled*/

/*.brochurePop { width:initial; background-image:none;}*/