// out: custom.css, compress: true, sourceMap: true
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");
@import "_mixins";

//* Colors
$cWhite: #ffffff;
$cDark: #333;
$cYellow: #f6db00;
$cRed: #dd1111;
$cGreen: #5aba47;
$cTextLight: #777;
$cGray: #d9d9d9;

$cBgGray: #f4f4f4;

body {
  font-family: "Poppins", sans-serif;
}

a {
  @include transition();
}

a:hover {
  color: $cYellow;
}

header {
  border-top: 0;
  padding-top: 0;

  .login-bar {
    background: $cWhite;
    padding: 0;
    border-bottom: 1px solid $cGray;
    padding: 5px 0;

    a {
      color: $cTextLight;
      @include transition;
      font-weight: 400;
    }
  }

  .container {
    @include respond-above(md) {
      @include flexbox;
      @include justify-content(space-between);
    }
  }

  .mini-contact {
    line-height: 40px;

    @include respond-below(md) {
      @include flexbox;
      @include justify-content(center);
      margin-bottom: 15px;
    }

    li {
      display: inline-block;
      line-height: 40px;
      color: #fff;
      margin-right: 15px;
      position: relative;

      img {
        margin-right: 5px;
        position: relative;
        top: -1px;
      }

      &:not(:nth-child(5)) {
        &::before {
          content: "";
          position: absolute;
          right: -10px;
          top: 50%;
          bottom: 0;
          width: 1px;
          height: 18px;
          background: $cGray;
          transform: translateY(-50%);
        }
      }
    }
  }

  .links {
    position: relative;
    margin-left: auto;

    @include respond-below(md) {
      @include flexbox;
      @include justify-content(center);
      margin-bottom: 15px;
      float: none;
      @include align-items(center);
    }

    &:before {
      content: "\f007";
      display: inline-block;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: inherit;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      margin-right: 10px;
      font-size: 16px;
      position: relative;
      @include transition;
      background: $cYellow;
      // padding: 10px;
      left: 0;
      width: 35px;
      height: 35px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50px;
    }

    &:after {
      content: "";
      display: block;
      clear: both;
    }
  }

  .logo-bar {
    padding-top: 5px;
    padding-bottom: 5px;
    @include flexbox;
    @include align-items(center);
    @include justify-content(flex-end);

    .link-logo {
      margin-right: auto;
      width: 225px;

      img {
        width: 100%;
      }
    }

    .search__container {
      max-width: 500px;
      float: none;
      margin-right: auto;
    }

    .search-form {
      margin: 0;

      &.search_focused {
        .search-input {
          border-color: $cYellow;
        }
      }

      .search__input-area {
        border: 0;
      }

      .search-input {
        height: 50px;
        min-height: 40px;
        border: 1px solid $cGray;
        border-radius: 50px;
        overflow: hidden;

        .search__input {
          color: $cTextLight;
          height: 40px;
          border-right: 0;
        }

        .btn {
          height: 50px;
          font-size: 20px;
          background: $cYellow;
          border: 0;
          color: $cDark;
          width: 80px;
          border-radius: 50px;

          &:before {
            font-size: 20px;
          }
        }
      }
    }

    .basket {
      background: #fff;
      border: 0;
      text-align: right;
      min-width: 0;
      padding-right: 0;
      height: 40px;

      > {
        a.count {
          line-height: 40px;
          position: relative;
          display: block;
          padding-left: 60px;
          float: right;
          transition: all 250ms ease-in-out;

          &:before {
            content: "\f07a";
            font: normal normal normal 14px/1 FontAwesome;
            font-size: 20px;
            position: absolute;
            top: 50%;
            left: 0;
            border-radius: 50px;
            border: 1px solid $cGray;
            height: 50px;
            width: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            transform: translateY(-50%);
          }

          &:hover {
            color: $cYellow;

            &::before {
              border-color: $cYellow;
            }
          }
        }
      }
    }
  }

  #box_custom35 {
    background: $cGray;
    margin-bottom: 0;

    p {
      span {
        font-size: 16px !important;
      }
    }
  }

  .custom_head_miniNav {
    margin: 15px 0 0 0;
    display: flex;
    justify-content: center;
    gap: 40px;
    // display: none;
  }
}

