#header.hideme,
#header.scrolled.hideme,
body.admin-bar #header.scrolled.hideme {
top: -20rem;
} .home #header.scrolled::before,
#header.scrolled::after {
visibility: visible !important;
}
#header.scrolled,
body.page-template-template-page-with-transparent-header #header.scrolled {
box-shadow: 0px 8px 16px rgb(34 72 114 / 4%);
background: var(--wp--preset--color--dark-grey);
color: white;
} body.search-bar-shown #header {
top: 0 !important;
}
#header {
position: sticky;
top: 0;
background: transparent;
transition: all 0.5s ease-in;
box-shadow: none;
z-index: 999;
width: 100%;
font-size: 1.125em;
padding: 1.25em 0;
}
#header .wrapper {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
padding: 0 var(--wp--custom--padding);
}
.header-logo {
}
.header-logo svg {
width: auto;
display: block;
}
.menu-extras {
display: flex;
align-items: center;
list-style: none;
column-gap: 2rem;
row-gap: 1em;
}  .menu {
}
.menu > ul {
list-style: none;
display: flex;
flex-wrap: wrap;
padding: 0;
justify-content: center;
align-items: center;
gap: 0;
flex-direction: row;
}
.menu li {
padding: 0;
position: relative;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
font-size: 1.25rem;
}
.menu li a {
padding: 0.5rem 1em;
margin: 0;
font-weight: 600;
line-height: 1.2;
display: flex;
align-items: center;
justify-content: space-between;
color: white;
} .menu li a svg {
margin-left: 0.5rem;
}
.menu > ul > li:first-child > a { }
.menu li li {
font-size: inherit;
}
.menu-secondary .cart-number {
font-size: 12px;
color: var(--wp--preset--color--dark-grey);
margin-left: -12px;
position: relative;
top: 3px;
right: 4px;
width: 12px;
display: inline-block;
text-align: center;
}
.menu-secondary .cart-number {
font-size: 12px;
color: var(--wp--preset--color--dark-grey);
margin-left: -12px;
position: relative;
top: 3px;
right: 4px;
width: 12px;
display: inline-block;
text-align: center;
} .mobile-menu {
display: none;
margin-left: 2rem;
}
input#menutoggle {
display: none;
}
label#menutogglebutton {
display: none;
width: 1.5rem;
padding: 0;
cursor: pointer; position: relative;
justify-content: center;
align-items: center;
flex-direction: column;
top: 2px;
}
input#menutoggle:checked ~ .mobile-panel {
transform: translateX(0px);
}
input#menutoggle:checked ~ label { position: relative;
right: 0;
}
#header hr {
width: 1.5rem;
height: 2px;
border: 0;
background: white;
margin: 2px 0;
position: relative;
transition: all 0.2s;
}
input#menutoggle:checked ~ label hr:nth-child(1) {
transform: rotate(45deg);
top: 3px;
}
input#menutoggle:checked ~ label hr:nth-child(2) {
transform: rotate(-45deg);
top: -3px;
}
input#menutoggle:checked ~ label hr:nth-child(3) {
display: none;
}
.mobile-panel {
position: fixed;
background: white;
width: 100%;
max-width: 480px;
height: 100vh;
overflow-y: auto;
margin: 0;
right: 0;
top: 0;
padding: 1.25em 2rem;
flex-direction: column;
align-items: flex-end;
transform: translateX(100vw);
z-index: 101;
transition: transform 0.1s;
}
body.mobile-panel-shown {
overflow: hidden;
max-height: 100vh;
}
body.admin-bar .mobile-panel {
padding-top: calc(6em + var(--wp-admin--admin-bar--height));
}
.menu-socials > ul {
justify-content: flex-start;
gap: 1em;
margin-top: 1em;
}
.menu-socials li a {
width: 48px;
height: 48px;
border-radius: 50%;
border: 1px solid white;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
}
.menu-socials a svg {
margin: 0 !important;
}
.menu-socials li a:hover,
.menu-socials li a:focus {
border-color: var(--wp--preset--color--green);
} .menu-main {
font-size: 1.125em;
}
.menu-main > ul > li > a {
margin: 0;
} 
#header.scrolled .menu-main > ul > li > a { }
.menu-main > ul > li > a {
color: white;
padding: 1rem 1em; }
.menu > ul > li:hover > a {
color: var(--wp--preset--color--green);
}
@keyframes showMenu {
0% {
display: block;
opacity: 0;
transform: translateY(-20px);
}
100% {
display: block;
opacity: 1;
transform: translateY(0);
}
}
.menu-main ul.sub-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
flex-direction: column;
z-index: 3;
padding: 0;
width: 14rem;
background: white;
border-radius: 8px;
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.25);
overflow: hidden;
transform: translateY(-20px);
z-index: 9999;
} .menu-main > ul > li.submenu-shown > ul {
display: block;
animation: showMenu 0.1s cubic-bezier(0.7, 0, 0.3, 1) forwards;
}
.menu-secondary ul.sub-menu {
display: none;
position: absolute;
top: 100%;
left: -150%;
flex-direction: column;
z-index: 3;
padding: 0;
width: 15rem;
background: white;
border-radius: 8px;
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.25);
overflow: hidden;
transform: translateY(-20px);
z-index: 9999;
} .menu-secondary > ul > li.submenu-shown > ul {
display: block;
animation: showMenu 0.1s cubic-bezier(0.7, 0, 0.3, 1) forwards;
}  .menu-marker {
display: none; transform-origin: center center;
transition: all 0.1s;
position: relative;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' fill='none' viewBox='0 0 24 12'%3E%3Cpath fill='%23fff' d='M2.28.35a1.43 1.43 0 0 0-1.9.02c-.52.5-.5 1.27.03 1.75l10.7 9.53.93-.89-.93.89a1.43 1.43 0 0 0 1.94-.07L23.6 2.12c.53-.48.55-1.26.03-1.75a1.43 1.43 0 0 0-1.9-.02l-9.68 8.7L2.28.34Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
width: 1.5rem;
height: 12px;
top: 2px;
left: -0.5rem;
cursor: pointer;
}
.menu-main > ul > li.submenu-shown > .menu-marker {
transform: rotate(-180deg);
}
.menu-secondary > ul > li > a {
padding-right: 0;
margin: 0.5rem 0;
}
.menu-secondary > ul > li.submenu-shown > .menu-marker {
transform: rotate(-180deg);
}
.menu-main ul ul.sub-menu li a {
color: var(--wp--preset--color--black);
padding: 1rem 1em;
margin: 0;
transition-delay: 0.1s;
width: 100%;
}
.menu-secondary ul ul.sub-menu li a {
color: var(--wp--preset--color--black);
padding: 1rem 1em;
margin: 0;
transition-delay: 0.1s;
width: 100%;
} @media screen and (min-width: 1281px) { .menu-main ul ul.sub-menu li :hover,
.menu-main ul ul.sub-menu li :focus {
background: var(--wp--preset--color--green);
color: white;
width: 100%;
}
.menu-secondary ul ul.sub-menu li :hover,
.menu-secondary ul ul.sub-menu li :focus {
background: var(--wp--preset--color--green);
color: white !important;
width: 100%;
}
} .header-search {
display: none;
width: 100%;
max-width: 80rem;
margin-left: auto;
margin-right: auto;
top: 150%;
left: 0;
right: 0;
padding: 0 calc(var(--wp--custom--padding) - 1rem);
align-items: center;
position: absolute;
z-index: 400;
}
body.search-bar-shown .header-search {
display: block;
z-index: 9990;
}
.menu-extras a:has(svg) {
display: flex;
justify-content: center;
align-items: center;
color: white;
}
.menu-extras a:has(svg):hover,
.menu-extras a:has(svg):focus {
color: var(--wp--preset--color--green) !important;
}
.menu-extras-cart .cart-number{
font-size: 12px;
font-weight: 600;
line-height: 1.2;
color: var(--wp--preset--color--dark-grey);
margin-left: -13px;
position: relative;
top: 4px;
right: 4px;
width: 12px;
display: inline-block;
text-align: center;
}
.login-avatar {
text-transform: uppercase;
width: 2.25rem;
height: 2.25rem;
border-radius: 50%;
font-weight: 600;
background: var(--wp--preset--color--green);
color: white;
display: grid;
place-items: center;
}
.header-search form {
width: 100%;
box-shadow: 0px 16px 12px 0px rgba(44, 63, 77, 0.45);
border-radius: 8px;
}
.header-search .is-form-style input.is-search-input {
font-family: 'golos', Helvetica, sans-serif;
font-size: var(--wp--preset--font-size--h-4) !important;
height: 4.75rem;
padding: 1.5rem !important;!i;!;
}
.header-search .is-search-icon {
height: 4.75rem;
padding-top: 1.25rem !important;
background: transparent
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='15' fill='none' viewBox='0 0 20 15'%3E%3Cpath fill='%23282D2B' d='M1.4 6.1h13.7l-3.3-3.2c-.2-.3-.4-.6-.4-1 0-.7.6-1.4 1.5-1.4.3 0 .7.1 1 .4l5.6 5.6c.3.2.5.5.5 1s-.2.8-.5 1l-5.7 5.6c-.2.3-.6.4-1 .4-.8 0-1.4-.7-1.4-1.4 0-.4.2-.7.4-1L15.1 9H1.4C.6 8.9 0 8.3 0 7.5c0-.8.6-1.4 1.4-1.4Z'/%3E%3C/svg%3E")
no-repeat left center;
cursor: pointer;
}
.header-search .is-search-icon svg {
visibility: hidden;
}
.header-search .is-form-style button.is-search-submit {
}
.mobile-panel-header {
display: flex;
align-items: center;
width: 100%;
gap: 1.5rem;
padding-bottom: 1.5rem;
}
.mobile-panel-header .header-logo {
margin-right: auto;
}
.mobile-panel-header .header-logo svg {
height: 2rem;
}
.mobile-panel-header .menu-extras a:has(svg) {
color: initial;
}
.mobile-panel-header a.header-search-icon {
display: none;
}
.mobile-panel-header .menu-extras-cart .cart-number {
color: white;
}
.close-mobile-panel {
display: block;
height: 1.5rem;
}
.close-mobile-panel hr {
background: var(--wp--preset--color--black) !important;
}
.close-mobile-panel hr:first-child {
transform: rotate(45deg);
top: 10px;
}
.close-mobile-panel hr:last-child {
transform: rotate(-45deg);
top: 6px;
}
.background-overlay {
background: var(--wp--preset--color--black);
opacity: 0;
position: fixed;
width: calc(100vw - 480px);
height: 100vh;
top: 0;
left: 100vw;
z-index: 100;
transition: opacity .2s;
}
body.mobile-panel-shown .background-overlay {
opacity: .7;
left: 0;
} .breadcrumbs {
display: flex;
flex-direction: row;
gap: 0.5rem;
border-bottom: 1px solid rgb(0, 191, 111, 0.5); border-image-slice: 1;
width: auto;
max-width: fit-content;
font-weight: 500;
margin: 1em 0 0.5em;
font-size: var(--wp--preset--font-size--medium);
align-items: center;
padding-bottom: 0.5rem;
}
.breadcrumbs-separator {
width: 24px;
height: 24px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300BF6F' d='M8.2 18.5a1 1 0 0 0 0 1.2c.4.4.9.4 1.2 0l6.4-7.1-.6-.6.6.6a1 1 0 0 0 0-1.3l-6.4-7a.8.8 0 0 0-1.2 0 1 1 0 0 0 0 1.2L14 12l-5.8 6.5Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M8 20V4h8v16z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}
.breadcrumbs-separator-left {
width: 8px;
height: 16px;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="16" fill="none" viewBox="0 0 8 16"><path fill="%2300BF6F" d="M7.77 14.48c.31.35.3.92-.02 1.27a.78.78 0 0 1-1.16-.02L.24 8.6l.59-.63-.6.63a.96.96 0 0 1 .05-1.3L6.58.27A.78.78 0 0 1 7.76.25c.33.35.34.92.02 1.27l-5.8 6.45 5.8 6.5Z"/></svg>');
}
.breadcrumbs a {
color: var(--wp--preset--color--green);
font-weight: bold;
}
.breadcrumbs span {
white-space: nowrap;
}
.breadcrumbs span:last-child {
overflow: hidden;
text-overflow: ellipsis;
} @media screen and (max-width: 1280px) {
.menu-secondary {
display: none;
}
.mobile-panel .menu-secondary {
display: flex;
order: 2;
width: 100%;
margin-bottom: 6em;
}
.menu-main ul ul.sub-menu li :hover,
.menu-main ul ul.sub-menu li :focus {
color: var(--wp--preset--color--green);
}
.menu-secondary ul ul.sub-menu li :hover,
.menu-secondary ul ul.sub-menu li :focus {
color: var(--wp--preset--color--green);
}
.menu-main > ul > li.submenu-shown > .menu-marker {
transform: rotate(-180deg);
}
.menu-secondary > ul > li.submenu-shown > .menu-marker {
transform: rotate(-180deg);
} .menu-marker:has(+ ul) {
display: block;
}
.menu-marker {
left: 0.25rem;
top: 0.25rem;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' fill='none' viewBox='0 0 24 12'%3E%3Cpath fill='%2300bf6f' d='M2.28.35a1.43 1.43 0 0 0-1.9.02c-.52.5-.5 1.27.03 1.75l10.7 9.53.93-.89-.93.89a1.43 1.43 0 0 0 1.94-.07L23.6 2.12c.53-.48.55-1.26.03-1.75a1.43 1.43 0 0 0-1.9-.02l-9.68 8.7L2.28.34Z'/%3E%3C/svg%3E");
}
.menu-secondary .menu-marker { top: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' fill='none' viewBox='0 0 24 12'%3E%3Cpath fill='%23fff' d='M2.28.35a1.43 1.43 0 0 0-1.9.02c-.52.5-.5 1.27.03 1.75l10.7 9.53.93-.89-.93.89a1.43 1.43 0 0 0 1.94-.07L23.6 2.12c.53-.48.55-1.26.03-1.75a1.43 1.43 0 0 0-1.9-.02l-9.68 8.7L2.28.34Z'/%3E%3C/svg%3E");
}
.mobile-panel .menu-secondary .menu-marker{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' fill='none' viewBox='0 0 24 12'%3E%3Cpath fill='%2300bf6f' d='M2.28.35a1.43 1.43 0 0 0-1.9.02c-.52.5-.5 1.27.03 1.75l10.7 9.53.93-.89-.93.89a1.43 1.43 0 0 0 1.94-.07L23.6 2.12c.53-.48.55-1.26.03-1.75a1.43 1.43 0 0 0-1.9-.02l-9.68 8.7L2.28.34Z'/%3E%3C/svg%3E");
}
.header-search {  }
label#menutogglebutton,
.mobile-menu {
display: flex;
}
.menu-main {
display: none;
}
.mobile-menu .menu-main {
display: flex;
width: 100%;
}
.menu-extras {
margin-left: auto;
}
body.mobile-panel-shown label#menutogglebutton hr {
background: var(--wp--preset--color--black);
}
.menu-main {
padding: 0 0 0.5em;
}
.menu-main > ul {
flex-direction: column;
align-items: stretch;
width: 100%;
}
.menu-main > ul > li {
padding-bottom: 0.5em;
display: grid;
grid-template-columns: calc(100% - 27px) 27px;
grid-template-rows: auto auto;
width: 100%;
}
.menu-main > ul > li > a {
color: var(--wp--preset--color--black);
padding: 1rem 0 1rem;
margin: 0.5rem 0 0 0;
grid-row: 1;
grid-column: 1;
}
.menu-main ul.sub-menu {
position: relative;
background: none;
width: 100%;
box-shadow: none;
grid-column: 1 / span 2;
grid-row: 2;
top: 0;
left: 0;
}
.menu-secondary ul.sub-menu {
position: relative;
background: none;
width: 100%;
box-shadow: none;
grid-column: 1 / span 2;
grid-row: 2;
top: 0;
left: 0;
}
.menu-secondary > ul{
flex-direction: column;
align-items: stretch;
width: 100%;
}
.menu-main ul ul.sub-menu li a { font-weight: normal;
padding: 0.75rem 0;
}
.menu-main > ul > li:hover,
.menu-main > ul > li > *:hover {
color: var(--wp--preset--color--green);
}
.menu-main li.menu-item-has-children:hover > a::after,
.menu-main li.menu-item-has-children:focus > a::after {
color: inherit;
}
.menu-secondary > ul {
justify-content: flex-start;
}
.menu-secondary li a {
padding: 1rem;
margin: 0;
color: white;
}
.mobile-panel .menu-secondary li a{
color: var(--wp--preset--color--black);
opacity: 0.85;
padding-left: 0;
padding-right: 0;
}
.menu-secondary > ul > li{
padding-bottom: 0.5em;
display: grid;   grid-template-columns: calc(100% - 27px) 27px;
grid-template-rows: auto auto;
width: 100%;
}
.menu-secondary ul.sub-menu{
position: relative;
background: none;
width: 100%;
box-shadow: none;
grid-column: 1 / span 2;
grid-row: 2;
top: 0;
}
.menu-secondary ul ul.sub-menu li a{
font-weight: normal;
padding: 0.75rem 0;
}
body.mobile-panel-shown .menu-secondary li a,
#header.scrolled .menu-main > ul > li > a {
color: var(--wp--preset--color--black);
}
body.mobile-panel-shown .menu-secondary > ul > li:hover > a {
color: var(--wp--preset--color--green);
}
body.mobile-panel-shown .menu-secondary .cart-number {
color: white;
}
}
@media screen and (max-width: 782px) {
.mobile-menu {
font-size: 1rem;
}
}
@media screen and (max-width: 600px) {
#header {
top: 0 !important;
}
.header-logo svg {
height: 2em;
}
.mobile-menu {
margin-left: 2rem;
}
.mobile-panel {
display: flex;
flex-direction: column;
align-items: flex-start;
}
}
@media screen and (max-width: 400px) {
.menu-extras-cart:not(.mobile-panel .menu-extras-cart) {
display: none !important;
}
.mobile-panel-header .header-logo {
display: none;
}
}