*,
button:focus,
button::-moz-focus-inner {
  outline: none !important;
  border: 0px;
}

html,
body {
  font-family: "Roboto";
  font-size: 16px;
  padding: 0px;
  margin: 0px;
  height: 100%;
}

main,
section,
article,
footer,
aside,
nav {
  display: block;
}

main {
  min-height: calc(100vh - 50px);
}

#page-container {
  position: relative;
  min-height: 100vh;
}

#content-wrap {
  display: flex;
  flex-direction: column;
  padding-top: 105px;
  min-height: calc(100vh - 105px);
}
@media (max-width: 1024px) {
  #content-wrap {
    padding-top: 105px;
    min-height: calc(100vh - 105px);
  }
}

#main-content {
  flex: 1;
}

h1,
h2,
h3,
h4 {
  font-family: "Arial", sans-serif;
  color: #2f5a41;
  font-weight: bold;
  margin-top: 0px;
  padding-top: 10px;
}
h1.gray,
h2.gray,
h3.gray,
h4.gray {
  color: #3488cd;
}

h1 {
  font-size: 38px;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  h1 {
    margin-bottom: 15px;
    font-size: 20px;
  }
}

h2 {
  font-size: 32px;
}
@media (max-width: 1024px) {
  h2 {
    font-size: 22px;
  }
}

h3 {
  font-size: 24px;
  margin-bottom: 20px;
}
@media (max-width: 1024px) {
  h3 {
    font-size: 18px;
    margin-bottom: 10px;
    padding-top: 5px;
  }
}

h4 {
  font-size: 22px;
}
@media (max-width: 1024px) {
  h4 {
    padding-bottom: 10px;
    font-size: 18px;
  }
}

p,
i {
  font-size: 18px;
  color: #333333;
  margin-top: 0px;
  margin-bottom: 0px;
  line-height: 130%;
}
@media (max-width: 1024px) {
  p,
  i {
    font-size: 16px;
  }
}
p.gray,
i.gray {
  color: #a5afb8;
}
p.small,
i.small {
  font-size: 12px !important;
}

b,
strong {
  font-size: 18px;
  color: #333333;
  font-weight: bold;
}
@media (max-width: 1024px) {
  b,
  strong {
    font-size: 16px;
  }
}
b.gray,
strong.gray {
  color: #a5afb8;
}
b.small,
strong.small {
  font-size: 12px !important;
}

a {
  text-decoration: none;
  color: #2f5a41;
  font-size: 18px;
}
@media (max-width: 1024px) {
  a {
    font-size: 16px;
  }
}
a.underline {
  text-decoration: underline;
}
a.small {
  font-size: 12px;
}
a.link-button {
  border: 1px solid #2f5a41;
  background-color: #2f5a41;
  color: #fff;
  border-radius: 10px;
  cursor: pointer;
  padding: 5px 10px;
  transition: all 0.25s ease-in-out;
}
a.link-button:hover {
  transform: scale(1.1);
}
a.next {
  margin: 0px;
  display: inline-block;
  border-bottom: none;
  padding-bottom: 0px;
  color: #2f5a41;
  text-decoration: none;
  width: 100%;
  font-size: 14px;
}
a.next::after {
  content: "";
  display: inline-block;
  width: 33px;
  height: 33px;
  background-image: url(../img/arrow_right_white.svg);
  background-repeat: no-repeat;
  background-position-x: 13px;
  background-position-y: 7px;
  background-size: 10px;
  margin-left: 15px;
  vertical-align: middle;
  border-radius: 20px;
  background-color: #2f5a41;
  margin-top: -2px;
}
a.back {
  margin: 40px 0px 40px 0px;
  display: inline-block;
  border-bottom: none;
  padding-bottom: 12px;
  color: #2f5a41;
  font-weight: normal;
  text-decoration: none;
  text-transform: lowercase;
  font-size: 14px;
}
a.back::before {
  content: "";
  display: inline-block;
  width: 33px;
  height: 33px;
  background-image: url(../img/arrow_left_white.svg);
  background-repeat: no-repeat;
  background-position-x: 10px;
  background-position-y: 5px;
  background-size: 11px;
  margin-right: 10px;
  vertical-align: middle;
  border-radius: 20px;
  background-color: #2f5a41;
  transform: translateY(-2px);
}
a.back.share::before {
  background-image: url(../img/share_white.svg);
  background-position-y: 7px;
  background-position-x: 8px;
  background-size: 15px;
}

ol {
  padding: 0px 28px;
}

