/*
Theme Name: Fuel

*/

html {
	scroll-behavior: smooth;
	font-size: 62.5%;
  }
  html,
  body {
	margin: 0;
	padding: 0;
	font-family: arial;
  }
  body {
	color: #000;
	font-size: 17px;
	line-height: 25px;
	font-weight: 400;
  }

  article h1,
  article h2,
  article h3 {
	margin: 0;
	padding: 0;
	margin-bottom: 10px;

  }

  h1,
  h2,
  h3 {
	margin: 0;
	padding: 0;

  }
p{margin: 0 0; padding: 0;}
  .container {
	max-width: 1280px;
	margin: 0px auto;
  }
  .text-center {
	text-align: center;
  }

  .header-main {
	padding: 0px 0 0;
	background: #fff;
	position: relative;
	z-index: 10;
  }
  .header-inner {
	display: flex;height: 116px;
	justify-content: space-between;
	align-items: center;
  }
  .header-inner .custom-logo-link{
	display: inline-flex;
	margin: 0;
	padding: 0;
  }
  .sticky {
	position: fixed;
	width: 100%;
	padding-bottom: 10px;
	padding-top: 10px;
	box-shadow: 0 0 12px #d5cece;
	z-index: 12;
  }
  .main-menu ul {
	padding: 0;
	margin: 0;
	list-style: none;
	display: flex;
	justify-content: flex-end;
	align-items: center;
  }
  .main-menu ul li {
	margin-left: 2.8rem;
  }
  .main-menu ul li a {
	color: rgba(38, 39, 45, 0.65);
	text-decoration: none;
	position: relative;
	font-weight: 600;
  }
  .main-menu ul li a:before {
	content: "";
	position: absolute;
	width: 28px;
	height: 2px;
	bottom: -5px;
	left: 50%;
	background-color: #d76e48;
	text-decoration: none;
	visibility: hidden;
	-webkit-transform: scaleX(0) translateX(-50%);
	transform: scaleX(0) translateX(-50%);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
  }
  .main-menu ul li a.active, .main-menu ul li a:hover {
	color: rgba(3, 87, 238, 1);
	font-weight: 600;
  }
  .hamburger {
	display: none;
  }
   header .app-btns a {
	margin-left: 9px;
  }
  .main-menu {
	display: inline-flex;
	margin-left: auto;
	margin-right: 4rem;
  }

  .page-section {
	margin-top: -150px;
	padding-top: 150px;
  }

  .top-section {
	position: relative;
  }
  .top-section img.banner-img {
	width: 100%;
	position: absolute;
	z-index: 1;top: 0; min-height: 800px; object-fit: cover;
  }
  .top-section .inner-section {
	color: #fff;
	padding: 16rem 0 0;
	position: relative;
	width: 100%;

	z-index: 2;
  }

  .banner-cnt {
	display: flex;
	margin: 0 0 20rem;
	justify-content: space-between;
	align-items: center;
  }
  .banner-cnt .lft {
	width: 53%;
  }
  .banner-cnt .rgt {
	width: calc(100% - 40%);
	display: inline-flex;
	justify-content: flex-end;
	margin-left: auto;
  }

  .banner-cnt p {
	color: rgba(255, 255, 255, 0.9);
	font-weight: 400;
	font-size: 17px;
	line-height: 26px;
  }
  .banner-cnt p strong {
	font-weight: 700;
  }
  .banner-cnt strong {
	font-weight: 700;
	font-size: 17px;
	text-transform: uppercase;
  }
  .banner-cnt .app-btns {
	margin-top: 3.8rem;
	margin-bottom: 2.4rem;
  }
  .banner-cnt .app-btns a {
	margin-right: 19px;
  }

  .app-btns {
	display: flex;
	align-items: center;
	justify-content: flex-start;
  }
  .app-btns a {
	display: inline-flex;
	transition: 0.45s;
  }
  .app-btns a:hover {
	transform: translateY(-3px);
  }

  .section-title {
	color: #26272d;
	margin: 0 0 15px;
	font-size: 6.4rem;
	line-height: 8rem;
	line-height: normal;
	color: #000;
	position: relative;
  }
  .section-title span,
  .text-blue {
	color: #0068ff;
  }
  .banner-cnt .section-title p {
	font-weight: 900;
	color: #fff;
	font-size: 6.4rem; margin: 0; padding: 0;
	line-height: 7rem;
  }

  .why-us-section {
	padding: 8rem 10rem 4rem 8rem;
	position: relative;
	border-radius: 28px;
	background: #fff url(assets/images/fule-icon-b.png) right 0px no-repeat;
	color: rgba(38, 39, 45, 0.85);
	display: flex;
	justify-content: space-between;
  }
  .why-us-section .lft {
	width: 50%;
	margin-right: 5%;
  }
  .why-us-section .rgt {
	width: calc(100% - 55%);
  }
  .why-us-section .rgt img {
	display: inline-flex;
	bottom: -105px;
	position: absolute;
  }

  .why-us-section ul {
	list-style: none;
	margin: 5rem 0 0;
	padding: 0;
  }
  .why-us-section ul li {
	position: relative;
	margin: 0 0 2.5rem;
	padding: 0 0 0 4.8rem;
  }
  .why-us-section ul li:before {
	width: 32px;
	height: 32px;
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	background: url(assets/images/fule-icon.png) left top no-repeat;
  }
  .why-us-section ul li span {
	color: rgba(38, 39, 45, 0.9);
	font-family: Arial;
	font-size: 2.4rem; line-height: 3rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: -0.28px;
  }
  .why-us-section ul li p {
	margin: 0;
	padding: 0;
	line-height: 2.8rem;
  }

  #how-works .inner-bx {
	margin-top: 8rem;
	margin-bottom: 16rem;
	display: flex;
	justify-content: space-between;
  }
  #how-works .inner-bx .lft {
	width: 35%;
	margin-right: 5%;
  }
  #how-works .inner-bx .rgt {
	width: calc(100% - 45%);
	display: inline-flex;
	justify-content: flex-end;
	align-items: flex-end;
  }
  .how-works-section {
	margin-top: 20rem;
	position: relative;
	z-index: 2;
  }

  .slider-section {
	padding: 50px 0;
	background: rgba(245, 245, 247, 1);
	border-radius: 28px;
	position: relative;
	overflow: hidden;
  }
  .slick-slide {
	transform: scale(0.98);
	transition: all 0.4s ease-in-out;
	padding: 50px 0;
	opacity: 0.2;
  }
  .slick-slide img {
	max-width: 100%;
	transition: all 0.4s ease-in-out;
  }
  .slick-center {
	transform: scale(1.3);
	opacity: 9;
  }
  .slick-slider {
	margin-left: -100px;
	margin-right: -100px;
  }
  .btn-wrap {
	position: absolute;
	right: 140px;
	top: 50%;
	transform: translateY(50%);
	z-index: 9;
  }
  .btn-wrap button {
	background: #0357ee;
	border-radius: 50%;
	cursor: pointer;
	outline: none;
	border: 0;
	width: 36px;
	height: 36px;
  }
  .btn-wrap button.slick-disabled {
	background: #ccc;
  }
  .btn-wrap button.prev-btn {
	margin-right: 10px;
  }

  .service {
	margin-top: -150px;
	margin-bottom: 10.2rem;
	display: flex;
	position: relative;
	z-index: 3;
  }
  .service .card {
	width: calc(30% - 40px);
	margin: 0 20px;
	padding: 3.2rem 6.5rem 9.5rem 3.2rem;
	background: rgba(255, 255, 255, 1);
	border-radius: 28px;
	display: flex;
	flex-direction: column;
  }
  .service .card:nth-of-type(1n) {
	margin-left: 0;
  }
  .service .card:nth-of-type(3n) {
	margin-right: 0;
  }
  .service .card span {
	display: flex;
	padding: 15px 0;
	color: #1d1d1f;
	font-size: 2.5rem;
	font-weight: 700;
	line-height: 3.2rem;
	letter-spacing: 0.196px;
  }
  .service .card p {
	margin: 0;
	padding: 0;
	color: #1d1d1f;
	letter-spacing: -0.374px;
  }

  .details-group {
	background-color: white;
  }
  .details {
	overflow: hidden;
	transition: height 300ms ease-in-out;
	border-bottom: 1px solid #d2d2d7;
  }
  .details__summary,
  .details__content {
	padding: 24px;
	padding-left: 0;
  }
  .details__summary {
	color: #1d1d1f;
	font-size: 2.6rem;
	font-style: normal;
	font-weight: 700;
	line-height: 3.2rem;
	letter-spacing: 0.196px;
	position: relative;
	padding-right: 48px;
	cursor: pointer;
	transition: color 300ms ease-in-out;
	list-style: none;
  }
  [open] > .details__summary {
	color: #0357ee;
  }
  .details__summary::-webkit-details-marker {
	display: none;
  }
  .details__summary:before,
  .details__summary:after {
	content: "";
	position: absolute;
  }
  .details__summary:before {
	right: 20px;
	top: 50%;
	height: 2px;
	margin-top: -1px;
	width: 16px;
	background: #0357ee;
  }
  .details__summary:after {
	right: 28px;
	top: 50%;
	height: 16px;
	margin-top: -8px;
	width: 2px;
	margin-left: -1px;
	background: #0357ee;
	transition: all 300ms ease-in-out;
  }
  [open] .details__summary:after {
	opacity: 0;
	transform: translateY(25%);
  }
  .details__content {
	padding-top: 0;
	padding-right: 48px;
	color: #1d1d1f;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: -0.374px;
  }
  .details__content p {
	padding: 0;
	margin: 0;
	color: #1d1d1f;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 25px; /* 147.059% */
	letter-spacing: -0.374px;
  }

  .fuel-download {
	padding-top: 30.2rem;
	background: #fafafc;
  }
  .fuel-download .inner-bx {
	display: flex;
	justify-content: space-between;
	align-items: center;
  }
  .fuel-download .lft {
	width: 40%;
	margin-right: 5%;
  }
  .fuel-download .rgt {
	width: calc(100% - 45%);
  }
  .fuel-download .app-btns {
	margin-top: 4.4rem;
  }
  .fuel-download .app-btns a {
	margin-right: 21px;
  }
  .fuel-download .section-title {
	font-size: 6.4rem;
	line-height: 7rem;
  }

  .contact-bx {
	padding: 10rem 8rem;
	margin-bottom: -200px;
	background: url(assets/images/fule-bg.jpg) no-repeat;
	border-radius: 28px;
	color: #fff;
	display: flex;
	justify-content: space-between;
	position: relative;
	overflow: hidden;
	background-size: 100%;
	z-index: 2;
  }
  .contact-bx:before {
	width: 100%;
	height: 100%;
	background: hsl(218.55deg 97.51% 47.25% / 96%);
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	z-index: 1;
  }
  .contact-bx .section-title {
	color: #fff;
  }
  .contact-bx h3 {
	margin-bottom: 32px;
	font-size: 6.4rem;
	line-height: 8rem;
	color: transparent;
	background: linear-gradient(
	  97.65deg,
	  #3944ee 1.81%,
	  #ffffff 23.42%,
	  #0b5cef 93.44%
	);
	-webkit-background-clip: text;
	background-clip: text;
  }
  .contact-bx .lft {
	width: 40%;
	margin-right: 5%;
	position: relative;
	z-index: 2;
  }
  .contact-bx .rgt {
	width: calc(100% - 45%);
	position: relative;
	z-index: 2;
  }
  .contact-bx p {
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 16px;
  }
  .contact-bx strong {
	font-size: 15px;
  }

  .form-row {
	display: flex;
	flex-direction: column;
  }
  .form-row p {
    margin: 0;
    padding: 0;
}
  .form-row .form-group {
	width: calc(100% - 40px);
	margin: 0 0 12px;
	padding: 20px 20px;
	border-radius: 10px;
	border: 0;
	outline: 0;
	box-shadow: none;
	background: rgba(255, 255, 255, 1);
	color: rgba(29, 29, 31, 1);
	font-size: 18px;
  }
  .form-row textarea.form-group {
	height: 130px;
	resize: vertical;
  }
  .submit-btn {
	margin-top: 20px;
	text-align: right;
  }
  .submit-btn p{margin: 0; padding: 0;}
  .submit-btn input[type="submit"] {
	min-width: 200px;
	background: rgba(255, 255, 255, 1);
	border-radius: 59px;
	font-size: 18px;
	font-weight: 500;
	line-height: 62px;
	color: rgba(5, 47, 30, 1);
	border: 0;
	outline: none;
	box-shadow: none;
	text-transform: uppercase;
	cursor: pointer;
	transition: 0.45s;
  }
  .submit-btn input[type="submit"]:hover {
	transform: translateY(-3px);
  }
  ::placeholder {
    font-family: Arial;
}
  footer.main-footer {
	background: #fafafc;
	margin: 0;
	padding: 5rem 0 4rem;
	color: #000;
	font-size: 14px;
	text-align: center;
	color: #757575;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
  }
  footer.main-footer .container {
	display: flex;
	justify-content: space-between;
	align-items: normal;
	line-height: 40px;
  }
  footer.main-footer .rgt, footer.main-footer .rgt p {
	display: inline-flex;
	align-items: center;
  }
  footer.main-footer .rgt img {
	margin-left: 10px;
  }
  footer.main-footer .rgt a {
	display: inline-flex;
	transition: 0.45s;
  }
  footer.main-footer .rgt a:hover {
	transform: translateY(-3px);
  }
  .wpcf7-not-valid-tip {
    margin-bottom: 10px;
    color: #fff;
    font-weight: bold !important;
}
.wpcf7 form.invalid .wpcf7-response-output {
    border: none !important;
}
ul#secondary-menu-list {
    display: flex;
    list-style: none;
	margin: 0 auto;
    /* margin-left: 10pc; */
}
ul#secondary-menu-list li {
    padding-right: 15px;}
	ul#secondary-menu-list a {
		color: #757575;
		text-decoration: none;
	}
	ul#secondary-menu-list li a:hover {
		color: #0068ff;
	}
	.type-page {
		padding-top: 40px;
		padding-bottom: 50px;
	}
	h1.entry-title {
		line-height: 6rem;
		font-size: 4.4rem;
		color: #000;
		margin-bottom: 20px;
	}
	article p {
		line-height: 2.8rem;
		color: rgba(38, 39, 45, 0.85);
		margin-bottom: 10px;
	}
  @media only screen and (max-width: 1000px) {
	.container {
	  max-width: 90%;
	}
	/*Navigation CSS*/
.header-inner{height: 70px;}
.main-menu { background:#fff;width:300px;top: 0; left:0%;color: #fff;height:0;position: absolute ;z-index: 9997;/*overflow-y: auto;*/ opacity: 0; visibility: hidden; transition:0.5s;}
.main-menu.active { height:100vh ; top: 0; left: 0;opacity: 1; visibility:visible;}
.main-menu ul{padding: 10rem 0 0; flex-direction: column; justify-content: flex-start; align-items: flex-start;}
.main-menu ul li a {
	font-weight: 600;
    color: rgba(38, 39, 45, 0.65);
    text-decoration: none;
    position: relative;
    font-size: 22px;
    padding: 8px 3rem;
    display: flex
;
}

/*---------------------
HAMBURGER MENU
----------------------*/
header .hamburger-menu{display: flex; justify-content: flex-end; margin-left: auto;margin-top: -18px;}
.hamburger-menu{cursor: pointer;}
.bar,.bar:after,.bar:before {width: 30px;height: 3px;}
.bar {position: relative;transform: translateY(10px);background: #0068ff;transition: all 0ms 300ms; cursor: pointer;}

/*.bar.animate {position: absolute;right: 0;top: 16px;background: rgba(255, 255, 255, 0);z-index: 1;}*/
.bar.animate{background: transparent;}
.bar:before {
content: "";
position: absolute;
left: 0;
bottom: 10px;
background: #0068ff;
transition: bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar:after {
content: "";
position: absolute;
left: 0;
top: 10px;
background: #0068ff;
transition: top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar.animate:after {
top: 0;
transform: rotate(45deg);
transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar.animate:before {
bottom: 0;
transform: rotate(-45deg);
transition: bottom 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

  }
  ul#secondary-menu-list .current-menu-item a {
    color: #0068ff;
}
  .w-100 {width: 100% !important;}
  .current-menu-item{color: #0068ff;}
  @media only screen and (max-width: 800px) {
	ul#secondary-menu-list {
		display: inline-flex;
	}
	footer.main-footer{
		padding: 5rem 0 15rem;
	}
	footer.main-footer .container{
		line-height: inherit;
	}
	.banner-cnt .lft {
		width: 100%;
	}
  	html{font-size: 42%;}
  	body{font-size: 15px; line-height: 26px;}
	.d-column, .service {
	  flex-direction: column;
	}
	header .app-btns{display: none;}
	.service .card{width: auto;box-shadow: 0 0 5px #ccc;margin: 0 auto 3rem;}
	.why-us-section .lft{    margin-right: 0%;}
	.top-section .inner-section{padding-top: 10rem;}
	.banner-cnt{margin-bottom: 10rem;}
	.banner-cnt .rgt{justify-content: center;}
	.banner-cnt .rgt img, .why-us-section .rgt img, #how-works .inner-bx .rgt img, .fuel-download .lft img{width: 100%; height: auto;}
.why-us-section{box-shadow: 0 0 5px #ccc;background-size: 34%;padding: 11rem 3rem 4rem 3rem;}
.why-us-section ul li:before{top: 5px;background-size: 21px;}
.why-us-section .rgt img{position: relative;}
.why-us-section .rgt img{bottom: 0; margin-bottom: -12.5rem; margin-top: 3rem;}
#how-works .inner-bx .rgt{margin-top: 5rem;}
.slick-slider {margin-left: 0;margin-right: 0;}
.slick-slide{padding-top:3rem;}
.slick-center{transform: scale(1);}
.slick-slide img{margin: 0 auto;}
.btn-wrap{right: 43px; top:18px;}
.contact-bx {padding: 8rem 5rem 5rem;background-size: cover;}
.contact-bx .rgt{margin-top: 3rem;}
.submit-btn input[type="submit"]{width: 100%;}
.fuel-download .lft{margin-right: 0;margin-top: 6rem;margin-bottom: 5rem;}
.fuel-download .app-btns, .banner-cnt .app-btns{justify-content: space-between;}
.fuel-download .app-btns a, .banner-cnt .app-btns a{width: 48%; margin: 0;}
.fuel-download .app-btns a img, .banner-cnt .app-btns img{width: 100%; height: auto;}
footer.main-footer{font-size: 15px;}
footer.main-footer .rgt img{width: 50px;}
footer.main-footer .rgt{justify-content: center;}
}