.menu {
  margin-bottom: 15px;
  padding: 0;
  background: $cYellow;

  .innermenu {
    margin: auto;
    height: auto;

    .parent>div>ul {
      @include opacity(0);
      @include transition;
      visibility: hidden;
    }

    .parent:hover>div>ul {
      width: 100%;
      max-width: 400px;
      border: 0;
      @include opacity(1);
      visibility: visible;

      &:before {
        background-color: #f6db00;
        border-left: 1px solid #333333;
        border-top: 1px solid #333333;
      }

      li.parent:hover>div>ul::before {
        border: 0;
        left: -5px;
      }

      li.parent:hover>div>ul {
        top: 0;
        right: -100%;
        border-left: 1px solid $cYellow;
      }
    }

    .menu-list {
      height: auto;
      border: 0;

      li {
        &.current {
          a {
            background: $cDark;
            color: $cWhite;
            font-weight: 600;
          }
        }

        h3 {
          padding: 0;
          margin: 0;

          a {
            display: block;
            font-size: 14px;
            font-weight: 400;
            text-transform: uppercase;
            padding: 23px 20px;
            color: $cDark;
            @include transition;

            &:hover {
              color: $cWhite;
              text-decoration: none;
              background: $cDark;
            }
          }
        }

        ul {
          background-color: $cDark !important;

          li {
            h3 {
              a {
                white-space: nowrap;
                font-size: 13px;
                font-weight: 500;
                text-transform: none;
                color: #fff;

                &:hover {
                  color: $cYellow;
                }
              }
            }
          }
        }
      }
    }
  }

  .menu-mobile {
    .menu-mobile-li {
      a {
        &::before {
          color: $cDark;
        }
      }
    }
  }

  #rwd-menu {
    width: 100%;
  }
}

.box {
  .boxhead {
    border: 0;

    >span,
    >h1 {
      font-size: 15px;
      font-weight: 600;
      color: #333;
      text-transform: uppercase;

      &.name {
        font-size: 26px;
      }
    }
  }
}

.product {
  padding-top: 25px !important;

  .product-inner-wrap {
    background: $cWhite;
    border: 1px solid rgba($cGray, 0.5);
  }

  .description {
    .img-wrap {
      height: 100%;
    }
  }

  .tags {
    position: absolute;
    top: -5px;
    left: 0;
    @include flexbox;
    @include justify-content(center);
    width: 100%;

    li {
      margin: 0 5px;
      display: block;
      padding: 0 12px;
      @include border-radius(10px);
    }
  }

  .addtobasket {
    @include transition;
    background: $cYellow;
    color: $cDark;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 0;
    padding: 10px 25px;
    @include border-radius(30px);

    &:hover {
      background: $cDark;
      color: #fff;
    }
  }

  .boximgsize,
  .prodimage {
    padding: 15px;
    // border: 1px solid #e4e4e4;
    height: 200px;
    display: block;

    img {
      height: 100%;
      width: 100%;
      object-fit: contain;
      object-position: center;
    }
  }

  .productnamewrap,
  .prodname {
    height: 20px !important;
    padding: 0 15px;
    position: relative;
    overflow: visible !important;
    display: block;
    margin: 10px 0 15px;

    .productname {
      display: block !important;
      white-space: nowrap;
      overflow: hidden !important;
      text-overflow: ellipsis;
      height: 20px !important;
      font-size: 14px !important;
      margin: 0 !important;
      padding: 0 !important;
      font-weight: 600;
    }
  }

  .price {
    @include flexbox;
    @include justify-content(center);

    del {
      margin-right: 10px;
      color: rgba(0, 0, 0, 0.4);
    }

    del,
    em {
      line-height: 30px;
    }

    em {
      color: $cDark;
      font-weight: 800;
    }

    .price-netto {
      display: none;
    }
  }

  .quickview {
    display: none !important;
  }
}

