.btn-blue-outline {
  background:
      linear-gradient(#fff, #fff) padding-box,
      linear-gradient(90deg, rgba(2, 126, 255, 1), rgba(59, 188, 255, 1)) border-box;
  padding: 7px 30px;
  border: 2px solid transparent;
  border-radius: 25px;
  display: inline-block;
  color: var(--black);
}
.btn-blue-outline:hover{
    background: linear-gradient(90deg, rgba(2, 126, 255, 1), rgba(59, 188, 255, 1)) border-box;
    padding: 7px 30px;
    border: 2px solid transparent;
    border-radius: 25px;
    display: inline-block;
    color: var(--white);
}

.btn-white-bg {
  border-radius: 25px;
  padding: 7px 24px;
  background-color: var(--white);
  border: 1px solid var(--light-gary1);
}

.btn-bg-blue {
  background:  linear-gradient(90deg, rgba(2, 126, 255, 1), rgba(59, 188, 255, 1)) border-box;
  padding: 7px 30px;
  border: 2px solid transparent;
  border-radius: 25px;
  display: inline-block;
  color: var(--white);
}
.btn-bg-blue:hover {
    background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, rgba(2, 126, 255, 1), rgba(59, 188, 255, 1)) border-box;
    padding: 7px 30px;
    border: 2px solid transparent;
    border-radius: 25px;
    display: inline-block;
    color: var(--black);
}

.btn-bg-green {
  background: var(--green-gradient);
  padding: 7px 24px;
  border: 2px solid transparent;
  color: var(--white);
  border-radius: 25px;
}

.btn-green-outline {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(90deg, #32AA7C 0%, #11744E 100%) border-box;
    padding: 7px 24px;
    border: 2px solid transparent;
    border-radius: 25px;
    display: inline-block;
    color: var(--black);
  }

.btn-green-outline:hover {
  background: var(--green-gradient);
  padding: 7px 24px;
  border: 2px solid var(--green);
  color: var(--white);
  border-radius: 25px;
}

.btn-bg-green:hover {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(90deg, #32AA7C 0%, #11744E 100%) border-box;
    padding: 7px 24px;
    border: 2px solid transparent;
    border-radius: 25px;
    display: inline-block;
    color: var(--black) !important;
  }

  .btn-bg-green-theme {
    background: var(--green-gradient);
    padding: 7px 24px;
    border: 2px solid transparent;
    color: var(--white);
    border-radius: 25px;
  }
  
  .btn-bg-green-theme:hover {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(90deg, #32AA7C 0%, #11744E 100%) border-box;
    padding: 7px 24px;
    border: 2px solid #32AA7C;
    border-radius: 25px;
    display: inline-block;
    color: var(--black) !important;
  }


  @media (min-width:992px) and (max-width:1024px) {
    .btn-bg-blue {
        padding: 7px 10px;        
    }
  }