input,
button,
textarea,
select {
     width: 100%;
     padding: 10px;
     margin: 10px 0;
     border-radius: 5px;
     border: 2px solid #ddd3;
     background-color: #CCC;
     box-sizing: border-box;
     font-size: 20px;
}

button {
     background-color: rgb(255 216 144 / 84%);
     color: white;
     cursor: pointer;
}

.goal-item {
  float: left;
  margin: 10px;
}

.daily-goals {
     display: flow-root inline;
}

.goal-item button {
  width: auto;
}

table {
     width: 100%;
     border-collapse: collapse;
     margin-top: 20px;
}

th,
td {
     text-align: left;
     padding: 8px;
     border-bottom: 1px solid #a0a18480;
}

th {
     background-color: #cccfb857;
}

.totals,
.totals24 {
     margin-top: 15px;
     font-size: 20px;
}

.total-item {
     margin-bottom: 10px;
}



.goal-reached {
     background-color: rgb(255, 0, 0);
     color: white;
}

.halfway-there {
     background-color: rgb(255, 238, 0);
}

 body {
      margin: 0;
      height: 100vh;
      background: #111;
      display: flex;
      justify-content: center;
      align-items: center;
    }

.circle-button {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     background: #00bcd4;
     border: none;
     z-index: 2;
     position: relative;
     cursor: pointer;
     box-shadow: 0 0 15px rgba(0, 188, 212, 0.5);
}

.vibrating-orbit {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     pointer-events: none;
     z-index: 1;
}

.vibrating-orbit path {
     fill: #fff4;
     stroke: #00bcd4;
     stroke-width: 10;
     stroke-dasharray: 10;
     animation: vibrate-path 2.5s infinite;
}

@keyframes vibrate-path {
     0% {
     stroke-dashoffset: 0;
     }
     100% {
     stroke-dashoffset: -20;
     }
}


#macro-actions-row button {
     margin: 0 5px;
     font-size: 18px;
     border: none;
     width: 30%;
}

.eatingHistoryMem {
     float: left;
     height: 30px;
     width: 20%;
     font-size: 15px;
     margin-left: 10px;
     padding: 0;
     margin-top: 15px;
}

button.subtle {
     background-color: rgb(229 226 150 / 33%);
     color: rgb(82, 79, 79);

     cursor: pointer;
     margin: auto;
     width: 31%;
     margin-left: 1%;
}

#showMoreHistoryDiv {
     margin-top: 15px;
}