/** {
   border: 1px solid red;
}*/
html, body {
   background-color: #f4f4f4;
}
span {
   line-height: 35px;
}

form {
   width: 25%
}
.display-4 {
   font-size: 40px;
}
h1, p {
   text-align: center;
   padding-bottom: 16px;
}
  .btn.focus {
    box-shadow: none;
  }

  #select {
     margin-bottom: 16px;
 }
  .weight-metric {
     display: none;
  }

  .height-metric {
     display: none;
  }

  .dropdown {
     margin-bottom: 16px;
  }

  .measure, .gender, .goal {
     margin-bottom: 8px;
  }

  .title {
     padding-bottom: 2%;
  }

  .row {
     justify-content: center;
  }

  .container {
     padding-top: 8%;
     display: flex;
     justify-content: center;
  }

h1, .dropdown, .btn-group {
     display: flex;
     justify-content: center;
  }

  .btn-group {
     padding-left: 5px;
     padding-right: 5px;
  }


  @media(max-width: 320px) {
     form {
        width: 45%;
     }
  }
  @media(max-width: 425px) {
     .container{
        padding-top: 5px;
     }
  }



  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .btn.active {
     box-shadow: inset 0 3px 5px rgba(0,0,0,0.25);
  }