@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800;900&display=swap');

*{
	padding: 0px;
	margin: 0px;
}

html{
	scroll-behavior: smooth;
}

p, h3, h4, h5, a, label{
	font-family: 'Inter', sans-serif;
}


h1, h2{
	font-family: 'Inter', sans-serif;
}



:root{
	--first-color:#FF6801;
	--white-color:#fff;
	--black-color:#000;
	--text-color:#7C7C7C;
	--border-color:#CFCFCF;
	--light-gray:#F5F5F5;
	--auto-motive:#EC3237;
	--Motor-Cycle-color:#575757;
	--Solar-color-green:#39904E;
	--dark-blue:#0E0D26;
}

a:hover{
	text-decoration: none;
}
a{
	font-size: 15px;
	transition: 0.3s ease;
}

a:hover{
	color: var(--first-color)!important;
}


p{
	font-size: 15px;
	text-transform: capitalize;
}

ul li{
	list-style: none;
} 

.form-control{
	box-shadow: none!important;
}

section{
	padding: 90px 0px;
	position: relative;
	z-index: 11;
}
.container{
	max-width: 1260px!important;
}

ul{
	margin-bottom: 0px;
}
button{
	outline: none;
	border: none;
}


.first-color{
	color: var(--first-color);
}
.black-color{
	color: var(--black-color);
}

.btn:focus{
	box-shadow: none!important;
}
.text{
	color: var(--text-color);
}
.relative{
	position: relative;
}
.d-flex-common{
	display: flex;
	align-items: center;
	gap: 10px;
}
/*-----------Start-header-section-here--------*/
.header-section{
	background-color: var(--dark-blue);
	height: 110px;
	z-index: 999;
	position: relative;
	padding: 15px 0px;
}


.hamburger .line{
  width: 30px;
  margin-right: 10px;
  height: 2px;
  background-color: var(--first-color);
  display: block;
  margin-top: 8px;
  margin-bottom: 8px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  margin-left: auto;
  transition: all 0.3s ease-in-out;
}

.hamburger:hover{
  cursor: pointer;
}


#hamburger-1.is-active .line:nth-child(2){
  opacity: 0;
}

#hamburger-1.is-active .line:nth-child(1){
  -webkit-transform: translateY(13px) rotate(45deg);
  -ms-transform: translateY(13px) rotate(45deg);
  -o-transform: translateY(13px) rotate(45deg);
  transform: translateY(13px) rotate(45deg);
}

#hamburger-1.is-active .line:nth-child(3){
  -webkit-transform: translateY(-7px) rotate(-45deg);
  -ms-transform: translateY(-7px) rotate(-45deg);
  -o-transform: translateY(-7px) rotate(-45deg);
  transform: translateY(-7px) rotate(-45deg);
}


