html {
  font-display: swap;
}

body {
  color: #1f1f1f;
}

:focus-visible,
[tabindex="0"]:focus-visible,
input:focus-visible,
input[type=checkbox].focus-visible+label,
input[type=checkbox]:focus-visible+label,
input[type=radio].focus-visible+label,
input[type=radio]:focus-visible+label,
label:has(input[type=radio].focus-visible),
label:has(input[type=radio]:focus-visible),
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #185418;
  outline-offset: 0px;
  transition: none;
}

/*--table padding--*/
td {
  padding: 3px;
}

/*--contact info-header--*/
.top-navigation-contacts {
  visibility: hidden;
}

/*--cart info--*/
.visible-lg-inline-block {
  display: none !important;
}

/*--search bar--*/
#formSearchForm>fieldset>input.query-input.form-control.search-input.js-search-input {
  border-radius: 0;
  border-color: #a9a9a9;
}

#formSearchForm>fieldset>button {
  border-color: #1f9e37;
}

#formSearchForm>fieldset>button:hover {
  border-color: #185418;
}

/*--search bar in cart--*/
:where(.ums_forms_redesign--off) input[type=search].form-control {
  border-radius: 0;
  border-color: #a9a9a9;
}

.btn.btn-default,
a.btn.btn-default {
  border-color: #1f9e37;
}

.btn.btn-default:hover,
a.btn.btn-default:hover {
  border-color: #185418;
}

/*--top navigation bar--*/
@media (min-width: 768px) {
  .top-navigation-bar .container>div {
    background-color: var(--colors-surface-secondary);
  }

  .top-navigation-bar {
    padding: 5px 0;
    background-color: var(--colors-surface-secondary);
    border-bottom-color: var(--colors-surface-secondary);
  }

  .top-navigation-bar-menu li:before {
    color: var(--colors-surface-secondary);
  }

  .top-navigation-bar-menu li a,
  .top-navigation-bar-menu-helper li a {
    text-transform: none;
    color: #4d4d4d;
  }

  .top-navigation-bar .dropdown button,
  .top-navigation-bar a,
  .top-navigation-menu-trigger:before {
    color: #4d4d4d;
  }
}

/*--navigation menu--*/
.navigation-in ul li a b {
  font-family: 'Kanit', sans-serif;
  font-weight: 500;
  font-style: italic;
  text-transform: uppercase;
  font-size: 16px;
}

@media (min-width: 768px) {
  #navigation {
    height: 48px;
  }

  .navigation-in ul li {
    border-color: #1f9e37;
  }

  .navigation-in ul li a {
    padding-bottom: 17px;
    padding-top: 17px;
  }
}

/*--hamburger menu--*/
.responsive-tools>a[data-target=search]:before {
  font-weight: 600;
  color: #1f9e37;
  transform: scaleX(-1);
}

.responsive-tools>a[data-target=navigation]:before,
.responsive-tools>a[data-target=navigation]:hover:before {
  background-color: #1f9e37;
}

.header-top .btn.cart-count:before {
  font-size: 28px;
}

/*--product hover--*/
.product:hover .p .name {
  text-decoration: underline;
}

div.product {
  transition: box-shadow 0.3s ease;
}

div.product:hover {
  box-shadow: 0 0 0 2px #c0d7c1ff;
  z-index: 9;
}

/*--product name--*/
.products-block.products .p .name {
  color: #1f1f1f;
  font-weight: 600;
  overflow: visible;
}

@media (min-width: 321px) and (max-width: 767px) {
  .columns-mobile-2 .products-block>div .p .name {
    font-size: 13px;
    -webkit-line-clamp: none;
    height: 70px;
  }

  .columns-mobile-2 .products-block>div .ratings-wrapper .availability {
    font-size: 13px;
  }

  .products-block .p-bottom .price-additional {
    font-size: 12px;
  }
}

/*--carousel--*/
@media (min-width: 768px) {
  body>div.overall-wrapper>div.content-wrapper.homepage-box.before-carousel {
    padding-top: 0;
    padding-bottom: 0;
    border-top-style: none;
    border-bottom-style: none;
    background-color: var(--colors-surface-primary);
  }
}

/*--homepage headlines--*/
.h4.homepage-group-title,
h4.homepage-group-title {
  font-family: 'Kanit', sans-serif;
  font-weight: 500;
  font-style: italic;
  text-transform: uppercase;
  font-size: 32px;
}

@media (max-width: 768px) {

  .h4.homepage-group-title,
  h4.homepage-group-title {
    font-size: 26px;
  }
}

/*--homepage blog section--*/
.news-item .text .title {
  font-weight: 600;
}

/*--homepage about us--*/
div.content-wrapper.homepage-box.welcome-wrapper {
  margin-bottom: -1px;
  background-color: #185418;
  background-image: url("/user/documents/dark-green-gradient.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  color: #f6f6f6;
}

div.content-wrapper.homepage-box.welcome-wrapper h1 {
  padding-top: 30px;
  font-size: 28px;
  font-weight: 400;
  color: #ffffff;
}

@media (min-width: 768px) {
  div.content-wrapper.homepage-box.welcome-wrapper {
    padding: 48px 19px;
  }
}

/*--footer--*/
footer {
  background-color: #1f9e37;
  border-color: #1f9e37;
}

#footer>.container {
  background-color: #1f9e37;
}

.custom-footer,
.footer-bottom,
.footer-links-icons {
  border-color: #1f9e37;
}

#footer h3 {
  font-family: 'Kanit', sans-serif;
  font-weight: 500;
  font-style: italic;
  color: #ffffff;
  font-size: 24px;
}

/*--logo-footer--*/
#footer>div.container.footer-rows>div.site-name {
  visibility: hidden;
}

.custom-footer {
  padding-left: 2%;
  background-color: #1f9e37;
  color: #ffffff;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .custom-footer {
    padding-left: 0;
  }
}

#footer .contact-box a,
#footer ul a {
  color: #ffffff;
  font-weight: 600;
}

#footer .contact-box a:hover,
#footer ul a:hover {
  color: #ffffff;
  text-decoration: underline;
}

/*--footer site link--*/
.footer-links-icons {
  padding: 0;
}

/*--footer copyright--*/
#footer>div.container.footer-bottom {
  width: 100%;
  padding: 2px 2%;
  background-color: #f6f6f6;
}

#signature a:hover {
  text-decoration: underline;
}

#footer>div.container.footer-bottom>span.copyright>a:hover {
  color: #1f1f1f;
}

#signature a,
.amp {
  vertical-align: middle;
  color: #4d4d4d;
}

/*--contact icons--*/
.contact-box ul li>span:before {
  font-size: 20px;
}

.contact-box ul li {
  line-height: 28px;
}

.contact-box ul li>span.mail:before,
.contact-box ul li>span.tel:before {
  font-weight: 600;
}