html {
  font: 100%/1.15 sans-serif;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  max-width: 60rem;
  font-family: sans-serif;
  padding: 0 3.5%;
  padding: 1.2rem;
  background-color: #fffd60;
  padding: 2rem;
  margin: 0 auto;
}

/* responsive img */
img {
  width: auto;
  max-width: 100%;
  height: auto;
}

/* links */
a {
  color: green;
}

a:hover {
  color: olive;
}

a:focus,
a:active {
  color: blue;
}

/* lists */
dl,
ol,
ul {
  margin-top: 0;
  margin-bottom: 0;
}

dd {
  margin-left: 0;
}

ol,
ul {
  padding-left: 1.4rem;
}

/* navigation/menu keep box order in css */
nav {
  padding: 1rem;
  border: 1px solid #000;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

nav ul {
  list-style: none;
  padding-left: 0;
}

nav li {
  margin-top: 1rem;
}

nav li:first-child {
  margin-top: 0;
}

/* recipe lists */
.info dt {
  margin-top: 1rem;
}
.info dd {
  margin-top: .5rem;
}

.list {
  list-style-position: inside;
  padding-left: 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #000;
}

.list li {
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-top: 1px dashed #000;
}

.list li:first-child {
  border-top:0;
}

.more li {
  padding-top: 0rem;
  padding-bottom: 1rem;
}

/* type details */
.fractions {
  font-size: 125%;
  line-height: 1;
  vertical-align: middle;
}

/* breakpoint for wider width layout */

@media (min-width: 60em) {

  body {
    font-size: 125%;
  }


}