#box_lastadded {
  .innerbox {
    gap: 30px;

    .product {
      padding: 5px;
      border: 0;
      border: 1px solid rgba(217, 217, 217, 0.5);

      a {
        @include transition;

        &:hover {
          color: $cDark;

          .productnamewrap {
            &:after {
              width: 100%;
            }
          }
        }
      }

      .btn {
        padding: 10px 25px;
        border-radius: 30px;
        text-transform: uppercase;
        font-weight: 600;

        &:hover {
          color: $cWhite;
        }
      }
    }
  }

  @include respond-above(md) {
    .innerbox {
      @include flexbox;
      flex-wrap: wrap;

      .product {
        width: calc(33% - 18px);
      }
    }
  }

  @media screen and (max-width: 979px) and (min-width: 768px) {
    .innerbox .product {
      width: calc(50% - 15px) !important;
    }
  }
}

.top.row {
  #box_custom35 {
    display: none;
  }

  #fx-experience-and-returns {
    top: 50%;
    transform: translateY(-50%);
  }
}

#box_menu {
  box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.1);
  background: #fff;

  #category_142,
  #category_30 {
    a {

      color: $cDark;
      text-transform: uppercase;
      font-size: 18px;
      padding: 10px 15px;
      margin: 0;
      font-weight: 600;
    }
  }

  .boxhead {
    margin: 0;
    display: none;

    span {
      color: $cDark;
      text-transform: uppercase;
      font-size: 18px;
      padding: 10px 15px;
      margin: 0;
    }
  }

  .innerbox {
    >ul {
      >li {
        >a {
          font-weight: 600;
        }
      }
    }

    ul {
      li {
        &.current {
          >a {
            background: $cBgGray;
          }
        }

        &:first-child {
          border-top: 1px solid rgba($cGray, 0.5);
        }

        &:not(:last-child) {
          border-bottom: 1px solid rgba($cGray, 0.5);
        }

        a {
          color: $cDark;
          font-weight: 400;
          font-size: 1rem;
          display: block;
          padding: 13px 15px 14px 20px;
          @include transition;

          &:hover {
            color: $cYellow;
          }
        }
      }
    }
  }

  ul {
    ul {
      ul {
        margin-left: 0;
      }
    }
  }
}

#box_specialoffer {
  border: 1px solid transparentize($cGray, 0.5);
  box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.1);

  .boxhead {
    span {
      padding: 10px 15px;
      display: block;
      color: $cDark;
      text-transform: uppercase;
      margin: 0 0 15px;
    }
  }

  .innerbox {
    .product {
      padding: 0;
      border: 0;

      .boximgsize {
        border: 0;
        margin-bottom: 15px;
      }
    }
  }
}

.sort-and-view {
  .prodview {
    li.selected {
      a {
        color: $cYellow !important;
      }
    }
  }
}

#box_mainproducts {
  .boxhead {
    margin-bottom: 50px;
  }

  .products {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    // display: flex;
    // flex-direction: row;
    // flex-wrap: wrap;
    gap: 30px;

    &::before {
      content: none;
    }

    &::after {
      content: none;
    }

    .product {
      height: fit-content;

      @media screen and (max-width: 979px) and (min-width: 768px) {
        width: 100% !important;
      }
    }

    @media screen and (max-width: 979px) {
      grid-template-columns: calc(50% - 15px) calc(50% - 15px);
    }

    @media screen and (max-width: 767px) {
      grid-template-columns: 100%;

      .prodimage {
        margin: 0 auto;
        width: calc(100% - 30px) !important;

        .img-wrap {
          display: block;
          width: 100%;
          margin-left: 0 !important;
        }
      }
    }
  }
}

.products.viewphot {
  .product {
    border: 0;
    margin: 0;

    .prodimage {
      span {
        min-height: auto;
      }
    }
  }
}

