@font-face {
	font-family: 'Mulish';
	src: url(../fonts/mulish/Mulish-Regular.woff2) format('woff2'),
	     url(../fonts/mulish/Mulish-Regular.woff) format('woff'),
	     url(../fonts/Mulish.ttf) format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Mulish';
	src: url(../fonts/mulish/Mulish-Bold.woff2) format('woff2'),
	     url(../fonts/mulish/Mulish-Bold.woff) format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Mulish';
	src: url(../fonts/mulish/Mulish-Italic.woff2) format('woff2'),
	     url(../fonts/mulish/Mulish-Italic.woff) format('woff');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}

body,
td {
	font: 14px "Mulish"
}
.btnPengiriman {
	background-color: red;
}
#totalCart{
	background-color: red;
	color: white;
	margin-left: -1rem;
}
.totalCart{
	/* padding: 8px; */
	color: white;
}
 /* @media (min-width: 768px) and (max-width: 900px) {
.totalCart {
		padding: 0;
	}
 } */
 @media (max-width: 568px) {
/* .totalCart {
		padding: 0;
	} */
 }
.userHeader{
	/* background-color: #FF0100; */
	/* padding: 12px 9px; */
	margin-left: -1rem;
}
.userHeader i{
	color: white;
}
#navbarSupportedContent a{
	color: white;
}
nav #myLoc{padding:0 10px}
.navHorizontalScroll{white-space: nowrap; flex-flow: nowrap; overflow-x: auto; overflow-y: hidden;}
#myLocConfirm{
	color: #ffffff;
}
.homeContainer{
	background-color: #f0f0f0;
}
.marker{
	color: #fff;
}

#currentCityName{
	color: white;
}
.header {
	background-color: #FF0100;
}

.header:hover {
	background-color: #ee4040;
	color: white;
}

.cart {
	background-color:#ff0000;
}
.bg-danger,
.btn-danger {
	background-color: #ff0000 !important;
}

.btn-danger:hover {
	background-color: #920b0f !important;
}

a,
.nav-link {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}
.nav-list {
	padding: 0 10px;
}

.form-control {
	font-size: 13px;
}

.form-control:focus {
	box-shadow: none;
}


.btnAlamat{
background-color: #FF0100;
color: white;
font-weight: bolder;
}
.btnAlamat:hover{
background-color: #dbdbdb;
color: black;
font-weight: bolder;
}

h1,
h2,
h3,
h4,
h5,
h6,
.title,
b,
.fw-bold {
	font-family: "Mulish";
	font-weight: bold !important;
}

.nav-link.active .badge {
	color: black !important;
	background-color: white !important;
}


.sosmed a {
	width: 30px;
	height: 30px;
	display: inline-block;
	margin-right: 5px;
	text-align: center;
}

img {
	max-width: 100%;
}

footer>div {
	background: #122048;
}

footer .col-12 a {
	color: #aaa
}
footer .col-12 a:hover {
	color: rgba(255, 255, 255, 1);
}

footer b {
	color: rgba(237, 33, 36, 1);
	font-size: 1rem;
}

footer b.title{
	display: block;
	padding-bottom: -12px;
}
.sectionFooter{
	margin-bottom: -4px;
	display: block;
	font-size: 14px;
}
footer .footerTittle{
	color: red;
	padding-bottom: 2rem;
}
footer .footerAdress{
	color: #FFF;
	margin-top: 1rem;
}
.ribbon {
	font-size: 12px !important;
	font-weight: 600;
	padding: 4px 0;
	text-align: center;
	width: 150px;
	position: absolute;
	top: 25px;
}

.ribbon.orange {
	background: linear-gradient(90deg, #D72C2D 0%, #F60 100%);
}

.ribbon.blue {
	/* background: linear-gradient(90deg, #FF0100 0%, #010101 100%); */
	/* opacity: .8; */
	background: rgba(1, 1, 1, 1);
}
.col-product .card:hover {
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.15) !important;
}
.col-product .a {
height: 100%;}

