/* import fonts */
@font-face {
  font-family: "LotussSmartHL-Regular";
  src: url(lotus-font/LotussSmartHL-Regular.ttf);
}
@font-face {
  font-family: "LotussSmartHL-Medium";
  src: url(lotus-font/LotussSmartHL-Medium.ttf);
}
@font-face {
  font-family: "LotussSmartHL-Bold";
  src: url(lotus-font/LotussSmartHL-Bold.ttf);
}
@font-face {
  font-family: "LotussSmartHL-Light";
  src: url(lotus-font/LotussSmartHL-Light.ttf);
}
@font-face {
  font-family: "LotussSmartTX-Regular";
  src: url(lotus-font/LotussSmartTX-Regular.ttf);
}
@font-face {
  font-family: "LotussSmartTX-Bold";
  src: url(lotus-font/LotussSmartTX-Bold.ttf);
}
@font-face {
  font-family: "LotussSmartTX-Light";
  src: url(lotus-font/LotussSmartTX-Light.ttf);
}

/* general overwrite class */
body, html{ background-color: #EDF3F4; font-family: "LotussSmartHL-Regular"; color: #575756; }
section{ padding: 40px 0 15px; position: relative }
h1, b{ font-family: "LotussSmartHL-Bold" }
b.tx{ font-family: "LotussSmartHL-Bold" }
m{ font-family: "LotussSmartTX-Bold"; }
.navbar i{ font-size: 24px; }
a{ text-decoration: none; }
ol{ padding-left: 1.2rem; }
ul{ padding-left: 1.5rem; }
p{ margin-bottom: .3rem; line-height: 1.4; }
hr{ opacity: 1; }
svg{ width:100%; }
.s-line{ text-decoration: line-through; }
.img-fluid-i{ max-width:100% !important; width:auto !important; }
.link{ color: #0d6efd; text-decoration: underline; }
.accordion-button:not(.collapsed){ color: white; }
.special-title{ font-size: calc(1.325rem + 1.1vw); line-height: 1.2; }
.flex{ display: flex; }
.valign-center{ justify-content: center; align-items: center; }
.align-center{ margin: 0 auto; }
.bg-red{ background-color:#ff0000 }
.bg-white{ background-color: white !important; }
.bg-green{ background-color: #00BCB5 !important; color: white; }
.bg-gold{ background-color: #F7BE00 !important; }
.bg-grey{ background-color: #cecece; }
.bg-dgrey{ background-color: #F2F2F2; }
.bg-lightblue{background-color: #EDF3F4 !important;}
.bg-yellow{ background-color: #F6BF00; }
.bg-purple{ background-color: #63338C; }
.bg-white{ background-color: #fff; }
.bg-orange{ background-color: #FF681E; }
.border{ border: 1px solid !important; }
.borderless{ border:none !important; }
.border-green{ border-color: #00BCB5 !important; }
.border-grey{ border-color: #d9d9d9 }
.border-black{ border-color: black; }
.rounded{ border-radius: 25px !important; }
.rounded-top-left{ border-top-left-radius: 20px; }
.rounded-top-right{ border-top-right-radius: 20px; }
.rounded-bottom-left{ border-bottom-left-radius: 20px; }
.rounded-bottom-right{ border-bottom-right-radius: 20px; }
.rounded p, .box p{ word-break: break-word; }
.rounded-left{ border-top-left-radius: 25px; border-bottom-left-radius: 25px; }
.rounded-right{ border-top-right-radius: 25px; border-bottom-right-radius: 25px; }
.rounded, .rounded-left, .rounded-right{ overflow: hidden; }
.rounded.corporate{ overflow: initial; }
.rounded.corporate p{ min-height: 90px; }
.ofxh{ overflow-x:hidden; }
.box-shadow{ box-shadow: 0 10px 10px 5px rgb(0 0 0 / 20%);-webkit-box-shadow: 0 10px 10px 5px rgb(0 0 0 / 20%);-moz-box-shadow: 0 10px 10px 5px rgb(0 0 0 / 50%); }
.title-xl{ font-size: 3.5rem; }
.ico-lg{ font-size: 3rem; }
.sub-title{ font-size: 1.1rem; }
.txt--special{ font-size: 130%; line-height:1.2 }
.txt--s{ font-size:80%; }
.txt--l{ font-size:120%; }
.txt--xl{ font-size:140%; line-height:1.2; }
.txt--xxl{ font-size:170%; line-height:1.2; }
.font--medium{ font-family: "LotussSmartHL-Medium"; }
.txt--white{ color: white; }
.txt--green{ color: #00BCB5; }
.txt--gray{ color: #9d9d9d; }
.txt--gray2{ color: #949494; }
.txt--dgrey{ color:#575756; }
.txt--gold{ color: #F7BE00 }
.txt--lightblue{ color: #00BCB4 ; }
.txt--yellow{ color: #F9BE00; }
.txt--purple{ color: #5A2B82; }
.txt--black{ color:black; }
.txt--red{ color: #E1221C; }
.btn-primary{ background-color: transparent; color: #00BCB5; border-color: #00BCB5; border-radius: 1.4rem; min-width: 140px; padding: .5rem 1rem }
.btn-whitebg{ color: #00BCB5 !important; border: 1px solid #00BCB5 !important; background-color: white !important; border-radius: 1.4rem; min-width: 140px; padding: .5rem 1rem }
.btn-whitebg:hover, .btn-whitebg:focus, .btn-primary:focus, .btn-primary:hover, .btn-primary.active{ background-color: #00BCB5 !important; color: white !important; border-color: #00BCB5 !important; }
.btn-careersearch{ color: #00BCB5 !important; border: 1px solid #00BCB5 !important; border-radius: 1.4rem; min-width: 100%; padding: .5rem 1rem; background-color: white; }
.btn-grey{ background-color: transparent; color: #808080; border-color: #808080; border-radius: 1.4rem; min-width: 100px; padding: .2rem 1rem }
.btn-green{ background-color: #00BCB5 !important; color: white !important; border-color: #00BCB5 !important;  }
.btn-full{ width: 100%; }
.btn-long{ min-width: 250px; }
.txt--center{ text-align: center; }
.txt--center-xs-left{ text-align: center }
.txt--center-md-left{ text-align: center }
.txt--left{ text-align: left; }
.txt--left-md-center{ text-align: left }
.txt--right-md-center{ text-align:right; }
.txt--right{ text-align: right; }
.float--left{ float: left; }
.float--right{ float: right; }
.clear{ clear:both; }
.hide-ele{ display:none; }
.show--xs{ display: none; }
.hide--xs-initial{ display:initial; }
.hide--xs{ display: block; }
.show--xs{ display: none; }
.hide--xs{ display: block; }
.show--xxs{ display: none; }
.hide--xxs{ display: block; }
.default-display{ display: initial !important; }
.lg-80{ width: 80%; margin: 0 auto; }
.w-80{ max-width:80% !important; }
.campaign-img-restrain img{ width: auto !important; max-width: 100%; }
.scroll-top{ position: fixed; bottom: 90px; right: 20px; cursor: pointer; z-index: 999; background-color: black; border-radius: 11px; padding: 1px; opacity: 0.5; }

@media(max-width: 991px){
	.show--xs{ display: block; }
	.hide--xs{ display: none; }

	.txt--center-md-left{ text-align: left; }
	.rounded-xs-none{ border-radius: 0; }
	.lg-80{ width: 100%; }
	.overflow-table{ width: 100%; overflow-x: scroll; }
	.overflow-table table{ min-width: 600px; }
}

@media(max-width: 767px){
	.txt--center-xs-left{ text-align: left; }
	.txt--left-md-center{ text-align: center; }
	.txt--right-md-center{ text-align: center; }
	.show--xxs{ display: block; }
	.hide--xxs{ display: none; }
	.hide--xs-initial{ display:none; }
} 
/* container size adjustment */
@media (min-width: 1400px){
	.container{ max-width: 1100px; }
}

/* loading bar */
.loading-container{ width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 10; display: none; }
.loading-overlay{ width: 100%; height: 100vh; position: absolute; top: 0; left: 0; background: black; opacity: 0.4; }
.loading-container .spinner-border{ position: relative; position: absolute; top: 45%; width: 50px; height: 50px; }
.loading-type-2 .loading-overlay{ background:white; opacity: 1; }

.overlay-container{ width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 10; display: none; }
.overlay{ width: 100%; height: 100vh; position: absolute; top: 0; left: 0; background: black; opacity: 0.4; }


/* navi bar */
.navbar-expand-lg{ flex-wrap: wrap; }
.nav-item{flex: 1; font-size: 0.9rem}
.nav-item.yellow-nav{ background-color: #F6BF00; }
.nav-item.yellow-nav .nav-link{ color:white !important; }
.nav-item.nav-separator hr{ margin: 0.25rem 0; background-color: #00BCB5; } 
.navbar{ padding-top: 0; padding-bottom: 0; }
.navbar-light .navbar-nav .nav-link{ padding-left: 0; padding-right: 0; }
.navbar-light .navbar-toggler{ border: none !important;  color: white; padding: 0 !important; }
.navbar-toggler:focus,.navbar-toggler:active,.navbar-toggler-icon:focus { outline: none; box-shadow: none; }
.navbar-nav .nav-link{ color: #00BCB5 !important; font-family: 'LotussSmartHL-Medium', Arial; }
.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus{ background-color: #00BCB5; color: white !important; border: none; }
.dropdown-toggle::after{ display: none; }
.dropdown-menu { margin-top: 0 !important; padding: 0 !important; overflow: hidden; border: none; background-color: white; border-radius: 1.2rem; border-top-left-radius: 0; border-top-right-radius: 0; }
.dropdown:nth-last-child(-n+3) .dropdown-menu{ right:0; left: unset; }
.dropdown-menu li:last-child{ margin-bottom: 10px; }
/*.dropdown-menu.show{ display: flex }*/
.dropdown-item{ color: #999; padding: .5rem 1rem; }
.dropdown-item:hover{ color: #00BCB5; background-color: transparent !important; }

.search-box{ position: relative }
.search-box .btn-search{ position: absolute; right: 15px; top: 0px; }
.search-page, .search-page:focus, .search-page:active{ display: initial; background-color: transparent; border: 2px solid white; color: white; padding: .275rem .75rem; }
.search-page::placeholder{ color: white }
.header-ico i{ margin-right: 25px; }
.header-ico a{ color: white; }
@media (min-width: 992px){
	.navbar-nav{ width: 100%; }
	.navbar-nav .nav-link { padding: 1rem .5rem; text-align: center; }
}
@media (max-width: 991px){
	.navbar-expand-lg{ position: absolute; z-index: 2; background-color: white; min-width: 320px; width: 80%; max-height: 100vh; overflow-y: scroll; }
	.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover{ background-color: white; color: #00BCB5 !important; text-decoration: none; }
	.nav-item.dropdown:first-child{ padding-top: .25rem; } 
	.nav-item.dropdown:last-child{ padding-bottom: .25rem; } 

	.dropdown-toggle::after{ display: inline-block; position: absolute; right: 0; top: 20px; }
	.dropdown-menu.show{ display: block; }
	.dropdown-item{ padding: .25rem 0; color: #666; }
	.header-ico i { margin-right: 15px; display: inline-block; }
	.search-box{ position: absolute; bottom: -50px; z-index: 2; left: 0; right: 0; text-align: left; margin: 0 15px; }
	.search-page, .search-page:focus, .search-page:active{ width: 100%; background-color: #00BCB5; border-color: #00BCB5; }
}

@media(max-width: 767px){
	.navbar-brand{ margin-right: .5rem; }
	.header-ico i { margin-right: 7px; }
	.header-ico i img{ max-width: 25px !important; }
	.header-ico i.btn-shopnow img{ max-width: 70px !important; }
	.mobile-nav{ border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
}


/* pagination */
nav .pagination{ justify-content: center; align-items: center; }
.pagination li.page-item{ margin: 0 3px; }
.page-link{ border-radius: 5px; background-color: transparent !important; border-color: #00BCB5 !important; color: #00BCB5 !important; padding: .1rem .6rem; }
.active .page-link{ background-color: #00BCB5 !important; color: white !important; }


/* slick slider */
.header, .header .container, .newsletter, .newsletter .container{ position: relative; }
.newsletter{ padding: 25px 0; background-color: white; }
.slick-slide img{ width: 100%; }
.carousel-next, .carousel-prev{ border: 1px solid black; padding: 1px; width: 30px; height: 30px; border-radius: 50%; text-align: center; position: absolute !important; top: 45%; left: 25px; z-index: 1; cursor: pointer; }
.carousel-next{ left: unset; right: 25px; }
.catalogue-carousel-next, .catalogue-carousel-prev{ border: 1px solid black; padding: 1px; width: 30px; height: 30px; border-radius: 50%; text-align: center; position: absolute; bottom: 10px; left: 20%; z-index: 1; cursor: pointer; }
.catalogue-carousel-next{ left: unset; right: 20%; }
.slick-arrow i{ margin-top: 4px; font-size: 18px; color: black; }

.slick-dots{ height: 40px; }
.slick-dots li:only-child { display: none; }
@media(max-width: 767px){
	.carousel-next{ right: 5px } 
	.carousel-prev{ left: 5px }
	.catalogue-carousel-next{ right: 0; }
	.catalogue-carousel-prev{ left: 0; }
}


/* homepage */
.box{ border-radius: 2.5rem; overflow: hidden; margin-bottom: 30px; padding-top:15px; padding-bottom: 15px; background-color: white; position: relative; }
.box img{ max-width: 100%; }
.box .box-header, .box .box-footer{ padding: 0 15px; }
.box .box-content{ padding: 15px; }
.bottom-sticker{ position: absolute; bottom: 15px; width: 100%; }


/* newsletter */
.newsletter-form{ /*padding-top: 25px;*/ }
.newsletter form input[type=text], .search-page{ border-radius: 1.4rem; }
.newsletter form .row{ padding-bottom: 15px; }

@media(max-width: 767px){
	.newsletter{ text-align: center; }
}


/* brands */
section.white-box{ padding-top: 0; }
.white-box .container{ margin-top: -50px; background-color: white; }
.container-inner{ padding: 25px 50px; }
.sub-navi{ display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.sub-navi div{ margin: 0 15px 15px; }
.sub-navi .btn{ background-color: #f5f5f5; border: none; color: #9d9d9d; font-family: "LotussSmartTX-Bold" Arial; }
.sub-navi .btn.active, .sub-navi .btn:hover{ color: white; }
.txt--line { width: 100%; text-align: center;  border-bottom: 1px solid #F7BE00;  line-height: 0.1em; margin: 10px 0 20px; } 
.txt--line span { background:#fff; padding:0 10px; }

@media(max-width: 767px){
	section.white-box{ background-color: white; }
	.white-box .container{ margin-top: 0px;}	
	section.brands{ padding: 0; }
	.brands .container{ margin-top: 0; }
	.container-inner{ padding-left: 15px; padding-right: 15px; }
	.sub-navi div{ margin: 0 auto 7px; width: 100%; }
	.sub-navi div a{ margin-left: 5px; margin-right: 5px; width: 100%; }
}


/* own brands */
.ob-category-container .box{ cursor: pointer; outline: 1px solid #F9BE00; outline-offset: -1px; border-radius: 1.5rem; border-bottom: none; }
.ob-category-container .box .inner-box { background-color: #F9BE00; }
.ob-category-container .box .box-content { color: white; font-family: "LotussSmartHL-Medium" }

.ob-product-container .box{ cursor: pointer; outline: 1px solid black; outline-offset: -1px; border-radius: 1.5rem; border-bottom: none; }
.ob-product-container .box .box-content { color: white; font-family: "LotussSmartHL-Regular"; color: black; }
.ob-product-desc-container{ flex: none; width: 100%; position: absolute; display: none; }

.ob-product-item.active .box{ background-color: #00BCB4; outline: 1px solid #00BCB4; }
.ob-product-item.active .box .box-content{ color: white; }
.product-sub-img, .product-main-img{ border: 1px solid #C8C8C8; }
.product-sub-img{ cursor: pointer; }
.product-sub-img.active{ border-color: #00BCB4; }
.ob-product-title{ font-size: 140%; }
.btn-product-enquiry{ background-color: transparent; color: #00BCB5; border-color: #00BCB5; border-radius: 1rem; min-width: 140px; padding: .5rem 1rem }
.btn-product-enquiry:hover{ background-color: #00BCB5 !important; color: white !important; border-color: #00BCB5 !important; }
#own-brands-form input, #own-brands-form select, #own-brands-form textarea, .voucher-upload{ width: 100%; margin: 10px 0; padding: 7px 15px; border: 1px solid #cecece; color: #888 }


/* services */
/*table.border-inner{ border-spacing: 0; border-collapse: separate; }*/
table.border-inner th{ background-color: #00BCB5; color: white; padding: 10px 15px; }
table.border-inner th { border: solid 1px white; border-bottom: none; }
table.border-inner th:first-child{ border-top-left-radius: 15px; border-right: 1px solid white; border-left: none }
table.border-inner th:last-child{ border-top-right-radius: 15px; border-left: 1px solid white; border-right: none }
table.border-inner td{ border: 1px solid #00BCB5; padding: 10px 15px }
table.no-border, table.no-border th{ border: none !important; }
table.table-inner-white td{ background-color: white; }

.button-item{ padding: 15px 5px; border: 1px solid #00BCB5; color: #00BCB5; background-color: white; cursor: pointer; border-right: none; }
.button-item:last-child{ border-right: 1px solid #00BCB5; }
.button-item.active{ background-color: #00BCB5; color: white; }
.button-item:first-child{ border-top-left-radius: 15px; border-bottom-left-radius: 15px; }
.button-item:last-child{ border-top-right-radius: 15px; border-bottom-right-radius: 15px; }
.button-item i{ font-size: 42px; font-style: normal; }
.button-item p{ font-size: 15px; }
.button-item.active i:before{ color: white !important; }
.button-item-container{ display: none; }
.button-item-container:first-child{ display: block; }

.region-table-container table{ width: 100%; text-align: center; }

.faq-title{ font-family: 'LotussSmartHL-Medium'; }
.faq-content{ font-family: 'LotussSmartHL-Regular'; font-size: 0.9rem; margin-bottom: 25px; }

@media(max-width:767px){
	.button-item{ width: 47%; margin: 1.5%; border-radius: 15px; border: 1px solid #00BCB5; }
}


/* stores */
.stores select{ width: 200px; border: none; border-radius: 1.4rem; background-color: white; padding: 5px 15px; }
.stores-ico{ width: 25px; }

@media(max-width: 1200px){
	.stores-feature span{ width: 100%; font-size: .7rem; margin-bottom: 5px; }
}

@media(max-width: 991px) and (min-width: 768px){
	.stores-feature span{ width: 100%; display: block; font-size: .7rem; margin-bottom: 5px; }
}

.stores .box{ border-radius: 2.5rem; overflow: hidden; margin-bottom: 30px; padding-bottom: 0; background-color: white; position: relative; }
.stores .box img{ max-width: 100%; }
.stores .box .box-header, .box .box-footer{ padding: 0 15px; }
.stores .box .box-content{ padding: 15px; padding-bottom: 15px; }
.stores .bottom-sticker{ position: unset; margin-bottom: 15px; width: 100%; }
.stores .box-enquiry{ background-color: #006451; color: white; padding-bottom: 25px; padding-top: 25px; }
.stores .box-adspace{ background-color: #EA8699; color: white; padding-bottom: 15px; padding-top: 25px; }
.long-box{ min-height: 315px; }
.stores .box-enquiry .bottom-sticker, .stores .box-adspace .bottom-sticker{ position: absolute; bottom: 15px; margin-bottom: 0 }
.stores .box-enquiry a, .stores .box-adspace a{ border-color: white; color: white; text-decoration: underline; }

@media(max-width: 767px){
	.stores .bottom-sticker{ position: relative; bottom: 0; padding-bottom: 15px; }
	.stores .box-content{ padding-bottom: 5px !important; }
	.stores .box-adspace div, .box-enquiry{ flex: 1 0 0%; text-align: left !important; }
	.stores .box-adspace .box-content, .stores .box-enquiry .box-content{ padding: 0; padding-right: 5px !important;padding-left: 1.5rem !important; }
	.stores .box-adspace .bottom-sticker, .stores .box-enquiry .bottom-sticker{ position: relative; bottom: unset; padding: 0; padding-right: 1.5rem !important; }
}


/* sustainability */
.sustainability-separator{ width: 5% !important; margin-top: 40px; }
.heart-corporate-txt{ font-size: .85rem; margin-bottom: 0; }
.btn-initiative{ border: 1px solid white; padding: 1px; width: 30px; height: 30px; border-radius: 50%; text-align: center; float: right }
.btn-initiative a{ color: white; }

@media(max-width: 992px){
	.sustainability-separator{ width: 100%; margin: 0 auto; text-align: center; }
}


/* corporate */
.governance-box-ico{ margin-top: -35px; margin-bottom: 15px; }
.governance-policies{ padding-bottom: 120px !important; position: relative; }
.governance-policies img{ position: absolute; bottom: 10px; }

@media(max-width: 1199px) and (min-width: 992px){
	.governance-policies h6{ font-size: 0.9rem; }
}

/* voucher */
#voucher-form input, #voucher-form select, #voucher-form textarea, .voucher-upload{ width: 100%; margin: 10px 0; padding: 7px 15px; border: 1px solid #cecece; color: #888 }
/*#voucher-form .deno{ width: 50%; }
#voucher-form .quantity{ width: 25%; }*/
.voucher-upload{ text-align: right; }
#voucher-form .upload-span{ margin-top: 5px; float: left; }
#voucher-form .btn-upload { background-color: #888; color: white; border-radius: 1.4rem; padding: .11rem .75rem; }
#voucher-form input[type=number]{-webkit-appearance: none; -moz-appearance: none;}
#voucher-form select{
 	-webkit-appearance: none;
	-moz-appearance: none;
	background: transparent;
	background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
	background-repeat: no-repeat;
	background-position-x: 98%;
	background-position-y: 7px;
}

/* career */
.career-search-bar{ background-color: #00BCB4; border-radius: 15px; color: white; padding: 25px; margin-bottom: 1rem; }
.career-search-bar select option:disabled{ display: none; }
.career-not-found{ text-align: center; border: 1px solid #B5B5B5; border-radius: 15px; color: #B5B5B5; padding: 15px; }
.career-item{ padding-left: 25px; padding-right: 25px; }
.div-half{ width: 50%; float: left; }
.career-resume-form-top{ border-top-left-radius: 25px; border-top-right-radius: 25px;background-color: #F9BE00; color: white; padding: 15px; }
.career-resume-form-bottom{ border: 1px solid #F9BE00;border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; padding: 15px; }
.career-detail-bar{ background-color: #F5F5F5; border-radius: 10px; padding: 15px; }
#career-enquiry-form select {
	appearance: none;
	background-color: transparent;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAwMCAxMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KICA8cGF0aCBmaWxsPSJncmF5IiBkPSJNMTAsMjMyLjdsNDkwLDUzNC41bDQ5MC01MzQuNUgxMHoiIC8+DQo8L3N2Zz4=);
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 15px;
}
.btn-education-addon, .btn-work-addon{ max-width: 60px; background-color: #F4F2F2; }
.language-holder label{ margin-left: 5px; }
.post-upload-career{ display: none; }
#career-form-thankyou{
	position: fixed;
	top: 10%;
	left: 0;
	right: 0;
	z-index: 11;
	display: none;
}
#career-form-thankyou div{ background-color: white; }
.err{ border-color: red; }
select option:disabled { color: #ccc; opacity: .5; }

@media(max-width: 767px){
	.div-half{ width: 100%; display: block; text-align: center; }
	.press-content table.media-table td:last-child{ border-top: none; }
}


/* recipes */
.accordion-item{ border: none; }
.accordion-body{ 
	position: relative;    
	border: 1px solid rgba(0,0,0,.125);
    border-top: none;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px; 
}

@media(max-width: 767px){
	/*.nutrition-fact-container{ 
	  overflow-x: scroll;
	  margin-left: 7em;
	  overflow-y: visible;
	  padding: 0; }
	.nutrition-fact-container table tr td:first-child{
		position: absolute;
	  width: 7em;
	  left: 0;
	  top: auto;
	  border-top-width: 1px;
	}
	.nutrition-fact-container table tr td:first-child:before{ content: 'Row '; }*/
	.nutrition-fact-container{ overflow-x: scroll; }
}

/* contact us */
section.contact-us{ background-image: url(../images/contact-us/bg-contactus.png); background-size: cover; }

@media(max-width: 768px){
	section.contact-us{ background-image: url(../images/contact-us/bg-contactus-mobile.png); }
}

/* search result */
.search-result-container{ padding: 45px 30px; }

/* leadership */
.leadership-name{ font-size: 1.3rem; font-family: 'LotussSmartHL-Bold'; font-weight: bold; color: #00BCB5; }
@media(max-width: 1200px){
	.leadership-name{ font-size: 1.1rem; }
}

/* press release */
.press-content{ color: #575756 !important; }
.press-content a{ color: #0d6efd !important; }
.press-content p{ margin-bottom: 20px; }
.press-content table td{ border: 1px solid black; padding: 10px !important; }
@media(max-width: 767px){
	.press-content table td{ display: block;  }
	.press-content table.media-table td:last-child{ border-top: none; }
}


/* mylotuss page */
/* fieldset and legend */
fieldset.side-border {border: 1px solid #5A2B82;border-radius: 15px; }
legend.side-title{ font-size: 1.4em; font-weight: bold; margin: 0 auto 25px; padding: 10px 20px; width: 70%; background-color: #5A2B82; border-radius: 25px; }

@media(max-width: 767px){
	legend.side-title{ width:85%; font-size: 1em; }
}

/* kongsi ceria 2023 */
.c-spacing{ padding:calc(0.75rem * .5) }
.ceria-tab-title{ border: 2px solid #00BCB5; cursor:pointer; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 10px 0 }
.ceria-tab-title:not(:first-child){border-left: none;}
.ceria-tab-title.active{ background-color: #00BCB5; }
.campaign-nav .nav-item{ border-bottom:1px solid #3C3C3C; }
.campaign-nav .nav-item:last-child{ border-bottom: none; }
.campaign-nav .nav-link{ padding-top: 1.25rem; padding-bottom: 1.25rem; line-height: 1.2}
.campaign-nav .nav-link.active, .campaign-nav .nav-link:hover{ background-color:#7ddcd7; color:#575756 }
.rahmah-product{ width:33%; float:left; padding: 0 15px; }
.txt--red span{ font-size: 130% }
.txt--red span.smaller{ font-size:65%; }
.rahmah-slick .slick-track{ display: flex !important; }
.rahmah-slick .slick-slide{ height:inherit !important;}
.rahmah-slick .carousel-prev{ left: -15px; }
.rahmah-slick .carousel-next{ right: -15px; }
.bg-video-ceria-2023-desktop{ background-image: url(../images/campaign/lotuss-kongsi-ceria-2023/bg_video.png); background-repeat:repeat-y; background-size:cover; --bs-gutter-x: 0 }
.video-shadow-purple{
	box-shadow: 10px 10px 0px 0px rgba(99,51,140, 1);
	-webkit-box-shadow: 10px 10px 0px 0px rgba(99,51,140, 1);
	-moz-box-shadow: 10px 10px 0px 0px rgba(99,51,140, 1);
}
.video-shadow-red{
	box-shadow: 10px 10px 0px 0px rgba(232,38,31, 1);
	-webkit-box-shadow: 10px 10px 0px 0px rgba(232,38,31, 1);
	-moz-box-shadow: 10px 10px 0px 0px rgba(232,38,31, 1);
}


@media(max-width: 991px){
	.bg-video-ceria-2023-desktop{ background-image: none; --bs-gutter-x: 1.5rem }
	.bg-video-ceria-2023-mobile{ background-image: url(../images/campaign/lotuss-kongsi-ceria-2023/bg_video.png); background-repeat:repeat-y; background-size:cover }
	.ceria-tab-title:not(:first-child){border: 2px solid #00BCB5;}
	.ceria-tab-title:nth-last-child(2), .ceria-tab-title:last-child{ border-top:none;  }
	.ceria-tab-title:nth-child(2), .ceria-tab-title:last-child{ border-left:none;  }
}

@media(max-width: 600px){
	.rahmah-product{ width:100%; border:none }
	.campaign-nav .nav-link{ padding: .75rem; }
}




/* footer page side bar */
ul.side-nav{ list-style: none; padding: 0; }
ul.side-nav li{ margin-bottom: 12px; font-family: "LotussSmartHL-Medium";  }
ul.side-nav li a{ color: #575756; }
ul.side-nav li a.active, ul.side-nav li a:hover{ color: #00BCB5; }

/* text display */
.txt--container p{ margin-bottom: 15px; }
.table-valign-top td{ vertical-align: top !important; border-top: 1px solid black; border-bottom: 1px solid black; padding: 15px; }

/* footer */
footer{ font-size: 12px; padding-top: 40px; padding-bottom: 40px; }
footer b{ font-size: 14px; }
footer p{ line-height: 25px; }
footer a{ text-decoration: none; color: white; }
.footer-ico{ padding-bottom: 10px; }
.footer-ico i { margin-right: 25px }
.footnote{ line-height: 19px; font-size: 12px; }



/* mobile navi animation */
.animated-icon {
	width: 30px;
	height: 20px;
	position: relative;
	margin: 0px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}

.animated-icon span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.animated-icon span { background: white; }
.animated-icon span:nth-child(1) { top: 0px; }
.animated-icon span:nth-child(2) { top: 10px; }
.animated-icon span:nth-child(3) { top: 20px; }

.animated-icon.open span:nth-child(1) {
	top: 11px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
}

.animated-icon.open span:nth-child(2) {
	opacity: 0;
	left: -60px;
}

.animated-icon.open span:nth-child(3) {
	top: 11px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

/* slick slider dots */
.slick-dots {
  list-style: none;
  display: block;
  text-align: center;
  margin: -40px auto 0;
  padding: 0; 
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 13px;
  width: 13px;
  margin: 0 5px;
  cursor: pointer;
  background-color: white;
  border-radius: 50%;
  opacity: 0.4;
}
.slick-dots .slick-active{
	opacity: 1;
}

.slick-dots li button{
	display: none;
}

.catalogue-slick .slick-dots{
	margin-top: 10px;
}
.catalogue-slick .slick-dots li{
	border: 1px solid #999;
	border-radius: 50%;
	opacity: 1;
}
.catalogue-slick .slick-dots .slick-active{
	background-color: #00BCB5;
	border-color: #00BCB5;
}

.campaign-slick .slick-dots, .rahmah-slick .slick-dots{
  list-style: none;
  display: block;
  text-align: center;
  margin: 15px auto 0;
  padding: 0; 
}
.campaign-slick .slick-dots li, .rahmah-slick .slick-dots li {
  background-color: #666;
}


/* accordion */
.accordion-button::after{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.accordion-button:not(.collapsed)::after{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }

/* cny2024 css */
/* container size adjustment */
@media (min-width: 1400px){
	.cny-2024 .container{ max-width: 1320px; }
}

.cny-2024 div{ position:relative; }
.cny-2024 .txt--red{ color:#FF1D24; }
.cny-2024 .video-container{ background-color: #FFBB00; }
.cny-2024 .cny-signup-container{ position: absolute; top: 0; left: 0; right: 0; }
.cny-2024 .cny-btn-container{ position: absolute; bottom: 16%; left: 0; right: 0; }
.cny-2024 .cny-signup-container .btn, .cny-2024 .cny-btn-container .btn{ font-size: 120%; border-radius: 45px; padding: 7px 50px; }
.cny-2024 .kol-container-lg{ max-width:80%; margin:0 auto; padding-bottom: 170px; }
.cny-2024 .kol-container-lg img{ border-radius:50%; }
.cny-2024 .kol-container-lg .kol-info{ max-width:280px; min-height: 210px; margin:-15px auto 0; background-color:#F9E7D2; color: black; border-radius:15px; padding:15px 10px; font-size:140%;  }
.cny-2024 .kol-container-lg .kol-info div{ width:100% }
.cny-2024 .kol-container-lg .kol-info h4{color:#FF1D24;}
.cny-2024 .dragon-tail{ position:absolute; right: 0; bottom: -17%; max-width: 420px; z-index:1 }
.cny-2024 .activity-container{ background-color: #FF1D25; z-index:2 }
.cny-2024 .activity-container .activity-title{ margin-top: -125px; }
.cny-2024 .activity-container .activity-box{ background-color: #F9E7D2; border: 5px solid #FFBB05; border-radius:25px; margin:-85px 15px 0; padding:50px 10px 30px }
.cny-2024 .activity-link{ position:absolute; left: 0; right: 0; bottom:10%; width:100%; text-align:center; }

.cny-2024-mobile .img-full { width: 100%; margin-top:-1px }
.activity-slick .slick-dots, .kol-slick .slick-dots{ margin-top: 10px; }
.activity-slick .slick-slide img{ width: auto; margin:0 auto; }
.activity-slick .slick-dots li { background-color: #FF1D24 }



/* truck moving css */
.cny-2024 .truck-container{ width: 100%; height:130px; overflow:hidden; position:absolute; bottom:0; left:0; }
.truck {
  left: -300px;
  position: absolute;
  -webkit-animation: linear infinite;
  -webkit-animation-name: run;
  -webkit-animation-duration: 5s;
}

.truck.second{ -webkit-animation-delay: .9s }
.truck.third{ -webkit-animation-delay: 1.8s } 
.truck.fourth{ -webkit-animation-delay: 2.7s } 
@-webkit-keyframes run {
  0% {
    left: -300px;
  }
  50% {
    left: 50%;
  }
  100% {
    left: calc(100% + 300px);    
  }
}
@-webkit-keyframes run2 {
  0% {
    left: -110px;
  }
  50% {
    left: 50%;
  }
  100% {
    left: calc(100% + 110px);    
  }
}
/* end of truck moving css */


@media (max-width: 1024px){
	.cny-2024 .cny-signup-container{ top: -25px }
	.cny-2024 .kol-container-lg .kol-info{ font-size:120%; }
	.truck{ max-height:80px }
	.cny-2024 .txt--xxl{ font-size:140%; }
	.cny-2024 .cny-signup-container .btn, .cny-2024 .cny-btn-container .btn{ font-size: 100%; border-radius: 45px; padding: 5px 30px; }
	.cny-2024 .activity-link{ bottom:8%; }
}

@media(max-width: 768px){
	.cny-2024 .dragon-tail{ max-width:250px; bottom: -13%; }
	.cny-2024 .activity-link img{ max-width:400px !important; }
}

@media(max-width: 767px){
	.cny-2024 .cny-signup-container .btn, .cny-2024 .cny-btn-container .btn{ font-size: 90%; border-radius: 45px; padding: 5px 15px; }
	.cny-2024 .cny-signup-container{ position: absolute; bottom: 10px; left: 0; right: 0; top: auto; }
	.cny-2024 .txt--xxl{ font-size:90%; }
	.cny-2024 .kol-container-lg .kol-info{ min-height:auto; }
	.cny-2024 .activity-link{ bottom: 6%; }
	.cny-2024 .dragon-tail{ bottom:-16%; max-width:180px }
	.truck{ max-height:50px; -webkit-animation-name: run2; }
	.truck.second{ -webkit-animation-delay: 1s }
	.truck.third{ -webkit-animation-delay: 2s } 
	.truck.fourth{ -webkit-animation-delay: 3s } 
}

@media(max-width: 375px){
	.cny-2024 .cny-signup-container{ bottom: 5px; }
}

@media(max-width: 320px){
	.cny-2024 .cny-signup-container{ bottom: -5px; }
}
/* end of cny2024 css */

/* raya2024 css */
@media (min-width: 1400px){
	.raya-2024 .container{ max-width: 1320px; }
}

.raya-2024 div{ position:relative; }
.raya-2024 .row > * {padding-left: 0; padding-right: 0}
.raya-2024 .txt--red{ color:#FF1D24; }
.raya-2024 .raya-activity-link{ background-color: #FFBF04; padding: 10px 10px 4px; color: white; border-radius: 10px; }
.btn.btn-raya{ background-color: #00715A; color:white; }
.btn.btn-raya2{ background-color: #FBF9E5; color:#00715A; padding: 10px 15px }
.txt--raya{ color:#00715A }
.txt--raya-l{ font-size:140%; line-height:1.2 }
.raya-2024 .video-container{ background-color: #FFBB00; }
.raya-2024 .raya-signup-container{ position: absolute; top: 0; left: 0; right: 0; }
.raya-2024 .raya-btn-container{ position: absolute; bottom: 16%; left: 0; right: 0; }
.raya-2024 .raya-signup-container .btn, .raya-2024 .raya-btn-container .btn{ font-size: 120%; border-radius: 45px; padding: 7px 50px; }
.raya-2024 .kol-bg{ background-image: url(../images/raya-2024/desktop/04-kol-bg.png); background-repeat: no-repeat; }
.raya-2024 .kol-container-lg{ max-width:80%; margin:0 auto; padding-bottom: 100px; }
.raya-2024 .kol-container-lg img{ border-radius:50%; }
.raya-2024 .kol-container-lg .kol-info{ max-width:280px; min-height: 160px; margin:-15px auto 0; background-color:#00715A; color: white; border-radius:15px; padding:15px 10px; font-size:140%;  }
.raya-2024 .kol-container-lg .kol-info div{ width:100% }
.raya-2024 .activity-container{ position: absolute; top: 0; left: 0; right: 0; max-width: 70%; margin: 0 auto; z-index:2 }
.raya-2024 .activity-container .activity-box{ background-color: #C7D503; border-radius:25px; margin:-110px 15px 0; padding:90px 15% 30px; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5); }
.raya-2024 .activity-link{ position:absolute; left: 0; right: 0; bottom:10%; width:100%; text-align:center; }

.raya-2024 .btn-resepi{ position: absolute; text-align: center; bottom: 12%; width: 100%; }
.raya-2024 .txt-resepi{ color: #006650; }

.raya-2024-mobile .img-full { width: 100%; margin-top:-1px }
.activity-slick .slick-dots, .kol-slick .slick-dots{ margin-top: 10px; }
.activity-slick .slick-slide img{ width: auto; margin:0 auto; }
.activity-slick .slick-dots li { background-color: #FF1D24 }

@media (max-width: 1280px){
	.txt--raya-l{ font-size:120%; }
}

@media (max-width: 1024px){
	.raya-2024 .kol-container-lg .kol-info{ font-size:120%; }
	.truck{ max-height:80px }
	.raya-2024 .txt--xxl{ font-size:140%; }
	.raya-2024 .raya-signup-container .btn, .raya-2024 .raya-btn-container .btn{ font-size: 100%; border-radius: 45px; padding: 5px 30px; }
	.raya-2024 .activity-link{ bottom:8%; }\
	.raya-2024 .btn-resepi{ bottom:13%; }
}

@media(max-width: 768px){
	.raya-2024 .activity-link img{ max-width:400px !important; }
	.raya-2024 .btn-resepi{ bottom:15%; }
}

@media(max-width: 767px){
	.txt--raya-l{ font-size:140%; }
	.raya-2024 .raya-signup-container .btn, .raya-2024 .raya-btn-container .btn{ font-size: 90%; border-radius: 45px; padding: 5px 15px; }
	.raya-2024 .txt--xxl{ font-size:90%; }
	.raya-2024 .kol-bg{ background-image: none; }
	.raya-2024 .kol-container-lg{ padding-bottom: 0; }
	.raya-2024 .kol-container-lg .kol-info{ min-height:auto; }
	.raya-2024 .activity-container{ max-width:100%; padding-left:15px; padding-right:15px; position:relative; margin-top:50px; margin-bottom:70px; }
	.raya-2024 .activity-container .activity-box{ margin-top: -80px; padding-left: 15px; padding-right: 15px;}
	.raya-2024 .activity-link{ bottom: 6%; }

	.raya-2024 .btn-resepi{ bottom:295px; }
}

@media(max-width:320px){
	.raya-2024 .btn-resepi{ bottom:285px; }
}

/* end of raya2024 css */