body {
	font-family: Roboto
}

@media (min-width:1200px) {
	.container {
		width: 1200px !important
	}
}

.aktif {
	display: block !important
}

.overlay {
	background: #000;
	position: fixed;
	top: 93px;
	left: auto;
	height: 100vh;
	width: 100vw;
	opacity: .7;
	z-index: 9999;
	display: none
}

.flex {
	display: flex
}

.invisible {
	opacity: 0
}

.disable-scroll {
	margin-right: 8.5px;
	overflow: hidden
}

.header-top {
	font-size: 11px;
	line-height: 30px;
	height: 30px;
	color: #333
}

.header-top a {
	color: #333
}

.header-top a:hover {
	text-decoration: none
}

.header-top a>span {
	padding: 0 15px
}

.header-top .right a:last-child span {
	padding-right: 0
}

.header-top .left a:first-child span {
	padding-left: 0
}

.header-top .left {
	padding-left: 20px;
	text-align: left
}

.header-top .right {
	text-align: right
}

.header-mid {
	position: relative;
	background: 0 0
}

.header-mid .frame-logo {
	position: relative;
	width: 150px
}

.header-mid .frame-logo #logo {
	position: absolute;
	top: -10px
}

.header-mid .frame-logo #logo2 {
	display: none
}

.header-mid .frame-logo.mobile {
	width: 100%;
	padding: 20px 5px 0 5px
}

.header-mid .frame-logo.mobile img {
	width: 150px
}

.header-mid .frame-logo.mobile p {
	margin-top: 7px;
	color: #707070
}

.pencari {
	position: relative;
	margin-top: 34px;
	padding-top: 0
}

.pencari .back-search {
	display: none
}

.pencari.search-xs {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #fff;
	z-index: 999999;
	left: 0;
	top: 0;
	margin-top: 0;
	padding: 16px
}

.pencari.search-xs .back-search {
	display: block;
	position: absolute;
	width: 23px;
	top: 24px;
	left: 16px
}

.pencari.search-xs .back-search img {
	width: 100%
}

.pencari.search-xs .search {
	margin-left: 12%;
	width: 88%
}

.pencari.search-xs #cari_produk {
	margin-left: 0;
	top: 55px;
	left: 0;
	box-shadow: none;
	border-radius: 0
}

.pencari.search-xs .search {
	border-radius: 5px
}

.pencari.search-xs .search:focus {
	border-radius: 5px
}

.pencari .search {
	border: 0;
	background-color: #f8f8f8;
	box-shadow: none;
	border-radius: 20px;
	border: 1px solid #e1e1e1;
	margin-left: 15px;
	margin-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	height: 38px;
	line-height: 1.21
}

.pencari .search:focus {
	border-radius: 5px 5px 0 0;
	border: 1px solid #e1e1e1
}

.pencari .btn-search {
	position: absolute;
	top: 3px;
	right: -10px;
	background-color: transparent !important;
	color: #ee3125;
	margin-top: -3px;
	border-radius: 0
}

.pencari.search-xs .btn-search {
	position: absolute;
	top: 20px;
	right: 20px
}

.pencari .input-group-addon {
	background-color: transparent;
	border: none
}

#cari_produk {
	display: none;
	position: absolute;
	top: 40px;
	width: 100%;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .16);
	background-color: #fff;
	margin-left: 15px;
	z-index: 9999;
	padding: 8px;
	max-height: 500px;
	overflow: auto;
	border-radius: 0 0 5px 5px
}

#cari_produk h5 {
	font-weight: 600;
	font-size: 16px;
	margin-left: 8px
}

#cari_produk .suggest {
	padding: 5px 8px;
	display: flex;
	color: #555;
	text-decoration: none;
	align-items: center
}

#cari_produk .suggest span {
	margin-left: 10px;
	font-size: 12px
}

#cari_produk .suggest:hover {
	background: #f4f4f4
}

#cari_produk .suggest:last-child {
	border: none
}

#cari_produk .suggest span {
	color: #c4c4c4
}

#cari_produk .suggest-produk {
	display: flex;
	padding: 10px 0;
	color: #555;
	text-decoration: none;
	border-bottom: 1px solid #f4f4f4
}

#cari_produk .suggest-produk:last-child {
	border: none
}

#cari_produk .suggest-produk .detil p {
	max-width: 250px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

#cari_produk .suggest-produk img {
	width: 50px;
	height: 50px;
	margin-right: 10px
}

#cari_produk .suggest-produk span {
	color: #ee3125;
	margin-right: 15px
}

#cari_produk .suggest-produk del {
	color: #ccc
}

#cari_produk .suggest-brand {
	display: flex;
	margin-bottom: 8px
}

.pencari.search-xs #cari_produk .suggest-brand {
	flex-wrap: wrap
}

#cari_produk .suggest-brand a {
	display: block;
	width: 16.6%;
	text-align: center;
	color: #555;
	text-decoration: none
}

.pencari.search-xs #cari_produk .suggest-brand a {
	width: 33.33%;
	margin-bottom: 10px
}

#cari_produk .suggest-brand a img {
	width: 100%;
	padding: 5px 15px
}

.menu-mid {
	margin-top: 33px;
	margin-left: -40px
}

.menu-mid li {
	float: left;
	list-style: none
}

.account {
	position: relative;
	margin-left: 45px;
	font-size: 14px;
	font-weight: 700;
	padding-left: 45px;
	padding-right: 10px;
	height: 60px;
	min-width: 200px
}

.account.signin {
	cursor: pointer
}

.account .icon-user {
	position: absolute;
	background-image: url(../../../images/user.png);
	width: 36px;
	height: 36px;
	left: 0;
	background-size: cover;
	background-position: top
}

.account .say-hay {
	font-weight: 300
}

.account a {
	color: #333
}

.account a:hover {
	text-decoration: none
}

