/*
 Theme Name:   Planti
 Theme URI:    https://understrap.com
 Description:  Understrap Child Theme
 Author:       the Understrap Contributors
 Author URI:   https://github.com/understrap/understrap-child/graphs/contributors
 Author URI:   https://nikolaosdimitriou.com
 Template:     understrap
 Version:      1.2.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  planti.ai
 Tags: one-column, custom-menu, featured-images, theme-options, translation-ready
 GitHub Theme URI: understrap/understrap-child
*/
.pll-parent-menu-item > ul.sub-menu > li {
	display: block;
}

@font-face {
    font-family: 'Aeonik';
    src: url('fonts/Aeonik/aeonikthai-regular.woff2') format('woff2'),
        url('fonts/Aeonik/aeonikthai-regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

html {
   --whiteglove: #F2EFED;
   --lightgrey: #FAF7F5;
  
    --white: #FFFFFF;
    --black: #000000;

    --blush: #F8C9CC;
    --orange: #FA6934;
    --purple: #AAA8FF;
}

.color-white {
    color: var(--white);
}

.color-lightgrey {
    color: var(--lightgrey);
}

.color-black {
    color: var(--black) !important;
}

.background-white {
    background: var(--white);
}

.background-whiteglove {
    background: var(--whiteglove) !important;
}

.background-black {
    background: var(--black);
}

.background-lightgrey {
    background: var(--lightgrey);
}

.background-blush {
    background: var(--blush);
}

.background-purple {
    background: var(--purple);
}

.background-orange {
    background: var(--orange);
}

.attachment-fixed {
/*     background-attachment: fixed; */
}

.mask-two {
    mask: url(assets/shape-round-two.svg) no-repeat center;
    -webkit-mask: url(assets/shape-round-two.svg) no-repeat center;
    mask-size: 100%;
    -webkit-mask-size: 100%;
}

.mask-three {
    mask: url(assets/shape-round-three.svg) no-repeat center;
    -webkit-mask: url(assets/shape-round-three.svg) no-repeat center;
    mask-size: 100%;
    -webkit-mask-size: 100%;
}

.mask-x {
    mask: url(assets/shape-round-x.svg) no-repeat center;
    -webkit-mask: url(assets/shape-round-x.svg) no-repeat center;
    mask-size: 100%;
    -webkit-mask-size: 100%;
}

.back-two {
    background-image: url(assets/shape-round-two.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.back-three {
    background-image: url(assets/shape-round-three.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.back-x {
    background-image: url(assets/shape-round-x.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.back-finder {
    background-image: url(assets/finder-background.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.design-square.background-image.back-finder {
    min-height: 45vw;
    background-size: contain !important;
    padding: 100px 45px;
  min-height: 480px;
  padding: 80px 45px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

body {
    font-family: 'Aeonik' !important;
    font-weight: 400;
    font-size: 22px;
}

.font-bold {
    font-weight: 800;
}

.section-small-title {
    font-weight: 400;
    font-size: 15px;
    line-height: 150%;
    text-transform: uppercase;
}

.section-title {
    font-weight: 400;
    font-size: 60px;
    font-size: clamp(40px,1.8519vw + 33.3333px,60px);
    line-height: 105%;
    margin-bottom: clamp(20px, 6.6vw, 96px);
    margin-bottom: 24px;
}

.hero-title {
    font-weight: 400;
    font-size: clamp(47px, 4.3vw, 90px);
    line-height: 105%;
}

.home-hero a#go-next {
    position: absolute;
    bottom: 100px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 15px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--white);
    text-decoration: none;
}

a#go-next img {
    margin-right: 10px;
}

.text-uppercase {
    text-transform: uppercase;
}

.bordered-link, header nav ul li a {
    padding: 10px 24px;
	padding: 8px 12px;
    text-decoration: none;
    color: var(--white);
    font-size: 15px;
}

.offcanvas .menu-container nav ul li.pll-parent-menu-item li {
    display: block;
}
.offcanvas-body .menu-container nav .pll-parent-menu-item ul li.current-lang {
	display: none !important;
}
@media (max-width: 991px){
    .pll-parent-menu-item.current-menu-parent ul {
		height: auto !important;
        top: 24px;
        position: absolute;
        right: calc( 50% - 2px) !important;
    }
	.pll-parent-menu-item.current-menu-parent ul {
	  
    position: relative;
    right: 0 !important;
    width: 100%;
    justify-content: center;
	}
    
    .mobile-menu .pll-parent-menu-item.current-menu-parent ul {
        top: 32px;
		top: 40px;
		top: 0;
    }
}

.bordered-link:hover {
    color: var(--lightblue);
}

header nav ul li a:hover {
    text-decoration: underline;
	color: var(--white);
}

#menu-primary-menu {
    padding-left: 0;
    margin: 0;
    list-style: none;
}

header .planti-text {
    fill: var(--white);
}

.main-menu ul, .main-menu ul li {
    display: inline;
}

.back-img {
    background-repeat: no-repeat;
    background-size: contain;
}

.border-radius-16 {
    border-radius: 16px;
}

.border-radius-8 {
    border-radius: 8px;
}

.default-container {
    padding-left: 4.16vw !important;
    padding-right: 4.16vw !important;
}

.wide-container {
    padding-left: 4.16vw !important;
    padding-right: 4.16vw !important;
}

.default-section {
    padding-top: 120px;
    padding-bottom: 120px;
}

.padding-bottom-100 {
    padding-bottom: clamp(40px, 7vw, 100px);
}

.padding-bottom-200 {
    padding-bottom: clamp(80px, 14vw, 200px);
}

.padding-top-100 {
    padding-top: clamp(40px, 7vw, 100px);
}

.padding-top-200 {
    padding-top: clamp(80px, 14vw, 200px);
}

.extended-section {
    padding-top: 140px;
    padding-bottom: 140px;
}

.text-container.align-vertical {
    padding: 60px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}

.col-txt .text-container {
   font-style: 18px;
    line-height: 150%;
}

.col-txt .text-container strong {
    font-style: 24px;
    line-height: 140%;
}

.text-container p {
    width: 95%;
}

.opacity-60 {
    opacity: .6;
}

.font-14 {
    font-size: 14px;
    font-style: normal;
    font-weight: 380;
    line-height: 150%;
}

.font-18 {
    font-size: 18px;
    font-weight: 400;
    line-height: 150%;
}

.font-22 {
    font-size: 22px;
    font-weight: 400;
    line-height: 140%;
}

.font-24 {
    font-size: 24px;
    font-weight: 400;
    line-height: 140%;
}

.font-60 {
    font-size: 60px;
    font-weight: 400;
    line-height: 105%;
}

.font-80 {
    font-size: 80px;
    font-size: clamp(36px, 3.8889vw + 22px, 80px);
    font-weight: 400;
    line-height: 105%;
}

.medium-45 {
    font-size: 45px;
    font-weight: 400;
}

.border-bottom-grey {
    border-bottom: 1px solid #ccc;
    padding-bottom: 1em;
    margin-bottom: 1em;
}

.hero {
    height: 100vh;
    display: flex;
    align-items: center;
}

.hero > div, .hero > div > div {
    height: 100%;
}

.home-hero {
    height: 100vh !important;
}

.hero-cont {
    top: 0px;
    position: relative;
    display: flex;
    height: 100%; 
    justify-content: center; 
    flex-direction: column;
}

.background-image {
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.hover-scale img {
    transition: all ease .4s;
}

.hover-scale:hover img {
    transform: scale(1.04);
}

.color-white .square-link {
    color: var(--white);
}

.border-top-solid-light-grey {
    border-top: 1px solid var(--lightgrey);
}

.default-margin-bottom {
    margin-bottom: 120px;
}

.font-500 {
    font-weight: 500;
}

.height-100vh {
    height: 100vh;
}

.height-60vw {
    height: 60vw;
}

/* Header */

body.scrolled header {
    background: #F2EFEDBA;
    background: #292929ba;
}

header .dropdown-menu {
    background: rgba(123, 168, 126, 0.9)
    border-radius: 0;
}

header {
    transition: all .3s;
    background: transparent;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    z-index: 1000;
}

header #main-nav {
    background: transparent !important;
    padding: 0;
}

header #main-menu > li {
    padding: .5em;
}


.scrolled.logged-in.admin-bar header {
    top: 0;
}

.logged-in.admin-bar header {
    top: 32px;
}

.logged-in.admin-bar #page {
    position: relative;
}

header .container {
    width: calc(100% - 8.2vw);
    max-width: 100%;
    padding-left: 4.1vw;
    padding-right: 4.1vw;
    padding-top: 15px;
    padding-bottom: 15px;
}

header .container .row {
    align-items: center;
}

header .logo-container img {
    max-width: 280px;
}

header .menu-container ul {
  list-style-type: none;
  display: inline-flex;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
  margin: 0;
  padding: 0;
}

header .menu-container ul li {
  display: inline-flex;
  border-bottom: 3px solid transparent;
}

header .menu-container ul li a {
  padding: 20px 0;
  color: var(--white);
  color: var(--lightgrey);
  text-decoration: none;
}

header .menu-container .menu-item.current-menu-item.current_page_item, header .menu-container .menu-item:hover{
  border-bottom: unset;
}

header .menu-container .menu-item.current-menu-item.current_page_item a, header .menu-container .menu-item:hover a{
    color: var(--white);
}

header .secondary-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

header .secondary-menu ul li a, .mobile-menu .secondary-menu a {
  background: var(--green);
  color: var(--darkgreen);
  padding: 10px 20px;
  display: inline-block;
  line-height: 1;
  text-decoration: none;
}

header.dark-color .menu-container a {
    color: var(--darkblue);
}

.pll-parent-menu-item > a::after {
    content: "";
    background-image: url('assets/arrow-down.svg');
    width: 20px;
    height: 20px;
    display: inline-flex;
    background-position: center;
    background-size: contain;
}

.mobile-menu .pll-parent-menu-item > a::after {
	width: 26px;
	height: 26px;
	margin-left: 4px;
}

.pll-parent-menu-item.current-menu-parent a {
    padding: 5px;
    display: inline-flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.offcanvas.offcanvas-start-top#offcanvasExample {
transform: translate(0, -100%);
}
.offcanvas.offcanvas-start-top.show#offcanvasExample {
transform: translate(0, 0);
}

.offcanvas-button a {
    background: var(--black);
    padding: 8px;
    width: 28px;
    height: 28px;
    box-sizing: content-box;
    display: flex;
    align-items: center;
    flex-direction: column;
    border-radius: 50%;
    justify-content: center;
}

.offcanvas-button span {
    background: var(--white);
    height: 4px;
    width: 24px;
    border-radius: 20px;
    display: flex;
    flex-direction: row;
    margin: 4px auto;
}

#offcanvasExample.offcanvas.offcanvas-start.offcanvas-start-top.mobile-menu .main-menu li a {
    color: transparent;
}

#offcanvasExample.offcanvas.offcanvas-start.offcanvas-start-top.mobile-menu.show .main-menu li a {
    color: var(--black) !important;
}

#offcanvasExample.offcanvas.offcanvas-start.offcanvas-start-top.mobile-menu.hiding .main-menu li a {
    opacity: .2;
}

.offcanvas-body .main-menu a {
    font-size: 22px;
}

body[class*="page-template-page-map"] .hero {
    padding-bottom: 30vh;
}

body[class*="page-template-page-map"] .hero .col-12 {
    text-align: center !important;
    justify-content: center !important;
    width: 100%;
}

body[class*="page-template-page-map"] #address-form, 
body[class*="page-template-page-map"] #map {
    padding-left: 5vw;
    padding-right: 5vw;
}

