.threecol { display: flex; flex-wrap: wrap; row-gap: 80px; }
.threecol-box { width: calc(100% / 3); padding: 0 50px; text-align: center; position: relative;}
.threecol-box__above svg { width: 20px; height: auto; fill: #FFF; }
.threecol-box__above { width: 42px; height: 42px; background: #26AA38; display: flex; align-items: center; justify-content: center; border-radius: 4px; margin: 0 auto 40px; z-index: 2; position: relative; }
.threecol-box__above .number { color: #FFF; font-family: RoslindaleCondensed, "sans-serif"; font-size: 1.75rem; line-height: 1em; }
.threecol-box.line:nth-child(3n-2):before { content: ''; position: absolute; height: 3px; width: 100%; top: 20.5px; left: 50%; }
.threecol-box.line:nth-child(3n-1):before { content: ''; position: absolute; height: 3px; width: 100%; top: 20.5px; left: 0; }
.threecol-box.line:nth-child(3n):before { content: ''; position: absolute; height: 3px; width: 100%; top: 20.5px; right: 50%; }
.threecol-box.line.lc-primary:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-secondary:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-oak-green:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-oak-green-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-blooming-green:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-blooming-green-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-sunligt-yellow:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-sunligt-yellow-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-earth-brown:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-earth-brown-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-gray:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-gray-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-light-gray:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-light-gray-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-dark:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-light:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-black:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-black-rgb), var(--bs-bg-opacity)) !important
}

.threecol-box.line.lc-white:before {
    --bs-bg-opacity: 1;
    background: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important
}
@media (max-width: 899px) {
  .threecol-box { padding: 0 20px; }
}

@media (max-width: 699px) {
  .threecol { row-gap: 0; }
  .threecol-box { width: 100%; padding: 0 0 50px 0; text-align: left; }
  .threecol-box.box { padding: 0 0 50px 70px; }
  .threecol-box__above { margin: 0; position: absolute; top: 0; left: 0; }
  .threecol-box.line:nth-child(3n-2):before, .threecol-box.line:nth-child(3n-1):before, .threecol-box.line:nth-child(3n):before  { content: ''; position: absolute; width: 3px; height: 100%; top: 5px; left: 21.5px; right: auto; !important }
  .threecol-box.line:last-child:before { width: 0; height: 0; background: none; }
}