:root {
  --space-unit: 1em;
  --space-xxxxs: calc(0.09 * var(--space-unit));
  --space-xxxs: calc(0.146 * var(--space-unit));
  --space-xxs: calc(0.236 * var(--space-unit));
  --space-xs: calc(0.382 * var(--space-unit));
  --space-sm: calc(0.618 * var(--space-unit));
  --space-md: calc(1 * var(--space-unit));
  --space-lg: calc(1.618 * var(--space-unit));
  --space-xl: calc(2.618 * var(--space-unit));
  --space-xxl: calc(4.236 * var(--space-unit));
  --space-xxxl: calc(6.854 * var(--space-unit));
  --space-xxxxl: calc(11.08 * var(--space-unit));
  --component-padding: var(--space-xxxl);
}

.ps-home--5 .ps-section--latest {
  margin: 30px 0 50px;
}

.ps-home--5 .ps-promo {
  padding: 30px 0 50px;
}

.ps-home--5 .ps-promo .ps-promo__icon img {
  filter: invert(60%) sepia(75%) saturate(1000%) hue-rotate(360deg) brightness(100%) contrast(100%);
}

.ps-home--5 .ps-footer--top {
  margin-top: 30px;
  background-color: #fdf6ed;
  border-color: #ffebd3;
}

.ps-home--5 .ps-footer--top .ps-footer__link i {
  color: #0384ce;
}

.ps-home--5 .ps-footer--top .col-12:not(:last-child) {
  border-color: #ffebd3;
}

.ps-home--5 .ps-section--blog {
  padding: 30px 0 80px;
}

.ps-home--5 .ps-section--category {
  padding: 30px 0 50px;
}

.ps-home--5 .ps-delivery {
  margin: 30px 0 50px;
}

.ps-home--5 .ps-home--block {
  padding: 30px 0 50px;
}

.ps-home--5 .ps-banner--round {
  margin: 30px 0 50px;
}

@media (min-width: 768px) {
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__thumnail .ps-banner__image {
    right: 0;
  }
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__content {
    padding-top: 4%;
  }
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__persen.ps-center {
    bottom: auto;
    top: 15%;
    right: 50%;
  }
}

@media (min-width: 992px) {
  .ps-home--5 .ps-promo__name {
    font-size: 35px;
  }
  .ps-home--5 .ps-promo__price {
    font-size: 40px;
  }
  .ps-home--5 .ps-promo__del {
    font-size: 19px;
  }
  .ps-home--5 .ps-promo__btn {
    font-size: 18px;
    padding: 10px 50px;
  }
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__persen.ps-center {
    top: 37%;
    right: 23%;
  }
}

@media (min-width: 1280px) {
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__content {
    padding-top: 8%;
  }
  .ps-home--5 .ps-section--banner .ps-banner .ps-banner__persen.ps-center {
    top: 50%;
    right: 14%;
  }
}