body[class*="page-template-page-map"] #address-form {
    margin-bottom: 100px !important;
}

body[class*="page-template-page-map"] #map {
    background: var(--lightgrey);
}

body[class*="page-template-page-map"] .finder-map {
    margin-top: -38vh;
    position: relative;
}

/*
.offcanvas-button span:last-child {
    width: 10px;
    margin-left: 10px;
}*/

header .logo-container img {
    padding: 10px 0;
}

/* Mobile Menu - Offcanvas */

.offcanvas {
    transition: 0s ease-in-out !important;
}

.mobile-menu {
    width: 100% !important;
    max-width: 800px !important;
    background: var(--orange) !important;
    z-index: 100000 !important;
}
.mobile-menu .logo-container {
    max-width: 200px;
}

.mobile-menu .offcanvas-header {
    padding: 20px 32px;
}

.mobile-menu ul {
    list-style: none;
    padding: 0;
}

.mobile-menu .col-12.menu-container ul {
    height: 40vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.mobile-menu .col-12.menu-container ul li a {
    color: var(--white);
    text-decoration: none;
}

.mobile-menu li a {
    display: inline-block;
    width: auto;
    border-bottom: 3px solid transparent;
    transition: all ease .3s;
}
/*
.mobile-menu li:hover a {
    border-bottom: 3px solid var(--green);
}*/

.secondary-menu li:hover a {
    color: var(--white);
}

.offcanvas-body {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    text-align: center;
}

.offcanvas-header .btn-close {
    background: var(--black);
    border-radius: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding: 8px;
    top: 6px;
    opacity: .9;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.offcanvas-header .btn-close:focus, .offcanvas-header .btn-close:focus-visible {
    outline: 0;
    box-shadow: unset;
}

.offcanvas-header .btn-close span {
    background: var(--white);
    width: 24px;
    height: 4px;
    display: inline-block;
    line-height: 4px;
    transform: rotate(-45deg);
    position: relative;
    border-radius: 20px;
    top: 2px;
}

.offcanvas-header .btn-close span:nth-child(2) {
    transform: rotate(45deg);
    top: -2px;
}

/* Planti */


.round-button {
    background: var(--black);
    border-radius: 25px;
    padding: 16px 24px;
    color:  var(--white);
    transition: all ease .3s;
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 0 10px #bababa;
    display: inline-block;
}

.round-button.round-button-white {
    background: var(--white);
    color: var(--black);
    min-width: 200px;
}

.round-button.has-arrow::after {
    content: "+";
    background: var(--white);
    width: 1.25em;
    height: 1.25em;
    display: inline-flex;
    position: relative;
    color: var(--black);
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    margin: 0 5px 0 15px;
    border: 1px solid var(--black);

    background-image: url('assets/button-arrow.svg');
    background-repeat: no-repeat;
    content: "";
    background-size: contain;
    width: 35px;
    height: 35px;
}

.round-button.has-arrow.has-copy::after {
    background: white url('assets/copy-text.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px;
}

.round-button.has-arrow {
    display: inline-flex;
    align-items: center;
}

.round-button.has-arrow {
    padding: 10px 10px 10px 24px;
}

.round-button:hover {
    background: var(--white);
    color: var(--black);
}

.round-button.round-button-white:hover {
    background: var(--black);
    color: var(--white);
}

.middle-area.newsletter-form .new-social-list {
    max-width: 280px;
    text-align: center;
}

.middle-area.newsletter-form .social-link .social-icon {
  display: flex !important;
  margin-left: 10px;
  margin-right: 10px;
}

.middle-area.newsletter-form .social-link .round-button {
  display: inline-flex;
  align-items: center;
}

.middle-area.newsletter-form .social-link .round-button {
  background: #E8E5E3;
  padding: 12px 24px;
  min-width: 270px;
  box-shadow: none;
}

.middle-area.newsletter-form .social-link .round-button:hover {
  background: var(--black);
}

/* Footer */

footer {
    /*border-top: 1px solid;*/
}

footer .wrapper {
    padding-top: 40px; 
    background: #fff;
}

footer .top-row {
    padding-bottom: clamp(120px, 5.5556vw + 100px, 180px);
    padding-bottom: clamp(60px, 3.4556vw + 65px, 120px);
}  

.footer-tagline {
    display: flex;
    flex-wrap: wrap;
}

.footer-tagline img {
    vertical-align: top;
    margin-left: 8px;
}

.footer-tagline span {
    width: 100%;
    font-size: 0.7em;
	display: none;
}

.footer-social a {
    background: var(--black);
    padding: 10px;
    width: 40px;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    height: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transition: all ease .3s;
    margin: 0 6px;
}

.footer-social a:hover {
    background: var(--orange);
}

.footer-terms-widget-area ul {
    list-style-type: none;
    display: inline-block;
	padding: 0;
}

.footer-terms-widget-area ul li {
    display: inline-block;
    margin: 5px;
    color: var(--black);
}

.footer-terms-widget-area ul li a {
    text-decoration: none;
    color: var(--black);
}

/* Home */


/* Instagram Wall */


.ilp-embed-item > div {
    margin: 0;
    padding: 0;
    background-image: url('https://planti.ai/wp-content/uploads/2025/06/phone_3.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: center;
    flex-direction: column;
}


.ilp-embed-item iframe {
    /*background: var(--white);
    padding: 20px 32px 40px;
    width: 552px;
	*/
	background: transparent;
    padding: 29px 16px;
    width: auto;
    height: 600px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    justify-self: center;
    align-items: center;
    align-content: center;
    align-self: center;
    margin: 16px;
}

.ilp-embed-grid.owl-carousel .owl-prev {
    transform: rotate(-180deg);
}

.ilp-embed-grid.owl-carousel .owl-nav {
    position: absolute;
    top: calc(50% - 20px);
    width: 100%;
    height: 0;
}

.ilp-embed-grid.owl-carousel .owl-prev {
    left: 0;
    position: absolute;
}

.ilp-embed-grid.owl-carousel .owl-next {
    position: absolute;
    right: 0;
}

.row.recipe-container > div,
.all-menu-cont > div {
    padding: 0 !important;
}

.row.recipe-container.owl-carousel.owl-loaded .owl-nav {
    position: absolute;
    top: 55%;
    left: -100%;
    
    width: 130px;
    display: flex;
    justify-content: space-between;
}

.all-menu-cont.owl-carousel .owl-nav {
	width: 130px;
	display: flex;
    justify-content: space-between;
}

.owl-item .recipe-item {
    padding: 10px;
    margin: 5px;
}

.row.recipe-container.owl-carousel.owl-loaded .owl-nav button span, 
.inspired .owl-carousel .owl-nav button span,
.all-menu-cont.owl-carousel.owl-loaded .owl-nav button span {
    word-wrap: 40px;
    width: 40px;
    height: 40px;
    margin: 5px;
    border-radius: 50% !important;
    display: flex;
    justify-content: center;
    align-content: center;
    line-height: 1;
    align-content: center;
    align-items: center;
    color: var(--white);
    font-size: 0;
}

.recipe-container.owl-carousel .owl-nav {
    height: 0;
}

.recipe-container.owl-carousel .owl-nav button {
    line-height: 0 !important;
}

.recipe-container.owl-carousel .owl-nav span, 
.inspired .owl-carousel .owl-nav span,
.all-menu-cont.owl-carousel .owl-nav span
  {
    background: black url('assets/arrow-right.svg');
    background-repeat: no-repeat;
    background-position: center;
}

.recipe-container.owl-carousel .owl-nav, 
.recipe-container.owl-carousel .owl-dots {
    display: none;
}

.recipe-container.owl-carousel .owl-prev span,
.all-menu-cont.owl-carousel .owl-prev span {
    transform: rotateY(180deg);
}

.meals-section .recipe-item.col-12 {
    width: 100% !important;
}

/* Recipes */

.recipe-title-container {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    z-index: 1000;
    align-content: center;
    align-items: center;
    background: transparent;
    top: 0;
    transition: all ease .3s;
}

.recipe-title {
    background: var(--blush);
    padding: 16px 24px;
    border-radius: 25px;
    color: var(--black);
    line-height: 1;
	font-size: 18px;
}

body.lang-zhe .recipe-title {
	width: calc(100% - 90px);
	text-align: center;
	line-height: 1.1;
	border-radius: 50px;
}

.recipe-item > a {
    display: inline-block;
}

.recipe-item .box-it {
	margin: 25px 15px !important;
    display: inline-block;
}

.box-it {
    position: relative;
}

.box-it:hover .image-container {
    opacity: 1;
    background: var(--blush);
}

.box-it:hover .recipe-title-container {
    background: var(--orange);
}

/* Why How */

section.grocery-section {
    position: relative;
}

.half-color.grocery-section::before {
  content: "";
  position: absolute;
  background: var(--whiteglove) !important;
  width: 100%;
  height: 50%;
  top: 0;
}

.half-color.grocery-section {
    position: relative;
}

.grocery-section .container {
    position: relative;
    z-index: 10;
}

.grocery-section .row {
    padding: clamp(40px, 5vh, 60px) 0 !important;
    border-radius: 50px;
}

.grocery-section .section-text p {
    margin-bottom: 0 !important;
}

#grocery-list {
  height: 0;
}

#grocery-item-list {
	overflow: hidden;
}

.background-whiteglove.grocery-section img {
	width: 100%;
	max-width: 380px;
	display: block;
	margin: 0 auto;
}

.background-whiteglove.grocery-list > div > div.section-text {
	border: 1px solid #9E9E9E;
}

section.grocery-section {
	padding-bottom: 3rem;
}

#grocery-item-list.show {
  margin-top: -3rem;
  padding-bottom: 3rem;
}

#grocery-item-list.show #grocery-list {
  height: auto;
  margin-top: -3rem;
  padding-bottom: 3rem;
}

