/* ----------------------------------------------------------------

	Custom CSS



	Add all your Custom Styled CSS here for New Styles or

	Overwriting Default Theme Styles for Better Handling Updates

-----------------------------------------------------------------*/



:root {
	--cnvs-themecolor: #acbbc6;
	--cnvs-themecolor-rgb: 172, 187, 198;

	  --bs-secondary-bg: #acbbc6;
  --bs-secondary-bg-rgb: 172, 187, 198;

}

.dark{
		--cnvs-contrast-bg: #33424d;
	--cnvs-contrast-bg-rgb: 172, 187, 198;
}

#header .primary-menu {
	    /* --cnvs-header-border-color: #33424d;
    --cnvs-header-transparent-border-color: #33424d; */
	    --cnvs-primary-menu-font-size: 1rem;
}

#header .sub-menu-container .menu-item > .menu-link {
	font-size: 1rem;
}

#cfl .slider-caption h2, #cfl .slider-caption .h2, #cfl .slider-caption, #cfl .flex-caption, #cfl p{
	color: white;
}

#cfl h2, #cfl p{
	/* background-color: black; */
	
}


.slider-caption h2, .slider-caption .h2, .slider-caption, .flex-caption{
	color: #33424d;
}


.tiktok-embed{
	height: 100%;
}

.slider-caption, .flex-caption{}

.section{
	background-color: #acbbc6;
}

.page-title{
	background-color: #acbbc6;
}

.imagePOP{
	background-image: url('/images/mascot-popup.png') !important;
}

.faq .accordion-title{
	color:#69757d
}

.grid-filter{
	display: block!important;
	border: none;
}

.grid-filter li.activeFilter a {
	color: #7b9db5;
	font-weight: bolder;
	background-color: transparent!important;
	margin: 0;
	padding: 0 0.25rem 0 0.75rem;
	font-size: 101%;
}

@media only screen and (max-width: 600px) {
.display-2{
	font-size: calc(1.625rem + 10vw);
}

#content .content-wrap .col-md-4 a{
/* display: flex !important ; */
margin: auto ;

}

#content .content-wrap .col-md-4 span{
  margin: auto ;
}
}

@media only screen and (max-width: 1200px) {
	.single-product .product-price {
	font-size: 2rem!important;
  }
  .product-price del{
	font-size: 45%!important;
}
}


@media only screen and (max-width: 1024px) {
  #content .content-wrap .col-md-4 span.syopi{
    margin-top: 16px!important;
  }
  .single-product .product-price {
	font-size: 1.5rem!important;
  }
  .product-price del{
	font-size: 45%!important;
}
}

@media only screen and (max-width: 991px) {
		
#kategoriproduk{
	display: none;
	visibility: hidden;
}

}

@media only screen and (max-width: 770px) {
	#cfl .slider-caption h2{
		font-size: 3.5rem;
	}


.sliderkotak{
	margin-top: 5%;
	margin-left: -5%;
}

.sliderkotak .indexbutton .button{
	font-size: 16px;
	margin-bottom: 0;
}

.sliderkotak p.my-4{
	margin-bottom: 0.75rem!important;
	margin-top: 0.75rem!important;
}


  #content .content-wrap .col-md-4 span.syopi{
    margin-top: 18px!important;
  }
  .single-product .product-price {
	font-size: 1.8rem!important;
  }

  .product-price del{
	font-size: 55%!important;
}
}

@media only screen and (max-width: 429px) {
	.sliderkotak{
	margin-top: 10%;
	margin-left: -10%;
}

.sliderkotak .indexbutton .button{
	font-size: 10px;
	padding: 0.2rem 0.55rem;
}

.sliderkotak p.my-4{
	margin-bottom: 0.5rem!important;
	margin-top: 0.5rem!important;
}
}

.indexbutton .button{
	font-size: 22px;
}

.slider-caption h2{
	/* font-size: 4rem; */
}

.widget p:first-child{
	text-transform: uppercase;
	font-size: 17px!important;
}

.product-price del{
	color: #DC3545;
	opacity: 45%;
	padding-right: 0.5rem;
	font-size: 70%;
}

.product-price ins{
	color: #33424d;
}

.product-image > .badge2 {
	position: absolute;
    top: 0.75rem;
    left: 9rem;
    z-index: 5;
}

.badge{
	/* font-size: 28px; */
}

.single-product .product-price{
	font-size: 2.5rem;
}

#content h4, .h4{
	text-transform: uppercase;
}

#garansi b.subtitle{
	font-size: 1.3rem;
	text-transform: uppercase;
	color: #7b9db5;
/* background-color: var(--bs-secondary-bg); */
padding: 0.5%;
border-radius:5px;
}
#garansi b.subtitle {
}