@font-face {
  font-family: "tradegothicbold";
  src: url("../fonts/trade-gothic/TradeGothicLT-Bold.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/trade-gothic/TradeGothicLT-Bold.woff") format("woff"),
    url("../fonts/trade-gothic/TradeGothicLT-Bold.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "tradegothiclight";
  src: url("../fonts/trade-gothic/TradeGothicLT-Light.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/trade-gothic/TradeGothicLT-Light.woff") format("woff"),
    url("../fonts/trade-gothic/TradeGothicLT-Light.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'tradegothic';
    src: url('../fonts/trade-gothic/TradeGothicLT.eot');
    src: url('../fonts/trade-gothic/TradeGothicLT.eot?#iefix') format('embedded-opentype'),
        url('../fonts/trade-gothic/TradeGothicLT.woff2') format('woff2'),
        url('../fonts/trade-gothic/TradeGothicLT.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'unisansthin';
    src: url('../fonts/unisans/UniSansDemo-ThinCAPS.eot');
    src: url('../fonts/unisans/UniSansDemo-ThinCAPS.eot?#iefix') format('embedded-opentype'),
        url('../fonts/unisans/UniSansDemo-ThinCAPS.woff2') format('woff2'),
        url('../fonts/unisans/UniSansDemo-ThinCAPS.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'unisansblack';
    src: url('../fonts/unisans/UniSansDemo-HeavyCAPS.eot');
    src: url('../fonts/unisans/UniSansDemo-HeavyCAPS.eot?#iefix') format('embedded-opentype'),
        url('../fonts/unisans/UniSansDemo-HeavyCAPS.woff2') format('woff2'),
        url('../fonts/unisans/UniSansDemo-HeavyCAPS.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


body {
  font-family: "tradegothic";
}
ul{padding-left:0; margin-bottom:0;}

a:hover {
  text-decoration: none;
}

img {
  width: 100%;
  display: block;
}

/*header*/
.header {
  width: 100%;
  float: left;
  position: fixed;
  top:0px;
  padding:0 3%;
  background:#fff;
  border-bottom:1px solid #C5C5C5;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index: 9999;
  transition:all 300ms ease-in-out;
}

.header .container{
}

.logo {
  width: 150px;
  float: left;
  position: relative;
  min-height: 1px;
  transition:all 300ms ease-in-out;
}
.navi {
	position: relative;
	display:flex;
	justify-content:space-between;
	z-index: 2;
}
.navi ul {
	margin-bottom:0;
	padding-left:0;
	display:flex;
	position: relative;
}

.navi ul li a{
	text-transform: uppercase;
	transition:all 300ms ease-in-out;
}
.navi ul li a:hover{
}

.navi ul.menu{
	margin-right:10px;
}

.navi ul.menu li{
	padding:0 10px;
}

.navi > ul.menu > li > a {
	color: #151515;
	font:16px 'unisansblack';
	letter-spacing:2px;
	padding: 5px 5px 10px;
	display: block;
	position:relative;
	z-index:1;
}

.navi > ul.menu > li > a::before{
	content:'';
	position:absolute;
	bottom:0;
	left:0;
	width:0;
	height:2px;
	background:#50aa2b;
	z-index:-1;
	transition:all 300ms ease-in-out;
}

.navi > ul.menu > li:hover > a{
	color:#1b3273;
}

.navi > ul.menu > li:hover > a::before{
	width:100%;
}

.navi ul.menu li a.active{
	color:#1b3273;
}

.navi ul.menu li a.active::before{
	width:100%;
}


.navi ul.menu li .dropdown{
	position:absolute;
	/*width:100%;
	left:0;*/
	width: 40%;
    left: 30%;
	padding-top:20px;
	transform:translateY(50px);
	opacity:0;
	visibility:hidden;
	z-index:2;
	transition:all 300ms cubic-bezier(.69,.5,.5,1.31);
}

.navi ul.menu li:hover .dropdown{
	transform:translateY(0px);
	opacity:1;
	visibility:visible;
}

.navi ul.menu li .dropdown ul{
	background:#fff;
	justify-content:space-around;
	flex-wrap:wrap;
}

.navi ul.menu li .dropdown ul li{
	border:1px solid #ebebeb;
	padding:0;
	flex-grow:1;
	transition:all 300ms ease-in-out;
	position:relative;
}

.navi ul.menu li .dropdown ul li:hover{
	background:#50aa2b;
	background:-webkit-linear-gradient(30deg, #50aa2b, #4262c5);
	background:linear-gradient(30deg, #50aa2b, #4262c5);
}

.navi ul.menu li .dropdown ul li:hover + li{
	opacity:0.2;
}

.navi ul.menu li .dropdown ul li a{
	float:left;
	width:100%;
	height:100%;
	text-align:center;
	color: #151515;
	font:16px 'unisansblack';
	padding:10px;
}

.navi ul.menu li .dropdown ul li a .img-fluid{
	width:160px;
	height:100px;
	position:relative;
	overflow:hidden;
	margin:0 auto 10px;
	transition:all 300ms ease-in-out;
}

.navi ul.menu li .dropdown ul li a .img-fluid img, .navi ul.menu li .dropdown .subdropdown ul li .getMenuImg img{
	width:auto;
	max-width:100%;
	max-height:100%;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
}

.navi ul.menu li .dropdown ul li:hover a .img-fluid{
	opacity:0.6;
}

.navi ul.menu li .dropdown ul li a span{
	transition:all 300ms ease-in-out;
} 

.navi ul.menu li .dropdown ul li:hover > a{
	color:#fff;
	text-shadow:1px 1px 1px #000;
}

.navi ul.menu li .dropdown .subdropdown{
	width: 100%;
	position: absolute;
	left: 100%;
	top:0%;
	z-index: 1;
	transform: scaleY(0);
	transform-origin: top;
	transition: all 300ms ease-in-out;
}
.subdropdown2{ display:none; position:absolute; left:100%; width:150PX;}
.subdropdown li:hover .subdropdown2{ display:block;}
.navi ul.menu li .dropdown ul li:hover .subdropdown{
	transform: scaleY(1);
}

.navi ul.menu li .dropdown .subdropdown ul li{
	width: 100%;
	position: static;
}

.navi ul.menu li .dropdown .subdropdown > ul > li > a{
	position: relative;
}

.navi ul.menu li .dropdown .subdropdown > ul > li > a::before{
	content: '';
	position: absolute;
	left: 100%;
	top: calc(50% - 4px);
	border-left:8px solid #264b95;
	border-top:8px solid transparent;
	border-bottom:8px solid transparent;
	z-index: 9;
	opacity: 0;
	transition: all 300ms ease-in-out;
}

.navi ul.menu li .dropdown .subdropdown > ul > li:hover > a::before{
	opacity: 1;
}

.navi ul.menu li .dropdown .subdropdown ul li .getMenuImg{
	position: absolute;
	left: 100%;
	top: 0;
	height: 100%;
	width: 100%;
	background: #fff;
	opacity: 0;
	visibility: hidden;
	transition: all 300ms ease-in-out;
}

.navi ul.menu li .dropdown .subdropdown ul li:hover .getMenuImg{
	opacity: 1;
	visibility: visible;
}

.navi ul.subMenu li{
	margin:0 10px;
}

.navi ul.subMenu li a{
	color:#212121;
	font:600 14px 'unisansthin';
	letter-spacing:2px;
}

.navi ul.subMenu li a:hover, .navi ul.subMenu li a.active{
	color:#50aa2b;
}

.header.fixed{
	box-shadow:0 0 10px rgba(0,0,0,0.20);
}

.header.fixed .logo{
	width:90px;
}

.header.fixed .navi ul.menu li .dropdown{
	padding-top:10px;
}

.menuBtn{
	width:50px;
	float:left;
	cursor:pointer;
	display:none;
	overflow:hidden;
}

.menuBtn div{
	position:relative;
	width:50px;
	height:40px;
	padding:13px 10px;
	display:inline-block;
	vertical-align:middle;
	border-radius:50%;
}

.menuBtn span{
	width:100%;
	height:2px;
	float:right;
	background:#1e3575;
	margin:2px 0;
	position:relative;
	right:0;
	-webkit-transition:400ms ease-in-out all;
	transition:400ms ease-in-out all;
}

.header.fixed .menuBtn span{
	background:#264b95;
}

.menuBtn span#menuLine1{
	width:60%;
}

.menuBtn span#menuLine2{
	width:80%;
}

.menuBtn.closeMenuBtn span#menuLine1{
	width:100%;
	-webkit-transform:rotate(45deg) translate(4px, 5px);
	transform:rotate(45deg) translate(4px, 5px);
}

.menuBtn.closeMenuBtn span#menuLine2{
	right:100px;
}

.menuBtn.closeMenuBtn span#menuLine3{
	width:100%;
	-webkit-transform:rotate(-45deg) translate(4px, -4px);
	transform:rotate(-45deg) translate(4px, -4px);
}

.mbMenuContainer{
	position:fixed;
	left:0;
	top:0;
	bottom:0;
	right:0;
	z-index:999;
	background:rgb(80 170 43 / 93%);
	display:none;
}

.mbMenuContainer .mbMenu{
	text-align:center;
	position:relative;
	height:100%;
	width:100%;
	padding:0 5%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	overflow:auto;
}

.mbMenuContainer .mbMenu ul li{
	padding:5px 0;
}

.mbMenuContainer .mbMenu ul li a{
	font:7vw 'tradegothicbold';
	text-transform: uppercase;
	color:#000;
}

.mbMenuContainer .mbMenu ul li a:hover,
.mbMenuContainer .mbMenu ul li a:focus{
	color:#fff;
}

.mbMenuContainer .mbMenu .mbdrop{
	width:100%;
	float:left;
	background: #b6fd9d;
    box-shadow: 0 0 20px #173a0a inset;
	display:none;
}

.mbMenuContainer .mbMenu .mbdrop ul{
	padding:10px 20px;
}

.mbMenuContainer .mbMenu .mbdrop li{
	border-bottom:1px solid rgba(0,0,0,0.15);
}

.mbMenuContainer .mbMenu .mbdrop li:last-child{
	border-bottom:none;
}

.mbMenuContainer .mbMenu li a span{
	display:inline-block;
	font-size:70%;
	transition:all 300ms ease-in-out;
}

.mbMenuContainer .mbMenu li.active a span{
	transform:rotate(180deg);
}

.mbMenuContainer .mbMenu .mbdrop li a{
	font-size:4vw;
}

.mbMenuContainer .mbMenu ul.social{
	display:flex;
	justify-content:center;
	margin-top:30px;
}

.mbMenuContainer .mbMenu ul.social li{
	margin:0 10px;
}

.mbMenuContainer .mbMenu ul.social li a{
	display:block;
	width:40px;
	height:40px;
	line-height:40px;
	font-size:16px;
	background:#264b95;
	color:#fff;
	border-radius:50%;
}

.mbMenuContainer .mbMenu ul.social li a:hover{
	background:#d60812;
}
/*header*/

.sticky{
	position: fixed;
	right: 25px;
	bottom: 80px;
	z-index: 9;
}
.sticky ul li{
	text-align: center;
	margin:2px 0;
}
.sticky ul li i{
	width: 40px;
	line-height:40px;
	height: 40px;
	display: block;
	border-radius: 50%;
	background-color: #d90612;
	color: #fff;
	cursor: pointer;
}
.sticky ul li i:hover{
	background-color: #50aa2b;
}

.panel{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}

.pagination {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 20px;
    height: 90px;
    margin: auto;
    font-size: 1.2em;
	display:flex;
	flex-direction:column;
    z-index: 10;
	visibility:hidden;
	opacity:0;
}

.pagination.show{
	opacity:1;
	visibility:visible;
}

.pagination li {
    display: block;
    margin: 8px 0;
}

.pagination a {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    color: #aaa;
    position: relative;
    padding: 4px;
    font-size: 16px;
}

.pagination a:after {
    width: 4px;
    height: 4px;
    display: block;
    background: #333;
    border-radius: 50%;
    content: '';
    position: absolute;
    margin: auto;
    top: 0;
    right: 4px;
    bottom: 0;
}

.pagination a:hover:after {
    transform: scale(2.1,2.1);
    background: #707070;
}

.pagination a.active:after {
    transform: none;
    background: #50a644;
    width: 10px;
    height: 10px;
    right: 0;
}

#banner{
	width:100%;
	float:left;
	margin-top:76px;
	height:calc(100vh - 76px);
	position:relative;
	background:#e8ecf5;
	z-index:1;
}
#banner .carousel-inner, #banner .carousel-inner .carousel-item{
	position:relative;
	height:100%;
}
#banner::before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index:1;
}

