@import '../../../../../../shared/scss/selected_theme_variables';
.brandsmenu a {
  color: $white;
  text-decoration: None;
}

.brandsmenu a:hover {
  color: $theme-main-color;
  text-decoration: underline;
}

.headlinks {
  display: inherit;
  text-decoration: none;
  border-bottom: 2px solid $gray-10;
  margin-bottom: 10px;
  color: darken($theme-main-color, 25);
  &:hover {
    border-bottom: 2px solid $theme-main-color;
    text-decoration: none;
    color: darken($theme-main-color, 30);
  }
}

.brandsmenu {
  ul {
    list-style: none;
    padding: 0.5rem 0 0.5rem 1.5rem;
    margin: 0px;
    background-color: $gray-100;
    li {
      padding: 0.5rem 0.4rem;
      background-color: $gray-100;
      border-bottom: 1px solid $gray-10;
      color: $gray-10;
      cursor: pointer;
      &::after {
        font-family: 'FontAwesome';
        content: '\f105';
        width: 20px;
        height: 57px;
        margin-right: 12px;
        right: 0px;
        position: absolute;
        background-size: 10px;
      }
      &:hover::after {
        color: $theme-main-color;
      }
      &:hover {
        background-color: $white;
        color: $theme-main-color !important;
        border-radius: 4px 0px 0px 4px;
      }
      ul > li {
        position: absolute;
        left: 20%;
        width: 78%;
        top: 0px;
        display: NONE;
      }
    }
  }
}

.catadjustwidth {
  width: 220%;
}

@media screen and (min-width: 320px) and (max-width: 332x) {
  .sucathead {
    color: $white;
  }
  .catadjustwidth {
    width: 220%;
  }
}

@media screen and (min-width: 375px) and (max-width: 413px) {
  .sucathead {
    color: $white;
  }
  .catadjustwidth {
    width: 216%;
  }
}

@media screen and (min-width: 414px) and (max-width: 627px) {
  .sucathead {
    color: $white;
  }
  .catadjustwidth {
    width: 215%;
  }
}

@media screen and (min-width: 628px) and (max-width: 767px) {
  .sucathead {
    color: $white;
  }
  .catadjustwidth {
    width: 215%;
  }
}

.bgimg {
  position: relative;
  background-repeat: no-repeat !important;
  background-position: 100% !important;
  background-size: 300px !important;
}

@media screen and (min-width: 628px) and (max-width: 768px) {
  .catadjustwidth {
    width: 310%;
  }
  .brandsmenu a {
    color: $white !important;
  }
  .catcon {
    padding: 0px;
  }
  .catconinner {
    padding: 0px;
  }
}