.phone-box .items .box-phone i{
	width: 35px;
	height: 35px;
	background-color: var(--white-color);
	color: var(--first-color);
	border-radius: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.social-media-icon a i{
	width: 35px;
	height: 35px;
	background-color: #565667a6;
	color: var(--white-color);
	border-radius: 100px;
	display: flex;
	transition: 0.3s ease;
	align-items: center;
	justify-content: center;
}

.social-media-icon a i:hover{
	background-color: var(--first-color);
	color: var(--white-color);
	transform: rotate(360deg);
}
.social-media-icon{
	display: flex;
	gap: 10px;
	justify-content: right;
}

.bottom-header-section .logo-header{
	background-color: var(--white-color);
	border-bottom: 5px solid var(--first-color); 
	padding: 10px 15px;
	margin-top: 18px;
	border-radius: 100px;
}
.fixed-header .bottom-header-section{
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	background-color: var(--white-color);
	transition: 0.2s ease;
	border-bottom: 3px solid var(--first-color);
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	animation: header 1s 1 alternate;
	z-index: 999;
}

@keyframes header{
	0%{
		transform: translateY(-100%);
	}
	100%{
		transform: translateY(0%);
	}
}

.fixed-header .bottom-header-section .logo-header{
	margin-top: 0px;
	border-bottom: none;
}



.logo-box{
	padding-left: 14px;
}
.menu-list-top .items{
	position: relative;
}
.menu-list-top .items .link{
	color: var(--black-color);
	font-weight: 500;
}
.menu-list-top .items .link.active{
	color: var(--first-color);
}
.menu-list-top .items .link:before{
	content: '';
  position: absolute;
  left: 0px;
  bottom: -5px;
  width: 100%;
  height: 1px;
  transition: transform 0.5s;
  transform: scaleX(0);
  transform-origin: right;
  background-color: var(--first-color);

}
.menu-list-top .items .link.active:before,
.menu-list-top .items .link:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.menu-list-top {
	display: flex;
	align-items: center;
	gap: 20px;
	justify-content: center;
}


/*----------mega-menu-css*/


/*------------------mobile-menu-box-menu-box------*/
.mobile-menu-box{
	position: fixed;
	width: 100%;
	height: 100%;
	left: -100%;
	top: 0px;
	background-color: #000000c4;
	z-index: 9999;
	transition: 0.3s ease;
}

.mobile-menu-box-active{
	left: 0%;
	transition: 0.3s ease;
}

.mobile-menu-box .inner-box{
	width: 75%;
	background-color: var(--white-color);
	height: 100%;
	padding: 20px 10px;
	position: relative;
	z-index: 999;
}
.mobile-menu-box .overlay-box{
	width: 100%;
	position: absolute;
	z-index: -1;
	height: 100%;
}
.mobile-menu-box .main-box{
	width: 150px;
}
.mobile-menu-box .inner-box .logo-box {
	justify-content: center;
}
.mobile-menu-box .inner-box .logo-box .close-box i{
	color: var(--first-color);
	cursor: pointer;
	font-size: 18px;
}
.phone-menu-list{
	height: 400px;
	overflow: auto;
}
.submenu-mobile{
	margin-left: 7px;
}
/*-------------End-mobile-menu-box-here-----------*/







.Services-dropdown-box{
    width: 1200px;
    position: absolute;
    transition: 0.3s;
    height: 300px;
    top: 28px;
    opacity: 0;
    transition: 0.2s ease;
    visibility: hidden;
    left: -389px;
    z-index: 999999999;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-transform: scaleY(0) translateZ(100px);
    transform: scaleY(0) translateZ(100px);
    -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
    z-index: 99;
}

.Services-dropdown-box .Services-dropdown-inner-box {
    width: 100%;
    padding: 40px 30px;
    box-shadow: 0px 0px 15px rgb(0 0 0 / 30%);
    height: 100%;
    position: relative;
    top: 44px;
    background-color: var(--white-color);
    border-radius: 15px;
    border-bottom: 8px solid var(--first-color);
}

.menu-list-top .items:hover .Services-dropdown-box{
	opacity: 1;
	-webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-transform: scaleY(1) translateZ(100px);
    transform: scaleY(1) translateZ(100px);
    -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
    z-index: 99;
	visibility: visible;
}

.about-dropdown-menu{
	width: 200px;
	left: -99px;
	height: auto!important;
	
}

.about-dropdown-menu.dropdown-Services-menu{
	width: 240px;
}

.about-dropdown-menu .Services-dropdown-inner-box {
	padding: 10px 0px;
}

.about-dropdown-menu .Services-dropdown-inner-box .drop-down-menu-box .list-menu-dropdown .items .link{
	padding: 7px 10px;
	display: block;/*
	background-color: var(--light-gray);*/
	border-bottom: 1px solid var(--border-color);
}


.about-dropdown-menu .Services-dropdown-inner-box .drop-down-menu-box .list-menu-dropdown .items .link:hover{
	background-color: var(--dark-blue);
	color: var(--white-color)!important;
}

.about-dropdown-menu .Services-dropdown-inner-box .drop-down-menu-box .list-menu-dropdown .items .link:before{
	display: none;
}

.mobile-menu .items{
	background-color: var(--light-gray);
	padding: 5px 10px;
	margin-bottom: 5px;
	display: flex;
	transition: 0.3s ease;
	justify-content: space-between;
}
.mobile-menu .items:hover{
	background-color: var(--first-color);
}

.mobile-menu .items:hover .link{
	color: var(--white-color)!important;
}


.mobile-menu .items:hover 
.sub-menne-mobile{
	margin: 5px 10px;
}

.mobile-menu .items .link{
	color: var(--black-color)!important;
	width: 100%;
}


.product-menu-box{
/*	background-color: red;*/
	height: 200px;
}
.auto-motive-link-text a{
	font-weight: 600;
	color: var(--auto-motive);
}
.cricle-box i{
	width: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0px auto;
	font-size: 13px;
	height: 35px;
	transition: 0.3s ease;
	transform: rotate(-21deg);
	border-radius: 100px;
	background-color: var(--auto-motive);
	color: var(--white-color);
}


.border-right-menu{
	border-right: 1px solid var(--border-color);
}

.Bike-product .link-box a{
	color: var(--Motor-Cycle-color);
}

.Bike-product .cricle-box i{
	background-color: var(--Motor-Cycle-color);
}

.solar-product .link-box a{
	color: var(--Solar-color-green);
}

.solar-product .cricle-box i{
	background-color: var(--Solar-color-green);
}


.Tubular-product .link-box a{
	color: var(--first-color);
}

.Tubular-product .cricle-box i{
	background-color: var(--first-color);
}
.cricle-box i:hover{
	background-color: var(--first-color);
}

.Tubular-product a:hover{
	color: var(--dark-blue)!important;
}
.Tubular-product .cricle-box i:hover{
	background-color: var(--dark-blue);
}


.common-btn .btn{
	color: var(--white-color);
	position: relative;
	height: 100%;
	padding: 13px 37px;
	z-index: 11;
	overflow: hidden;
	margin-top: 2px;
  border-radius: 100px;
  border: none;
  transition: 0.4s ease;
  font-weight: 500;
	background-color: var(--dark-blue);
}

.common-btn .btn:hover{
	color: var(--white-color)!important;
}
.common-btn .btn:before{
	content: '';
  position: absolute;
  left: 0px;
  z-index: -1;
  bottom: -40px;
  width: 120%;
  left: -15px;
  border-radius: 100%;
  transition: 0.4s ease;
  height: 280%;
  background-color: var(--first-color);
  transition: transform 0.5s;
  transform: scaleY(0);
  transform-origin: top;
}
.common-btn .btn:hover::before{
	transition: transform 0.5s;
  transform: scaleY(1);
  transform-origin: bottom;
}

.orange-btn .btn{
	background-color: var(--first-color);
}
.orange-btn .btn:before{
	background-color: var(--dark-blue);
}
.border-btn .btn{
	border: 2px solid transparent;
}
.border-btn .btn:hover{
	border-color: var(--white-color);
}
/*-------------end-top-header-section-here------*/

/*.banner-img{
	height: 560px;
}*/
.banner-section{
	overflow: hidden;
}
/*-------------Start-about-content-here---------*/
.about-content{
	padding-left: 40px;
}

.main-heading{
	font-size: 37px;
	font-weight: 800;
	text-transform: capitalize;
}



/*-----------End-about-content-here--------*/



/*----------start-Products-section-here--------*/
.Products-section{
	background-color: var(--first-color);
	border-radius: 50px 50px 0px 0px;
	overflow: hidden;
}

.Products-section:after{
	content: '';
	position: absolute;
	left: 0px;
	background-color: var(--white-color);
	width: 100%;
	height: 160px;
	bottom: -62px;
}
.site-main-heading{
	display: flex;
	align-items: center;
	justify-content: center;
}

.products-carousel .items .box-wrapper{
	background-color: var(--white-color);
	border-radius: 10px;
	border-bottom: 6px solid transparent;
	padding: 20px 20px;
	text-align: center;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 15%);
	transition: 0.3s ease;
}



.products-carousel .items .auto-motive-box:hover{
	border-bottom: 6px solid #ED3237;
}

.products-carousel .items .tubular-box:hover{
	border-bottom: 6px solid #F58634;
}
.products-carousel .items .solor-box:hover{
	border-bottom: 6px solid #00A859;
}
.products-carousel .items .usp-box:hover{
	border-bottom: 6px solid #F58634;
}

.products-carousel .items .bike-box:hover{
	border-bottom: 6px solid #838287;
}

.products-carousel .items .solor-box:hover{
	border-bottom: 6px solid #3783C4;
}

.products-carousel .items .box-wrapper p{
	font-size: 12px;
}
.products-carousel .items{
	padding-bottom: 30px;
}

.bottom-shape-img{
	position: absolute;
	left: 0px;
	bottom: 98px;
}

.right-dots-img{
	position: absolute;
	top: 0px;
	left: 0px;
}


.left-dots-img{
	position: absolute;
	top: 0px;
	right: 0px;
}

/*-------------End-Products-section-here----------*/