ul {
  padding: 0px 28px;
}
ul.nodots {
  padding: 0px;
}
ul.nodots li {
  list-style-type: none;
}
ul.listrow {
  margin: 0px;
  padding: 20px 0px;
}
ul.listrow li {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  border-radius: 20px;
  padding: 5px 10px;
  overflow: hidden;
  margin-bottom: 20px;
  list-style-type: none;
}
ul.listrow li a {
  color: #3488cd;
}
ul.buttonlist {
  padding: 20px 0px;
}
ul.buttonlist li {
  display: inline-block;
  width: auto;
  border: 1px solid #2f5a41;
  color: #2f5a41;
  padding: 8px 12px;
  margin-right: 10px;
  margin-bottom: 10px;
  border-radius: 20px;
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  cursor: pointer;
  list-style-type: none;
  transition: all 0.25s ease-in-out;
}
ul.buttonlist li a {
  color: #2f5a41;
}
ul.buttonlist li:hover {
  transform: scale(1.1);
}
ul.buttonlist li.active {
  background-color: #2f5a41;
  color: #fff;
  position: relative;
  padding: 8px 50px 8px 12px;
  font-weight: 500;
}
ul.buttonlist li.active a {
  color: #fff;
}
ul.buttonlist li.active::before {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url(../img/cross_white.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}
ul.buttonlist li.active::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 25px;
  background-image: url(../img/line_white.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  right: 35px;
  top: 50%;
  transform: translateY(-50%);
}
ul.arrowlist {
  padding: 0px;
}
ul.arrowlist li {
  margin-bottom: 10px;
  padding-left: 20px;
  list-style-type: none;
}
ul.arrowlist li::before {
  position: absolute;
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background-image: url(../img/arrow_right_green.svg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  margin-left: -22px;
  margin-top: 5px;
  vertical-align: middle;
}
@media (max-width: 1024px) {
  ul.arrowlist li::before {
    margin-left: -17px;
    margin-top: 2px;
  }
}
ul.arrowlist li a {
  color: #2f5a41;
}
@media (max-width: 1024px) {
  ul.arrowlist li a {
    font-size: 16px;
  }
}
ul.iconlist li, ul.searchlist li {
  display: inline-block;
  text-align: center;
  margin: 10px 25px;
  font-size: 12px;
  list-style-type: none;
}
@media (max-width: 1024px) {
  ul.iconlist li, ul.searchlist li {
    vertical-align: top;
    margin: 10px 15px;
  }
}
ul.iconlist li .circle, ul.searchlist li .circle {
  width: 46px;
  height: 46px;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 10px;
}
@media (max-width: 1024px) {
  ul.iconlist li .circle, ul.searchlist li .circle {
    height: 40px;
    width: 40px;
  }
}
ul.iconlist li .circle > img, ul.searchlist li .circle > img {
  max-width: 30px;
  max-height: 30px;
}
@media (max-width: 1024px) {
  ul.iconlist li .circle > img, ul.searchlist li .circle > img {
    max-width: 20px;
    max-height: 20px;
  }
}
ul.iconlist li .circle1, ul.searchlist li .circle1 {
  width: 33px;
  height: 33px;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 5px;
}
ul.iconlist li .circle1 > img, ul.searchlist li .circle1 > img {
  max-width: 17px;
  max-height: 17px;
}
ul.iconlist li a, ul.searchlist li a {
  font-size: 12px;
}
ul.iconlist li > a, ul.searchlist li > a {
  color: #2f5a41;
}
ul.iconlist.mobilestack, ul.searchlist.mobilestack {
  padding: 0px 15px;
}
ul.iconlist.mobilestack li, ul.searchlist.mobilestack li {
  display: block;
  margin: 0px;
  padding: 0px;
  margin-bottom: 10px;
  text-align: left;
}
ul.iconlist.mobilestack li .circle, ul.searchlist.mobilestack li .circle {
  position: static;
  display: inline-block;
  vertical-align: middle;
  margin: 0px;
  width: 33px;
  height: 33px;
}
ul.iconlist.mobilestack li .circle img, ul.searchlist.mobilestack li .circle img {
  max-width: 24px;
  max-height: 19px;
}
ul.iconlist.searchlist li, ul.searchlist.searchlist li {
  margin: 10px 25px 0px;
}
@media (max-width: 1024px) {
  ul.iconlist.searchlist li, ul.searchlist.searchlist li {
    margin: 10px 5px;
    float: left;
    width: calc(50% - 10px);
  }
}
ul.iconlist.searchlist li > a, ul.searchlist.searchlist li > a {
  color: #3488cd;
}
ul.iconlist.searchlist li > a.active, ul.searchlist.searchlist li > a.active {
  color: #2f5a41;
}
ul.iconlist.searchlist li:last-of-type, ul.searchlist.searchlist li:last-of-type {
  margin-right: 0px;
}
@media (max-width: 1024px) {
  ul.iconlist.searchlist li:last-of-type, ul.searchlist.searchlist li:last-of-type {
    margin-right: 5px;
  }
}
@media (max-width: 1024px) {
  ul.iconlist.searchlist.triple li, ul.searchlist.searchlist.triple li {
    width: calc(33.3333333333% - 10px);
  }
}
ul.iconlist.gray, ul.searchlist.gray {
  background-color: #f8f8f8;
}
ul.newsback {
  padding: 0px;
  text-decoration: none;
  position: fixed;
  left: 50px;
  z-index: 3000;
  width: auto;
}
@media (max-width: 787px) {
  ul.newsback {
    position: relative;
    left: 20px;
    padding-top: 0px;
    width: calc(100% - 20px);
    top: 12px;
    z-index: 5;
  }
}
ul.newsback li {
  list-style-type: none;
}
@media (max-width: 1024px) {
  ul.newsback li {
    margin-bottom: 10px;
  }
}
ul.newsback li a {
  margin: 0px;
}
@media (max-width: 1024px) {
  ul.newsback li a {
    padding-bottom: 0px;
  }
}

iframe {
  border: 0px;
  width: 100%;
  max-width: 100% !important;
}

button.add-to-basket-abo {
  margin: 50px 0px 100px;
}

table.regular-table {
  width: 100%;
  margin-top: 20px;
  border-collapse: collapse;
  min-width: 1200px;
}
table.regular-table tr td {
  font-size: 18px;
  text-align: left;
  border-bottom: 1px solid #000;
  padding: 5px 0px;
}
table.regular-table tr:first-of-type td {
  font-size: 18px;
}
table.form, table.orders {
  width: 100%;
}
table.form tr td, table.orders tr td {
  padding: 10px 15px;
  font-size: 12px;
  color: #a5afb8;
}
@media (max-width: 1024px) {
  table.form tr td, table.orders tr td {
    font-size: 10px;
    padding: 10px 0px;
  }
}
table.form tr td input,
table.form tr td select,
table.form tr td textarea,
table.form tr td button, table.orders tr td input,
table.orders tr td select,
table.orders tr td textarea,
table.orders tr td button {
  margin-left: 0px;
  margin-top: 5px;
}
@media (max-width: 1024px) {
  table.form tr td input,
  table.form tr td select,
  table.form tr td textarea,
  table.form tr td button, table.orders tr td input,
  table.orders tr td select,
  table.orders tr td textarea,
  table.orders tr td button {
    margin-left: 0px;
  }
}
table.form tr th, table.orders tr th {
  text-align: left;
  font-weight: bold;
}
table.form.orders, table.orders.orders {
  margin-top: 20px;
}
table.form.orders tr td, table.orders.orders tr td {
  font-size: 16px;
}
table.form.orders tr th, table.orders.orders tr th {
  padding: 10px;
}
table.products {
  width: 100%;
  border-collapse: collapse;
}
table.products tr td,
table.products tr th {
  border-bottom: 1px solid #2f5a41;
  font-size: 16px;
  padding: 10px;
}
table.products tr td:last-of-type,
table.products tr th:last-of-type {
  text-align: right;
}
table.odd {
  border-collapse: collapse;
  border: none;
  width: 100%;
}
table.odd tr:nth-child(even) td {
  background-color: #fff;
  padding: 10px;
  border: none;
}
table.odd tr:nth-child(odd) td {
  background-color: #e7e7e7;
  padding: 10px;
  border: none;
}
table.shopdetails tr td {
  vertical-align: top;
  width: auto !important;
}
@media (max-width: 1024px) {
  table.shopdetails tr td {
    width: calc(100% - 40px) !important;
    display: block;
    max-width: calc(100% - 40px) !important;
  }
}
table.shopdetails tr td:first-of-type {
  font-weight: bold;
  text-align: right;
  color: #3488cd;
  max-width: 300px;
  width: 300px !important;
}
@media (max-width: 1024px) {
  table.shopdetails tr td:first-of-type {
    text-align: left;
    width: calc(100% - 40px) !important;
    display: block;
    max-width: calc(100% - 40px) !important;
  }
}

button {
  cursor: pointer;
  transition: all 0.25s ease-in-out;
}
button:hover {
  transform: scale(1.1);
}
button.buttonpink {
  margin-bottom: 20px;
  text-transform: lowercase;
  font-size: 12px;
}

hr {
  height: 0px;
  border: 1px solid #e7e7e7;
}

form {
  width: 100%;
}

textarea {
  width: calc(100% - 40px);
  border-radius: 20px;
  border: 1px solid #a5afb8;
  padding: 20px;
  font-family: "Roboto", sans-serif;
  resize: none;
  font-size: 18px;
}

input {
  border-radius: 20px;
  padding: 5px 10px;
  border: 1px solid #a5afb8;
  line-height: 24px;
  padding: 8px 16px;
  width: calc(100% - 32px);
  font-size: 18px;
  font-family: "Roboto", sans-serif;
  margin-top: 5px;
}
input[type=date] {
  width: calc(100% - 32px);
  padding: 8px 16px 8px 16px;
}
input[type=checkbox], input[type=radio] {
  width: auto;
}
input[type=text].icon {
  background-image: url("/templates/web/img/arrow_down_white.svg"), radial-gradient(#750947 70%, transparent 72%);
  background-position: calc(100% - 10px), calc(100% - 5px);
  background-size: 20px 25px, 31px 31px;
  background-repeat: no-repeat;
}
input[type=text].icon.search {
  background-image: url("/templates/web/img/search_white.svg"), radial-gradient(#750947 70%, transparent 72%);
  background-size: 16px 16px, 31px 31px;
}
input[name=special_amount] {
  margin-top: 5px;
  margin-bottom: 15px;
  padding: 8px 16px;
}
input[name=special_amount].error {
  border: 1px solid red;
}
input.basic {
  padding: 8px 16px 8px 16px;
  width: calc(100% - 32px);
}

select {
  width: calc(100% - 0px);
  background-color: white;
  border: 1px solid #a5afb8;
  border-radius: 20px;
  display: inline-block;
  font-size: 18px;
  line-height: 24px;
  padding: 8px 16px;
  margin: 0;
  margin-top: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}
select:focus {
  border-color: #a5afb8;
  outline: 0;
}
select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

button,
input[type=submit] {
  background-color: #2f5a41;
}
button.gray,
input[type=submit].gray {
  background-color: #a5afb8;
}
button,
input[type=submit] {
  color: #fff;
  border: none;
  padding: 8px 20px;
  border-radius: 20px;
  font-size: 18px;
  text-transform: uppercase;
  font-family: "Roboto", serif;
  font-weight: 500;
  width: auto;
  cursor: pointer;
  transition: all 0.25s ease-in-out;
}
button:hover,
input[type=submit]:hover {
  transform: scale(1.1);
}
button.tag,
input[type=submit].tag {
  padding: 6px 10px;
}

.custom {
  position: relative;
  padding-left: 30px;
  margin-bottom: 10px;
}

.custom-radio {
  width: 20px;
  height: 20px;
  display: inline-block;
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 5px;
  margin-right: 0px;
  background: url("/templates/web/img/inactivradio.svg") no-repeat;
  background-size: 100%;
}
.custom-radio.selected {
  background: url("/templates/web/img/activradio.svg") no-repeat;
  background-size: 100%;
}
.custom-radio input[type=radio] {
  margin: 1px;
  position: absolute;
  z-index: 2;
  cursor: pointer;
  outline: none;
  opacity: 0;
  width: 100% !important;
  height: 100% !important;
  /* CSS hacks for older browsers */
  /*_noFocusLine: expression(this.hideFocus=true);*/
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -khtml-opacity: 0;
  -moz-opacity: 0;
}
.custom-radio {
  /* Beautify the Form */
}
.custom-radio form {
  margin: 20px;
}

.checkboxwrap {
  width: calc(100% - 30px);
  margin-top: 10px;
  margin-bottom: 10px;
  position: relative;
  padding-left: 30px;
}
.checkboxwrap input[type=checkbox] {
  -webkit-appearance: none;
  background-color: transparent;
  border: 0px;
  width: 0px;
  height: 0px;
  margin: 0px;
  padding: 0px;
  position: relative;
  pointer-events: none;
}
@media (max-width: 1024px) {
  .checkboxwrap input[type=checkbox] {
    margin-left: 0px;
  }
}
.checkboxwrap label {
  float: left;
  height: 20px;
  width: 20px;
  border: none;
  background: url("/templates/web/img/inactivecheckbox.svg") no-repeat;
  background-size: 20px;
  border-radius: 0px;
  position: absolute;
  margin-right: 0px;
  left: 5px;
  top: 3px;
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-transition: border-color ease 0.2s;
  -o-transition: border-color ease 0.2s;
  -webkit-transition: border-color ease 0.2s;
  transition: border-color ease 0.2s;
  cursor: pointer;
}
.checkboxwrap input[type=checkbox]:checked + .check-box,
.checkboxwrap .check-box.checked {
  background: url("/templates/web/img/activecheckbox.svg") no-repeat;
  background-size: 20px;
}
.checkboxwrap.selected label {
  background: url("/templates/web/img/activecheckbox.svg") no-repeat;
  background-size: 20px;
}
.checkboxwrap p {
  display: inline-block;
  margin: 0px 10px;
  color: #000;
  clear: none;
  font-weight: normal;
  font-size: 17px;
  max-width: calc(100% - 50px);
}
.checkboxwrap a {
  font-size: 18px;
}
@media (max-width: 1024px) {
  .checkboxwrap a {
    font-size: 14px;
  }
}
.checkboxwrap span {
  font-size: 18px;
  color: #333333;
  margin-top: 0px;
  margin-bottom: 0px;
  line-height: 130%;
}

.checkarrow {
  margin: 0px;
  display: inline-block;
  border-bottom: none;
  padding-bottom: 12px;
  color: #3488cd;
  font-weight: normal;
  text-decoration: none;
  width: 100%;
  font-size: 14px;
}
.checkarrow::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url(../img/check_green.svg);
  background-repeat: no-repeat;
  background-position-x: 0px;
  background-position-y: 0px;
  background-size: 20px;
  margin-right: 10px;
  vertical-align: middle;
  border-radius: 20px;
  background-color: #2f5a41;
  transform: translateY(-2px);
}

.underlined {
  border-bottom: 1px solid #3488cd;
}

.plusMinusBtn {
  position: relative;
  max-width: 200px;
}
.plusMinusBtn .minus,
.plusMinusBtn .plus {
  position: absolute;
  width: 30px;
  height: 30px;
  background-color: #2f5a41;
  top: 50%;
  transform: translateY(calc(-50% + 2px));
  border-radius: 20px;
}
.plusMinusBtn .minus img,
.plusMinusBtn .plus img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.plusMinusBtn input {
  padding: 8px 40px 8px 40px;
  text-align: center;
  -moz-appearance: textfield;
}
.plusMinusBtn input::-webkit-outer-spin-button, .plusMinusBtn input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.plusMinusBtn .minus {
  left: 7px;
}
.plusMinusBtn .plus {
  right: -3px;
}

.centered {
  text-align: center;
}

.nopadding {
  padding: 0px;
}

.nomargin {
  margin: 0px;
}

.appendWrapper {
  width: calc(100% + 15px);
}
@media (max-width: 1024px) {
  .appendWrapper {
    width: 100%;
  }
}

.desktop {
  display: block !important;
}
@media (max-width: 1024px) {
  .desktop {
    display: none !important;
  }
}

.mobile {
  display: none !important;
}
@media (max-width: 1024px) {
  .mobile {
    display: block !important;
  }
}

.flexed {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

.rating > img {
  margin-right: 5px;
  width: 15px;
  height: 15px;
}

nav:not(.sub) {
  padding: 20px 50px;
  background-color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  z-index: 4000;
  width: calc(100% - 100px);
  position: fixed;
  top: 0px;
}
@media (max-width: 1024px) {
  nav:not(.sub) {
    padding: 20px 20px;
    width: calc(100% - 40px);
    position: fixed;
  }
}
nav:not(.sub) .loginbtn,
nav:not(.sub) .basketbtn {
  right: 50px;
  top: 30px;
  border: 1px solid #2f5a41;
  padding: 10px 5px 10px 20px;
  border-radius: 50px;
  color: #3488cd;
  transform: translateY(-2px);
  font-size: 12px;
}
@media (max-width: 1024px) {
  nav:not(.sub) .loginbtn,
  nav:not(.sub) .basketbtn {
    position: initial;
    padding: 10px 5px 10px 20px;
    width: auto;
  }
}
nav:not(.sub) .loginbtn::after,
nav:not(.sub) .basketbtn::after {
  background-image: url("/templates/web/img/profil_green.svg");
  content: "";
  display: inline-block;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 10px;
  vertical-align: middle;
}
nav:not(.sub) .loginbtn p,
nav:not(.sub) .basketbtn p {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
nav:not(.sub) .loginbtn.basketbtn,
nav:not(.sub) .basketbtn.basketbtn {
  right: 180px;
}
nav:not(.sub) .loginbtn.basketbtn::after,
nav:not(.sub) .basketbtn.basketbtn::after {
  background-image: url("/templates/web/img/smart-cart.png");
  padding-right: 10px;
}
nav:not(.sub) > div > a > img {
  max-width: 60px;
  display: inline-block;
  margin-right: 0px;
}
@media (max-width: 1024px) {
  nav:not(.sub) > div.navpoints {
    position: absolute;
    left: 0px;
    top: 103px;
    width: 100%;
    background-color: #fff;
    max-height: 0;
    overflow: hidden;
    z-index: 10000;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: max-height 0.8s ease-out;
  }
}
nav:not(.sub) > div.navpoints ul {
  list-style-type: none;
  padding: 0px;
  display: inline-block;
  margin: 0px;
}
@media (max-width: 1024px) {
  nav:not(.sub) > div.navpoints ul {
    padding: 20px;
    width: calc(100% - 40px);
  }
}
nav:not(.sub) > div.navpoints ul li {
  display: inline-block;
  margin-right: 50px;
}
@media (max-width: 1460px) {
  nav:not(.sub) > div.navpoints ul li {
    margin-right: 25px;
  }
}
@media (max-width: 1024px) {
  nav:not(.sub) > div.navpoints ul li {
    margin-right: 25px;
    display: block;
    margin-right: 0px;
    text-align: center;
    padding: 20px 0px;
    border-bottom: 1px solid #f8f8f8;
  }
}
nav:not(.sub) > div.navpoints ul li a {
  text-decoration: none;
  color: #2f5a41;
  transition: all 0.25s ease-in-out;
}
nav:not(.sub) > div.navpoints ul li.active {
  font-weight: bold;
}
@media (max-width: 1024px) {
  nav:not(.sub).open {
    z-index: 102;
  }
}
@media (max-width: 1024px) {
  nav:not(.sub).open .navpoints {
    max-height: 600px;
  }
}
nav.sub {
  text-align: center;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin: 0px;
  padding: 20px 0px;
  margin-bottom: 25px;
}
@media (max-width: 1024px) {
  nav.sub {
    padding: 0px;
  }
}
nav.sub ul {
  margin: 0px;
}
@media (max-width: 1024px) {
  nav.sub ul {
    padding: 20px 0px;
  }
}
nav.sub ul li {
  margin: 10px 0px;
  padding: 0px 20px;
  display: inline-block;
  border-right: 1px solid #2f5a41;
}
@media (max-width: 1024px) {
  nav.sub ul li {
    display: block;
    padding: 0px 20px;
    border: none;
  }
}
nav.sub ul li a {
  text-transform: uppercase;
  padding: 5px 0px;
}
nav.sub ul li.active a {
  border-bottom: 1px solid #2f5a41;
}
nav.sub ul li:last-of-type {
  border-right: none;
}

.circle,
.circle1 {
  width: 33px;
  height: 33px;
  border-radius: 50%;
  position: relative;
}
.circle.pink, .circle.active,
.circle1.pink,
.circle1.active {
  background-color: #2f5a41 !important;
}
.circle.gray,
.circle1.gray {
  background-color: #3488cd;
}
.circle.white,
.circle1.white {
  background-color: #fff;
}
.circle > img,
.circle1 > img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.max0 section > div {
  max-width: none;
  width: 100%;
}

.max1 {
  overflow: hidden;
}
.max1 section > div {
  max-width: 1200px;
}

.max2 section > div {
  max-width: 1200px;
  padding: 20px 0px;
}

.max3 section > div {
  max-width: 1200px;
}

.max4 section > div {
  max-width: 1200px !important;
}

.max5 section > div {
  max-width: none;
  width: calc(100% - 100px);
}
@media (max-width: 1024px) {
  .max5 section > div {
    width: calc(100% - 30px);
  }
}

section.contactform, section.user_form_container {
  padding-bottom: 40px;
}
section.contactform h2, section.user_form_container h2 {
  color: #3488cd;
}
section.contactform form, section.user_form_container form {
  max-width: 100%;
}
section.basket h1 {
  padding-top: 40px;
}
section.portrait, section.textelement {
  padding: 25px 0px 0px;
}
@media (max-width: 1024px) {
  section.portrait, section.textelement {
    padding: 10px 0px 0px;
  }
}
section.portrait.blue h1,
section.portrait.blue h2,
section.portrait.blue h3, section.textelement.blue h1,
section.textelement.blue h2,
section.textelement.blue h3 {
  color: #3488cd;
}
section.portrait.blue .link-button, section.textelement.blue .link-button {
  background-color: #3488cd;
  border: 1px solid #3488cd;
}
section.portrait.green h1,
section.portrait.green h2,
section.portrait.green h3, section.textelement.green h1,
section.textelement.green h2,
section.textelement.green h3 {
  color: #2f5a41;
}
section.portrait.green .link-button, section.textelement.green .link-button {
  background-color: #2f5a41;
  border: 1px solid #2f5a41;
}
section.portrait img, section.textelement img {
  border-radius: 14px;
  transition: all 0.25s ease-in-out;
}
@media (max-width: 1024px) {
  section.portrait img, section.textelement img {
    max-width: 100%;
  }
}
section.portrait img:hover, section.textelement img:hover {
  transform: scale(1.02);
}
section.textelement > div {
  max-width: 1200px;
  padding: 20px 0px;
}
section .saferpay {
  min-height: 1000px;
  margin: 50px auto;
}
section .saferpay iframe {
  height: 100% !important;
  min-height: 700px !important;
}
section .epaper {
  width: 100%;
  height: calc(100vh - 135px);
  padding: 0px 0px 40px;
}
section .epaper iframe {
  border: 0px;
  width: 100%;
  height: 100%;
}
section .newsletter {
  max-width: 408px;
  margin-left: auto;
  margin-right: auto;
}
section .newsletter button {
  width: auto;
}
section .newsletter table tr:last-of-type td {
  text-align: center;
}
section.titlebar {
  padding: 25px 0px;
}
section.titlebar h1 {
  font-size: 32px;
  color: #fff;
  margin: 0px;
  padding: 0px;
}
@media (max-width: 1024px) {
  section.titlebar h1 {
    font-size: 20px;
  }
}
section.titlebar h1:last-of-type {
  color: #c4c4c4;
  padding-top: 10px;
}
section.titlebar.green {
  background: linear-gradient(to right, #1e5b42 0%, #6b8472 30%, #bfc6bd 70%, #789080 90%, #3f664f 100%);
}
section.titlebar.blue {
  background: linear-gradient(90deg, #3d7abd 0%, #6f95c8 35%, #b8c3d8 75%, #d3d9e5 90%, #7da0d2 100%);
}
section.article {
  padding: 25px 0px;
}
section.article article img {
  height: 200px;
  object-fit: cover;
  width: 100%;
}
section.article article .headline-teaser {
  padding: 10px;
}
section.team h1 {
  border-bottom: 1px solid #2f5a41;
  padding-bottom: 10px;
}
section.team article {
  padding: 20px;
  box-shadow: none;
  border: none;
}
@media (max-width: 1024px) {
  section.team article {
    width: calc(100% - 40px);
    text-align: center;
  }
}
section.team article h3 {
  font-size: 20px;
  margin-bottom: 5px;
  padding-top: 0px;
}
@media (max-width: 1024px) {
  section.team article > div {
    text-align: center;
  }
}
section.gray {
  padding: 25px 0px;
  background-color: #f8f8f8;
}
section.white {
  padding: 25px 0px;
}
section.spacing > div {
  height: 50px;
}
section.account {
  padding: 50px 0px;
}
section.account > div {
  min-height: 51vh;
}
section .halfsplit {
  max-width: 100%;
  display: flex;
}
section .halfsplit .hasimages {
  width: 50%;
}
section .halfsplit .hasimages input[name=count] {
  max-width: calc(100% - 306px);
  float: left;
}
section .halfsplit .hasimages .add-to-basket {
  width: 220px;
  margin-left: 50px;
}
section .halfsplit .full {
  display: inline-block;
  margin-right: 10px;
  height: 100%;
  vertical-align: top;
}
@media (max-width: 1024px) {
  section .halfsplit .full {
    width: 100%;
    display: block;
    margin-right: 0px;
  }
}
section .halfsplit .full .kitchen {
  position: absolute;
  margin-left: 25px;
  display: inline-block;
  margin-top: 1px;
}
section .halfsplit .left {
  width: calc(50% - 10px);
  display: inline-block;
  margin-right: 10px;
  height: 100%;
  vertical-align: top;
}
@media (max-width: 1024px) {
  section .halfsplit .left {
    width: 100%;
    display: block;
    margin-right: 0px;
  }
}
section .halfsplit .right {
  width: calc(50% - 15px);
  display: inline-block;
  margin-left: 10px;
  height: 100%;
  vertical-align: top;
}
@media (max-width: 1024px) {
  section .halfsplit .right {
    width: 100%;
    margin-left: 0px;
    display: block;
  }
}
section .halfsplit .googlemap-responsive {
  height: 100%;
}
section > div {
  max-width: 1200px;
  width: calc(100% - 40px);
  margin: 0px auto;
  background-color: transparent;
}
@media (max-width: 1024px) {
  section > div {
    width: calc(100% - 40px);
    max-width: calc(100% - 40px);
  }
}
section > div .articlewrapper {
  display: flex;
}
@media (max-width: 1024px) {
  section > div .articlewrapper {
    display: block;
  }
}
section > div article {
  width: calc(25% - 54px);
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 15px;
  border: 1px solid #f8f8f8;
  border-radius: 15px;
  overflow: hidden;
  background-color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  transition: all 0.25s ease-in-out;
  cursor: pointer;
}
section > div article:last-of-type {
  margin-right: 0px;
}
@media (max-width: 1024px) {
  section > div article {
    width: calc(50% - 20px);
  }
}
@media (max-width: 787px) {
  section > div article {
    width: calc(100% - 0px);
    margin-right: 0px;
  }
}
section > div article:hover {
  transform: scale(1.05);
}
section > div article .inline {
  position: relative;
}
section > div article .inline > img,
section > div article .inline .lazy {
  max-width: 100%;
  height: 250px;
  width: 100%;
  object-fit: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
section > div article .inline.hasimages .favs {
  top: 275px;
}
section > div article .inline.hasimages .tag {
  top: 210px;
}
section > div article .inline .next {
  margin: 0px;
  display: inline-block;
  border-bottom: none;
  padding-bottom: 0px;
  color: #2f5a41;
  text-decoration: none;
  width: 100%;
  font-size: 14px;
}
section > div article .inline .next::after {
  content: "-";
  display: inline-block;
  margin-left: 15px;
  vertical-align: middle;
  color: #2f5a41;
}
section > div article .inline .tag {
  padding: 5px 20px 5px 10px;
  position: absolute;
  left: 0px;
  top: 10px;
  background-color: #2f5a41;
  color: #fff;
  border-radius: 0px 15px 15px 0px;
  font-size: 12px;
}
section > div article .inline .favs {
  padding: 5px 20px;
  position: absolute;
  right: 0px;
  top: 10px;
}
section > div article .inline .text {
  padding: 10px 15px 40px 15px;
  text-align: left;
  min-height: 115px;
  max-height: 110px;
}
@media (max-width: 1024px) {
  section > div article .inline .text {
    min-height: 70px;
  }
}
section > div article .inline .text h3 {
  font-size: 22px;
  font-weight: 700;
  color: #2f5a41;
  margin: 0px;
  line-height: 120%;
  padding-bottom: 10px;
  padding-right: 30px;
}
section > div article .inline .text p {
  font-family: "Roboto", serif;
  font-size: 12px;
  color: #333333;
  margin-bottom: 5px;
}
section > div article .inline .rating {
  position: absolute;
  right: 15px;
  bottom: 20px;
}
section > div article .inline .rating img {
  margin-right: 5px;
}
section > div article .inline .date {
  position: absolute;
  left: 15px;
  bottom: 28px;
  font-size: 14px;
  color: #a5afb8;
}
section > div article .inline .readmore {
  position: absolute;
  right: 15px;
  bottom: 20px;
  color: #2f5a41;
}
section > div article .inline .readmore > a {
  display: inline-block;
}
section > div article .inline .readmore .circle {
  float: right;
}
section > div article .inline .readmore .circle::after {
  content: "";
  display: block;
  clear: both;
}
section > div article .inline .readmore img {
  margin-right: 5px;
}
section > div article .inline .readmore::after {
  content: "";
  display: block;
  clear: both;
}
section > div article .inline p {
  color: #a5afb8;
}
section > div article .inline p.price {
  color: #2f5a41;
}
section > div .login,
section > div .registration {
  display: block;
  float: left;
  width: calc(50% - 20px);
  padding-right: 20px;
  max-width: 50%;
}
@media (max-width: 1024px) {
  section > div .login,
  section > div .registration {
    max-width: 100% !important;
  }
}
section > div .login.nomaxwidth,
section > div .registration.nomaxwidth {
  max-width: none;
  margin: auto;
}
@media (max-width: 1024px) {
  section > div .login,
  section > div .registration {
    float: none;
    display: block;
    width: 100%;
    margin-bottom: 20px;
  }
}
section > div .login table,
section > div .registration table {
  width: 100%;
  margin-top: 20px;
}
section > div .login table tr td,
section > div .registration table tr td {
  padding: 5px 0px;
  /*&:first-of-type {
    width: 20px;
    text-align: right;
    padding-right: 10px;
  }*/
}
section > div .clear {
  width: 100%;
  padding-bottom: 40px;
}
section > div .clear::after {
  display: block;
  clear: both;
  content: "";
}
section > div .basket {
  width: 100%;
  margin-top: 20px;
  border-collapse: collapse;
  min-width: 600px;
}
section > div .basket tr td {
  font-size: 18px;
  font-family: "Roboto", sans-serif;
  line-height: 130%;
  text-align: left;
  border: 1px solid #2f5a41;
  padding: 5px 0px;
}
section > div .basket tr td:first-of-type {
  text-align: left;
}
section > div .basket tr td:last-of-type {
  padding-left: 10px;
  text-align: right;
  width: 50px;
}
section > div .basket tr td.nopadding {
  padding-left: 0px;
}
section > div .basket tr td a {
  font-size: 18px;
  font-family: "Roboto", sans-serif;
  line-height: 130%;
}
section > div .basket tr:first-of-type td {
  font-size: 22px;
  font-family: "Roboto", sans-serif;
  line-height: 130%;
  font-weight: bold;
}
section > div .basket tr:first-of-type td:nth-child(1n) {
  width: 150px;
}
section > div .basket tr:first-of-type td:nth-child(3n) {
  width: 150px;
}
section > div .basket tr.haspadding td {
  padding: 10px !important;
}
section > div .basket tr:not(:first-of-type) td {
  height: 38px;
}
section > div .basket tr.bold td {
  text-transform: uppercase;
  font-family: "Roboto";
  border-bottom: 0px;
  padding-bottom: 20px;
}
section > div .basket tr.bold.nopadding td {
  padding-bottom: 0px;
}
section > div .basket tr:last-of-type td {
  border-bottom: 0px;
  padding-top: 0px;
}
@media (max-width: 1024px) {
  section.shopdetailview > div > .gridcontainer {
    display: block;
  }
}
section.shopdetailview > div p {
  font-size: 16px;
  margin-bottom: 0px;
}
section.shopdetailview > div h4 {
  margin-bottom: 20px;
  padding: 0px;
}
@media (max-width: 1024px) {
  section.shopdetailview .description > div {
    display: block;
  }
}
@media (max-width: 787px) {
  section.shopdetailview .description > div {
    display: block !important;
  }
}
section.related {
  padding: 25px 0px 50px 0px;
}
section .slider,
section .shop-slider {
  padding: 0px;
}
section .slider.shop-slider,
section .shop-slider.shop-slider {
  width: 50%;
  padding: 0px 50px 50px 0px;
  margin-top: 0px;
  margin-bottom: 0px;
}
@media (max-width: 1024px) {
  section .slider.shop-slider,
  section .shop-slider.shop-slider {
    width: 100%;
    float: none;
  }
}
section .slider.shop-slider .slick-slide > div,
section .shop-slider.shop-slider .slick-slide > div {
  padding-bottom: 82.8%;
}
section .slider.shop-slider .slick-slide > div img,
section .shop-slider.shop-slider .slick-slide > div img {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: contain;
}
section .slider img,
section .shop-slider img {
  object-fit: cover;
}
section .slider.inlineslider img,
section .shop-slider.inlineslider img {
  background-color: #a5afb8;
  object-fit: contain !important;
  width: 100%;
  height: 100%;
}
@media (max-width: 1024px) {
  section .slider.inlineslider img,
  section .shop-slider.inlineslider img {
    background-color: transparent;
  }
}
section .slider.inlineslider p,
section .shop-slider.inlineslider p {
  margin: 0px;
  padding: 0px;
  color: #a5afb8;
  font-size: 12px;
}
section .slider .slick-arrow,
section .shop-slider .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  background-color: transparent;
  border: 0px;
  cursor: pointer;
}
section .slider .slick-arrow.slick-prev,
section .shop-slider .slick-arrow.slick-prev {
  left: 15px;
  font-size: 0px;
  color: transparent;
  width: 20px;
  height: 40px;
}
section .slider .slick-arrow.slick-prev::before, section .slider .slick-arrow.slick-prev::after,
section .shop-slider .slick-arrow.slick-prev::before,
section .shop-slider .slick-arrow.slick-prev::after {
  position: absolute;
  left: 0px;
  top: 30%;
  display: block;
  content: "";
  width: 25px;
  height: 3px;
  background-color: #2f5a41;
  transform: translateY(-50%) rotate(-45deg);
}
section .slider .slick-arrow.slick-prev::after,
section .shop-slider .slick-arrow.slick-prev::after {
  top: 70%;
  transform: translateY(-50%) rotate(45deg);
}
section .slider .slick-arrow.slick-next,
section .shop-slider .slick-arrow.slick-next {
  right: 15px;
  font-size: 0px;
  color: transparent;
  width: 20px;
  height: 40px;
}
section .slider .slick-arrow.slick-next::before, section .slider .slick-arrow.slick-next::after,
section .shop-slider .slick-arrow.slick-next::before,
section .shop-slider .slick-arrow.slick-next::after {
  position: absolute;
  right: 0px;
  top: 30%;
  display: block;
  content: "";
  width: 25px;
  height: 3px;
  background-color: #2f5a41;
  transform: translateY(-50%) rotate(45deg);
}
section .slider .slick-arrow.slick-next::after,
section .shop-slider .slick-arrow.slick-next::after {
  top: 70%;
  right: 0px;
  transform: translateY(-50%) rotate(-45deg);
}
section .slider .slick-slide,
section .shop-slider .slick-slide {
  position: relative;
}
section .slider .slick-slide img,
section .shop-slider .slick-slide img {
  width: 100%;
  object-fit: cover;
  object-position: center center;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}
section .slider .slick-slide video,
section .shop-slider .slick-slide video {
  width: 100%;
  height: 667px;
  object-fit: contain;
  object-position: center center;
}
@media (max-width: 1024px) {
  section .slider .slick-slide video,
  section .shop-slider .slick-slide video {
    height: 400px;
  }
}
section .slider .slick-slide > div,
section .shop-slider .slick-slide > div {
  padding-bottom: 56.25%;
  position: relative;
  position: absolute;
  width: calc(100% - 20px);
  margin: 0px;
  padding: 5px 10px;
  bottom: 0px;
  font-family: "Roboto", sans-serif;
  font-weight: normal;
  color: #fff;
  font-size: 20px;
  z-index: 2;
  /*background-color: $green;*/
  /*.counter {
        display: block;
        float: left;
        width: 50px;
        font-family: 'Roboto', sans-serif;
        font-weight: 900;
        line-height: 160%;
      }*/
}
section .slider .slick-slide > div > p,
section .shop-slider .slick-slide > div > p {
  margin: 0px;
  padding: 0px;
  /*float: left;
      width: calc(100% - 50px);*/
  font-family: "Roboto", sans-serif;
  font-weight: normal;
}
@media (max-width: 1024px) {
  section .slider .slick-slide > div > p,
  section .shop-slider .slick-slide > div > p {
    font-size: 16px;
  }
}
section .slider .slick-slide > div::after,
section .shop-slider .slick-slide > div::after {
  display: block;
  content: "";
  clear: both;
}
section .slider ul.slick-dots,
section .shop-slider ul.slick-dots {
  position: absolute;
  left: 50%;
  bottom: 15px;
  transform: translateX(-50%);
  list-style: none;
  padding: 0px;
  margin: 0px;
}
section .slider ul.slick-dots li,
section .shop-slider ul.slick-dots li {
  display: inline-block;
}
section .slider ul.slick-dots li button,
section .shop-slider ul.slick-dots li button {
  color: transparent;
  font-size: 0px;
  width: 12px;
  height: 12px;
  background-color: transparent;
  border-radius: 12px;
  margin: 5px;
  display: block;
  border: 2px solid #2f5a41;
  padding: 0px;
}
section .slider ul.slick-dots li.slick-active button,
section .shop-slider ul.slick-dots li.slick-active button {
  background-color: #2f5a41;
}

@media (max-width: 1024px) {
  .table-wrapper {
    overflow-x: auto;
    max-width: calc(100vw - 40px);
    width: 100%;
  }
}
@media (max-width: 1024px) {
  .table-wrapper table {
    min-width: 500px;
  }
}

.wysiwyg p {
  margin-bottom: 25px;
}
.wysiwyg p:last-child {
  margin-bottom: 0px;
}
.wysiwyg img {
  border-radius: 14px;
}
.wysiwyg .table-wrapper table tr td {
  padding: 10px;
}
.wysiwyg .table-wrapper table.no-border {
  border: none;
  width: 100%;
}
.wysiwyg .table-wrapper table.no-border tr td {
  border: none;
  padding: 10px 0px;
}
.wysiwyg ul {
  padding: 0px;
  margin-bottom: 32px;
}
.wysiwyg ul li {
  margin-bottom: 10px;
  padding-left: 0px;
  list-style-type: none;
  font-size: 18px;
  color: #333333;
}
@media (max-width: 1024px) {
  .wysiwyg ul li {
    font-size: 16px;
  }
}
.wysiwyg ul li::before {
  display: inline-block;
  margin-right: 20px;
  content: "-";
  display: inline-block;
  vertical-align: middle;
  color: #2f5a41;
}
.wysiwyg ul li a {
  color: #2f5a41;
}
@media (max-width: 1024px) {
  .wysiwyg ul li a {
    font-size: 16px;
  }
}

.gridcontainer {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 1024px) {
  .gridcontainer {
    grid-template-columns: 1fr;
  }
}
.gridcontainer {
  gap: 10px 10px;
  width: 100%;
  max-width: 100%;
}
@media (max-width: 1024px) {
  .gridcontainer.stillGridMobile {
    grid-template-columns: 1fr 1fr;
    display: grid !important;
    padding: 10px 0px;
  }
}
.gridcontainer .white {
  padding: 0px;
}
.gridcontainer .white h1:first-child,
.gridcontainer .white h2:first-child {
  margin-top: 0px;
  padding-top: 0px;
}
.gridcontainer .left section > div,
.gridcontainer .right section > div {
  width: 100%;
  max-width: 100%;
}
.gridcontainer.triple {
  grid-template-columns: 1fr 1fr 1fr;
}
@media (max-width: 1024px) {
  .gridcontainer.triple {
    grid-template-columns: 1fr;
  }
}
.gridcontainer > div p {
  margin-bottom: 25px;
}
.gridcontainer > div img {
  width: 100%;
  max-width: 100%;
}
.gridcontainer > div .left {
  padding: 20px 20px 20px 0px;
}
@media (max-width: 1024px) {
  .gridcontainer > div .left {
    padding: 0px;
  }
}
.gridcontainer > div .right {
  padding: 20px 0px 20px 20px;
}
@media (max-width: 1024px) {
  .gridcontainer > div .right {
    padding: 0px;
  }
}

#burger {
  position: fixed;
  right: 60px;
  top: 36px;
  height: 32px;
  width: 30px;
  cursor: pointer;
  z-index: 4002;
  display: none;
}
@media (max-width: 1024px) {
  #burger {
    right: 20px;
    top: 45px;
    display: block;
  }
}
#burger div {
  position: absolute;
  width: 30px;
  height: 3px;
  background-color: #2f5a41;
  top: 10px;
  border-radius: 10px;
  transition: 0.5s all ease;
}
#burger div:first-of-type {
  top: -1px;
}
#burger div:last-of-type {
  top: 21px;
}
#burger.active {
  display: block;
}
@media (max-width: 1024px) {
  #burger.active {
    top: 38px;
  }
}
#burger.active div {
  background-color: #2f5a41;
  transform: rotate(45deg);
  top: 14px;
}
#burger.active div:last-of-type {
  transform: rotate(-45deg);
}