@media (min-width: 769px){
.grocery-section .img-col img {
opacity: 0;
max-width: 300px;
}
.background-whiteglove.grocery-section .background-image {
	background-position: 102% 50px !important;
	background-size: 440px !important;
	background-repeat: no-repeat !important;
}
}

@media (max-width: 768px){
.grocery-section .txt-col > div {
	width: 100%;
	display: flex;
	justify-content: center;
	text-align: center;
}
.lang-en .grocery-section .txt-col > div.section-title {
	max-width: 270px;
	text-align: center;
	margin: 0 auto;
}
.background-whiteglove.grocery-section .background-image {
	background-image: none !important;
}
.grocery-section .row {
	padding-bottom: 0 !important;
}
.grocery-section .img-col img {
  top: 100px;
  margin-top: -100px;
  position: relative;
}
.grocery-section .img-col {
  position: relative;
  overflow: hidden;
}
}

/* Finder Form */

.finder-form .bottom-area input {
    border-radius: 25px;
    border: none;
    padding: 10px 20px;
    width: 100%;
}

.restaurant-finder .hero-title, .restaurant-finder .hero-subtitle {
	max-width: 690px;
	margin-left: auto;
	margin-right: auto;
}

/* Map */


.all-menu-cont.owl-carousel .owl-nav {
    height: 0;
}

