/* MOBILE DEVICES ( <= 678px ) */
.about-main-20 {
   width: 100%;
   height: auto;
   padding-inline: var(--gutter);
   max-width: var(--site-max-width);
}

.about-image-20 {
   overflow: auto;
   position: relative;
   block-size: fit-content;
}

.about-img-20 {
   width: 100%;
   height: auto;
   border: none;
   display: block;
   object-fit: cover;
   object-position: center;
}

.dual-section-20,
.dual-section-21 {
   margin: 0;
   border: none;
   padding-top: 0;
   padding-bottom: 0;
}

.dual-grid-20 {
   display: flex;
   margin-inline: auto;
   flex-direction: row;
   align-items: stretch;
   justify-content: center;
}

.dual-left-column-20 {
   width: 45%;
   align-items: center;
   justify-content: center;
   border-top: 1px solid var(--black);
   border-left: 1px solid var(--black);
   border-right: 1px solid var(--black);
   border-bottom: none;
}

.dual-content-20 {
   padding: 15px;
   position: relative;
   border-bottom: none;
   max-inline-size: 100%;
}

.left-description-20,
.right-description-20 {
   font-size: 10px;
   line-height: 1.1em;
   color: var(--black);
   font-family: 'CenturyReg';
}

.dual-right-column-20 {
   width: 55%;
   height: auto;
   align-items: center;
   justify-content: center;
   border-top: 1px solid var(--black);
   border-left: none;
   border-right: 1px solid var(--black);
   border-bottom: none;
}

.dual-right-image-20,
.dual-left-image-20 {
   overflow: auto;
   position: relative;
   block-size: fit-content;
}

.dual-img-20 {
   width: 100%;
   height: auto;
   border: none;
   display: block;
   max-height: 600px;
   object-fit: cover;
   object-position: center;
}

.dual-left-column-21 {
   width: 55%;
   align-items: center;
   justify-content: center;
   border-top: 1px solid var(--black);
   border-left: 1px solid var(--black);
   border-right: 1px solid var(--black);
   border-bottom: none;
}

.dual-right-column-21 {
   width: 45%;
   position: relative;
   flex-direction: column;
   justify-content: space-between;
   border-top: 1px solid var(--black);
   border-left: none;
   border-right: 1px solid var(--black);
   border-bottom: none;
}

/* DESKTOP DEVICES ( > 678px ) */
@media screen and (min-width: 678px) {
   .about-main-20 {
      padding-inline: var(--gutter-2);
   }

   .dual-content-20 {
      padding: 30px 60px 30px 30px;
   }

   .left-description-20,
   .right-description-20 {
      font-size: 16px;
   }
}