@import 'var.colors';
@import 'var.typo';

@import 'base.globals';

@import 'plugin.icomoon';

@import 'mod.button';
@import 'mod.checkbox-item';
@import 'mod.form-item';
@import 'mod.input';
@import 'mod.overlay';
@import 'mod.accessibility-tab-handler';

@import 'utils.fontscale';
@import 'utils.spacing';
@import 'utils.text';
@import 'utils.flex';
@import 'utils.grid';
@import 'utils.animations';

@import 'comp.hero';
@import 'comp.section';
@import 'comp.scrollbar';
@import 'comp.category';
@import 'comp.accordion';
@import 'comp.shop';
@import 'comp.profile';
@import 'comp.single-product';
@import 'comp.hooper';
@import 'comp.vselect';
@import 'comp.search';

.pos-a {
  position: absolute;
}
.pos-r {
  position: relative;
}

.line-bottom {
  position: absolute;
  bottom: 0;
  border-bottom: 2px solid $quinary-color;
  width: 30%;

  @media (max-width: 1024px) {
    width: 70%;
  }

  @media (max-width: 500px) {
    width: 90%;
  }
}
.line-bottom--gray {
  position: absolute;
  bottom: 0;
  border-bottom: 1px solid $senary-color;
  width: 100%;
}
.line-top--gray {
  position: absolute;
  top: 0;
  border-top: 1px solid $quaternary-color;
  width: 100%;
}
.line-bottom--red {
  bottom: 0;
  border-bottom: 1px solid $quinary-color;
  width: 100%;
}
.line-top--red {
  top: 0;
  border-top: 1px solid $quinary-color;
  width: 100%;
}

.width--100 {
  width: 100%;
}
.width--60 {
  width: 60%;
}
.width--50 {
  width: 50%;
}
.width--40 {
  width: 40%;
}

.pointer {
  cursor: pointer;
}

.newsletter {
  /* Input base */
  margin: 0;
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  white-space: nowrap;
  text-decoration: none;
  font-family: $ff-open-sans;
  border: 1px solid #d1cec6;
  padding: 10px;
}

.compare-item ul {
  margin-left: 20px;
}