#content-box {
    background-image: radial-gradient(var(--abyss-light), var(--abyss));
    min-height: 100vh;
    padding: 0rem;
}

.main.stack {
    gap: 1rem;
    width: 90%;
}

h1, h2 {
    font-size: var(--base-font-size);
    font-weight: normal;
    margin: unset;
}

.service-icon {
    width: 16px;
    height: 16px;
}

.service-description {
    margin-bottom: 1rem;
}

.stack-or-shelf {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    align-items: center;
    margin: 3rem auto 6rem auto;
}

.button.contract:link,
.button.contract:visited {
    border-color: var(--green);
    color: var(--green);
    text-align: center;
}

.button.contract:active,
.button.contract:focus,
.button.contract:hover {
    background-color: var(--green);
    border-color: var(--green);
    color: var(--background-color);
    text-align: center;
}

.icon.button:link,
.icon.button:visited {
    border-style: none;
    opacity: 0.8;
    padding: 0rem;
}

.icon.button:active,
.icon.button:focus,
.icon.button:hover {
    opacity: 1;
}

.icon.button img {
    border-radius: var(--border-radius);
    height: 100px;
    width: 100px;
}

.process {
    background-image: url("../img/phase-connector.svg");
    background-position: 5px;
    background-repeat: repeat-y;
}

.phase {
    background-image: url("../img/phase-circle.svg");
    background-position: top left;
    background-repeat: no-repeat;
    padding-left: 1.5rem;
}

.products {
    color: #7191A0;
}

.products ul {
    padding-left: 1rem;
}

.work.grid {
    gap: 1rem;
}


@media screen and (min-width: 1160px) {
    .stack-or-shelf {
        flex-direction: row;
        justify-content: center;
        align-items: initial;
    }
    .main.stack {
        max-width: 400px;
    }
}