.account .sparator {
	height: 35px;
	border-left: 1px solid #333;
	background: #fff;
	margin-left: 10px;
	margin-right: 5px
}

.account .user-menu {
	position: absolute;
	top: 60px;
	right: 0;
	width: 230px;
	padding: 10px;
	background-color: #fff;
	z-index: 9999;
	display: none;
	border-top: 1px solid #eee;
	border-radius: 0 0 13px 13px;
	font-weight: 300;
	font-size: 12px;
	-webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75);
	-moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75);
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75)
}

.account .user-menu a {
	display: block;
	width: 100%;
	padding: 10px 15px;
	text-align: left;
	transition: .1s
}

.account .user-menu a:hover {
	background-color: #eee;
	border-radius: 10px
}

.account .user-menu a span {
	float: right;
	color: #fff;
	font-weight: 600;
	background: #ee3135;
	padding: 0 5px;
	border-radius: 2px
}

.keranjang {
	position: relative;
	background-image: url(../../../images/icons/nav/shopping-cart.svg);
	background-size: cover;
	width: 36px;
	height: 36px
}

.keranjang .label {
	position: absolute;
	top: -5px;
	right: -5px;
	height: 20px;
	width: 20px;
	background-color: #ee3125;
	color: #fff;
	padding-top: 5px;
	padding-left: 4px;
	border-radius: 100%
}

.cart {
	position: relative;
	font-size: 12px;
	width: 60px;
	height: 60px;
	padding-top: 3px;
	margin-left: 45px
}

.cart .quick-cart {
	position: absolute;
	top: 60px;
	right: -10px;
	width: 380px;
	background-color: #fff;
	z-index: 9999;
	border-top: 1px solid #eee;
	border-radius: 0 0 13px 13px;
	display: none;
	-webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75);
	-moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75);
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .75)
}

.cart .quick-cart .top {
	padding-bottom: 10px;
	border-bottom: 1px solid #cdcdcd;
	margin-bottom: 10px;
	padding: 15px;
	background: #f8f8f8
}

.cart .quick-cart .top a {
	color: #ee3135
}

.cart .quick-cart .bottom {
	padding-top: 10px;
	border-top: 1px solid #cdcdcd;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 15px;
	background: #f8f8f8;
	border-radius: 0 0 13px 13px
}

.cart .quick-cart .bottom span {
	color: #fb9d54;
	font-weight: 700;
	font-size: 16px
}

.cart .quick-cart .list-cart {
	height: 175px;
	overflow: auto;
	padding: 0 15px 0 10px
}

.cart .quick-cart .list-cart .row {
	margin-bottom: 10px
}

.cart .quick-cart .list-cart .row span {
	color: #666
}

.cart .quick-cart .list-cart .row a {
	color: #666
}

.cart .quick-cart .list-cart .row img {
	border: 1px solid #e1e1e1;
	border-radius: 11px;
	padding: 3px
}

.promo-c {
	border-top: 1px;
	border-bottom: 1px
}

.affix {
	background-color: #fff;
	z-index: 999;
	width: 100%;
	top: 0;
	-webkit-box-shadow: 0 2px 10px -4px rgba(0, 0, 0, .75);
	-moz-box-shadow: 0 2px 20px -4px rgba(0, 0, 0, .75);
	box-shadow: 0 2px 10px -4px rgba(0, 0, 0, .75);
	animation: b 1s
}

.affix .header-top,
.affix .teaser {
	display: none
}

.affix .header-mid .frame-logo {
	position: relative;
	width: 150px
}

.affix .header-mid .frame-logo #logo {
	display: none
}

.affix .header-mid .frame-logo #logo2 {
	margin-top: 25px;
	display: block
}

.affix .pencari {
	margin-top: 20px
}

.affix .pencari.search-xs {
	margin-top: 0;
	height: 100vh
}

.affix .header-mid .menu-mid {
	margin-top: 20px
}

.affix .overlay {
	top: 80px
}

.affix .menu-kat {
	display: none
}

.affix:hover .menu-kat {
	display: block
}

.affix+.affix-divider {
	margin-top: 175px
}

@keyframes b {

	0%,
	60%,
	75%,
	90%,
	to {
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}

	0% {
		opacity: 0;
		transform: translate3d(0, -1000px, 0)
	}

	90% {
		transform: translateZ(0)
	}

	to {
		transform: none
	}
}

.logo-slide-one-bar a {
	float: left;
	width: 100%;
	height: 120px;
	border: 1px solid #eee;
	padding: 20px
}

.logo-slide-one-bar a img {
	width: 100%;
	height: 100%
}

.content-box.border {
	padding-bottom: 35px
}

.content-box.border .title-box {
	margin: 0
}

.content-box.gogoflash {
	background-color: #943222;
	background-repeat: no-repeat;
	background-size: cover
}

.content-box.gogoflash .title-box {
	border-bottom: 0;
	padding-top: 10px
}

.content-box.gogoflash .title-box img {
	margin-top: 20px
}

.content-box a {
	color: #ee3125
}

.content-box.border .title-box {
	height: 66px
}

.content-box .title-box {
	border-bottom: 1px solid #d7d7d7;
	text-align: center
}

.content-box .title-box .center {
	text-align: center
}

.content-box .title-box .left {
	text-align: left
}

.content-box .title-box .right {
	float: right;
	text-align: right;
	margin-right: 20px;
	margin-top: -30px
}

.content-box.border .title-box .left {
	text-align: left;
	position: absolute
}

.content-box.border .title-box .right {
	margin-top: 0
}

.content-box .title-box .title-gogoflash {
	font-family: GothamBold !important;
	color: #ffdf4f;
	font-size: 30px;
	margin: 15px 20px;
	height: 36px;
	padding-right: 30px;
	background-image: url(../../../images/flash-icon.png);
	background-position: right;
	background-repeat: no-repeat
}

.content-box .title-box .center .title-border {
	border-bottom: 1px solid #ee3125;
	width: 80px;
	height: 5px;
	margin: auto
}

