.button-style1 {
  --background-color: #f05a22;
  --background-color-active: #ee5529;
  --light-shadow-color: #ffb147;
  --dark-shadow-color: #d72d12;
  --text-color: #fff;
  display: inline-block;
  position: relative;
  border-radius: 0.5625em;
  height:38px;
  width: 100px;
  background-color: var(--background-color);
  
  
  background-size: 80px 80px;
  box-shadow: inset 0.0625em 0.0625em 0.0625em var(--light-shadow-color), inset -0.0625em -0.0625em 0.0625em var(--dark-shadow-color), 0.125em 0.125em 0.25em #000;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-color);
  transition-property: transform, background-color, box-shadow;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.25, 0.5, 0.5, 1);
}
.button:active .button-style1 {
  transform: scale(0.98);
  background-color: var(--background-color-active);
  box-shadow: inset 0 0 0.25em #000, inset 0.0625em 0.0625em 0.0625em transparent, inset -0.0625em -0.0625em 0.0625em transparent, 0.125em 0.125em 0.25em transparent;
}
.button-style1.dark-gray {
  --background-color: #353535;
  --background-color-active: #313030;
  --light-shadow-color: #a7a7a7;
  --dark-shadow-color: #1c1c1c;
}
.button-style1.white {
  --background-color: #cfcbca;
  --background-color-active: #b9b5b3;
  --light-shadow-color: #fafafa;
  --dark-shadow-color: #646464;
  --text-color: #010101;
}
.button-style1.light-gray {
  --background-color: #bcbcbc;
  --background-color-active: #b1adad;
  --light-shadow-color: #f7f7f7;
  --dark-shadow-color: #646464;
}
.button-style1.gray {
  --background-color: #676767;
  --background-color-active: #575454;
  --light-shadow-color: #b8b7b5;
  --dark-shadow-color: #383838;
}