body {
min-height:100vh;
max-width: 900px;
min-width: 320px;
margin:auto;
}

div {
padding-left:10px;
padding-right:10px;
text-align:center;
word-wrap: normal;
white-space: normal;
}

#bannerimg {
padding-top:50px;
max-width: 100%;
height:100%;
}

#menu {
font-family:'Liberation Serif';
font-size:30px;
font-weight:bold;
padding-bottom:10px;
white-space: nowrap;
display:flex;
justify-content:space-between;
}

#menu li{
display: inline-block;
}

#menu a {
display: block;
padding-left:20px;
padding-right:20px;
text-decoration:none;
text-align:center;
float:left;
color: #000000;
}

#menu a:hover {
background-color:yellow;
}

#sidebarbutton {
  width: 130px;
  position: fixed;
  z-index: 1;
  top: 0px !important;
  left: 0px !important;
  overflow-x: hidden;
}

#sidebar {
  width: 130px;
  position: fixed;
  z-index: 1;
  top: 50px;
  background-color: white;
  overflow-x: hidden;
  transition: 0.5s;
}

#sidebar a {
  padding: 5px 5px 5px 5px;
  text-decoration: none;
  font-family: "Liberation Serif";
  font-size: 24px; 
  font-weight:bold ;
  color: #000000;
  display: block;
  transition: 0.5s;
}

#sidebar a:hover {
  background-color: yellow;
}

#hyperlink {
text-align:center;
padding-top:20px;
padding-bottom:20px;
font-family:'Liberation Serif';
font-size:20px;
font-weight:bold ;
text-decoration:underline;
}

@media screen and (min-width:660px) {
#menu {display: block;
}
#sidebarbutton {display: none;
}
}

#headingtext {
text-align:left;
font-family:'Liberation Serif';
font-size:30px;
font-weight:bold;
text-decoration:underline;
}

#bodytext {
text-align:left;
font-family:'Liberation Serif';
font-size:26px;
line-height:140%;
}

#listtext {
text-align:left;
list-style-position: outside;
list-style-type: square;
font-family:'Liberation Serif';
font-size:26px;
line-height:140%;
}
footer {
text-align: center;
font-size:18px;
padding: 20px;
color: white;
background-color: #222222;
}
<!--CART-->
#cart-wrap * {
  font-family: 'Liberation Serif';
  box-sizing: border-box;
}
#cart-wrap {
  display: flex;
  margin: 0 auto;
  max-width: 900px;
}
#cart-products, #cart-items { padding: 10px; }
#cart-products { flex-grow: 1; }
#cart-items { width: 180px; }
input.cart, button.cart {
  padding: 10px;
  border: 0;
  background: #ff4316;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

#cart-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 10px;
}
.p-item {
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
  text-align: center;
}
.p-img { max-width: 150px; }
.p-name, .p-price { font-weight: 700; }
.p-name, .p-desc, .p-price { margin: 5px 0; }
.p-name {
  font-size: 26px;
  text-transform: uppercase;
}
.p-desc {
  color: #7c7979;
  font-size: 24px;
}
.p-price { 
  color: #e13d16; 
  font-size: 24px;
}
.p-add { width: 100%; }

#cart-items {
  background: #222222;
  color: #fff;
  border-radius: 5px;
}
.c-item {
  padding: 10px 0;
  display: flex;
  flex-wrap: wrap;
}
.c-name, .c-total {
  font-size: 20px;
  font-weight: 700;
}
.c-name, button.c-empty, button.c-checkout { width: 100%; margin-bottom: 10px; }
.c-total { margin-top: 10px; padding-right: 10px; margin-right:10px }
button.c-empty, button.c-checkout { margin-top: 10px;}
.c-del { width: 25%; }
.c-qty { width: 60%; }
.c-empty, .c-checkout { width: 100%; }

/* (D) RESPONSIVE */
@media screen and (max-width: 640px) {
  #cart-products {
    grid-template-columns: 100%;
  }
}