.content-box .title-box .left .title-border {
	border-bottom: 1px solid #ee3125;
	width: 80px;
	height: 5px
}

.content-box .title-box .right .title-border {
	width: 80px;
	height: 5px
}

.content-box .title-box .right .hidden-xs {
	float: left;
	color: #fff;
	position: relative;
	top: 25px;
	right: 10px
}

.content-box .content {
	padding-top: 20px
}

.content-box .content .frame-banner {
	width: 100%;
	border-radius: 8px
}

.content-box .more-bottom {
	margin-top: 35px;
	width: 100%;
	border-top: 1px solid #e4e4e4;
	position: relative;
	text-align: center
}

.content-box .more-bottom a {
	width: 185px;
	height: 35px;
	border-radius: 100px;
	border: solid 1px #af2175;
	background-color: #fff;
	color: #999;
	position: relative;
	top: -17.5px
}

.content-box .more-bottom a:hover {
	color: #fff;
	background: #af2175;
	text-decoration: none
}

.product-slide .owl-nav {
	display: none
}

.product-slide:hover .owl-nav {
	display: block
}

.product-slide .owl-nav img {
	width: 18px;
	margin-top: 12px;
	margin-left: -5px;
	margin-right: -5px
}

.product-slide .owl-nav .owl-prev {
	width: 30px;
	height: 60px;
	background: rgba(211, 212, 213, .75);
	border-radius: 0 6px 6px 0
}

.product-slide .owl-nav .owl-next {
	width: 30px;
	height: 60px;
	background: rgba(211, 212, 213, .75);
	border-radius: 6px 0 0 6px
}

.box-product {
	display: inline-block;
	outline: 1px solid #e4e4e4;
	padding: 10px 0;
	min-height: 280px;
	position: relative
}

.box-product.col-5 {
	width: 20%
}

.frame-item {
	display: block;
	position: relative;
	padding: 7px 0;
	background: #fff;
	border-block-end-color: #fff;
	border-radius: 13px
}

.frame-item:focus {
	color: transparent !important
}

.frame-item .varian {
	background: #f0f0f0;
	color: #555;
	padding: 3px 5px;
	position: absolute;
	top: 0;
	right: 10px;
	font-size: 10px;
	border-radius: 3px
}

.frame-item.soldout {
	text-decoration: none;
	color: #000
}

.frame-item.soldout .overlay-pro {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 99;
	top: 0;
	border-radius: 13px;
	text-align: center
}

.frame-item.soldout .overlay-pro img {
	display: none;
	width: 80%;
	margin-top: 50%;
	margin-left: 10%;
	transform: rotate(-15deg)
}

.frame-item.soldout .overlay-pro span {
	position: relative;
	top: 130px;
	background: #f4f4f4;
	padding: 5px;
	border-radius: 3px
}

.frame-item:focus,
.frame-item:hover {
	text-decoration: none
}

.frame-item .stamp {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 32px;
	z-index: 99
}

.frame-item .stamp img {
	width: inherit
}

.item-produk {
	width: 150px;
	height: 260px;
	margin: auto
}

.item-produk:hover {
	box-shadow: #333;
	opacity: .7
}

.item-produk:hover .image img {
	margin-left: 3px
}

.item-produk .image {
	height: 150px;
	text-align: center;
	margin-top: 20px
}

.item-produk .image img {
	max-width: 100%;
	max-height: 100%;
	pointer-events: none;
	-webkit-transition: margin-left .3s;
	transition: margin-left .3s
}

.item-produk .detail {
	margin-top: 8px
}

.item-produk .detail .title {
	width: 100%;
	font-size: 14px;
	height: 30px;
	color: #666;
	text-align: center
}

.item-produk .detail .title span {
	height: 39px;
	text-align: center;
	color: #000;
	-webkit-line-clamp: 2;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical
}

.item-produk .detail .amount {
	width: 100%;
	margin-top: 20px;
	text-align: center;
	font-size: 16px;
	color: #ee3125 !important
}

.item-produk .detail .discount {
	display: flex;
	flex-direction: row;
	flex: 1;
	font-size: 14px;
	text-align: center;
	height: 20px
}

.item-produk .detail .discount span {
	margin: auto;
	flex: 0 1 auto
}

.item-produk .detail .discount .real-amount {
	color: #999
}

.item-produk .detail .discount .divider {
	border-left: 1px solid #666;
	margin: 3px 0
}

.item-produk .detail .discount .persen {
	color: #ee3125
}

.item-produk .detail .progress {
	margin-top: 5px;
	margin-bottom: 0;
	height: 6px
}

.item-produk .detail .progress .progress-bar {
	background-color: #fb9d54
}

.item-produk .detail .terjual {
	margin-top: 5px;
	text-align: center;
	font-size: 12px;
	color: #777
}

.newgogoflash .item-produk {
	height: 285px
}

.status-terjual {
	display: none
}

.newgogoflash .status-terjual {
	display: block
}

.count-gogoflash {
	color: #fff;
	font-weight: 700;
	position: relative;
	top: 10px
}

.count-gogoflash .part {
	border-radius: 4px;
	background-color: #fff;
	padding: 6px;
	margin: 5px;
	font-size: 20px;
	color: #ee3135
}

.count-gogoflash .sp {
	padding-top: 15px
}

.promo-kode-kupon {
	background: linear-gradient(to right, #1681fa 0, #e52cf9 100%)
}

.promo-kode-kupon .left {
	border-right: 3px solid #fff;
	border-style: dashed;
	text-align: center;
	padding: 25px 0
}

.promo-kode-kupon .left .title {
	font-size: 23px;
	font-weight: 700;
	font-style: italic;
	color: #fc0
}

.promo-kode-kupon .left .snk {
	color: #fff;
	font-size: 16px
}

.promo-kode-kupon .left .snk span {
	font-size: 8px
}

.promo-kode-kupon .right {
	padding: 33px 100px;
	text-align: center
}

.promo-kode-kupon .right .frame-kode-kupon {
	border: 1px solid #fff;
	border-radius: 4px;
	padding: 10px;
	color: #fff;
	font-size: 14px
}

.promo-kode-kupon .right .frame-kode-kupon span {
	font-weight: 700;
	cursor: pointer;
	margin-left: 30px;
	font-size: 16px
}

#bawah {
	margin-top: 60px
}

