body {
 background-image: url("yarn02.jpg");
 background-size: cover;
 height: 100vh;
 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 font-weight: bold;
 text-align: center;
}

#max-frame {
 max-width: 600px;
 display: inline-block;
}
/* <uniquifier>: Use a unique and descriptive class name
 <weight>: Use a value from 200 to 1000 */
 
 .nunito-font {
   font-family: "Nunito", sans-serif;
   font-optical-sizing: auto;
   font-weight: 500;
   font-style: normal;
 }
h1 {
 background-color: #ffdbce;
 color: #beecea;
 text-shadow: 1px 1px 1px #66927c;
 /*
 background-color: #ffed61bd ;  JS yellow */
 align-content: center;
}

h2 {
 margin: 10px 0px;
}

h3 {
 font-size: 50px;
 margin: 0 0 10px 0;
}

button {
 border: none;
 padding: 10px 0;
 color: white;
 font-weight: bold;
 width: 200px;
 margin: 0 0 5px 0;
 border-radius: 5px;
}

#increment-btn {
 background: #cc7c77;
 text-shadow: 1px 1px 1px #7f7f7f;
}

#save-btn {
 background: #66927c;
 text-shadow: 1px 1px 1px #989898;
}

.soft-text {
 color: #606060e1;
}

.prev-rows {
 display: flex;
 margin: 5px;
}

.prev-rows p {
 margin: 5px;
 min-width: 120px;
}