.all-menu-cont.owl-carousel .owl-nav button {
    line-height: 0 !important;
}

.all-menu-cont.owl-carousel .owl-nav {
    display: block !important;
    position: absolute !important;
    bottom: 0;
    right: 0;
}
 
.menu-item-text {
  background: #F2EEE8;
  min-height: 60px;
  text-align: center;
}

.menu-item-text {
  background: #F2EEE833;
  min-height: 80px;
  text-align: center;
  /* margin-bottom: 20px; */
  position: absolute;
  bottom: 0;
  padding: 0 15px 25px;
  width: 100%;
  font-size: clamp(18px, 1.25vw + 12px, 22px);
}

.menu-item-cont {
  position: relative;
  border-radius: 40px;
  overflow: hidden;
}

.brand-image {
  position: absolute;
  left: 20px;
  top: 20px;
}

.all-menu-cont .brand-image img {
	height: 80px;
	width: auto !important;
}

.brand-image img {
  height: 65px;
  height: 95px;
  width: auto;
}

.btn.category-btn {
  background: #e7e7e7;
  border-color: grey;
  color: black;
  padding: 6px 16px;
  border-radius: 25px;
  font-size: 14px;
  border-width: 2px;
  border-color: #8a8a8a;
}

.category-btn.active, .category-btn:active {
  border-color: #dadada;
  background: white;
}

