@font-face {
	font-family: 'sansNormal';
	src: url('fonts/FreeSans.woff2') format('woff2');
}
.sans-normal {font-family: 'sansNormal';}

@font-face {
	font-family: 'sansBold';
	src: url('fonts/FreeSansBold.woff2') format('woff2');
}
.sans-bold {font-family: 'sansBold';}

html, body {
	font-family: 'sansNormal', sans-serif;
	font-size: 1rem;
	color: #656565;
	height: 100%;
	overflow: hidden;
}

.wrapper {
	height: 100%;
	overflow: auto;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
}

a {transition: all .3s ease-in-out;}

button:focus, input:focus, select:focus, textarea:focus, .btn:focus, .swiper-button-next {
	outline: none!important;
	box-shadow: none!important;
	text-decoration: none!important;
}

a, button, .btn {border-radius: 0!important;}

.btn-gold {
	background-color: #dba900;
	color: #ffffff;
}
.btn-gold:hover, .btn-gold.active {
	background-color: #a07807;
	color: #ffffff;
}

.breadcrumb-item + .breadcrumb-item::before {
	content: "|";
}

form .form-control {
	border-left-width: 0;
	border-top-width: 0;
	border-right-width: 0;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input[type=number] {
	-moz-appearance: textfield;
}







/*----------------- NAVBAR -----------------*/
.topbar.scroll .navbar {border-bottom: solid 1px #b4b4b4!important;}

.submenu {
	background-color: #f2f2f2;
	padding: .5rem 0;
}
.submenu ul li a {
	width: 100%; 
	text-align: center; 
	display: inline-block;
	padding: .357rem .75rem;
	color: rgba(0,0,0,.5);
	font-family: 'sansBold';
	text-decoration: none;
}
.submenu ul li a:hover {color: rgba(0,0,0,.75);}

.menu-mobile, .menu-mobile hr, .menu-mobile .btn {border-color: #d1d1d1!important;}
.menu-mobile p .btn {
	min-width: 100px;
	color: #878787;
}

.side-menu .ikon {opacity: .5;}
.side-menu:hover .ikon, .side-menu.active .ikon {opacity: 1;}


@media(max-width: 1199.98px) {
	/*.submenu-shop {display: none;}*/
}


@media(min-width: 1200px) {
	.navbar-brand img {
		width: 175px;
		transition: all .15s ease-in-out;
	}
	.topbar.scroll .navbar-brand img {width: 125px;}

	.navbar .cari:hover {
		max-width: 220px!important;
		margin-left: 1rem;
		border-bottom: solid 1px #d1d1d1!important;
	}

	.submenu-filter ul li {
		width: 150px;
		position: relative;
	}
	.submenu-filter ul li .submenu-dropdown {
		position: absolute;
		top: 100%;
		left: 0;
		background-color: #e4e4e4;
		min-width: 150px;
		overflow: hidden;
		min-height: 0;
		max-height: 0;
		transition: all .3s ease-in-out;
	}
	.submenu-filter ul li .submenu-dropdown .submenu-dropdown-body {padding: 1rem .75rem;}
	.submenu-filter ul li:hover .submenu-dropdown {max-height: 480px;}
	.submenu-filter ul li:hover a.submenu-link {
		color: rgb(0,0,0,.75);
		background-color: #e4e4e4;
	}

}





/*----------------- KONTEN -----------------*/
.kolom-motif {
	width: 65px;
	flex-basis: 65px;
}
.motif {
	height: 100%;
	background-image: url(img/motif.svg);
	background-repeat: repeat-y;
	background-position: top;
	background-size: contain;
	opacity: .65;
}

.kolom-konten {
	width: calc(100% - 65px);
	flex-basis: calc(100% - 65px);
	padding-left: 20px;
}
main .kolom-konten {min-height: calc(100vh - 120px);}

header.judul img.pentul {margin-left: -100px;}


.kolom-produk .card {
	background-color: transparent;
	max-width: 223.75px;
	margin-left: auto;
	margin-right: auto;
}
.kolom-produk .card .card-img-top img {mix-blend-mode: multiply;}
.kolom-produk .card .tombol-cart img {filter: invert(1);}
.kolom-produk .card .card-body p.card-title {height: 65px;}
.kolom-produk .card .card-body .tombol-cart,
.kolom-produk .card .card-body .tombol-cart-disabled {
	padding: .15rem .5rem;
	min-width: 100px;
}
@media(max-width: 575.98px) {
	.kolom-produk .card .card-body {padding: 0;}
	.kolom-produk .card .card-body {font-size: .75rem;}
	.kolom-produk .card .card-body h5 {font-size: .9rem;}
	.kolom-produk .card .card-body p.card-title {height: 48px;}
}


@media(min-width: 768px) {
	.kolom-motif {
		width: 85px;
		flex-basis: 85px;
	}

	.kolom-konten {
		width: calc(100% - 85px);
		flex-basis: calc(100% - 85px);
		padding-left: 55px;
	}
}


@media(min-width: 1200px) {
	main .kolom-konten {min-height: calc(100vh - 77.28px);}
}






/*----------------- DASHBOARD USER -----------------*/
.dashboard-user .nav-tabs li {border-bottom: 1px solid #dee2e6;}
.dashboard-user .nav-tabs li a.nav-link, .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	border-left-width: 0;
	border-top-width: 0;
	border-right-width: 0;
	border-bottom: solid 2.5px #ffffff;
	color: rgba(0,0,0,.25);
	text-align: center;
	background-color: transparent;
}
.dashboard-user .nav-tabs li a.nav-link.active {
	color: #151515;
	border-bottom: solid 2.5px #878787;
}
@media(max-width: 575.98px) {
	.dashboard-user .nav-tabs li {width: 50%;}
	.dashboard-user .nav-tabs li a.nav-link {width: 100%;}
}