/* Main button parameters */

/* Default button */
.custom-button {
  padding: 14px 24px;
  border-radius: 8px;
  color: var(--blue1);
  display: inline-block;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: 0.3s ease all;
  position: relative;
}
/* Transparent button */
.custom-button.transparent {
  border: 1px solid var(--blue1);
  color: var(--blue1);
  transition: 0.3s ease all;
}

/* Transparent button (hover) */
.custom-button.transparent:hover {
  color: var(--hoverBlue);
  border: 1px solid var(--hoverBlue);
}

/* Blue button */
.custom-button.blue {
  border: 1px solid var(--blue1);
  background-color: var(--blue1);
  color: var(--white1);
}

/* Blue button (hover) */
.custom-button.blue:hover {
  background-color: var(--hoverBlue);
}

/* White button */
.custom-button.white {
  border: 1px solid var(--white1);
  background-color: var(--white1);
  color: var(--black1);
}

/* White button (hover) */
.custom-button.white:hover {
  background-color: var(--white1);
  border: 1px solid var(--white1);
}
/*  Hide button text on load */
.hidden-text {
  position: relative;
}
.hidden-text.hidden {
  visibility: hidden;
}
@media (max-width:445px) {
  .custom-button {
    padding: 11px 24px;
  }
}
/*TODO add hover effects when exists  */