.popup,
.popup1 {
  top: 0px;
  left: 0px;
  position: fixed;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
  display: none;
  z-index: 5000;
  transition: all 0.25s ease-in-out;
}
.popup .close,
.popup1 .close {
  position: absolute;
  right: 20px;
  top: 20px;
}
.popup .gridcontainer,
.popup1 .gridcontainer {
  align-items: center;
}
.popup .buttonlist,
.popup1 .buttonlist {
  margin: 0px;
}
.popup .resetbtn,
.popup1 .resetbtn {
  padding: 25px 0px;
  display: block;
  font-size: 12px;
}
.popup h4,
.popup1 h4 {
  margin-bottom: 0px;
}
.popup > div,
.popup1 > div {
  max-width: 1044px;
  padding: 10px 40px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 20px;
}
@media (max-width: 1024px) {
  .popup > div,
  .popup1 > div {
    padding: 10px 10px;
    width: calc(100% - 40px);
  }
}
@media (max-width: 1024px) {
  .popup .accordion,
  .popup1 .accordion {
    margin-bottom: 20px;
  }
}
@media (max-width: 1024px) {
  .popup .accordion p,
  .popup1 .accordion p {
    padding: 20px 0px;
  }
}
@media (max-width: 1024px) {
  .popup .accordion .circle,
  .popup1 .accordion .circle {
    top: 15px;
    transform: none;
  }
  .popup .accordion .circle img,
  .popup1 .accordion .circle img {
    width: 17px;
  }
}
@media (max-width: 1024px) {
  .popup .accordion.open .circle,
  .popup1 .accordion.open .circle {
    transform: rotate(180deg);
  }
}
@media (max-width: 1024px) {
  .popup.popup > div,
  .popup1.popup > div {
    top: auto;
    bottom: 0px;
    transform: translateX(-50%);
    border-radius: 20px 20px 0px 0px;
  }
}
@media (max-width: 1024px) {
  .popup.popup1 .iconlist,
  .popup1.popup1 .iconlist {
    text-align: center;
  }
}