.box-slider .pageslider .slides li {
  height: 86%;
}

#box_articlelistsmall {
  .boxhead {
    padding: 0 15px;
  }

  .innerbox {
    @include flexbox;
    @include justify-content(center);

    .article-small {
      width: 25%;
      box-sizing: border-box;

      .article-small-data {
        padding: 0 15px 15px;
      }

      .readmore {
        color: $cDark;
        display: block;
        padding-bottom: 3px;
        font-size: 13px;
        border-bottom: 1px solid $cDark;
        @include transition;

        &:hover {
          border-bottom: 1px solid $cYellow;
        }
      }

      .article_name_span {
        font-size: 15px;
        font-weight: 600;
        color: $cDark;
        text-transform: uppercase;
        display: block;
        height: 20px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-bottom: 10px;
      }

      .article-info {
        margin-bottom: 10px;
        position: relative;
        font-style: italic;

        &:before {
          content: "\f073";
          display: inline-block;
          font: normal normal normal 14px/1 FontAwesome;
          font-size: inherit;
          text-rendering: auto;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          margin-right: 7px;
          font-size: 14px;
          position: relative;
          @include transition;
          background: $cDark;
          padding: 6px;
          left: 0;
          color: #fff;
        }
      }

      .resetcss {
        img {
          display: block;
          margin: 0 auto 10px;
        }

        p {
          text-align: initial !important;
          color: $cTextLight;
          font-size: 13px;
        }
      }
    }
  }
}

.footer {
  background: #333;
  padding: 25px 0;
  margin-bottom: 0;

  .innerfooter {
    ul {
      li {
        border: 0 !important;
        padding: 0 !important;
        margin-bottom: 5px;

        &.head {
          background: none;
          text-transform: uppercase;
          font-weight: 600;
          color: #fff;
          margin-bottom: 15px !important;
        }

        a {
          color: #fff;
          font-weight: 300;
        }
      }
    }
  }
}

#shoper-foot {
  display: none;
}

.floatcenterwrap .paginator {
  @include flexbox;
  @include justify-content(center);
  margin: 0;
  padding: 0;

  li {
    display: block;
    height: 25px;
    width: 25px;
    @include border-radius(50%);
    border: 1px solid transparentize($cDark, 0.85);
    overflow: hidden;

    a,
    span {
      padding: 0;
      border: 0;
      display: block;
      line-height: 25px;
      width: 100%;
      font-size: 13px;
    }

    &.selected>span {
      background: $cDark;
      color: #fff;
    }
  }
}

.btn-red2,
.btn-red,
.btn.btn-red,
.btn.register,
.btn {
  border: 0;
  background-color: $cYellow;
  color: $cDark;
  font-size: 0.875rem;
  border-radius: 30px;
  padding: 10px 15px;
  font-weight: 600;
  text-transform: uppercase;
  @include transition();

  &:hover {
    color: #fff;
  }
}

.centercol {

  h3,
  h4 {
    padding: 5px 0;
    font-weight: 600;
    margin-bottom: 25px;
    // border-bottom: 1px solid transparentize($cDark, 0.75);
    font-size: 18px;
  }
}

#box_filter {
  .boxhead {
    padding: 5px 0;
    font-weight: 600;
    margin-bottom: 25px;
    border-bottom: 1px solid transparentize($cDark, 0.75);
    font-size: 18px;
  }
}

#box_filter .multiselect:hover,
#box_filter .multiselect.selected {
  background: url(../../styles/../images/ico_arrow_down_light.png) no-repeat 95% 50% $cDark;
  border: 1px solid $cDark;
}

.sort-and-view .sortlinks .products-sort-container .products-active-sort:hover {
  background: url(../../styles/../images/ico_arrow_down_light.png) no-repeat 95% 50% $cDark;
  color: #fff;
  border-color: $cDark;
}

#box_filter .multiselect ul {
  padding: 10px 0;

  li {
    padding: 5px 10px;
  }
}