.ribbon.right {
	right: -40px;
	transform: rotate(45deg);
}

.ribbon.left {
	left: -40px;
	transform: rotate(-45deg);
}

.ribbon.center {
	width: 100%;
	top: 0;left: 0;
	padding: .7rem 0;
}

.badgeV {
	position: absolute;
	top: 15px;
	left: 15px;
	width: 40px;
	height: 50px;
	background-repeat: no-repeat;
	background-size: cover;
	width: 30px;
	height: 40px;
}

.badgeV.ev {
	background-image: url("../img/badge-ev.svg");
}

.badgeV.ice {
	background-image: url("../img/badge-ice.svg");
}

#homeType .rounded-4 {
	background: linear-gradient(195deg, #fff 21%, #ddd 73%);
}

#homeType .rounded-4 .p-4 {
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: 40%;
	transition: all 0.3s linear;
}

#homeType .col-md-6:first-child:hover>.rounded-4 {
	background: rgb(172, 223, 255);
	background: linear-gradient(187deg,
			rgba(172, 223, 255, 1) 12%,
			rgba(165, 213, 252, 1) 25%,
			rgba(22, 129, 228, 1) 70%,
			rgba(27, 98, 204, 1) 84%);
	color: #fff;
}

#homeType .col-md-6:last-child:hover>.rounded-4 {
	background: rgb(250, 100, 87);
	background: linear-gradient(187deg, rgb(255, 55, 55) 12%, rgba(1250, 100, 87, 1) 25%, rgb(242, 29, 29) 70%, rgb(215, 15, 15) 84%);
}

#homeType .col-md-6:last-child:hover>.btn {
	background: #fff !important;
	transition: all 0.5s ease-out;
	color: #d22027 !important;
}

.backroundImage{
	background-color:rgba(51, 51, 51, .7);
	padding: 1rem 2rem;
}
.hoverRed{
	box-shadow: 2px 2px 6px #333;
	background-color: rgba(128, 128, 128, 0.7);
	backdrop-filter: blur(5px);
}
.hoverRed:hover {
	background-color: rgba(200, 200, 200, 0.7);
}
.hoverRed:hover
.backroundImage{background-color: rgba(148, 147, 147, 0.7);}

#homeType .col-md-6:last-child:hover>.rounded-4,
.hoverRed:hover * {
	color: black !important;
	transition: all 0.5s ease-out;
}

.hoverRed:hover .btn {
	background: #fff !important;
	transition: all .5s ease-out;
	color: #122048 !important;
	border-color: rgb(39, 172, 125);
}

#homeType .rounded-4 .p-4:hover {
	background-size: 42%;
}

.tab-content .bg-light {
	background-color: #f0f4f9 !important;
}

.vbrand {
	font-weight: bold;
	color: #666;
	border-radius: 0px 100px 0px 0px;
	background: rgb(210, 210, 210);
	background: linear-gradient(195deg,
			rgba(240, 240, 240, 1) 21%,
			rgba(210, 210, 210, 1) 47%,
			rgba(247, 247, 247, 1) 49%,
			rgba(227, 227, 227, 1) 73%);
}

.dropend .dropdown-toggle {
	color: salmon;
	margin-left: 1em;
}

/* header.position-sticky {
	backdrop-filter: blur(10px);
	-moz-backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	z-index: 1021;
	background: #010101;
} */


/* Styling dasar untuk header */
/* Styling dasar untuk header */
header.position-sticky {
	backdrop-filter: blur(0px);
	/* Default blur */
	-moz-backdrop-filter: blur(0px);
	-webkit-backdrop-filter: blur(0px);
	background: #1d1d1d;
	z-index: 1021;
	/* Transparan hitam */
	transition: backdrop-filter 0.1s ease, background-color 0.3s ease;
}

/* Tambahkan blur saat class 'scrolled' ditambahkan */
header.position-sticky.scrolled {
	backdrop-filter: blur(10px);
	-moz-backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	background: rgba(44, 45, 46, .5);
	/* Lebih gelap */
}