.defaultpadding {
  padding: 50px 0px;
}

.defaultpadding1 {
  padding: 25px 0px;
}

.cart-item {
  display: flex;
  padding: 24px 0px;
  gap: 20px;
  border-bottom: 1px solid #2f5a41;
}
.cart-item:first-of-type {
  padding: 24px 0px 10px 0px;
}
.cart-item.noimage .f1 img {
  max-width: 80px;
}
@media (max-width: 1024px) {
  .cart-item.noimage .f1 img {
    max-width: 50px;
  }
}
.cart-item .f1 img {
  padding-right: 30px;
  max-width: 80px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 1024px) {
  .cart-item .f1 img {
    max-width: 80px;
    height: auto;
  }
}
.cart-item .f1.discount img {
  max-width: 60px;
  object-fit: contain;
}
.cart-item .f2 {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.cart-item .f2 .item-grid {
  display: grid;
  grid-template: "info amountAndPrice" 1fr "crossSelling actions"/minmax(0px, 1fr) 450px;
  column-gap: 32px;
  grid-template-columns: minmax(0px, 1fr) 450px;
}
@media (max-width: 1024px) {
  .cart-item .f2 .item-grid {
    display: flex;
    flex-flow: wrap;
    height: 100%;
    column-gap: 0px;
    row-gap: 24px;
  }
}
.cart-item .f2 .item-grid .count {
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media (max-width: 1024px) {
  .cart-item .f2 .item-grid .count {
    -webkit-box-align: center;
    align-items: center;
    grid-area: amountAndPrice;
    flex-basis: 100%;
  }
}
.cart-item .f2 .item-grid .count input {
  max-width: 100px;
  padding: 8px 16px 8px 16px;
  width: calc(100% - 32px);
}
@media (max-width: 1024px) {
  .cart-item .f2 .item-grid .count input {
    max-width: 100px;
  }
}

@media (max-width: 1024px) {
  .accordion {
    position: relative;
  }
}
@media (max-width: 1024px) {
  .accordion.open > div:not(.circle) {
    display: block !important;
  }
}
@media (max-width: 1024px) {
  .accordion.open .circle {
    transform: translateY(-40px) rotate(180deg);
  }
}
@media (max-width: 1024px) {
  .accordion > div:not(.circle) {
    display: none !important;
  }
}
@media (max-width: 1024px) {
  .accordion .circle {
    position: absolute;
    right: 0px;
    top: 0px;
    transform: translateY(-40px);
  }
  .accordion .circle img {
    width: 17px;
  }
}

footer {
  background-color: #2f5a41;
  position: relative;
  width: 100%;
  padding: 40px 0px;
  z-index: 20001;
}
@media (max-width: 1024px) {
  footer {
    padding: 20px 0px;
  }
}
footer > div {
  width: calc(100% - 100px);
  margin: 0px auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: start;
  justify-content: space-between;
  align-items: start;
  height: 100%;
}
@media (max-width: 1024px) {
  footer > div {
    flex-wrap: wrap;
    width: calc(100% - 40px);
    margin: 0px auto;
    padding: 20px 0px;
  }
}
footer > div p,
footer > div a {
  color: #fff;
  font-size: 16px;
}
footer > div > div {
  display: inline-block;
  width: calc(20% - 20px) !important;
}
@media (max-width: 1024px) {
  footer > div > div {
    width: 100% !important;
    border-bottom: 1px solid #a5afb8;
    display: block;
    text-align: center;
  }
}
footer > div ul {
  padding: 0px;
  list-style-type: none;
  display: flex;
  gap: 20px;
}
@media (max-width: 1024px) {
  footer > div ul {
    display: block;
  }
}
footer > div ul li {
  color: #fff;
}
@media (max-width: 1024px) {
  footer > div ul li {
    margin-bottom: 10px;
  }
}
footer img {
  width: 50px;
}

container-control {
  position: relative;
}

.overflowwrap,
.overflowwrap1 {
  overflow-x: auto;
}
.overflowwrap table,
.overflowwrap1 table {
  min-width: 800px;
}

.delivery-banner__icon {
  width: 85px;
  height: 85px;
  border-radius: 50%;
  margin: 20px;
  background: #740947;
}
.delivery-banner__icon span {
  display: block;
  position: relative;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  color: #ffffff;
  font-size: 34px;
  margin-top: 2px;
}

#loader {
  width: 100%;
  height: 100%;
  z-index: 10000000;
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: rgba(255, 255, 255, 0.75);
  display: none;
}
#loader > img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: rotation 3s infinite linear;
  width: 100px;
}