#bawah .frame-contact {
	background-color: #efeeec;
	height: 80px;
	padding: 15px;
	border-radius: 2px;
	border-left: 5px solid #fff;
	border-right: 5px solid #fff
}

#bawah .frame-contact.first {
	border-left: 0
}

#bawah .frame-contact.last {
	border-right: 0
}

#bawah .frame-contact .img-contact {
	border: 2px solid #ee3125;
	border-radius: 100%;
	width: 50px;
	height: 50px;
	background-color: #fff;
	margin-right: 15px
}

#bawah .frame-contact .img-contact img {
	margin-top: 7px;
	margin-left: 7px;
	width: 33px;
	height: 33px
}

#bawah .frame-contact .detail {
	margin-top: 2px
}

#bawah .frame-contact .detail .title {
	font-weight: 600;
	font-size: 18px;
	color: #ee3125
}

#bawah .frame-contact .detail .contact {
	font-size: 14px;
	color: #000
}

#bawah .frame-contact .detail .contact a {
	color: #000
}

#footer {
	padding-top: 45px;
	padding-bottom: 45px;
	background-color: #2a2a2a;
	background-repeat: no-repeat;
	background-size: 120%;
	background-position: center;
	border-top: 8px solid #ee3135
}

#footer .sector1.about {
	padding: 0 16px
}

#footer .sector1.about img {
	margin-bottom: 10px;
	width: 80%
}

#footer .sector1 .title {
	font-family: Roboto;
	margin-bottom: 20px;
	font-size: 16px;
	color: #fff;
	font-weight: 700
}

#footer .sector1 .title:last-child {
	margin-top: 10px
}

#footer .sector1 p {
	color: #e6e6e6;
	font-size: 16px
}

#footer .sector1 .input-groups {
	display: flex;
	border: 0;
	background: #fff;
	border-radius: 20px;
	height: 35px
}

#footer .sector1 .input-groups input {
	border: 0;
	background: 0 0;
	width: 100%;
	height: 33px
}

#footer .sector1 .input-groups .input-groups-addon {
	border-radius: 0 4px 4px 0;
	color: #fff;
	background-color: #ee3135;
	width: 80px;
	height: 35px;
	margin-right: -6px;
	padding: 0
}

#footer .sector2 {
	margin-top: 40px
}

#footer .sector2 .title {
	font-family: Roboto;
	margin-bottom: 20px;
	font-size: 16px;
	color: #fff;
	font-weight:700;
}

#footer .sector3 .title {
	font-family: Roboto;
	margin-bottom: 20px;
	color: #fff;
	font-size: 16px;
	font-weight: 600
}

#footer .sector3 ul {
	margin-left: -40px
}

#footer .sector3 ul li {
	list-style: none;
	font-size: 16px;
	margin-bottom: 5px
}

#footer .sector3 ul li a {
	color: #fff;
	text-decoration: none
}

#footer .followme a {
	width: 36px;
	height: 36px;
	font-size: 14px;
	text-align: center;
	padding: 0;
	padding-top: 8px;
	border-radius: 100%;
	margin-right: 10px;
	color: #ccc
}

#footer .followme a:last-child {
	margin-right: 0
}

.footnote {
	background-color: #fff;
	margin-bottom: 0;
	border-bottom: 0;
	padding: 30px 0
}

.footnote a {
	color: #9b9b9b
}

.footnote a:hover {
	color: #9b9b9b
}

.footnote h4 {
	font-size: 16px;
	color: #9b9b9b;
	font-weight: 700
}

.footnote p {
	font-size: 13px;
	color: #9b9b9b;
	margin-bottom: 20px
}

.footer {
	background-color: #fff;
	padding: 15px 0;
	color: #9b9b9b;
	border-top: 1px solid #d7d7d7;
	font-size: 12px
}

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

.footer .container div {
	width: 100%
}

.footer .container div:last-child {
	text-align: right
}

.footer a {
	color: #6492bf
}

.method-type {
	font-family: Roboto;
	font-size: 14px;
	font-weight: 600;
	color: #808284;
	margin-bottom: 10px
}

.payment-list {
	position: relative
}

.payment-list .ic-payment {
	display: inline-block;
	width: 60px;
	height: 33px;
	padding: 5px;
	background: #fff;
	text-align: center;
	align-items: center;
	justify-content: center;
	border-radius: 2px;
	border: solid 1px #e0dbdb;
	margin-right: 7px;
	margin-bottom: 7px
}

.payment-list .ic-payment img {
	max-width: 100%;
	max-height: 100%
}

.ic {
	display: inline-block;
	width: 20px;
	height: 20px;
	background-size: 20px;
	margin-right: 5px
}

.ic-like {
	background-image: url(../../../images/icons/like.png)
}

.ic-user-profile {
	background-image: url(../../../images/icons/user-profile.png)
}

.ic-list {
	background-image: url(../../../images/icons/list.png)
}

.ic-mail {
	background-image: url(../../../images/icons/mail.png)
}

.ic-logout {
	background-image: url(../../../images/icons/logout.png)
}

.form-control:focus {
	box-shadow: none;
	border-color: #f03428
}

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

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn.focus:active,
.btn:active:focus,
.btn:focus {
	outline: 0 !important;
	outline-offset: 0 !important;
	background-image: none !important;
	-webkit-box-shadow: none !important;
	box-shadow: none !important
}

.btn-orange {
	padding: 10px;
	background-color: #f60;
	color: #fff;
	font-weight: 600;
	min-width: 150px
}

