.product-button {
  display: inline-block;
  color: #FFF !important;
  padding: 0.5rem;
  border-radius: 4px;
  margin-left: 180px;
  margin-top: 2rem;
  margin-bottom: 2rem;
  -webkit-transition: background-color 0.2s ease-in-out,color 0.2s ease-in-out,opacity 0.2s ease-in-out;
  -moz-transition: background-color 0.2s ease-in-out,color 0.2s ease-in-out,opacity 0.2s ease-in-out;
  -o-transition: background-color 0.2s ease-in-out,color 0.2s ease-in-out,opacity 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out,color 0.2s ease-in-out,opacity 0.2s ease-in-out;
}

.product-button:hover {
  text-decoration: none;
}

.add-product {
  background-color: #2996cc;
}

.add-product:hover {
  background-color: #3ba8de;
}

.update-product {
  background-color: #b2aca6;
  margin: 0px;
}

.update-product:hover {
  background-color: #bcb8b5;
}

.remove-product {
  background-color: #d31010;
  margin: 0px;
  margin-left: 1rem;
}

.remove-product:hover {
  background-color: #dd1111;
}

#product-section:not(.show) {
  padding: 1rem;
  margin: 2rem 0 0;
}

#product-section h3 {
  font-size: 1.5rem;
  font-weight: 500;
}

#product-section.show h3 {
  font-size: 1.2rem;
  font-weight: bold;
  padding-left: 0;
  margin-top: 1rem;
  margin-bottom: 0px;
}

#product-section #product-list .product-line {
  display: flex;
  list-style-type: circle;
}

#product-section.show #product-list .product-line {
  margin-left: 0px;
  padding-left: 0px;
  margin-top: 0.5rem;
}

#product-section.show #product-list .product-line:not(:first-of-type) {
  margin-top: 1rem;
}

#product-section #product-list .product-line p {
  display: inline-block;
  margin: 0;
  padding-left: 0;
}

#product-section.show #product-list .product-line p:not(:first-of-type) {
  padding-left: 2rem;
}

#product-section #product-list .product-line p label {
  margin-left: 0px !important;
  margin-right: 1rem;
  width: auto;
}

#product-section.show #product-list .product-line p label {
  font-weight: bold;
  margin-right: 0.5rem;
}

#product-section #product-list .product-line.canceled p span,
#product-section.show #product-list .product-line.canceled p span {
  text-decoration: line-through;
}

#product-section #product-list .product-line span.note {
  display: inline-flex;
  width: 270px;
}

#product-section #product-list .product-line span {
  min-width: 100px;
  display: inline-block;
}

#product-section #product-list .product-line p.operations {
  min-width: 200px;
}
