canvas {
  display: block;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: 'Poppins';
  background-color: #1b7059;
}

canvas {
  display: flex;
}

button {
  padding:1%;
  font-family: 'Poppins';
  border-radius: 10px;
  margin: 0px;
  background-color: #212d3a;
  border-style: hidden;
  font-weight: bold;
  color: white;
  font-size:15px;
  width:100px;
}

button:hover {
  padding:1%;
  font-family: 'Poppins';
  border-radius: 10px;
  background-color: #39495a;
  border-style: hidden;
  font-weight: bold;
}

input{
  padding-left:0px;
  padding-right:0px;
  padding-top: 10px;
  padding-bottom:10px;
  margin:0px;
  width:300px;
  text-align:center;
  font-family: 'Poppins';
  border-radius: 10px;
  font-size: 20px;
  color: #1b7059;
  border-style: hidden;
  font-weight: bold;
}

input:hover{
  background-color: #dddddd;
}

@font-face {
    font-family: 'Poppins';
    src: url("assets/fonts/poppins.ttf");
}

@font-face {
    font-family: 'Poppins';
    src: url("assets/fonts/bold-poppins.ttf");
    font-weight: bold;
}

@font-face {
    font-family: 'Poppins';
    src: url("assets/fonts/italic-poppins.ttf");
    font-style: italic;
}