.btn-orange:focus,
.btn-orange:hover {
	color: #fff
}

.modal .modal-dialog-new {
	width: 30% !important;
	margin-top: 200px
}

.modal .modal-dialog-new .modal-content {
	background-color: rgba(0, 0, 0, .5) !important
}

.modal .modal-dialog-new .modal-content .modal-header {
	color: #fff;
	font-weight: 600;
	border: none !important
}

.modal .modal-dialog-new .modal-content .modal-footer {
	text-align: center;
	border: none !important
}

.modal .modal-dialog-new .modal-content .modal-footer .next-buy {
	padding: 5px 30px;
	text-align: center;
	background-color: #f90;
	color: #fff;
	font-size: 12px;
	text-decoration: none;
	border-radius: 3px
}

.modal .modal-dialog-new .modal-content .modal-footer .to-cart {
	padding: 5px 30px;
	text-align: center;
	background-color: #ee3125;
	color: #fff;
	margin-left: 30px;
	font-size: 12px;
	text-decoration: none;
	border-radius: 3px
}

.modal#detailBelanja .modal-dialog {
	max-width: 600px;
	margin: 10px auto
}

.modal#detailBelanja .modal-dialog .modal-content .modal-body {
	color: #999;
	max-height: 550px;
	overflow-y: scroll
}

.count-down {
	display: flex;
	text-align: center
}

.list-product {
	text-align: center;
	margin-top: 40px
}

.list-product.left {
	text-align: left
}

.list-product.shareit {
	margin-top: 70px
}

.list-product .frame-item {
	display: inline-block;
	width: 16.3%;
	background-color: #fff;
	margin-bottom: 5px
}

.list-product.with-sidebar {
	margin-top: 0
}

.list-product.with-sidebar .frame-item {
	width: 19.6%
}

.product-gift .frame-product-gift {
	position: relative;
	background: #fff;
	border-radius: 5px;
	font-size: 10px;
	cursor: pointer;
	border: 5px solid #f90;
	text-align: center
}

.product-gift .frame-product-gift.soldout {
	pointer-events: none;
	cursor: default;
	text-decoration: none
}

.product-gift .frame-product-gift .overlay-pro {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, .5);
	color: #fff;
	text-align: left;
	padding: 10px;
	word-wrap: break-word
}

.product-gift .frame-product-gift img {
	max-width: 100% !important;
	max-height: 100% !important
}

.product-gift .frame-product-gift h4 {
	font-size: 12px;
	color: #af2175;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin: 0
}

.product-gift .frame-product-gift button {
	position: relative;
	bottom: -5px;
	background: #af2175;
	color: #fff;
	border-radius: 0;
	padding: 3px 20px;
	font-size: 10px
}

.product-gift .frame-product-gift button:focus {
	background: #af2175;
	color: #fff
}

.product-gift .frame-product-gift .modal-footer .next-buy {
	display: none
}

.product-gift .frame-product-gift .modal-footer .to-cart {
	display: block;
	padding: 5px;
	background: #ee3125;
	color: #fff;
	text-align: center;
	border-radius: 3px;
	margin-top: 9px
}

.btn.btn-loadmore {
	background: #fff;
	color: #ee3125;
	padding: 10px 50px;
	margin: auto;
	border: 1px solid #ee3125;
	border-radius: 50px
}

.overlay-waiting {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, .9);
	z-index: 999999999;
	cursor: pointer
}

.overlay-waiting .text {
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 110%;
	color: #fff;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	background: #fff;
	padding: 50px 30px 20px 30px;
	color: #666;
	border-radius: 10px;
	font-weight: 600;
	background-image: url(../../../images/icons/loading.svg);
	background-size: 30%;
	background-position: center 10%;
	background-repeat: no-repeat
}

.overlay-waiting .text::after {
	content: 'Mohon Tunggu'
}

.breadcrumb {
	padding: 15px 0;
	font-size: 12px
}

.breadcrumb a {
	color: #ee3125;
	text-decoration: none
}

.sidebar-left {
	border: 1px solid #e4e4e4;
	padding: 20px 16px;
	margin-right: 30px;
	border-radius: 10px;
	-webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .75);
	-moz-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .75);
	box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .75)
}

.sidebar-left .title {
	display: block;
	cursor: pointer;
	font-size: 16px;
	color: #f60;
	font-weight: 700;
	margin-bottom: 10px;
	background-image: url(../../../images/icons/up-arrow-black.svg);
	background-image: url(../../../images/icons/up-arrow-black.svg);
	background-position: right;
	background-repeat: no-repeat;
	background-size: 10px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px
}

.sidebar-left .title.tutup {
	background-image: url(../../../images/icons/down-arrow.svg)
}

.sidebar-left ul {
	padding: 0;
	max-height: 300px;
	overflow: auto;
	padding-right: 10px
}

.sidebar-left ul:last-child {
	border: 0;
	margin-bottom: 0
}

.sidebar-left ul li {
	list-style: none;
	font-weight: 600
}

.sidebar-left ul li ul.sub-list {
	padding: 0;
	max-height: 1000px;
	margin-left: 10px
}

.sidebar-left ul li ul.sub-list li {
	font-weight: 300;
	cursor: pointer !important
}

.sidebar-left .list li a {
	display: block;
	line-height: 27px;
	color: #000;
	text-decoration: none;
	background-size: 12px;
	padding-right: 15px;
	cursor: pointer
}

.sidebar-left .list a.active {
	color: #ee3125
}

.sidebar-left ul::-webkit-scrollbar {
	width: 5px
}

.sidebar-left ul::-webkit-scrollbar-track {
	background: 0 0
}

.sidebar-left ul::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background: #888
}

