.icon-floating {
    position: fixed;
    bottom: 3%;
    right: 1%;
    z-index: 9999;
}

.icon-floating img{
	width: 100px;
}

/* style bootstrap pagination */
.pagination {
    display: inline-flex;
}

.page-item.active .page-link {
    color: #fff;
    background-color: #31b6ee;
    border-color: #31b6ee;
}

.page-link {
    color: #31b6ee;
    background-color: #fff;
    border: 1px solid #31b6ee;
}

.page-link:hover {
    color: #31b6ee;
    background-color: #e9ecef;
    border-color: #31b6ee;
}
/* style bootstrap pagination */

.navbar-std .navbar-nav .dropdown-menu .product {
	position: fixed;
    top: 70px;
    left: 0;
    margin: 0 auto;
    width: 100%;
    border: none;
    height: 560px;
    background-color: white;
    box-shadow: 0px 28px 35px -15px rgba(0,0,0,0.21);
}

.nav-link span:hover {
	color: #F989AD;
}

.navbar-std .navbar-nav .nav-item.active .nav-link {
	color: #F989AD;
	margin-top: 4px;
}

.navbar-std .navbar-nav .nav-item .nav-link {
	color: #009FDC;
	margin-top: 4px;
}

.nav-link .nav-link-search {
	content: '';
	background-image: url("../images/icon/2024/search-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.nav-product-detail .nav-link.active, .nav-pills .show > .nav-link {
	border: 1px solid #F989AD;
	margin: 10px;
	width: 50px;
	height: 50px;
	padding: 5px;
}

.nav-product-detail .nav-link, .nav-pills .show > .nav-link {
	border: 1px solid #D9D9D9;
	margin: 10px;
	width: 50px;
	height: 50px;
	padding: 5px;

}

.nav-link .nav-link-search:hover {
	background-image: url("../images/icon/2024/search-p.png");
}

.nav-link .nav-link-home {
	content: '';
	background-image: url("../images/icon/2024/home-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.navbar-std .navbar-nav .nav-item.active .nav-link .nav-link-home {
	background-image: url("../images/icon/2024/home-p.png");
}

.nav-link .nav-link-produk {
	content: '';
	background-image: url("../images/icon/2024/product-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.navbar-std .navbar-nav .nav-item.active .nav-link .nav-link-produk {
	background-image: url("../images/icon/2024/product-p.png");
}

.nav-link .nav-link-momversity {
	content: '';
	background-image: url("../images/icon/2024/momversity-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.navbar-std .navbar-nav .nav-item.active .nav-link .nav-link-momversity {
	background-image: url("../images/icon/2024/momversity-p.png");
}

.nav-link .nav-link-loyalty {
	content: '';
	background-image: url("../images/icon/2024/loyalty-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.nav-link .nav-link-buy {
	content: '';
	background-image: url("../images/icon/2024/buynow-b.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 25px;
	height: 25px;
	display: block;
    margin: 0 auto;
}

.navbar-std .navbar-nav .nav-item.active .nav-link .nav-link-buy {
	background-image: url("../images/icon/2024/buynow-p.png");
}

.menu-baby {
	background-image: url("../images/banner/2024/menu-baby-new.png");
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	width: 100%;
}


.menu-kids {
	background-image: url("../images/banner/2024/menu-kids-new.png");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	position: relative;
	width: 100%;
}

.product-detail .card-image img {
	max-width: 95%;
}

.image-ads img {
    max-height: 70px;
    margin: .25rem;
}

.mybaby-dropdownmenu {
	height: 560px;
}

.momversity-dropdownmenu img {
	position: absolute;
    bottom: 0;
    width: 90%;
}

.menu-library {
	background-image: url("../images/banner/2024/momversity-library.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	position: relative;
	width: 100%;
}

.menu-class {
	background-image: url("../images/banner/2024/momversity-class.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	position: relative;
	width: 100%;
}

.menu-discovery {
	background-image: url("../images/banner/2024/momversity-discovery.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	position: relative;
	width: 100%;
}

.menu-competition {
	background-image: url("../images/banner/2024/momversity-competition.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	max-height: 100%;
	height: 100%;
	position: relative;
}

.breadcrumb {
	margin-top: 0rem !important;
	margin-bottom: 0rem;
	margin-left: 0px;
}

.product-detail-text h1 {
	color: #009FDC;
}

.product-detail-text p {
	font-size: 16px;
}

.section-banner .img {
	height: 70vh;
}

.wysiwyg-content h2{
	font-size: 1.2rem;
}

.wysiwyg-content h3{
	font-size: 1rem;
}

.wysiwyg-content p{
	font-size: 18px;
}

select::-ms-expand {
     display: none;
}

.error{
	font-size:11px;
	color:red;
}

.inputerror{
	border: 1px solid red;
}

.btn-crm{
	background-color: #31b6ee;
    border-color: #31b6ee;
    color: #fff !important;
}


.carousel-control-prev i, .carousel-control-next i {
	color: #B1B1B1;
}

.slick-slide img {
	display: block;
	margin: 0 auto;
}

.slickarticle .slick-prev {
	position: absolute;
	top: -50px;
	left: 30%;
	height: 40px;
}

.slickarticle .slick-next {
	position: absolute;
	top: -50px;
	left: 37%;
	height: 40px;
}

.slickarticle .slick-prev:before, .slickarticle .slick-next:before {
	color: #CECECE;
}

.slickarticle .home__smartpedia-carousel .slick-list {
	padding: 0px 0px !important;
}

.slick-dots li button:before{
	font-size: 12px;
}

.slick-prev:before {
	content: '←';
}

.slick-next:before {
	content: '→';
}

.dropdown-menu .hidehidehide {
	display: none;
}
	
.dropdown-menu .myDIVmyDIVmyDIV:hover + .hidehidehide {
	display: block;
	color: red;
}

/* my baby kids */
.bubble-yellow .card-image::before, .bubble-yellow .card-image::before {
    background-image: url(../images/product/bubble-kids-yellow.png);
}
.bubble-pink .card-image::before, .bubble-pink .card-image::before {
    background-image: url(../images/product/bubble-kids-pink.png);
}
.bubble-blue .card-image::before, .bubble-blue .card-image::before {
    background-image: url(../images/product/bubble-kids-blue.png);
}
.sparkling-pink .card-image::before, .sparkling-pink .card-image::before {
    background-image: url(../images/product/sparkling-kids-pink.png);
}
.sparkling-blue .card-image::before, .sparkling-blue .card-image::before {
    background-image: url(../images/product/sparkling-kids-blue.png);
}

.panel-listing-promo .card-image::before{
	height: 225px;
}

.panel-listing-promo .img-logo {
    height: auto;
}

.card-std .card-title, .wysiwyg-content .card-title{
	letter-spacing:0.5px;
}

.card-std-special.card-theme, .card-theme.card-std-featured{
	background:#ff90bf;
}

.card-theme .badge{
	background:#ff90bf;
}

.btn-primary{
	background-color:#F989AD;
	border-color:#F989AD;
	color: white;
	padding: 10px 38px 8px 38px;
}

.btn-wood{
	background-color:#cbb68c;
	border-color:#cbb68c;
}

.main-banner .container .field a {
	cursor: auto;
}

.main-banner .home {
	height: 100vh; margin-right: 0px; margin-left: 0px;
}

.discount {
	margin-top: -55px; margin-bottom:55px;
}

.card-article-list .card-deck {
	margin-right: 0px; margin-left: 0px; position:relative;
}

.slider .main-banner {
	background-image: url(../images/banner/2024/main-banner-mybaby.jpg);
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: bottom center; 
}

.slider .main-banner h1 {
	font-size: 3.25rem;
}

.card .card-image .img {
	height: 400px; border-radius:15px; position: relative;
	background-color: white;
}

.card-std .card-image {
	padding: 20px;
}

.card .card-image .img .category-parenting {
	background-image: url(../images/banner/2024/article-parenting.png);
	width: 110px;
    height: 108px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    bottom: -17px;
    right: -15px;
	border-bottom-right-radius: 15px;
}

.card .card-image .img .category-perawatan {
	background-image: url(../images/banner/2024/article-perawatan.png);
	width: 110px;
    height: 108px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    bottom: -17px;
    right: -15px;
	border-bottom-right-radius: 15px;
}


.card .card-image .img .category-tumbuh-kembang {
	background-image: url(../images/banner/2024/article-tumbuh-kembang.png);
	width: 110px;
    height: 108px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    bottom: -17px;
    right: -15px;
	border-bottom-right-radius: 15px;
}


.scroll {

	position: relative;
	bottom: 140px;
	left: 48%;
	font-size: 14px;
	width: 40px;
	height: 40px;
	border: 2px solid white;
	border-radius: 50%;
	animation: down 1.5s infinite;
	-webkit-animation: down 1.5s infinite;
	&::before {
		content: '';
		position: absolute;
		top: 13px;
		left: 13px;
		width: 10px;
		height: 10px;
		border-left: 2px solid white;
  		border-bottom: 2px solid white;
		transform: rotate(-45deg);
	}
}

@keyframes down {
	0% {
		transform: translate(0);
	}
	20% {
		transform: translateY(15px);
	}
	40% {
		transform: translate(0);
	}
}

@-webkit-keyframes down {
	0% {
		transform: translate(0);
	}
	20% {
		transform: translateY(15px);
	}
	40% {
		transform: translate(0);
	}
}

@keyframes scroll {
	0% {
		height: 40px;
	}
	30% {
		height: 70px;
	}
	60% {
		height: 40px;
	}
}

@-webkit-keyframes scroll {
	0% {
		height: 40px;
	}
	30% {
		height: 70px;
	}
	60% {
		height: 40px;
	}
}

.tips .main-banner {
	background-image: url(../images/banner/2024/tips-bg.png);
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: left center;
}

.tips .main-banner .tips-icon {
	width: 40px;
	padding: 30px 0px;
}

.tips .main-banner h1 {
	font-size: 28px;
	color: #009FDC;
}

.tips .main-banner p {
	color: #6A6A6A;
	font-size: 16px;
	padding: 20px 0px;
}

.tips .main-banner h5 {
	color: #009FDC;
	font-size: 16px;
}

.parenting .main-banner {
	background-image: url(../images/banner/2024/banner.png);
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: left center;
}

.parenting .main-banner img {
	display: block;
	margin: 0 auto;
}

.parenting .main-banner .row {
	height: 80vh; margin-right: 0px; margin-left: 0px;
}

.parenting .section-title {
	margin-top: 30px;
	color: #009FDC;
}

.parenting .title-tools {
	letter-spacing: 3.5px;
}

.top-products-home .section-title {
	color: #009FDC;	
}

.top-products-home .section-title span {
	color: #F989AD;	
}

.top-products-home .product {
	position: relative;
}

.top-products-home .row {
	margin-right: 0px; margin-left: 0px; position:relative; margin-bottom:80px;
}

.btn-parenting {
	display: flex;
    border: 1px solid #ff90bf;
    padding: 6px 10px 6px 10px;
    border-radius: 99px;
	width: 100%;
}

.btn-parenting:hover {
	background-color: #FFE5EE;
}

.btn-parenting span {
	color: #009FDC;
	padding: 12px 0px 0px 10px;
	font-weight: 900;
}

.btn-parenting img {
	width: 40px;
	height: 100%;
}

.testimonials {
	background-size:cover; background-position: bottom center;
}

.testimonials .row .carousel .carousel-inner .carousel-item .love {
	padding: 0px 20px;
}

.testimonials .row .carousel .carousel-inner .carousel-item .love i {
	color: #F989AD; margin-right: 5px;
}

.testimonials .row .carousel .carousel-inner .carousel-item h5 {
	color:#009FDC; padding: 20px;
}

.testimonials .row .carousel .carousel-inner .carousel-item .text {
	margin: 10px 20px 40px 20px;
}

.testimonials .carousel .carousel-inner {
	position: relative;
}

.btn-filter span:hover {
	color: #009FDC;
}

.btn-filter {
	display: flex;
    border: 1px solid #ff90bf;
    padding: 6px 10px 6px 10px;
    border-radius: 99px;
	width: 100%;
}

.btn-filter:hover {
	background-color: #FFE5EE;
}

.btn-filter span {
	color: #009FDC;
	padding: 12px 0px 0px 10px;
	font-weight: 900;
}

.btn-filter img {
	width: 40px;
}

.articleblue{
	background-color: #EEF9FF;
	height: 300px;
}

.articleblue .row img {
	width: 100%;
}

.articlepink{
	background-color: #FDECF6;
	height: 300px;
	
}

.articlepink .row img {
	width: 100%;
}

.card-img-class img {
	border-radius: 10px;
}


.vl-class {
	border-left: 2px solid #E8E8E8;
	height: 2840px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-article {
	border-left: 2px solid #E8E8E8;
	height: 640px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-article-perawatan {
	border-left: 2px solid #E8E8E8;
	height: 1730px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-resep-mpasi {
	border-left: 2px solid #E8E8E8;
	height: 1000px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-mpasi-detail {
	border-left: 2px solid #E8E8E8;
	height: 400px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-detail-article {
	border-left: 2px solid #E8E8E8;
	height: 2200px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.vl-container {
	width: 100px; position:relative;
}

.vl-container .vl-left {
	justify-content: center;
	align-items: center;
	position: absolute; 
	left: 40%;
}

.vl-container .vl-left img {
	display: block; 
	margin: 0 auto; 
	width: 70px; 
	height: auto;
}

.vl-detail-class {
	border-left: 2px solid #E8E8E8;
	height: 90px;
	display: block;
	margin: 0 auto;
	width: 0px;
}

.article-title {
	color: #009FDC; 
	font-family: VAGRoundedStd-Light; 
	font-weight:bolder;
}

.card-see-all {
	background-color: #F7F7F7;
	border-radius: 15px; 
	height: 400px;
	padding: 20px;
	justify-items: center;
    align-content: center;
	text-align: center;
	color: #009FDC; 
}

.card-instagram {
	border-radius: 5px;
	width: 50%;
	display: block;
    margin: 0 auto;
}

.card-instagram .instagram-media {
	width: 100%;
	min-width: 100%;
}

.nav-pills .nav-link.active .btn-filter {
	background-color: #FFDEEF;
	border: 1px solid #FFDEEF;
}

.top-products {
	background-image: url(../images/banner/2024/bg-product.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.top-products-home .product {
	margin-bottom: 100px;
	background-image: url(../images/banner/2024/bg-product-item.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
	background-color: white;
}
.top-products-home .product .item {
	background-color: #F9F9F9;
	margin: 20px 0px;
	text-align: center;
	border-radius: 10px;
	z-index: 10;
	margin-bottom: 100px;
	height: max-content;
	min-height: 520px;
	padding: 10px !important;
}

.top-products .product .item {
	background-color: #F9F9F9;
	margin: 20px 0px;
	text-align: center;
	border-radius: 10px;
	z-index: 10;
	margin-bottom: 100px;
	height: max-content;
	min-height: 520px;
	padding: 10px !important;
}

.detail-mpasi-img {
	background-size: cover !important; 
	background-position: center !important; 
	width: 100%; 
	height: 400px; 
	border-radius: 8px;
}

.bahan-cara-masak {
	background-color: #F0F9FF;
	margin-top: 35px;
	border-radius: 8px;
	padding: 20px;
}

.top-products .product .item .img-product {
	height: 150px;
	width: auto;
}

.top-products .product .background {
	background-color: #EEF9FF;
	height: 300px;
	border-radius: 8px;
	bottom: 0;
	width: 85%;
	position: absolute;
	z-index: 9;
}

.card-article-list {
	background-image: url(../images/banner/2024/moms-lib-bg-new.png);
	background-size: cover;
	/* background-attachment: fixed; */
	background-repeat: no-repeat;
	background-position: bottom right;
	margin-top: 100px;
}

.scroll-to-id {
	width: 2em; height: 2em; background-color: transparent; z-index: 80; bottom: 25px; position: absolute; border-width: 0 0.25em 0.25em 0; border-style: solid; border-color: antiquewhite; animation: scrolldown 1.2s ease-in-out infinite 0.15s;
}

.section-title{
	color:#cbb68c;
}

.badge{
	padding: .65rem 1rem;
	font-size: 90%;
}

.custom-thumb{
	width:100%;
	padding-top:76px;
}

/* animation */
@keyframes scrolldown {
	0%{
		transform: translateY(20%) rotate(45deg);
		opacity: 0.7;
	}
	50%{
		transform: translateY(0%) rotate(45deg);
		opacity: 0.2;
	}
	100%{
		transform: translateY(20%) rotate(45deg);
		opacity: 0.7;
	}
}

.form-search{
	width: 300px;
	right: 10rem;
}



@media (min-width: 1024px){
	.navbar-std .navbar-brand, .navbar-std .navbar-icon {
		width: 200px;
	}
	.navbar-std{
		font-size: 15px;
	}
	.navbar-std .navbar-brand, .navbar-std .navbar-icon {
		width: 200px;
	}
	.navbar-std .nav-link-cart::before{
		bottom: 0;
		width: 20px;
		height: 20px;
		margin-right: 5px;
	}
}	

@media (min-width: 768px) {


	.section-promo-slider{
		margin-top: -3rem;
	}
	
	.panel-promo{
		position:fixed !important;
		padding: 0.75rem 0rem;
		z-index: 9;
		bottom: 100px !important;
		right:0 !important;
	}
	
	.panel-promo .extra-large {
		font-size: 3rem;
	}
	
	.main-banner{
		height: 100vh
	}
	
	.main-banner .banner-caption{
		margin-left:60px;
		padding-top: 2.5rem;
	}
	
	.main-banner .img-product {
		max-width: 600px;
		margin-top: 20px;
		margin-left: 60px;
	}
	
	.main-banner .img-product-hbw {
		max-width: 650px;
		margin-top: -70px;
		margin-right: 70px;
	}
	
	.main-banner .img-product-shampoo {
		max-width: 700px;
		margin-top: -30px;
		margin-left: 0;
	}
	
	.main-banner .banner-title{
		width:330px;
		margin-left: 25px;
	}
	
	.main-banner .banner-title-shampoo{
		width:320px;
		margin-left: 25px;
	}
	
	.main-banner .banner-caption .subtitle{
	    margin-left: 30px;
		margin-top: -20px;
	}
	
	.main-banner .banner-caption .extra-large {
		font-size: 5rem;
	}
	
	.main-banner .banner-caption .large {
		font-size: 2.5rem;
	}
	
	.main-banner .video-container{
		top: 210px;
		position: absolute;
		right: 250px;
	}
	
	.main-banner .video-container2 {
		bottom: -50px;
		position: absolute;
		left: 250px;
	}
	
	.table-prod td{ 
		border:none; padding:0;
	}
	
	.content-prod-row{
		/* background:#F2F2F2; */
		display:block;
		/* border-radius:8px; */
		overflow:auto;
		/* border: solid 1px #DEE2E6; */
		width: 100%;
	}

	.content-prod-white{
		border:none;
	}

	.rounded-left-custom{
		display:block; 
		padding:15px; 
		float:left;
		width:35%;
	}
	.rounded-right-custom{
		display:block; 
		padding:15px; 
		float:left;
		width:65%;
	}

	.white-content-left{
		background:#FFFFFF; 
		padding:15px; 
		float:left;
		width:35%;
	}
	
	.white-content-right{
		background:#FFFFFF; 
		padding:15px; 
		float:left;
		width:65%;
	}
	
	.product-detail-text ul,ol{
		margin-left: 15px;
	}

	.large-image{
		max-height: 400px !important;
		display: block;
		margin: auto;
	}

	.slider-promo .slider-img-right {
		max-height: 270px;
		margin-top: 65px;
	}
	
	.home-promo-img{
		width: 260px;
		height: 260px;
		background-size: cover !important;
	}
	
	.slick-prev, .slick-next{
		top:35%;
		z-index: 9999;
		margin: 20px;
	}
	
	.slider-article .slick-prev {
		left: -50px;
		top: 35%;
	}
	
	.slider-article .slick-next {
		right: -50px;
		top: 35%;
	}
	
	.slick-prev:before, .slick-next:before {
		font-family: 'slick';
		font-size: 30px;
		line-height: 1;
		opacity: .75;
		color: #D9D9D9;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	.section-ornament::before{
		top: 0rem;
		left: 0;
		width: 550px;
		height: 720px;
	}
	
	.card-product .card-body{
		padding: 1rem 2rem;
	}
	
	.card-product .card-title {
		min-height: 45px;
	}
	
	.card-product-detail .card-title {
		min-height: 35px;
		display:flex;
	}
	
	.category-desc-mobile{
		display:none;
	}
	
	.modal-promo .bg-panel img {
		position: relative;
		top: -1rem;
		left: 1rem;
	}
	
	
	/* banner powder */
	.flower-top-left {
		top: 20%;
		left: 10%;
		right: auto;
	}
	.flower-top-right {
		top: 12%;
		left: auto;
		right:5%;
	}
	.flower-bottom-left {
		bottom: 0;
		left: 8%;
		right: auto;
	}
	.flower-bottom-center {
		bottom: 20%;
		left: 30%;
		right: auto;
	}
	.flower-top-center {
		top: 30%;
		right: 13%;
		left: auto;
	}
	.flower-bottom-right {
		bottom: 0;
		right: 5%;
		left: auto;
	}
	
	/* banner mtp */
	.icon-top-left {
		top: 35%;
		left: 30%;
		right: auto;
	}
	.icon-bottom-left {
		bottom: 30%;
		left: 32%;
		right: auto;
	}
	.icon-top-right {
		top: 40%;
		left: auto;
		right:32%;
	}
	.icon-bottom-right {
		bottom: 14%;
		right: 26%;
		left: auto;
	}
	
	/* banner shampoo */
	.pos-tl {
		top: 8%;
		left: 8%;
		right: auto;
	}
	.pos-tc {
		top: 8%;
		left: 53%;
		right: auto;
	}
	.pos-bl {
		bottom: 0;
		left: 8%;
		right:auto;
	}
	.pos-mc {
		bottom: 25%;
		right: 17%;
		left: auto;
	}
	.pos-mr {
		top: 14%;
		right: 1%;
		left: auto;
	}
	
	/* banner kids */
	.main-banner2{
		min-height: 475px;
		background-image: inherit;
		background-repeat: no-repeat;
		background-position: bottom center;
		background-size: cover;
		position: relative;
	}
	
	.main-banner2 .banner-caption{
		padding-top: 0.5rem;
	}
	
	.main-banner2 .img-product {
		max-width: 635px;
		margin-top: -10px;
		margin-left: 20px;
	}
	
	.main-banner2 .banner-title{
		max-width:635px;
		margin: 20px auto;
	}
	
	.kidsbbl-top-left {
		top: 22%;
		left: 5%;
		right: auto;
		position: absolute;
	}
	.kidsbbl-top-right {
		top: 0;
		left: auto;
		right:15%;
		position: absolute;
	}
	.kidsbbl-bottom-left {
		bottom: 15%;
		left: 15%;
		right: auto;
		position: absolute;
	}
	.kidsbbl-bottom-right {
		bottom: 20%;
		right: 3%;
		left: auto;
		position: absolute;
	}
	
	/* banner mandihappy */
	.main-banner-mandihappy{
		min-height: 555px;
		background-image: inherit;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		position: relative;
	}
	
	.main-banner-mandihappy .btn{
		padding-top: 0.5rem;
		margin-top: 1rem;
	}
	
	.main-banner-mandihappy .img-product {
		margin-top: 130px;
	}
	
	/* banner momversity */
	.main-banner-momversity{
		min-height: 555px;
		background-image: inherit;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		position: relative;
	}
	
	.main-banner-momversity .btn{
		margin-top: -2.5rem;
		margin-left: 9%;
	}
	
	.main-banner-momversity .img-product {
		margin-top: 50px;
		max-width: 90%;
	}
	
	.momversity-menu img {
		margin-top: 10px;
		margin-left: 10px;
	}
	
	.modal{
		z-index: 9999;
		top: 60px;
	}
	
	.modal-dialog {
		/* max-width: 980px; */
	}
	
	/* Banner MBKidsKayuPutih */
	.MBKidsKayuPutih{
		height: 500px;
		background-position: top center;
		background-size: cover;
	}
	.MBKidsKayuPutih .banner-caption{
		margin-top: 50px;
	}
	.MBKidsKayuPutih .eucalyptus{
		position: absolute;
		width: 250px;
		top: 80px;
		left: 90px;
	}
	
	/* Banner Telon 5+5 */
	.main-banner-55telon{
		height: 500px !important;
	}
	
	.minyaktelon-icon1 img {
		width: 100% !important;
		position: absolute !important;
		top: 100 !important;
	}
	
	.main-banner-55telon .img-product-hbw {
		/*max-width: 750px !important;*/
		margin-top: 0 !important;
		margin-left: 70px !important;
	}
	
	.main-banner-55telon .video-container {
		/*top: 70px !important;
		position: absolute;
		right: -15px !important;*/
		top: 131px !important;
		position: absolute;
		right: 150px !important;
	}
	
	.main-banner-55telon .video-container .btn-video{
		background-color: #54a045 !important;
		border-color: #54a045 !important;
		color: #fff;
	}
	
	/* Banner Wipes July 2021 */
	.main-banner-wipes{
		height: 500px !important;
	}
	
	.main-banner-wipes .img-product-hbw {
		max-width: 550px !important;
		margin-top: 0 !important;
		margin-left: 150px !important;
	}
	
	.main-banner-wipes .video-container {
		top: 120px !important;
		position: absolute;
		left: 117px !important;
	}
	
	.main-banner-wipes .video-container .btn-video{
		background-color: #2bb6dd !important;
		border-color: #2bb6dd !important;
		color: #fff;
	}
	
	
	/* Lavender */
	.main-banner .img-product-lavender {
		max-width: 540px;
		margin-top: -20px;
		margin-left: 125px;
	}
	.lavender {
		position: absolute;
	}
	.lavender img{
		width: 70%;	
	}
	.lavender-left-1 {
		top: 15%;
		left: 8%;
		right: auto;
	}
	.lavender-left-2 {
		top: 20%;
		left: 33%;
		right: auto;
	}
	.lavender-left-3 {
		top: 40%;
		left: 20%;
		right: auto;
	}
	.lavender-right-1 {
		top: 10%;
		right: 30%;
		left: auto;
	}
	.lavender-right-2 {
		top: 25%;
		right: 4%;
		left: auto;
	}
	.lavender-right-3 {
		bottom: 50%;
		right: 18%;
		left: auto;
	}
	
	.minyaktelon-icon {
		top: 70%;
		left: 30%;
		transform: translate(-50%, -50%);
	}
	
	/* MY BABY KIDS */
	.mybkids{
		background-image: url('../images/banner/mybkids-homebanner-bg.jpg'); 
		width: auto; 
		height: auto;
		min-height: 580px;
	}
	.main-banner .img-product-mybkids {
		margin-top: 120px;
		margin-left: -90px;
		z-index: 9999;
	}
	.mybkids .video-container {
		top: 90px;
		position: absolute;
		right: 80px;
	}
	.awan {
		position: absolute;
	}
	.awan img{
		width: 70%;	
	}
	.awan-left-1 {
		top: 15%;
		left: 10%;
		right: auto;
	}
	.awan-left-2 {
		top: 40%;
		left: 0%;
		right: auto;
	}
	.awan-right-1 {
		top: 45%;
		right: -10%;
		left: auto;
	}
	.awan-right-2 {
		top: 20%;
		right: -10%;
		left: auto;
	}
}

@media (max-width: 768px) {

	.slider .main-banner {
		background-image: url("../images/banner/2024/main-banner-mybaby-m.png");
		background-attachment: local;
		height: 95vh;
		background-size: cover;
	}

	.slider .main-banner h1 {
		font-size: 28px;
	}

	.slider .main-banner .btn-primary {
		margin-bottom: 290px;
	}

	.parenting .main-banner {
		background-image: url("../images/banner/2024/babyname-home-bg-m.png");
		background-attachment: local;
		height: 60vh;
	}

	.menu-library {
		background-image: url("../images/banner/2024/momversity-library-m.png")
	}

	.menu-class {
		background-image: url("../images/banner/2024/momversity-class-m.png")
	}

	.menu-discovery {
		background-image: url("../images/banner/2024/momversity-discovery-m.png")
	}

	.menu-competition {
		background-image: url("../images/banner/2024/momversity-competition-m.png")
	}

	.card-article-list {
		margin-top: 220px;
	}

	.testimonials .carousel .carousel-inner {
		height: 115vh;
	}

	.scroll {
		left: 43%;
	}

	.tips .main-banner {
		background-image: url("../images/banner/2024/tips-bg-m.png");
		background-attachment: local;
        background-size: cover;
        width: 100%;
        background-position: center;
	}

	.tips .main-banner h1 {
		padding-top: 100px;
	}

	.parenting .main-banner .row {
		height: 40vh;
	}

	.menu-kids {
		background-position: left bottom;
	}
	.menu-baby {
		background-position: top left;
	}

	.babyname-top {
		text-align: center;
	}

	.mybaby-dropdownmenu {
		height: 240px !important;
	}

	/* header */
	.form-search {
		width: 65% !important;
        top: 4rem;
        right: 0;
	}

	.card .card-image .img {
		height: 250px;
	}

	.navbar-std {
		border-bottom-left-radius: 25px;
		border-bottom-right-radius: 25px;
	}

	.navbar-std .navbar-nav .nav-item .nav-link {
		display: flex !important;
	}

	.navbar-std .navbar-nav .nav-item .nav-link span {
		padding-top: 4px;
	}
	
	.nav-link .nav-link-home, .nav-link .nav-link-produk, .nav-link .nav-link-momversity, .nav-link .nav-link-loyalty, .nav-link .nav-link-buy {
		display: inline-block !important;
		margin: 0px 10px 0px 0px !important;
	}

	.navbar-std .navbar-nav .dropdown-menu .product {
		top: 240px;
		z-index: 9;
		justify-content: center !important;
		align-items: baseline !important;
		position: static;
		height: 100%;
		box-shadow: none;
	}

	.navbar-std .navbar-nav .dropdown-menu .product .text{
		display: none;
	}

	.menu-baby, .menu-kids, .menu-library, .menu-class, .menu-competition, .menu-discovery {
		height: 240px;
		border-radius: 15px;
		margin: 10px;
		margin-left: 10px !important;
		margin-right: 10px !important;
		box-shadow: 0px 28px 35px -15px rgba(0,0,0,0.21);
	}

	.navbar-std .navbar-collapse {
		overflow-y: scroll;
		margin-bottom: 2rem;
	}

	.product-detail .card-image img {
		max-width: 95%;
	}
	
	.card-product .card-image {
		margin-top: 30px;
		margin-bottom: 50px;
	}

	.nav-product-detail .nav-link.active, .nav-pills .show > .nav-link {
		width: 50px;
		height: 50px;
		display: block;
		margin: 0 auto;
		margin: 5px 5px;
	}

	.nav-product-detail .nav-link, .nav-pills .show > .nav-link { 
		width: 50px;
		height: 50px;
		display: block;
		margin: 0 auto;
		margin: 5px 5px;
	}

	.product-detail-text h1 {
		padding-top: 40px;
	}

	.articlepink, .articleblue {
		height: 55vh;
		justify-items: center;
		align-content: center;
		margin-bottom: 30px;
		text-align: center;
	}

	.babyname, .mpasi-detail {
		height: 80vh !important;
	}

	.articlepink .row img {
		width: 70%;
		display: block;
		margin: 0 auto;
	}

	.articleblue .row img {
		width: 70%;
		display: block;
		margin: 0 auto;
	}

	.slickarticle .slick-prev {
		height: 35px;
		left: 60%;
	}

	.slickarticle .slick-next {
		height: 35px;
		left: 75%;
	}

	.section-banner .banner-product {
		height: 55vh !important;
		background-position: top center;	
	}

	.section-banner-kids .banner-product {
		height: 55vh !important;
		background-position: left center;	
	}

	.top-products {
		background-size: contain;
	}

	.top-products .nav .nav-item .nav-link {
		padding: 5px;
	}

	.top-products .product .item {
		min-height: 350px;
	}

	.btn-primary {
		padding: 10px 8px 8px 8px;
	}

	.form-control {
		width: 100% !important;
	}

	.detail-mpasi-img {
		margin-bottom: 20px;
	}

	.wysiwyg-content h6 {
		font-size: 16px !important;
	}
	
	.wysiwyg-content p {
		font-size: 16px !important;
	}

	.btn-parenting { 
		margin: 10px 0px;
	}

	.card-std .card-image {
		padding: 0px;
		/* margin-bottom: 30px; */
	}

	/* .card-article-list .card-deck, .card-article-list .col-card-std {
		height: 560px !important;
	} */
	
	.card-instagram{
		width: 100%;
	}

	.slickarticle .slider-mpasi-1, .slickarticle .slider-mpasi-2, .slickarticle .slider-mpasi-3 {
		height: 330px !important;
	}

	.slickarticle .slider-article-1, .slickarticle .slider-article-2, .slickarticle .slider-article-3 {
		height: 440px !important;
	}

	.section-title {
		margin-left: 0px !important;
	}

	.top-products-home .product {
		margin-bottom: 0px !important;
		background-image: none;
	}

	.testimonials .row {
		height: 100vh !important;
	}

	iframe{
		width: 100%;
	}
	
	.navbar-std.navbar-scrolled .navbar-brand img {
		max-width: 60px;
		top: 1rem;
	}
	
	.panel-promo{
		/*padding: 0.8rem 0rem;*/
		padding: 0.1rem 0rem;
		width:45px;
		height:45px;
		position: fixed;
		right: 0;
		bottom: 200px;
		z-index: 9999;
	}
	
	.panel-promo .extra-large {
		/*font-size: 0.7rem;*/
		font-size: 2rem;
	}
	
	.panel-promo h5 {
		font-size: 0.6rem;
		margin-top:17px !important;
	}
	
	.section-promo-slider{
		margin-top: -3rem;
	}
	
	.slider-promo {
		padding-bottom: 2rem;
		padding-top: 3rem;
	}
	
	.slider-promo .slider-caption{
		text-align: center;
	}
	
	.slider-promo .slider-caption a{
		display: block;
		width: 150px;
		margin: 10px auto;
	}
	
	.slider-promo img{
		max-width:80%;
	}
	
	.slider-promo .slider-img-right {
		max-height: 200px;
	}
	
	.home-promo-img{
		width: 200px;
		height: 200px;
		background-size: cover !important;
		margin: 0 auto;
	}
	
	.banner-caption .text-light{
		padding-left: 20px;
	}
	
	.banner-caption .text-light h1{
		padding-left: 20px;
	}
	
	.main-banner .banner-caption .subtitle{
	    margin-left: 20px;
		margin-top: -80px;
	}
	
	.main-banner .img-product {
		max-width: 90%;
		margin-top: 30px;
	}
	
	.main-banner .img-product-hbw {
		max-width: 100%;
		margin-top: -20px;
		margin-left: 0px;
	}
	
	.main-banner .banner-title{
		width:50%;
	}
	
	.main-banner .banner-title-shampoo{
		width:60%;
	}
	
	.main-banner .video-container{
		top: 35px;
		position: absolute;
		right: 20px;
		width: 135px;
	}
	
	.main-banner .resbutton{
		top: 225px !important;
		right: -167px !important;
	}
	
	.main-banner .btn-minyak-telon{
		top: 315px !important;
		left: 35% !important;
	}
	
	.main-banner .btn-toothpaste{
		top: 248px !important;
		right: 235px !important;
	}
	
	.main-banner .video-container2{
		margin-top: 10px;
		margin-left: -10px;
	}
	
	.main-banner .btn-video{
		font-size: 9px;
		padding: 0px 5px 2px 10px;
		line-height: 2;
	}
	
	.main-banner .btn-video .fa{
		padding-top: 2px;
	}
	
	.slick-prev, .slick-next{
		top:50%;
		z-index: 9999;
		margin: 15px;
	}
	
	.slick-prev:before, .slick-next:before {
		font-family: 'slick';
		font-size: 20px;
		line-height: 1;
		opacity: .75;
		color: white;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	.slider .arrow-container{
		margin: 10px auto;
	}
	
	.section-title {
		margin-bottom: 1rem;
		margin-left: -4rem;
	}

	.section-title h2{
		margin-left:-50px;
	}
	
	.section-title.artikel-terkait h2{
		margin-left:0;
	}
	
	/* .section-title span{
		padding-left: 50px;
		font-size:3rem !important;
	} */
	
	.list-inline-product-category .list-inline-item {
		width: 100%;
	}
	
	.section-banner .img{
		height:110px;
		margin-top:25px;
	}
	
	.section-banner .caption-banner{
		max-width:100px;
	}
	
	.section-ornament {
		position: unset;
	}

	.section-ornament::before{
		top: 0rem;
		left: 0;
		width: 100%;
		height: 500px;
	}
	
	.card-product .card-img-top{
		max-height:130px;
	}
	
	.custom-thumb{
		padding-top:0;
		
	}
	
	.panel-filter .btn {
		padding: .35rem .5rem .25rem;
	}
	
	.slider-article .card-image img{
		width:90%;
	}
	
	.panel-listing-promo{
		padding: 1rem;
		margin: 2rem 0;
	}
	
	.panel-listing-promo .btn{
		font-size: 8px;
		padding: 5px 8px 3px;
	}
	
	.panel-listing-promo h5{
		font-size: 1rem;
	}
	
	.panel-listing-promo span{
		font-size: 0.5rem;
	}
	
	.panel-listing-promo img {
		max-height:240px;
	}
	
	.section-search{
		padding: 25px 15px;
	}
	
	.footer .sitemap .list-inline-menu{
		min-height: 140px;
		width: 100% !important;
    	float: none !important;
	}
	
	.table-prod td{ 
		border:none; padding:0;
	}
	
	.content-prod-row{
		/* background:#F2F2F2; */
		display:block;
		/* border-radius:8px; */
		overflow:auto;
		/* border: solid 1px #DEE2E6; */
		width:100%;
	}

	.content-prod-white{
		border:none;
	}

	.rounded-left-custom{
		display:block; 
		padding:15px; 
		float:left;
		width:35%;
	}
	.rounded-right-custom{
		display:block; 
		padding:15px; 
		float:left;
		width:65%;
	}

	.white-content-left{
		background:#FFFFFF; 
		padding:15px; 
		float:left;
		width:35%;
	}
	
	.white-content-right{
		background:#FFFFFF; 
		padding:15px; 
		float:left;
		width:65%;
	}
	
	.product-detail-text ul{
		margin-left: 15px;
	}
	
	.card-product .card-title {
		text-align:center;
	}
	
	.card-product .card-body{
		padding: 1rem 2rem;
	}
	
	.card-product .btn{
		font-size: 14px;
        padding: 15px 20px 13px;
        margin-top: 5px;
        margin-bottom: 100px;
	}
	
	.card-product .icon-category{
		display:none;
	}
	
	.caption-banner .section-title {
		margin-bottom: 3rem;
	}

	.category-desc-desktop{
		display:none;
	}
	
	.category-desc-mobile{
		text-align:center;
		margin:10px auto;
		width: 90%;
	}
	
	

	.flower-top-left {
		display:none;
	}
	.flower-top-right {
		display:none;
	}
	.flower-bottom-left {
		display:none;
	}
	.flower-bottom-center {
		display:none;
	}
	.flower-top-center {
		display:none;
	}
	.flower-bottom-right {
		display:none;
	}
	
	
	/* banner mtp */
	
	.icon-top-left {
		max-width: 60px;
		top: 40%;
		left: 15%;
		right: auto;
	}
	.icon-bottom-left {
		max-width: 45px;
		bottom: 30%;
		left: 16%;
		right: auto;
	}
	.icon-top-right {
		top: 50%;
		left: auto;
		right: 13%;
		max-width: 45px;
	}
	.icon-bottom-right {
		bottom: 18%;
		right: 15%;
		left: auto;
	}
	
	/* banner shampoo */
	/*.pos-tl {
		display:none;
	}
	.pos-tc {
		display:none;
	}
	.pos-bl {
		display:none;
	}
	.pos-mc {
		display:none;
	}
	.pos-mr {
		display:none;
	}*/
	
	.pos-tl {
		display:none;
	}
	.pos-tc {
		top: 8%;
		left: 53%;
		right: auto;
	}
	.pos-bl {
		bottom: 30%;
		left: 8%;
		right:auto;
	}
	.pos-mc {
		bottom: 45%;
		right: 17%;
		left: auto;
	}
	.pos-mr {
		display:none;
	}
	
	/* banner kids */
	.main-banner2{
		background-size: cover;
		background-position: top center;
	}
	
	.main-banner2 .banner-caption{
		padding-top: 2.5rem;
	}
	
	.main-banner2 .img-product {
		margin-top: 15px;
		margin-left: -15px;
	}
	
	.main-banner2 .banner-title{
		max-width:90%;
	}
	
	.kidsbbl-top-left {
		display:none;
	}
	.kidsbbl-top-right {
		display:none;
	}
	.kidsbbl-bottom-left {
		display:none;
	}
	.kidsbbl-bottom-right {
		display:none;
	}
	
	/* banner mandihappy */
	.main-banner-mandihappy{
		min-height: 320px;
		background-image: inherit;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		position: relative;
	}
	
	.main-banner-mandihappy .btn{
		padding-top: 0.5rem;
		margin-top: 1rem;
	}
	
	.main-banner-mandihappy .img-product {
		width:100%;
		margin-top: 100px;
	}
	
	/* banner momversity */
	.main-banner-momversity{
		min-height: 380px;
		background-image: inherit;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		position: relative;
	}
	
	.main-banner-momversity .btn{
		margin-top: 0;
		margin-left: 20%;
	}
	
	.main-banner-momversity .img-product {
		margin-top: 5rem;
		width: 95%;
	}
	
	.momversity-menu img{
		margin-left: 0;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	
	/* Banner MBKidsKayuPutih */
	.MBKidsKayuPutih{
		min-height: 360px;
		background-position: -505px 0px;
		background-size: cover;
	}
	.MBKidsKayuPutih .banner-caption{
		margin-top: 0;
		width: 150px;
		margin-left: -5px;
	}
	.MBKidsKayuPutih .banner-caption img{
		height: 100px;
		margin-top: 0;
	}
	.MBKidsKayuPutih .eucalyptus{
		position: absolute;
		width: 150px;
		top: 50px;
		left: -10px;
	}
	
	/* Banner Telon 5+5 */
	.main-banner-55telon .banner-caption{
		padding-top: 5rem;
	}
	
	.minyaktelon-icon .video-container {
		top: 1px;
		position: absolute;
		right: 112px;
		width: 135px;
	}
	
	.main-banner-55telon .video-container .btn-video{
		background-color: #54a045 !important;
		border-color: #54a045 !important;
		color: #fff;
	}
	
	/* Banner Wipes July 2021 */
	.main-banner-wipes{
		background-size: 200%;
	}
	.main-banner-wipes .banner-caption{
		padding-top: 5rem;
	}
	.main-banner-wipes .video-container {
		top: 20px !important;
		position: absolute;
		left: 0 !important;
		right: 0 !important;
		width: 100%;
		text-align: center;
	}
	.main-banner-wipes .img-product-hbw {
		max-width: 80%;
		margin: 0 auto;		
		margin-left: 50px;
	}
	
	
	/* lavender */
	.lavender {
		display: none;
	}
	
	/* MY BABY KIDS */
	.mybkids{
		background-image: url('../images/banner/mybkids-homebanner-bg.jpg'); 
		width: auto; 
		height: auto;
	}
	.main-banner .img-product-mybkids {
		margin-top: 160px;
		margin-left: -10px;
		z-index: 9999;
	}
	.mybkids .video-container {
		top: 110px;
		position: absolute;
		margin: 0 auto;
		left: 0;
		right: 0;
		text-align: center;
	}
	.awan {
		position: absolute;
	}
	.awan img{
		width: 35%;	
	}
	.awan-left-1 {
		top: 15%;
		left: 0%;
		right: auto;
	}
	.awan-left-2 {
		top: 40%;
		left: 0%;
		right: auto;
	}
	.awan-right-1 {
		top: 35%;
		right: -65%;
		left: auto;
	}
	.awan-right-2 {
		top: 10%;
		right: -65%;
		left: auto;
	}
	
	
}


/* ANIMATION */

.awan-x1 {
	-webkit-animation: sideWays 10s linear infinite;
	-moz-animation: sideWays 10s linear infinite;
	-o-animation: sideWays 10s linear infinite;
}

.awan-x2 {
	-webkit-animation: sideWays 15s linear infinite;
	-moz-animation: sideWays 15s linear infinite;
	-o-animation: sideWays 15s linear infinite;
	animation-delay: 2s;
}

.awan-reverse-x1 {
	-webkit-animation: sideWays-reverse 10s linear infinite;
	-moz-animation: sideWays-reverse 10s linear infinite;
	-o-animation: sideWays-reverse 10s linear infinite;
}

.awan-reverse-x2 {
	-webkit-animation: sideWays-reverse 15s linear infinite;
	-moz-animation: sideWays-reverse 15s linear infinite;
	-o-animation: sideWays-reverse 15s linear infinite;
	animation-delay: 2s;
}

@-webkit-keyframes sideWays {
	0% { margin-left: 0px; }
	50% { margin-left: 100px; }
	100% { margin-left: 0px; }
}

@-moz-keyframes sideWays {
	0% { margin-left: 0px; }
	50% { margin-left: 100px; }
	100% { margin-left: 0px; }
}

@keyframes sideWays {
	0% { margin-left: 0px; }
	50% { margin-left: 100px; }
	100% { margin-left: 0px; }
}

@-webkit-keyframes sideWays-reverse {
	0% { margin-right: 0px; }
	50% { margin-right: 100px; }
	100% { margin-right: 0px; }
}

@-moz-keyframes sideWays-reverse {
	0% { margin-right: 0px; }
	50% { margin-right: 100px; }
	100% { margin-right: 0px; }
}

@keyframes sideWays-reverse {
	0% { margin-right: 0px; }
	50% { margin-right: 100px; }
	100% { margin-right: 0px; }
}