.inside-button {
  width: 1em;
  margin-right: 8px;
}



@media (min-width: 100px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 100% !important;
    }
    .default-container {
        max-width: 100% !important;
    }
}

@media (max-width: 1920px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1800px !important;
    }
}
.fade-in {
    opacity: .5 !important;
    transition: opacity .6s ease-in-out,transform .9s ease-in-out;
    transform: translateY(15px);
}

.fade-in-visible {
    transition: opacity .6s ease-in-out,transform 0.9s ease-in-out;
    opacity: 1 !important;
    transform: translateY(0);
}

@media (min-width: 769px) and (max-width: 991px){
    .design-square.background-image.back-finder {
    min-height: 440px;
}
}

@media (max-width: 768px){
	
.all-menu-cont .owl-item {
    margin-right: 15px !important;
}

.all-menu-cont .active {
    margin-left: 25px;
}
	
.page-template-page-map-final .hero {
    background-position: 20% !important;
}

.recipe-title {
    font-size: 18px;
}

.design-square.background-image.back-finder {
    min-height: 75vw;
    background-size: contain !important;
    padding: 80px;
    padding: 10vw;
    padding: 10vw 12vw;
    
    min-height: 400px;
    max-width: 80vw;
    margin-left: auto;
    margin-right: auto;
}

body.lang-tl .design-square.background-image.back-finder, body.lang-id .design-square.background-image.back-finder {
    padding: 12vw 15vw;
	
	padding: 10vw 8vw;
    max-width: 84vw;
    min-height: 460px;
}
	
.meals-section .owl-carousel .owl-stage {
    /* stagePadding adds both left/right; kill the left peek */
    padding-left: 0 !important;
    /* keep the right peek matching your JS setting */
    padding-right: 50px !important;
  }
.menu-section .owl-carousel .owl-stage {
	padding: 0 !important;
	display: flex;
}
/* 
.meals-section > div {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

*/
	
.meals-section > div,
.menu-section > div {
    padding: 0 !important;
}
	
.meals-section > div > div,
.menu-section > div > div {
    margin: 0 !important;
}

.meals-section .col-img,
.menu-section .col-img {
    padding-left: 0;
    padding-right: 0;
}
 
.meals-section .col-txt,
.menu-section .col-txt {
    padding-left: 5vw !important;
    padding-right: 5vw !important;
}
	
.home .background-image {
    background-position: 64% !important;
}
.page-template-page-why-how .hero.background-image {
    background-position: 68% !important;
}

.page-template-page-why-how .half-color.grocery-section {
    background-position: 76% !important;
}

/*.row.recipe-container.owl-carousel.owl-loaded .owl-nav,*/
/*.all-menu-cont.owl-carousel .owl-nav {*/
/*    position: relative;*/
/*    left: calc(50% - 65px);*/
/*    left: calc(50% - 65px + 12px);*/
/*}*/

.row.recipe-container.owl-carousel.owl-loaded .owl-nav{
    position: relative;
    left: calc(50% - 65px + 12px);
}

.all-menu-cont.owl-carousel .owl-nav {
    position: relative;
    left: calc(50% - 65px);
}

.all-menu-cont.owl-carousel .owl-nav {
    width: 130px;
    display: flex !important;
    justify-content: space-between;
}

.footer-tagline img {
    max-width: 32px;
}

.page-template-page-why-how #intro-section .bottom-area {
  text-align: center;
  margin-bottom: 50px;
}
.page-template-page-why-how #intro-section .bottom-area .icon-text {
  max-width: 240px;
  margin: 0 auto;
}

}