.sidebar-left .cariBrand {
	width: 100%;
	padding-left: 30px;
	margin-bottom: 10px;
	height: 40px;
	border: 1px solid #e4e4e4;
	border-radius: 3px;
	background-image: url(../../../images/icons/loupe.svg);
	background-position: 5px 7px;
	background-repeat: no-repeat;
	background-size: 20px
}

.sidebar-left .max-min {
	width: 100%;
	padding: 10px;
	margin-bottom: 10px;
	border: 1px solid #e4e4e4;
	border-radius: 3px
}

.sidebar-left .header-sidebar-mb {
	display: none
}

.result-filter {
	padding: 10px 0;
	display: flex;
	border-bottom: 1px solid #e4e4e4;
	margin-bottom: 10px
}

.result-filter label {
	margin-top: 5px;
	min-width: 100px
}

.list-filter {
	position: relative;
	max-width: 100%;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
	margin-left: 0;
	padding-left: 0;
	padding-bottom: 5px
}

.list-filter li {
	position: relative;
	color: #555;
	margin-top: 0;
	margin-right: 10px;
	border: 1px solid #ccc;
	border-radius: 20px;
	padding: 5px 5px 5px 15px;
	text-decoration: none;
	display: inline-block
}

.list-filter li span {
	margin-right: 10px
}

.list-filter li a {
	position: absolute;
	color: #000;
	font-size: 20px;
	right: 8px;
	top: 8px;
	text-decoration: none;
	width: 15px;
	height: 15px;
	background-image: url(../../../images/remove.svg)
}

.list-filter li:last-child {
	padding-right: 15px;
	background: #ee3125;
	color: #fff;
	border: 0
}

.list-filter li:last-child a {
	position: static;
	font-size: 14px;
	color: #fff;
	background-image: none
}

.list-filter::-webkit-scrollbar {
	height: 5px;
	width: 3px
}

.list-filter::-webkit-scrollbar-track {
	background: 0 0
}

.list-filter::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background: #ccc
}

.modal-dialog {
	max-width: 660px;
	border-radius: 10px;
	min-height: 200px;
	margin-top: 80px
}

.close {
	font-size: 36px
}

.modal-header {
	text-align: center;
	border-bottom: 0
}

.scrollbar {
	height: 100%;
	padding-right: 5px;
	position: relative;
	overflow-y: scroll
}

.scrollbar::-webkit-scrollbar {
	width: 5px
}

.scrollbar::-webkit-scrollbar-track {
	background: 0 0
}

.scrollbar::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background: #888
}

.scrollbar.h-60vh {
	max-height: 60vh
}

.snackbar {
	visibility: hidden;
	min-width: 250px;
	margin-left: -125px;
	background-color: #333;
	color: #fff !important;
	text-align: center;
	border-radius: 2px;
	padding: 16px;
	position: fixed;
	z-index: 1;
	left: 50%;
	bottom: 30px;
	font-size: 17px
}

.snackbar.show {
	visibility: visible;
	-webkit-animation: fadein .5s, fadeout .5s 2.5s;
	animation: fadein .5s, fadeout .5s 2.5s
}

.dropdown-ggb .dropdown-menu {
	right: 0;
	left: auto;
	font-size: 12px;
	min-width: 300px
}

.dropdown-ggb .dropdown-menu li a {
	text-transform: capitalize;
	display: flex;
	justify-content: space-between;
	cursor: pointer
}

.dropdown-ggb .btn {
	background: #09f;
	color: #fff
}

.hmbeger {
	display: none
}

.hmbeger div {
	width: 25px;
	height: 3px;
	background-color: #555;
	margin: 6px 0;
	border-radius: 5px
}

.hmbeger div:first-child {
	width: 15px
}

.affix .hmbeger div {
	background-color: #555
}

@-webkit-keyframes fadein {
	from {
		bottom: 0;
		opacity: 0
	}

	to {
		bottom: 30px;
		opacity: 1
	}
}

@keyframes fadein {
	from {
		bottom: 0;
		opacity: 0
	}

	to {
		bottom: 30px;
		opacity: 1
	}
}

@-webkit-keyframes fadeout {
	from {
		bottom: 30px;
		opacity: 1
	}

	to {
		bottom: 0;
		opacity: 0
	}
}

@keyframes fadeout {
	from {
		bottom: 30px;
		opacity: 1
	}

	to {
		bottom: 0;
		opacity: 0
	}
}

.menu-sorcut {
	display: none
}

.statifaction {
	display: flex;
	padding: 30px 25px;
	margin-top: 60px;
	margin-bottom: 40px;
	box-shadow: 0 1px 3px #00000029;
	border: 1px solid #e1e1e1;
	border-radius: 4px
}

.statifaction .item-statifaction {
	display: flex;
	border-right: 1px solid#e2e2e2;
	width: 100%;
	align-items: center;
	justify-content: center;
	padding: 0 25px
}

.statifaction .item-statifaction:last-child {
	border: none
}

.statifaction .item-statifaction img {
	width: 65px;
	height: 65px;
	margin-right: 15px
}

.statifaction .item-statifaction h5 {
	font-family: GothamMedium !important;
	font-size: 16px;
	color: #000;
	font-weight: 700;
	margin-top: 0;
	margin-bottom: 5px;
	letter-spacing: 1px
}

.statifaction .item-statifaction span {
	font-size: 16px;
	color: #999
}

.parallax-compro {
	background-image: url(../../../images/b2b-web-compro/bg-all-toko-small.jpg);
	height: 200px;
	color: #fff;
	font-size: 18px;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 25px
}

.parallax-compro .btn {
	background: #ff8c00;
	color: #000;
	font-weight: 600;
	font-size: 20px;
	border-radius: 30px;
	padding: 10px 30px;
	margin-bottom: 20px
}