#box_filter .multiselect ul li:hover,
#box_filter .multiselect ul li.selected,
.sort-and-view .sortlinks .products-sort-container .products-sort-options a.active-sort,
.sort-and-view .sortlinks .products-sort-container .products-sort-options a:hover.active-sort {
  background: transparentize($cDark, 0.9);
}

.sort-and-view .sortlinks .products-sort-container .products-sort-options a:hover {
  background: transparentize($cDark, 0.8);
  color: $cDark;
}

.box .boxhead>h1 {
  &.category-name {
    position: relative;
    color: $cDark;
    border-bottom: 2px solid $cYellow;
    font-size: 22px;
    font-weight: 600;
    padding: 5px 10px;
  }
}

.main {
  .centercol {
    :not(#box_filter) {
      .boxhead {
        margin-bottom: 1.5em;

        span {
          position: relative;
          font-size: 1.375rem;
          padding: 5px 10px;
        }
      }
    }

    #box_filter {
      .boxhead {
        span {
          position: relative;
          font-size: 1.375rem;
          padding: 5px 10px;
        }
      }
    }
  }
}

#box_menu ul ul {
  padding: 0;
  margin-left: 0;
  list-style-type: none;

  li {
    list-style-type: none;

    a {
      padding: 5px 10px 5px 40px !important;
    }
  }
}

.product-modules {
  #box_productdeliveries {
    display: none !important;
  }
}

#box_productfull {
  .productdetails-more {
    float: none;
    width: 100%;
    font-size: 15px;

    .links-q {
      float: none;
    }

    em {
      font-weight: 600;
    }

    .evaluation {
      .votestars {
        float: none;
        position: relative;
        top: 5px;
      }
    }

    .manufacturer {
      margin-bottom: 15px;

      a {
        display: block;
        height: 75px;

        img {
          height: 100%;
          width: 100%;
          object-fit: contain;
        }
      }
    }
  }

  .availability {
    .availability {
      display: none;
    }
  }

  .addtobasket-container {
    .number-wrap {
      input {
        width: 75px !important;
      }
    }

    .button_wrap {
      @include flexbox;
      @include justify-content(flex-end);

      .addtobasket {
        max-width: 200px;
        font-weight: 600;
        text-transform: uppercase;
      }
    }
  }

  .addtobasket {
    @include transition();
    border-radius: 30px;
    padding: 10px 15px;
    text-transform: uppercase;
    font-weight: 600;
  }
}

#box_productfull .availability .showShippingCost {
  text-align: left;
  margin: 5px 0;
  font-size: 12px;
  color: $cRed;
  display: none;
}

#box_productfull .basket .price em,
#box_productfull .basket .price-netto em,
#box_productfull .basket .unit-price-container em {
  color: $cDark;
  font-weight: 800;
  font-size: 24px;
}

#box_productfull .basket .price-netto {
  margin-top: 5px;

  em {
    font-size: 18px;
  }
}

#box_productfull .basket .addtofav {
  color: $cRed;
  font-weight: 600;

  span {
    font-size: 13px;
  }
}

#box_productfull .links-q li a {
  color: $cRed;
  font-size: 12px;
}

#box_productfull .links-q li a span::before {
  color: $cDark;
  padding: 0;
  border: 0;
  margin-right: 5px;
  font-size: 14px;
}

.product-attributes.zebra td:first-child {
  background-color: #e0e0e0;
  color: $cDark;
  border-bottom: 1px solid #f0f0f0;
}

.box.tab .zebra tr:last-child td {
  border-bottom: 0;
}

table.table tbody {
  border: 0;
}

.product-deliveries .shipping,
.product-deliveries .shipping-label-container {
  padding: 0;
}

.alert.alert-success {
  background: $cYellow;
  border: 0;
  color: $cDark;

  .close {
    span {
      color: $cDark;
      font-weight: 600;
    }
  }
}