/*-------------Start-choose-us-section-here------------*/
.common-bc-img{
	background-image: url(../img/why-choose-us-bc.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.mian-box-choose-us{
	position: relative;
	padding-left: 20px;
	margin-top: 30px;
}

.mian-box-choose-us .content-box{
	border: 5px solid var(--white-color);
	border-radius: 20px;
	padding: 30px 20px;
	transition: 0.3s ease;
	min-height: 275px;
}
.mian-box-choose-us .content-box .heading-box{
	height: 66px;
	border-radius: 100px;
	background-color: var(--first-color);
	padding: 10px 10px 10px 30px;
	margin-left: -45px;
  margin-bottom: 20px;
}

.mian-box-choose-us .content-box .heading-box h3{
	margin-bottom: 0px;
	color: var(--white-color);
	font-size: 18px;
	transition: 0.3s ease;
}
.heading-box{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.heading-box .box{
	width: 52px!important;
	height: 52px!important;
	background-color: var(--black-color);
	border-radius: 100px;
	padding: 10px;
	border: 2px solid var(--white-color);
}
.heading-box .box .icon-box img{
	width: 100%;
}

.mian-box-choose-us .content-box:hover{
	background-color: var(--first-color);
}

.mian-box-choose-us .content-box:hover .heading-box{
	background: linear-gradient(153deg, #22577A -2.94%, #2074AB 80.47%);

}
/*-------------End-choose-us-section-here----------*/

/*------------Start-find-dealer-section-here---------*/
.find-dealer-section .orange-input .form-control{
	background-color: var(--first-color);
	border: none;
	border-radius: 0px;
	color: var(--white-color);
	height: 54px;
}

.find-dealer-section .orange-input .form-control::placeholder{
	color: var(--white-color)!important;
}



/*--------------ENd-find-dealer-section-here------------*/


/*----------Start-recycling-section-here-----------*/
.recycling-section{
	overflow: hidden;
	background-color: var(--dark-blue);
}
.content-recycling h1{
	font-weight: 800;
	font-size: 47px;
}
 

 
/*--------------ENd-recycling-section-here------------*/


/*----------Start-Technology-here------------*/
.Technology-section{
		margin-top: 220px;
}
.stats-wrapper{
	min-height: 230px;
	margin-top: -220px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 15%);
	border-radius: 30px;
	border-bottom: 3px solid var(--first-color);
	padding: 40px 30px;
	background-color: var(--white-color);
}
.stats-box .content h3{
	font-weight: 800;
	font-size: 40px;
}
.stats-box .content p{
	font-size: 17px;
	font-weight: 600;
	margin-bottom: 0px;
}
.border-right{
	border-right: 1px dashed var(--black-color)!important;
}
.Technology-box{
	border-radius: 20px;
	background-color: var(--white-color);
	margin-bottom: 30px;
	min-height: 518px;
}
.Technology-box img{
	border-radius: 20px;
}

.Technology-box .content{
	padding: 20px;
}
.technology-button {
	background-color: var(--first-color);
	border-radius: 10px;
	padding: 15px;
	margin-top: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: 0.3s ease;
}
.mb-20{
	margin-bottom: 20px;
}

.technology-button:hover{
	background-color: var(--dark-blue);
}
.technology-button .technology-name h3{
	font-size: 17px;
	color: var(--white-color);
	margin-bottom: 0px;
}

.plus-btn .icon-plus  i{
	width: 35px;
	height: 35px;
	border-radius: 100px;
	background-color: var(--white-color);
	color: var(--black-color);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	transition: 0.3s ease;
}

.technology-button:hover .plus-btn .icon-plus  i{
	background-color: var(--first-color);
	color: var(--white-color);
}

.technology-button .plus-btn{
	padding-left:15px;
	border-left: 1px solid var(--white-color);
}

/*-----------End-Technology-here----------*/


/*------Start-blog-box-wrapper-here-------*/
.blog-box-wrapper{
	border-radius: 20px;
	background-color: var(--white-color);
	box-shadow: 0px 0px 10px rgb(0 0 0 / 15%);
}
.blog-box-wrapper .content{
	padding: 20px;
}
.blog-box-wrapper .content h5{
	font-size: 17px;
}

.blog-box-wrapper .content h4{
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 15px;
	transition: 0.3s ease;
	color: var(--dark-blue);
	font-size: 18px;
}
.blog-box-wrapper .image-box img{
	border-radius: 20px;
}

.blog-box-wrapper:hover .content h4{
	color: var(--first-color)!important;
}
.read-more-btn{
	color: var(--first-color);
	transition: 0.3s ease;
}

.read-more-btn i{
	font-size: 12px;
}
.read-more-btn:hover{
	color: var(--dark-blue)!important;
}


.footer-section {
	padding: 90px 0px;
	background-color: var(--dark-blue);
}
/*--------End-blog-box-wrapper-here-------*/


/*------Start-footer-section-here-----------*/
.footer-box .footer-heading{
	font-size: 20px;
	margin-bottom: 30px;
}

.footer-box .menu-box .menu-list-top{
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;s
}

.footer-box .menu-box .menu-list-top .items .link{
	color: var(--white-color);
}

.Newsletter-input .form-control{
	position: relative;
	background-color: transparent;
	height: 60px;
	margin-top: 40px;
	padding-left: 20px;
	border: 3px solid var(--white-color);
	border-radius: 100px;
	padding-right: 50px;
}
.Newsletter-input .form-control::placeholder{
	color: var(--white-color)!important;
}
.Newsletter-input a .send-btn{
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 9px;
  right: 10px;
  z-index: 99;
	border-radius: 100px;
	background-color: var(--first-color);
}
.Newsletter-input a:hover{
	color: var(--dark-blue)!important;
}

.main-box-wrapper{
	background-color: var(--white-color);
	border-radius: 100px;
	padding: 5px;
}

.d-flex-center{
	display: flex;
	align-items: center;
	justify-content: center;
}

.cricle-btn .button-cricle i{
	width: 48px;
	height: 48px;
	background-color: var(--first-color);
	color: var(--white-color);
	display: flex;
	align-items: center;
	border-radius: 100px;
	font-size: 22px;
	justify-content: center;
}

.main-box-wrapper .right-content h5{
	font-weight: 600;
	font-size: 16px;
	margin-bottom: 0px;
}

.copyright-box {
	margin-top: 50px;
	text-align: center;
	padding: 30px 0px;
	border-top: 1px solid var(--white-color);
}
.back-to-top{
	width: 30px;
	height: 30px;
	display: none;
	text-align: center;
	background-color: var(--first-color);
	color: var(--dark-blue);
	box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
	position: fixed;
	border: 1px solid var(--dark-blue);
	right: 20px;
	z-index: 999;
	cursor: pointer;
	transition: 0.3s ease;
	bottom: 20px;
}

.back-to-top:hover{
	background-color: var(--dark-blue);
	color: var(--white-color);
	border-color: var(--white-color);
}
/*----------End-footer-section-here---------*/


/*--------Start-dots-carousel-css-here-----*/
.dots-carousel .owl-dots{
	text-align: center;
}
.dots-carousel .owl-dots .owl-dot{
	width: 30px;
	height: 6px;
	margin: 0px 4px;
	border-radius: 20px;
	transition: 0.4s ease;
	background-color: var(--dark-blue);
}

.dots-carousel .owl-dots .owl-dot.active{
	width: 45px;
	transition: 0.4s ease;
	background-color: var(--first-color);
}
.nav-button .owl-nav .owl-next,
.nav-button .owl-nav .owl-prev{
	width: 45px;
	transition: 0.3s ease;
	height: 45px;
	background-color: var(--white-color)!important;
	border-radius: 100px;
	color: var(--first-color)!important;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
}

.nav-button .owl-nav .owl-prev{
	position: absolute;
	transform: translate(-50% , -50%);
	top: 45%;
	left: -30px;
}

.nav-button .owl-nav .owl-next{
	position: absolute;
	transform: translate(-50% , -50%);
	top: 45%;
	right: -74px;
}

.nav-button .owl-nav .owl-next:hover,
.nav-button .owl-nav .owl-prev:hover{
	background-color: var(--dark-blue)!important;
}

.bannner-nav .owl-nav .owl-next,
.bannner-nav .owl-nav .owl-prev{
	width: 45px;
	transition: 0.3s ease;
	height: 45px;
	background-color: var(--dark-blue)!important;
	border-radius: 100px;
	color: var(--white-color)!important;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);

}

.bannner-nav .owl-nav .owl-next{
	text-align: start;
	position: absolute;
	transform: translate(-50% , -50%);
	top: 45%;
	right: -41px;
}

.bannner-nav .owl-nav .owl-next i{
	margin-left:9px;
}




.bannner-nav .owl-nav .owl-next:hover,
.bannner-nav .owl-nav .owl-prev:hover{
	background-color: var(--first-color)!important;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);
}

.bannner-nav .owl-nav .owl-prev{
	text-align: end;
	position: absolute;
	transform: translate(-50% , -50%);
	top: 45%;
	left: 2px;
}

.bannner-nav .owl-nav .owl-prev i{
	margin-right:9px;
}
 

/*--------------End-dots-carousel-css-here-----*/


/*----------Stat-inner-banner-section-here------------*/

.inner-banner-section{
	position: relative;
	padding: 50px 0px;
	min-height: 340px;
	align-items: center;
	display: flex;
}
.inner-banner-content .main-heading{
	font-size: 50px;
}
.breadcurmb-box{
	background-color: var(--dark-blue);
	border-radius: 100px;
	padding: 20px 10px;
}
.breadcurmb-orange{
	background-color: var(--first-color);
}
.breadcurmb-orange .link-text p a:hover{
	color: var(--dark-blue)!important;
}

.breadcurmb-section{
	margin-top: -32px;
	z-index: 99;
}

/*------------ENd-inner-banner-section-here-------------*/


/*------------Start-Batteries-moadal-section-here--------*/
.Batteries-moadal-section{

}
.moadl-batteries-box {
	background-color: var(--white-color);
	border-radius: 15px;
	position: relative;
	padding: 30px 0px 20px 0px;
	overflow: hidden;
	transition: 0.4s ease;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	margin-bottom: 30px;
}
.moadl-batteries-box:hover{
	margin-top: -10px;
	transition: 0.4s ease;
}

.moadl-batteries-box .logo-box{
	position: absolute;
	transform: translate(-50%,-50%);
	left: 50%;
	top: 61%;
}
.modal-name h4 .modal-number{
	font-size: 16px;
}
.modal-name h4 .modal-text{
	font-weight: 800;
}

.moadl-batteries-box  .button-box{
	position: relative;
	top: 100px;
	transition: 0.3s ease;
	opacity: 0;
	visibility: hidden;
}

.moadl-batteries-box:hover  .button-box{
	top: 0px;
	opacity: 1;
	visibility: visible;
}
.moadl-batteries-box .modal-name{
	position: relative;
	z-index: 999;
}
.moadl-batteries-box .modal-name  h4 i{
	font-size: 17px;
}

.button-list{
	display: flex;
	margin-top: 20px;
	align-items: center;
	gap: 10px;
	justify-content: center;
}
.button-list .link a{
	width: 45px;
	height: 45px;
	border-radius: 5px;
	display: flex;
	align-items: center;
	transition: 0.3s ease;
	justify-content: center;
	color: var(--white-color);
	background-color: var(--dark-blue);
}
.button-list .link.active a,
.button-list .link a:hover{
	background-color: var(--first-color);
}
.button-list a{
	color: var(--white-color)!important;
}
.solor-Batteries-product-section .moadl-batteries-box .modal-name i,
.solor-Batteries-product-section .moadl-batteries-box .modal-name .modal-number{
	color: #0C8B04;
}

.solor-Batteries-product-section .moadl-batteries-box .button-box .common-btn .btn:before{
	background-color: #0C8B04;
}

.Bike-Batteries-product-section .moadl-batteries-box .modal-name i,
.Bike-Batteries-product-section .moadl-batteries-box .modal-name .modal-number{
	color: #424242;
}

.Bike-Batteries-product-section .moadl-batteries-box .button-box .common-btn .btn:before{
	background-color: #424242;
}




/*---------End-Batteries-moadal-section-here-----------*/

/*--------Start-product-details-page-here---*/
.product-image-box{
	border-radius: 10px;
	padding: 30px;
	border: 1px solid var(--border-color);
}
.start-box span .Reviews-text {
	font-size: 13px;
	margin-left: 5px;
}
.amount-box .price{
	font-weight: 700;
	font-size: 30px;
}

.amount-box del{
	font-size: 20px;
}


/*--------End-product-details-page-here--------*/

/*------------Start-feature-section-here----------*/
.feature-section{
	background: linear-gradient(153deg, #22577A -2.94%, #2074AB 80.47%);
}
.feature-box-wrapper{
	background-color: var(--white-color);
	min-height: 420px;
	padding: 30px;
	margin: 15px 0px;
	border-radius:200px 200px 0px 0px;
}

.feature-box-wrapper .heading-text h4{
	font-weight: 600;
	font-size: 20px;
}
.feature-box-wrapper .heading-text h3{
	font-weight: 700;
	margin-top: 20px;
}
.Dimension-content h4{
	letter-spacing: 13px;
}
.Dimension-content h3{
	word-spacing: 28px;
}
/*-------------End-feature-section-here----------*/

/*-----------Start-tab-wrapper-box-here--------*/
.tab-wrapper-box {
	padding: 20px;
	border: 1px solid var(--border-color);
}

.nav .nav-item .nav-link{
	margin-right: 10px;
	width: 240px;
	text-align: center;
	font-weight: 600;
	background-color: var(--border-color);
	color: var(--black-color)!important;
}
.nav .nav-item .nav-link.active{
	color: var(--white-color)!important;
	background-color: var(--first-color);
}
.Partner-img-box{
	background-color: var(--light-gray);
	border: 1px solid var(--dark-blue);
	border-radius: 7px;
	padding: 10px;
	margin-top: 30px;
}
/*--------------End-tab-wrapper-box-here---*/

/*--------start-about--page-css-here---------*/
.experience-box h1{
 color: var(--first-color);
 font-weight: 800;
 font-size: 100px;
}
.experience-box h1 .Years-text{
	font-size: 19px;
	font-weight: 500;
}
.mission-section{
	background-color: var(--dark-blue);
}
.mission-box-section{
	width: 80%;
	min-height: 280px;
	border-radius: 0px 200px 200px 0px;
	padding: 30px 30px 30px 80px;
	background-color: var(--white-color);
	margin-bottom: 60px;
}

.mission-box-section .mission-content{
	width: 65%;
}
.mission-box-section .image-box .image-inner-box{
	height: 220px;
  width: 220px;
	border-radius: 100px;
}
.mission-box-section .box-wrapper{
	justify-content: space-between;
}
.vision-box-section{
	margin-left: auto;
	border-radius: 200px 0px 0px 200px;
	padding: 30px 80px 30px 30px;
	margin-bottom: 0px;
}
.Core-Values-section .cricle-box{
	background-color: var(--light-gray);
	padding: 30px;
	min-height: 550px;
	border-radius: 200px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 4%);
	transition: 0.3s ease;
	margin-bottom: 30px;
}
.Core-Values-section .cricle-box:hover{
	background-color: var(--first-color);
}
.Core-Values-section .cricle-box .heading-box{
	width: 100%;
	height: 220px;
	border-radius: 100%;
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	background-color: #219EBC;
}
.Core-Values-section .cricle-box .heading-box h2{
	text-transform: uppercase;
	font-weight: 700;
	font-size: 25px;
}
.Core-Values-section .cricle-box:hover .text{
	color: var(--white-color);
}
/*---------End-about-page-here----------*/
/*----------Start-conatct-form-section-here---*/




.form-box-wrapper{
	background-color: var(--dark-blue);
	
	border-radius: 15px;
}
.form-control:focus{
	border-color: var(--first-color);
}

.conatct-form-section .form-box-wrapper{
	padding: 30px 140px 30px 30px;
}


.form-control{
	height: 50px;
	border-radius: 10px;
}
.common-input{
	margin-bottom: 30px;
}
.textarea-box textarea{
	height: 150px;
}
.conatct-form-section .main-box-form{
	position: relative;
}
.main-box-form .contact-info-box{
	background-color: var(--first-color);
	padding: 30px;
	border-radius: 10px;
	position: absolute;
	z-index: 99;
	width: 400px;
	transform: translate(-50%,-50%);
	top: 50%;
	right: -200px;
}
.main-box-form .contact-info-box .main-box-wrapper{
	margin-top: 30px;
	border-radius: 5px;
	padding: 15px;
}
.years-list-box-wrapper{
	margin-top: 40px;
	display: flex;
	align-items: center;
	gap: 40px;
}
.box-date .inner-box-date{
	border-radius: 100%;
	display: flex;
	flex-direction: column;
  text-align: center;
	justify-content: center;
	align-items: center;
	transition: 0.3s ease;
	position: relative;
	width: 150px;
	height: 150px;
	gap: 10px;
	z-index: 1;
	background-color: var(--first-color);
}
.box-date .inner-box-date .logo{
	width: 100%;
	height: 100%;
}

.box-date .inner-box-date:before{
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	height: 115%;
	width: 115%;
	transition: 0.3s ease;
	border: 2px solid var(--dark-blue);
	border-radius: 100%;
	transform: translate(-50%,-50%);
	background-color: transparent;
}

 
.years-list-box-wrapper:hover .inner-box-date:before{
		border-color: var(--first-color);
}


.box-date .inner-box-date h3{
	font-weight: 700;
	font-size: 20px;
}
.years-list-box-wrapper .content-box .content i{
	font-size: 25px;
}
.border-box-main:before{
	content: '';
	position: absolute;
	left: 88px;
	z-index: -1;
	top: 100px;
	height: 90%;
	width: 2px;
	background-color: #e5e5e5;
}
/*--------------ENd-conatct-form-section-here--------*/

/*-------------Start-our-impact-page-css-here----------*/
.Certifications-box{
	background-color: var(--light-gray);
	border-radius: 10px;
	border: 3px solid var(--dark-blue);
	padding: 10px;
	transition: 0.4s ease;
	height: 287px;
	margin-bottom: 30px;
}
.Certifications-box:hover{
	border-color: var(--first-color);
	margin-top: -10px;
	box-shadow: 0px 0px 10px rgb(0 0 0 /  20%);
}
.Awards-Recognitions-section .cricle-box {
	border-bottom-right-radius: 0px;
	min-height: auto;
	border-bottom-left-radius: 0px;
}
.Awards-Recognitions-section .cricle-box:hover h4{
	color: var(--white-color);
}
.Awards-Recognitions-section .cricle-box .heading-box{
	background-color: var(--dark-blue);
	padding: 18px;
}
.Awards-carousel .owl-dots .owl-dot {
	background-color: var(--white-color);
}

.Awards-Recognitions-section{
	padding-bottom: 150px;
}

.counter-box .stats-wrapper{
	margin-top: -190px;
}
/*-------------End-our-impact-page-css-here----------*/

/*----------------Start-Team-box-wrapper-here------*/
.Team-box-wrapper{
	background-color: var(--white-color);
	border-radius: 10px;
	position: relative;
	padding-bottom: 30px;
	margin-bottom: 30px;
	box-shadow: 0px 0px 10px rgb(0 0 0 /  20%);
}
.member-info-box{
	padding: 10px 10px 10px 25px;
	border-radius: 100px;
	background-color: var(--dark-blue);
	height: 65px;
	transition: 0.3s ease;
	width: 90%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
	z-index: 99;
	margin: -33px auto 0px auto;
}
.member-info-box .info-text a{
	font-weight: 600;
	font-size: 17px;
} 
.member-info-box .info-text p{
	font-size: 13px;
}
.member-info-box .info-text a:hover{
	color: var(--dark-blue)!important;
}
.Team-box-wrapper:hover .member-info-box{
	background-color: var(--first-color);
}
.social-media-links .links-media-box{
	width: 45px;
	height: 45px;
	background-color: var(--white-color);
	border-radius: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.3s ease;
	position: relative;
	cursor: pointer;
	font-size: 20px;
}
 
 .social-media-links .links-media-box:hover{
	box-shadow: 0px 0px 15px rgb(0 0 0 /  30%);
 }
.box-social-media{
  background-color: transparent;
  width: 39px;
  height: 238px;
  position: absolute;
  top: -235px;
  right: 4px;
  transition: 0.2s ease;
  opacity: 0;
  visibility: hidden;
  z-index: 999999999;
  -webkit-transform-origin: bottom center;
  transform-origin: bottom center;
  -webkit-transform: scaleY(0) translateZ(100px);
  transform: scaleY(0) translateZ(100px);
  -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
  z-index: 99;
}
.links-media-box:hover .box-social-media{
	opacity: 1;
	visibility: visible;
	-webkit-transform-origin: bottom center;
  transform-origin: bottom center;
  -webkit-transform: scaleY(1) translateZ(100px);
  transform: scaleY(1) translateZ(100px);
  -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
  z-index: 99;
}
 .box-social-media .social-media-icon a i{
	position: relative;

}

 


.links-media-box .box-social-media .social-media-icon{
	flex-direction: column;
}
.links-media-box .box-social-media .social-media-icon a i{
	background-color: var(--dark-blue);
}
.links-media-box .box-social-media .social-media-icon a i:hover{
	background-color: var(--first-color);
}
/*--------------End-Team-box-wrapper-here----------*/

/*------------Start-events-page-css-here-------*/
.About-The-Events-section .box-wapper-box{
	background-color: var(--dark-blue);
	border-radius: 15px;
	padding: 30px;
	margin-bottom: 30px;
	transition: 0.3s ease;
}
.About-The-Events-section .box-wapper-box.active,
.About-The-Events-section .box-wapper-box:hover{
	background: linear-gradient(180deg, #F59E00 0%, #F55511 100%);
}

.About-The-Events-section .box-wapper-box .icon-box{
	width: 100px;
	height: 100px;
	border-radius: 100px;
	padding: 20px;
	display: flex;
	justify-content: center;
	background-color: var(--white-color);
}
.Upcoming-Event-section{
	padding: 0px;
	background-color: var(--dark-blue);
}
.Upcoming-Event-section .left-image-box{
	width: 40%;
	height: 100%;
	position: absolute;
	top: 0px;
	z-index: 999;
	left: 0px;
}

.Upcoming-Event-box .image-box img{
	border-radius: 10px;
}

.Upcoming-Event-box{
	margin-bottom: 30px;
}
.Upcoming-Event-box .content-box{
	padding: 15px;
	background-color: var(--white-color);
	width: 90%;
	position: relative;
	z-index: 99;
	margin: -40px auto 0px auto;
	border-radius: 10px;
	border-top: 2px solid var(--first-color);
}

.Upcoming-Event-box .content-box a h4{
	font-weight: 600;
	font-size: 17px;
	transition: 0.3s ease;
	margin-bottom: 2px;
}
.Upcoming-Event-box:hover .content-box a h4{
	color: var(--first-color);
}

.Upcoming-Event-box .content-box .date{
	font-weight: 600;
	font-size: 14px;
}
.Upcoming-Event-section .icon-image{
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 99;
}
.Upcoming-Event-section .line-image-top{
	position: absolute;
	right: 0px;
	width: 60%;
}

.Upcoming-Event-section .line-image-bottom{
	position: absolute;
	right: 0px;
	width: 60%;
	bottom: 0px;
}
.Past-Events-list-box .number-box .item{
	width: 50px;
	height: 50px;
	border-radius: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--dark-blue);
}
.Past-Events-list-box .past-event-info{
	background-color: var(--first-color);
	position: relative;
	padding: 20px 20px;
	width: 100%;
}
.Past-Events-list-box .past-event-info:before{
	content: '';
	position: absolute;
	width: 40px;
	height: 40px;
	top: 50%;
	left: -19px;
	transform: translate(-50%,-50%);
	clip-path: polygon(100% 0, 36% 50%, 100% 100%);
	background-color: var(--first-color);
}
.Past-Events-list-box{
	display: flex;
	gap: 80px;
	position: relative;
	align-items: center;
}
 
.Past-Events-list-box.last-event:before{
	display: none;
}

}
 .Past-Events-list-box:before{
 	opacity: 1;
 }

