style.css

.calculadora-seccion, .tabla-masas{
  display:flex;
  gap: 2em;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 1em;
}

.card{ 
  
  background-color: #fff;
  padding:0 2em 2em 2em;

}

body{ 
  padding: 2em;
  background-color: #18ab29;

}

h1{
  font-size: 40px; 
  color: #247300;
  font-family: 'DM Sans', sans-serif;
  }

h2{
  font-size: 32px; 
  color: #247300;
  font-family: 'DM Sans', sans-serif;
  }

p, label, tr,th, input{
  font-size: 16px;
  line-height: 1.2em;
  font-family: 'Inter', sans-serif;

  }
  .btn {
    background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
    background-color:#44c767;
    border-radius:42px;
    border:1px solid #18ab29;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    padding:1em 2em;
    text-decoration: none;
    margin: 10px;
  }
  .btn:hover {
    background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%);
    background-color:#5cbf2a;
  }
  .btn:active {
    position:relative;
    top:1px;
  }

  #compuesto { 
    border-color:#cccccc; 
    border-style:solid; 
    padding: 1em; 
    font-size:16px; 
    border-radius:18px;  
    width: 60%;
    resize: vertical;
  
  }
  #compuesto:focus { outline:none; } 

#tabla{
  margin: 0 auto;
  border-collapse: collapse;
  border-width: 2px;
  border-color: #338017;
  border-style: solid;
  color: #000000;
  
}


#tabla td,
#tabla th {
  border-width: 2px;
  border-color: #338017;
  border-style: solid;
  padding: 1ch;
  text-align: center;
}

.btn-contact-details {
  color:#18ab29;
  text-shadow: 0.5px 0.5px 0.5px #1f1f1f;
  transition: transform 0.3s ease-out;
  margin-top: 15px;
  margin-right: 20px;
  text-decoration: none;
}