* {
  box-sizing: border-box;
  margin: 0px;
  padding: 0;
}

body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  justify-items: center;
  align-items: center;

  min-height: 100vh;
  background-color: hsl(216, 47%, 12%);
}

.calculadora {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;

  height: 550px;
  width: 370px;

  border-radius: 20px;
  border: 1px solid #000000ce;
  background-color: hsl(214, 18%, 45%);
  box-shadow: 7px 10px 54px #000000;

  z-index: 1;
}

.visor {
  height: 70px;
  width: 316px;

  padding-top: 5px;
  padding-right: 10px;

  border-radius: 6px;
  border: 3px solid #000000d0;
  background: linear-gradient(#fffffff6, #ffffffe5 50%);

  font-size: 40px;
  font-family: 'Roboto Mono', monospace;
  font-weight: 600;
  text-align: end;
}

.botoes button {
  height: 75px;
  width: 75px;

  margin-top: 5px;

  border-radius: 11px;
  border: 2.5px solid black;

  cursor: pointer;

  font-size: 30px;
  font-family: 'Roboto Mono', monospace;
  font-weight: 800;

  color: #000000;
}

.button-limpar img {
  height: 25px;
  width: 25px;
}

.cor-normal {
  background: linear-gradient(#ffffff, #d3d3d3);
}

.cor-escura {
  background: linear-gradient(#e7e6e6ee, #c7c4c4ad);
}

.cor-diferente {
  background: linear-gradient(#cacffac7, #8e9bd659);
}

footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;

  position: absolute;
  bottom: 0;

  padding-bottom: 5px;

  font-family: 'Times New Roman', Times, serif;
  font-size: 20px;
  color: white;
}

.contatos {
  display: flex;
  gap: 20px;
}

.git {
  height: 30px;
  width: 30px;

  background-image: url('../assets/github-light.svg');
  background-repeat: no-repeat;
  background-size: 30px;
}

.linkedin {
  height: 30px;
  width: 30px;

  background-image: url('../assets/linkedin-light.svg');
  background-repeat: no-repeat;
  background-size: 30px;
}

.twitter {
  height: 30px;
  width: 30px;

  background-image: url('../assets/twitter-light.svg');
  background-repeat: no-repeat;
  background-size: 30px;
}