.Past-Events-list-box .past-event-info a h4{
	font-weight: 700;
	font-size: 29px;
	display:inline-block;
}
.Past-Events-list-box .past-event-info a:hover{
	 color: var(--dark-blue)!important;
}
.main-box-event .main-box-img .image-box{
	width: 154px;
	height: 100%;
	padding: 8px;
	background-color: var(--white-color);
}
.Past-Events-list-box .past-event-info{
	display: flex;
	align-items: center;
	gap: 40px;
}
.Past-Events-section{
	overflow: hidden;
}
.gallery-image-box{
	margin-bottom: 20px;
}

.gallery-lightbox-list .item   img{
	border-radius: 5px;
	transition: 0.3s ease;
	cursor: pointer;
}

.gallery-lightbox-list{
	display: flex;
	align-items: center;
	gap: 7px;
}
.carousel__viewport,
.fancybox__counter,
.fancybox__caption{
	display: none;
}


.gallery-lightbox-list .item   img:hover{
	box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);
}


/*-------------End-events-page-css-here-----------*/
/*-----------Start-Infrastructure-section-here------*/
.Infrastructure-section .site-main-heading .heading h1{
	font-size: 27px;
}
.Infrastructure-section .main-box-wrapper{
	background-color: var(--dark-blue);
	padding: 25px 25px;
	border-radius: 10px;
	min-height: 423px;
	margin-bottom: 30px;
}

 
.facilities-list li{
	display: flex;
	align-items: center;
	margin-top: 20px;
	background-color: var(--white-color);
}

