.menu-item-object-language_switcher .trp-flag-image {
display: inline-block;
margin: -1px 5px;
vertical-align: baseline;
padding: 0;
border: 0;
border-radius:0;
} .trp-language-switcher{
height: 42px;
position: relative;
box-sizing: border-box;
width: 200px;
text-overflow: ellipsis;
white-space: nowrap;
}
.trp-language-switcher > div {
box-sizing: border-box;
padding:4px 20px 3px 13px;
border: 1.5px solid #949494;
border-radius: 2px;
background-image: url(//p2013.co/wp-content/plugins/translatepress-multilingual/assets/images/arrow-down-3101.svg);
background-repeat: no-repeat;
background-position:
calc(100% - 20px) calc(1em + 2px),
calc(100% - 3px) calc(1em + 0px);
background-size:
8px 8px,
8px 8px;
background-repeat: no-repeat;
background-color: #fff;
}
.trp-language-switcher > div:hover {
background-image: none;
}
.trp-language-switcher > div > a {
display: block;
padding: 7px 12px;
border-radius: 3px;
text-decoration: none;
color: #1E1E1E;
font-style: normal;
font-weight: 400;
font-size: 16px;
}
.trp-language-switcher > div > a:hover {
background: #F0F0F0;
border-radius: 2px;
}
.trp-language-switcher > div > a.trp-ls-shortcode-disabled-language {
cursor: default;
}
.trp-language-switcher > div > a.trp-ls-shortcode-disabled-language:hover {
background: none;
}
.trp-language-switcher > div > a > img{
display: inline;
margin: 0 3px;
width: 18px;
height: 12px;
border-radius: 0;
}
.trp-language-switcher .trp-ls-shortcode-current-language{
display: inline-block;
}
.trp-language-switcher:focus .trp-ls-shortcode-current-language,
.trp-language-switcher:hover .trp-ls-shortcode-current-language{
visibility: hidden;
}
.trp-language-switcher .trp-ls-shortcode-language{
display: inline-block;
height: 1px;
overflow: hidden;
visibility: hidden;
z-index: 1;
max-height: 250px;
overflow-y: auto;
left: 0;
top: 0;
min-height: auto;
}
.trp-language-switcher:focus .trp-ls-shortcode-language,
.trp-language-switcher:hover .trp-ls-shortcode-language{
visibility: visible;
max-height: 250px;
padding: 4px 13px;
height: auto;
overflow-y: auto;
position: absolute;
left: 0;
top: 0;
display: inline-block !important;
min-height: auto;
} #wpadminbar #wp-admin-bar-trp_edit_translation .ab-icon:before {
content: '\f326';
top: 3px;
}
@media screen and ( max-width: 782px ) {
#wpadminbar #wp-admin-bar-trp_edit_translation > .ab-item {
text-indent: 0;
}
#wpadminbar li#wp-admin-bar-trp_edit_translation {
display: block;
}
} .elementor-shortcode .trp-ls-shortcode-current-language,
.elementor-shortcode .trp-ls-shortcode-language {
width: 300px !important;
}.tax-product_brand .brand-description{overflow:hidden;zoom:1}.tax-product_brand .brand-description img.brand-thumbnail{width:25%;float:right}.tax-product_brand .brand-description .text{width:72%;float:left}.widget_brand_description img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0 0 1em}ul.brand-thumbnails{margin-left:0;margin-bottom:0;clear:both;list-style:none}ul.brand-thumbnails:before{clear:both;content:"";display:table}ul.brand-thumbnails:after{clear:both;content:"";display:table}ul.brand-thumbnails li{float:left;margin:0 3.8% 1em 0;padding:0;position:relative;width:22.05%}ul.brand-thumbnails.fluid-columns li{width:auto}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:both}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:0}ul.brand-thumbnails.columns-1 li{width:100%;margin-right:0}ul.brand-thumbnails.columns-2 li{width:48%}ul.brand-thumbnails.columns-3 li{width:30.75%}ul.brand-thumbnails.columns-5 li{width:16.95%}ul.brand-thumbnails.columns-6 li{width:13.5%}.brand-thumbnails li img{box-sizing:border-box;width:100%;max-width:none;height:auto;margin:0}@media screen and (max-width:768px){ul.brand-thumbnails:not(.fluid-columns) li{width:48%!important}ul.brand-thumbnails:not(.fluid-columns) li.first{clear:none}ul.brand-thumbnails:not(.fluid-columns) li.last{margin-right:3.8%}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(odd){clear:both}ul.brand-thumbnails:not(.fluid-columns) li:nth-of-type(even){margin-right:0}}.brand-thumbnails-description li{text-align:center}.brand-thumbnails-description li .term-thumbnail img{display:inline}.brand-thumbnails-description li .term-description{margin-top:1em;text-align:left}#brands_a_z h3:target{text-decoration:underline}ul.brands_index{list-style:none outside;overflow:hidden;zoom:1}ul.brands_index li{float:left;margin:0 2px 2px 0}ul.brands_index li a,ul.brands_index li span{border:1px solid #ccc;padding:6px;line-height:1em;float:left;text-decoration:none}ul.brands_index li span{border-color:#eee;color:#ddd}ul.brands_index li a:hover{border-width:2px;padding:5px;text-decoration:none}ul.brands_index li a.active{border-width:2px;padding:5px}div#brands_a_z a.top{border:1px solid #ccc;padding:4px;line-height:1em;float:right;text-decoration:none;font-size:.8em}:root {
--s-gap: 16px;
--s-space: 16px;
--s-color-1: #095eb6;
--s-color-2: #1787d2;
--s-color-3: #47be9d;
--s-color-4: #67d88f;
--s-color-5: #ffa900;
--s-color-6: #ff4d00;
--s-noti: #f54600;
--s-text-1: #222;
--s-text-2: #71767f;
--s-bg-1: #fff;
--s-bg-2: #f5f5f7;
--s-border-1: #d2d2d7;
--s-border-2: #e2e2e7;
--s-rounded-1: 3px;
--s-rounded-2: 5px;
--s-head-text: var(--s-text-1);
--s-head-hover: var(--s-head-text);
--s-head-bg: var(--s-bg-1);
--s-head-height: 50px;
--s-nav-width: 280px;
--s-nav-bg: var(--s-color-1);
--s-nav-text: #fff;
--s-nav-hover: var(--s-color-2);
--s-body: -apple-system, "Helvetica Neue", sans-serif;
--s-heading: var(--s-body);
--s-heading-weight: 700;
--s-heading-alt: var(--s-heading);
--s-heading-alt-weight: var(--s-heading-weight);
--s-shadow-1: 0 0.5px 2px rgba(0, 0, 0, 0.16);
--s-shadow-2: 0 4px 12px rgba(0, 0, 0, 0.08);
--s-content-width: 100%;
--s-container-width: 100%;
--s-containter-width: 100%;
}
@media (min-width: 720px) {
:root {
--s-gap: 20px;
--s-space: 20px;
--s-content-width: 750px;
}
}
@media (min-width: 1024px) {
:root {
--s-space: 24px;
--s-head-height: 70px;
}
}
@media (min-width: 1200px) {
:root {
--s-space: 30px;
--s-container-width: 1180px;
}
}
*,
*::before,
*::after {
box-sizing: border-box;
}
* {
margin: 0;
}
body {
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
}
picture,
video,
canvas {
display: block;
max-width: 100%;
}
input,
button,
textarea,
select {
font: inherit;
}
p {
overflow-wrap: break-word;
margin-bottom: 1rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word;
line-height: 1.3;
margin-bottom: 1rem;
font-family: var(--s-heading);
font-weight: var(--s-heading-weight);
}
h1 {
font-size: 1.8em;
text-align: center;
}
@media (min-width: 1024px) {
h1 {
font-size: 2em;
}
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.4em;
}
h4 {
font-size: 1.25em;
}
h5 {
font-size: 1em;
}
h6 {
font-size: 0.875em;
}
html {
font-family: var(--s-body);
background-color: var(--s-bg-1);
color: var(--s-text-1);
}
img {
max-width: 100%;
height: auto;
}
a {
text-decoration: none;
transition: 0.3s ease;
cursor: pointer;
}
table {
border-collapse: collapse;
margin-bottom: 1rem;
}
th {
text-align: left;
}
th,
td {
vertical-align: top;
}
ol,
ul {
margin: 0 0 1.5em 0;
padding-left: 1.2em;
}
nav,
button,
label,
legend {
line-height: 1.3;
font-family: var(--s-heading);
}
hr {
margin-top: var(--s-space);
margin-bottom: var(--s-space);
color: var(--s-border-1);
border: none;
border-bottom: 1px solid;
border-color: var(--s-border-2);
}
blockquote {
font-family: var(--s-heading-alt);
font-weight: var(--s-heading-alt-weight);
line-height: 1.6;
font-size: 1.25em;
margin-top: calc(var(--s-space) * 1.25);
margin-bottom: calc(var(--s-space) * 1.25);
}
fieldset {
border: 1px solid var(--s-border-1);
padding: var(--s-gap);
margin: 1rem 0;
border-radius: var(--s-rounded-1);
}
aside ul {
padding-left: 0;
}
input,
select,
textarea {
max-width: 100%;
border: 1px solid var(--s-border-1);
transition: 0.3s ease;
background: inherit;
color: inherit;
padding: 0.375em 0.5em;
line-height: 1.3;
border-radius: var(--s-rounded-1);
}
input[type=radio],
input[type=checkbox] {
width: 14px;
height: 14px;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
._space {
margin-bottom: var(--s-space);
}
@media (max-width: 1023px) {
._desktop {
display: none !important;
}
}
@media (min-width: 1024px) {
._mobile {
display: none !important;
}
}
body.logged-in ._guest,
body:not(.logged-in) ._member,
.hide,
._th:not(:lang(th)),
._en:not(:lang(en-US)) {
display: none !important;
}
._body {
font-family: var(--s-body);
}
._heading {
line-height: 1.3;
font-family: var(--s-heading);
font-weight: var(--s-heading-weight);
}
._heading_alt {
font-family: var(--s-heading-alt);
font-weight: var(--s-heading-alt-weight);
}
._h {
font-family: var(--s-heading);
}
._h_alt {
font-family: var(--s-heading-alt);
}
._nowrap {
white-space: nowrap;
}
.site-header ._btn a {
background: var(--s-color-1);
color: #fff;
padding: 0.6em 1em;
height: auto;
border-radius: var(--s-rounded-1);
}
.site-header ._btn a:hover {
color: #fff;
background: var(--s-color-2);
}
.s-flex {
display: flex;
gap: 6px;
}
html body .s-sec {
padding: 30px 0;
}
@media (min-width: 768px) {
html body .s-sec {
padding: 45px 0;
}
}
@media (min-width: 1024px) {
html body .s-sec {
padding: 60px 0;
}
}
.relative {
position: relative;
}
.flex {
display: flex !important;
}
.inline-flex {
display: inline-flex !important;
}
.grid {
display: grid !important;
}
.text-left {
text-align: left !important;
}
.text-left h1 {
text-align: left;
}
.text-center {
text-align: center !important;
}
.text-right {
text-align: right !important;
}
.justify-start {
justify-content: flex-start !important;
}
.justify-end {
justify-content: flex-end !important;
}
.justify-center {
justify-content: center !important;
}
.justify-between {
justify-content: space-between !important;
}
.items-start {
align-items: flex-start !important;
}
.items-center {
align-items: center !important;
}
@media (min-width: 600px) {
.sm\:text-left {
text-align: left !important;
}
.sm\:text-center {
text-align: center !important;
}
.sm\:text-right {
text-align: right !important;
}
.sm\:justify-start {
justify-content: flex-start !important;
}
.sm\:justify-end {
justify-content: flex-end !important;
}
.sm\:justify-center {
justify-content: center !important;
}
.sm\:justify-between {
justify-content: space-between !important;
}
.sm\:flex {
display: flex !important;
}
.sm\:inline-flex {
display: inline-flex !important;
}
.sm\:grid {
display: grid !important;
}
.sm\:items-start {
align-items: flex-start !important;
}
.sm\:items-center {
align-items: center !important;
}
}
@media (min-width: 768px) {
.md\:text-left {
text-align: left !important;
}
.md\:text-center {
text-align: center !important;
}
.md\:text-right {
text-align: right !important;
}
.md\:justify-start {
justify-content: flex-start !important;
}
.md\:justify-end {
justify-content: flex-end !important;
}
.md\:justify-center {
justify-content: center !important;
}
.md\:justify-between {
justify-content: space-between !important;
}
.md\:flex {
display: flex !important;
}
.md\:inline-flex {
display: inline-flex !important;
}
.md\:grid {
display: grid !important;
}
.md\:items-start {
align-items: flex-start !important;
}
.md\:items-center {
align-items: center !important;
}
}
@media (min-width: 1024px) {
.lg\:text-left {
text-align: left !important;
}
.lg\:text-center {
text-align: center !important;
}
.lg\:text-right {
text-align: right !important;
}
.lg\:justify-start {
justify-content: flex-start !important;
}
.lg\:justify-end {
justify-content: flex-end !important;
}
.lg\:justify-center {
justify-content: center !important;
}
.lg\:justify-between {
justify-content: space-between !important;
}
.lg\:flex {
display: flex !important;
}
.lg\:inline-flex {
display: inline-flex !important;
}
.lg\:grid {
display: grid !important;
}
.lg\:items-start {
align-items: flex-start !important;
}
.lg\:items-center {
align-items: center !important;
}
.lg\:m-0 {
margin: 0 !important;
}
}
.mx-auto {
margin-left: auto !important;
margin-right: auto !important;
}
.m-0 {
margin: 0 !important;
}
.mt-0 {
margin-top: 0 !important;
}
.mb-0 {
margin-bottom: 0 !important;
}
.mb-1 {
margin-bottom: 0.25rem !important;
}
.mb-2 {
margin-bottom: 0.5rem !important;
}
.gap-0 {
gap: 0 !important;
}
.gap-1 {
gap: 0.25rem !important;
}
.gap-2 {
gap: 0.5rem !important;
}
.drop-shadow {
box-shadow: var(--s-shadow-1);
}
.drop-shadow-lg {
box-shadow: var(--s-shadow-2);
}
.bg-transparent {
background-color: transparent;
}
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
-webkit-clip-path: inset(50%);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
word-wrap: normal !important;
}
.alignfull,
.alignwide {
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
max-width: 100vw;
width: unset;
}
@media (max-width: 1023px) {
.alignfull,
.alignwide {
overflow-x: hidden;
}
}
@media (min-width: 1024px) {
body .alignwide {
margin-left: calc(50% - 50vw + var(--s-gap));
margin-right: calc(50% - 50vw + var(--s-gap));
}
}
@media (min-width: 1200px) {
body .alignwide {
margin-left: calc(50% - var(--s-container-width) / 2 + var(--s-gap));
margin-right: calc(50% - var(--s-container-width) / 2 + var(--s-gap));
}
}
.wp-block-gallery {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: var(--s-space);
margin-bottom: var(--s-space);
}
.wp-block-image.alignfull, .wp-block-image.alignwide {
margin-top: var(--s-space);
margin-bottom: var(--s-space);
}
.wp-block-pullquote {
border-top: 4px solid;
border-bottom: 4px solid;
padding: 2.6rem 0 1.6rem;
margin-top: calc(var(--s-space) * 1.25);
margin-bottom: calc(var(--s-space) * 1.25);
}
.wp-block-pullquote p {
font-size: 1.4em;
}
.wp-block-button__link {
color: #fff;
background-color: var(--s-color-1);
padding: 0.6em 1.6em 0.6em;
}
.wp-block-button__link:hover {
color: #fff;
background-color: var(--s-color-2);
}
.has-background {
background-color: var(--s-bg-2);
}
body .has-background {
padding: calc(var(--s-gap) * 1.25) calc(var(--s-gap) * 1.5);
margin-top: var(--s-space);
margin-bottom: var(--s-space);
}
.has-color-1-background-color {
background-color: var(--s-color-1);
}
.has-color-1-color {
color: var(--s-color-1);
}
.has-color-2-background-color {
background-color: var(--s-color-2);
}
.has-color-2-color {
color: var(--s-color-2);
}
.has-color-3-background-color {
background-color: var(--s-color-3);
}
.has-color-3-color {
color: var(--s-color-3);
}
.has-color-4-background-color {
background-color: var(--s-color-4);
}
.has-color-4-color {
color: var(--s-color-4);
}
.has-color-5-background-color {
background-color: var(--s-color-5);
}
.has-color-5-color {
color: var(--s-color-5);
}
.has-color-6-background-color {
background-color: var(--s-color-6);
}
.has-color-6-color {
color: var(--s-color-6);
}
.has-text-1-background-color {
background-color: var(--s-text-1);
}
.has-text-1-color {
color: var(--s-text-1);
}
.has-text-2-background-color {
background-color: var(--s-text-2);
}
.has-text-2-color {
color: var(--s-text-2);
}
.has-bg-1-background-color {
background-color: var(--s-bg-1);
}
.has-bg-1-color {
color: var(--s-bg-1);
}
.has-bg-2-background-color {
background-color: var(--s-bg-2);
}
.has-bg-2-color {
color: var(--s-bg-2);
}
.has-border-1-background-color {
background-color: var(--s-border-1);
}
.has-border-1-color {
color: var(--s-border-1);
}
.has-border-2-background-color {
background-color: var(--s-border-2);
}
.has-border-2-color {
color: var(--s-border-2);
}
.is-layout-flex {
display: flex;
flex-wrap: wrap;
gap: 0.5em;
}
.current-menu-item,
.current-menu-ancestor,
.current_page_item,
.current_page_ancestor,
.current-post-parent,
.current-post-ancestor {
font-weight: bold;
}
.widget-title {
font-size: 1.125em;
margin-bottom: 10px;
}
.wp-block-navigation {
gap: 1.2em;
}
.btn-edit {
font-size: 9px;
border: 1px solid;
border-radius: 3px;
padding: 6px;
position: fixed;
z-index: 900;
bottom: 16px;
left: 16px;
background-color: rgba(255, 255, 255, 0.8);
color: #333;
font-family: sans-serif;
line-height: 1;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
.btn-edit:hover {
color: #fff;
background-color: #000;
}
body,
.site-page {
position: relative;
display: flex;
flex-direction: column;
min-height: 100dvh;
}
h1 {
margin-top: 0.5rem;
}
a {
color: var(--s-color-1);
}
a:hover {
color: var(--s-color-2);
}
a:active {
opacity: 0.6;
}
.s-container {
padding: 0 var(--s-gap);
}
.site-header {
position: absolute;
top: 0;
width: 100%;
z-index: 900;
font-family: var(--s-heading);
height: var(--s-head-height);
background: var(--s-head-bg);
color: var(--s-head-text);
--s-text-1: var(--s-head-text);
transition: 0.4s ease-in-out;
}
.site-header .s-container {
display: flex;
align-items: center;
height: var(--s-head-height);
}
.site-header li a,
.site-header .site-cart,
.site-header .site-member {
color: var(--s-head-text);
}
.site-header li a:hover,
.site-header .site-cart:hover,
.site-header .site-member:hover {
color: var(--s-head-hover);
}
.site-header-space {
min-height: var(--s-head-height);
}
.site-branding a {
color: var(--s-head-text);
}
.site-branding a:hover {
color: var(--s-head-hover);
}
body.modal-active.-search .site-header {
background: var(--s-head-bg);
}
.custom-logo-link {
align-items: center;
display: flex;
}
.site-branding {
display: flex;
gap: 10px;
align-items: center;
transition: 0.4s;
}
.site-branding img,
.site-branding svg {
min-height: 10px;
width: auto;
max-width: unset;
}
.site-branding.-center {
margin: 0 auto;
}
.site-title {
margin: 0;
font-size: 1.5em;
line-height: 1.25;
font-weight: var(--s-heading-weight);
}
.site-logo * {
display: flex;
}
.nav-toggle {
height: 2.75em;
width: 2.75em;
padding: 16px;
cursor: pointer;
margin: 0 -10px;
position: relative;
}
.nav-toggle em {
top: 50%;
margin-top: -1px;
z-index: 1;
}
.nav-toggle em, .nav-toggle em:before, .nav-toggle em:after {
pointer-events: none;
display: block;
content: "";
border-radius: 2px;
background-color: var(--s-head-text);
height: 0.125em;
position: absolute;
transform: rotate(0);
transition: top 0.3s 0.15s, left 0.1s, background-color 0.3s 0.2s, transform 0.2s;
left: 0;
right: 0;
}
.nav-toggle em:before {
top: -0.5em;
}
.nav-toggle em {
left: 0.6em;
right: 0.6em;
}
.nav-toggle em:after {
top: 0.5em;
}
.nav-toggle.active em {
background-color: transparent;
}
.nav-toggle.active em, .nav-toggle.active em:after, .nav-toggle.active em:before {
transition: top 0.2s, left 0.2s, background-color 0.2s, transform 0.2s 0.15s;
}
.nav-toggle.active em:before, .nav-toggle.active em:after {
left: 0;
top: 0;
right: 0;
background-color: var(--s-nav-text);
}
.nav-toggle.active em:before {
transform: rotate(-45deg);
}
.nav-toggle.active em:after {
transform: rotate(45deg);
}
.modal-active .nav-close {
position: fixed;
top: 10px;
left: 16px;
}
.modal-active .nav-panel.-right .nav-close {
left: unset;
right: 16px;
}
.nav-panel {
position: fixed;
z-index: 8000;
opacity: 0;
left: -60px;
top: 0;
bottom: 0;
width: 0;
transition: opacity 0.3s, left 0.4s, width 0.4s;
overflow-x: hidden;
padding-top: 70px;
height: 100vh;
background-color: var(--s-nav-bg);
color: var(--s-nav-text);
}
.nav-panel.active {
width: var(--s-nav-width);
left: 0;
opacity: 1;
box-shadow: var(--s-shadow-2);
}
.nav-panel.-right {
right: -60px;
left: unset;
}
.nav-panel.-right.active {
left: unset;
right: 0;
}
.nav-panel ul {
padding: 0 20px;
}
.nav-panel ul ul {
padding: 0;
font-size: 0.9em;
font-weight: normal;
}
.nav-panel ul ul li {
border-bottom: none;
}
.nav-panel li {
list-style: none;
width: calc(var(--s-nav-width) - 30px);
display: block;
position: relative;
}
.nav-panel li.active > .i-down {
transform: scaleY(-1);
opacity: 0.6;
}
.nav-panel li.active > .sub-menu {
max-height: 300vh;
padding: 4px 0 12px;
opacity: 1;
transition: 0.6s ease-in-out;
overflow: visible;
}
.nav-panel li a {
display: block;
color: var(--s-nav-text);
padding: 8px 0;
}
.nav-panel li a:hover {
color: var(--s-nav-hover);
}
.nav-panel .menu-item-has-children > a {
padding-right: 44px;
}
.nav-panel .sub-menu {
max-height: 0;
opacity: 0;
margin: 0;
width: 100%;
overflow: hidden;
transition: 0.4s ease-out;
}
.nav-panel .i-down {
position: absolute;
z-index: 100;
right: -6px;
top: 0;
padding: 6px;
cursor: pointer;
transition: 0.3s ease-in-out;
}
.nav-panel .i-down * {
pointer-events: none;
}
.site-action {
position: absolute;
z-index: 9000;
display: flex;
align-items: center;
gap: 12px;
}
@media (max-width: 1023px) {
.site-action.-left {
left: var(--s-space);
}
.site-action.-right {
right: var(--s-space);
}
}
.search-toggle-icon {
position: relative;
width: 24px;
height: 24px;
cursor: pointer;
}
.search-toggle-icon::before {
content: "";
width: 2px;
height: 35%;
background-color: var(--s-head-text);
position: absolute;
left: 72%;
top: 72%;
transform: translate(-50%, -50%) rotate(-45deg);
transition: 0.4s;
border-radius: 2px;
}
.search-toggle-icon::after {
content: "";
position: absolute;
width: 60%;
height: 60%;
border: 0.125em solid var(--s-head-text);
border-radius: 50%;
top: 40%;
left: 40%;
transform: translate(-50%, -50%) rotate(0deg);
transition: width 0.3s;
}
.search-toggle-icon.close::before {
height: 80%;
left: 50%;
top: 50%;
}
.search-toggle-icon.close::after {
border-radius: 2px;
border-width: 1px;
background-color: var(--s-head-text);
width: 2px;
overflow: hidden;
height: 80%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) rotate(45deg);
transition: background 0.3s, width 0.1s;
}
.search-panel {
max-height: 0;
z-index: 890;
left: 0;
padding: 0;
width: 100%;
overflow: hidden;
background-color: var(--s-head-bg);
position: fixed;
opacity: 0;
top: var(--s-head-height);
transition: 0.3s ease-in-out;
}
.search-panel.active {
opacity: 1;
padding: var(--s-space) 0;
max-height: 900px;
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.modal-active {
overflow: hidden; }
.modal-active .site-header {
position: fixed;
}
.modal-active .site-modal-bg {
content: "";
display: block;
position: fixed;
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.5);
opacity: 0.5;
z-index: 910;
animation: fadeIn 0.3s forwards;
}
.modal-active.-search { }
.modal-active.-search .site-modal-bg {
z-index: 800;
}
.site-cart svg {
display: block;
}
.search-form {
max-width: 480px;
margin: 0 auto;
}
#s {
width: 100%;
outline: none;
border: none;
border-bottom: 2px solid var(--s-head-text);
color: var(--s-head-text);
font-size: 18px;
padding: 6px;
background: none;
}
#s::-moz-placeholder {
color: var(--s-head-text);
opacity: 0.6;
}
#s::placeholder {
color: var(--s-head-text);
opacity: 0.6;
}
.site-member {
display: block;
}
.site-member img {
width: 32px;
height: 32px;
min-width: 32px;
border-radius: 50%;
display: block;
}
.site-member svg {
display: block;
}
.site-member .label {
display: none;
}
.site-main {
margin: 0 auto;
max-width: var(--s-content-width);
}
.site-main.-wide {
--s-content-width: var(--s-containter-width);
}
.ancestor-title {
margin: var(--s-gap) 0;
text-align: center;
}
.site-sidebar {
margin-bottom: calc(2 * var(--s-gap));
}
.site-sidebar .widget {
background-color: var(--s-bg-2);
border-radius: var(--s-rounded-2);
padding: var(--s-gap);
margin-bottom: var(--s-space);
}
.site-sidebar ul {
margin-bottom: 0;
padding-left: 0;
}
.site-sidebar li {
list-style: none;
margin-bottom: 0.375em;
}
.s-grid {
display: grid;
grid-gap: var(--s-space);
margin-bottom: var(--s-space);
}
.s-grid.-m2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.s-grid.-m3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.s-grid::before, .s-grid::after {
display: none;
}
@media (min-width: 720px) and (max-width: 1023px) {
.s-grid.-t2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.s-grid.-t3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.s-grid.-t4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.s-content {
display: flex;
gap: 1rem;
flex-direction: column;
}
.s-content:hover h2 a {
color: var(--s-color-1);
}
.s-content:hover .entry-pic img {
transform: scale(1.04);
}
.entry-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.5rem;
padding-bottom: 1rem;
}
.entry-info > div:last-child {
margin-top: auto;
}
.entry-title {
font-size: 1.25em;
margin-bottom: 0;
}
.entry-title a {
color: var(--s-text-1);
}
.entry-title a:hover {
color: var(--s-color-1);
}
.entry-pic {
position: relative;
padding-top: 52.5%;
height: 0;
border-radius: var(--s-rounded-2);
background-color: var(--s-bg-2);
}
.entry-pic a {
display: block;
color: #fff;
}
.entry-pic img {
position: absolute;
border-radius: var(--s-rounded-2);
-o-object-fit: cover;
object-fit: cover;
left: 0;
top: 0;
width: 100%;
height: 100%;
transition: 0.3s ease-in-out;
}
.entry-pic .posted-cat {
position: absolute;
top: 5px;
left: 5px;
max-width: calc(100% - 10px);
font-size: 0.875rem;
z-index: 1;
}
.entry-pic .posted-cat a {
color: #fff;
background-color: var(--s-color-1);
border-radius: var(--s-rounded-1);
padding: 0.3em 0.4em;
}
.posted-cat {
line-height: 1.2;
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.posted-cat.-button {
font-size: 0.875rem;
}
.posted-cat.-button a {
color: #fff;
background-color: var(--s-color-1);
border-radius: var(--s-rounded-1);
padding: 0.3em 0.4em;
}
.posted-cat.-pill {
font-size: 0.875rem;
}
.posted-cat.-pill a {
color: #fff;
background-color: var(--s-color-1);
border-radius: 100px;
padding: 0.3em 0.9em;
}
.posted-on {
font-size: 0.8rem;
color: var(--s-text-2);
}
.entry-author {
font-size: 0.8rem;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px;
color: var(--s-text-2);
}
.entry-author a {
color: var(--s-text-2);
}
.entry-author a:hover {
color: var(--s-color-1);
}
.entry-author img {
border-radius: 100px;
margin: 4px 0;
}
.by_date {
padding: 0 4px;
}
.by_date span {
display: block;
line-height: 1.3;
}
.entry-excerpt {
font-size: 0.9375em;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
margin-bottom: 0;
}
.entry-excerpt p {
display: inline;
}
.s-paging {
display: flex;
margin-bottom: var(--s-space);
font-weight: bold;
}
.s-paging span,
.s-paging a {
display: flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
}
.s-paging .current {
background-color: var(--s-bg-2);
border-radius: 36px;
}
.entry-more {
margin-top: auto;
padding-top: 4px;
}
.single-author,
.header-author {
text-align: center;
margin: 0 auto var(--s-space);
max-width: 600px;
}
.author-pic {
padding: 1em 0 0.5em;
}
.author-pic img {
border-radius: 200px;
-o-object-fit: cover;
object-fit: cover;
}
.entry-info-overlap {
position: relative;
margin: -40px 15px 0;
padding: 12px;
background-color: var(--s-bg-1);
border-radius: var(--s-rounded-2);
}
.entry-info-overlap > div:last-child {
margin-top: unset;
}
.s-content-search {
display: flex;
gap: 1rem;
align-items: center;
}
.s-content-search .entry-pic {
min-width: 100px;
padding-top: 100px;
margin-left: auto;
background: none;
}
.s-content-card {
box-shadow: var(--s-shadow-1);
background-color: var(--s-bg-1);
border-radius: var(--s-rounded-2);
overflow: hidden;
gap: 0;
transition: 0.3s;
}
.s-content-card:hover {
box-shadow: var(--s-shadow-2);
}
.entry-pic-card {
border-radius: 0;
overflow: hidden;
}
.entry-pic-card img {
border-radius: 0;
}
.entry-info-card {
padding: var(--s-gap);
}
.btn-readmore {
font-size: 0.9em;
display: inline-flex;
width: -moz-max-content;
width: max-content;
align-items: center;
gap: 6px;
}
.btn-readmore.-button {
padding: 0.4em 0.8em;
border-radius: var(--s-rounded-1);
background-color: var(--s-color-1);
color: #fff;
}
.btn-readmore.-button:hover {
color: #fff;
background-color: var(--s-color-2);
}
.btn-readmore.-pill {
padding: 0.4em 1.2em;
border-radius: 100px;
background-color: var(--s-color-1);
color: #fff;
}
.btn-readmore.-pill:hover {
color: #fff;
background-color: var(--s-color-2);
}
.btn-readmore.-text {
color: var(--s-text-1);
}
.btn-readmore.-text:hover {
color: var(--s-color-1);
}
.btn-readmore.-underline {
color: var(--s-text-1);
text-decoration: underline;
text-underline-offset: 0.2em;
}
.btn-readmore.-underline:hover {
color: var(--s-color-1);
}
.btn-readmore svg {
margin-right: -4px;
}
.s-content-list {
display: flex;
flex-direction: row;
box-shadow: var(--s-shadow-1);
background-color: var(--s-bg-1);
border-radius: var(--s-rounded-2);
overflow: hidden;
gap: 0;
}
.entry-pic-list {
min-width: 40%;
padding-top: 0 !important;
height: 100%;
border-radius: 0;
overflow: hidden;
}
.entry-pic-list img {
border-radius: 0;
}
.entry-info-list {
padding: var(--s-gap);
}
.s-content-caption {
position: relative;
overflow: hidden;
--s-text-1: #fff;
--s-text-2: rgba(255, 255, 255, 0.7);
}
.s-content-caption .-text {
--s-color-1: #fff;
}
.entry-pic-caption {
background-color: #000;
}
.entry-pic-caption img {
opacity: 0.6;
}
.entry-info-caption {
position: absolute;
padding-bottom: 0;
bottom: 1rem;
left: 1rem;
right: 1rem;
color: #fff;
}
.entry-info-caption h2 {
--s-color-1: #fff;
}
.s-content-headline {
position: relative;
overflow: hidden;
--s-text-1: #fff;
--s-text-2: rgba(255, 255, 255, 0.7);
}
.s-content-headline .posted-cat {
justify-content: center;
margin: 0 auto 6px;
}
.s-content-headline a {
color: #fff;
}
.entry-pic-headline {
background-color: #000;
}
.entry-pic-headline img {
opacity: 0.6;
}
.entry-info-headline {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
text-align: center;
width: calc(100% - 100px);
max-width: 720px;
}
.entry-info-headline > div {
display: flex;
flex-direction: column;
gap: 0.4em;
}
.entry-info-headline .title {
margin: 0;
font-size: 1.75em;
--s-color-1: #fff;
}
.entry-info-headline .sub {
margin-bottom: 4px;
}
.entry-info-headline .entry-author {
margin-left: auto;
margin-right: auto;
}
.entry-info-headline .entry-author.-avatar, .entry-info-headline .entry-author.-avatar_date {
flex-direction: column;
}
.s-content-hero {
background-color: var(--s-bg-2);
gap: 0;
}
@media (max-width: 1023px) {
.s-content-hero {
--s-rounded-2: 0;
}
}
.entry-pic-hero {
overflow: hidden;
}
.entry-info-hero {
padding: var(--s-space);
}
.s-content-date {
display: flex;
align-items: center;
color: var(--s-text-1);
}
.s-content-date .calendar {
min-width: 60px;
width: 60px;
height: 60px;
border: 2px solid var(--s-color-6);
border-radius: 5px;
position: relative;
background-color: #fff;
overflow: hidden;
}
.s-content-date .date {
text-align: center;
font-size: 24px;
line-height: 38px;
height: 38px;
color: var(--s-color-6);
}
.s-content-date .month {
height: 18px;
background-color: var(--s-color-6);
font-size: 11px;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
padding-top: 2px;
}
.s-content-date .info {
padding-left: calc(var(--s-space) / 2);
}
.s-content-date .entry-title {
font-size: 1.125em;
margin: 0;
}
.page-banner {
position: relative;
overflow: hidden;
background-color: #000;
min-height: 240px;
padding: var(--s-space);
margin-bottom: var(--s-space);
display: flex;
align-items: center;
justify-content: center;
}
.page-banner > img {
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
opacity: 0.6;
}
.page-banner > div,
.page-banner h1 {
position: relative;
z-index: 2;
margin: 0;
color: #fff;
}
.page-content {
margin-bottom: var(--s-space);
}
body.home .page-content {
margin-bottom: 0;
}
.single-cat {
transform: translateY(-50%);
margin-bottom: var(--s-gap);
}
.single-cat .posted-cat {
justify-content: center;
}
.single-cat a {
padding: 0.4em 0.8em;
font-size: 1rem;
color: #fff;
background-color: var(--s-color-1);
border-radius: var(--s-rounded-1);
padding: 0.3em 0.4em;
}
.single-pic {
line-height: 0;
min-height: 24px;
}
.single-pic img {
-o-object-fit: cover;
object-fit: cover;
width: 100%;
height: auto;
}
.single-content {
font-size: 1.0625rem;
line-height: 1.8;
margin-bottom: var(--s-space);
}
@media (min-width: 720px) and (max-width: 1024px) {
.single-content {
padding: 0 20px;
}
}
.single-meta {
margin-bottom: var(--s-space);
font-size: 0.9em;
}
.single-meta .seed-stat {
margin-left: 10px;
font-size: 0.8rem;
color: var(--s-text-2);
}
.single_cats {
color: var(--s-text-2);
border: 1px solid var(--s-border-2);
border-left: none;
border-right: none;
padding: var(--s-gap) 0;
margin: var(--s-space) 0;
}
.single_cats a {
color: var(--s-text-2);
}
.single_cats a:hover {
color: var(--s-color-1);
}
.single_tags {
margin: var(--s-space) 0;
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.single_tags a {
color: var(--s-text-2);
border: 1px solid var(--s-text-2);
display: inline-block;
padding: 0.2em 0.8em;
line-height: 1.3;
border-radius: 60px;
}
.single_tags a:hover {
color: var(--s-color-1);
border-color: var(--s-color-1);
}
.single-related .s-grid {
margin-bottom: 0;
}
.s-title-headline {
--s-rounded-2: 0;
}
.s-title-headline .entry-pic {
padding-top: 320px;
}
.s-title-hero:hover .entry-pic img {
transform: none;
}
.s-title-hero h1 {
margin: 0;
}
@media (max-width: 1023px) {
.single .site-sidebar {
margin-top: var(--s-gap);
}
}
.comments-area {
background-color: var(--s-bg-2);
padding: var(--s-space);
margin: var(--s-space) 0;
}
.comments-area textarea,
.comments-area input:not([type=submit]) {
background-color: var(--s-bg-1);
}
.comments-area textarea {
width: 100%;
}
.comment-form-cookies-consent {
display: flex;
gap: 0.5rem;
align-items: flex-start;
}
.comment-form-cookies-consent input {
margin-top: 3px;
}
.comment-form-cookies-consent label {
margin: 0;
cursor: pointer;
}
.form-submit {
margin: 0;
font-size: 1.125em;
}
.s_social {
display: inline-flex;
gap: 8px;
}
.s_social svg {
display: block;
height: auto;
fill: currentColor;
}
.s_social path {
fill: currentColor;
}
.site-footer {
margin-top: auto;
font-size: 0.9em;
}
.footer-bar {
background-color: var(--s-bg-2);
color: var(--s-text-1);
font-size: 0.8em;
padding: 16px 0;
text-transform: uppercase;
text-align: center;
}
.footer-bar a {
color: var(--s-text-1);
}
.footer-bar a:hover {
color: var(--s-color-1);
}
.s-menu {
margin-bottom: 10px;
}
.s-menu h2,
.s-menu h3 {
font-size: 1.125em;
margin-bottom: 0;
}
.s-menu .menu {
padding: 10px 0;
margin-bottom: 0;
}
.s-menu .menu li {
list-style: none;
}
@media (max-width: 1023px) {
.s-menu h2,
.s-menu .s-menu-title {
border-bottom: 1px solid;
padding-bottom: 10px;
position: relative;
cursor: pointer;
}
.s-menu h2::after,
.s-menu .s-menu-title::after {
content: "+";
font-weight: normal;
font-size: 20px;
line-height: 1;
font-family: monospace;
display: block;
position: absolute;
height: 20px;
top: 0;
right: 0;
transition: transform 0.3s ease;
}
.s-menu .menu {
opacity: 0;
height: 0;
overflow: hidden;
margin: 0;
padding: 0;
}
.s-menu.active h2,
.s-menu.active .s-menu-title {
border-bottom-style: dashed;
}
.s-menu.active .menu {
opacity: 1;
height: auto;
padding: 10px 0;
transition: opacity 0.3s ease, padding 0.3s ease;
border-bottom: 1px solid;
}
.s-menu.active h2::after,
.s-menu.active h3::after {
transform: rotate(45deg) scale(1.08);
}
} body {
--s-chat-bottom: 24px;
}
body.woocommerce, body.woocommerce-page {
--s-chat-bottom: 48px;
}
@keyframes fadeIn {
0% {
opacity: 0;
bottom: calc(var(--s-chat-bottom) - 14px);
}
100% {
opacity: 1;
bottom: var(--s-chat-bottom);
}
}
#s-chat {
position: fixed;
bottom: var(--s-chat-bottom);
right: 24px;
z-index: 99999;
color: #fff;
background-color: var(--s-accent);
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: rgba(0, 0, 0, 0.15) 0px 4px 12px 0px;
cursor: pointer;
animation: fadeIn ease 1s;
}
#s-chat:hover .c-desc {
opacity: 1;
visibility: unset;
}
#s-chat svg {
pointer-events: none;
transition: 0.4s ease;
}
#s-chat span {
pointer-events: none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
z-index: 1;
line-height: 0;
}
#s-chat span svg {
width: 36px;
height: 36px;
}
#s-chat.-desc .c-desc {
right: calc(100% + 18px);
opacity: 1;
visibility: visible;
}
#s-chat.active > svg {
opacity: 0;
transform: rotate(270deg);
}
#s-chat.active > span {
opacity: 1;
}
.c-tip {
position: relative;
cursor: pointer;
}
.c-tip:hover .c-desc {
right: calc(100% + 18px);
opacity: 1;
visibility: visible;
}
.c-tip > a > img {
border-radius: 60px;
width: 60px;
height: 60px;
-o-object-fit: cover;
object-fit: cover;
}
.c-desc {
opacity: 0;
position: absolute;
visibility: hidden;
transition: 0.3s;
padding: 6px 10px;
border-radius: 3px;
font-size: 15px;
z-index: 99990;
font-size: 15px;
right: calc(100% + 10px);
top: 50%;
transform: translateY(-50%);
color: #222;
background-color: #fff;
white-space: nowrap;
font-family: var(--s-heading);
font-weight: var(--s-heading-weight);
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.2));
}
.c-desc:after {
content: "";
position: absolute;
right: -5px;
top: calc(50% - 5px);
width: 0;
height: 0;
border-style: solid;
border-width: 5px 0 5px 5px;
border-color: transparent transparent transparent #fff;
}
#s-chat-panel {
position: fixed;
bottom: calc(56px + var(--s-chat-bottom));
right: 24px;
z-index: 99999;
transition: 0.4s ease;
padding: 0;
margin: 0;
height: 0;
max-height: 0;
opacity: 0;
visibility: hidden;
overflow: hidden;
}
#s-chat-panel li {
list-style: none;
height: 0;
transition: 0.5s ease;
overflow: hidden;
}
#s-chat-panel.active {
bottom: calc(66px + var(--s-chat-bottom));
visibility: visible;
height: auto;
opacity: 1;
overflow: visible;
max-height: 490px;
}
#s-chat-panel.active li {
height: 70px;
overflow: visible;
}
#s-chat-panel svg {
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: rgba(0, 0, 0, 0.15) 0px 4px 12px 0px;
}
#s-chat-panel .fb_dialog {
background: none;
position: static;
}
#s-chat-panel .fb_dialog_content > iframe {
right: 0 !important;
margin: 0 !important;
position: absolute !important;
bottom: 10px !important;
}
#s-chat-panel .fb-customerchat > span > iframe {
position: static !important;
}
#s-chat-panel.active .fb-customerchat > span > iframe {
position: fixed !important;
}
.s-container [data-elementor-type=wp-page] {
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
max-width: 100vw;
}