@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@600&display=swap');



/* ############################################################### */

.buttons-group {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  row-gap: 15px;
  align-items: center;
  justify-content: space-evenly;
}

input[type="submit"] {
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: bold;
  letter-spacing: 4px;
  /* background-color: #001510; */
  background-color: #25252A;
  width: 300px;
  height: 40px;
  border: none;
  color: white;
  border-radius: 4px;
  transition: ease-out 0.3s;
  font-size: 20px;
  outline: none;
  border: 3px solid #434c3e;
  position: relative;
  z-index: 1;
}

input:focus {
  outline: none;
}

input.btn-evaluate {
  /* background-image: linear-gradient(0, #0A3D5B, #0A3D5B); */
  background-image: linear-gradient(0, #27ae60, #27ae60);
  background-size: 0;
  transition: .8s;
  background-repeat: no-repeat;
  background-position: bottom;
  /* transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); */
  transition: 0.5s all ease;
}

input.btn-evaluate:hover {
  background-size: 100%;
  color: #fff;
}
/* ############################################################### */


input[type="button"] {
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: bold;
  letter-spacing: 4px;
  /* background-color: #001510; */
  background-color: #25252A;
  width: 200px;
  height: 40px;
  border: none;
  color: white;
  border-radius: 4px;
  transition: ease-out 0.3s;
  font-size: 20px;
  outline: none;
  border: 3px solid #434c3e;
  position: relative;
  z-index: 1;
}

input.btn-reset {
  background-image: linear-gradient(0, #358aba, #358aba);
  /* background-image: linear-gradient(0, #0A3D5B, #0A3D5B); */
  /* background-image: linear-gradient(0, #27ae60, #27ae60); */
  background-size: 0;
  transition: .8s;
  background-repeat: no-repeat;
  background-position: bottom;
  /* transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); */
  transition: 0.5s all ease;
}

input.btn-reset:hover {
  background-size: 100%;
  color: #fff;
}