@media (min-width:993px) and (max-width:1200px) {
	.account {
		margin-left: 20px
	}

	.cart {
		margin-left: 20px
	}

	.affix-top {
		padding-bottom: 0
	}

	.header-top .left {
		padding: 0
	}

	.header-mid .frame-logo {
		margin-top: 10px;
		width: 140px
	}

	#bawah .frame-contact .detail .title {
		margin-top: 3px;
		font-size: 14px
	}

	.payment-list .ic-payment {
		width: 60px;
		height: 30px
	}

	.list-product .frame-item {
		display: inline-block;
		width: 16.1%
	}

	.list-product.with-sidebar .frame-item {
		width: 24.7%
	}

	.modal .modal-dialog-new {
		width: 50% !important;
		margin-top: 25%
	}
}

@media (min-width:768px) and (max-width:992px) {

	.menu-mid,
	.pencari {
		margin-top: 15px
	}

	.pencarian input {
		border: 1px solid #000
	}

	.header-mid .frame-logo {
		width: 120px
	}

	.account {
		margin-left: 10px
	}

	.cart {
		margin-left: 0
	}

	.account .in_reg {
		font-size: 12px
	}

	.account .say-hay {
		margin-top: 5px;
		font-size: 12px
	}

	.account .say-hay:after {
		visibility: visible;
		display: block
	}

	.account .username {
		width: 60px;
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 12px
	}

	.affix .header-mid .frame-logo {
		width: 120px
	}

	.affix .menu-mid,
	.affix .pencari {
		margin-top: 20px
	}

	.overlay {
		top: 0;
		margin-top: 105px
	}

	.affix .overlay {
		margin-top: 80px
	}

	.nav.navbar-nav li {
		padding-right: 0;
		font-size: 12px
	}

	.promo-kode-kupon .left {
		border: 0;
		border-bottom: 3px solid #fff;
		border-style: dashed
	}

	#bawah .frame-contact .img-contact {
		display: none
	}

	#bawah .frame-contact .detail .title {
		font-size: 14px
	}

	.modal .modal-dialog-new {
		width: 90% !important;
		margin: auto;
		margin-top: 20%;
		background: rgba(0, 0, 0, 0)
	}

	.modal .modal-dialog-new .modal-footer {
		padding-left: 5px;
		padding-right: 5px
	}

	.list-product .frame-item {
		display: inline-block;
		width: 19.5%
	}

	.list-product .frame-item,
	.list-product.with-sidebar .frame-item {
		width: 24.7%
	}
}

@media (min-width:489px) and (max-width:767px) {
	.hmbeger {
		display: block
	}

	.header-mid .frame-logo #logo,
	.header-mid .frame-logo #logo2 {
		display: none
	}

	.nav-mobile {
		display: flex;
		padding-bottom: 5px;
		-webkit-box-shadow: 0 2px 10px -7px rgba(0, 0, 0, .75);
		-moz-box-shadow: 0 2px 20px -7px rgba(0, 0, 0, .75);
		box-shadow: 0 2px 10px -7px rgba(0, 0, 0, .75)
	}

	.nav-mobile .ic-cart {
		width: 82px;
		margin-top: 12px
	}

	.pencari {
		margin: 0;
		height: 35px;
		width: 100%;
		margin-top: 10px
	}

	.affix .frame-logo {
		display: none
	}

	.affix+.affix-divider {
		margin-top: 54.5px
	}

	.affix .nav-mobile {
		display: flex;
		padding-bottom: 5px;
		-webkit-box-shadow: 0;
		-moz-box-shadow: 0;
		box-shadow: 0
	}

	.affix .pencari {
		margin-top: 10px
	}

	.bar-tri {
		margin-top: 3px;
		width: 62px;
		height: 100%;
		position: relative;
		padding: 15px
	}

	.bar-tri span:first-child {
		margin-top: 2.5px
	}

	.bar-tri span {
		display: block;
		width: 100%;
		height: 2px;
		margin-top: 4px;
		background-color: rgba(0, 0, 0, .54);
		border-radius: 4px
	}

	.content-box.border.gogoflash {
		border-radius: 0;
		background: #af2175;
		background-image: url(../../../images/template-gogo-flash.jpg)
	}

	.content-box.border.gogoflash .title-box {
		height: auto;
		border-bottom: 0
	}

	.content-box.border.gogoflash .center {
		text-align: right
	}

	.content-box.border.gogoflash .owl-item {
		background: #fff
	}

	.content-box .title-box .title-gogoflash {
		color: #fff;
		font-size: 16px;
		margin: 18px 0 0 10px;
		height: 16px
	}

	#footer .sector3 .title {
		margin-top: 20px
	}
}