#cart-options .summary-container .sum .value {
  color: $cDark;
  font-size: 20px;
  font-weight: 600;
}

.basket-steps ol li.active-step::before {
  background: $cYellow;
  color: $cDark;
}

.basket-steps ol li.active-step span {
  color: $cDark;
}

.basket-contain {
  min-width: 400px;
}

.basket-contain .basket-summery {
  // background-color: transparentize($cDark, 0.85);
  background-color: $cYellow;
  color: $cDark;

  a {
    border-radius: 50px;
    white-space: nowrap;
    background: $cDark;
    color: #fff;
  }
}

#box_articlelist {
  .innerbox {
    @include flexbox;
    flex-wrap: wrap;
    gap: 20px;

    article {
      width: calc(50% - 10px);
      padding: 15px;
      box-sizing: border-box;
      margin-bottom: 0;
      background: $cWhite;
      box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.1);

      .article-header {
        .article-name {
          font-size: 1.25rem;
          line-height: 24px;
        }
      }

      .article-info {
        margin-bottom: 10px;
        margin-top: 10px;
      }

      .readmore {
        color: $cDark;
      }
    }
  }
}

article .article-info {
  margin-bottom: 0;
}

@media screen and (max-width: 979px) and (min-width: 768px) {
  .rwd .container {
    width: calc(100% - 50px);
    margin: 0 25px;
  }

  .rwd .logo-bar .search__container {
    min-width: 0;
    margin-top: 0;
  }

  .rwd form.search-form {
    top: 0;
  }

  .rwd .menu .innermenu {
    height: auto;
    border: 0;
  }

  .rwd .menu .innermenu li h3 {
    line-height: normal;
  }

  .rwd .s-grid-9 {
    width: calc(100% - 255px);
  }

  #box_lastadded .innerbox {
    @include flexbox;
    flex-wrap: wrap;

    .product {
      width: 33.3333%;
    }
  }

  #box_mainproducts {
    .products {
      .product {
        width: 33.33333%;
      }
    }
  }
}

#cart-options {
  .btn {
    padding: 10px 15px;
    text-transform: uppercase;
    font-weight: 600;
  }

  .delivery-container {
    width: 40%
  }

  .payment-container {
    width: 26%;
  }
}

@include respond-below(xs) {
  .rwd header {
    padding: 10px;

    .logo-bar {
      margin: 0;
      display: block;

      .link-logo {
        display: block;
        height: 85px;

        img {
          height: 100%;
          width: 100%;
          object-fit: contain;
        }
      }
    }
  }

  .rwd .menu .innermenu {
    height: auto;
    min-height: 0;
    padding: 5px 0;
  }

  .rwd .menu .innermenu li a {
    font-size: 23px;
    color: #fff;

    &:hover {
      color: $cYellow;
    }
  }

  .rwd .main #box_mainproducts .products.viewphot .product .product-inner-wrap {
    padding: 0;

    .prodimage {
      box-sizing: border-box;

      .img-wrap {
        margin: 0;
        height: 100%;
      }
    }
  }

  .rwd #box_productfull h1 {
    font-size: 22px;
    line-height: 26px;
  }

  #box_productfull .productimg .mainimg {
    padding: 15px;

    a {
      display: block;
      height: 100%;
      width: 100%;
    }
  }

  .search__mobile-btn {
    bottom: 25px;
    right: 25px;
  }
}

.bottom-footer {
  background: $cBgGray;
  padding: 25px 0 15px;

  .container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  #box_articlelistsmall {
    width: 100% !important;
    max-width: 100% !important;
    background: #fff;
    padding: 50px 0;

    .boxhead,
    .innerbox {
      max-width: 1180px;
      margin-left: auto;
      margin-right: auto;
    }
  }

  #box_custom41,
  #notfound {
    max-width: 1180px;
    margin: 0 auto 50px;
  }

  #custom_slider {
    background: $cWhite;
    margin-bottom: -20px;

    img {
      max-width: 120px;
    }

    .splide__slide {
      display: flex;
      align-items: center;
    }
  }

  .box {
    margin: 0;
  }

  p {
    margin: 0 0 10px;
    font-weight: 600;

    strong {
      color: $cRed;
    }
  }
}