.facilities-list li .icon-box .icon i{
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
	background-color: var(--first-color);
	color: var(--white-color);
}
.experience-box h1 .mn-text{
	font-weight: 500;
	font-size: 35px;
}
/*-------------End-Infrastructure-section-here-------*/

/*---------Start-worldwide-counter-box-here---------*/
.worldwide-counter-box{
	text-align: center;
	background-color: var(--dark-blue);
	padding: 30px 0px;
	margin-top: 30px;
	border-radius: 10px;
}
.worldwide-counter-box h2{
	font-weight: 800;
	font-size: 60px;
}

.worldwide-counter-box.active-box{
	background: linear-gradient(180deg, #F59E00 0%, #F55511 100%);
}
/*-----------ENd-worldwide-counter-box-here----------*/
/*----------Start-Social-Responsibility-section-here-------*/
.Social-Responsibility-section{
	padding-bottom: 200px;
	margin-bottom: 50px;
}
 .Social-Responsibility-box{
	background-color: var(--white-color);
	padding: 30px 20px;
	border-radius: 15px;
	position: relative;
	margin-top: 40px;
}

  .Social-Responsibility-box .heading-header .heading h3{
	font-weight: 700;
	font-size: 23px;
}
 .Social-Responsibility-box:after{
	content: '';
	position: absolute;
	transform: translate(-50%, -50%);
	left: 50%;
	width: 65%;
	height: 115%;
	transition: 0.3s ease;
	top: 50%;
	z-index: -1;
	border-radius: 15px;
	background-color: var(--first-color);
}


.common-list .items{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 5px;
}
.bootom-shape{
	position: absolute;
	bottom: 0px;
	left: 0px;
}

/*-------------End-Social-Responsibility-section-here------*/

/*---------------Start-Research-Development-section-here----------*/
.Research-Development-section .Social-Responsibility-box{
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	margin-bottom: 70px;
}
.Research-Development-section .Social-Responsibility-box::after{
	background-color: var(--dark-blue);
	height: 100%;
	top: 57%;
}
.Research-Development-section .Social-Responsibility-box:hover::after{
	background-color: var(--first-color);
}
.Research-Development-section .Social-Responsibility-box .icon-box{
	width: 100px;
	height: 100px;
	position: absolute;
	right: 30px;
  top: -46px;
	background-color: var(--first-color);
	padding: 20px;
	display: flex;
	transition: 0.3s ease;
	align-items: center;
	border-radius: 100px;
}
.Research-Development-section .Social-Responsibility-box:hover .icon-box{
	background-color: var(--dark-blue);
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
}

/*-----------------End-Research-Development-section-here------------*/

/*--------Start-faq-page-here---------*/
.accordion .card {
    margin-bottom: 15px;
    border: none;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
}

.accordion .card .card-header {
    padding: 8px 0px;
    background-color: var(--white-color);
    
    border: none;
    position: relative;
}
.accordion .card .card-header h5 button i {
    color: var(--dark-blue);
    position: absolute;
    right: 17px;
    transition: 0.3s ease;
    top: 19px;
}

.accordion .card .card-header h5 button {
    color: var(--dark-blue);
    width: 100%;
    text-align: left;
    text-decoration: none;
    padding-right: 34px;
}
.accordion .card .card-body {
    font-size: 14px;
    border-radius: 15px;
    border-bottom: 2px solid var(--dark-blue);
}
 
 .accordion .card .card-header-active h5 button i{
	transform: rotateX(190deg);
	transition: 0.3s ease;
}

/*------------End-faq-page-here---------*/

/*-----------Start-Check-the-following-section-here--------------*/
.Check-the-following-section .Check-the-following-box{
	background-color: var(--light-gray);
 
	border-radius: 20px;
}

.Check-the-following-section .Check-the-following-box .battery-buy-girl{
	border-radius: 20px 0px 0px 20px;
}

.Check-the-following-section .content{
	padding: 30px;
}
.list-dots .items{
	align-items: start;
}
.list-dots .items span i{
	font-size: 10px;
}
/*--------------End-Check-the-following-section-here-------------*/

/*---------Start-buying-points-section-here------------*/
.buying-points-section{
	background-color: var(--dark-blue);
	padding-bottom: 180px;
	margin-bottom: 80px;
}
.buying-points-section .points-items{
	background-color: var(--white-color);
	height: auto;
	padding: 30px 30px 30px 300px;
	margin-top: 80px;
	margin-bottom: 30px;
	position: relative;
}
.buying-points-section .points-items:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 0px;
	background-color: var(--dark-blue);
	width:80px;
	height: 100%;
}
.buying-points-section .points-items h4{
	font-weight: 900;
}