#data-banner {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.5);
}
#data-banner > div {
  padding: 40px;
  background-color: #ffffff;
  width: calc(100% - 120px);
  max-width: 600px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#data-banner > div a {
  color: #000;
}
#data-banner > div button {
  margin-top: 20px;
  background-color: #2f5a41;
  color: #fff;
  margin-left: 0px;
  border: none;
  padding: 8px 20px;
  border-radius: 20px;
  font-size: 18px;
  text-transform: uppercase;
  font-family: "Roboto", serif;
  font-weight: 500;
  cursor: pointer;
}
@media (max-width: 767px) {
  #data-banner > div button {
    float: none;
  }
}
#data-banner > div .error {
  display: none;
  color: #2f5a41;
}

.pac-container {
  z-index: 100000;
}

@keyframes rotation {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(359deg);
  }
}
.imagecollection {
  padding: 60px 0;
}
.imagecollection > div {
  max-width: 1200px;
  margin: 0 auto;
}
.imagecollection__grid {
  display: grid;
  grid-template-columns: 281px 200px 1fr;
  grid-template-rows: 500px auto;
  gap: 16px;
  align-items: start;
}
.imagecollection__item {
  border-radius: 14px;
  overflow: hidden;
  transition: all 0.25s ease-in-out;
}
.imagecollection__item:hover {
  transform: scale(1.02);
}
.imagecollection__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 1024px) {
  .imagecollection__item img {
    height: auto;
  }
}
.imagecollection__item:first-child {
  grid-column: 1;
  grid-row: 1;
  height: 500px;
}
@media (max-width: 1024px) {
  .imagecollection__item:first-child {
    height: auto;
  }
}
.imagecollection__item:nth-child(2) {
  grid-column: 2/4;
  grid-row: 1;
  height: 300px;
  margin-top: 100px;
}
@media (max-width: 1024px) {
  .imagecollection__item:nth-child(2) {
    margin-top: 0px;
    height: auto;
  }
}
.imagecollection__item:last-child {
  grid-column: 2;
  grid-row: 2;
  transform: translateY(-100px);
  aspect-ratio: 9/16;
}
@media (max-width: 1024px) {
  .imagecollection__item:last-child {
    transform: none;
  }
}
.imagecollection__item:last-child:hover {
  transform: scale(1.02) translateY(-100px);
}
@media (max-width: 1024px) {
  .imagecollection__item:last-child:hover {
    transform: none;
  }
}
@media (max-width: 1024px) {
  .imagecollection {
    padding: 40px 0;
  }
  .imagecollection__grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .imagecollection__item:first-child {
    grid-column: 1;
    grid-row: 1;
  }
  .imagecollection__item:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }
  .imagecollection__item:last-child {
    grid-column: 1;
    grid-row: 3;
    aspect-ratio: auto;
  }
  .imagecollection > div {
    max-width: calc(100% - 40px);
  }
}

