/* list — generated by scripts/split-css.mjs from style.css. Do not edit by hand. */
.list-component {
    padding-top: 96px;
    padding-bottom: 80px;
    /*modify right column so image is last on mobile and first on desktop*/
    /*mobile/tablet - add spacing for all list items apart from the first ONE */
    /*desktop - add spacing apart from the first TWO */
}

@media (min-width: 768px) {
  .list-component {
        padding-top: 116px;
        padding-bottom: 100px;
    }
}

.list-component p {
    padding-bottom: 12px;
    padding-right: 12%;
}

@media (min-width: 768px) {
  .list-component p {
        padding-right: 20%;
    }
}

.list-component > div {
    grid-column: span 4;
    text-align: left;
    display: flex;
    flex-direction: column;
}

@media only screen and (max-width: 1023px) and (min-width: 768px) {
  .list-component > div {
        grid-column: 2/span 6;
    }
}

.list-component > div:nth-of-type(even) > img {
    order: 99;
}

@media only screen and (min-width: 1024px) {
  .list-component > div:nth-of-type(odd) {
        grid-column: 1/span 6;
        margin-right: 27px;
    }
  .list-component > div:nth-of-type(even) {
        grid-column: 7/span 6;
        margin-left: 27px;
    }
  .list-component > div:nth-of-type(even) > img {
            order: -1;
        }
  .list-component > div:nth-of-type(even) h3 {
            padding-top: 30px;
        }
}

@media (max-width: 1023px) {
  .list-component > div:not(:nth-of-type(-n+1)) {
        padding-top: 62px;
    }
}

@media only screen and (min-width: 1024px) {
  .list-component > div:not(:nth-of-type(-n+2)) {
        padding-top: 90px;
    }
}