.buying-points-section .points-items .image-box{
	width: 300px;
	height: 257px;
	position: absolute;
	left: -23px;
  top: -47px;
	padding: 10px;
	background-color: var(--black-color);
}

.buying-points-section .points-items p{
	text-align: justify;
}
.buying-points-section .left-side-image{
	padding: 30px 300px 30px 30px;
}
.buying-points-section .left-side-image .image-box{
	left: inherit;
	right: -30px;
}

.buying-points-section .left-side-image:before{
	left: inherit;
	right: 0px;
} 
.Register-Your-Product .wrapper-box{
	background-color: var(--light-gray);
	padding: 30px;
	border-radius: 20px;
}
/*-------------ENd-buying-points-section-here----------*/


/*---------------Start-Follow-these-best-practices-section-here----------*/
.best-practices-box{
	padding: 30px;
	border-radius: 20px;
	height: 200px;
	margin-bottom: 110px;
	background-color: #DDF4FD;
}
.best-practices-box .inner-box{
	width: 100%;
	height: 250px;
	padding: 30px 20px;
	text-align: center;
	border-radius: 20px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	background-color: var(--white-color);
}
.best-practices-box .inner-box h4{
	font-weight: 600;
	font-size: 15px;
	text-transform: capitalize;
	margin-top: 20px;
}
.best-practices-box .inner-box .icon-box{	
	width: 80px;
	height: 80px;
	border: 1px solid var(--dark-blue);
	border-radius: 100px;
	display: flex;
	align-items: center;
	padding: 10px;
	margin: 0px auto; 
}