.grid-5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  margin: 0px 0px;
  gap: 25px;
  margin-bottom: 50px;
}
@media (max-width: 1200px) {
  .grid-5 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 1024px) {
  .grid-5 {
    grid-template-columns: repeat(2, 1fr);
    max-width: 100%;
    margin: 0px;
    width: 100%;
  }
}

#popup_content > div form > div {
  min-width: 300px;
}
#popup_content > div form > div .inlineflex h3 {
  flex: 0 0 50%;
  text-align: left;
  box-sizing: border-box;
}
#popup_content > div form > div .inlineflex h3:last-of-type {
  text-align: right;
  margin-top: 10px;
}
#popup_content > div form > div a.button {
  width: 30px;
  height: 30px;
  padding: 3px;
  position: relative;
}
#popup_content > div form > div a.button img {
  width: 16px;
  height: 20px;
  margin: 0px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

#popup {
  background-color: rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 1000000;
  display: none;
}
#popup.active {
  display: block;
}
#popup > div {
  max-width: 800px;
  min-width: 500px;
  padding: 50px 20px 30px;
  border-radius: 10px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
@media (max-width: 1080px) {
  #popup > div {
    min-width: calc(100% - 80px);
  }
}
#popup > div > div {
  display: flex;
  justify-content: center;
}
#popup > div > div img {
  width: 50px;
  margin: 10px;
}
#popup a {
  color: #2f5a41;
}
#popup a.button {
  display: inline-block;
  background-color: #2f5a41;
  color: #333333;
  font-size: 16px;
  border-radius: 8px;
  padding: 14px 20px;
  text-decoration: none;
  font-weight: normal;
}
#popup form button {
  display: inline-block;
  background-color: #2f5a41;
  color: #333333;
  font-size: 16px;
  color: #fff;
  border-radius: 8px;
  padding: 14px 20px;
  text-decoration: none;
  font-weight: normal;
  width: auto;
}
#popup form h3 {
  margin-top: 10px;
}
#popup form textarea {
  padding: 20px;
  width: calc(100% - 40px);
  border-radius: 5px;
  border: 1px solid rgba(0, 0, 0, 0.5);
}
#popup form input {
  padding: 12px 20px;
  background-color: #fff;
  border-radius: 8px;
  width: calc(100% - 40px - 2px);
  font-size: 18px;
  font-weight: 300;
  display: block;
  border: 1px solid rgba(0, 0, 0, 0.5);
}
#popup form select {
  padding: 12px 20px;
  background-color: #fff;
  border-radius: 8px;
  font-size: 18px;
  font-weight: 300;
  display: inline-block;
  color: rgba(38, 37, 37, 0.5);
  background-image: url(../img/select.svg);
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 60px;
  width: 100%;
  margin: 0px 0px;
  border: 1px solid rgba(0, 0, 0, 0.5);
}
#popup #close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  display: block;
  position: absolute;
  background-size: 16px;
  background-image: url(../img/cross.svg);
  background-repeat: no-repeat;
  background-position: center center;
  width: 16px;
  height: 16px;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

/*# sourceMappingURL=master.css.map */