.woocs-row {
  //--gutter: 30px;
  //
  //display: flex;
  //flex-wrap: wrap;
  //width: 100%;

  &:not(:last-child) {
    margin-bottom: 1.5rem;
  }

  > .woocs-col-4,
  > .woocs-col-5,
  > .woocs-col-6 {

    @media (min-width: 576px) {
      padding-top: var(--gutter);
      padding-right: calc(var(--gutter) / 2);
      padding-left: calc(var(--gutter) / 2);
    }

  }
}

//@media (min-width: 576px) {
//
//  .woocs-col-4 {
//    max-width: 33.33333%;
//    flex-basis: 33.33333%;
//  }
//
//  .woocs-col-6 {
//    max-width: 50%;
//    flex-basis: 50%;
//  }
//
//}

.woocs-d-flex  { display: flex; }
.woocs-d-block { display: block; }

.woocs-align-items-flex-start { align-items: flex-start; }
.woocs-align-items-flex-end   { align-items: flex-end; }
.woocs-align-items-center     { align-items: center; }
.woocs-align-items-right      { align-items: flex-end; }
.woocs-align-self-end         { align-self: flex-end; }
.woocs-justify-between        { justify-content: space-between; }
.woocs-justify-start          { justify-content: flex-start; }
.woocs-flex-column            { flex-direction: column; }
.woocs-flex-row               { flex-direction: row; }
.woocs-d-flex .woocs-flex-1   { flex: 1; }
.woocs-flex-grow              {
  flex-grow: 1;

  > input {
    &:not(:last-child) {
      margin-bottom: 5px;
    }
  }
}

.woocs-flex-with-margin {

  > .woocs__item {
    margin: 0 10px;
  }

}

.woocs-h1, .woocs-h2, .woocs-h3, .woocs-h4, .woocs-h5, .woocs-h6 {
  margin-bottom: 1rem;
  font-family: $general-font-family;
  line-height: 1.5;
  font-weight: 600;
}

.woocs-h1, .woocs-h2, .woocs-h3, .woocs-h4, .woocs-h5, .woocs-h6, h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.5;
}

h1, .woocs-h1 { font-size: 42px; }
h2, .woocs-h2 { font-size: 36px; }
h3, .woocs-h3 { font-size: 30px; }
h4, .woocs-h4 { font-size: 24px; }
h5, .woocs-h5 { font-size: 20px; }
h6, .woocs-h6 { font-size: 16px; }

.woocs-h5 {
  font-size: 1.25rem;

  @media (max-width: 767px) {
    font-size: 1rem;
  }

  a {
    text-decoration: none;
  }
}

.woocs-list-unstyled {
  padding-left: 0;
  list-style: none;

  &:not(:last-child) {
    margin-bottom: 1rem;
  }

  > li {
    margin-top: .3rem;
    margin-bottom: .3rem;
    line-height: 1.6;
  }

  a {
    vertical-align: middle;
    color: #3c4858;

    &:hover {
      color: #2f55d4;
    }
  }
}

.woocs-text-decoration-underline {
  text-decoration: underline;
}

a.woocs-text-danger  { color: #e43f52; }
.woocs-text-muted    { color: #8492a6; }
.woocs-text-dark     { color: #3c4858; }
.woocs-text-primary  { color: #2f55d4; }
.woocs-bg-white      { background-color: #fff; }
.woocs-bg-light      { background-color: #f8f9fc; }

.woocs-rounded       { border-radius: $border-radius; }
.woocs-rounded-circle { border-radius: 50%; }
.woocs-border        { border: 1px solid rgb(60 72 88 / 15%); }
.woocs-border-top    { border-top: 1px solid #e9ecef; }
.woocs-border-bottom { border-bottom: 1px solid rgb(60 72 88 / 15%); }
.woocs-border-0      { border: none; }
.woocs-shadow        { box-shadow: 0 0 3px rgb(60 72 88 / 15%); }
.woocs-transition    {
  transition: all 0.5s ease;

  &:hover {
    transform: translateY(-10px);
    box-shadow: 0 0 3px rgb(60 72 88 / 15%);
  }
}

/* Aligns */

.woocs-text-left   { text-align: left; }
.woocs-text-center { text-align: center; }
.woocs-text-right  { text-align: right; }

/* Margins and paddings */

.woocs-p-1 { padding: .25rem; }
.woocs-p-2 { padding: .5rem; }
.woocs-p-3 { padding: 1rem;  }
.woocs-p-4 { padding: 1.5rem; }

.woocs-pt-2 { padding-top: .5rem; }
.woocs-pt-3 { padding-top: 1rem; }

.woocs-mb-0 { margin-bottom: 0; }
.woocs-mb-1 { margin-bottom: .25rem; }
.woocs-mb-2 { margin-bottom: .5rem; }
.woocs-mb-3 { margin-bottom: 1rem; }
.woocs-mb-4 { margin-bottom: 1.5rem; }

.woocs-ms-1 { margin-left: .25rem; }
.woocs-ms-2 { margin-left: .5rem; }
.woocs-ms-3 { margin-left: 1rem; }
.woocs-ms-4 { margin-left: 1.5rem; }

.woocs-me-1 { margin-right: .25rem; }
.woocs-me-2 { margin-right: .5rem; }
.woocs-me-3 { margin-right: 1rem; }
.woocs-me-4 { margin-right: 1.5rem; }

.woocs-mt-1 { margin-top: .25rem; }
.woocs-mt-2 { margin-top: .5rem; }
.woocs-mt-3 { margin-top: 1rem; }
.woocs-mt-4 { margin-top: 1.5rem; }

/* Icons */

.woocs-key-feature {
  transition: all 0.3s ease;

  &:hover {
    transform: scale(1.05);
    box-shadow: 0 5px 13px rgb(60 72 88 / 20%) !important;
  }

  .woocs-icon {
    height: 45px;
    width: 45px;
    line-height: 45px;
    background: linear-gradient(45deg, transparent, rgba(47, 85, 212, 0.15));
  }

  .woocs-title {
    font-size: 18px;
  }

}

.woocs-features {

  .woocs-icon {
    height: 45px;
    width: 45px;
    line-height: 45px;
  }

  .woocs-title {
    font-size: 18px;
  }

  @media (max-width: 767px) {
    padding: .5rem;
  }

  .woocs-icons {

    i {
      height: 65px;
      width: 65px;
      line-height: 65px;
      background-color: rgba(47, 85, 212, 0.1);
      font-size: 2.35rem;
    }

  }

  p {
    font-size: 14px;
  }

}

.woocs-fea {
  stroke-width: 1.8;
  vertical-align: middle;
  color: #2f55d4;

  &.icon-ex-md {
    height: 20px;
    width: 20px;
  }

  &.woocs-icon-sm {
    height: 16px;
    width: 16px;
    vertical-align: -3px;
  }

}

/* Cards */

.woocs-card-holder {
  display: grid;
  grid-gap: 20px;

  @media (min-width: 576px) {
    &.woocs__col-2 {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (min-width: 576px) {
    &.woocs__col-3 {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (min-width: 1024px) {
    &.woocs__col-3 {
      grid-template-columns: repeat(3, 1fr);
    }
  }

}

.woocs-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  height: 100%;

  .woocs-card-body {
    padding: 1.5rem;
    font-size: 16px;
  }

  .woocs-avatar {
    &.woocs-avatar-small {
      width: 60px;
    }
  }

}