.nav-link {
	padding: 8px !important;
}
.nav-section {
	padding: 0 45px;
}

.line-active {
	/* width: 101.039px; */
	position: absolute;
	bottom: 10px;
	border-bottom: 1px solid #ffffff;
}

.dropdown-item {
	padding: 10px 20px;
}

.dropdown-item:hover {
	background-color: #ededed;
}

.dropdown .dropdown-menu {
	display: none;
}
.dropdown-menu {
font-size: 13px;
}

.dropdown:hover>.dropdown-menu,
.dropend:hover>.dropdown-menu {
	display: block;
	margin-left: 0.125em;
}

.dropdown-menu {
	border: none;
	background: #fff;
	box-shadow: 5px 20px 10px #ccc;
}

.nav-category .dropdown-menu:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	z-index: -1;
	border-radius: 10px;
}

.card {
	border: 1.5px solid #ededed;
	padding: 0;
}

@media (min-width: 768px) and (max-width: 900px) {
	/* .card {
		width: 15rem;
		padding: 0;
		} */
	
	.card-body {
		padding: 0;
		}

				.col-md-6-5 {
					width: 46%;
				}

				.quantity{
					width: 100rem;
				}
	.card-Checkout{
		width: 15rem;
	}
}
@media screen and (max-width: 900px) {
	.cardProduk {
	border: 1px solid rgb(207, 207, 207);
		margin-left:0;
	}
}
@media screen and (min-width: 900px) {
	.cardProduk {
	border: 1px solid rgb(207, 207, 207);
		margin-left:0;
	}
		.col-md-6-5 {
			width: 56%;
		}
}
.card-body {
	padding: 24px;
}

.dropdown-menu .dropdown-menu li {
	z-index: 2;
}

.card-header {
	border-bottom-color: #eee;
}

.card-footer {
	border-top-color: #eee;
}

label.btn-outline-primary {
	border-color: #dee2e6 !important
}

.passEye {
	color: #ccc;
}

#paymentMethod .modal-content {
	width: 650px;
	height: calc(100vh - 50px);
}

@media screen and (min-width: 769px) {
	.dropend:hover>.dropdown-menu {
		position: absolute;
		top: 0;
		left: 100%;
	}

	.dropend .dropdown-toggle {
		margin-left: 0.5em;
	}
}.lockLogin {
	position: absolute;
	width: 100%;
	z-index: 2;
	background: rgba(0, 0, 0, .3);
	height: 100%;
	text-align: center;
	backdrop-filter: blur(2px);
}

.lockLogin a {
	position: absolute;
	left: calc(50% - 100px);
	top: calc(50% - 50px);
}

.mpic {
	height: 190px;
}

.rt label.checked {
	box-shadow: 0 0.125rem 0.25rem #ff0000 !important;
}

.rt label.disabled {
	filter: grayscale(1);
	background: #eee
}

.rt span.badge-stock {
	background-color: #ffc107;
	padding: 0px 2px !important;
	font-size: 75%;
	font-weight: 700;
}

.rt span.badge-variant {
	background-color: #75e8f4;
	padding: 4px 7px;
	border-radius: 5px;
	font-size: 75%;
	font-weight: 700;
}

.rt img.vpic {
	height: 250px;
	object-fit: contain;
}

.imgContain {
	object-fit: contain}

.badge.onDelivery {border: 1px solid #ff0000;
	background: #ffe9e7;
	display: none;
}
.btn-outline-primary .address {
	color: #777;
}

.btn-check:checked+.btn .address {
	color: #fff;
}
.loadWrapper {
	position: absolute;
	width: 100%;
	z-index: 2;
	background: rgba(255, 255, 255, .3);
	height: 100%;
	text-align: center;
	backdrop-filter: blur(2px);
}