.menu .innermenu .menu-list li {
  &:last-child {
    @include respond-above(sm) {
      float: right;
      background: $cYellow;
      display: flex;
      align-items: center;
      padding: 12px 0;
      @include transition;

      a {
        color: $cDark;
        padding: 10px 20px;
        border: 1px solid $cDark;
        border-radius: 50px;
        @include transition;
      }

      &:hover {
        background: $cYellow;

        a {
          color: $cWhite;
          padding: 10px 30px;
        }
      }
    }
  }
}

.alert.alert-info {
  background: $cYellow;
  border: 0;
  color: #000000;
}

.links {
  .hello {
    color: #fff;
  }
}

@include respond-below(sm) {
  .rwd footer .innerfooter ul.overall>li {
    margin-top: 10px;
  }

  .rwd footer .innerfooter ul li>ul li {
    background: $cDark;
  }

  .rwd footer .innerfooter ul li>ul li:last-child {
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 979px) {
  .rwd .logo-bar .search__container {
    min-width: unset;
  }

  header {
    .logo-bar {
      .link-logo {
        margin: 0 auto;
      }
    }
  }
}

.box-xhr {
  padding: 0 10px;
  background: $cWhite;
  box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.1);
}

//* HP slider
#box_slider_5 {
  .slider-nav {
    li {
      &.active {
        background-color: $cYellow;
      }
    }
  }
}

//* News
#box_articlelistsmall {
  margin-bottom: 50px;
  margin-top: 50px;

  .boxhead {
    margin-bottom: 40px;

    span {
      color: $cDark;
      border-bottom: 2px solid $cYellow;
      font-size: 1.375rem;
      font-weight: 600;
      padding: 5px 10px;
      width: fit-content;
      margin: 0 auto;
    }
  }

  .article-small {
    background: $cWhite;
    box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.1);

    .article-info {
      &::before {
        border-radius: 50px;
      }
    }

    .resetcss {
      p {
        font-weight: 400;
      }
    }
  }
}

//* Home page
.shop_index {
  #box_mainproducts {
    .products {
      &.viewfull {
        .product {
          background-color: $cWhite;
          border: none;

          &:not(:last-child) {
            margin-bottom: 10px;
          }

          &:last-child {
            margin-bottom: 20px;
          }

          .tags {
            top: 10px;
          }

          .availability {
            border-top: 0;
          }

          .prodname {
            padding: 0;
          }
        }
      }
    }
  }

  #box_lastadded {
    .boxhead {
      width: fit-content;
      position: relative;

      &::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        background-color: $cYellow;
      }
    }
  }
}

.shop_index,
.shop_product {
  .main {
    padding-top: 15px;
    background: $cBgGray;
  }

  #box_specialoffer {
    background: $cWhite;
  }

  #box_lastadded {
    .product {
      background: $cWhite;
    }
  }

  .menu {
    margin-bottom: 0;
  }
}

