.nw-ordergrid-wrapper {
  height: 240px;
  padding: 16px;

  @media screen and (max-width: $screen-max-xs) {
    margin: 0;
    height: auto;
  }
}

.nw-ordergrid-anchor {
  color: $myorder-default-color;
}

.nw-ordergrid-id,
.nw-ordergrid-info {
  &.is-in-progress,
  &.is-initiated {
    color: $myorder-info-initiatecolor;
  }

  &.is-delivered {
    color: $myorder-info-deliveredcolor;
  }

  &.is-cancelled {
    color: $myorder-info-cancelcolor;
  }
}

.nw-ordergrid-status {
  &.is-in-progress {
    color: $myorder-status-inprogress;
  }

  &.is-initiated {
    color: $myorder-status-initiated;
  }

  &.is-delivered {
    color: $myorder-status-delivered;
  }

  &.is-cancelled {
    color: $myorder-status-cancelled;
  }
}

.nw-order-sectionleft {
  @media screen and (min-width: $screen-min-sm) {
    margin-right: 20px;
  }
}

.nw-order-sectionright {
  @media screen and (min-width: $screen-min-sm) {
    margin-left: 20px;
  }
}

.nw-ordergrid-img {
  max-width: $myorder-img-maxwidth;
}

.nw-ordergrid-content {
  flex-direction: column;
  justify-content: flex-start;
  display: flex;
  padding: 10px 15px;
}

.nw-ordergrid-id {
  margin-bottom: 8px;
  font-size: $font-size-xxs;
  font-style: italic;
  letter-spacing: 0.5px;
}

.nw-ordergrid-status {
  margin-bottom: 8px;
  font-size: $font-size-sm;
  font-weight: 900;
  letter-spacing: 0.6px;
}

.nw-ordergrid-info {
  margin-bottom: 33px;
  font-size: $font-size-xxs;
  letter-spacing: 0.5px;

  @media screen and (max-width: $screen-max-xs) {
    margin-bottom: 40px;
  }
}

.nw-ordergrid-price {
  margin-bottom: 33px;
  font-size: $font-size-xs;
  font-weight: 900;
  letter-spacing: 0.6px;

  @media screen and (max-width: $screen-max-xs) {
    margin-bottom: 40px;
  }
}

.nw-order-button {
  border: 2px solid transparent;
  width: 136px;
  height: 40px;
  padding: 12px;
  font-size: $font-size-xxs;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;

  @media screen and (max-width: $screen-max-xs) {
    height: 0;
    padding: 15px 0;
    background: $transparent;
    text-align: left;
    color: $myorder-btntxt-color;
  }
}

.nw-ordergrid-carousel {
  overflow: hidden;
  margin: 10px 0 auto;
  height: 0;
  padding-bottom: $myorder-carousel-height;
  white-space: nowrap;
}

.nw-ordergrid-carouselbtn {
  position: absolute;
  z-index: 1;
  top: 0;
  border: 0;
  width: 40px;
  height: 100%;
  font-size: $myorder-btn-fontsize;
}

.nw-ordergrid-dotswrapper {
  margin: 5px 0;
  font-size: $myorder-pagination-font-size;
  text-align: center;
}

.nw-ordergrid-carouselimg {
  display: inline-block;
  width: 100%;
  vertical-align: top;
}

.nw-ordergrid-carouselbtnprev {
  left: 0;
}

.nw-ordergrid-carouselbtnnext {
  right: 0;
}

.nw-ordergrid-carouselbtnicon {
  font-weight: 600;
}