@media (max-width: 480px){
.offcanvas-button a {
	padding: 7px;
	width: 24px;
	height: 24px;
}
.offcanvas-button span {
	height: 4px;
	width: 22px;
	margin: 3px auto;
}
.offcanvas-header .btn-close {
	width: 24px;
	height: 24px;
	padding: 7px;
	top: 4px;
}	
.offcanvas-header .btn-close span {
	width: 20px;
	height: 4px;
	line-height: 4px;
}
.offcanvas-body .main-menu a {
	font-size: 18px;
}
}

/* Polylang */

.pll-parent-menu-item.current-menu-parent {
    position: relative;
}

.pll-parent-menu-item ul {
  top: 24px;
  position: absolute;
  right: 0;
  transition: all ease .3s;
  opacity: 0;
  padding: 0;
}

.pll-parent-menu-item.active ul {
  display: block;
  padding: 0;
  opacity: 1;
}

.pll-parent-menu-item a {
    padding: 5px;
}

body.error404 header, body.page-template-page-planti header,  body.privacy-policy header {
    background: #29292944;
}

.pll-parent-menu-item.active > a::after {
    transform: rotate(180deg);
}

.lang-item > a::before {
    width: 20px;
    height: 16px;
    overflow: hidden;
    display: flex;
	flex-shrink: 0;
	margin-right: 5px;
}