@media only screen and (max-width:480px) {
	.overlay {
		top: 0
	}

	.hmbeger {
		display: block
	}

	.header-mid .frame-logo #logo,
	.header-mid .frame-logo #logo2 {
		display: none
	}

	.nav-mobile {
		display: flex;
		padding: 0 16px;
		-webkit-box-shadow: 0 2px 10px -7px rgba(0, 0, 0, .75);
		-moz-box-shadow: 0 2px 20px -7px rgba(0, 0, 0, .75);
		box-shadow: 0 5px 10px -7px rgba(0, 0, 0, .75);
		height: 54.5px;
		align-items: center;
		justify-content: space-between;
		background: #fff
	}

	.nav-mobile .logo-nav {
		display: block;
		width: 100%;
		margin-right: 10px
	}

	.nav-mobile .ic-cart {
		width: 82px;
		margin-top: 12px
	}

	.nav-mobile .ic-chat {
		width: 32px;
		height: 32px;
		background: url(../../../images/icons/chat-2.svg);
		background-size: cover
	}

	.pencari {
		margin: 0;
		height: 35px;
		width: 100%;
		margin-right: 10px
	}

	.pencari .search {
		margin-left: 0;
		height: 34px
	}

	.pencari .btn-search {
		right: 0
	}

	.affix .pencari {
		margin-top: 0
	}

	.affix .frame-logo {
		display: none
	}

	.affix+.affix-divider {
		margin-top: 54.5px
	}

	.bar-tri {
		margin-top: 3px;
		width: 62px;
		height: 100%;
		position: relative;
		padding: 15px
	}

	.bar-tri span:first-child {
		margin-top: 2.5px
	}

	.bar-tri span {
		display: block;
		width: 100%;
		height: 2px;
		margin-top: 4px;
		background-color: rgba(0, 0, 0, .54);
		border-radius: 4px
	}

	.content-box .title-box .left {
		margin-left: 16px
	}

	.content-box.border .title-box {
		background: 0 0
	}

	.content-box.border .title-box .left {
		position: relative
	}

	.content-box.border .title-box .right {
		position: relative;
		top: -20px;
		margin-right: 10px
	}

	.content-box.gogoflash {
		margin-bottom: 20px
	}

	.content-box.border.gogoflash .title-box {
		height: auto;
		border-bottom: 0
	}

	.content-box.gogoflash .title-box img {
		margin-top: 10px;
		width: 50%
	}

	.content-box.border.gogoflash .center {
		text-align: right
	}

	.content-box .title-box .title-gogoflash {
		color: #fff;
		font-size: 16px;
		margin: 18px 0 0 10px;
		height: 16px;
		background-image: none
	}

	.promo-kode-kupon .left {
		border-right: 0;
		border-bottom: 3px solid #fff;
		border-style: dashed;
		padding-bottom: 25px
	}

	.promo-kode-kupon .left .title {
		font-size: 16px
	}

	.promo-kode-kupon .left .snk {
		font-size: 12px
	}

	.promo-kode-kupon .right {
		padding: 13px 10px
	}

	.modal .modal-dialog-new {
		width: 95% !important;
		margin: auto;
		margin-top: 50%;
		background: rgba(0, 0, 0, 0)
	}

	.modal .modal-dialog-new .modal-footer {
		padding-left: 5px;
		padding-right: 5px
	}

	.modal .modal-dialog-new .modal-content .modal-footer .next-buy,
	.modal .modal-dialog-new .modal-content .modal-footer .to-cart {
		padding: 10px 30px
	}

	#bawah .frame-contact.first {
		border-left: 5px solid #fff
	}

	#bawah .frame-contact.last {
		border-right: 5px solid #fff
	}

	#bawah .frame-contact {
		margin: 0
	}

	#footer {
		padding-top: 5px;
		padding-left: 16px;
		padding-right: 16px
	}

	#footer .sector1,
	#footer .sector2,
	#footer .sector3 {
		margin-top: 20px
	}

	#footer .sector3 .title {
		font-family: Roboto;
		margin-top: 20px;
		font-weight: 700;
	}

	#footer .sector1.about {
		padding: 5px;
		text-align: center
	}

	.footer {
		font-size: 10px !important;
		padding: 15 20px
	}

	.footer .container {
		flex-wrap: wrap
	}

	.footer .container div {
		text-align: center !important
	}

	.footnote {
		padding: 16px !important
	}

	.payment-list .ic-payment {
		width: 60px;
		height: 30px;
		padding: 5px
	}

	.count-gogoflash {
		color: #fff;
		position: absolute;
		font-weight: 700;
		top: -5px;
		right: 0
	}

	.count-gogoflash .part {
		border-radius: 4px;
		background-color: #fff;
		padding: 4px;
		margin: 5px;
		font-size: 10px;
		color: #ee3135
	}

	.count-gogoflash .sp {
		padding-top: 5px
	}

	.item-produk .image {
		margin-top: 10px
	}

	.payment-list .ic-payment {
		width: 60px;
		height: 30px;
		padding: 5px
	}

	.list-product {
		width: 100%;
		position: relative;
		background: #eee
	}

	.list-product .frame-item,
	.list-product.with-sidebar .frame-item {
		display: inline-block;
		width: 49%;
		background: #fff;
		margin-bottom: 3px
	}

	.breadcrumb {
		margin-left: 16px
	}

	.menu-sorcut {
		position: fixed;
		bottom: 0;
		left: 0;
		display: flex;
		z-index: 99;
		height: 58px;
		box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, .1);
		background: #fff;
		width: 100%;
		align-items: flex-end
	}

	.menu-sorcut .item {
		width: 20%;
		padding: 8px 0;
		text-align: center;
		text-decoration: none;
		color: #555
	}

	.menu-sorcut .item.active {
		color: #ee3125
	}

	.menu-sorcut .item img {
		width: 24px;
		height: 24px
	}

	.menu-sorcut .item span {
		font-size: 12px;
		display: block;
		color: #555
	}

	#shorcutChat {
		display: none !important
	}

	.sidebar-left {
		display: none;
		position: fixed;
		padding: 70px 20px 20px 20px;
		z-index: 99999;
		background: #fff;
		border-radius: 0;
		box-shadow: none;
		border: 0;
		width: 100%;
		overflow: auto;
		height: 100vh;
		top: 0;
		font-size: 110%
	}

	.sidebar-left .header-sidebar-mb {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		background: #fff;
		padding: 16px;
		border-bottom: 1px solid #f4f4f4
	}

	.sidebar-left .header-sidebar-mb .close {
		width: 20px;
		margin-top: -20px !important;
		font-size: 0
	}

	.sidebar-left .header-sidebar-mb .close img {
		width: 100%
	}

	.result-filter {
		padding: 0;
		display: block
	}

	.result-filter label {
		padding-left: 10px;
		margin-bottom: 10px
	}

	.result-filter .list-filter {
		margin: 0;
		padding-left: 10px
	}

	.statifaction {
		display: none
	}

	.parallax-compro {
		font-size: 14px
	}

	.parallax-compro .btn {
		font-size: 18px
	}
}

@media only screen and (max-width:360px) {
	.header-mid .frame-logo.mobile p {
		font-size: 9px;
		margin-top: 13px
	}
}

.row-flex {
	display: flex;
	justify-content: center;
	align-items: top;
	flex-wrap: nowrap
}

.row-flex .col {
	width: 100%
}