/*---------------------End-Follow-these-best-practices-section-here--------------*/

/*-------------Start-career-page-here-------*/
.job-box-wrapper{
	padding: 25px;
	background-color: var(--white-color);
	border: 1px solid transparent;
	transition: 0.3s ease;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	margin-bottom: 30px;
}
.job-box-wrapper:hover{
	border-color: var(--first-color);
}

.job-box-wrapper h5{
	font-weight: 700;
	font-size: 16px;
}

.job-box-wrapper h4{
	font-weight: 700;
	margin:10px 0px;
}
.job-box-wrapper .common-btn .btn{
	padding: 8px 30px;
}


.appy-form-box{
	border-radius: 20px;
	padding: 30px 20px;
	position: sticky;
	top: 100px;
}

/*------------End-career-page-here--------------*/
/*------------Start-Technologies-list-page-here------*/
.Technologies-list-page .Technology-box{
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
}
.benefits-section .content .common-list .items{
	margin-bottom: 15px;
}
.benefits-section .content .common-list .items span{
	color: var(--white-color);
} 
.process-box{
	width: 290px;
	height: 290px;
	border-radius: 200px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
	position: relative;
	text-align: center;
	align-items: center;
	background-color: var(--white-color);
	
}
.process-box:after{
	content: '';
	position: absolute;
	transform: translate(-50%,-50%);
	left: 50%;
	top: 53%;
	width: 100%;
	height: 100%;
	border-radius: 200px;
	z-index: -1;
	box-shadow: 0px 0px 15px rgb(0 0 0 / 10%);
	background-color: var(--first-color);
}

.process-box h4{
	font-size: 18px;
	font-weight: 700;
}
.process-box .step-box {
	position: absolute;
	right: 0px;
	top: 0px;
}

.process-box .step-box .inner-box{
	width: 80px;
	height: 80px;
	border-radius: 100px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
	background-color: var(--first-color);
}

.process-box .step-box .inner-box:after{
 content: '';
 position: absolute;
 transform: translate(-50%,-50%);
 left: 50%;
 top: 50%;
 width: 120%;
 height: 120%;
 border-radius: 100px;
 background-color: initial;
 border: 2px dashed var(--first-color);

}

.process-box .right-arrow{
 position: absolute;
 transform: translate(-50%,-50%);
 left: 130%;
 top: 50%;
}

.process-two:after{
	top: 47%;
}

.Research-Development-section .Social-Responsibility-box:after{
	background-color: var(--first-color);
}
.shipping-policy-section{
	background-color: var(--light-gray);
}
.arrow-heading-box{
	background-color: var(--first-color);
	position: relative;
	height: 50px;
	display: flex;
	align-items: center;
	padding: 0px 20px;
}
.arrow-heading-box h4{
	font-weight: 600;
	font-size: 20px;
}
.arrow-heading-box:after{
content: '';
 position: absolute;
 transform: translate(-50%,-50%);
 right: -24%;
 top: 50%;
 clip-path: polygon(0 0, 0% 100%, 66% 48%);
 width: 50px;
 height: 60px;
 background-color: var(--first-color);
 
}

