/* STYLING ABOUT OUR PRODUCTS ARTICLE */

.about-products__boxes-container {
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 48% 48%;
  grid-column-gap: 4%;
  margin-top: 12px;
}
.about-products__h1 {
  margin-bottom: 12px;
  padding-top: 10px;
}
.about-products__h3 {
  font-size: 16px;
  margin-bottom: 1em;
}
.about-products__h3--bold {
  font-weight: bold;
  color: #007ab0;
}
.about-products__h4 {
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 1em;
}
.about-products__p {
  font-size: 13px;
}
.about-products__p--margin-top {
  margin-top: 0.7em;
}
.about-products__summary {
  font-size: 14px;
  margin: 0px 0;
  padding: 6px 0;
}
.fa-chevron-right {
  display: none;
}
.about-products__table {
  width: 100%;
}
.about-products__th {
  background-color: #007ab0;
  color: white;
  font-size: 16px;
  padding: 8px;
  text-align: left;
  border: 1px solid #007ab0;
}
.about-products__td {
  border: 1px solid #cccccc;
  padding: 0 0.7em 0.7em 0.7em;
  background-color: #ffffff;
  font-size: 13px;
}
.about-products__td--bold {
  font-weight: bold;
}
.about-products__td--wide {
  width: 55%;
}
.about-products__p--light {
  color: rgb(157, 154, 154);
}
.about-products__p--bold {
  font-weight: bold;
}
em {
  font-style: normal;
}
.about-products__p-link {
  color: #0098d4;
  text-decoration: none;
}
.about-products__p-link:hover {
  text-decoration: underline;
}

/* INSTEAD OF DETAILS/SUMMARY TAGS */

.button-summary, .button-summary-two {
  display: flex;
  align-items: baseline;
  cursor: pointer;
  margin-top: 10px;
}
.about-products__arrow, .about-products__arrow--two {
  display: inline-block;
  font-size: 13px !important;
  margin: 0 5px 0 0;
  width: 6.5px;
}
.rotate {
  transform: rotate(270deg);
}
.about-products__h6, .about-products__h6--two {
  font-size: 13px;
}
.about-products__extra-content, .about-products__extra-content--two {
  display: block;
}
.about-products__extra-content--none {
  display: none;
}


/* ANIMATIONS FOR DETAILS & SUMMARY */

details[open] summary ~ * {
  animation: sweep .6s ease-in-out;
}
@keyframes sweep {
  0%    {opacity: 0; margin-top: -20px}
  100%  {opacity: 1; margin-top: 0px}
}
@keyframes sweepTwo {
  0%    {position: relative; opacity: 0; top: 0px}
  100%  {position: relative; opacity: 1; top: 410px}
}
@keyframes sweepThree {
  0%    {position: relative; opacity: 0; top: 0px}
  100%  {position: relative; opacity: 1; top: 210px}
}


/* MEDIA QUERIES FOR ABOUT PRODUCTS ARTICLE */

@media (max-width: 1190px) {
  .about-products__boxes-container {
    grid-template-columns: 48% 48%;
    grid-template-rows: auto;
    grid-column-gap: 2em;
    grid-row-gap: 2em;
  }
  .about-products__table-section {
    grid-column: 1 / span 2;
    justify-self: center;
    width: 80%;
  }
  .about-products__table {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .about-products__boxes-container {
    display: flex;
    flex-direction: column;
  }
  .about-products__table-section {
    order: -1;
    margin: 0 auto 30px auto;
  }
}
@media (max-width: 650px) {
  .about-products__table-section {
    width: 100%;
  }
}
@media (max-width: 425px) {
  .about-products__th {
    padding: 0.5em;
  }
  .about-products__td {
    padding: 0 0.4em 0.4em 0.4em;
    line-height: 1.4;
  }
  .about-products__summary {
    margin: 0.5em 0;
  }
}