.lang-item > a > img {
    opacity: 0;
    width: 0 !important;
}

.lang-item-tl > a::before {
    content: url('flags/4x3/ph.svg');
}

.lang-item-id > a::before {
    content: url('flags/4x3/id.svg');
}

.lang-item-en > a::before {
    content: url('flags/4x3/gb.svg');
	 content: url('flags/4x3/ph.svg');
}

.lang-item-th > a::before {
	content: url('flags/4x3/th.svg');
}

.lang-item-ms > a::before {
	content: url('flags/4x3/my.svg');
}

.lang-item-em > a::before {
	content: url('flags/4x3/my.svg');
}

.lang-item-em > a::before {
	content: url('flags/4x3/my.svg');
}

.lang-item-zh > a::before {
	content: url('flags/4x3/hk.svg');
}

.lang-item-zhe > a::before {
	content: url('flags/4x3/hk.svg');
}

.lang-item-zhtw > a::before {
	content: url('flags/4x3/tw.svg');
}

body .pll-parent-menu-item > a::before {
  width: 20px;
  /*height: 16px;*/
  display: inline-block;
  aspect-ratio: 4/3;
  margin-right: 5px;
}

body .mobile-menu .pll-parent-menu-item > a::before {
    width: 24px;
    height: 19px;
	position: relative;
	top: -4px;
}

.mobile-menu .lang-item > a::before {
    width: 24px;
    height: 19px;
}

.offcanvas-body ul.nav-menu {
    margin-bottom: 0;
}

body .pll-parent-menu-item > a img {
  width: 0 !important;
}

/* Show flags for current lang in menu */

body.lang-en .pll-parent-menu-item > a::before {
 /* content: url('flags/4x3/gb.svg'); */
	content: url('flags/4x3/ph.svg');
}

body.lang-tl .pll-parent-menu-item > a::before {
  content: url('flags/4x3/ph.svg');
}

body.lang-id .pll-parent-menu-item > a::before {
  content: url('flags/4x3/id.svg');
}

body.lang-em .pll-parent-menu-item > a::before {
	content: url('flags/4x3/my.svg');
}

body.lang-ms .pll-parent-menu-item > a::before {
	content: url('flags/4x3/my.svg');
}

body.lang-th .pll-parent-menu-item > a::before {
	content: url('flags/4x3/th.svg');
}

body.lang-zh .pll-parent-menu-item > a::before {
	content: url('flags/4x3/hk.svg');
}