.shipping-policy-section .content{
	padding: 0px 50px 0px 50px;
}
.shipping-policy-section .list{
	margin-top: 40px;
}


/*------------End-Technologies-list-page-here----------*/

/*-----------Start-blog-details-page-here---------*/
.common-content h1 {
    text-transform: capitalize;
    font-weight: 800;
    font-size: 26px;
    margin-top: 25px;
}
.common-content p {
    margin-bottom: 10px;
}
.blog-banner-box-banner img{
	border-radius: 30px;
}

.Author-box {
    background-color: var(--white-color);
    border-radius: 10px;
    padding: 20px;
    margin: 20px 15px;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
}
.Author-box .Author-details h5 {
    font-weight: 700;
    font-size: 15px;
}
.Author-box .Author-details h3 {
    font-weight: 700;
    font-size: 20px;
    color: var(--first-color);
}
.red-social-media-icon a i{
	background-color: var(--first-color);
}
.red-social-media-icon a i:hover{
	background-color: var(--dark-blue);
}

.chat-section-list .items {
    margin-top: 40px;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 30px;
}

.chat-section-list .items .right-box .image-box-user img {
    width: 100px;
    height: 100px;
    margin-right: 20px;
    border-radius: 100px;
}
.chat-section-list .items .user-info-details h4 {
    font-size: 16px;
}

.chat-section-list .items .user-info-details .Reply-text {
    color: var(--first-color);
    margin-left: 50px;
    margin-top: 10px;
}

.chat-section-list .items.relpy-box {
    padding-left: 100px;
}
.chat-section-list .items:last-child {
    border-bottom: none;
}

.comments-box .form-box-wrapper {
    background-color: var(--light-gray);
}
.form-box-wrapper {
    background-color: var(--dark-blue);
    padding: 30px 30px 30px 30px;
    border-radius: 15px;
}

.right-box-details {
    position: sticky;
    top: 100px;
}
.inner-box-details {
    background-color: var(--light-gray);
    border-radius: 10px;
    padding: 20px 30px;
    margin-bottom: 30px;
}
.content-right-box h5 {
    font-weight: 700;
}

.relative {
    position: relative;
}

.Search-input button {
    position: absolute;
    right: 21px;
    top: 14px;
    color: var(--first-color);
    background-color: inherit;
}
.Search-input{
	margin-top: 30px;
}

.Recent-post-list .chat-section-list .items {
    border-bottom: 0px;
    margin-top: 15px;
    padding-bottom: 0px;
}

.Recent-post-list .chat-section-list .items .right-box .image-box-user img {
    width: 80px;
    height: 80px;
    border-radius: 10px;
}
.chat-section-list .items .user-info-details h4 {
    font-size: 16px;
}
.visa-list .items{
	padding: 10px 0px;
	border-bottom: 1px solid var(--border-color);
}

.visa-list .items:last-child{
	border-bottom: none;
}

.visa-list .items .link{
	color: var(--black-color);
}
.visa-list .items .link i{
	font-size: 13px;
	color: var(--first-color);
}
.line-box-bottom{
	position: relative;
	display: inline-block;
}
.line-box-bottom:before {
    content: '';
    position: absolute;
    left: 0px;
    bottom: -9px;
    width: 60px;
    height: 4px;
    border-radius: 0px;
    background-color: var(--first-color);
}
/*----------End-blog-details-page-here--------*/

/*-----------Start-inner-page-find-dealer-here-------*/
.inner-page-find-dealer .orange-input .form-control{
	background-color: var(--white-color);
	border: 1px solid var(--first-color);
	color: var(--text-color);
}

.inner-page-find-dealer .orange-input .form-control::placeholder{
	color: var(--text-color)!important;
}

.dealer-box{
	border-radius: 15px;
	padding: 20px;
	background-color: var(--white-color);
	box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
	margin-bottom: 30px;
	transition: 0.3s ease;
	border: 1px solid transparent;
}
.dealer-box:hover{
	margin-top: -10px;
	border-color: var(--first-color);
}
.dealer-box h5{
	font-weight: 600;
}
.dealer-box .d-flex-common{
	align-items: start;
}

.dealer-box .d-flex-common span p a,
.dealer-box .d-flex-common span p{
	font-size: 13px;
}
.dealer-box  .btn-map{
	text-decoration: underline;
}

.Become-a-dealer-section{
	z-index: 22;
}

.Become-a-dealer-benefits{
	background-color: var(--dark-blue);
	margin-top: -70px;
}
.Become-a-dealer-benefits:after,
.Become-a-dealer-benefits:before{
	content: '';
	position: absolute;
	left: 0px;
	top: 0px;
	height: 70px;
	width: 100%;
	background-color: var(--white-color);
}


.Become-a-dealer-benefits:after{
	top: inherit;
	z-index: -1;
	bottom: 0px;
}


.Become-a-dealer-benefits .appy-form-box{
	position: inherit;
	top: inherit;
}

.Become-a-dealer-benefits .appy-form-box:before{
	content: '';
	position: absolute;
	height: 50%;
	transform: translate(-50%,-50%);
	left: 50%;
	top: 50%;
	z-index: -1;
	width: 107%;
	border-radius: 10px;
	background-color: var(--white-color);
}
/*---------------End-inner-page-find-dealer-here---------*/
/*--------Start-Downloads-Brochure-section-here-----*/
.Downloads-Brochure-section{
	background-color: var(--first-color);
}
.white-btn .btn{
	background-color: var(--white-color);
	color: var(--dark-blue);
}
 
.Downloads-Brochure-section .appy-form-box{
 	min-height: 670px;
 }

 .batteries-image{
 	position: absolute;
 	right: 20px;
 	bottom: 40px;
 }
/*-----------ENd-Downloads-Brochure-section-here--------*/

/*----------Start-job-details-section-here-------*/
.job-details-section{
	background-color: var(--light-gray);
	margin-top: -30px;
}
.job-details-section .main-box-wrapper{
	padding: 15px;
	margin-top: 20px;
	background-color: var(--light-gray);
}

.job-details-section .inner-box-details{
	background-color: var(--white-color);
}
.job-details-section  .appy-form-box{
	position: inherit;
	top: inherit;
}

.custom-modal .modal-dialog{
	max-width: 1000px!important;
	
}
.custom-modal .modal-dialog .modal-body{

	background-image: url(../img/pattern-3.png);
	background-repeat: no-repeat;
	background-size: contain;
	padding: 30px 20px!important;
	background-position: center right;
}

.custom-modal .modal-dialog{ .modal-content{
	border-radius: 20px;
	border: 6px solid var(--first-color);
}

/*-----------End-job-details-section-here------------*/