.loadWrapper div {
	position: absolute;
	top: 50%;
	left: 45%;
}
@media screen and (max-width: 767px) {
	.rt img.vpic {
		height: 150px;
		object-fit: contain;
	}
	header .logo {
		max-height: 43px;
		position: relative;
		left: 10px;
		z-index: 999;
	}

	header .text-end {
		position: absolute;
		/* top: 87px; */
		z-index: 2;
		right: 20px;
	}

	.headerCover {
		max-height: 200px;
	}

	.sticky-top {
		padding-top: 0 !important;
	}
}

@keyframes ldio-z651dr57e3c {
	0% {
		top: 96px;
		left: 96px;
		width: 0;
		height: 0;
		opacity: 1;
	}

	100% {
		top: 18px;
		left: 18px;
		width: 156px;
		height: 156px;
		opacity: 0;
	}
}

.ldio-z651dr57e3c div {
	position: absolute;
	border-width: 4px;
	border-style: solid;
	opacity: 1;
	border-radius: 50%;
	animation: ldio-z651dr57e3c 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.ldio-z651dr57e3c div:nth-child(1) {
	border-color: #e60000;
	animation-delay: 0s;
}

.ldio-z651dr57e3c div:nth-child(2) {
	border-color: #ff9e9e;
	animation-delay: -0.5s;
}

.loadingio-spinner-ripple-jmd3cmrekao {
	width: 200px;
	height: 200px;
	display: inline-block;
	overflow: hidden;
	background: none;
}

.ldio-z651dr57e3c {
	width: 100%;
	height: 100%;
	position: relative;
	transform: translateZ(0) scale(1);
	backface-visibility: hidden;
	transform-origin: 0 0;
	/* see note above */
}

.ldio-z651dr57e3c div {
	box-sizing: content-box;
}

.text-gradient {
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: relative;
	z-index: 1;
}

.text-gradient.text-primary {
	background-image: linear-gradient(310deg, #7928ca, #ff0080);
}

.text-gradient.text-info {
	background-image: linear-gradient(310deg, #2152ff, #21d4fd);
}

.text-gradient.text-success {
	background-image: linear-gradient(310deg, #17ad37, #c1e823);
}

.text-gradient.text-warning {
	background-image: linear-gradient(310deg, #f53939, #fbcf33);
}

.text-gradient.text-primary {
	background-image: linear-gradient(310deg, #d60808, #ff6690);
}

.text-gradient.text-dark {
	background-image: linear-gradient(310deg, #141727, #3a416f);
}

@media (max-width: 908px) {
	.navbar.navbar-expand-lg .nav-link {
		padding: 15px 0 !important;
		border-bottom: 1px solid #ddd;
	}

	.navbar-nav {
		height: none !important;
	}
.carousel-control-prev{right: 50px;left: auto;}
		.carousel-control-next,
		.carousel-control-prev{
			top: auto;bottom: 20px;
		}

	/* .dropdown-menu {
		box-shadow: none !important;
	} */

	.vimg {
		height: auto !important;
	}

	.navbar-toggler:focus {
		box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px, rgb(51, 51, 51) 0px 0px 0px 1px;
	}
}

#loaderBlock {
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 9999;
	display: none;
}

#loaderBlock.modalOn {
	background: rgba(255, 255, 255, 0.3);
}

.modal-backdrop {
	opacity: 1 !important;
	backdrop-filter: blur(2px);
	background: rgba(0, 0, 0, 0.5);
}

#loaderBlock .spinner {
	position: fixed;
	top: calc(50% - 100px);
	left: calc(50% - 100px);
	display: none;
}

#loader .progress {
	height: 8px;
	position: absolute;
	width: 100%;
}

.btn-check:disabled+.btn,
.btn-check[disabled]+.btn {
	cursor: not-allowed;
	pointer-events: fill;
}

::-webkit-input-placeholder {
	color: #999 !important;
}

:-moz-placeholder {
	color: #999 !important;
	opacity: 1;
}

::placeholder {
	color: #999 !important;
}

header form .fa-search {
	font-size: 19px;
}

#suggestions 
{
	max-height: calc(100vh - 100px);
	overflow-y: auto;
	top: 1.1rem;
	background: #f8f9fa;
	padding: 1rem;
	display: none;
	position: absolute;
	z-index: 1;
	left:1px;
	padding-top: 30px;
	width: 100%;
}

#suggestionsMobile {
	padding: 1rem;
	height: 35vh;
	overflow: auto;
	background: #f8f9fa;
	display: none;
}

.card-profile {
	background-clip: text;
	cursor: pointer;
}

.dropdown-profile {
	background: white;
	box-shadow: 3px 7px 15px #0000007a;
	width: 350px;
}

@media (max-width: 768px) {
	.dropdown-profile {
		width: max-content;
	}
}

.flashSaleItem {
	background-image: linear-gradient(126deg, rgba(0, 68, 133, 1) 35%, rgba(0, 145, 242, 1) 100%);
}

.fs-title,
.flashSaleItem {
	background: linear-gradient(90deg, #D72C2D 0%, #FF6600 100%);
}

.fs-title>div {
		background-size: cover !important;
	background: url('https://cdn.tdr-hpz.com/images/fs-pattern.png?') left center no-repeat;
}

.new-title,
.bgGradientBlue {
	/* background: linear-gradient(90deg, #FF0100 0%, #010101 100%); */
	background: white;
}

@media (max-width: 576px) {
	.float-start {
		margin-top: 6px;
			font-size: 1rem;
	}
	
	.float-end{
		font-size: .7rem;
		letter-spacing: 0;
		}
}

.new-title>div {
	background: url('https://cdn.tdr-hpz.com/images/new-pattern.png?') center no-repeat;
}

.flashSaleItem span {
	color: #D72C2D;
	font-size: 12px;
}

/** @section ToTop */
.ui-to-top, .btnAffiliate {
	position: fixed;
	right: 15px;
	bottom: 25px;
	z-index: 100;
	width: 50px;
	height: 50px;
	font-size: 20px;
	color: #ffffff;
	background: #ff0000;
	overflow: hidden;
	text-align: center;
	border-radius: 5px;
	text-decoration: none;
	transition: .45s all ease-in-out;
	transform: translate3d(0, 160px, 0);
}

.ui-to-top:hover,
.btnAffiliate:hover {
	color: black;
	background: #dbdbdb;
	text-decoration: none;
}

.ui-to-top:focus,
.btnAffiliate:focus {
	color: #ffffff;
}

.ui-to-top.active ,
.btnAffiliate.active {
	padding-top: 15px;
	transform: translate3d(0, 0, 0);
}

html.mobile .ui-to-top,
html.tablet .ui-to-top ,html.mobile .btnAffiliate,
html.tablet .btnAffiliate {
	display: none !important;
	cursor: not-allowed;
	pointer-events: fill;
}

.skeleton {
	background-color: #e0e0e0;
	border-radius: 4px;
	animation: pulse 1.5s infinite ease-in-out;
}

.skeleton-img {
	width: 100%;
	height: 60px;
	border-radius: 4px;
}

.skeleton-text {
	margin-bottom: 5px;
	border-radius: 4px;
}

.skeleton-price {
	margin-top: 5px;
	border-radius: 4px;
}

.skeleton-btn,
.skeleton-input,
.skeleton-trash {
	background-color: #e0e0e0;
	border-radius: 4px;
}

.skeleton-btn {
	display: inline-block;
	margin-right: 5px;
}

.skeleton-input {
	display: inline-block;
	margin-right: 5px;
}

@keyframes pulse {
	0% {
		background-color: #f0f0f0;
	}

	50% {
		background-color: #e0e0e0;
	}

	100% {
		background-color: #f0f0f0;
	}
}

.selectize-control.single .selectize-input {
	padding: 12px !important;
	border-radius: 8px;
	background: #ffffff !important;
	border: 1px solid #e0e0e0 !important;
}

.selectize-control.single .selectize-input,
.selectize-control.single .selectize-input input {
	font-size: 14px !important;
}

.selectize-dropdown .selected {
	background-color: white !important;
	color: black !important;
}

.selectize-dropdown .active {
	background-color: #ededed !important;
	color: black !important;
}

.selectize-dropdown [data-selectable] {
	padding: 6px 16px;
}

.selectize-dropdown {
	border: 1px solid #ededed !important;
	border-radius: 4px !important;
	top: 30px !important;
}

@media (min-width: 768px) {
	.col-md-3-5 {
		flex: 0 0 auto;
		width: 30%;
	}

	.col-md-9-5 {
		flex: 0 0 auto;
		width: 70%;
	}
}

.btn-new {
	padding: 12px 16px !important;
	border: 1px solid #ededed !important;
	border-radius: 8px !important;
}

.btnTerapkanFilter{
	background-color: #ff0000;
	color: white;
	font-size: 13px;
}

.btn:hover {
	background-color: #ee4040;
	color: white !important;
}

.form-control.variant-qty {
	padding: 0 !important;
	width: 30px !important;
	height: 30px !important;
	border-radius: 8px !important;
	border: 1px solid var(--Neutral-300, #E0E0E0);
	background: var(--Neutral-White, #FFF);
	flex: none !important;
}

.form-control.variant-2 {
	height: 46px !important;
}

.nav.nav-tabs {
	white-space: nowrap;
	flex-flow: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
}

.text-bg-danger {
	color: #D72C2D !important;
	background-color: #F7D5D5 !important;
	border-radius: 6px !important;
}

.flash-sale-countdown {
	padding: 2px 4px;
	border-radius: 100px;
	background: var(--Neutral-White, #FFF);
	color: #D72C2D !important;
	font-size: 11px;
}

.flash-sale-countdown-2 {
	display: flex;
	padding: 4px 8px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	align-self: stretch;
	border-radius: 8px;
	background: var(--Neutral-White, #FFF);
	color: #D72C2D;
}

.page-item .page-link {
	border-radius: 0.5rem !important;
}

.page-item:first-child .page-link {
	border-radius: 0.5rem !important;
}

.page-item:last-child .page-link {
	border-radius: 0.5rem !important;
}

.pagination {
	gap: 0.5em !important;
}

.breadcrumb-item {
	font-size: 14px !important;
}

.breadcrumb-item:hover {
	text-decoration: underline !important;
}

.breadcrumb-item .active:hover {
	text-decoration: none !important;
}

.input-group.merge {
	border-radius: 8px !important;
	border: 1px solid var(--Neutral-300, #E0E0E0) !important;
	background: var(--Neutral-White, #FFF);
}

.badge.warning {
	border-radius: 8px !important;
	border: 1px solid var(--Warning-300, #FFCA98) !important;
	background: #FFFAEB !important;
	padding: 8px 16px;
}

@media (min-width: 768px) and (max-width: 900px) {
.badge.warning {
		padding: 10px;
	}
}
.btn-outline-primary.ver-2 {
	border-radius: 8px !important;
	border: 1px solid var(--Primary-Navy-600, #122048) !important;
}

.fs-18 {
	font-size: 18px !important;
}

.fs-16 {
	font-size: 16px !important;
}

.fs-14 {
	font-size: 14px !important;
}

.fs-12 {
	font-size: 12px !important;
}

.fs-10 {
	font-size: 10px !important;
}


.fw-600,.badge {font-weight: bold;
}

.btn-outline-danger.variant-qty,
.btn-outline-primary.variant-qty {
	border-radius: 5px !important;
	border: 1px solid var(--Neutral-300, #E0E0E0) !important;
	padding:0 10px !important;
	font-size: 10px;
}

.btn-outline-primary.variant-qty:hover {
	background-color: red;
}

.text-bg-success-2 {
	border-radius: 6px;
	background: var(--Primary-Tosca-500, #6CCAB4);
	display: flex;
	padding: 2px 8px;
}

.divider {
	background: #E0E0E0;
	width: 100%;
	height: 0.5px;
	margin: 0.5rem auto;
}

.stepper {
	text-align: center;
}

.stepper-item {
	height: 30px;
	width: 30px;
	border-radius: 100%;
	border: 1px solid #ccc;
	color: #122048;
	display: inline-block
}

.stepper-item.done {
	background-color: #122048;
	border: none;
	color: #fff;
}

.stepper-item i {
	line-height: 27px;
}

.stepper .col-2,
.stepper .col {
	padding: 0;
}

.stepper .line div {
	position: relative;
	border-top: 1px solid #ccc;
	top: 50%;
}

.stepper-item.current,
.stepper .col.done div {
	border-color: #122048;
}

.stepper .step {
	display: none;
}

.stepper .step.active {
	display: block;
}


@media ((min-width: 768px)) {
	.col-md-2-5 {
		width: 22%;
	}
}

.bg-primary {
	background-color: #122048 !important;
}
.sparepartBadge{
	margin-top: .5rem;
}

.bg-danger-2 {
	background-color: #F7D5D5;
	color: #D72C2D;
}

.bg-tosca {
	background-color: #6CCAB4;
	color: white;
}

.bg-success {
	background-color: #039855 !important;
}

.bg-warning {
	background-color: #FF9532 !important;
}

.bg-warning-2 {
	background-color: #ff7c02 !important;
}
.swiper{padding-bottom: 1px !important;}


.badge{line-height: normal;}

.badge {
		line-height: normal;
		white-space: normal;
	}


.hlite{background: yellow;
	font-weight: bold;color: #333;}


.pthumb {
	padding-bottom: 60px !important;
}

.swiper-pagination {
	text-align: left !important;
}

.swiper-slide img {
	display: block;
	width: 100%;
	object-fit: contain;
}
.swiper-slide {
	background-color: rgb(255, 255, 255);
}
.swiper-slide .p-3 {
border-top: 1px solid rgba(188, 188, 188, 0.302);
padding-top: 1rem;
}

.swiper-pagination-bullet-active {
	width: 50px !important;
	border-radius: 5px!important;
	background: #ff0000!important;
}

.swiper-button-next::after,
.swiper-button-prev::after {
	content: none !important;
	display: none !important;
}
.swiper-button-next,
.swiper-button-prev {
	width: 40px;
	height: 40px;
	background: #ff0000;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	bottom: 0;
	top: auto !important;
}

.swiper-button-next span,
.swiper-button-prev span {
	color: #fff;
	font-size: 20px;
}

.swiper-pagination {
	padding-bottom: 20px;
	width: auto !important;
}


.swiper-button-prev {
	right: 60px !important;
	left: auto !important;
}

.swiper-button-next {}

.ellipsis,
.pthumb sup {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 100%;
	box-sizing: border-box;
	text-align: left;
}

.pthumb sup {
	height: 20px
}

.pthumb .thumb {
	/* max-height: 180px; */
	max-height: 100%;
	overflow: hidden;
}

.btnBottom {
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 20px;
	bottom: 20px;
}
 .col-product .rounded-top {
 	width: calc(100% + 2px);
 	top: -1px;
 	left: -1px;
 }

@media (min-width: 768px) {

	.col-lg-custom {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.five-cols .col-lg-custom {
		flex: 0 0 20%;
		max-width: 20%;
	}
}
.card-img,
.card-img-top {
	height: 250px;
	object-fit: contain;}

		.product-clone {
			position: fixed;
			z-index: 9999;
			box-shadow: -3px 5px 10px #999;
			border-radius: 20px;
			background: #fff;
		}
	
		@media(max-width:768px) {
			#cart {
				width: 100%;
				top: 40px;
				left: 20px;
			}
			.card-img,
			.card-img-top {
				height: auto !important;
			}
		}
	
		.location-detail {
			text-wrap: balance;
			font-size: 12px;
		}
	
		.location-detail:hover {
			text-decoration: underline;
		}
	
		.locationCard {
			cursor: pointer;
		}
	
		.locationCard:hover {
			background-color: #d3d3d35e;
		}
	
	
		.flashSaleItem {
			font-size: 13px;
		}
	
		input[type=number]::-webkit-inner-spin-button,
		input[type=number]::-webkit-outer-spin-button {
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;
			margin: 0;
		}
	
		.variant-qty.qty {
			width: 70px !important;
		}
		.variant-qty.qty:focus{
			border: 2px solid black;
		}
	
		.bikeThumb {
			transition: all 0.3s ease-out;
		}
	
		.bikeThumb:hover {
			transform: scale(1.05);
		}
	
		#garage-carousel .btn {
			position: absolute;
			width: calc(100% - 30px);
			bottom: 10px;
		}
	
		#promoBanner a {
			display: block;
		}
	
		#promoBanner img {
			object-fit: cover;
		}
#cookieConsent {
	position: fixed;
	bottom: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	color: #ffffff;
	padding: 20px;
	display: none;
	justify-content: space-between;
	align-items: center;
	z-index: 9000;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
}

#cookieConsent .cookie-text {
	margin: 0;
	flex: 1;
	font-size: 14px;
}

#cookieConsent .cookie-buttons {
	flex-shrink: 0;
}
.applyBtn {
	background: #ff0000 !important;
	border: 1px solid #a70101 !important;
}
@media (max-width: 768px) {
	#cookieConsent {
		flex-direction: column;
		text-align: center;
	}

	#cookieConsent .cookie-buttons {
		margin-top: 10px;
	}

	.item-suggestion {
		cursor: pointer;
	}

	.item-suggestion:hover {
		background-color: #2c3d6b;
		color: white;
	}

	.btn:hover span {
		color: black !important;
	}
		.delivery-info tr:first-child td {
			padding-top: 0;
		}
	.delivery-info td:first-child {
		width: auto !important
	}
	
	.delivery-info td {
		display: inline-block;
			color: #999;
			padding: 15px 5px 5px;
	}
	
	.delivery-info td:last-child {
			display: block;
				text-align: center;
				background: #f5f5f5;
				color: #000;
				border-radius: 5px;
				padding: 10px !important;
	}
}

* {
	transition: all .1s ease;
}

.modal-open {
	padding: 0 !important;
}

.btn{font-size: 12px;
		font-weight: bold;
	}

.taglineService {
	margin-bottom: 1rem !important;
	color: white;
	font-size: 2.5rem;
	text-shadow: 1px 1px 1px #000;
}

.serveText {
	color: #dedede;
	font-size: 1rem;
	text-shadow: 1px 1px 1px #000;
}
.btnAffiliate {
bottom: 70%;
	right: -50px;
	text-align: center;
	line-height: 58px;
	padding-left: 5px;
	border-radius: 10px 0 0 10px;
}
.btnAffiliate.loaded{
	right: 0;
}


@media (min-width: 768px) and (max-width: 900px) {
	.taglineService {
		font-size: 1.7rem;
	}

	.serveText {
		color: #dedede;
		font-size: .8rem;
	}
}
@media (min-width: 768px) {
	.scrolled nav {
		display: none;
	}

	header:hover nav {
		display: block !important;
	}
}
@media (max-width: 576px) {
	.taglineService {
		font-size: 1.5rem;
	}

	.serveText {
		font-size: .7rem;
		padding-bottom: 1rem;
	}

	footer small.taglineFooter{
		padding-bottom: 3rem;
		padding-top: 1rem;
		margin-top: 1rem !important;
	}
}
@media (max-width: 768px) {
	.transType2 {
		display: flex;
	}

	.transType2 .col2 {
		display: flex !important;
		flex: 1 0 0%;
		flex-wrap: wrap;
		padding: .5rem !important;
	}

	.transType2 label {
		flex: 1;
		display: flex !important;
		align-items: center;
		justify-content: space-around;
		padding: 12px 8px !important;
		border: 1px solid #ededed !important;
		border-radius: 8px !important;
		width: 100%;
	}
}