body.lang-zhtw .pll-parent-menu-item > a::before {
	content: url('flags/4x3/tw.svg');
}

.part-chat-call .start-chat, .part-chat-call .start-call {
  background: unset;
  border: none;
}

.part-chat-call .form-temp-container input[type="text"] {
  width: 100%;
  border-radius: 25px;
  border: none;
  padding: 10px 20px;
  font-size: 18px;
  margin-right: 10px;
}

.part-chat-call .form-temp-container form {
  display: inline-flex;
  width: 100%;
  max-width: 550px;
}

.part-chat-call .img-fluid.logo-sup {
	display: inline-flex;
	width: 40px;
	vertical-align: top;
	margin-left: 10px;
}

.part-chat-call .start-call {
	display: none;
}

.part-chat-call .section-text {
	max-width: 690px;
	margin-left: auto;
	margin-right: auto;
}

.page-template-page-chat-only .form-temp-container {
	margin-top: 5rem !important;
}

/* Popup */



.sgpb-popup-dialog-main-div-theme-wrapper-1 {
	width: 70%;
	max-width: 1100px;
}

.sgpb-theme-1-content {
	border-radius: 0;
	border-bottom-width: 0px !important;
	box-shadow: none;
	padding: 0 !important;
	width: 100% !important;
	max-width: 1100px !important;
	border-radius: 30px;
	box-shadow: none !important;
}

.popup-cont.popup-newsletter-planti {
	display: flex;
	flex-direction: row;
}

.popup-cont.popup-newsletter-planti {
  display: flex;
  flex-direction: row;
}
.image-cont {
  min-height: 350px;
  background-position: center;
  background-size: cover;
  width: 50%;
}

.text-cont {
  width: 50%;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 35px;
}
.popup-title.popup-en, .popup-thankyou-title.popup-en {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 8px;
  line-height: 1;
}
.sgpb-popup-close-button-1 {
  top: 20px;
	right: 20px !important;
}

.popup-cont.popup-newsletter-planti input[type="email"] {
	width: 100%;
	display: inline-block;
	padding: 10px;
	border-radius: 20px;
	border: 1px solid;
	margin: 10px auto;
}

@media screen and (max-width: 900px){
	.sgpb-popup-dialog-main-div-theme-wrapper-1 {
	width: 86%;
	left: 7% !important;
}
	
	.popup-cont.popup-newsletter-planti {
	display: flex;
	flex-direction: column;
}
	.popup-cont.popup-newsletter-planti .image-cont {
	width: 100%;
		min-height: 250px;
		background-position: center 20%;
}
	.text-cont {
	width: 100%;
	padding: 16px;
}
}

.popup-cont.popup-newsletter-planti .submit-btn.round-button {
	width: 100%;
}


.page-id-4545 .sgpb-theme-1-overlay.sgpb-popup-overlay-4223.sgpb-popup-overlay {
	display: none !important;
}

.form-input.hidden {
	opacity:0;
	width: 0;
	height: 0;
	border: none;
	padding: 0;
	margin: 0;
}

.sg-popup-builder-content p {
	margin-bottom: 0;
}

#sgpb-popup-dialog-main-div-wrapper .round-button {
	background: #ed6b3b;
	border: none;
}

#sgpb-popup-dialog-main-div-wrapper .round-button:hover {
	background: #fff;
}

#sgpb-popup-dialog-main-div-wrapper .popup-title.popup-en,  #sgpb-popup-dialog-main-div-wrapper .popup-text.popup-en, #sgpb-popup-dialog-main-div-wrapper .success-msg  {
	text-align: center;
}

.popup-text {
	font-size: 14px;
	line-height: 1rem;
}


/* --- Chrome, Safari, Edge --- */
::-webkit-scrollbar {
  width: 10px;              /* vertical scrollbar */
  height: 10px;             /* horizontal scrollbar */
}

::-webkit-scrollbar-track {
  background: #f1f1f1;       /* track color */
}

::-webkit-scrollbar-thumb {
  background: #888;          /* thumb color */
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* --- Firefox --- */
* {
  scrollbar-width: thin;      /* "auto" | "thin" | "none" */
  scrollbar-color: #888 #f1f1f1; /* thumb | track */
}

/* Suggestions for chat */
.suggestion-container {
	display: inline-block;
	justify-content: center;
	padding: 10px 15px;
}

.part-chat-call .start-chat.startchatwithprompt {
	background: #fff;
	padding: 10px 20px;
	border-radius: 24px;
	margin: 6px 10px;
	color: #444;
	border: 1px solid #bbb;
}