.scrollDown{
	position:absolute;
	left:50%;
	bottom:0px;
	transform:translateX(-50%);
	width:80px;
	cursor:pointer;
	z-index:9;
}

.carousel-item section{
	background:radial-gradient(#d3ffc7, #1e3575);
	display:flex;
	align-items:center;
	justify-content:center;
	height:100%;
	position:relative;
	z-index:1;
}

.circle{
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	pointer-events:none;
	z-index:1;
}

.circle::before,
.circle::after{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index:-1;
}
.circle::before{
	background:rgb(27 50 115 / 22%);
    -webkit-clip-path: circle(60% at 50% 120%);
    clip-path: circle(60% at 50% 120%);
}

.circle::after{
	background:rgb(80 166 68 / 50%);
    -webkit-clip-path: circle(40% at 50% 120%);
    clip-path: circle(40% at 50% 120%);
}

.bannerCircle.circle::before{
	display:none;
}

.bannerCircle.circle::after{
    -webkit-clip-path: circle(50% at 50% 120%);
    clip-path: circle(50% at 50% 120%);
}

.circle.left-circle::before{
    -webkit-clip-path: circle(75% at 0% 120%);
    clip-path: circle(75% at 0% 120%);
}
.circle.left-circle::after{
    -webkit-clip-path: circle(50% at 0% 120%);
    clip-path: circle(50% at 0% 120%);
}

.circle.right-circle::before{
    -webkit-clip-path: circle(75% at 100% 120%);
    clip-path: circle(75% at 100% 120%);
}
.circle.right-circle::after{
    -webkit-clip-path: circle(50% at 100% 120%);
    clip-path: circle(50% at 100% 120%);
}

.circle.gray-circle::before{
	background:rgb(56 56 56 / 9%);
}
.circle.gray-circle::after{
	background:rgb(00 0 0 / 12%);
}

.banner-caption{
	position:absolute;
	left:50%;
	bottom:8%;
	transform:translateX(-50%);
	text-align:center;
	z-index:9;
}

.banner-caption h2{
	color:#000;
	margin-bottom:20px;
	font:2vw/1 "tradegothicbold";
	text-transform:uppercase;
	display:flex;
	justify-content:center;
	align-items:center;
	text-shadow:2px 2px 2px rgba(0,0,0,0.24);
	-webkit-box-reflect:below -0.2vw linear-gradient(transparent, transparent, rgb(0 0 0 / 22%));
}

.banner-caption h2 i{
	font-size:11px;
	margin:0 10px;
}

.banner-img{
	width:50%;
	position:relative;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	z-index:9;
}

.electric-bicycle{
	position:absolute;
	width:20%;
	top:6%;
	filter: brightness(1.4);
}

.getLogo{
	position:absolute;
	width:100%;
	right:0;
	top:0;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	z-index:9;
	pointer-events:none;
}

.getLogo img{
	width:70%;
	opacity:0.3;
	filter:brightness(5);
}

.banner-img .img-fluid{
	width:100%;
	-webkit-box-reflect:below -5vw linear-gradient(transparent, transparent, rgb(0 0 0 / 12%));
}

.carousel-control-next.banner-next, .carousel-control-prev.banner-prev{
	top:50%;
	transform:translateY(-50%);
	width:150px;
	height:150px;
	background-color:rgb(255 255 255 / 20%);
	border-radius:50%;
	opacity:1;
	z-index:9;
}

.carousel-control-next.banner-next{
	right:-80px;
	justify-content:flex-start;
	padding-left:35px;
}

.carousel-control-prev.banner-prev{
	left:-80px;
	justify-content:flex-end;
	padding-right:35px;
}

.carousel-control-next.banner-next:hover, .carousel-control-prev.banner-prev:hover{
	background-color:#1b3273;
}

.readmore{
	float:left;
	margin-top:20px;
}

.readmore a, .readmore button, .readmore .send {
	font: 12px "tradegothicbold";
	min-width:150px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #1b3273;
	border:2px solid #1b3273;
	background-color: transparent;
	padding:10px;
	outline: none;
	cursor: pointer;
	position: relative;
	display: flex;
	justify-content:space-between;
	align-items:center;
	z-index: 1;
	line-height: 1;
	transition:all 300ms ease-in-out;
}

.readmore.center-readmore{
	float:none;
	display:block;
	margin-left:auto;
}

.readmore a:hover, .readmore button:hover, .readmore .send:hover{
	background:#1b3273;
	color:#fff;
}

.readmore.white-readmore a, .readmore.white-readmore button{
	color:#fff;
	border-color:#fff;
}

.readmore.white-readmore a:hover, .readmore.white-readmore button:hover{
	background:#fff;
	color:#1b3273;
}

.readmore a i, .readmore button i{
	width:30px;
	color:#da0612;
	text-align:center;
	line-height:1.5;
}

.padding {
  padding: 80px 0;
}

.hm-overview{
	position:relative;
	z-index:1;
	overflow:hidden;
}

.hm-overview .container{
	display:flex;
	justify-content:space-between;
}

.gel-webpage{
	position:absolute;
	width:40%;
	right:0;
	top:0;
	bottom:0;
	z-index:-1;
}

.gel-webpage img{height:100%; object-fit:cover;}

.hm-overview h1{
	font:400 3.5vw 'tradegothicbold';
	color:#1b3273;
	letter-spacing:-1px;
}

.hm-overview h2{
	font:400 2.5vw 'tradegothiclight';
	color:#50a644;
	letter-spacing:-1px;
	padding-bottom:15px;
}

/*Products SLider*/

.ongoingProjectContainer{
	height:calc(100vh - 75px);
	position:relative;
	z-index:1;
}

.ongoingProjectSlider{
	height:100%;
	width:100%;
	float:left;
	position:relative;
	z-index:1;
}

.ongoingProjectSlider > li{
	background:#48557c;
	background:-webkit-radial-gradient(#d3ffc7, #1e3575);
	background:radial-gradient(#d3ffc7, #1e3575);
	height:100% !important;
	width:100%;
}

.ongoingProjectSlider > li::before,
.ongoingProjectSlider > li::after{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index:-1;
}

.ongoingProjectSlider > li::before{
	background:rgba(13, 17, 19, 0.2);
}

.ongoingProjectSlider > li .circle::after{
    -webkit-clip-path: circle(55% at 90% 50%);
    clip-path: circle(55% at 90% 50%);
}

.ongoingProjectSlider > li .container{
	height:100%;
	display:flex;
	justify-content:space-between;
	align-items:center;
	position:relative;
	z-index:2;
}

.hm-ongoingText{
	width:450px;
	/*float:left;
	position:absolute;
	top:50%;
	left:15%;
	transform:translateY(-50%);*/
}

.hm-ongoingText .productLogo{
	width:40%;
	margin-bottom:15px;
}

.hm-ongoingTextBox{
	position:relative;
	z-index:1;
}

.hm-ongoingTextBox .hm-onwatermark{
	position:absolute;
	left:-20px;
	top:0;
	display: flex;
    justify-content: center;
	align-items:center;
    height: 100%;
    font:10px 'tradegothiclight';
    text-transform: uppercase;
    letter-spacing:14px;
	color:#00d1bd;
	pointer-events:none;
}

.hm-ongoingTextBox .hm-onwatermark span{
	display:block;
	transform:rotate(-90deg) translateX(3px);
	position: absolute;
}

.hm-ongoingText p{
	display:block;
	padding-bottom:10px;
	color:#eaeef0;
}

.hm-ongoingText .hm-ongoingPoints{
	margin-top:30px;
	display:flex;
	flex-wrap:wrap;
}

.hm-ongoingText .hm-ongoingPoints section{
	margin-right:10%;
}

.hm-ongoingText .hm-ongoingPoints section:last-child{
	margin-right:0;
}

.hm-ongoingText .hm-ongoingPoints section a{
	display:block;
	color:#87fb41;
	transition:all 300ms ease-in-out;
}

.hm-ongoingText .hm-ongoingPoints section a .img-fluid img{
	width:40px;
}

.hm-ongoingText .hm-ongoingPoints section a:hover{
	transform:translateY(-5px);
}

.hm-ongoingText .hm-ongoingPoints section a h4{
	font:400 20px/1 'tradegothiclight';
	margin-bottom:0;
	margin-top:10px;
}

.hm-ongoingText .hm-ongoingPoints section a span{
	color:#fff;
	font-size:13px;
}

.productImg{
	width:40%;
	position:relative;
	z-index:1;
}

.productImg .badge{
	position:absolute;
	top:20px;
	right:10%;
	text-align:center;
}

.productImg .badge img{
	width:50px;
	margin:0 auto 5px;
}

.productImg .badge span{
	font-size:10px;
	color:#fff;
	text-transform:uppercase;
}

.productImg .badge:hover span{
	color:#87fb41;
}

.colorPalette{
	clear:both;
	width:100%;
	float:left;
	display:flex;
	justify-content:center;
	margin-top:15px;
}

.colorPalette li{
	width:15px;
	height:15px;
	border-radius:50%;
	background:#fff;
	margin:0 8px;
	border: 1px solid #50a92a;
	position:relative;
	z-index:1;
	cursor:pointer;
}

.colorPalette li::before{
	content:'';
	position:absolute;
	left:-5px;
	right:-5px;
	top:-5px;
	bottom:-5px;
	border:6px solid rgba(255,255,255,0.5);
	border-radius:50%;
	opacity:0;
	z-index:-1;
	transition:all 300ms ease-in-out;
}

.colorPalette li:hover::before, .colorPalette li.active::before{
	opacity:1;
}

.productAllImgContainer .colorPalette li::before{
	border-color:rgb(71 179 82 / 48%);
}

.colorPalette li.green{
	background:#87fb41;
}

.colorPalette li.oceangreen{
	background:#5aa782;
}

.colorPalette li.white{
	background:#fff;
}

.colorPalette li.red{
	background:#DC0003;
}
.colorPalette li.yellow{
	background:yellow;
}

.colorPalette li.black{
	background:#000;
}

.colorPalette li.orange{
	background:#ff6104;
}

.colorPalette li.blue{
	background:#0020d4;
}

.controls{
	position:absolute;
	width:50px;
	left:14px;
	padding:0 9px;
	top:50%;
	transform:translateY(-50%);
	background: #050c1f;
    box-shadow: -3px -3px 6px rgba(219, 225, 228, 0.05), 6px 7px 6px rgba(0, 0, 0, 0.18);
	z-index:9;
}

.controls span{
	display:table;
	width:100%;
	height:50px;
	line-height:50px;
	cursor:pointer;
	text-align:center;
	color:#87fb41;
	font-size:13px;
	border-bottom:1px solid rgba(255,255,255,0.1);
}

.controls span:last-child{
	border-bottom:none;
}

.controls span:hover{
	color: #fff;
    text-shadow: 0 0 23px #fff;
}
/*Products Slider*/

.bluebg{
	background-color:#0d193e !important;
}

.bg-gray{background-color:#f3f3f3 !important;}

.tagline h4{
	display:flex;
	align-items:center;
	justify-content:center;
	font:20px 'tradegothicbold';
	color:#fff;
	margin-bottom:0;
	text-transform:uppercase;
}

.tagline h4 i{
	font-size:10px;
	margin:0 20px;
}

.videoContainer{
	height:100vh;
	position:relative;
	background:#000;
	z-index:1;
}

.videoContainer video{
	width:100%;
	height:100%;
	display:block;
	position:relative;
	object-fit:cover;
	opacity:0.9;
}

.videoText{
	position:absolute;
	width:400px;
	text-align:center;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	z-index:1;
}

.videoContainer .playBtn{
	width:80px;
	margin:0 auto;
	cursor:pointer;
	border:none;
	outline:none;
	background:none;
	-webkit-transition:all 300ms;
	transition:all 300ms;
	opacity:0.8;
	z-index:2;
}

.videoContainer .playBtn:hover{
	-webkit-transform:scale(1.05,1.05) rotate(-5deg);
	transform:scale(1.05,1.05) rotate(-5deg);
}

/*Counter*/
.counterBox{
	display: flex;
	justify-content: center;
	align-items:center;
	flex-direction: column;
	text-align: center;
}
.counterBox h2{
	font:3vw 'tradegothicbold';
}
.counterBox h2#counter1::after{
	content: '+';
	font-size:60%;
}
.counterBox .title{
	font: 14px 'tradegothicbold';
	color: #1b3273;
	text-transform: uppercase;
}
/*Countert*/

.heading {
	width:100%;
	/* float:left; */
	margin-bottom:30px;
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	position:relative;
	z-index:2;
}

.heading h2 {
  font: 3.9vw "tradegothicbold";
  color: #212121;
  text-transform:uppercase;
  position:relative;
  z-index:1;
  display:table;
  margin-bottom:0;
}

.smallHeading{
	font-family:'unisansblack', arial;
	font-weight:600;
	text-transform:uppercase;
	display:inline-block;
	clear:both;
}

.viewall a{
	color:#50aa2b;
	font-family:'tradegothicbold';
}

.viewall a:hover{
	color:#1b3273;
}

.new-launch{
	height:100vh;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}

.newLaunchThumb{
	justify-content:space-around;
	align-items:flex-end;
	margin-bottom:-10px;
}

.newLaunchImgBox .img-fluid{
	-webkit-box-reflect: below -8vw linear-gradient(transparent, transparent, rgb(0 0 0 / 12%));
}

.newLaunchThumb .img-thumbnail{
	width:120px;
	padding:10px;
	border-radius:50%;
	overflow:hidden;
	background-color: transparent;
	border:none;
	position:relative;
	z-index:1;
}

.newLaunchThumb .img-thumbnail:nth-child(2){
	margin-bottom:60px;
}

.newLaunchThumb .img-thumbnail::before{
	content:'';
	position:absolute;
	left:-5px;
	right:-5px;
	top:-5px;
	bottom:-5px;
	background:#50aa2b;
	animation:border 2s infinite linear;
	z-index:-1;
}

.newLaunchThumb .img-thumbnail:nth-child(2)::before{
	animation-delay:0.4s;
}

.newLaunchThumb .img-thumbnail:nth-child(3)::before{
	animation-delay:0.2s;
}

@keyframes border{
	50%{transform:scale(1.2,1.2); background:rgba(255,255,255,0.20);}
}

.newLaunchThumb .img-thumbnail img{
	border-radius:50%;
}

.newsBg{
	background:url(../images/newsbg.jpg) center no-repeat;
	background-size:cover;
	height:calc(100vh - 323px);
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}

.newsContainer{
	z-index:1;
}

.newsHeading h2{
	color:#212121;
	font: 4vw 'tradegothicbold';
}

.newsHeading p{
	font-size:14px;
}

.newsBox section{
	padding:10px;
	background:#fff;
	position:relative;
	z-index:1;
	transition:all .3s ease-in-out;
}

.newsBox section:hover{
	transform:translateY(-10px);
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
}

.newsBox section .date{
	width:50px;
	position:absolute;
	right:10px;
	top:0px;
	z-index:1;
	background: #50aa2b;
    color: #fff;
    text-align: center;
    font: 12px 'tradegothicbold';
    padding: 5px 0;
	box-shadow:-2px 2px 10px rgba(0,0,0,0.19);
}

.newsBox section .date::before{
	content:'';
	position:absolute;
	top:0;
	left:-10px;
	border-right:10px solid #686868;
	border-top:10px solid transparent;
	border-bottom:0px solid transparent;
}

.newsBox section .date span{
	display:block;
	text-transform:uppercase;
	font-size:16px;
}

.newsBox section .img-fluid{
	position:relative;
	overflow:hidden;
	background:#1b3273;
}
.newsBox section .img-fluid img{
	transition:all 1.5s ease-in-out;
}

.newsBox section:hover .img-fluid img{
	opacity:0.5;
	-webkit-transform:scale(1.2,1.2);
	transform:scale(1.2,1.2);
}

.newsBox section article{
	padding-top:20px;
}

.newsBox section article h4{
    font:20px 'tradegothicbold';
	color:#1b3273;
}

.newsBox section article p{
	font-size:14px;
}

.storeLocatorBg{
	background:url(../images/locatorbg.jpg) center no-repeat;
	background-size:cover;
	position:relative;
	z-index:1;
	overflow:hidden;
	height:100%;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}

.locator section p{
	font-size:14px;
	width:70%;
}

.storeImg{
}

.storeImg img{
	height:100%;
	position:relative;
	object-fit:cover;
	-webkit-box-reflect:below -0.2vw linear-gradient(transparent, transparent, rgb(0 0 0 / 22%));
}

/*Footer*/
.footerPanel{
	background:url(../images/all-models.jpg) center bottom no-repeat;
	background-size:cover;
	position:relative;
	z-index:1;
	align-items:flex-end;
}
.footerPanel::before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(13,13,13,0.97);
	background:-webkit-linear-gradient(rgb(13 13 13 / 58%), #0d0d0d);
	background:linear-gradient(rgb(13 13 13 / 58%), #0d0d0d);
	z-index:-1;
}

.footerPanel .footer{
	background:none;
}

.footerPanel .footer .mainFooter{
	padding-bottom:0 !important;
}

.footer{
	background:#0D0D0D;
}

.footerAbout .footerLogo{
	width:120px;
	margin-bottom:20px;
	filter:grayscale(1) brightness(4);
}

.footerAbout p{
	width:80%;
	color:#ccc;
	font-size:14px;
}

.footerLinks section h5{
    font:20px 'tradegothicbold';
	color:#50aa2b;
}

.footerLinks section ul li a{
	font-size:14px;
	color:#ccc;
}

.footerLinks section ul li a:hover{
	color:#fff;
}

.bottom{
	border-top:1px solid #323232;
	padding:10px 0;
}

.bottom p{
	display:flex;
	align-items:center;
	font-size:14px;
	color:#ccc;
	margin-bottom:0;
}

.bottom p img{
	width:25px;
}

.button-top {
    background: rgb(0 0 0 / 32%);
    position: fixed;
    cursor: pointer;
    right: 20px;
    bottom: 20px;
    color: #FFFFFF;
    font-size: 20px;
    opacity: 0;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    border-radius: 50%;
    z-index: 99;
}

.button-top:hover {
    background: #000;
}
/*Footer*/

a:focus, button:focus{outline:none;}
.slick-prev, .slick-next{
	width:50px;
	border-radius:40px;
	color:#fff;
	background-color:#da0612;
}
.slick-prev:hover, .slick-next:hover{
	background:#264b95;
}
.slick-prev{margin-left:-20px;}
.slick-next{margin-right:-20px;}

.arrow-up{
	position:relative;
	display:table;
	margin:7px auto 0;
	font-size:20vw;
	line-height:0;
	color:#da0612;
	z-index:1;
}

.arrow-up::before{
	content:'';
	position:absolute;
	width:200%;
	height:18px;
	left:calc(50% - 100%);
	border-radius:50%;
	background:rgba(0,0,0,0.23);
	bottom:25px;
	z-index:-1;
}

.arrow-up i{
	line-height:0.2;
	transform:scale(0.8, 1.3);
}

/*Pop up Form*/
.overlay{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.9);
	z-index: 9999;
	display: none;
}

.popUpFormContainer{
	position: fixed;
	left: 50%;
	top: 50%;
	width: 80%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	z-index: 9999;
	display: none;
}
.popUpFormContainer section{
	display: flex;
	background-color: #fff;
	border-radius: 8px;
}

.close{
	position: absolute;
	right: 10px;
	top: 0;
	width: 30px;
	line-height: 30px;
	text-align: center;
	cursor: pointer;
}

.close:hover{
	color: #f00;
}

.popUpFormContainer .formImg{
	flex-basis: 0;
	flex-grow: 1;
	overflow: hidden;
	display:flex;
}

.popUpFormContainer .formImg .popup-slider{
	width:100%;
	height:100%;
	float:left;
}

.popUpFormContainer .formImg img{
	height: 100%;
	width:100% !important;
	object-fit:cover;
}

.enquiryForm{
	flex-basis: 0;
	flex-grow: 1;
	padding: 20px;
}

.enquiryForm h4{
	font-family: 'tradegothicbold'; 
}

.enquiryForm p{
	font-size: 14px;
}

.enquiryForm form{
	display: block;
	width: 100%;
}

.enquiryForm .form-group{
	display: inline-block;
	width: 50%;
	margin: 0 -2px;
	padding: 5px;
}

.enquiryForm .form-group label{
	font-size:12px;
	margin-bottom: 0;
}

.submit{
	width: 150px;
}
/*Pop up Form*/

/*Inside page*/
.breadcrumb-item{
	font-family:'tradegothicbold';
	text-transform:uppercase;
	font-size:13px;
}
.breadcrumb-item a{
	color:#50aa2b;
	font-family:'tradegothicbold';
}

.insideBanner{
	margin-top:76px;
	background: right center no-repeat;
	background-size: cover;
}

.formContainer{
	width: 400px;
	padding: 50px 0;
}

.formContainer h2{
	font:5vw 'unisansblack';
	text-transform: uppercase;
	margin-bottom: 0;
	color: #50aa2b;
}

.formContainer h4{
	font:400 3vw 'tradegothiclight';
	color: #2B2B2B;
}

.form-control{
	font:16px 'tradegothicbold';
}

.formContainer button[type=submit]{
	font:16px/1.5 'tradegothicbold';
	letter-spacing:1px;
	text-transform:uppercase;
}

.formContainer button[type=submit].bluebg:hover, .formContainer button[type=submit]:hover{
	background-color:#50aa2b !important;
}
/*Inside page*/

/*Product Page*/
.getHead{
	background:#e9ecef;
}
.getHead h2{
	font:400 3vw 'tradegothicbold';
	letter-spacing:1px;
	text-transform:uppercase;
	color:#50aa2b;
	margin-bottom:0;
}
.getHead h6{
	font-family:'tradegothicbold';
	letter-spacing:2px;
	text-transform:uppercase;
}

.productImgBox .img-fluid{
	width:100%;
	height:30vw;
	overflow:hidden;
	position:relative;
}
.productImgBox .img-fluid a{
	display:block;
	height:100%;
}
.productImgBox .img-fluid a img{
	width:auto;
	max-height:100%;
	max-width:100%;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
}

.productImgBox .img-fluid .clickToZoom{
	position:absolute;
	bottom:10px;
	left:0;
	right:0;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:12px;
	pointer-events:none;
	z-index:1;
}

.productImgBox .img-fluid .clickToZoom img{
	width:25px;
	margin-right:5px;
}

.productThumbContainer{
	width:100%;
	float:left;
	display:flex;
	justify-content:center;
	margin-top:30px;
}

.productThumbContainer li{
	margin:0 5px;
}

.productThumbContainer li span{
	width: 70px;
    height: 70px;
    position: relative;
    overflow: hidden;
    float: left;
    border: 1px solid #ccc;
    cursor: pointer;
    border-radius: 50%;
}

.productThumbContainer li span.active{
	border-color:#50aa2b;
}

.productThumbContainer li span img{
	width: auto;
    max-height: 80%;
    max-width: 80%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

/*magnify*/
.magnify-stage{border:none;}
.magnify-footer{display:none;}
/*magnify*/

.xzoom-preview{
	background:#fff;
}

.xzoom-source img, .xzoom-preview img, .xzoom-lens img{
	width:auto;
}

.xzoom{
	box-shadow:none;
}

.cycleImg{
	position:absolute;
	top:0;
	bottom:0;
	width:40%;
	background-size:260%;
	background-repeat:no-repeat;
}
.cycleImg.rightSide{
	right:0;
	background-position:0% center;
}

.productDetailsContainer{
	width:60%;
	position:relative;
	z-index:2;
}
.productDetailsContainer h1{
	font:7vw/1 'unisansblack';
	color:#50aa2b;
	margin-bottom:0;
	margin-left: -5px;
}
.productDetailsContainer h5{
	font:2vw/1 'unisansblack';
	letter-spacing:0.5vw;
	color:#2B2B2B;
	margin-bottom:40px;
}
.productDetailsContainer h6{
	font:1.8vw/1 'tradegothicbold';
	color:#1b3273;
	margin-bottom:10px;
}

.no-licence{
	margin:40px 0 30px;
}

.no-licence li{
	width:calc(50% - 10px);
	text-align:center;
	margin-right:10px;
	margin-bottom:10px;
	padding:5px 10px;
	border-radius:30px;
	background:#fff;
	color:#2B2B2B;
	box-shadow:3px 3px 10px rgb(0 0 0 / 12%);
	font-family: 'tradegothicbold';
	text-transform:uppercase;
	flex-grow:1;
}

.no-licence li a{
	display:flex;
	justify-content:center;
	align-items:center;
	color:#2B2B2B;
	height:100%;
}

.no-licence li a img{
	width:40px;
}

.no-licence li a i,
.no-licence li a img{
	margin-right:10px;
}

.no-licence li a:hover{
	color:#50aa2b;
}

.price-table{
	display:flex;
	flex-wrap:wrap;
	margin-bottom:30px;
}

.price-table button{
    text-align: center;
	margin-right:10px;
    margin-bottom: 10px;
    padding: 10px;
    border-radius: 50px;
	border:none;
    background: #50aa2b;
    color: #fff;
    box-shadow: 3px 3px 10px rgb(0 0 0 / 12%);
    font-family: 'tradegothicbold';
    text-transform: uppercase;
	flex-grow:1;
	cursor:auto;
}

.price-table button span{
	font-size:200%;
	font-family:'unisansblack';
	display:block;
	line-height:1;
}

.productDetailsContainer .priceBottom{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}

.productDetailsContainer .priceBottom .readmore{
	margin-top:0;
	margin-right:20px;
}

.productDetailsContainer .ride-per-km{
	color:#50aa2b;
	font-family: 'tradegothicbold';
	margin-bottom:0px;
}

.featureBg{
	background:#50aa2b;
	z-index:1;
}

.featuresContainer{
	width:60%;
	position:relative;
	z-index:2;
	color:#fff;
}

.features ul li{
	padding:10px;
	border:1px solid #fff;
	background:rgba(255,255,255,0.16);
	margin-bottom:5px;
}

.features ul li h5{
	font-family: 'tradegothicbold';
	text-transform:uppercase;
}

.features ul li p{
	margin-bottom:0;
}

.productRandomSliderContainer{
	height:100vh;
	overflow:hidden;
	position:relative;
	z-index:1;
}

.productRandomSlider{
	height:100%;
	overflow:hidden;
	position:relative;
	z-index:1;
}

.productRandomSlider::before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:radial-gradient(#fff0, rgb(27 50 115 / 65%));
	z-index:9;
}

.productRandomSlider .pslide{
	position:relative;
	height:100%;
	float:left;
	width:100%;
	background:center no-repeat;
	background-size:cover;
}

.battery-range{
	margin-top:30px;
	position:relative;
	z-index:2;
}

.battery-range li{
	text-align:center;
	margin-bottom:10px;
}

.battery-range li article{
	display:flex;
}

.battery-range li article h4{
	font-family: 'tradegothicbold';
	padding:10px;
	border-radius:50px;
	background:#1b3273;
	color:#fff;
	flex-basis:0;
	flex-grow:1;
	margin-bottom:0;
    box-shadow: 4px 4px 14px rgb(0 0 0 / 12%);
}

.battery-range li article span{
	font-family: 'tradegothicbold';
	padding:10px;
	border-radius:50px;
	color:#2B2B2B;
	flex-basis:0;
	flex-grow:1;
	margin:0 5px;
	background: white;
    box-shadow: 4px 4px 14px rgb(0 0 0 / 12%);
}

.redBg{
	background:#d90612;
	background:-webkit-linear-gradient(45deg, #9e0009, #ff2935);
	background:linear-gradient(45deg, #9e0009, #ff2935);
}

.text-green{
	color:#50aa2b;
}

.batteryAssist{
	text-align:center;
}

.batteryAssist h3{
	display:flex;
	align-items:center;
	justify-content:center;
	font:2vw/1 'unisansblack';
	color:#fff;
}

.batteryAssist h3 span{
	color:rgba(255,255,255,0.7);
}

.batteryAssist p{
	color:#fff;
	margin-bottom:0;
}

.batteryAssist .img-fluid{
	position:absolute;
	right:0px;
	opacity:0.4;
	z-index:-1;
}

.showcaselist{
	display:flex;
	justify-content:center;
	align-items:center;
	margin-bottom:50px;
	position:relative;
	z-index:2;
}

.showcaselist li{
	margin:0 5px;
	border-radius:40px;
	background:#1b3273;
	flex-grow:1;
	text-align:center;
	padding:10px 20px;
	color:#fff;
	font-family:'unisansblack';
}

.showcaselist li:nth-child(2n){
	background:#50aa2b;
}

.videoBox{
	margin-bottom:30px;
}

.videoBox .frame{
	width:100%;
	float:left;
}

.videoBox .frame iframe{
	height:25vw;
}

.videoBox .frame span{
	display:block;
	font:16px 'unisansblack';
	text-transform:uppercase;
	text-align:center;
	color:#1b3273;
	letter-spacing:1px;
}

/*Product Page*/

.list{
	list-style:none;
}

.list li{
	position:relative;
	padding-left:20px;
}

.list li::before{
	content:'\2714';
	color:#da0612;
	position:absolute;
	left:0;
}

.emptyBox{
	height:95px;
}
/*--faqs-css--*/
.faqs-box{position:relative; z-index:2;}
.faqs-box .faqs_question{width:100%;float:left;display:block;padding:12px 35px 12px 15px;border-bottom:1px solid rgb(0 0 0 / 14%);color:#0d0d0d;cursor:pointer;position:relative; font-size:16px; font-family:'tradegothicbold';}
.faqs-box .faqs_question:hover, .faqs-box .faqs_question.active{background:#50aa2b; color:#fff;}
.faqs-box .faqs_question span{position:absolute;right:15px; top:15px;}
.faqs-box .faqs_answer{width:100%;float:left;display:block;background:#e2f4db;}
.faqs-box .faqs_answer article{width:100%;float:left;padding:15px 15px;}
.faqs-box .faqs_answer article p{font-size:14px; color:#000;}
.faqs-box .faqs_answer ul li{display:block;position:relative;letter-spacing:1px;font-size:14px;line-height:22px;color:#212121;}
.faqs-box .faqs_answer ul li:before{content:'\00BB';margin-right: 7px;font-size: 21px;}
.faqs-box > h4{color:#212121;letter-spacing:1px;width:100%;float:left;margin:30px 0 10px;padding-left:10px;border-left:5px solid #212121;}
/*--faqs--*/

/*--contact--*/
.address{
	position:relative;
	z-index:2;
}

.address h4{
	font:3vw 'unisansblack';
	letter-spacing:0.5vw;
	margin-bottom:20px;
	color:#1b3273;
}

.address p{
	position:relative;
	padding-bottom:0;
	font:20px 'tradegothicbold';
	display:flex;
	align-items:center;
}

.address p i{
	font-size:20px;
	width:60px;
	height:60px;
	line-height:60px;
	background:#fff;
	color:#50aa2b;
	text-align:center;
	border-radius:50%;
	margin-right:10px;
	box-shadow:2px 2px 10px rgba(0,0,0,0.13);
}

.address p a{
	color:#1b3273; 
}

.address p a:hover{
	color:#50aa2b;
}

.map iframe{
	display:block;
	position:relative;
	height:350px;
	width:100%;
	border:1px solid #0b0b0b;
}
/*--contact--*/

/*--About us--*/
.overview-bg{
	background:center no-repeat;
	background-size:cover;
	position:relative;
	z-index:1;
}
.overview-bg::after{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(0,0,0,0.55);
	z-index:-1;
}

.aboutContainer h4{
	font: 400 2.5vw 'tradegothiclight';
    color: #fff;
    letter-spacing: -1px;
    padding-bottom: 15px;
}

.aboutContainer p{
	color:#fff;
}

.vmBox{
    width: 100%;
    float: left;
	padding:20px;
	background:#fff;
}

.vmBox h3 {
	font-family:'tradegothicbold', sans-serif;
    color: #50aa2b;
    margin-bottom: 20px;
    padding-left: 15px;
    border-left: 5px solid;
}

.vmBox.esselgroupBox{
	background:#50aa2b;
	height:100%;
}

.vmBox.esselgroupBox h3{
	color:#fff;
}

.vmBox.esselgroupBox p{
	color:#fff;
}

.vmBox.esselgroupBox p a{
	padding:3px 10px;
	background:#fff;
	border-radius:40px;
}

.bodBox{
	width: 100%;
    float: left;
    padding: 20px;
	background:#f1f5ef;
	position:relative;
	z-index:2;
}

.bodBox h3{
	font-family:'tradegothicbold', sans-serif;
    color: #50aa2b;
    margin-bottom: 20px;
    padding-left: 15px;
    border-left: 5px solid;
}

.bodBox h3 span{
	color:#676767;
}
/*--About us--*/

.advantages{
	position:relative;
	z-index:2;
}

.advantageBox{
	text-align:center;
	color:#fff;
}

.advantageBox p{
	margin-bottom:0;
	margin-top:10px;
	text-transform:uppercase;
	font-family:'tradegothicbold', sans-serif;
}

.downloadBox{
	margin-bottom:30px;
}

.downloadBox a{
	display:block;
	padding:20px 20px 20px 60px;
	background:#1b3273;
	color:#fff;
	font-family:'tradegothicbold', sans-serif;
	text-transform:uppercase;
	position:relative;
	overflow:hidden;
	z-index:1;
	box-shadow:3px 3px 10px rgb(0 0 0 / 12%);
	border-radius:50px;
	transition:all 300ms ease-in-out;
}

.downloadBox a:hover{
	background:#50aa2b;
}

.downloadBox a i{
	position:absolute;
	font-size:200%;
	left:20px;
	top:50%;
	line-height:0;
}

.sitemap-list{
	padding:10px 20px;
	border:solid rgba(0,0,0,.125);
	border-width:0 1px;
}

.sitemap-list li a{
	display:block;
	color:#212121;
}

.sitemap a:hover h5, .sitemap-list li a:hover{
	color:#50aa2b;
}

/*responsive*/
@media (min-width:1400px){
}

@media (min-width:1366px) and (max-height:1024px){
}
@media (max-width:1024px) and (min-height:1366px){
	#banner{height:60vh;}
	.ongoingProjectContainer{height:50vh;}
}

@media (max-width:1024px){
	.hm-ongoingText{margin-left:50px;}
	.videoContainer{height:auto;}
	.scrollDown{display:none;}
	.pagination{display:none;}
}

@media (max-width:992px){
	.logo{width:120px;}
	.navi ul.menu li{padding:0 6px;}
	.navi > ul.menu > li > a{font-size:14px;}
	.navi ul.subMenu li{margin:0 6px;}
	.navi ul.subMenu li a{font-size:13px; letter-spacing:1px;}
	.emptyBox{height:76px;}
}

@media (max-width:812px){
	.logo{width:90px;}
	.navi{display:none;}
	.menuBtn{display:block;}
	#banner{margin-top:57px; height:calc(100vh - 57px);}
	.emptyBox{height:57px;}
}

@media (max-width:768px){
	#banner{height:70vh;}
	.banner-img{width:75%;}
	.electric-bicycle{width:30%;}
	.banner-caption{width:80%; bottom:5%;}
	.banner-caption h2{font-size:4vw;}
	.ongoingProjectContainer{height:calc(60vh - 75px);}
	.hm-ongoingText{margin-left:0; width:300px;}
	.hm-ongoingText .productLogo{width:50%;}
	.hm-ongoingText .hm-ongoingPoints section{margin-right:7%;}
	.hm-ongoingText .hm-ongoingPoints section a .img-fluid img{width:30px;}
	.hm-ongoingText .hm-ongoingPoints section a h4{font-size:18px;}
	.controls{left:calc(50% - 45px); top:auto; bottom:20px;; width:90px; transform:translateY(0%);}
	.controls span{width:50%; height:40px; float:left; line-height:40px;}
	.videoContainer{height:auto;}
	.no-licence li{font-size:14px;}
	.showcaselist{flex-wrap:wrap;}
	.showcaselist li{font-size:14px; margin:5px;}
	.features ul li h5{margin-bottom:7px;}
	.battery-range li article h4{font-size:22px;}
	.batteryAssist h3{font-size:22px;}
	.productRandomSliderContainer{height:60vh;}
	.heading h2{font-size:5vw;}
	.battery-range{margin-top:0;}
	.battery-range li article{flex-wrap:wrap;}
	.battery-range li article h4{width:100%; flex-basis:auto; margin-bottom:5px;}
	.battery-range li article span{flex-grow: 1;}
	.table .thead-dark th{font-size:14px;}
	.table td, .table th{font-size:14px;}
}

@media (max-height:414px){
	#banner{height:400px;}
}

@media (max-width:425px){
	.productDetailsContainer .priceBottom{flex-direction: column-reverse;}
	.productDetailsContainer .ride-per-km{margin-bottom:20px;}
}

@media (max-width:576px){
	.gel-webpage{opacity:0.2; width:100%;}
	.hm-overviewText{width:100% !important;}
	.hm-overview h1{font-size:28px;}
	.hm-overview h2{font-size:22px;}
	.ongoingProjectContainer{height:100vh;}
	.ongoingProjectSlider > li .container{flex-direction:column-reverse; justify-content: space-evenly;}
	.productImg{width:70%;}
	.hm-ongoingText{width:100%; text-align:center; display:flex; flex-direction:column; align-items:center;}
	.hm-ongoingText .productLogo{width:220px; margin-left:auto; margin-right:auto;}
	.hm-ongoingText .hm-ongoingPoints{justify-content:center;}
	.hm-ongoingText .hm-ongoingPoints section a .img-fluid img{margin:0 auto;}
	.ongoingProjectSlider > li .circle::after{clip-path:circle(55% at 50% -10%);}
	.tagline{padding:1rem 0 !important;}
	.tagline h4{font-size:16px;}
	.vmBox.esselgroupBox{margin-top:1.5rem;}
	.productDetailsContainer{width:100%;}
	.productImgBox{margin-bottom:30px; float: left; width: 100%;}
	.productImgBox .img-fluid{height:60vw;}
	.productPageLogo{width:180px !important;}
	.productDetailsContainer h5{font-size:3vw;}
	.showcase-img{overflow:hidden; display:flex; justify-content:center; align-items:center;}
	.showcase-img img{width:135%;}
	p{font-size:14px;}
	.batteryAssist h3{font-size:16px;}
	.batteryAssist h3 img{margin:0 5px !important; width:16px !important;}
	.features ul li h5{font-size:18px; margin-bottom:0px;}
	.downloadBox{margin-bottom:10px;}
	.careerImg, .faqImg{display:none;}
	.advantageBox{margin:15px 0;}
	.storeImg{margin-top:1rem;}
}

@media (max-width:414px){
	#banner{height:60vh;}
	.carousel-control-next.banner-next, .carousel-control-prev.banner-prev{width:100px; height:100px;}
	.carousel-control-prev.banner-prev{left:-50px; padding-right:25px;}
	.carousel-control-next.banner-next{right:-50px; padding-left:25px;}
	.hm-ongoingText .productLogo{width:150px;}
	.tagline h4{font-size:14px;}
	.tagline h4 i{margin:0 10px;}
	p{font-size:13px;}
	.heading{margin-bottom:20px;}
	.heading h2, .vmBox h3{font-size:22px;}
	.productDetailsContainer{width:100%; position:relative; z-index:2;}
	.productDetailsContainer h1{font-size:30px; margin-left:0;}
	.productDetailsContainer h5{font-size:16px; margin-bottom:20px;}
	.aboutContainer h4{font:14px 'tradegothic'; padding-bottom:5px;}
	.aboutContainer p{margin-bottom:0;}
	.padding{padding:50px 0;}
	.productRandomSliderContainer{height:45vh;}
	.battery-range li article h4{font-size:18px;}
	.battery-range li article span{font-size:14px;}
	.batteryAssist h3{font-size:14px;}
	.batteryAssist h3 img{margin:0 0px !important;}
	.address p{font-size:17px;}
	.address p i{width:40px; height:40px; line-height:40px; font-size:16px;}
	.videoBox .frame iframe{height:60vw;}
	.videoBox .frame span{font-size:14px;}	
}

@media (max-width:375px){
	
}