//* Single product page
.shop_product {
  .breadcrumbs {
    padding-top: 15px;
    background: $cBgGray;
  }

  .productimg {
    .mainimg {
      background: $cWhite;
    }
  }

  .tab-container {
    background: $cWhite;

    nav {
      padding-top: 10px;

      ul {
        text-align: center;

        li {
          .boxhead {
            position: relative;

            &.active {
              border: none;

              &::before {
                width: 100%;
              }
            }

            &::before {
              content: "";
              position: absolute;
              left: 50%;
              right: 0;
              bottom: -1.5em;
              height: 2px;
              background: $cYellow;
              transform: translateX(-50%);
              width: 0;
              @include transition();
            }

            h3 {
              font-size: 1.25rem;
              font-weight: 400;
              @include transition();
            }
          }
        }
      }
    }

    .product-tabs {
      padding: 0 20px 20px;
    }

    .btn {
      color: $cDark;
      font-size: 0.875rem;
      border-radius: 30px;
      padding: 10px 15px;
      font-weight: 600;
      text-transform: uppercase;
      @include transition();

      &:hover {
        color: $cWhite;
      }
    }

    .table {
      border: 1px solid rgba($cDark, 0.1);

      tr {
        &:nth-child(2n + 1) {
          background: $cBgGray;
        }
      }

      td {
        &:first-child {
          background-color: transparent;
          border-right: 1px solid rgba($cDark, 0.1);
        }
      }
    }

    .product {
      .price {
        justify-content: flex-end;
        padding-right: 10px;
      }
    }
  }

  #box_productfull {
    .boxhead {
      h1 {
        font-weight: 400;
        font-size: 24px;
        line-height: 28px;
      }
    }
  }
}

//* Basket page
.shop_basket {
  .productlist {
    border: 1px solid rgba($cDark, 0.1);

    thead {
      tr {
        background: $cBgGray;
        font-size: 14px;
        font-weight: 500;
      }
    }

    tr {
      &:not(:last-child) {
        border-top: 1px solid rgba($cDark, 0.1);
      }

      td {
        &:not(:last-child) {
          border-right: 1px solid rgba($cDark, 0.1);
        }
      }
    }

    .name {
      a {
        text-decoration: none;
      }
    }

    input[type=number] {
      -moz-appearance: textfield;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }
  }
}

//* Register pages
.shop_login_register {
  .input {
    width: 100%;

    input {
      width: 90% !important;
      border-radius: 50px;
      padding: 20px;
    }
  }

  .bottombuttons {
    .btn {
      @include transition();
      padding: 10px 15px;
      text-transform: uppercase;
      font-weight: 600;
      border-radius: 30px;
      float: left;
    }
  }

  form {
    .innerbox {
      display: grid;
      grid-template-columns: 1fr 1fr;

      .innerbox_col_1 {
        &>div {
          display: flex;
          flex-direction: column;
          align-items: flex-start;
        }
      }

      .innerbox_col_2 {
        width: auto;
        color: $cTextLight;
        text-align: left;
        font-size: 0.875rem !important;
        line-height: 24px;

        a {
          color: $cTextLight;
        }
      }

      @include respond-below(sm) {
        grid-template-columns: 1fr;
      }
    }
  }
}

#box_register .login-label,
#box_register .adress-label {
  width: auto;
  color: $cTextLight;
  text-align: left;
  font-size: 0.875rem !important;
  line-height: 24px;
}

//* Login page
.shop_login {
  form {
    label {
      color: $cTextLight;
      text-align: left;
      font-size: 0.875rem !important;
      line-height: 24px;
    }

    .btn {
      margin-top: 15px !important;
      margin-bottom: 15px !important;
    }
  }

  input {
    border-radius: 50px;
    padding: 20px;
  }

  .btn {
    @include transition();
    padding: 10px 15px;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 30px;

    &.register {
      &:hover {
        color: $cWhite;
        background: $cDark;
      }
    }
  }
}

//* Popup
.modal {
  .btn {
    padding: 10px 15px;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 30px;
  }
}

#box_custom41 {
  margin-bottom: 50px;
  text-align: justify;

  p {
    font-weight: 400;
  }
}

.products.viewphot.s-row {
  margin: 0 !important;

  .product.unit-price-info {
    margin: 0;
    padding: 0;
  }
}

//* Blog / single article
#shop_news5 {
  #box_article {
    .article-header {
      .article-name {
        font-size: 30px;
        font-weight: 400;
        line-height: 36px;
      }
    }

    .article-info {
      margin-top: 15px;
      margin-bottom: 15px;
      text-transform: uppercase;
    }
  }

  @media (min-width: 768px) {
    #box_articlecomments {
      padding-left: 20px;
    }

    #box_article {
      padding-left: 20px;
    }
  }
}